{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "wishlist-button",
  "type": "registry:ui",
  "title": "Wishlist button",
  "description": "A Tailwind heart icon button for product cards that toggles a wishlist state. It sets aria-pressed and switches its label between add and remove.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "https://ui.minidev.pro/r/icon-button.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/wishlist-button.tsx",
      "type": "registry:ui",
      "target": "components/ui/wishlist-button.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { HeartIcon } from \"lucide-react\"\nimport { cn } from \"@/lib/utils\"\nimport { IconButton } from \"@/components/ui/icon-button\"\n\nfunction WishlistButton({\n  active,\n  onToggle,\n  className,\n}: {\n  active?: boolean\n  onToggle?: () => void\n  className?: string\n}) {\n  return (\n    <IconButton\n      type=\"button\"\n      variant=\"outline\"\n      size=\"icon\"\n      data-slot=\"wishlist-button\"\n      aria-pressed={!!active}\n      aria-label={active ? \"Remove from wishlist\" : \"Add to wishlist\"}\n      className={cn(className)}\n      onClick={onToggle}\n    >\n      <HeartIcon className={cn(active && \"fill-danger text-danger\")} />\n    </IconButton>\n  )\n}\nexport { WishlistButton }\n"
    }
  ]
}