{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "cost-chip",
  "title": "Cost chip",
  "description": "A currency/cost token: an amount + its currency icon. Used for vendor costs, build/material requirements, and rewards.",
  "dependencies": [
    "@engram/core"
  ],
  "registryDependencies": [
    "@engram/bungie-image",
    "@engram/cn",
    "@engram/tokens"
  ],
  "files": [
    {
      "path": "src/components/cost-chip.tsx",
      "content": "import type { CostProps } from \"@engram/core\";\nimport { cn } from \"../lib/cn.js\";\nimport { BungieImage } from \"./bungie-image.js\";\n\nexport interface CostChipProps extends CostProps {\n  /** Icon size in px. */\n  size?: number;\n  className?: string;\n}\n\n/**\n * A currency/cost token: an amount + its currency icon. Used for vendor costs,\n * build/material requirements, and rewards. When `affordable` is false the chip\n * flags in the \"bad\" color (the standard can't-afford signal).\n */\nexport function CostChip({\n  icon,\n  amount,\n  name,\n  affordable = true,\n  size = 16,\n  className,\n}: CostChipProps) {\n  return (\n    <span\n      className={cn(\n        \"inline-flex items-center gap-1 font-engram-display text-xs\",\n        affordable ? \"text-engram-fg\" : \"text-engram-bad\",\n        className,\n      )}\n      title={name}\n    >\n      <span className=\"tabular-nums\">{amount.toLocaleString()}</span>\n      {icon ? (\n        <BungieImage\n          src={icon}\n          alt={name ?? \"\"}\n          className=\"object-contain\"\n          style={{ width: size, height: size }}\n        />\n      ) : null}\n    </span>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/engram/cost-chip.tsx"
    }
  ],
  "meta": {
    "level": "atom"
  },
  "docs": "Extend without forking: edit the copied source, use `asChild` (Radix Slot) to change the rendered element, pass the typed `annotations` prop for curated data (verdict/tags/per-plug), or use slot / render-prop props for arbitrary content. Requires the @engram/tokens theme (--engram-* CSS variables).",
  "categories": [
    "item"
  ],
  "type": "registry:component"
}