Trace
A compact log of steps an agent or job took, each expandable to show its output.
Tasks: 6 successful, 6 total
Time: 14.2sUsage
import {
Trace,
TraceCollapsible,
TraceCollapsibleContent,
TraceCollapsibleTrigger,
TraceIcon,
TraceLine,
TraceTitle,
} from "@zynactra/ui/trace"<Trace>
<TraceLine status="running">
<TraceIcon>
<GlobeIcon />
</TraceIcon>
<TraceTitle>Searching the docs</TraceTitle>
</TraceLine>
<TraceCollapsible>
<TraceCollapsibleTrigger>
<TraceLine>
<TraceTitle>Ran pnpm check</TraceTitle>
</TraceLine>
</TraceCollapsibleTrigger>
<TraceCollapsibleContent>Output here.</TraceCollapsibleContent>
</TraceCollapsible>
</Trace>status on TraceLine is running (title shimmers), error or pending; leave it off for finished steps.
Guidelines
- Titles in the past tense once done ("Ran", "Read"), present while running ("Running"), so the text carries the state.
- Put raw output in a small Code Block inside the collapsible, closed by default.
- Errors stay visible; don't collapse them away.