Tooltip — dir/ui
Show a short explanation on hover or keyboard focus.
# Tooltip
Show a short explanation on hover or keyboard focus.
## Install
```sh
npx shadcn@4.21.0 add lr-run/dir-ui/tooltip#v0.1.2
```
[Registry item with source and dependencies](https://github.com/lr-run/dir-ui/blob/v0.1.2/registry.json)
Requires React 19, Tailwind CSS 4 and shadcn initialized with Base UI. Registry target placeholders resolve through components.json: @ui, @components, @hooks and @lib. Imports below use the conventional @/ prefix for illustration; the CLI rewrites them to your configured aliases. Shared components are installed once through registryDependencies. Theme CSS is imported by the UI modules. Existing files are never forcibly overwritten; review CLI conflicts before accepting changes. No Dir runtime is required.
Wrap tooltip consumers in Tooltip.Provider.
## Tooltip, TooltipTrigger, TooltipContent, TooltipProvider
```tsx
import { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from '@/components/ui/tooltip.tsx'
```
| Prop | Type | Default / required | Notes |
| --- | --- | --- | --- |
| TooltipProvider.delay | number | 0 | |
| Tooltip.open / onOpenChange | boolean / callback | Uncontrolled | |
| TooltipTrigger.render | ReactElement | — | |
| TooltipContent.children | ReactNode | Required | |
| TooltipContent.side | 'top' \| 'bottom' \| 'left' \| 'right' | 'top' | |
| TooltipContent.sideOffset | number | 4 | |
Mount TooltipProvider above the trigger. Each part inherits the corresponding Base UI Tooltip props.