{"record":{"id":"ccdbc145e6aa7c9a","repo":"mastra-ai/mastra","slug":"usejsonschemaformfield-must-be-used-within-a-jsons","errorCode":null,"errorMessage":"useJSONSchemaFormField must be used within a JSONSchemaForm.Field","messagePattern":"useJSONSchemaFormField must be used within a JSONSchemaForm\\.Field","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/playground-ui/src/ds/components/JSONSchemaForm/json-schema-form-field-context.tsx","lineNumber":27,"sourceCode":"  remove: () => void;\n}\n\nconst JSONSchemaFormFieldContext = React.createContext<JSONSchemaFormFieldContextValue | null>(null);\n\nexport function JSONSchemaFormFieldProvider({\n  children,\n  value,\n}: {\n  children: React.ReactNode;\n  value: JSONSchemaFormFieldContextValue;\n}) {\n  return <JSONSchemaFormFieldContext.Provider value={value}>{children}</JSONSchemaFormFieldContext.Provider>;\n}\n\nexport function useJSONSchemaFormField(): JSONSchemaFormFieldContextValue {\n  const context = React.useContext(JSONSchemaFormFieldContext);\n  if (!context) {\n    throw new Error('useJSONSchemaFormField must be used within a JSONSchemaForm.Field');\n  }\n  return context;\n}\n","sourceCodeStart":9,"sourceCodeEnd":31,"githubUrl":"https://github.com/mastra-ai/mastra/blob/75dd419e613fe9c39f846ffc500716141b74fda6/packages/playground-ui/src/ds/components/JSONSchemaForm/json-schema-form-field-context.tsx#L9-L31","documentation":"useJSONSchemaFormField exposes the enclosing field's value and mutators (field, update, remove, parentPath, depth) from JSONSchemaFormFieldContext provided by JSONSchemaForm.Field. Outside a Field the context is null and the hook throws, since per-field controls are meaningless without their field scope.","triggerScenarios":"Rendering a field-level control (update/remove buttons, nested field widgets) outside <JSONSchemaForm.Field>; placing such a control directly under Root but not inside any Field; nesting mistakes where a widget intended for a Field is used in the Root's direct children.","commonSituations":"Custom delete/update buttons for a property moved outside the Field wrapper; reusing a field widget inside a different form abstraction that doesn't create Field context; conditional layouts that render the control one level too high in the tree.","solutions":["Place the consumer inside <JSONSchemaForm.Field name={...}>...</JSONSchemaForm.Field>.","If the control needs sibling-level access, pass field/update/remove as props instead of using the hook.","Keep Root > Field > control nesting intact when refactoring layout (Root alone is not enough — this hook needs Field context specifically).","Distinguish the two hooks: use useJSONSchemaForm (Root-level) for form-wide operations, useJSONSchemaFormField only inside a Field."],"exampleFix":"// before\n<Root>\n  <RemoveFieldButton /> {/* needs Field context */}\n</Root>\n// after\n<Root>\n  <Field name=\"title\">\n    <RemoveFieldButton />\n  </Field>\n</Root>","handlingStrategy":"try-catch","validationCode":"// Confirm the consumer is inside a JSONSchemaForm.Field, not just Root:\n// <Root><Field name=\"title\"><MyControl/></Field></Root>\nconst ctx = React.useContext(JSONSchemaFormFieldContext);\nif (!ctx) console.warn('Field-level control must be inside JSONSchemaForm.Field');","typeGuard":"function hasFieldContext(c: JSONSchemaFormFieldContextValue | null): c is JSONSchemaFormFieldContextValue {\n  return c !== null;\n}","tryCatchPattern":"// Hooks can't be caught; guard with an error boundary:\n<ErrorBoundary fallback={<FieldControlsRequireField /> }>\n  <RemoveFieldButton />\n</ErrorBoundary>","preventionTips":["Keep the invariant nesting Root > Field > field control when refactoring layouts.","Use useJSONSchemaForm for form-wide ops; useJSONSchemaFormField only inside a Field.","Pass field/update/remove as props for controls that must render outside a Field.","Add unit tests asserting the nesting renders without throwing."],"tags":["react","context","compound-components","json-schema","playground-ui"],"backgroundTag":"missing-react-context-provider","analyzedSha":"75dd419e613fe9c39f846ffc500716141b74fda6","analyzedAt":"2026-08-30T00:15:31.844Z","schemaVersion":2},"datasetVersion":"2026-08-30T08:17:16.595Z"}