Dev Design Library

Agent Step Timeline

A vertical timeline of ReAct agent steps: collapsible per-step cards (color-coded tool badge, args, observation show-more, index, elapsed-ms), a finish final-answer card, auto-scroll, a Thinking row while running, a finish-reason badge (max.

Agent Step Timeline preview
Library
LocalMode
Framework
React
Type
component
License
MIT
Dependencies
lucide-react
Install
npx shadcn add @localmode/ui/ui/conversation/agent-step-timeline
Files
  • apps/ui/registry/localmode/conversation/agent-step-timeline/agent-step-timeline.tsx
  • apps/ui/registry/localmode/lib/utils.ts
  • apps/ui/registry/localmode/ui/badge.tsx
Source
https://github.com/LocalMode-AI/LocalMode

Categories

More from LocalMode