Skip to content
This repository was archived by the owner on Jun 15, 2022. It is now read-only.

useTypedController.d.ts does not account for passing of refsΒ #28

@damienteo

Description

@damienteo

Under useTypedController.d.ts:

  render?: ((props: {
        onChange: (...event: any[]) => void;
        onBlur: () => void;
        value: import("./types").DeepPathValue<UFieldValues, TFieldName>;
    }) 

Only onChange, onBlur, and value are allowed to be passed as props

The issue comes due to the issue: react-hook-form/react-hook-form#3411

I am attempting to render MUI TextInput in TypedController.

           <TypedController
             name="price_ceil"
             defaultValue=""
             render={(props) => (
               <TextInput
                 label="When the price has risen to"
                 variant="outlined"
                 type="number"
                 inputProps={{
                   'data-testid': 'Min-Price-Input',
                 }}
                 error={!!errors.price_ceil}
                 helperText={errors.price_ceil?.message}
                 {...props}
               />
             )}
           />

However, I am receiving the warning that Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?.
The fix is to pass a ref to InputRef when rendering TextInput.

However, due to the typing in useTypedController, I get the typing error Property 'ref' does not exist on type '{ onChange: (...event: any[]) => void; onBlur: () => void; value: string | number | undefined; }'.

Will there be any issues with passing ref as well in the render for TypedController?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions