{
  "name": "RunTaskActionConfig",
  "package": "@magicblocksai/ui",
  "file": "packages/ui/src/components/RunTaskActionConfig.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": "Custom config panel for **Run Task** — the instructions the agent follows\nwhen a condition is met. A Select | Custom toggle picks a saved prompt\n(`context.prompts`) xor custom instructions (token textarea), mirroring v1's\n`TaskEdit`; a `<MultiSelect>` (`context.functions`) chooses the tools the\ntask may call.",
  "useClient": true,
  "interactivity": "interactive",
  "namedExports": [
    {
      "name": "RunTaskActionConfig",
      "isPrincipal": true,
      "isType": false
    }
  ],
  "importStatement": "import { RunTaskActionConfig } from \"@magicblocksai/ui\";",
  "props": [],
  "classesUsed": [
    "action-config-stack",
    "field-help",
    "field-label",
    "field-row",
    "message-field",
    "message-field-tab",
    "message-field-tabs",
    "message-field-textarea",
    "tab"
  ],
  "examples": {
    "react": null,
    "html": null,
    "css": ".action-config-stack { display: flex; flex-direction: column; gap: var(--s-4); }\n\n.field-help { font: 400 11.5px/1.4 var(--f-body); color: var(--fg-faint); margin: 0; }\n\n.field-label { font: 600 12.5px/1.3 var(--f-body); color: var(--fg); }\n\n.field-row { display: flex; flex-direction: column; gap: 6px; }\n\n.message-field { display: flex; flex-direction: column; gap: 8px; }\n\n.message-field-tab { font: 500 12px/1 var(--f-body); color: var(--fg-soft); background: transparent; border: 0; cursor: pointer; padding: 5px 12px; border-radius: calc(var(--r-sm) - 2px); }\n\n.message-field-tabs { display: inline-flex; gap: 2px; padding: 2px; background: var(--bg-warm); border-radius: var(--r-sm); align-self: flex-start; }\n\n.message-field-textarea { width: 100%; resize: vertical; min-height: 88px; padding: 8px 10px; border: 1px solid var(--hair); border-radius: var(--r-sm); background: var(--bg-paper); color: var(--fg); font: 400 13px/1.5 var(--f-body); }\n\n.tab {\n  appearance: none; background: transparent; border: 0;\n  padding: 12px var(--s-4) 14px;\n  font: 500 13.5px/1 var(--f-body); color: var(--fg-dim);\n  cursor: pointer;\n  position: relative; white-space: nowrap;\n  transition: color var(--dur-2) var(--ease);\n  display: inline-flex; align-items: center; gap: var(--s-2);\n}"
  }
}