33 lines
1.0 KiB
TypeScript
33 lines
1.0 KiB
TypeScript
import { Control, Controller, FieldValues, Path } from 'react-hook-form';
|
|
|
|
import { FormControl, FormItem, FormLabel, FormMessage } from '@/components/ui/form';
|
|
import { Input } from '@/components/ui/input';
|
|
|
|
interface FormFieldProps<T extends FieldValues> {
|
|
control: Control<T>;
|
|
name: Path<T>;
|
|
label: string;
|
|
placeholder?: string;
|
|
type?: 'text' | 'email' | 'password' | 'date';
|
|
}
|
|
|
|
const FormField = <T extends FieldValues>({ control, name, label, placeholder, type = 'text' }: FormFieldProps<T>) => {
|
|
return (
|
|
<Controller
|
|
control={control}
|
|
name={name}
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel className="label">{label}</FormLabel>
|
|
<FormControl>
|
|
<Input className="input" type={type} placeholder={placeholder} {...field} />
|
|
</FormControl>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export default FormField;
|