<st-tooltip>
A small label that shows above a control: after a short rest on hover, and at once on keyboard focus.
Wrap the control (a button or an icon button) in it and pass the same words as its accessible name in
text. The control is still the thing that's announced; the bubble is decorative (aria-hidden), so the
words aren't read twice.
The bubble is position: fixed and placed from the wrapper's position when it shows, so a clipping
ancestor (a card or panel with overflow: hidden) can't cut it off. It shows around a control that
can't act right now too, as long as that control is focusable or hoverable (use aria-disabled, not
the native disabled, which takes a control out of focus and pointer events).
Usage
import '@sankhyatronics/sankhya-cms/tooltip'; // registers <st-tooltip>
Properties
| Property | Attribute | Type | Default | Description |
|---|---|---|---|---|
text | text | string | '' | The words shown in the bubble: the same words as the control's accessible name, or the reason the control can't act right now. |
See the live examples in Storybook.