{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "badge",
  "type": "registry:ui",
  "title": "Badge",
  "description": "Status pills and tag badges (crimson, emerald green, amber, rose red, sky blue, outline).",
  "dependencies": [
    "class-variance-authority"
  ],
  "registryDependencies": [
    "https://ui.arpitbhayani.me/r/aui.json"
  ],
  "files": [
    {
      "path": "ui/badge.tsx",
      "content": "import * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils\";\n\nconst badgeVariants = cva(\n  \"inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-medium font-mono transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2\",\n  {\n    variants: {\n      variant: {\n        primary:\n          \"border-transparent bg-primary text-primary-foreground shadow-xs\",\n        default:\n          \"border-transparent bg-primary text-primary-foreground shadow-xs\",\n        secondary:\n          \"border-transparent bg-secondary text-secondary-foreground hover:bg-muted\",\n        outline: \"text-foreground border-border\",\n        green:\n          \"border-emerald-500/25 bg-emerald-500/10 text-emerald-600 dark:text-emerald-400\",\n        amber:\n          \"border-amber-500/25 bg-amber-500/10 text-amber-600 dark:text-amber-400\",\n        red:\n          \"border-rose-500/25 bg-rose-500/10 text-rose-600 dark:text-rose-400\",\n        destructive:\n          \"border-rose-500/25 bg-rose-500/10 text-rose-600 dark:text-rose-400\",\n        blue:\n          \"border-sky-500/25 bg-sky-500/10 text-sky-600 dark:text-sky-400\",\n        violet:\n          \"border-purple-500/25 bg-purple-500/10 text-purple-600 dark:text-purple-400\",\n        cyan:\n          \"border-cyan-500/25 bg-cyan-500/10 text-cyan-600 dark:text-cyan-400\",\n        pink:\n          \"border-pink-500/25 bg-pink-500/10 text-pink-600 dark:text-pink-400\",\n        dark:\n          \"border-transparent bg-foreground text-background\",\n        light:\n          \"border-transparent bg-secondary text-secondary-foreground\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n);\n\nexport interface BadgeProps\n  extends React.HTMLAttributes<HTMLElement>,\n    VariantProps<typeof badgeVariants> {\n  href?: string;\n  interactive?: boolean;\n  target?: string;\n  rel?: string;\n}\n\nconst Badge = React.forwardRef<HTMLElement, BadgeProps>(\n  ({ className, variant, href, interactive = false, target, rel, children, ...props }, ref) => {\n    const isInteractive = interactive || Boolean(href);\n    const classes = cn(\n      badgeVariants({ variant }),\n      isInteractive && \"cursor-pointer hover:opacity-80 transition-opacity\",\n      className\n    );\n\n    if (href) {\n      return (\n        <a\n          ref={ref as unknown as React.Ref<HTMLAnchorElement>}\n          href={href}\n          target={target}\n          rel={target === \"_blank\" && !rel ? \"noopener noreferrer\" : rel}\n          className={classes}\n          {...(props as React.AnchorHTMLAttributes<HTMLAnchorElement>)}\n        >\n          {children}\n        </a>\n      );\n    }\n\n    return (\n      <span\n        ref={ref as unknown as React.Ref<HTMLSpanElement>}\n        className={classes}\n        {...props}\n      >\n        {children}\n      </span>\n    );\n  }\n);\nBadge.displayName = \"Badge\";\n\nexport { Badge, badgeVariants };\n",
      "type": "registry:ui"
    }
  ]
}