Ship-It Designv0.0.20

GitHub

Tooltip

Each example below is a real component instance — flip the theme toggle to see how it adapts.

Two surfaces: SimpleTooltip is the one-liner used in the examples below — it bundles its own TooltipProvider and takes a content prop. For composition (shared provider, many triggers, async content), reach for the lower-level Tooltip + TooltipTrigger + TooltipContent primitives instead.

Basic#

Sides#

Loading…

Props#

Props for SimpleTooltip
PropTypeDefaultDescription
content *ReactNodeTooltip text/content.
children *ReactNodeTrigger element — usually a Button or IconButton.
sideenumtopSide: top (default) | right | bottom | left.
delayDurationnumber | undefined400Open/close delay in ms (overrides provider default).