{"$schema":"https://ui.shadcn.com/schema/registry-item.json","author":"Eduardo Calvo <edu@smoothui.dev>","css":{},"dependencies":["@base-ui/react","motion"],"description":"Animated Tooltip component for SmoothUI with Base UI / Radix twins and Motion fade/scale.","devDependencies":[],"files":[{"content":"\"use client\";\n\nimport { Tooltip as TooltipPrimitive } from \"@base-ui/react/tooltip\";\nimport { cn } from \"@/lib/utils\";\nimport {\n  type ComponentProps,\n  isValidElement,\n  type ReactElement,\n  type ReactNode,\n  useState,\n} from \"react\";\n\nconst DEFAULT_DELAY = 400;\n\nexport interface TooltipProps {\n  /** Trigger element */\n  children: ReactNode;\n  /** Additional CSS class names for the tooltip content */\n  className?: string;\n  /** Tooltip label / content */\n  content: ReactNode;\n  /** Hover open delay in ms */\n  delay?: number;\n  /** Callback when the open state changes */\n  onOpenChange?: (open: boolean) => void;\n  /** Controlled open state */\n  open?: boolean;\n  /** Preferred side of the trigger */\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n  /** Distance in px from the trigger */\n  sideOffset?: number;\n}\n\nexport interface TooltipContentProps {\n  /** Tooltip label / content */\n  children?: ReactNode;\n  /** Additional CSS class names */\n  className?: string;\n  /** Preferred side of the trigger */\n  side?: \"top\" | \"right\" | \"bottom\" | \"left\";\n  /** Distance in px from the trigger */\n  sideOffset?: number;\n}\n\nconst POPUP_CLASS =\n  \"origin-[var(--transform-origin)] rounded-md border overlay-surface bg-popover px-3 py-1.5 text-popover-foreground text-xs outline-none transition-[opacity,transform] duration-150 data-[starting-style]:scale-95 data-[starting-style]:opacity-0 data-[ending-style]:scale-95 data-[ending-style]:opacity-0\";\n\ntype TriggerComponent = (props: {\n  children?: ReactNode;\n  delay?: number;\n  render?: ReactElement;\n}) => ReactElement | null;\n\nconst renderTrigger = (\n  Trigger: TriggerComponent,\n  trigger: ReactNode,\n  delay?: number\n) => {\n  if (isValidElement(trigger)) {\n    return <Trigger delay={delay} render={trigger as ReactElement} />;\n  }\n  return <Trigger delay={delay}>{trigger}</Trigger>;\n};\n\nexport const TooltipProvider = ({\n  delay = DEFAULT_DELAY,\n  ...props\n}: ComponentProps<typeof TooltipPrimitive.Provider>) => (\n  <TooltipPrimitive.Provider delay={delay} {...props} />\n);\n\nexport const TooltipTrigger = TooltipPrimitive.Trigger;\n\n/**\n * Tooltip content — Portal + Positioner + Popup.\n * CSS enter/exit via Base UI starting/ending styles (no Motion — Popup\n * must receive Base UI's open styles or it stays `display: none`).\n */\nexport const TooltipContent = ({\n  className,\n  side = \"top\",\n  sideOffset = 4,\n  children,\n}: TooltipContentProps) => (\n  <TooltipPrimitive.Portal>\n    <TooltipPrimitive.Positioner\n      className=\"z-50 outline-none\"\n      data-slot=\"tooltip-positioner\"\n      side={side}\n      sideOffset={sideOffset}\n    >\n      <TooltipPrimitive.Popup\n        className={cn(POPUP_CLASS, className)}\n        data-slot=\"tooltip-content\"\n      >\n        {children}\n      </TooltipPrimitive.Popup>\n    </TooltipPrimitive.Positioner>\n  </TooltipPrimitive.Portal>\n);\n\n/**\n * SmoothUI Tooltip — Base UI twin (default).\n * Convenience wraps Provider + Root + Trigger + Content.\n */\nexport default function Tooltip({\n  children,\n  content,\n  side = \"top\",\n  sideOffset = 4,\n  delay = DEFAULT_DELAY,\n  className,\n  open,\n  onOpenChange,\n}: TooltipProps) {\n  const [internalOpen, setInternalOpen] = useState(false);\n  const isControlled = open !== undefined;\n  const isOpen = isControlled ? open : internalOpen;\n\n  const handleOpenChange = (next: boolean) => {\n    if (!isControlled) {\n      setInternalOpen(next);\n    }\n    onOpenChange?.(next);\n  };\n\n  return (\n    <TooltipProvider delay={delay}>\n      <TooltipPrimitive.Root onOpenChange={handleOpenChange} open={isOpen}>\n        {renderTrigger(TooltipPrimitive.Trigger, children, delay)}\n        <TooltipContent\n          className={className}\n          side={side}\n          sideOffset={sideOffset}\n        >\n          {content}\n        </TooltipContent>\n      </TooltipPrimitive.Root>\n    </TooltipProvider>\n  );\n}\n","path":"index.tsx","target":"components/smoothui/tooltip/index.tsx","type":"registry:ui"}],"name":"tooltip","registryDependencies":["https://smoothui.dev/r/tokens.json"],"title":"Tooltip","type":"registry:ui"}