Component

Chart

Backward-compatible discriminated union wrapper for every focused chart component.

Chart is a convenience wrapper. Prefer LineChart, BarChart, DonutChart, and Heatmap in product code when the chart type is known.
data
DOM renderImage render
ChartDefault

Agent runs

Agent run volume with accepted output overlay.

ready

Playground

Controls update query params directly. Complex slots use item-owned examples so component states stay deterministic, linkable, and screenshot-ready.

Loading playground

Rendered matrix

Every state maps to the same component render route through the state query param.

Default

Multi-series line chart with a target marker.

Agent runs

Agent run volume with accepted output overlay.

ready
Agent runsAccepted
Render state

Line

Multi-series line chart with a target marker.

Agent runs

Agent run volume with accepted output overlay.

ready
Agent runsAccepted
Render state

Area

Soft area chart for trend previews.

Execution trend

Accepted runs and total executions.

ready
Agent runsAccepted
Render state

Bar

Grouped bar comparison.

Capability score

ready
RouterMemoryToolsEval
Render state

Stacked

Stacked bar composition.

Run composition

ready
SearchReasoningTools
Render state

Donut

Part-to-whole ring summary.

Workload split

ready
64%Router
Router52Memory38Tools44Eval31
Render state

Heatmap

Compact two-axis intensity grid.

Run intensity

ready
MonTueWedThuFriAM1220283644Mid1725334149PM2230386454
Render state

Compact

Headerless compact chart surface.
Render state

Loading

Stable loading state.

Agent runs

loading
Loading data
Render state

Empty

No-data state.

Agent runs

empty
No data
Render state

Error

Failed data state.

Agent runs

error
Could not load the run summary.
Render state

Public contract

The public prop table is generated from item metadata and schema-backed controls.
NameTypeDefaultDescription
kind *'line' | 'area' | 'bar' | 'stacked-bar' | 'donut' | 'heatmap'lineChart renderer selected by the discriminated schema.
title *string-Chart title.
descriptionstring-Muted supporting copy.
state'ready' | 'loading' | 'empty' | 'error'readyAsync data state.
messagestring-Optional async state message override.
heightnumber220SVG or grid stage height.
legendbooleantrueShows derived legend indicators.
showHeaderbooleantrueShows title, description, and async state indicator.
surface'raised' | 'sunken' | 'transparent'raisedFoundation surface treatment for the plot stage.
seriesreadonly DataSeries[]-Line and area series data.
pointsreadonly DataPoint[]-Bar chart points.
groupsreadonly StackedBarGroup[]-Stacked bar groups.
segmentsreadonly DataPoint[]-Donut segments.
cellsreadonly HeatmapCell[]-Heatmap cells.