{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "stat",
  "title": "Stat",
  "description": "Big tabular figure with label and trend.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "@hjconsult/lib"
  ],
  "files": [
    {
      "path": "src/components/stat/index.tsx",
      "content": "import { Minus, TrendingDown, TrendingUp } from 'lucide-react'\nimport type { ComponentPropsWithoutRef, ReactNode, Ref } from 'react'\nimport { cn } from '../../lib'\n\nexport interface StatTrend {\n  direction: 'up' | 'down' | 'flat'\n  label: ReactNode\n  /** Whether this movement is good news; defaults to `up` = good. */\n  positive?: boolean\n}\n\nexport interface StatProps extends Omit<ComponentPropsWithoutRef<'div'>, 'children'> {\n  /** The headline figure. Pass a `Counter` from `@hjconsult/ui/motion` to animate it. */\n  value: ReactNode\n  label: ReactNode\n  trend?: StatTrend\n  size?: 'md' | 'lg'\n  ref?: Ref<HTMLDivElement>\n}\n\nconst trendIcons = { up: TrendingUp, down: TrendingDown, flat: Minus } as const\n\nexport function Stat({ value, label, trend, size = 'md', className, ...props }: StatProps) {\n  const TrendIcon = trend ? trendIcons[trend.direction] : null\n  const good = trend ? (trend.positive ?? trend.direction === 'up') : false\n  return (\n    <div className={cn('flex flex-col gap-2', className)} {...props}>\n      <span\n        className={cn(\n          'block font-display font-medium leading-none tracking-tight text-fg tabular-nums',\n          size === 'lg' ? 'text-display-2' : 'text-h1',\n        )}\n      >\n        {value}\n      </span>\n      <span className=\"block font-body text-small text-fg-muted\">{label}</span>\n      {trend && TrendIcon ? (\n        <span\n          className={cn(\n            'inline-flex items-center gap-1 font-mono text-caption tabular-nums',\n            trend.direction === 'flat' ? 'text-fg-subtle' : good ? 'text-positive' : 'text-danger',\n          )}\n        >\n          <TrendIcon aria-hidden=\"true\" className=\"size-3.5\" />\n          {trend.label}\n        </span>\n      ) : null}\n    </div>\n  )\n}\n",
      "type": "registry:ui",
      "target": "hj/components/stat/index.tsx"
    }
  ],
  "cssVars": {},
  "type": "registry:ui"
}