Docs
GitHub

Chart

Chart is a compact sparkline for inline trends. It's pure SVG driven by currentColor, so it renders on the server and inherits the surrounding text color. For full, interactive charts, use LineChart and friends.

Usage

import { Chart } from "@sina-design-system/core";

<Chart variant="area" data={[3, 5, 4, 8, 7, 11]} label="Balance trend, up" />

Examples

Variants · line, area, bar

line
area
bar

Signed by color token — currentColor drives the stroke

success
danger
subtle

Empty series → flat baseline

Props

PropTypeDefaultDescription
variant"line" | "area" | "bar""line"Sparkline style.
datanumber[]The series to plot.

Accessibility

Renders as role="img" with a required label. Degrades to a flat baseline for an empty series.