Subagent
A subagent folded to one line that says what it is doing right now. Expand it for its own trace on a rail and its result.
On this page
The current action crossfades in place while the subagent works; expand to see its trace.
Installation
Usage
import { Subagent } from "@/components/ui/chatcn/subagent"
<Subagent
name="Explore agent"
status="running"
activity="Reading src/app/runs/layout.tsx"
task="Find what blocks the first paint of /runs."
toolCount={3}
steps={steps}
/>Pass steps for a compact built-in trace, or children for anything else: a full Trace, tool calls, or more Subagents for agents that spawn agents. The rails nest and line up with the glyphs.
Examples
Nested agents
A lead agent and the two agents it spawned, on one rail.
Every state
Starting, running, waiting for input, done, failed and cancelled.
Props
| Prop | Type | Notes |
|---|---|---|
name | ReactNode | The subagent's name |
status | SubagentStatus | spawning, running, waiting, done, failed, cancelled |
activity | string | The one-line HUD; changes crossfade in place |
task | ReactNode | What it was asked, at the top of the trace |
summary | ReactNode | Its result; the first line shows in the folded row when done |
summaryLine | string | Override the folded line when done |
steps | SubagentStep[] | { id, label, detail?, status } |
toolCount | number | Shown as 8 tools |
durationMs, startedAt | number | Measured automatically when omitted |
icon | ReactNode | Glyph at rest; defaults to the subagent icon |
open, defaultOpen, onOpenChange | Opens by itself when failed or waiting |
Keyboard
| Key | Action |
|---|---|
Enter, Space | Expand or collapse the trace |
Accessibility
- The HUD line is deliberately not live: screen readers would hear every file. A polite region announces Explore agent done once it settles.
- The old line is hidden from assistive tech the moment it starts fading out.
Motion
- The activity line crossfades: the old text fades out in 110 ms while the new fades in over 150 ms in the same spot. No slide, no ticker, no layout shift.
- Spinner to icon uses the 150 ms blur swap; the trace opens over 200 ms.