Merge branch 'tooltip-definition'

This commit is contained in:
Eric Liu 2020-10-21 06:30:01 -07:00
commit b7dfcecd1d
4 changed files with 89 additions and 30 deletions

View file

@ -3,14 +3,27 @@
import Preview from "../../components/Preview.svelte";
</script>
### Default ("bottom" direction, "center" aligned)
### Default
<TooltipDefinition tooltipText="IBM Corporate Headquarters is based in Armonk, New York.">
Armonk
</TooltipDefinition>
### Custom direction, alignment
### Custom tooltip direction and alignment
Customize the tooltip menu direction and alignment through the `direction` and `align` props.
By default, `direction` is `"bottom"` and `align` is `"center"`.
<TooltipDefinition direction="top" align="start" tooltipText="IBM Corporate Headquarters is based in Armonk, New York.">
Armonk
</TooltipDefinition>
### Custom tooltip slot
<TooltipDefinition>
Armonk
<span slot="tooltip" style="color: red">
IBM Corporate Headquarters is based in Armonk, New York.
</span>
</TooltipDefinition>