[Bug]: Properties faulty identified as not declared for types in react-hook-form #3741
Open
Description
Is there an existing issue for this?
- I have searched the existing issues and my issue is unique
- 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
I believe these are the relevant dependencies
{
"devDependencies": {
"@types/react": "18.2.79",
"@types/react-dom": "18.2.25",
"@typescript-eslint/eslint-plugin": "7.7.0",
"@typescript-eslint/parser": "7.7.0",
"eslint": "8.57.0",
"eslint-plugin-import": "2.29.1",
"eslint-plugin-react": "7.34.1",
"eslint-plugin-react-hooks": "4.6.0",
"typescript": "5.4.5"
},
"dependencies": {
"@mui/material": "5.15.15",
"react": "18.2.0",
"react-dom": "18.2.0"
},
"scripts": {
"lint": "eslint src --cache --ext .ts,.tsx,.snap"
},
}
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
Activity