@cueplusplus/ui 0.13.0

package/manifest/components/app-window-frame.json

@@ -0,0 +1,124 @@
+{
+  "name": "AppWindowFrame",
+  "slug": "app-window-frame",
+  "group": "instruments",
+  "importPath": "@cueplusplus/ui",
+  "peerDependencies": [],
+  "clientOnly": false,
+  "description": "A screenshot of your own app, built out of your own components.\n\nThe marketing device: title bar, optional toolbar, canvas, status bar — the\nshape of a desktop window, wrapped around real markup. Because the contents\nare components rather than a PNG, the hero image re-themes with the site, is\nlegible at any zoom, and cannot go stale the week after a redesign.\n\nBuilt from the real `TitleBar` and `StatusBar`, so the depiction and the\nproduct share one set of geometry tokens and can never drift apart.\n\nStatic markup — no `\"use client\"`.",
+  "props": [
+    {
+      "name": "title",
+      "type": "ReactNode",
+      "required": false,
+      "defaultValue": null,
+      "description": "The document name, centred in the title bar.",
+      "control": {
+        "kind": "node",
+        "fixture": "children.text"
+      }
+    },
+    {
+      "name": "traffic",
+      "type": "boolean",
+      "required": false,
+      "defaultValue": "true",
+      "description": "Draw the three window lights. Defaults to `true`.",
+      "control": {
+        "kind": "boolean"
+      }
+    },
+    {
+      "name": "toolbar",
+      "type": "ReactNode",
+      "required": false,
+      "defaultValue": null,
+      "description": "Contents of the toolbar row under the title bar. Omit for no toolbar.",
+      "control": {
+        "kind": "node",
+        "fixture": "children.text"
+      }
+    },
+    {
+      "name": "statusBar",
+      "type": "ReactNode",
+      "required": false,
+      "defaultValue": null,
+      "description": "Contents of the status bar along the bottom. Omit for no status bar.",
+      "control": {
+        "kind": "node",
+        "fixture": "children.text"
+      }
+    },
+    {
+      "name": "elevated",
+      "type": "boolean",
+      "required": false,
+      "defaultValue": "true",
+      "description": "Float the frame off the page with a drop shadow. Defaults to `true`.\n\nThis is the one flat-design exception in the kit, and it is not really an\nexception: the component *depicts a floating window*, which is exactly the\ncase the overlay shadow rule already carves out. Set it `false` when the\nframe is inlined into a page that is already a window.",
+      "control": {
+        "kind": "boolean"
+      }
+    },
+    {
+      "name": "children",
+      "type": "ReactNode",
+      "required": false,
+      "defaultValue": null,
+      "description": "What is inside the window.",
+      "control": {
+        "kind": "node",
+        "fixture": "children.text"
+      }
+    }
+  ],
+  "typeReferences": [
+    "Omit<React.ComponentPropsWithoutRef<\"div\">, \"title\">"
+  ],
+  "subcomponents": [],
+  "parts": [],
+  "variants": {},
+  "defaultVariants": {},
+  "tokensUsed": [
+    "--cue-bg",
+    "--cue-border",
+    "--cue-chrome-toolbar",
+    "--cue-danger",
+    "--cue-fg-muted",
+    "--cue-font-mono",
+    "--cue-ok",
+    "--cue-pad-row-x",
+    "--cue-radius-surface",
+    "--cue-space-2",
+    "--cue-space-3",
+    "--cue-space-6",
+    "--cue-surface-1",
+    "--cue-text-label",
+    "--cue-warn"
+  ],
+  "summary": "A screenshot of your own app, built out of your own components.",
+  "examples": [
+    {
+      "title": "Usage",
+      "code": "<AppWindowFrame\n  title=\"main-stage.cue\"\n  toolbar={<><Chip>File</Chip><Chip tone=\"ok\">Live</Chip></>}\n  statusBar={<><StatusBar.Item tone=\"ok\">LIVE</StatusBar.Item><StatusBar.Item>30 pps</StatusBar.Item></>}\n>\n  <SeamGrid columns={3}>{cells}</SeamGrid>\n</AppWindowFrame>",
+      "language": "tsx"
+    }
+  ],
+  "status": "todo-docs",
+  "url": "/docs/components/app-window-frame",
+  "mdUrl": "/docs/components/app-window-frame.md",
+  "jsonUrl": "/r/components/app-window-frame.json",
+  "specimens": [
+    {
+      "title": "AppWindowFrame",
+      "group": "instruments",
+      "components": [
+        "AppWindowFrame"
+      ],
+      "code": "<AppWindowFrame\n  title=\"dmxhub — universe 1\"\n  traffic\n  elevated\n  toolbar={\n    <div className=\"flex items-center gap-(--cue-space-3)\">\n      <Button size=\"sm\" icon={Play}>\n        Go\n      </Button>\n      <Chip tone=\"ok\">44 Hz</Chip>\n      <span className=\"flex-1\" />\n      <IconButton aria-label=\"More\" icon={MoreVertical} size=\"sm\" variant=\"ghost\" />\n    </div>\n  }\n  statusBar={\n    <StatusBar>\n      <StatusBar.Item tone=\"ok\">connected</StatusBar.Item>\n      <StatusBar.Item push>10.0.0.42</StatusBar.Item>\n    </StatusBar>\n  }\n  className=\"w-full max-w-[40rem]\"\n>\n  <div className=\"p-(--cue-space-5)\">\n    <Eyebrow>output</Eyebrow>\n    <div className=\"mt-(--cue-space-4) flex flex-col gap-(--cue-space-3)\">\n      {CHANNELS.map((channel) => (\n        <Meter key={channel.name} percent={channel.level} tone={channel.tone} />\n      ))}\n    </div>\n  </div>\n</AppWindowFrame>",
+      "note": "The marketing device: a window with traffic lights, a toolbar slot and a status bar slot, so a screenshot of a product looks like a product.",
+      "interaction": "none. The frame is scenery."
+    }
+  ],
+  "todo": true
+}

package/manifest/components/approval-card.json

@@ -0,0 +1,136 @@
+{
+  "name": "ApprovalCard",
+  "slug": "approval-card",
+  "group": "elements",
+  "importPath": "@cueplusplus/ui/elements",
+  "peerDependencies": [
+    "lucide-react"
+  ],
+  "clientOnly": true,
+  "description": "Human in the loop: the agent asks before it runs anything with side effects.",
+  "props": [
+    {
+      "name": "state",
+      "type": "\"done\" | \"running\" | \"request\" | \"denied\"",
+      "required": true,
+      "defaultValue": null,
+      "description": "Lifecycle of the card: request with actions, running spinner, done check, or denied.",
+      "control": {
+        "kind": "enum",
+        "members": [
+          "done",
+          "running",
+          "request",
+          "denied"
+        ]
+      }
+    },
+    {
+      "name": "command",
+      "type": "string",
+      "required": true,
+      "defaultValue": null,
+      "description": "Command shown in the mono field the agent wants to run.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "title",
+      "type": "string",
+      "required": true,
+      "defaultValue": null,
+      "description": "Headline naming the action that needs approval.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "subtitle",
+      "type": "string",
+      "required": true,
+      "defaultValue": null,
+      "description": "Supporting line under the title explaining the request.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "onAllowOnce",
+      "type": "(() => void)",
+      "required": false,
+      "defaultValue": null,
+      "description": "Called when the user clicks Allow once.",
+      "control": {
+        "kind": "callback",
+        "fixture": "callback.log"
+      }
+    },
+    {
+      "name": "onAlwaysAllow",
+      "type": "(() => void)",
+      "required": false,
+      "defaultValue": null,
+      "description": "Called when the user clicks Always allow.",
+      "control": {
+        "kind": "callback",
+        "fixture": "callback.log"
+      }
+    },
+    {
+      "name": "onDeny",
+      "type": "(() => void)",
+      "required": false,
+      "defaultValue": null,
+      "description": "Called when the user clicks Deny.",
+      "control": {
+        "kind": "callback",
+        "fixture": "callback.log"
+      }
+    }
+  ],
+  "typeReferences": [
+    "Omit<\n  ComponentProps<\"div\">,\n  | \"children\"\n  | \"state\"\n  | \"command\"\n  | \"title\"\n  | \"subtitle\"\n  | \"onAllowOnce\"\n  | \"onAlwaysAllow\"\n  | \"onDeny\"\n> & {\n  /** Lifecycle of the card: request with actions, running spinner, done check, or denied. */\n  state: ApprovalState;\n  /** Command shown in the mono field the agent wants to run. */\n  command: string;\n  /** Headline naming the action that needs approval. */\n  title: string;\n  /** Supporting line under the title explaining the request. */\n  subtitle: string;\n  /** Called when the user clicks Allow once. */\n  onAllowOnce?: () => void;\n  /** Called when the user clicks Always allow. */\n  onAlwaysAllow?: () => void;\n  /** Called when the user clicks Deny. */\n  onDeny?: () => void;\n}"
+  ],
+  "subcomponents": [],
+  "parts": [],
+  "variants": {},
+  "defaultVariants": {},
+  "tokensUsed": [
+    "--cue-fg",
+    "--cue-fg-muted",
+    "--cue-font-mono",
+    "--cue-ok",
+    "--cue-radius-overlay",
+    "--cue-radius-surface",
+    "--cue-surface-1",
+    "--cue-surface-2",
+    "--cue-text-body",
+    "--cue-text-ui"
+  ],
+  "summary": "Human in the loop: the agent asks before it runs anything with side effects.",
+  "examples": [
+    {
+      "title": "Usage",
+      "code": "import { ApprovalCard } from \"@cueplusplus/ui/elements\";\n\n<ApprovalCard\n  state=\"request\"\n  command=\"pnpm db:migrate\"\n  title=\"Run migration\"\n  subtitle=\"Needs your approval\"\n  onAllowOnce={() => approve()}\n  onDeny={() => deny()}\n/>",
+      "language": "tsx"
+    }
+  ],
+  "status": "todo-docs",
+  "url": "/docs/components/approval-card",
+  "mdUrl": "/docs/components/approval-card.md",
+  "jsonUrl": "/r/components/approval-card.json",
+  "specimens": [
+    {
+      "title": "ApprovalCard",
+      "group": "elements",
+      "components": [
+        "ApprovalCard"
+      ],
+      "code": "<Specimens>\n  {APPROVALS.map((state) => (\n    <Specimen key={state} label={state} wide>\n      <ApprovalCard\n        state={approvals[state] ?? state}\n        command=\"cue unpatch --universe 4 --all\"\n        title=\"Unpatch universe 4\"\n        subtitle=\"48 channels stop responding until they are patched again.\"\n        onAllowOnce={settle(state, \"running\")}\n        onAlwaysAllow={settle(state, \"running\")}\n        onDeny={settle(state, \"denied\")}\n      />\n    </Specimen>\n  ))}\n</Specimens>",
+      "note": "Human in the loop for one action: the command in mono exactly as it will run, and three answers. The four specimens are the four states of the union, and the first one is live: answer it and it moves.",
+      "interaction": "Allow once and Always allow are separate answers, never one control with a modifier. Denying settles the card rather than hiding it."
+    }
+  ],
+  "todo": true
+}

package/manifest/components/artifact-card.json

@@ -0,0 +1,93 @@
+{
+  "name": "ArtifactCard",
+  "slug": "artifact-card",
+  "group": "elements",
+  "importPath": "@cueplusplus/ui/elements",
+  "peerDependencies": [
+    "lucide-react"
+  ],
+  "clientOnly": true,
+  "description": "A generated document as a tangible object, written live and versioned.",
+  "props": [
+    {
+      "name": "title",
+      "type": "string",
+      "required": true,
+      "defaultValue": null,
+      "description": "Name of the generated artifact.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "meta",
+      "type": "string",
+      "required": true,
+      "defaultValue": null,
+      "description": "Resting meta line shown once generation finishes, for example kind, version, and\nrecency.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "generating",
+      "type": "boolean",
+      "required": false,
+      "defaultValue": "false",
+      "description": "While true the icon pulses and the meta line shows a live word count with a shimmer.",
+      "control": {
+        "kind": "boolean"
+      }
+    },
+    {
+      "name": "words",
+      "type": "number",
+      "required": false,
+      "defaultValue": "0",
+      "description": "Live word count shown while generating.",
+      "control": {
+        "kind": "number"
+      }
+    }
+  ],
+  "typeReferences": [
+    "Omit<\n  ComponentProps<\"div\">,\n  \"children\" | \"title\" | \"meta\" | \"generating\" | \"words\"\n> & {\n  /** Name of the generated artifact. */\n  title: string;\n  /**\n   * Resting meta line shown once generation finishes, for example kind, version, and\n   * recency.\n   */\n  meta: string;\n  /** While true the icon pulses and the meta line shows a live word count with a shimmer. */\n  generating?: boolean;\n  /** Live word count shown while generating. */\n  words?: number;\n}"
+  ],
+  "subcomponents": [],
+  "parts": [],
+  "variants": {},
+  "defaultVariants": {},
+  "tokensUsed": [
+    "--cue-fg-muted",
+    "--cue-fg-subtle",
+    "--cue-radius-overlay",
+    "--cue-radius-surface",
+    "--cue-surface-1",
+    "--cue-text-body"
+  ],
+  "summary": "A generated document as a tangible object, written live and versioned.",
+  "examples": [
+    {
+      "title": "Usage",
+      "code": "import { ArtifactCard } from \"@cueplusplus/ui/elements\";\n\n<ArtifactCard\n  title=\"Draft persistence RFC\"\n  meta=\"Document · v3 · just now\"\n  generating={isWriting}\n  words={wordCount}\n/>",
+      "language": "tsx"
+    }
+  ],
+  "status": "todo-docs",
+  "url": "/docs/components/artifact-card",
+  "mdUrl": "/docs/components/artifact-card.md",
+  "jsonUrl": "/r/components/artifact-card.json",
+  "specimens": [
+    {
+      "title": "ArtifactCard",
+      "group": "elements-knowledge",
+      "components": [
+        "ArtifactCard"
+      ],
+      "code": "<Specimens>\n  <Specimen label=\"writing\">\n    <ArtifactCard title=\"Front truss — fixture spec\" meta=\"\" generating words={214} />\n  </Specimen>\n  <Specimen label=\"written\">\n    <ArtifactCard title=\"Front truss — fixture spec\" meta=\"1.4 KB · v3\" />\n  </Specimen>\n</Specimens>",
+      "note": "The document the answer produced, as an object you can pick up. While it is being written the icon pulses, the label shimmers and the word count climbs; when it lands, the meta line blurs in with its size and version. It is the handle — the document itself opens in a canvas.",
+      "interaction": "the whole card is the target and lifts a pixel under the pointer; the arrow only appears on hover, so a resting card is quiet."
+    }
+  ],
+  "todo": true
+}

package/manifest/components/ask-box.json

@@ -0,0 +1,288 @@
+{
+  "name": "AskBox",
+  "slug": "ask-box",
+  "group": "chat",
+  "importPath": "@cueplusplus/ui",
+  "peerDependencies": [],
+  "clientOnly": true,
+  "description": "The human-in-the-loop question: an agent stops, asks, and waits.\n\nControlled by design. The box holds the *draft* answer while the user is\nchoosing, but it never holds the fact of having answered — that comes back as\nthe `answer` prop once the host has recorded it. Anything else and a\ncomponent's local state becomes the source of truth for a decision the run\ndepends on, which survives exactly until the pane unmounts.\n\nAnswered questions collapse to `question · answer ✓` and expand on click, so\na long thread reads as a decision log rather than a wall of settled forms.\n\nThe prompt is rendered verbatim, never parsed as markup: an approval prompt\ninterpolates model-controlled text, and a `![](url)` in a consent statement\nis an exfiltration channel.",
+  "props": [
+    {
+      "name": "question",
+      "type": "ReactNode",
+      "required": true,
+      "defaultValue": null,
+      "description": "The question, as text or nodes. Rendered verbatim — never parsed.",
+      "control": {
+        "kind": "node",
+        "fixture": "children.text"
+      }
+    },
+    {
+      "name": "kind",
+      "type": "\"number\" | \"boolean\" | \"text\" | \"single\" | \"multi\"",
+      "required": false,
+      "defaultValue": "text",
+      "description": "Which widget to offer. Defaults to `\"text\"`.",
+      "control": {
+        "kind": "enum",
+        "members": [
+          "number",
+          "boolean",
+          "text",
+          "single",
+          "multi"
+        ]
+      }
+    },
+    {
+      "name": "options",
+      "type": "readonly AskOption[]",
+      "required": false,
+      "defaultValue": null,
+      "description": "Choices for a `single` or `multi` question.",
+      "control": {
+        "kind": "array"
+      }
+    },
+    {
+      "name": "onAnswer",
+      "type": "(value: AskAnswer) => void",
+      "required": true,
+      "defaultValue": null,
+      "description": "Fired once with the answer. The host is responsible for resuming the run.",
+      "control": {
+        "kind": "callback",
+        "fixture": "callback.log"
+      }
+    },
+    {
+      "name": "answer",
+      "type": "AskAnswer",
+      "required": false,
+      "defaultValue": null,
+      "description": "The answer, once there is one. Present means answered: the box collapses to\na one-line summary and stops accepting input.",
+      "control": {
+        "kind": "opaque"
+      }
+    },
+    {
+      "name": "asker",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "description": "Slug of the agent asking, for the byline and the box's colour.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "rootAgent",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "description": "Slug of the orchestrator, so its questions take the theme accent.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "tool",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "description": "Tool this question is approving, if it is an approval.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "danger",
+      "type": "\"low\" | \"high\" | \"critical\"",
+      "required": false,
+      "defaultValue": null,
+      "description": "Risk rating for the tool call. Omit for a plain question.",
+      "control": {
+        "kind": "enum",
+        "members": [
+          "low",
+          "high",
+          "critical"
+        ]
+      }
+    },
+    {
+      "name": "defaultValue",
+      "type": "AskAnswer",
+      "required": false,
+      "defaultValue": null,
+      "description": "Initial widget value. A string for `text`/`single`, an array for `multi`, a number for `number`.",
+      "control": {
+        "kind": "opaque"
+      }
+    },
+    {
+      "name": "placeholder",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "description": "Placeholder for the `text` widget.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "min",
+      "type": "number",
+      "required": false,
+      "defaultValue": null,
+      "description": "Lower bound for the `number` widget.",
+      "control": {
+        "kind": "number"
+      }
+    },
+    {
+      "name": "max",
+      "type": "number",
+      "required": false,
+      "defaultValue": null,
+      "description": "Upper bound for the `number` widget.",
+      "control": {
+        "kind": "number"
+      }
+    },
+    {
+      "name": "step",
+      "type": "number",
+      "required": false,
+      "defaultValue": null,
+      "description": "Increment the `number` widget's stepper moves by.",
+      "control": {
+        "kind": "number"
+      }
+    },
+    {
+      "name": "unit",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "description": "Unit shown beside a number, and in the answered summary.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "confirmLabel",
+      "type": "string",
+      "required": false,
+      "defaultValue": "Confirm",
+      "description": "Label on the affirmative half of a `boolean`. Defaults to `\"Confirm\"`.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "rejectLabel",
+      "type": "string",
+      "required": false,
+      "defaultValue": "Reject",
+      "description": "Label on the negative half of a `boolean`. Defaults to `\"Reject\"`.",
+      "control": {
+        "kind": "string"
+      }
+    },
+    {
+      "name": "submitLabel",
+      "type": "ReactNode",
+      "required": false,
+      "defaultValue": "Submit",
+      "description": "Label on the submit button. Defaults to `\"Submit\"`.",
+      "control": {
+        "kind": "node",
+        "fixture": "children.text"
+      }
+    },
+    {
+      "name": "busy",
+      "type": "boolean",
+      "required": false,
+      "defaultValue": "false",
+      "description": "The answer is in flight: locks the widget and says so.",
+      "control": {
+        "kind": "boolean"
+      }
+    },
+    {
+      "name": "defaultOpen",
+      "type": "boolean",
+      "required": false,
+      "defaultValue": "false",
+      "description": "Expand the answered summary from the start. Defaults to `false`.",
+      "control": {
+        "kind": "boolean"
+      }
+    },
+    {
+      "name": "aria-label",
+      "type": "string",
+      "required": false,
+      "defaultValue": null,
+      "description": "Accessible name for the widget when `question` is not plain text.",
+      "control": {
+        "kind": "string"
+      }
+    }
+  ],
+  "typeReferences": [
+    "Omit<React.ComponentPropsWithoutRef<\"div\">, \"onSubmit\" | \"defaultValue\">"
+  ],
+  "subcomponents": [],
+  "parts": [],
+  "variants": {},
+  "defaultVariants": {},
+  "tokensUsed": [
+    "--cue-accent",
+    "--cue-border",
+    "--cue-fg",
+    "--cue-fg-muted",
+    "--cue-fg-subtle",
+    "--cue-font-mono",
+    "--cue-icon-sm",
+    "--cue-leading-ui",
+    "--cue-ok",
+    "--cue-radius-surface",
+    "--cue-space-2",
+    "--cue-space-3",
+    "--cue-space-4",
+    "--cue-surface-1",
+    "--cue-text-body",
+    "--cue-text-label",
+    "--cue-text-micro",
+    "--cue-text-ui"
+  ],
+  "summary": "The human-in-the-loop question: an agent stops, asks, and waits.",
+  "examples": [
+    {
+      "title": "Usage",
+      "code": "<AskBox question=\"Which merge mode?\" kind=\"single\" options={modes} onAnswer={resume} />\n<AskBox question=\"Delete the rig?\" kind=\"boolean\" tool=\"rig.delete\" danger=\"critical\" onAnswer={resume} />",
+      "language": "tsx"
+    }
+  ],
+  "status": "todo-docs",
+  "url": "/docs/components/ask-box",
+  "mdUrl": "/docs/components/ask-box.md",
+  "jsonUrl": "/r/components/ask-box.json",
+  "specimens": [
+    {
+      "title": "AskBox",
+      "group": "chat",
+      "components": [
+        "AskBox"
+      ],
+      "code": "<div className=\"grid w-full gap-(--cue-space-5) lg:grid-cols-2\">\n  <AskBox\n    question=\"Name the cue\"\n    kind=\"text\"\n    asker=\"cue-writer\"\n    placeholder=\"e.g. House to half\"\n    onAnswer={answer(\"text\")}\n    answer={answers[\"text\"]}\n  />\n  <AskBox\n    question=\"Which protocol should the bridge use?\"\n    kind=\"single\"\n    options={ASK_OPTIONS}\n    asker=\"patcher\"\n    onAnswer={answer(\"single\")}\n    answer={answers[\"single\"]}\n  />\n  <AskBox\n    question=\"Which universes should the archivist capture?\"\n    kind=\"multi\"\n    options={[\n      { value: \"1\", label: \"Universe 1\" },\n      { value: \"2\", label: \"Universe 2\" },\n      { value: \"3\", label: \"Universe 3\" },\n    ]}\n    asker=\"archivist\"\n    onAnswer={answer(\"multi\")}\n    answer={answers[\"multi\"]}\n  />\n  <AskBox\n    question=\"Unpatch every fixture on universe 4?\"\n    kind=\"boolean\"\n    danger=\"critical\"\n    tool=\"unpatch\"\n    asker=\"patcher\"\n    confirmLabel=\"Unpatch\"\n    rejectLabel=\"Keep\"\n    onAnswer={answer(\"boolean\")}\n    answer={answers[\"boolean\"]}\n  />\n  <AskBox\n    question=\"Fade time for cue 4\"\n    kind=\"number\"\n    min={0}\n    max={60}\n    step={0.5}\n    unit=\"s\"\n    defaultValue={12}\n    danger=\"low\"\n    asker=\"cue-writer\"\n    onAnswer={answer(\"number\")}\n    answer={answers[\"number\"]}\n  />\n  <AskBox\n    question=\"Overwrite the show file?\"\n    kind=\"boolean\"\n    danger=\"high\"\n    busy\n    asker=\"archivist\"\n    onAnswer={answer(\"busy\")}\n  />\n</div>",
+      "note": "The HITL question widget: five kinds, three danger levels, and a collapsed `question · answer ✓` summary once it is answered. Controlled through `onAnswer`, because the host owns the run.",
+      "interaction": "the danger chip is text as well as colour; an answered box collapses but stays expandable."
+    }
+  ],
+  "todo": true
+}