Area chart for visualizing trends over time with gradients, tooltips, and legends.
npx shadcn@latest add @preskok/area-chartimport { AreaChart } from "@/components/ui/preskok-ui/area-chart"
const chartData = [
{ month: "January", Desktop: 186, Mobile: 80 },
{ month: "February", Desktop: 305, Mobile: 200 },
{ month: "March", Desktop: 237, Mobile: 120 },
]
const chartConfig = {
Desktop: { label: "Desktop", color: "#2563eb" },
Mobile: { label: "Mobile", color: "#60a5fa" },
}
export function AreaChartDemo() {
return <AreaChart data={chartData} dataKey="month" config={chartConfig} />
}