Agent Approvals
experimentalThe approval step for an agent surface: correct the agent's arguments, approve once or for the session, or deny with a reason.
- AI
- 1 file
- No extra npm packages
- Accessibility notes
Loading the example…
pnpm dlx @dowel-ui/cli add agent-approvalsNo npm packages are needed beyond what Dowel already requires.
import { AgentApprovals } from "@/components/ui/agent-approvals";<AgentApprovals>
| Prop | Type | Default |
|---|---|---|
fieldLabelsLabels for arguments, by name. Otherwise the schema's description, or the name itself. | Record<string, string> | — |
Plus every attribute of <div> except children.
Each request is an ai-approval-request, so the arguments are labelled, editable fields and a correction is marked in text. A polite status region, present from first paint, says the agent is waiting and for what, because the agent is stopped until someone answers. One request is on screen at a time and the count of those behind it is stated. Reversibility is a sentence above the decision, never a colour. A tool's dry run appears inside the request as a blast-radius, whose summary sentence is announced when it arrives. The whole region is data-agent-ui, so deciding never counts as taking over the surface. If it unmounts with requests waiting, they are refused rather than left hanging.
7/7
checks passed
- Tested — passes
- axe assertion — passes
- Keyboard tested — does not apply
- Storybook examples — passes
- Accessibility documented — passes
- Semantic tokens only — passes
- Motion from tokens — does not apply
- className merged — passes
- Visible focus — does not apply
- No fixed widths — passes