{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "dependencies": [
    "@base-ui/react@1.8.0"
  ],
  "description": "A glass bubble on hover and focus, positioned by Base UI so it stays on screen.",
  "docs": "Two steps after installing: import the copied stylesheet once at your app entry — it lands at `styles/liquefy-ui.css` — or `@import` it from your global CSS *before* `tailwindcss`, so Tailwind utilities keep winning over component styles. Then wrap the tree in `<LiquefyProvider>`, which is where every component reads its tokens from. Every copied file already carries its own 'use client' directive. Full documentation: https://liquefy-ui.com/#/docs/installation",
  "files": [
    {
      "content": "'use client'\n\nimport { Tooltip } from '@base-ui/react/tooltip'\nimport type { CSSProperties, ReactElement, ReactNode } from 'react'\nimport { useLiquefyPortalContainer } from '@/lib/provider'\nimport { useLiquidStyles, type LiquidStyleProps } from '@/lib/styles-prop'\n\n// Base UI brings the parts a hand-rolled tooltip almost never gets right: the\n// bubble flips and shifts to stay on screen, Escape dismisses it, focus and\n// hover share one delay, and touch does not leave it stuck open.\n\nexport type LiquidTooltipProps = LiquidStyleProps & {\n  children: ReactElement<Record<string, unknown>>\n  className?: string\n  content: ReactNode\n  delay?: number\n  placement?: 'top' | 'bottom' | 'left' | 'right'\n  style?: CSSProperties\n}\n\nexport const LiquidTooltip = ({\n  children,\n  className,\n  content,\n  delay = 120,\n  placement = 'top',\n  style,\n  styles,\n}: LiquidTooltipProps) => {\n  const portalContainer = useLiquefyPortalContainer()\n  // The wrapper stays the layout box, so className/style/styles keep meaning the\n  // same thing they did before the bubble moved into a portal.\n  const root = useLiquidStyles('lq-tooltip', { className, style, styles })\n\n  return (\n    <span className={root.className} style={root.style}>\n      <Tooltip.Root>\n        <Tooltip.Trigger delay={delay} render={children} />\n        <Tooltip.Portal container={portalContainer ?? undefined}>\n          <Tooltip.Positioner className=\"lq-tooltip__positioner\" side={placement} sideOffset={8}>\n            <Tooltip.Popup className=\"lq-tooltip__bubble\">{content}</Tooltip.Popup>\n          </Tooltip.Positioner>\n        </Tooltip.Portal>\n      </Tooltip.Root>\n    </span>\n  )\n}\n",
      "path": "registry/liquid-tooltip.tsx",
      "type": "registry:ui"
    }
  ],
  "name": "liquid-tooltip",
  "registryDependencies": [
    "https://liquefy-ui.com/r/liquefy-ui.json",
    "https://liquefy-ui.com/r/provider.json",
    "https://liquefy-ui.com/r/styles-prop.json"
  ],
  "title": "LiquidTooltip",
  "type": "registry:ui"
}
