Primitive

Indicator

Dot, legend, and series key punctuation for data surfaces and live rows.

Indicators punctuate status and legends. Keep the label nearby and avoid using the dot as the only carrier of meaning.
data
DOM renderImage render
IndicatorDefault
RunningQueuedFailed

Playground

Controls update query params directly, so every primitive state can be linked, rendered, and screenshotted deterministically.

Loading playground

Rendered matrix

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

Default

Status indicators.
RunningQueuedFailed
Render state

Muted

Muted legend indicators.
RunningQueuedFailedBackground
Render state

Public contract

The public prop table is generated from item metadata and schema-backed controls.
NameTypeDefaultDescription
intent'neutral' | 'muted' | 'sky' | 'terminal' | 'ultra' | 'danger'neutralDot semantic intent.
childrenReactNode-Indicator label.