31:I[393222,["/_next/static/immutable/chunks/1ghzvo2v3e9it.js","/_next/static/immutable/chunks/2z12yfji59qij.js","/_next/static/immutable/chunks/2kz55mtt4gg9-.js","/_next/static/immutable/chunks/2wh1of756ayx2.js","/_next/static/immutable/chunks/1hrni9oh_1ydl.js","/_next/static/immutable/chunks/0c8a4jz2glq2z.js","/_next/static/immutable/chunks/2_pnkmjnqn60o.js","/_next/static/immutable/chunks/2go1j71-0poyv.js","/_next/static/immutable/chunks/0-5r2xowg15yg.js","/_next/static/immutable/chunks/1t7ajpe315x-6.js","/_next/static/immutable/chunks/14k-28a04j7wc.js","/_next/static/immutable/chunks/0v6d2j1fs6vdq.js","/_next/static/immutable/chunks/16plp8w2vixfe.js","/_next/static/immutable/chunks/135kivfvlqp26.js","/_next/static/immutable/chunks/3ovl2hhpccn0u.js","/_next/static/immutable/chunks/0r21vgnmwirm_.js","/_next/static/immutable/chunks/3egckb77v2ujh.js"],"CopyButton"] 32:Tb13,"use client" import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip" import { cn } from "cn" function TooltipProvider({ delay = 0, ...props }: TooltipPrimitive.Provider.Props) { return ( ) } function Tooltip({ ...props }: TooltipPrimitive.Root.Props) { return } function TooltipTrigger({ ...props }: TooltipPrimitive.Trigger.Props) { return } function TooltipContent({ className, side = "top", sideOffset = 4, align = "center", alignOffset = 0, children, ...props }: TooltipPrimitive.Popup.Props & Pick< TooltipPrimitive.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset" >) { return ( {children} ) } export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }33:T5566,

"use client"

import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip"
import { cn } from "cn"

function TooltipProvider({
  delay = 0,
  ...props
}: TooltipPrimitive.Provider.Props) {
  return (
    <TooltipPrimitive.Provider
      data-slot="tooltip-provider"
      delay={delay}
      {...props}
    />
  )
}

function Tooltip({ ...props }: TooltipPrimitive.Root.Props) {
  return <TooltipPrimitive.Root data-slot="tooltip" {...props} />
}

function TooltipTrigger({ ...props }: TooltipPrimitive.Trigger.Props) {
  return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
}

function TooltipContent({
  className,
  side = "top",
  sideOffset = 4,
  align = "center",
  alignOffset = 0,
  children,
  ...props
}: TooltipPrimitive.Popup.Props &
  Pick<
    TooltipPrimitive.Positioner.Props,
    "align" | "alignOffset" | "side" | "sideOffset"
  >) {
  return (
    <TooltipPrimitive.Portal>
      <TooltipPrimitive.Positioner
        align={align}
        alignOffset={alignOffset}
        side={side}
        sideOffset={sideOffset}
        className="isolate z-50"
      >
        <TooltipPrimitive.Popup
          data-slot="tooltip-content"
          className={cn(
            "z-50 inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
            className
          )}
          {...props}
        >
          {children}
          <TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" />
        </TooltipPrimitive.Popup>
      </TooltipPrimitive.Positioner>
    </TooltipPrimitive.Portal>
  )
}

export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }

2f:["$","div","components/ui/tooltip.tsx",{"className":"group relative overflow-hidden rounded-xl border bg-card","children":[["$","div",null,{"className":"flex h-10 items-center border-b px-4 font-mono text-xs text-muted-foreground","children":"components/ui/tooltip.tsx"}],["$","$L31",null,{"value":"$32","className":"absolute top-2 right-2 z-10"}],["$","div",null,{"className":"docs-code max-h-112 overflow-auto text-[13px]","dangerouslySetInnerHTML":{"__html":"$33"}}]]}]

Tooltip

Installation