#Type 'Control<FormValues, any>' is not assignable to type 'Control<FieldValues>'

2 messages · Page 1 of 1 (latest)

rustic coral
#

Can you help me please ? 🙂
I don't understand how to fix this typescript error (react-hook-form) :

  Types of property '_reset' are incompatible.
    Type 'UseFormReset<FormValues>' is not assignable to type 'UseFormReset<FieldValues>'.
      Types of parameters 'values' and 'values' are incompatible.
        Type 'FieldValues | { [x: string]: any; } | ResetAction<FieldValues> | undefined' is not assignable to type 'FormValues | { fruit?: number | undefined; } | ResetAction<FormValues> | undefined'.
          Type 'ResetAction<FieldValues>' is not assignable to type 'FormValues | { fruit?: number | undefined; } | ResetAction<FormValues> | undefined'.
            Type 'ResetAction<FieldValues>' is not assignable to type 'ResetAction<FormValues>'.
              Type 'FieldValues' is not assignable to type 'FormValues'.ts(2322)
controller.d.ts(24, 5): The expected type comes from property 'control' which is declared here on type 'IntrinsicAttributes & SelectControllerProps<SelectItem, FieldValues>'
(property) control?: Control<FieldValues> | undefined```

type FormValues = {
fruit: number
}

const SelectController = () => {
const form = useForm<FormValues>({
defaultValues: {
fruit: 2
},
});

return <SelectController {...props} name="fruit" control={form.control} />; // Error here
}```

  extends Omit<SelectProps<T>, 'name'>,
  Omit<UseControllerProps<F>, 'defaultValue' | 'shouldUnregister'> {}

const SelectController = <T extends SelectItem, F extends FieldValues>(
  { control, name, rules, children, ...props }: SelectControllerProps<T, F>) => {
  const { field, fieldState } = useController<F>({ name, control, rules });

  return (
    <Select {...props}>
      {children}
    </Select>
  );
};

export default SelectController;```
Version React-kook-form:**7.43.5**
# 
// node_modules/react-hook-form/dist/types/controller.d.ts

export type UseControllerProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = {
    name: TName;
    rules?: Omit<RegisterOptions<TFieldValues, TName>, 'valueAsNumber' | 'valueAsDate' | 'setValueAs' | 'disabled'>;
    shouldUnregister?: boolean;
    defaultValue?: FieldPathValue<TFieldValues, TName>;
    control?: Control<TFieldValues>; // <----------------
    disabled?: boolean;
};

export type FieldValues = Record<string, any>;