{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tooltip-12",
  "type": "registry:component",
  "title": "Tooltip 12",
  "description": "Tooltip 12. A small popup that appears when a user hovers over or focuses on an element, providing additional information or context.",
  "dependencies": [],
  "registryDependencies": [
    "avatar",
    "button",
    "hover-card"
  ],
  "files": [
    {
      "path": "components/watermelon/tooltip-12.tsx",
      "type": "registry:component",
      "content": "import {\n  Avatar,\n  AvatarFallback,\n  AvatarImage,\n} from '@/components/base-ui/avatar';\nimport { Button } from '@/components/base-ui/button';\nimport {\n  HoverCard,\n  HoverCardContent,\n  HoverCardTrigger,\n} from '@/components/base-ui/hover-card';\n\nconst Tooltip12 = () => {\n  return (\n    <HoverCard openDelay={0} closeDelay={0}>\n      <HoverCardTrigger asChild>\n        <Button variant=\"link\">User Overview</Button>\n      </HoverCardTrigger>\n\n      <HoverCardContent className=\"w-fit\">\n        <div className=\"flex items-center gap-2\">\n          <Avatar className=\"size-10\">\n            <AvatarImage\n              src=\"https://github.com/vanshpatel.png\"\n              alt=\"Vansh Patel\"\n            />\n            <AvatarFallback className=\"text-xs\">AC</AvatarFallback>\n          </Avatar>\n\n          <div className=\"flex flex-col gap-0.5\">\n            <div className=\"text-sm font-medium\">Vansh Patel</div>\n            <div className=\"text-muted-foreground text-xs\">\n              Product Designer\n            </div>\n            <div className=\"text-xs\">Active now • 124 tasks completed</div>\n          </div>\n        </div>\n      </HoverCardContent>\n    </HoverCard>\n  );\n};\n\nexport default Tooltip12;\n"
    }
  ]
}