# AI Workflow Run Mode

Follow an agentic workflow run live, seeing which node is queued, running, finished or failed.

- id: `ai-workflow-run-mode`
- Page: https://agentic-ui-kit.com/components/ai-workflow-run-mode
- Live preview: https://agentic-ui-kit.com/live/component/ai-workflow-run-mode

## Install

```bash
agentic-ui add ai-workflow-run-mode
npx shadcn@4.17.0 add @agentic-ui/ai-workflow-run-mode
```

## Metadata

- **Level:** feature
- **Category:** feature
- **Installable in:** Radix UI (registry variant new-york), Base UI (registry variant base-vega)
- **Capabilities:** live-execution, per-node-status, replay, timeline-scrubbing, event-stepping, playback-speed, run-selection, event-log, node-inspection, keyboard-navigation, empty-state, error-state
- **Intents:** monitor-live, execute-flow, track-status, audit-trail, orchestrate-agents
- **Suits domains:** ai-agents, ai-workspace, devtools, operations, analytics
- **Interaction:** play-pause, timeline-scrubbing, event-stepping, playback-speed, run-selection, node-selection, keyboard-navigation
- **Screen role:** flow
- **Density:** medium
- **Dark mode:** yes
- **Use it for:** follow an agentic workflow run live, seeing which node is queued, running, finished or failed, replay a failed run step by step up to the tool node that timed out, compare the path of a successful run with a failed one of the same workflow, show the progress of a data or CI pipeline with parallel branches
- **Avoid when:** the graph needs to be edited (use ai-workflow-canvas and ai-node-config-panel), the full input/output and variables of each node are needed (use ai-workflow-debug-panel), the process is linear and graph-free: a list of steps or ai-agent-run-trace is enough
- **Preserve when adapting:** event-trace-to-node-state-model, status-vocabulary, live-vs-replay-separation, keyboard-contract, status-announcements
- **Replace when adapting:** domain-copy, workflow-graph, run-fixtures, trace-source-adapter
- **Adaptation effort:** low
- **Coupling:** low
- **Quality score:** 9/10
- **Quality breakdown:** visual 9/10, responsive 8/10, accessibility 9/10, code 9/10
- **Uses primitives:** badge, button, scroll-area
- **npm dependencies:** @xyflow/react
- **Motion:** profile subtle, library css, reduced-motion fallback yes
- **npm dependencies (registry):** @xyflow/react@^12.10.2
- **Registry dependencies:** ai-workflow-canvas, lib-primitives, lib-tokens