Overlays

Tooltip

A hover/focus-triggered label for a single trigger element, positioned with Floating UI and rendered through a portal so it never clips inside scroll containers.

Tooltip

Preview

Usage

tsx

import { Tooltip, Button } from "@vesture/react";

<Tooltip content="Copy to clipboard" placement="top">
  <Button variant="ghost">Copy</Button>
</Tooltip>

Behavior

Uncontrolled only — shows on hover (pointer move ignored) and on focus, dismissible on Escape/outside interaction.
Renders an arrow and portals its content to <body> via FloatingPortal.
role="tooltip"; not a focus trap — purely informational.

Props

Prop	Type	Default	Description
content	ReactNode	—	Required. Tooltip body.
placement	Placement	"top"	Floating UI placement.
children	ReactElement	—	Required. A single trigger element — cloned with reference props.