From bb6ac4e4a4f15cc6722d139ee7946e1bba96a808 Mon Sep 17 00:00:00 2001
From: abefernan <44572727+abefernan@users.noreply.github.com>
Date: Tue, 13 Jun 2023 15:31:27 +0200
Subject: [PATCH] Base Input off html's input props

---
 components/inputs/Input.tsx | 19 ++++++-------------
 1 file changed, 6 insertions(+), 13 deletions(-)

diff --git a/components/inputs/Input.tsx b/components/inputs/Input.tsx
index b60e750..34c5140 100644
--- a/components/inputs/Input.tsx
+++ b/components/inputs/Input.tsx
@@ -1,20 +1,12 @@
-interface Props {
+import { DetailedHTMLProps, InputHTMLAttributes } from "react";
+
+interface InputProps
+  extends DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> {
   label?: string;
-  type?: string;
-  list?: string;
-  name?: string;
-  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
-  value: number | string | undefined;
-  min?: string | number | undefined;
-  checked?: boolean;
-  onBlur?: (e: React.ChangeEvent<HTMLInputElement>) => void;
-  disabled?: boolean;
   error?: string;
-  placeholder?: string;
-  width?: string;
 }
 
-const Input = (props: Props) => (
+const Input = (props: InputProps) => (
   <div className="text-input">
     <label>{props.label || ""}</label>
     <input
@@ -22,6 +14,7 @@ const Input = (props: Props) => (
       list={props.list}
       name={props.name || "text-input"}
       onChange={props.onChange}
+      onFocus={props.onFocus}
       value={props.value}
       checked={props.checked}
       min={props.type === "datetime-local" ? props.min : undefined}