4025dd0149
- @lion/ajax@0.2.2 - @lion/button@0.5.2 - @lion/calendar@0.6.3 - @lion/checkbox-group@0.5.2 - @lion/checkbox@0.3.2 - @lion/choice-input@0.5.2 - @lion/core@0.4.2 - @lion/dialog@0.4.2 - @lion/field@0.8.2 - @lion/fieldset@0.6.2 - @lion/form-system@0.3.4 - @lion/form@0.4.2 - @lion/helpers@0.2.2 - @lion/icon@0.3.2 - @lion/input-amount@0.5.2 - @lion/input-date@0.5.2 - @lion/input-datepicker@0.8.3 - @lion/input-email@0.5.2 - @lion/input-iban@0.5.3 - @lion/input-range@0.2.2 - @lion/input@0.5.2 - @lion/localize@0.8.2 - @lion/option@0.4.2 - @lion/overlays@0.11.2 - @lion/radio-group@0.5.2 - @lion/radio@0.3.2 - @lion/select-rich@0.9.2 - @lion/select@0.5.2 - @lion/steps@0.3.2 - @lion/switch@0.5.2 - @lion/tabs@0.2.2 - @lion/textarea@0.5.3 - @lion/tooltip@0.7.2 - @lion/validate@0.6.2 |
||
|---|---|---|
| .. | ||
| src | ||
| stories | ||
| test | ||
| CHANGELOG.md | ||
| index.js | ||
| lion-tooltip-arrow.js | ||
| lion-tooltip.js | ||
| package.json | ||
| README.md | ||
Tooltip
lion-tooltip is a component used for basic popups on hover.
Its purpose is to show content appearing when the user hovers over an invoker element with the cursor or with the keyboard,
or if the invoker element is focused.
Live Demo/Documentation
See our storybook for a live demo and API documentation
How to use
Installation
npm i --save @lion/tooltip
import '@lion/tooltip/lion-tooltip.js';
Example
<lion-tooltip>
<button slot="invoker">Hover me</button>
<div slot="content">This is a tooltip<div>
</lion-tooltip>