{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "product-card-02",
  "type": "registry:block",
  "title": "Product Card 02",
  "files": [
    {
      "path": "src/components/commercn/product-cards/product-card-02.tsx",
      "content": "\"use client\";\n\nimport {\n\tCard,\n\tCardContent,\n\tCardTitle,\n\tCardDescription,\n} from \"@/components/ui/card\";\nimport { Button } from \"@/components/ui/button\";\nimport { Heart } from \"lucide-react\";\nimport { cn } from \"@/lib/utils\";\nimport { useState } from \"react\";\n\nexport function ProductCardTwo() {\n\tconst [isFavorited, setIsFavorited] = useState(false);\n\n\tconst productData = {\n\t\tname: \"Handmade Leather Purple Bag\",\n\t\tcategory: \"wearable\",\n\t\tbio: \"Turning insights into the impact with creative content.\",\n\t\tfollowers: \"2.5K\",\n\t\tfollowing: \"522\",\n\t\tprofileImage:\n\t\t\t\"https://images.unsplash.com/photo-1566150905458-1bf1fc113f0d?ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80&w=1742\",\n\t\tisVerified: true,\n\t\tisFollowing: false,\n\t\tprice: 180.0,\n\t};\n\n\treturn (\n\t\t<Card\n\t\t\tclassName={cn(\n\t\t\t\t\"w-full max-w-[320px] mx-auto border-0 rounded-3xl not-prose overflow-hidden p-0\",\n\t\t\t)}\n\t\t>\n\t\t\t<CardContent className=\"p-0 overflow-hidden\">\n\t\t\t\t{/* Profile Image */}\n\t\t\t\t<div className=\"aspect-[3/2] h-full relative overflow-hidden\">\n\t\t\t\t\t<img\n\t\t\t\t\t\tsrc={productData.profileImage}\n\t\t\t\t\t\talt={productData.name}\n\t\t\t\t\t\tclassName=\"w-full h-full object-cover\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{/* Profile Info */}\n\t\t\t\t<div className=\"p-6 -mt-12 z-10 relative bg-card rounded-t-3xl\">\n\t\t\t\t\t{/* Name and Verification */}\n\t\t\t\t\t<div className=\"flex items-center justify-between gap-4 mb-4\">\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<CardTitle>{productData.name}</CardTitle>\n\t\t\t\t\t\t\t<CardDescription>{productData.category}</CardDescription>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<p className=\"text-2xl font-bold\">${productData.price}</p>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/* Follow Button */}\n\t\t\t\t\t<div className=\"flex items-center justify-between gap-2\">\n\t\t\t\t\t\t<Button className=\"flex-1\">Buy Now</Button>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\t\t\tonClick={() => setIsFavorited(!isFavorited)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Heart\n\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\"w-6 h-6 transition-colors\",\n\t\t\t\t\t\t\t\t\tisFavorited\n\t\t\t\t\t\t\t\t\t\t? \"fill-red-500 text-red-500\"\n\t\t\t\t\t\t\t\t\t\t: \"text-muted-foreground hover:text-red-500\",\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</CardContent>\n\t\t</Card>\n\t);\n}\n",
      "type": "registry:component"
    }
  ]
}