From 43cdb7607d9423109758334155acfe844eab6ea5 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Mon, 20 Dec 2021 19:06:49 +0100
Subject: chore: define search form visibility

---
 src/components/Form/Input/Input.tsx | 44 ++++++++++++++++++++-----------------
 1 file changed, 24 insertions(+), 20 deletions(-)

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

diff --git a/src/components/Form/Input/Input.tsx b/src/components/Form/Input/Input.tsx
index 901b9ab..2ee214b 100644
--- a/src/components/Form/Input/Input.tsx
+++ b/src/components/Form/Input/Input.tsx
@@ -1,25 +1,28 @@
-import { ChangeEvent, SetStateAction } from 'react';
+import { ChangeEvent, ForwardedRef, forwardRef, SetStateAction } from 'react';
 import styles from '../Form.module.scss';
 
-type InputType = 'text' | 'number';
+type InputType = 'text' | 'number' | 'search';
 
-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 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;
+  },
+  ref: ForwardedRef<HTMLInputElement>
+) => {
   const updateValue = (e: ChangeEvent<HTMLInputElement>) => {
     setValue(e.target.value);
   };
@@ -33,6 +36,7 @@ const Input = ({
         </label>
       )}
       <input
+        ref={ref}
         type={type}
         id={id}
         name={name}
@@ -44,4 +48,4 @@ const Input = ({
   );
 };
 
-export default Input;
+export default forwardRef(Input);
-- 
cgit v1.2.3