Componentes
Chart
Componente chart do design system adila.co.
Instalação
bun add @adila-sh/uiUso
import {
ChartContainer,
ChartTooltip,
ChartTooltipContent,
} from '@adila-sh/ui';
import { Bar, BarChart, CartesianGrid, XAxis } from 'recharts';
const chartData = [
{ mes: 'Jan', vendas: 42 },
{ mes: 'Fev', vendas: 58 },
{ mes: 'Mar', vendas: 51 },
{ mes: 'Abr', vendas: 73 },
];
const chartConfig = {
vendas: { label: 'Vendas', color: 'var(--primary)' },
};
export function Example() {
return (
<ChartContainer config={chartConfig} className="min-h-40 w-full">
<BarChart data={chartData}>
<CartesianGrid vertical={false} />
<XAxis dataKey="mes" tickLine={false} axisLine={false} tickMargin={8} />
<ChartTooltip content={<ChartTooltipContent />} />
<Bar dataKey="vendas" fill="var(--color-vendas)" radius={4} />
</BarChart>
</ChartContainer>
);
}Dependências
recharts