first commit

client/src/components/Input.tsx

@@ -0,0 +1,40 @@
+import { useEffect, useState } from "react";
+
+interface InputProps {
+  type?: "text" | "email" | "password";
+  placeholder?: string;
+  autoFocus?: boolean;
+  required?: boolean;
+  handleChange?: (value: string) => void;
+}
+
+function Input({
+  type = "text",
+  placeholder,
+  autoFocus,
+  required,
+  handleChange,
+}: InputProps) {
+  const [value, setValue] = useState<string>("");
+
+  useEffect(() => {
+    if (handleChange) {
+      handleChange(value);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [value]);
+
+  return (
+    <input
+      type={type}
+      placeholder={placeholder}
+      autoFocus={autoFocus}
+      required={required}
+      value={value}
+      onChange={(e) => setValue(e.target.value)}
+      className="px-3 py-2.5 outline-none rounded-lg border border-[#DAE0E5]"
+    />
+  );
+}
+
+export default Input;