{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "kpi-sparkline-card",
  "title": "KPI Sparkline Card",
  "description": "Pair a headline metric and directional change with a compact inline trend chart.",
  "dependencies": [
    "lucide-react@^1.33.0"
  ],
  "registryDependencies": [
    "https://components.exe.xyz/r/badge.json",
    "https://components.exe.xyz/r/card.json"
  ],
  "files": [
    {
      "path": "src/components/blocks/kpi-sparkline-card.tsx",
      "content": "import { ArrowDown, ArrowUp } from \"lucide-react\"\n\nimport { Badge } from \"@/components/ui/badge\"\nimport { Card } from \"@/components/ui/card\"\n\nexport function KpiSparklineCard({\n  label = \"Net volume\",\n  value = \"$482.9k\",\n  delta = \"+12.4%\",\n  direction = \"up\",\n}: {\n  label?: string\n  value?: string\n  delta?: string\n  direction?: \"up\" | \"down\"\n}) {\n  const points =\n    direction === \"up\"\n      ? \"2,34 18,31 34,32 50,22 66,25 82,12 98,16 116,4\"\n      : \"2,5 18,10 34,8 50,18 66,14 82,26 98,23 116,34\"\n\n  return (\n    <Card className=\"min-w-52 gap-3 p-4\">\n      <div className=\"flex items-start justify-between gap-4\">\n        <p className=\"text-xs text-muted-foreground\">{label}</p>\n        <Badge\n          variant=\"outline\"\n          className={direction === \"up\" ? \"text-primary\" : \"text-destructive\"}\n        >\n          {direction === \"up\" ? <ArrowUp /> : <ArrowDown />}\n          {delta}\n        </Badge>\n      </div>\n      <p className=\"font-heading text-2xl font-semibold tracking-tight\">\n        {value}\n      </p>\n      <svg\n        aria-label={`${label} trend`}\n        viewBox=\"0 0 118 38\"\n        className=\"h-10 w-full\"\n        role=\"img\"\n      >\n        <polyline\n          points={points}\n          fill=\"none\"\n          stroke=\"var(--primary)\"\n          strokeWidth=\"2\"\n          vectorEffect=\"non-scaling-stroke\"\n        />\n        <line\n          x1=\"0\"\n          y1=\"37\"\n          x2=\"118\"\n          y2=\"37\"\n          stroke=\"var(--border)\"\n          strokeDasharray=\"2 3\"\n        />\n      </svg>\n    </Card>\n  )\n}\n",
      "type": "registry:block"
    }
  ],
  "type": "registry:block"
}