{"record":{"id":"4520859d2d2d01aa","repo":"marmelab/react-admin","slug":"input-components-require-either-a-source-or-a-name","errorCode":null,"errorMessage":"Input components require either a source or a name prop.","messagePattern":"Input components require either a source or a name prop\\.","errorType":"console","errorClass":null,"httpStatus":null,"severity":"warning","filePath":"packages/ra-core/src/form/useInput.ts","lineNumber":51,"sourceCode":"        name,\n        onBlur: initialOnBlur,\n        onChange: initialOnChange,\n        parse: parseProp = defaultParse,\n        source,\n        validate,\n        ...options\n    } = props;\n    const finalSource = useWrappedSource(source);\n    const finalName = name || finalSource;\n    const formGroupName = useFormGroupContext();\n    const formGroups = useFormGroups();\n    const record = useRecordContext();\n    // @ts-ignore\n    const parse = useEvent(parseProp);\n    const defaultId = useId();\n\n    if (!finalName && process.env.NODE_ENV === 'development') {\n        console.warn(\n            'Input components require either a source or a name prop.'\n        );\n    }\n\n    useEffect(() => {\n        if (!formGroups || formGroupName == null) {\n            return;\n        }\n\n        formGroups.registerField(finalSource, formGroupName);\n\n        return () => {\n            formGroups.unregisterField(finalSource, formGroupName);\n        };\n    }, [formGroups, formGroupName, finalSource]);\n\n    const sanitizedValidate = Array.isArray(validate)\n        ? composeValidators(validate)","sourceCodeStart":33,"sourceCodeEnd":69,"githubUrl":"https://github.com/marmelab/react-admin/blob/051f511bb0afb5ea565c2d3728bf4dab0a6fa5e0/packages/ra-core/src/form/useInput.ts#L33-L69","documentation":"useInput resolves the input's identity and form registration from the source (or name) prop. When neither is provided the input cannot be registered with react-hook-form, so in development react-admin warns that the component is misconfigured.","triggerScenarios":"Rendering <TextInput />, <NumberInput />, or any input built on useInput without a source prop (and without name), e.g. <TextInput /> or <TextInput label=\"Name\" />.","commonSituations":"Creating a purely presentational input; forgetting source after renaming a field; dynamically building inputs from config where a field entry lacks a source key; typos like sources.","solutions":["Add the source prop matching the record field, e.g. <TextInput source=\"name\" />.","Pass name if the input is not bound to a record field but must register with the form.","Fix data-driven field lists so every item includes a source before mapping to input components."],"exampleFix":"// before\n<TextInput label=\"Title\" validate={required()} />\n// after\n<TextInput source=\"title\" label=\"Title\" validate={required()} />","handlingStrategy":"type-guard","validationCode":"const renderField = (f) => {\n  if (typeof f.source !== 'string' || f.source.length === 0) {\n    throw new Error(`Input component requires a source; got ${JSON.stringify(f)}`);\n  }\n  return <TextInput source={f.source} />;\n};","typeGuard":"const hasSource = (props) => typeof props?.source === 'string' && props.source.length > 0;\nif (!hasSource(fieldProps) && typeof fieldProps?.name !== 'string') throw new Error('Field needs source or name');","tryCatchPattern":null,"preventionTips":["Always pass source to input components, even for purely local fields (use a name).","Validate dynamically generated field configs to require a source key.","Add a lint rule or unit test that maps over form field definitions."],"tags":["forms","props","react-admin"],"backgroundTag":"missing-required-prop","analyzedSha":"051f511bb0afb5ea565c2d3728bf4dab0a6fa5e0","analyzedAt":"2026-08-30T02:28:14.926Z","schemaVersion":2},"datasetVersion":"2026-08-30T03:17:51.788Z"}