Agent Run

A container for a single agentic run. Wraps a title, a status pill, run metadata, and a body of mixed content like text, actions, and tools.

Anatomy

A collapsible card with a header row and a body. The header carries the run's title, a Status pill that reflects the run's progress, and a meta slot for things like step count, elapsed time, or a usage meter. The body is a stack of steps, where each step holds anything from a paragraph of summary to an action row to a full tool call.

Reach for it when a sequence of work deserves to read as one unit, like a sub-agent invocation or a multi-step agent loop. For a single tool call use Tool. For a single action row use Action. For the model's reasoning use ChainOfThought or Reasoning.

API

Reference for each part of the component, including its available props and behavior.

AgentRun

The outer collapsible card. The state prop sets data-state on the root and ripples to every part through CSS, so the title and border reflect the run's progress without extra wiring.

AgentRunHeader

Clickable header. Lays out as a row with a leading chevron that rotates from right to down when opened, followed by the title, a Status pill, and the meta slot. Place the title first, then the status, then the meta on the right. Map the run's state to a tone at the call site, for example running → inflight (with pulse), completed → active, failed → error, stopped → neutral.

AgentRunTitle

The run's name. Tints to the primary color while the run is running and to the destructive color on failure, so the header reads the run's state at a glance.

AgentRunMeta

A right-aligned slot for run metadata. Holds short text like step counts, elapsed time, or a UsageMeter for token and cost stats. Lay items out with separators in between so the row reads as a tight summary.

AgentRunContent

The expanding body. Animates height open and close. Holds a stack of AgentRunStep rows separated by a top border so the header reads as the run's lid.

AgentRunStep

A single step in the run. The step is a plain slot, so it accepts anything: an AgentRunText block of model commentary, an Action row for a high level read or write, or a Tool block for a technical call. Mix freely so the run reads the same way it executed.

AgentRunText

A text block inside a step. Defaults to the muted commentary voice the model uses to narrate what it is doing. Inline code styles itself against the elevated surface so file paths and identifiers read clearly. Override the color with className for a final answer block or a destructive failure note.