"content": "import type * as React from 'react';\nimport {\n Controller,\n type ControllerProps,\n type FieldPathValue,\n type FieldValues,\n type Path,\n type RegisterOptions,\n useFormContext,\n} from 'react-hook-form';\nimport { Select, type SelectProps } from '../ui/Select';\n\nexport type ControlledSelectProps<T extends FieldValues> = SelectProps &\n Omit<ControllerProps, 'render'> & {\n name: Path<T>;\n onBlur?: () => void;\n onChange?: (value: unknown) => void;\n } & (\n | {\n options: { label: React.ReactNode; value: FieldPathValue<T, Path<T>> }[];\n children?: never;\n }\n | {\n options?: never;\n children: React.ReactNode;\n }\n );\n\nexport const ControlledSelect = <T extends FieldValues>({\n name,\n rules,\n children,\n options,\n onChange,\n onBlur,\n ...props\n}: ControlledSelectProps<T>) => {\n const { control } = useFormContext<T>();\n return (\n <Controller<T>\n control={control}\n name={name}\n rules={rules as Omit<RegisterOptions<T, Path<T>>, 'disabled' | 'valueAsNumber' | 'valueAsDate' | 'setValueAs'>}\n render={({ field }) => {\n const handleChange = (value: unknown) => {\n if (typeof onChange === 'function') onChange(value);\n field.onChange(value);\n };\n\n if (options) {\n return (\n <Select {...({ ...field, ...props, onValueChange: handleChange } as SelectProps)}>\n <Select.Trigger>\n <Select.Value />\n </Select.Trigger>\n <Select.Content>\n {options.map((option) => (\n <Select.Item key={option.value} value={option.value}>\n {option.label}\n </Select.Item>\n ))}\n </Select.Content>\n </Select>\n );\n }\n\n return <Select {...({ ...field, ...props, onValueChange: handleChange } as SelectProps)}>{children}</Select>;\n }}\n />\n );\n};\n\n"
0 commit comments