{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "glowing-badge",
  "title": "Glowing Badge",
  "description": "Badge with an animated pulsing glow dot. Supports status variants: default, success, warning, error, info.",
  "dependencies": [
    "motion"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/components/unlumen/glowing-badge/index.tsx",
      "content": "\"use client\";\n\nimport { type HTMLAttributes } from \"react\";\nimport { motion } from \"motion/react\";\nimport { cn } from \"@/lib/utils\";\n\ntype GlowingBadgeVariant =\n  | \"default\"\n  | \"success\"\n  | \"warning\"\n  | \"error\"\n  | \"info\"\n  | \"neutral\";\n\ninterface GlowingBadgeProps extends HTMLAttributes<HTMLSpanElement> {\n  variant?: GlowingBadgeVariant;\n  pulse?: boolean;\n  dot?: boolean;\n}\n\nconst variantStyles: Record<\n  GlowingBadgeVariant,\n  { badge: string; glow: string; dot: string }\n> = {\n  default: {\n    badge: \"bg-foreground text-background\",\n    glow: \"bg-foreground/30\",\n    dot: \"bg-background\",\n  },\n  neutral: {\n    badge: \"bg-muted text-foreground border-muted\",\n    glow: \"bg-foreground/30\",\n    dot: \"bg-foreground\",\n  },\n  success: {\n    badge: \"bg-emerald-500 text-emerald-100\",\n    glow: \"bg-emerald-500\",\n    dot: \"bg-emerald-200\",\n  },\n  warning: {\n    badge: \"bg-amber-500 text-amber-100\",\n    glow: \"bg-amber-500\",\n    dot: \"bg-amber-200\",\n  },\n  error: {\n    badge: \"bg-red-500 text-red-100\",\n    glow: \"bg-red-500\",\n    dot: \"bg-red-200\",\n  },\n  info: {\n    badge: \"bg-blue-500 text-blue-100\",\n    glow: \"bg-blue-500\",\n    dot: \"bg-blue-200\",\n  },\n};\n\nfunction GlowingBadge({\n  variant = \"default\",\n  pulse = true,\n  dot = true,\n  children,\n  className,\n  ...props\n}: GlowingBadgeProps) {\n  const styles = variantStyles[variant];\n\n  return (\n    <span className=\"relative inline-flex\">\n      <span\n        className={cn(\n          \"absolute inset-0 rounded-full blur-md opacity-60\",\n          styles.glow,\n        )}\n      />\n      <span\n        className={cn(\n          \"relative inline-flex items-center gap-1.5 rounded-full  px-3 py-1 text-xs font-medium\",\n          styles.badge,\n          className,\n        )}\n        {...props}\n      >\n        {dot && (\n          <span className=\"relative flex h-1.5 w-1.5 shrink-0\">\n            {pulse && (\n              <motion.span\n                className={cn(\n                  \"absolute inline-flex h-full w-full rounded-full opacity-75\",\n                  styles.dot,\n                )}\n                animate={{ scale: [1, 2.5, 1], opacity: [0.75, 0, 0.75] }}\n                transition={{\n                  duration: 2,\n                  repeat: Infinity,\n                  ease: \"easeInOut\",\n                }}\n              />\n            )}\n            <span\n              className={cn(\n                \"relative inline-flex h-1.5 w-1.5 rounded-full\",\n                styles.dot,\n              )}\n            />\n          </span>\n        )}\n        {children}\n      </span>\n    </span>\n  );\n}\n\nexport { GlowingBadge };\nexport type { GlowingBadgeProps, GlowingBadgeVariant };\n",
      "type": "registry:ui",
      "target": "components/unlumen-ui/glowing-badge.tsx"
    }
  ],
  "type": "registry:ui"
}