ApprovalCard
Single approval request for the A2UI nodus:approval-card spec: agent sources, confidence, reasoning, consequences, and Approve / Reject with a decided state
import { ApprovalCard } from "@danagraph/design-system/patterns"Props
| Prop | Type | Default | Description |
|---|---|---|---|
titlereq | string | — | The action awaiting a decision; also the card's accessible name |
reasoning | string[] | — | One row per line of reasoning; section omitted when empty |
consequences | string[] | — | One row per consequence; section omitted when empty |
confidence | { score: number; level?: string } | — | Agent confidence, score 0-100 |
agentSources | string[] | — | Agents that requested the action |
decision | 'approve' | 'reject' | null | — | Controlled decision; omit for uncontrolled use |
onDecision | (decision: 'approve' | 'reject') => void | — | Called when Approve or Reject is activated |
approveLabel | string | "Approve" | Label of the approve action |
rejectLabel | string | "Reject" | Label of the reject action |
disabled | boolean | — | Disables both actions without recording a decision |
titlerequiredstringDefault —The action awaiting a decision; also the card's accessible name
reasoningstring[]Default —One row per line of reasoning; section omitted when empty
consequencesstring[]Default —One row per consequence; section omitted when empty
confidence{ score: number; level?: string }Default —Agent confidence, score 0-100
agentSourcesstring[]Default —Agents that requested the action
decision'approve' | 'reject' | nullDefault —Controlled decision; omit for uncontrolled use
onDecision(decision: 'approve' | 'reject') => voidDefault —Called when Approve or Reject is activated
approveLabelstringDefault "Approve"Label of the approve action
rejectLabelstringDefault "Reject"Label of the reject action
disabledbooleanDefault —Disables both actions without recording a decision
This component was designed to express:
Explore Related
Binary approve/deny gate with ceremony-level friction
Queue of pending human approvals with priority ordering
Canonical 'agent needs a human' surface unifying the AG-UI interrupt model and the A2A input-required TaskState behind a protocol adapter prop. Validation-gold frame (ReviewRequestCard treatment); response buttons meet the 44px touch-target floor.