From eb459cc248a5940a14193b20d263ffee3d345026 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Thu, 16 Dec 2021 13:40:12 +0100
Subject: chore: create contact page

---
 src/components/Form/Input/Input.tsx | 47 +++++++++++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)
 create mode 100644 src/components/Form/Input/Input.tsx

(limited to 'src/components/Form/Input/Input.tsx')

diff --git a/src/components/Form/Input/Input.tsx b/src/components/Form/Input/Input.tsx
new file mode 100644
index 0000000..901b9ab
--- /dev/null
+++ b/src/components/Form/Input/Input.tsx
@@ -0,0 +1,47 @@
+import { ChangeEvent, SetStateAction } from 'react';
+import styles from '../Form.module.scss';
+
+type InputType = 'text' | 'number';
+
+const Input = ({
+  id,
+  name,
+  value,
+  setValue,
+  type = 'text',
+  required = false,
+  label,
+}: {
+  id: string;
+  name: string;
+  value: string;
+  setValue: (value: SetStateAction<string>) => void;
+  type?: InputType;
+  required?: boolean;
+  label?: string;
+}) => {
+  const updateValue = (e: ChangeEvent<HTMLInputElement>) => {
+    setValue(e.target.value);
+  };
+
+  return (
+    <>
+      {label && (
+        <label htmlFor={id} className={styles.label}>
+          {label}
+          {required && <span> *</span>}
+        </label>
+      )}
+      <input
+        type={type}
+        id={id}
+        name={name}
+        value={value}
+        onChange={updateValue}
+        className={styles.field}
+      />
+    </>
+  );
+};
+
+export default Input;
-- 
cgit v1.2.3

