Two-column KPI tiles with deltas and a sparkline, for dashboards and wallets.
npx shadcn@latest add @lokalhost/stats-gridThe source is copied to components/blocks/stats-grid.tsx — it’s yours to edit.
import { StatsGrid } from "@/components/blocks/stats-grid";
<StatsGrid
stats={[
{ label: "Revenue", value: "$12.4k", delta: 8.2, series: [4, 6, 5, 8, 7, 9, 11] },
{ label: "Orders", value: "318", delta: 3.1, series: [3, 4, 4, 5, 4, 6, 6] },
{ label: "Refunds", value: "12", delta: -2.4, series: [6, 5, 6, 4, 5, 3, 3] },
{ label: "Visitors", value: "9,842", delta: 14.6, series: [2, 3, 5, 4, 7, 8, 10] },
]}
/>| Prop | Type | Default | Description |
|---|---|---|---|
statsrequired | { label: string; value: string; delta?: number; series?: number[] }[] | — | Tiles; delta is a percentage. |