{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "comp-129",
  "type": "registry:component",
  "registryDependencies": [
    "https://coss.com/origin/r/badge.json",
    "https://coss.com/origin/r/button.json"
  ],
  "files": [
    {
      "path": "registry/default/components/comp-129.tsx",
      "content": "\"use client\";\n\nimport { BellIcon } from \"lucide-react\";\nimport { useState } from \"react\";\n\nimport { Badge } from \"@/registry/default/ui/badge\";\nimport { Button } from \"@/registry/default/ui/button\";\n\nexport default function Component() {\n  const [count, setCount] = useState(3);\n\n  const handleClick = () => {\n    setCount(0);\n  };\n\n  return (\n    <Button\n      aria-label=\"Notifications\"\n      className=\"relative\"\n      onClick={handleClick}\n      size=\"icon\"\n      variant=\"outline\"\n    >\n      <BellIcon aria-hidden=\"true\" size={16} />\n      {count > 0 && (\n        <Badge className=\"-top-2 -translate-x-1/2 absolute left-full min-w-5 px-1\">\n          {count > 99 ? \"99+\" : count}\n        </Badge>\n      )}\n    </Button>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "meta": {
    "style": 2,
    "tags": [
      "button",
      "dropdown",
      "notification"
    ]
  }
}