Chart

Shared chart shell, legend, tooltip, and axis helpers for Recharts-based visualizations.

stable

Quick Preview

1.28k

12.5%vs last month

Confirmed estate payments, Jan-Jun

Use this public composition when building Chart:

ChartCard
├── ChartHeader
│   ├── ChartTitle
│   └── ChartDescription
└── ChartContainer
    ├── ChartTooltip
    └── ChartLegend

<ChartCard><ChartHeader><ChartTitle>Revenue</ChartTitle></ChartHeader><ChartContainer config={config}>...</ChartContainer></ChartCard>

Use this as the starting point for Chart. Keep product data, routing, fetching, and authorization logic in the consuming app.

1.28k

12.5%vs last month

Confirmed estate payments, Jan-Jun

Prop/API	Type	Default	Description
`size`	`"sm"	"md"	"lg"`
`config`	`ChartConfig`	-	Series labels, icons, and colors.
`initialDimension`	dimension object	-	SSR-friendly initial plot dimensions.
`className`	`string`	-	Local layout or spacing overrides.
native/root props	React component props	-	Passed through to the underlying root or primitive.

Preserve the documented Chart composition so labels, triggers, content, and controls remain connected.
Provide visible labels or accessible names for interactive controls.
Preserve the component-provided focus, keyboard, disabled, and invalid-state behavior.
Do not communicate state with color alone; include text, icons, or helper copy.