import { ChartLine } from "@/components/chart-line"
const data = [
{ month: "Jan", revenue: 18600, expenses: 12400 },
{ month: "Feb", revenue: 21400, expenses: 13100 },
{ month: "Mar", revenue: 19800, expenses: 12900 },
{ month: "Apr", revenue: 24300, expenses: 14200 },
{ month: "May", revenue: 26900, expenses: 15600 },
{ month: "Jun", revenue: 25100, expenses: 15100 },
{ month: "Jul", revenue: 28700, expenses: 16300 },
{ month: "Aug", revenue: 31200, expenses: 17000 },
{ month: "Sep", revenue: 29400, expenses: 16800 },
{ month: "Oct", revenue: 33800, expenses: 18200 },
{ month: "Nov", revenue: 36100, expenses: 19400 },
{ month: "Dec", revenue: 39500, expenses: 20600 },
]
export function Demo() {
return (
<ChartLine
data={data}
showLegend
title="Revenue"
description="Jan – Dec 2025"
valueFormat="currency"
index="month"
series={[{ key: "revenue", label: "Revenue" }, { key: "expenses", label: "Expenses" }]}
/>
)
}
Updates live as you change the controls. Only non-default props are included.