{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "badge",
  "title": "Badge",
  "author": "Zubeyr <https://zubeyr.dev>",
  "description": "Status pills for tables and lists: neutral, success, warning, attention, critical and info, with a filled dot or hollow ring.",
  "files": [
    {
      "path": "registry/dashboard/components/badge/badge.tsx",
      "content": "import { cn } from '@/lib/utils'\n\nconst tones = {\n  neutral: 'bg-foreground/8 text-muted-foreground',\n  success: 'bg-emerald-100 text-emerald-900 dark:bg-emerald-500/15 dark:text-emerald-300',\n  warning: 'bg-yellow-200 text-yellow-900 dark:bg-yellow-400/15 dark:text-yellow-200',\n  attention: 'bg-orange-200 text-orange-900 dark:bg-orange-400/15 dark:text-orange-200',\n  critical: 'bg-red-100 text-red-900 dark:bg-red-500/15 dark:text-red-300',\n  info: 'bg-sky-100 text-sky-900 dark:bg-sky-500/15 dark:text-sky-300',\n}\n\ntype BadgeProps = React.ComponentProps<'span'> & {\n  tone?: keyof typeof tones\n  indicator?: 'dot' | 'ring' | 'none'\n}\n\nexport function Badge({\n  tone = 'neutral',\n  indicator = 'none',\n  className,\n  children,\n  ...props\n}: BadgeProps) {\n  return (\n    <span\n      className={cn(\n        'inline-flex h-6 items-center gap-1.5 rounded-lg px-2 text-[13px] leading-none font-medium whitespace-nowrap',\n        tones[tone],\n        className,\n      )}\n      {...props}\n    >\n      {indicator !== 'none' && (\n        <span\n          aria-hidden\n          className={cn(\n            'size-2 shrink-0 rounded-full',\n            indicator === 'dot' ? 'bg-current opacity-60' : 'border-[1.5px] border-current',\n          )}\n        />\n      )}\n      {children}\n    </span>\n  )\n}\n",
      "type": "registry:component",
      "target": "components/dashboard/badge.tsx"
    }
  ],
  "meta": {
    "scenario": "dashboard",
    "kind": "components"
  },
  "categories": [
    "dashboard",
    "status",
    "pills"
  ],
  "type": "registry:component"
}