{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "comp-101",
  "type": "registry:component",
  "registryDependencies": [
    "https://coss.com/origin/r/toggle.json",
    "https://coss.com/origin/r/tooltip.json"
  ],
  "files": [
    {
      "path": "registry/default/components/comp-101.tsx",
      "content": "\"use client\";\n\nimport { BookmarkIcon } from \"lucide-react\";\nimport { useState } from \"react\";\n\nimport { Toggle } from \"@/registry/default/ui/toggle\";\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n} from \"@/registry/default/ui/tooltip\";\n\nexport default function Component() {\n  const [bookmarked, setBookmarked] = useState<boolean>(false);\n  return (\n    <TooltipProvider>\n      <Tooltip>\n        <TooltipTrigger asChild>\n          <div>\n            <Toggle\n              aria-label=\"Bookmark this\"\n              className=\"group size-9 p-0 hover:bg-indigo-50 hover:text-indigo-500 data-[state=on]:bg-indigo-50 data-[state=on]:text-indigo-500\"\n              onPressedChange={setBookmarked}\n              pressed={bookmarked}\n            >\n              <BookmarkIcon aria-hidden=\"true\" size={16} />\n            </Toggle>\n          </div>\n        </TooltipTrigger>\n        <TooltipContent className=\"px-2 py-1 text-xs\">\n          <p>{bookmarked ? \"Remove bookmark\" : \"Bookmark this\"}</p>\n        </TooltipContent>\n      </Tooltip>\n    </TooltipProvider>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "meta": {
    "style": 2,
    "tags": [
      "button",
      "toggle"
    ]
  }
}