diff options
Diffstat (limited to 'src/components/Form/Input/Input.tsx')
| -rw-r--r-- | src/components/Form/Input/Input.tsx | 44 |
1 files changed, 24 insertions, 20 deletions
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); |
