{{#> web/layout/default title="Tooltip" parentPageName="Components" }}

## Default

Hello there!

## Dismissible Tooltip

Close me

## Dismissible Tooltip via JS API

Saves data to local storage.

Close me

## Tooltip with Link Component

Hello there!
Click me

## Tooltip Triggers

This tooltip will show on hover and click.

Hello there!

This tooltip will show only on hover.

Hello there!

This tooltip will show only on click.

Hello there!

## Tooltip on Icon Component

Hover or click on the icon to view the tooltip
Close me

## Placements

top-start top top-end
bottom-start bottom bottom-end
left-start left left-end
right-start right right-end
Click
the dots!
bottom

## Advanced Floating Functionality

Try scrolling the frame or resizing the window to see how the Tooltip behaves. The Floating UI library is trying to keep the Tooltip in the viewport and it is also flipping, shifting and resizing the Tooltip when it is not possible to keep it in the viewport.

Enable flipping
Enable flipping cross axis
Enable shifting
Enable sizing
Suggested placement
Suggested fallback placements
This long tooltip is flipping, resizing and shifting to stay in the viewport. Also its arrow is always trying to point to the center of the trigger.
{{/ web/layout/default }}