Bar Chart

Charts

Vertical bar chart with labels, value display, animation and custom colors.

Bar Chart — animated SVG bars with per-bar colors

Instalação via CLI

$ npx kikitocn add bar-chart

Interno:

@/lib/utils

Exemplo de uso

Bar ChartExample.tsx

import { BarChart } from "@/components/ui/cn/bar-chart/BarChart";

export function BarChartExample() {
  return (
    <BarChart />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`data*`	`BarChartItem[]`	—	Série de dados: { label, value, color? }
`height`	`number`	`200`	Altura do gráfico em px
`barWidth`	`number`	`36`	Largura de cada barra em px
`gap`	`number`	`12`	Espaço entre barras em px
`showValues`	`boolean`	`true`	Exibe valores sobre as barras
`color`	`string`	`undefined`	Cor CSS padrão das barras (sobrepõe intent)
`animate`	`boolean`	`true`	Anima a entrada das barras ao entrar na viewport

Carregando…