bmates-uiBMates UI
Latest
/Components

Tooltip

A short, non-interactive description for a control.

A short, non-interactive description for a control.

Import

import { Tooltip } from 'bmates-ui';

Basic usage

The example below mirrors the primary Storybook composition and can be used as a starting point.

<Tooltip content="Save the current changes">
  <Button aria-label="Save">Save</Button>
</Tooltip>

Preview

Tooltip

Prop previews

The examples below isolate the props that change visual output or interaction.

Directions

Directions

Component API

message

Required tooltip text.

direction

Side on which the tooltip is displayed.

children

Tooltip target element.

Usage notes

  • Every component in the table is exported from bmates-ui.
  • Unless noted otherwise, a component also accepts the standard props of its underlying HTML element.
  • For application-owned state, use a controlled value and its change handler instead of only a default* prop.