[X] I have searched the existing issues and my issue is unique
[X] My issue appears in the command-line and not only in the text editor
Description Overview
Lint returns errors for types from react-hook-form
Example of problematic code
import React from 'react'
import { Controller, useForm } from 'react-hook-form'
import { TextField } from '@mui/material'
interface IFormTestProps {
number: number
}
const FormTest = () => {
const { control, register } = useForm<IFormTestProps>({})
return (
<form>
<Controller
name="number"
control={control}
render={(props) => {
console.log(props.field.ref)
return (
<TextField
label="Number"
type="number"
{...register('number')}
onChange={(e) => {
// This is what we want to do
props.field.onChange(parseInt(e.target.value, 10))
}}
/>
)
}}
/>
</form>
)
}
export default FormTest
Lint error
> npm run lint
...
c:\...\FormTest.tsx
17:39 error 'field' is missing in props validation react/prop-types
17:45 error 'field.ref' is missing in props validation react/prop-types
25:39 error 'field' is missing in props validation react/prop-types
25:45 error 'field.onChange' is missing in props validation react/prop-types
Is there an existing issue for this?
Description Overview
Lint returns errors for types from react-hook-form
Example of problematic code
Lint error
I believe these are the relevant dependencies
Expected Behavior
I expected that eslint-plugin-react would detect imported types correctly and not report these errors.
eslint-plugin-react version
v7.34.1
eslint version
v8.57.0
node version
v20.10.0