AI Approval Request
Approve a tool call — after correcting the arguments the model got wrong.
- AI
- 1 file
- No extra npm packages
- Accessibility notes
pnpm dlx @dowel-ui/cli add ai-approval-requestNo npm packages are needed beyond what Dowel already requires.
import { ApprovalRequest } from "@/components/ui/ai-approval-request";Default
Correct Before Approving
Still Arriving
Irreversible
Denying
Decided
Focus On Decide
<ApprovalRequest>
| Prop | Type | Default |
|---|---|---|
arguments (required)Proposed arguments. Missing keys are treated as still arriving. | Record<string, string> | — |
fields (required)Which arguments to show, in order, and which may be changed. | ApprovalField[] | — |
onDecision (required) | (decision: ApprovalDecision) => void | — |
summary (required)What the call will do, in the reader's language rather than the API's. | string | — |
tool (required)The tool the model wants to call, as it named it. | string | — |
decisionSet once decided, to render the outcome instead of the controls. | ApprovalDecision | — |
irreversibleSaid plainly above the controls when the call cannot be taken back. Not a severity colour — the sentence is the warning. | string | — |
manageFocusKeep focus in the request as its controls swap: onto the outcome when a decision lands, into the reason field when Deny… opens, and back to Deny… from Back. Only acts when focus was already inside the request, so a decision applied elsewhere (another tab, a replay) never steals focus. | boolean | true |
streamingTrue while the model is still producing the arguments. The request renders anyway; only the decision waits. | boolean | false |
children | ReactNode | — |
Plus every attribute of <section> except onSubmit, children.
10/10
checks passed
- Tested — passes
- axe assertion — passes
- Keyboard tested — passes
- Storybook examples — passes
- Accessibility documented — passes
- Semantic tokens only — passes
- Motion from tokens — passes
- className merged — passes
- Visible focus — passes
- No fixed widths — passes