summaryrefslogtreecommitdiffstats
path: root/src/components/Form/Input/Input.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/Form/Input/Input.tsx')
-rw-r--r--src/components/Form/Input/Input.tsx44
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);