mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-21 12:49:20 +00:00
Code Issues Projects Releases Packages Wiki Activity

feat(tooltip-definition): support reactive open prop

Browse source
This commit is contained in:
Eric Liu 2022-02-01 07:06:04 -08:00
commit 72210bac0d
1 changed files with 9 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/TooltipDefinition/TooltipDefinition.svelte
View file

@ -2,6 +2,11 @@
/** Specify the tooltip text */
export let tooltipText = "";
/**
* Set to `true` to open the tooltip
*/
export let open = false;
/**
* Set the alignment of the tooltip relative to the icon
* @type {"start" | "center" | "end"}
@ -20,14 +25,12 @@
/** Obtain a reference to the button HTML element */
export let ref = null;
let visible = false;
function hide() {
visible = false;
open = false;
}
function show() {
visible = true;
open = true;
}
</script>
@ -51,8 +54,8 @@
class:bx--tooltip--a11y="{true}"
class:bx--tooltip__trigger="{true}"
class:bx--tooltip__trigger--definition="{true}"
class:bx--tooltip--hidden="{!visible}"
class:bx--tooltip--visible="{visible}"
class:bx--tooltip--hidden="{!open}"
class:bx--tooltip--visible="{open}"
class:bx--tooltip--top="{direction === 'top'}"
class:bx--tooltip--bottom="{direction === 'bottom'}"
class:bx--tooltip--align-start="{align === 'start'}"