{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "extends": "none",
  "name": "badge",
  "title": "badge",
  "description": "badge",
  "dependencies": [
    "tailwind-variants"
  ],
  "files": [
    {
      "path": "src/components/ui/badge.tsx",
      "content": "import { tv } from 'tailwind-variants'\n\nexport const badgeStyles = tv({\n  base: [\n    'inline-flex items-center gap-x-1.5 py-px font-medium text-xs/5 forced-colors:outline',\n    'border border-(--badge-border,transparent) bg-(--badge-bg) text-(--badge-fg)',\n    'group-hover:bg-(--badge-overlay) group-focus:bg-(--badge-overlay)',\n    '*:data-[slot=icon]:size-3 *:data-[slot=icon]:shrink-0',\n    'duration-200',\n  ],\n  variants: {\n    intent: {\n      primary:\n        '[--badge-bg:var(--color-primary-subtle)] [--badge-fg:var(--color-primary-subtle-fg)] [--badge-overlay:var(--color-primary)]/20',\n      secondary:\n        '[--badge-bg:var(--color-secondary)] [--badge-fg:var(--color-secondary-fg)] [--badge-overlay:var(--color-muted-fg)]/25',\n      success:\n        '[--badge-bg:var(--color-success-subtle)] [--badge-fg:var(--color-success-subtle-fg)] [--badge-overlay:var(--color-success)]/20',\n      info: '[--badge-bg:var(--color-info-subtle)] [--badge-fg:var(--color-info-subtle-fg)] [--badge-overlay:var(--color-sky-500)]/20',\n      warning:\n        '[--badge-bg:var(--color-warning-subtle)] [--badge-fg:var(--color-warning-subtle-fg)] [--badge-overlay:var(--color-warning)]/20',\n      danger:\n        '[--badge-bg:var(--color-danger-subtle)] [--badge-fg:var(--color-danger-subtle-fg)] [--badge-overlay:var(--color-danger)]/20',\n      outline: '[--badge-border:var(--color-border)] [--badge-overlay:var(--color-secondary)]/20',\n    },\n    isCircle: {\n      true: 'rounded-full px-[calc(--spacing(2)-1px)]',\n      false: 'rounded-sm px-[calc(--spacing(1.5)-1px)]',\n    },\n  },\n  defaultVariants: {\n    intent: 'primary',\n    isCircle: true,\n  },\n})\n\nexport interface BadgeProps extends React.ComponentProps<'span'> {\n  intent?: 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'danger' | 'outline'\n  isCircle?: boolean\n}\n\nexport function Badge({ intent, isCircle, className, ...props }: BadgeProps) {\n  return <span {...props} className={badgeStyles({ intent, isCircle, className })} />\n}\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}