TooltipContent() — ui Function Reference

Architecture documentation for the TooltipContent() function in tooltip.tsx from the ui codebase.

Function tsx ComponentRegistry ChartRegistry

Entity Profile

ComponentRegistry→ ChartRegistry→ TooltipContent() — ui Function Reference

Dependency Diagram

graph TD
  1d02b4cb_4fc8_a2fc_c842_c677926147a9["TooltipContent()"]
  0a32e93b_a23e_560e_ec13_6be84b0e8472["tooltip.tsx"]
  1d02b4cb_4fc8_a2fc_c842_c677926147a9 -->|defined in| 0a32e93b_a23e_560e_ec13_6be84b0e8472
  style 1d02b4cb_4fc8_a2fc_c842_c677926147a9 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/registry/bases/radix/ui/tooltip.tsx lines 33–55

function TooltipContent({
  className,
  sideOffset = 0,
  children,
  ...props
}: React.ComponentProps<typeof TooltipPrimitive.Content>) {
  return (
    <TooltipPrimitive.Portal>
      <TooltipPrimitive.Content
        data-slot="tooltip-content"
        sideOffset={sideOffset}
        className={cn(
          "cn-tooltip-content bg-foreground text-background z-50 w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin)",
          className
        )}
        {...props}
      >
        {children}
        <TooltipPrimitive.Arrow className="cn-tooltip-arrow bg-foreground fill-foreground z-50 translate-y-[calc(-50%_-_2px)]" />
      </TooltipPrimitive.Content>
    </TooltipPrimitive.Portal>
  )
}