{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "comp-365",
  "type": "registry:component",
  "title": "Comp 365",
  "description": "Comp 365",
  "files": [
    {
      "path": "registry/ui-basic/comp-365.tsx",
      "content": "import {\n\tHoverCard,\n\tHoverCardContent,\n\tHoverCardTrigger,\n} from \"@/components/ui/hover-card\";\n\nexport default function HoverCardDemo() {\n\treturn (\n\t\t<div className=\"max-w-md text-sm\">\n\t\t\t<HoverCard>\n\t\t\t\t<HoverCardTrigger asChild>\n\t\t\t\t\t<a className=\"flex size-16 overflow-hidden rounded-md\" href=\"#\">\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tclassName=\"size-full object-cover\"\n\t\t\t\t\t\t\tsrc=\"/dialog-content.png\"\n\t\t\t\t\t\t\twidth={382}\n\t\t\t\t\t\t\theight={216}\n\t\t\t\t\t\t\talt=\"Content image\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</a>\n\t\t\t\t</HoverCardTrigger>\n\t\t\t\t<HoverCardContent className=\"w-[320px]\" showArrow>\n\t\t\t\t\t<div className=\"space-y-3\">\n\t\t\t\t\t\t<div className=\"space-y-1\">\n\t\t\t\t\t\t\t<h2 className=\"font-semibold\">\n\t\t\t\t\t\t\t\tBuilding a Design System with Next.js and Tailwind CSS\n\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t<p className=\"text-muted-foreground text-sm\">\n\t\t\t\t\t\t\t\tLearn how to build a comprehensive design system using\n\t\t\t\t\t\t\t\tTailwind CSS, including component architecture, and\n\t\t\t\t\t\t\t\ttheme customization.\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div className=\"text-muted-foreground flex items-center gap-2 text-xs\">\n\t\t\t\t\t\t\t<span>8 min read</span>\n\t\t\t\t\t\t\t<span>·</span>\n\t\t\t\t\t\t\t<span>Updated 2 days ago</span>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</HoverCardContent>\n\t\t\t</HoverCard>\n\t\t</div>\n\t);\n}\n",
      "type": "registry:ui"
    }
  ]
}