Design System
Data display

Chart

The Recharts wrapper carrying HMS chart tokens, so every series colour comes from the palette rather than from a component.

Not documented yet

This component ships in the design system and is fully supported. What is missing is the guidance around it: when to reach for it, the do and don't, and the accessibility notes. Until that is written, Storybook is the reference for variants, props and live controls.

Props

PropTypeDefaultDescription
configrequiredChartConfigMaps each series key to its label, colour and optional icon; colours are exposed as `--color-<key>`.
childrenrequiredReact.ReactElement<unknown, string | React.JSXElementConstructor<any>>A single recharts chart element rendered inside the responsive container.

On this page