Timeline

Vertical execution timeline with status dots, duration bars, tool tags, and shimmer on active steps.

ai-workflow v0.3.0

Playground

Agent execution

<ai-timeline style="max-width:450px;"></ai-timeline>

With tokens + nested

<ai-timeline style="max-width:450px;"></ai-timeline>

With error

<ai-timeline style="max-width:450px;"></ai-timeline>

Compact

<ai-timeline compact style="max-width:350px;"></ai-timeline>

import { AiTimeline } from '@cognivo/components';

// Or tree-shake: import '@cognivo/components/ai-timeline';

Per-component imports ship only that component (~8 kB gzip).

Prop	Type	Default	Description
`steps`	TimelineStep[]	—	Steps — {label, status, detail?, duration?, tools?, tokens?, children?}
`compact`	boolean	false	Hide details, tools, duration bars

Event	Detail	Description
`ai-timeline-step-click`	{index, step}	Step clicked