Overlays

Tooltip.

Extra context on hover or keyboard focus.

LIVE PREVIEWTry it. It works.

Install the source

npx shadcn@latest add https://ui.bld8.dev/r/tooltip.json

Registry setup · Open the playground

Usage

<Tooltip content="Create a project"><IconButton label="New project"><Icon name="plus" /></IconButton></Tooltip>

In the workspace or ZIP starter, import components from @bld8/ui and include @bld8/ui/styles.css once. Registry installations use your local bld8/ source path. Wrap overlays in UIProvider.

API & behaviour

Wrap the app in UIProvider. content is supplementary text; children must accept a forwarded ref and already have an accessible name. Opens on hover or focus.

Notes to self

Test this component with real content, keyboard input and both themes. The example is a starting point; labels, error handling and behaviour still need to fit the application.