Skip to content

Foundation / Agentic Design Language

Interruption Patterns

Human-in-the-loop control surfaces for pausing, redirecting, and overriding autonomous agents. These patterns make human authority legible and prevent accidental or irreversible actions.

Color System

--ds-color-temporalBlue — benign pause/resume. No data is lost. The agent is waiting for a resume signal.
--ds-color-validationGold — cautionary redirect. Goal is changing mid-execution. Human confirms new direction.
--ds-color-agencyRed — destructive override. Irreversible. Consequences must be shown before confirmation.

Pattern 1 of 3

AgentPauseControl

PURPOSE

Allows a human operator to pause an in-flight agent without losing execution state. When paused, the component shows exactly what is preserved — the step count and last completed action — so the operator can make an informed decision before resuming or redirecting.

LIVE DEMO

RUNNINGtreasury-agent
2026-03-26 14:32 UTC

Process batch payment run: 47 invoices

3/ 8 steps
CURRENT ACTION
Initiating FX conversion for EUR-denominated invoices (12 of 47)
25% complete

PROPS

PropTypeDefaultDescription
agentstring—Agent name shown in the header.
taskstring—High-level task description.
currentStepnumber—Current step (1-based).
totalStepsnumber—Total steps in execution plan.
lastCompletedStepstring—Last completed step label — shown as preserved state when paused.
currentActionstring—What the agent is doing right now — shown while running.
startedAtstring—ISO or formatted timestamp when execution started.
status"running" | "paused" | "resuming"internalControlled status. Omit to use internal state.
onPause() => void—Callback when the pause button is clicked.
onResume() => void—Callback when the resume button is clicked.

DO / DON'T

DO
Show the step count and last completed action when paused. The operator needs to know what is preserved.
DON'T
Show only 'Paused' with no context. The operator cannot make an informed decision about resuming.
DO
Show 'RESUMING…' as a transient state between paused and running.
DON'T
Jump immediately from paused to running — the transition state gives important feedback.

Pattern 2 of 3

RedirectPanel

PURPOSE

Surfaces a goal-change form mid-execution. Shows what the agent has already accomplished (preserving those steps), the struck-through original goal, and a preview of the new goal. Requires explicit confirmation before redirecting.

LIVE DEMO

REDIRECT IN PROGRESS
treasury-agent
CURRENT GOAL
Process all Q1 vendor invoices and submit to accounts payable by EOD
AGENT PROGRESS (3 of 6 steps done — this work is preserved)
Fetched 147 invoices from ERP systemDONE
Validated invoice records against vendor masterDONE
Flagged 3 duplicate invoice referencesDONE
Initiating FX conversion for EUR-denominated invoicesIN PROGRESS
Generate payment batch filePENDING
Submit to AP for approvalPENDING

PROPS

PropTypeDefaultDescription
agentstring—Agent name shown in the header.
originalGoalstring—The current goal being replaced — shown struck-through in the diff.
completedStepsRedirectStep[]—Array of { index, label, status } where status is "completed" | "in_progress" | "pending".
onRedirect(newGoal: string) => void—Called with the new goal string when the operator confirms.
onCancel() => void—Called when the operator cancels the redirect.

DO / DON'T

DO
Show every completed step before surfacing the redirect form. The operator needs to know what they're building on.
DON'T
Jump straight to a text input. The agent context disappears and the operator can't make an informed decision.
DO
Show the new goal in a live preview as the operator types it.
DON'T
Show only the input field with no preview — surprises on submission create distrust.

Pattern 3 of 3

OverrideConfirmation

PURPOSE

Used when the human operator wants to cancel or overturn an in-flight agent decision with irreversible consequences — e.g. cancelling scheduled payments or halting an approved transaction. Consequences are shown before the acknowledgment checkbox is presented, making blind overrides impossible.

LIVE DEMO

HUMAN OVERRIDE — REQUIRES ACKNOWLEDGMENT
treasury-agent
AGENT TASK BEING OVERRIDDENProcessing batch payment run: 47 invoices totalling €2.4M — step 4 of 8 complete

Cancel Payment Batch Run

This will immediately halt the agent and cancel all pending payment submissions. Payments that have already been submitted to the banking system cannot be recalled.

CONSEQUENCES (4)
3 payments already submitted — cannot be recalledCRITICAL
INV-2241, INV-2243, INV-2251 were submitted at 14:38 UTC.
44 pending payments will be cancelledCRITICAL
Vendor invoices totalling €2.1M will not be processed today.
FX conversion locks will be releasedHIGH
EUR/GBP and EUR/USD rate locks expire. Re-booking may be at a worse rate.
Next payment run will need to be re-queued manuallyMEDIUM
ACKNOWLEDGMENT REQUIRED

PROPS

PropTypeDefaultDescription
agentstring—Agent name shown in the header.
agentTaskstring—What the agent was doing — shown for context before the override title.
overrideTitlestring—Short title for the override action.
overrideDescriptionstring—Human-readable description of what the override will do.
consequencesOverrideConsequence[]—Array of { id, severity, label, detail? } where severity is "critical" | "high" | "medium".
acknowledgmentTextstring—Custom acknowledgment statement. Defaults to a generated statement based on critical consequence count.
onConfirm() => void—Called when the operator confirms the override (requires acknowledgment).
onCancel() => void—Called when the operator cancels.

DO / DON'T

DO
Always list every consequence before the acknowledgment checkbox. Consequences are non-dismissible.
DON'T
Show a simple 'Are you sure?' dialog. The operator cannot assess impact without a consequence list.
DO
Disable the confirm button until the acknowledgment checkbox is checked. Make the gate explicit.
DON'T
Allow single-click override. High-stakes actions must require deliberate acknowledgment.
DO
Distinguish critical/high/medium consequences with the three-primary color system.
DON'T
Use a flat list with no severity signal — not all consequences carry equal weight.
← Error PatternsAgentic Design Language →