{"name":"tooltip","type":"registry:ui","files":[{"path":"tooltip.tsx","type":"registry:ui","content":"\"use client\"\n\nimport { Tooltip as TooltipPrimitive } from \"@base-ui-components/react/tooltip\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst TooltipProvider = TooltipPrimitive.Provider\n\nconst Tooltip = TooltipPrimitive.Root\n\nfunction TooltipTrigger(props: TooltipPrimitive.Trigger.Props) {\n  return <TooltipPrimitive.Trigger data-slot=\"tooltip-trigger\" {...props} />\n}\n\nfunction TooltipPopup({\n  className,\n  arrowClassName,\n  align = \"center\",\n  sideOffset = 4,\n  side = \"top\",\n  showArrow = true,\n  children,\n  ...props\n}: TooltipPrimitive.Popup.Props & {\n  align?: TooltipPrimitive.Positioner.Props[\"align\"]\n  side?: TooltipPrimitive.Positioner.Props[\"side\"]\n  sideOffset?: TooltipPrimitive.Positioner.Props[\"sideOffset\"]\n  arrowClassName?: string\n  showArrow?: boolean\n}) {\n  return (\n    <TooltipPrimitive.Portal>\n      <TooltipPrimitive.Positioner\n        data-slot=\"tooltip-positioner\"\n        className=\"z-[var(--hui-z-index-portal)]\"\n        sideOffset={sideOffset}\n        align={align}\n        side={side}\n      >\n        <TooltipPrimitive.Popup\n          data-slot=\"tooltip-content\"\n          className={cn(\n            \"relative box-border w-fit max-w-[400px] rounded-[var(--hui-radius-2)] border-[0.5px] border-[var(--hui-color-border-base-primary)] bg-[var(--hui-color-background-base-primary)] px-[var(--hui-space-3)] py-[var(--hui-space-2)] text-[var(--hui-color-foreground-base-primary)] shadow-[var(--hui-shadow-soft)] [font-size:var(--hui-font-size-mini)] [font-weight:var(--hui-font-weight-medium)] [letter-spacing:var(--hui-letter-spacing-mini)] [line-height:var(--hui-line-height-mini)] [transition:opacity_var(--hui-duration-fast)_var(--hui-ease-out)] data-ending-style:opacity-0 data-instant:[transition-duration:0ms] data-starting-style:opacity-0 motion-safe:[transition:opacity_var(--hui-duration-fast)_var(--hui-ease-out),transform_var(--hui-duration-fast)_var(--hui-ease-out)] motion-safe:[&[data-side=top][data-starting-style]]:[transform:translateY(calc(-1*var(--hui-space-1)))] motion-safe:[&[data-side=top][data-ending-style]]:[transform:translateY(calc(-1*var(--hui-space-1)))] motion-safe:[&[data-side=right][data-starting-style]]:[transform:translateX(var(--hui-space-1))] motion-safe:[&[data-side=right][data-ending-style]]:[transform:translateX(var(--hui-space-1))] motion-safe:[&[data-side=bottom][data-starting-style]]:[transform:translateY(var(--hui-space-1))] motion-safe:[&[data-side=bottom][data-ending-style]]:[transform:translateY(var(--hui-space-1))] motion-safe:[&[data-side=left][data-starting-style]]:[transform:translateX(calc(-1*var(--hui-space-1)))] motion-safe:[&[data-side=left][data-ending-style]]:[transform:translateX(calc(-1*var(--hui-space-1)))] motion-safe:[&[data-side=top][data-align=start][data-starting-style]]:[transform:translate(calc(-1*var(--hui-space-1)),calc(-1*var(--hui-space-1)))] motion-safe:[&[data-side=top][data-align=start][data-ending-style]]:[transform:translate(calc(-1*var(--hui-space-1)),calc(-1*var(--hui-space-1)))] motion-safe:[&[data-side=top][data-align=end][data-starting-style]]:[transform:translate(var(--hui-space-1),calc(-1*var(--hui-space-1)))] motion-safe:[&[data-side=top][data-align=end][data-ending-style]]:[transform:translate(var(--hui-space-1),calc(-1*var(--hui-space-1)))] motion-safe:[&[data-side=bottom][data-align=start][data-starting-style]]:[transform:translate(calc(-1*var(--hui-space-1)),var(--hui-space-1))] motion-safe:[&[data-side=bottom][data-align=start][data-ending-style]]:[transform:translate(calc(-1*var(--hui-space-1)),var(--hui-space-1))] motion-safe:[&[data-side=bottom][data-align=end][data-starting-style]]:[transform:translate(var(--hui-space-1),var(--hui-space-1))] motion-safe:[&[data-side=bottom][data-align=end][data-ending-style]]:[transform:translate(var(--hui-space-1),var(--hui-space-1))]\",\n            className\n          )}\n          {...props}\n        >\n          {children}\n        </TooltipPrimitive.Popup>\n        {showArrow && <TooltipArrow className={arrowClassName} />}\n      </TooltipPrimitive.Positioner>\n    </TooltipPrimitive.Portal>\n  )\n}\n\nfunction TooltipArrow({\n  className,\n  children,\n  ...props\n}: TooltipPrimitive.Arrow.Props) {\n  return (\n    <TooltipPrimitive.Arrow\n      data-slot=\"tooltip-arrow\"\n      className={cn(\n        \"z-[var(--hui-z-index-portal)] [filter:drop-shadow(0_1px_0_var(--hui-color-border-base-primary))_drop-shadow(0_1px_1px_var(--hui-color-border-base-primary))] data-[side=top]:bottom-[-7px] data-[side=bottom]:top-0 data-[side=bottom]:-translate-y-full data-[side=bottom]:rotate-180 data-[side=left]:right-0 data-[side=left]:translate-x-full data-[side=left]:-translate-y-1/2 data-[side=left]:-rotate-90 data-[side=inline-start]:right-0 data-[side=inline-start]:translate-x-full data-[side=inline-start]:-translate-y-1/2 data-[side=inline-start]:-rotate-90 data-[side=right]:left-0 data-[side=right]:-translate-x-full data-[side=right]:-translate-y-1/2 data-[side=right]:rotate-90 data-[side=inline-end]:left-0 data-[side=inline-end]:-translate-x-full data-[side=inline-end]:-translate-y-1/2 data-[side=inline-end]:rotate-90 [&_svg]:text-[var(--hui-color-background-base-primary)]\",\n        className\n      )}\n      {...props}\n    >\n      {children ?? (\n        <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\">\n          <path d=\"M0 0H20L10 10L0 0Z\" fill=\"currentColor\" />\n        </svg>\n      )}\n    </TooltipPrimitive.Arrow>\n  )\n}\n\nexport {\n  TooltipProvider,\n  Tooltip,\n  TooltipTrigger,\n  TooltipArrow,\n  TooltipPopup,\n  TooltipPopup as TooltipContent,\n}\n","target":"components/ui/tooltip.tsx"}],"dependencies":["@base-ui-components/react"]}