A floating element that displays additional information when hovering over or focusing on an element.
Import the Tooltip
component from @bun-ui/react
and use it in your project:
import { Tooltip } from "@bun-ui/react"
<Tooltip content="This is a tooltip">
<button>Hover me</button>
</Tooltip>
The tooltip can be positioned in different places relative to the trigger element.
Control the timing of when the tooltip appears and disappears.
Show the tooltip only when clicking the trigger element instead of hovering.
Adjust the distance between the tooltip and the trigger element.
The tooltip content can be customized with any React component.