Component

Stacked bar chart

Composition chart for small category stacks across time or groups.

Stacked bar chart is for composition, not precise comparison. Keep the segment count low and prefer normalized bars when the share is more important than total volume.
data
DOM renderImage render
Stacked bar chartDefault

Run composition

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

Vertical stacked composition.

Run composition

ready
SearchReasoningTools
Render state

Normalized

Normalized 100% composition.

Run composition

ready
SearchReasoningTools
Render state

Horizontal

Rail layout for compact summaries.

Run composition

ready
SearchReasoningTools
Render state

Compact

Headerless normalized rails for dense summaries.
Render state

Loading

Stable loading state for async generated output.

Run composition

loading
Loading data
Render state

Empty

No-data state inside the stacked bar shell.

Run composition

empty
No data
Render state

Error

Failed data state with an explicit message.

Run composition

error
Could not load run composition.
Render state

Public contract

The public prop table is generated from item metadata and schema-backed controls.
NameTypeDefaultDescription
title *string-Chart title.
descriptionstring-Muted supporting copy.
groupsreadonly StackedBarGroup[][]Stacked bar groups.
normalizedbooleanfalseNormalizes each group to 100%.
orientation'vertical' | 'horizontal'verticalColumn or rail layout.
state'ready' | 'loading' | 'empty' | 'error'readyAsync data state.
showValuesbooleantrueShows group total labels.
showGridbooleantrueShows horizontal grid rules in vertical mode.
showXAxisbooleantrueShows axis labels in vertical mode.
showYAxisbooleantrueShows tick labels in vertical mode.
heightnumber220SVG plot height.
legendbooleantrueShows derived legend indicators.