{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "plug-badge",
  "title": "Plug badge",
  "description": "Default rendering of a PlugAnnotation as a small plug overlay: a tier chip, a custom icon, or a gold recommended marker.",
  "dependencies": [
    "@engram/core"
  ],
  "registryDependencies": [
    "@engram/bungie-image",
    "@engram/cn",
    "@engram/tokens"
  ],
  "files": [
    {
      "path": "src/components/plug-badge.tsx",
      "content": "import type { PlugAnnotation } from \"@engram/core\";\nimport { cn } from \"../lib/cn.js\";\nimport { BungieImage } from \"./bungie-image.js\";\n\nexport interface PlugBadgeProps {\n  annotation: PlugAnnotation;\n  className?: string;\n}\n\n/**\n * Default rendering of a {@link PlugAnnotation} as a small plug overlay: a tier\n * chip, a custom icon, or a gold recommended marker. This is the typed layer\n * that feeds a Plug's `badge` slot; pass `renderBadge` to fully override.\n */\nexport function PlugBadge({ annotation, className }: PlugBadgeProps) {\n  const { tier, icon, recommended } = annotation;\n  if (icon) {\n    return <BungieImage src={icon} className={cn(\"size-3.5\", className)} />;\n  }\n  if (tier) {\n    return (\n      <span\n        className={cn(\n          \"grid h-3.5 min-w-3.5 place-items-center bg-engram-gold px-0.5 font-engram-display font-bold text-[8px] text-engram-bg leading-none\",\n          className,\n        )}\n      >\n        {tier}\n      </span>\n    );\n  }\n  if (recommended) {\n    return (\n      <span\n        role=\"img\"\n        aria-label=\"recommended\"\n        className={cn(\n          \"block size-2 rotate-45 bg-engram-gold shadow-[0_0_6px_var(--engram-gold)]\",\n          className,\n        )}\n      />\n    );\n  }\n  return null;\n}\n",
      "type": "registry:component",
      "target": "components/engram/plug-badge.tsx"
    }
  ],
  "meta": {
    "level": "component"
  },
  "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": [
    "socket"
  ],
  "type": "registry:component"
}