AI Workflow Run Mode
Follow an agentic workflow run live, seeing which node is queued, running, finished or failed.
Choose the primitives library your project already uses. Both look the same: your theme, not the variant, controls colors, shape, type and motion.
About this feature
What it's 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.
For the full input/output and variables of each node are needed, use AI Workflow Debug Panel.
Includes
- Live execution
- Per node status
- Replay
- Timeline scrubbing
- Event stepping
- Playback speed
- Run selection
- Event log
Works with
- Radix UI and Base UI primitives (pick the one your project uses)
- React 19, Next.js App Router and Tailwind CSS 4, installed with the shadcn CLI
- Your theme tokens, in light and dark mode
Install
Included with Agentic UI Kit (one-time license). Install needs your license key: see pricing · connect your project.
agentic-ui add ai-workflow-run-modenpx shadcn@4.17.0 add @agentic-ui/ai-workflow-run-modeUsed in
A standalone component: drop it into any screen.
- Type
- Feature
- Variants
- Radix UI and Base UI
- Themes
- Light and dark
- Widths
- Preview it at desktop, tablet and mobile widths above.
- Motion
- Animated, with a reduced-motion fallback
- npm packages
@xyflow/react- Registry dependencies
ai-workflow-canvaslib-primitiveslib-tokens- Files
2 files
- components/agentic-ui/ai-workflow-run-mode/index.tsx
- components/agentic-ui/ai-workflow-run-mode/engine.ts
Related components
AI Agent Run Trace
Agent debug panel showing reasoning, tool calls with input/output, and the final response.
Details and live previewAI Chat Shell
Internal operations copilot with conversation history, a streaming thread and a per-conversation model picker.
Details and live previewAI Evals Results Table
Prompt eval suite: each nightly run is a column and each golden set case a row.
Details and live previewAI Multi Agent View
Research crew (planner, researcher, SQL analyst, writer, reviewer) coordinating in parallel on a report.
Details and live preview