saturation/uiLoading...
Installation
pnpm dlx shadcn@latest add https://ui.saturation.io/r/tooltip.jsonUsage
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip"<TooltipProvider>
<Tooltip>
<TooltipTrigger>Hover me</TooltipTrigger>
<TooltipContent>
<p>Tooltip content</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>API Reference
TooltipProvider
Wraps your app to provide tooltip context.
| Prop | Type | Default | Description |
|---|---|---|---|
delayDuration | number | 0 | The duration (ms) from when the mouse enters a tooltip trigger until the tooltip opens. |
skipDelayDuration | number | 300 | How much time a user has to enter another trigger without incurring a delay again. |
Tooltip
The root component that manages tooltip state.
TooltipTrigger
The element that triggers the tooltip.
TooltipContent
The popup content of the tooltip.
| Prop | Type | Default | Description |
|---|---|---|---|
sideOffset | number | 4 | The distance in pixels from the trigger. |
side | "top" | "right" | "bottom" | "left" | "top" | The side the tooltip appears on. |
align | "start" | "center" | "end" | "center" | The alignment of the tooltip relative to the trigger. |