mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-18 11:36:36 +00:00
3350a412da
In v11 the definintion tooltip uses the `Popover` component internally. While the component is called `DefinitionTooltip` in the reference implementation, it is not renamed at this point. - rename `tooltipText` to `definition` - rename `tooltip` slot to `definition` - remove `direction` (see `align`) - use `align` values from `Popover` and set to `bottom-left` as default instead of `center`
28 lines
561 B
Svelte
28 lines
561 B
Svelte
<script lang="ts">
|
|
import { TooltipDefinition } from "../types";
|
|
|
|
let open = false;
|
|
</script>
|
|
|
|
<TooltipDefinition
|
|
bind:open
|
|
on:open
|
|
on:close
|
|
definition="IBM Corporate Headquarters is based in Armonk, New York."
|
|
>
|
|
Armonk
|
|
</TooltipDefinition>
|
|
|
|
<TooltipDefinition
|
|
align="top"
|
|
definition="IBM Corporate Headquarters is based in Armonk, New York."
|
|
>
|
|
Armonk
|
|
</TooltipDefinition>
|
|
|
|
<TooltipDefinition>
|
|
Armonk
|
|
<span slot="definition" style="color: red">
|
|
IBM Corporate Headquarters is based in Armonk, New York.
|
|
</span>
|
|
</TooltipDefinition>
|