{
  "name": "SubActionField",
  "package": "@magicblocksai/ui",
  "file": "packages/ui/src/components/SubActionField.tsx",
  "chapterTag": "18 Agent Builder",
  "chapter": "18-agent-builder.html",
  "sectionId": "actions",
  "elName": "Nested sub-actions &amp; Run Task &mdash; <em style=\"font-family:var(--f-serif); font-weight:400;\">recursion + prompt config</em>",
  "demoUrl": "https://brand.magicblocks.ai/components/18-agent-builder#actions",
  "hasLiveDemo": false,
  "description": "Editor for a **nested action** — a button's tap action or a form's submit\naction. A restricted `<ActionPicker>` chooses the sub-action type (seeding\nthe registry's `makeDefault`), then the chosen action's config renders via a\nrecursive `<ActionConfigPanel>`. Because the allow-list excludes\n`add_buttons`, the recursion always terminates.",
  "useClient": true,
  "interactivity": "interactive",
  "namedExports": [
    {
      "name": "SubActionField",
      "isPrincipal": true,
      "isType": false
    },
    {
      "name": "SUB_ACTION_TYPES",
      "isPrincipal": false,
      "isType": false
    },
    {
      "name": "FORM_SUBMIT_ACTIONS",
      "isPrincipal": false,
      "isType": false
    },
    {
      "name": "SubActionFieldProps",
      "isPrincipal": false,
      "isType": true
    }
  ],
  "importStatement": "import { SubActionField } from \"@magicblocksai/ui\";",
  "props": [
    {
      "name": "value",
      "optional": true,
      "type": "Action",
      "doc": "The nested action, or `undefined` when none is set yet."
    },
    {
      "name": "onChange",
      "optional": false,
      "type": "(next: Action | undefined) => void",
      "doc": "Fires with the next action, or `undefined` when cleared."
    },
    {
      "name": "allow",
      "optional": true,
      "type": "readonly ActionType[]",
      "doc": "Allowed sub-action types. Defaults to {@link SUB_ACTION_TYPES}."
    },
    {
      "name": "context",
      "optional": true,
      "type": "ActionConfigContext",
      "doc": "Workspace data forwarded to the nested config panel."
    },
    {
      "name": "idPrefix",
      "optional": true,
      "type": "string",
      "doc": "Stable id seed for the created sub-action (e.g. the button id)."
    }
  ],
  "classesUsed": [
    "sub-action-config",
    "sub-action-field"
  ],
  "examples": {
    "react": null,
    "html": null,
    "css": ".sub-action-config { display: flex; flex-direction: column; gap: var(--s-3); padding: var(--s-3); border: 1px solid var(--hair); border-radius: var(--r-sm); background: var(--bg-warm); }\n\n.sub-action-field { display: flex; flex-direction: column; gap: var(--s-3); }"
  }
}