TypeScript definitions for React, the popular JavaScript library for building user interfaces
80
{
"context": "This criteria evaluates the engineer's ability to use React's forwardRef API to create a component that properly forwards refs to an underlying DOM element. The focus is on correct usage of forwardRef, proper TypeScript typing, and ensuring the ref points to the correct element.",
"type": "weighted_checklist",
"checklist": [
{
"name": "forwardRef usage",
"description": "Component is wrapped with React.forwardRef() to enable ref forwarding from parent components",
"max_score": 30
},
{
"name": "Ref forwarding target",
"description": "The forwarded ref is correctly attached to the underlying input element (not a wrapper div or other element) using the ref attribute",
"max_score": 25
},
{
"name": "ForwardRefExoticComponent type",
"description": "Component type is correctly defined as React.ForwardRefExoticComponent with appropriate props and ref types, matching the API specification",
"max_score": 20
},
{
"name": "Props interface extension",
"description": "CustomInputProps interface correctly extends React.InputHTMLAttributes<HTMLInputElement> to inherit all standard input props",
"max_score": 15
},
{
"name": "Ref type parameter",
"description": "The forwardRef generic type parameters are correctly specified with props type and ref type (HTMLInputElement) to ensure type safety",
"max_score": 10
}
]
}Install with Tessl CLI
npx tessl i tessl/npm-types--reactdocs
evals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
scenario-9
scenario-10