diff options
Diffstat (limited to 'src/components/Form/Input')
| -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); | 
