{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "project-card-shadcnui",
  "type": "registry:component",
  "title": "Project Card",
  "description": "Glassmorphism project card with links, tags, and hover effects",
  "dependencies": [
    "framer-motion",
    "react"
  ],
  "files": [
    {
      "path": "@uitripled/react-shadcn/src/components/components/cards/shadcnui/project-card.tsx",
      "content": "\"use client\";\n\nimport { Badge } from \"@/components/ui/badge\";\nimport { Card } from \"@/components/ui/card\";\nimport { cn } from \"@/lib/utils\";\nimport { motion } from \"framer-motion\";\nimport { ExternalLink, Github } from \"lucide-react\";\n\ninterface ProjectCardProps {\n  title?: string;\n  description?: string;\n  tags?: string[];\n  image?: string;\n  links?: {\n    demo?: string;\n    github?: string;\n  };\n  className?: string;\n}\n\nconst defaultProject = {\n  title: \"E-Commerce Platform\",\n  description:\n    \"Full-stack online store with payment integration and inventory management\",\n  tags: [\"React\", \"Node.js\", \"PostgreSQL\", \"Stripe\"],\n  image:\n    \"https://images.unsplash.com/photo-1661956602116-aa6865609028?w=800&q=80\",\n  links: { demo: \"#\", github: \"#\" },\n};\n\nexport function ProjectCard({\n  title = defaultProject.title,\n  description = defaultProject.description,\n  tags = defaultProject.tags,\n  image = defaultProject.image,\n  links = defaultProject.links,\n  className,\n}: ProjectCardProps) {\n  return (\n    <motion.div\n      initial={{ opacity: 0, y: 20 }}\n      animate={{ opacity: 1, y: 0 }}\n      transition={{ duration: 0.4 }}\n      className={cn(\"w-full max-w-[400px]\", className)}\n    >\n      <Card className=\"group relative h-full overflow-hidden rounded-2xl border-border/50 bg-card/80 backdrop-blur-sm transition-all duration-300 hover:border-primary/50 hover:shadow-xl hover:shadow-primary/10\">\n        <div className=\"relative aspect-video overflow-hidden\">\n          <motion.img\n            src={image}\n            alt={title}\n            className=\"h-full w-full object-cover transition-transform duration-500 group-hover:scale-110\"\n          />\n          <div className=\"absolute inset-0 bg-gradient-to-t from-background/90 via-background/20 to-transparent opacity-0 transition-opacity duration-300 group-hover:opacity-100\" />\n\n          <div className=\"absolute inset-0 flex items-center justify-center gap-4 opacity-0 transition-all duration-300 group-hover:opacity-100\">\n            {links?.demo && (\n              <motion.a\n                href={links.demo}\n                whileHover={{ scale: 1.1 }}\n                whileTap={{ scale: 0.95 }}\n                className=\"flex h-10 w-10 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-lg shadow-primary/25 backdrop-blur-md\"\n                title=\"View Demo\"\n              >\n                <ExternalLink className=\"h-5 w-5\" />\n              </motion.a>\n            )}\n            {links?.github && (\n              <motion.a\n                href={links.github}\n                whileHover={{ scale: 1.1 }}\n                whileTap={{ scale: 0.95 }}\n                className=\"flex h-10 w-10 items-center justify-center rounded-full bg-secondary text-secondary-foreground shadow-lg backdrop-blur-md\"\n                title=\"View Code\"\n              >\n                <Github className=\"h-5 w-5\" />\n              </motion.a>\n            )}\n          </div>\n        </div>\n\n        <div className=\"p-5\">\n          <h3 className=\"mb-2 text-xl font-semibold tracking-tight text-foreground transition-colors group-hover:text-primary\">\n            {title}\n          </h3>\n          <p className=\"mb-4 line-clamp-2 text-sm text-muted-foreground\">\n            {description}\n          </p>\n          <div className=\"flex flex-wrap gap-2\">\n            {tags?.map((tag, index) => (\n              <Badge\n                key={index}\n                variant=\"secondary\"\n                className=\"bg-secondary/50 px-2 py-0.5 text-xs font-normal hover:bg-secondary\"\n              >\n                {tag}\n              </Badge>\n            ))}\n          </div>\n        </div>\n      </Card>\n    </motion.div>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/uitripled/project-card-shadcnui.tsx"
    }
  ]
}