Carregando…
Carregando…
Carregando…Inline mini chart (line, bar or area) for trend visualization in small spaces.
$ npx kikitocn add sparkline@/lib/utilsimport { Sparkline } from "@/components/ui/cn/sparkline/Sparkline";
export function SparklineExample() {
return (
<Sparkline
data={[12, 18, 9, 24, 30, 27, 35, 28, 40]}
color="var(--kk-accent)"
height={40}
/>
);
}| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
data* | number[] | — | Série de valores numéricos |
type | 'line' | 'bar' | 'area' | 'line' | Tipo do gráfico |
width | number | 80 | Largura em px |
height | number | 32 | Altura em px |
intent | 'primary' | 'success' | 'warning' | 'danger' | 'neutral' | 'primary' | Cor do gráfico via token de intent |
filled | boolean | false | Preenche a área abaixo da linha |
Area
Line
Bar