{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "badge",
  "title": "Badge",
  "description": "A badge component with semantic color variants.",
  "dependencies": [
    "class-variance-authority"
  ],
  "files": [
    {
      "path": "registry/default/ui/badge.tsx",
      "content": "import { cva, type VariantProps } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\nconst badgeVariants = cva(\n  'items-center flex whitespace-nowrap w-fit border border-transparent rounded-full font-medium text-[var(--tag-foreground)] transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 font-medium font-mono uppercase tracking-wide leading-none',\n  {\n    variants: {\n      variant: {\n        primary: 'bg-primary text-primary-foreground',\n        secondary: 'bg-secondary text-secondary-foreground',\n        outline: 'border-border text-foreground',\n        emerald: 'bg-emerald-600 text-emerald-200',\n        slate: 'bg-emerald-300 text-emerald-800',\n        lilac: 'bg-lilac-400 text-lilac-800',\n        gold: 'bg-gold-500 text-emerald-100',\n        cobalt: 'bg-cobalt-500 text-emerald-100',\n        cobaltDark: 'bg-cobalt-700 text-emerald-100',\n        mint: 'bg-mint-500 text-mint-900',\n        valid: 'bg-valid text-valid-foreground',\n        destructive: 'bg-destructive text-destructive-foreground',\n        info: 'bg-info text-info-foreground',\n        warning: 'bg-warning text-warning-foreground',\n\n        red: 'bg-red-background text-red-foreground',\n        orange: 'bg-orange-background text-orange-foreground',\n        amber: 'bg-amber-background text-amber-foreground',\n        yellow: 'bg-yellow-background text-yellow-foreground',\n        lime: 'bg-lime-background text-lime-foreground',\n        green: 'bg-green-background text-green-foreground',\n        teal: 'bg-teal-background text-teal-foreground',\n        cyan: 'bg-cyan-background text-cyan-foreground',\n        sky: 'bg-sky-background text-sky-foreground',\n        blue: 'bg-blue-background text-blue-foreground',\n        indigo: 'bg-indigo-background text-indigo-foreground',\n        violet: 'bg-violet-background text-violet-foreground',\n        purple: 'bg-purple-background text-purple-foreground',\n        fuchsia: 'bg-fuchsia-background text-fuchsia-foreground',\n        pink: 'bg-pink-background text-pink-foreground',\n        rose: 'bg-rose-background text-rose-foreground',\n        zinc: 'bg-zinc-background text-zinc-foreground',\n      },\n      size: {\n        sm: 'h-5 px-1.5 gap-1 text-[10px]/none',\n        md: 'h-6 px-2.5 gap-2 text-xs/none',\n        lg: 'h-7 px-3 gap-2 text-sm/none',\n      },\n      isDisabled: {\n        true: 'cursor-not-allowed opacity-50',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n      size: 'md',\n    },\n  }\n);\n\nexport type TBadgeProps = React.HTMLAttributes<HTMLDivElement> &\n  VariantProps<typeof badgeVariants>;\n\nfunction Badge({\n  className,\n  variant,\n  size,\n  isDisabled,\n  ...props\n}: TBadgeProps) {\n  return (\n    <div\n      data-slot=\"badge\"\n      className={cn(badgeVariants({ variant, size, isDisabled }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { Badge, badgeVariants };\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}