Skip to content
Binary UIKit reference Stable

AgentTrace

Controlled disclosure of observable stages, searches, tools, files, and checks.

Use AgentTrace for observable searches, tools, files, and checks. Never expose private reasoning. Keep the plain collapsed summary useful.

Interactive example

Loading interactive example

AgentTrace

AgentTrace is a controlled disclosure for observable agent operations and their current result.

Purpose

Use AgentTrace for searches, tool calls, files, checks, and other observable work. Do not expose hidden reasoning, private chain-of-thought, or unsupported explanations of model behavior.

Summary and items

Keep summary useful while the trace is closed. It should report the current result, count, duration, or next blocked step. Do not require expansion to understand whether work succeeded.

Give the trace and every item a stable ID. Supply visible statusLabel text for each state. Descriptions can report an operation and its evidence, but must not imitate internal reasoning.

Control disclosure through open and onOpenChange. Preserve failed and blocked items until the user retries or starts a new run.

Announcements

Pass a non-empty announcement for one completed status transition. AgentTrace keeps an empty live region mounted when no message is present. An empty message announces nothing. Do not announce each streamed token or repeat the same status from a parent live region.

Tokens and style hooks

AgentTrace uses status, text, mono type, border, spacing, and motion tokens. Its detail disclosure uses the plain core Collapsible presentation. The trace rail appears only inside expanded details.

API

MemberTypeKindRequiredDefault
announcementstringpropNoundefined
emptyMessagestringpropNoundefined
itemsreadonly AgentTraceItem[]propYes
onOpenChange(open: boolean) => voidcallbackNoundefined
openbooleanbindingNofalse
statusAgentStatuspropYes
statusLabelstringpropYes
summarystringpropYes
titlestringpropYes
traceIdstringpropYes

Examples

Source

Loading source