@haiilo/catalyst 12.3.4 → 12.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/catalyst/catalyst.css +21 -0
- package/dist/catalyst/catalyst.esm.js +1 -1
- package/dist/catalyst/{p-58a193ff.entry.js → p-2b38c9b7.entry.js} +2 -2
- package/dist/catalyst/p-2b38c9b7.entry.js.map +1 -0
- package/dist/catalyst/scss/core/_table.scss +22 -0
- package/dist/catalyst/scss/index.scss +1 -0
- package/dist/cjs/cat-alert_30.cjs.entry.js +9 -3
- package/dist/cjs/cat-alert_30.cjs.entry.js.map +1 -1
- package/dist/collection/components/cat-dropdown/cat-dropdown.js +6 -1
- package/dist/collection/components/cat-dropdown/cat-dropdown.js.map +1 -1
- package/dist/collection/components/cat-tooltip/cat-tooltip.js +3 -2
- package/dist/collection/components/cat-tooltip/cat-tooltip.js.map +1 -1
- package/dist/collection/scss/core/_table.scss +22 -0
- package/dist/collection/scss/index.scss +1 -0
- package/dist/components/cat-dropdown2.js +6 -1
- package/dist/components/cat-dropdown2.js.map +1 -1
- package/dist/components/cat-tooltip.js +3 -2
- package/dist/components/cat-tooltip.js.map +1 -1
- package/dist/esm/cat-alert_30.entry.js +9 -3
- package/dist/esm/cat-alert_30.entry.js.map +1 -1
- package/dist/types/components/cat-dropdown/cat-dropdown.d.ts +1 -0
- package/package.json +2 -2
- package/dist/catalyst/p-58a193ff.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"cat-tooltip.js","mappings":"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","names":["CatTooltip","__stencil_proxyCustomElement","isTouchScreen"],"sources":["src/utils/is-touch-screen.ts","src/components/cat-tooltip/cat-tooltip.scss?tag=cat-tooltip&encapsulation=shadow","src/components/cat-tooltip/cat-tooltip.tsx"],"sourcesContent":["const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0;\n\nexport default isTouchDevice;\n","@use 'variables' as *;\n@use 'mixins' as *;\n\n$-max-width: 20rem;\n$-box-shadow: rgb(0 0 0 / 8%) 0 1px 8px 0;\n$-shift-padding: 0.25rem; // padding given to the shift() middleware\n\n:host {\n display: contents;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n.tooltip {\n --cat-font-color-head: #{cat-token('color.ui.font.tooltip', $wrap: false)};\n --cat-font-color-body: #{cat-token('color.ui.font.tooltip', $wrap: false)};\n position: fixed;\n width: max-content;\n top: 0;\n left: 0;\n box-sizing: border-box;\n background-color: cat-token('color.ui.background.tooltip');\n border-radius: cat-border-radius('m');\n color: cat-token('color.ui.font.tooltip');\n transition:\n opacity cat-token('time.transition.m') linear,\n visibility cat-token('time.transition.m') linear;\n visibility: hidden;\n opacity: 0;\n box-shadow: $-box-shadow;\n z-index: cat-z-index('tooltip');\n max-width: min(calc(100vw - 2 * $-shift-padding), $-max-width);\n\n &-hidden {\n @include cat-visually-hidden;\n }\n\n &-show {\n opacity: 1;\n visibility: visible;\n }\n\n p {\n margin: 0;\n }\n}\n\n// ----- round\n\n.tooltip-round {\n border-radius: 10rem;\n}\n\n// ----- size\n\n.tooltip-s {\n padding: 0.25rem 0.375rem;\n @include cat-body('xs', 500);\n\n &.tooltip-round {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n }\n}\n\n.tooltip-m {\n padding: 0.375rem 0.5rem;\n @include cat-body('s', 500);\n\n &.tooltip-round {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n }\n}\n\n.tooltip-l {\n padding: 0.5rem 0.75rem;\n @include cat-body('m', 500);\n\n &.tooltip-round {\n padding-left: 1rem;\n padding-right: 1rem;\n }\n}\n","import { autoUpdate, computePosition, flip, offset, shift } from '@floating-ui/dom';\nimport { Placement } from '@floating-ui/utils';\nimport { Component, Element, h, Host, Listen, Prop, State } from '@stencil/core';\nimport isTouchScreen from '../../utils/is-touch-screen';\n\nlet nextUniqueId = 0;\n\nexport type TooltipPlacement = Placement;\n\n/**\n * Tooltips display additional information when the user hovers over or\n * interacts with a trigger element. The tooltip can be customized with\n * different placements, sizes, and styles.\n */\n@Component({\n tag: 'cat-tooltip',\n styleUrl: 'cat-tooltip.scss',\n shadow: true\n})\nexport class CatTooltip {\n private static readonly OFFSET = 4;\n private static readonly SHIFT_PADDING = 4;\n private readonly id = `cat-tooltip-${nextUniqueId++}`;\n private tooltip?: HTMLElement;\n private trigger?: Element;\n private showTimeout?: number;\n private hideTimeout?: number;\n private touchTimeout?: number;\n private inactive = false;\n private cleanupFloatingUi?: () => void;\n\n private readonly boundShowListener: () => void;\n private readonly boundHideListener: () => void;\n private readonly boundWindowTouchStartListener: () => void;\n private readonly boundTouchStartListener: (event: Event) => void;\n private readonly boundTouchEndListener: () => void;\n\n constructor() {\n this.boundShowListener = this.showListener.bind(this);\n this.boundHideListener = this.hideListener.bind(this);\n this.boundWindowTouchStartListener = this.windowTouchStartListener.bind(this);\n this.boundTouchStartListener = this.touchStartListener.bind(this);\n this.boundTouchEndListener = this.touchEndListener.bind(this);\n }\n\n @Element() hostElement!: HTMLElement;\n\n @State() open = false;\n\n /**\n * The content of the tooltip.\n */\n @Prop() content = '';\n\n /**\n * Specifies that the tooltip should be disabled. A disabled tooltip is unusable,\n * and invisible. Corresponds with the native HTML disabled attribute.\n */\n @Prop() disabled = false;\n\n /**\n * The placement of the tooltip.\n */\n @Prop() placement: TooltipPlacement = 'top';\n\n /**\n * Use round tooltip edges.\n */\n @Prop() round = false;\n\n /**\n * The size of the tooltip.\n */\n @Prop() size: 's' | 'm' | 'l' = 'm';\n\n /**\n * The delay time for showing tooltip in ms.\n */\n @Prop() showDelay = 250;\n\n /**\n * The delay time for hiding tooltip in ms.\n */\n @Prop() hideDelay = 0;\n\n /**\n * The duration of tap to show the tooltip.\n */\n @Prop() longTouchDuration = 1000;\n\n @Listen('keydown', { target: 'window' })\n handleKeyDown({ key }: KeyboardEvent) {\n key === 'Escape' && this.hideTooltip();\n }\n\n componentDidLoad(): void {\n const slot = this.hostElement.shadowRoot?.querySelector('slot');\n this.trigger = slot?.assignedElements?.()?.[0];\n if (this.trigger && !this.trigger.hasAttribute('aria-describedby')) {\n this.trigger.setAttribute('aria-describedby', this.id);\n }\n\n this.addListeners();\n }\n\n connectedCallback(): void {\n this.addListeners();\n }\n\n componentWillRender(): void {\n this.inactive = this.disabled || (!this.content && !this.hostElement.querySelector('[slot=\"content\"]'));\n }\n\n disconnectedCallback(): void {\n this.removeListeners();\n }\n\n render() {\n return (\n <Host>\n <slot />\n <div\n ref={el => (this.tooltip = el)}\n id={this.id}\n role=\"tooltip\"\n aria-hidden={!this.open}\n aria-live={this.open ? 'polite' : 'off'}\n class={{\n tooltip: true,\n 'tooltip-hidden': this.inactive,\n 'tooltip-round': this.round,\n [`tooltip-${this.size}`]: Boolean(this.size)\n }}\n >\n <slot name=\"content\">\n {/* The paragraph is needed here to make aria-live work properly. */}\n <p>{this.content}</p>\n </slot>\n </div>\n </Host>\n );\n }\n\n private addListeners() {\n if (isTouchScreen) {\n window.addEventListener('touchstart', this.boundWindowTouchStartListener);\n this.trigger?.addEventListener('touchstart', this.boundTouchStartListener);\n this.trigger?.addEventListener('touchend', this.boundTouchEndListener);\n } else {\n this.trigger?.addEventListener('focusin', this.boundShowListener);\n this.trigger?.addEventListener('focusout', this.boundHideListener);\n this.trigger?.addEventListener('mouseenter', this.boundShowListener);\n this.trigger?.addEventListener('mouseleave', this.boundHideListener);\n }\n }\n\n private removeListeners() {\n if (isTouchScreen) {\n window.removeEventListener('touchstart', this.boundWindowTouchStartListener);\n this.trigger?.removeEventListener('touchstart', this.boundTouchStartListener);\n this.trigger?.removeEventListener('touchend', this.boundTouchEndListener);\n } else {\n this.trigger?.removeEventListener('mouseenter', this.boundShowListener);\n this.trigger?.removeEventListener('mouseleave', this.boundHideListener);\n this.trigger?.removeEventListener('focusin', this.boundShowListener);\n this.trigger?.removeEventListener('focusout', this.boundHideListener);\n }\n }\n\n private async update() {\n if (this.trigger && this.tooltip) {\n await computePosition(this.trigger, this.tooltip, {\n strategy: 'fixed',\n placement: this.placement,\n middleware: [\n offset(CatTooltip.OFFSET),\n flip({ fallbackAxisSideDirection: 'start' }),\n shift({ padding: CatTooltip.SHIFT_PADDING })\n ]\n }).then(({ x, y }) => {\n if (this.tooltip) {\n Object.assign(this.tooltip.style, {\n left: `${Math.max(0, x)}px`,\n top: `${y}px`\n });\n }\n });\n }\n }\n\n private showListener() {\n window.clearTimeout(this.hideTimeout);\n this.hideTimeout = undefined;\n if (!this.showTimeout) {\n this.showTimeout = window.setTimeout(() => {\n this.showTimeout = undefined;\n this.showTooltip();\n }, this.showDelay);\n }\n }\n\n private hideListener() {\n window.clearTimeout(this.showTimeout);\n this.showTimeout = undefined;\n if (!this.hideTimeout) {\n this.hideTimeout = window.setTimeout(() => {\n this.hideTimeout = undefined;\n this.hideTooltip();\n }, this.hideDelay);\n }\n }\n\n private touchStartListener(event: Event) {\n event.stopPropagation();\n if (!this.touchTimeout) {\n this.touchTimeout = window.setTimeout(() => {\n this.touchTimeout = undefined;\n this.showTooltip();\n }, this.longTouchDuration);\n }\n }\n\n private touchEndListener() {\n window.clearTimeout(this.touchTimeout);\n this.touchTimeout = undefined;\n this.hideTooltip();\n }\n\n private windowTouchStartListener() {\n this.hideTooltip();\n }\n\n private showTooltip() {\n if (this.trigger && this.tooltip) {\n this.cleanupFloatingUi = autoUpdate(this.trigger, this.tooltip, () => this.update());\n }\n if (!this.inactive) {\n this.open = true;\n this.tooltip?.classList.add('tooltip-show');\n }\n }\n\n private hideTooltip() {\n this.open = false;\n this.tooltip?.classList.remove('tooltip-show');\n this.cleanupFloatingUi?.();\n this.cleanupFloatingUi = undefined;\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"cat-tooltip.js","mappings":"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","names":["CatTooltip","__stencil_proxyCustomElement","isTouchScreen"],"sources":["src/utils/is-touch-screen.ts","src/components/cat-tooltip/cat-tooltip.scss?tag=cat-tooltip&encapsulation=shadow","src/components/cat-tooltip/cat-tooltip.tsx"],"sourcesContent":["const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0;\n\nexport default isTouchDevice;\n","@use 'variables' as *;\n@use 'mixins' as *;\n\n$-max-width: 20rem;\n$-box-shadow: rgb(0 0 0 / 8%) 0 1px 8px 0;\n$-shift-padding: 0.25rem; // padding given to the shift() middleware\n\n:host {\n display: contents;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n.tooltip {\n --cat-font-color-head: #{cat-token('color.ui.font.tooltip', $wrap: false)};\n --cat-font-color-body: #{cat-token('color.ui.font.tooltip', $wrap: false)};\n position: fixed;\n width: max-content;\n top: 0;\n left: 0;\n box-sizing: border-box;\n background-color: cat-token('color.ui.background.tooltip');\n border-radius: cat-border-radius('m');\n color: cat-token('color.ui.font.tooltip');\n transition:\n opacity cat-token('time.transition.m') linear,\n visibility cat-token('time.transition.m') linear;\n visibility: hidden;\n opacity: 0;\n box-shadow: $-box-shadow;\n z-index: cat-z-index('tooltip');\n max-width: min(calc(100vw - 2 * $-shift-padding), $-max-width);\n\n &-hidden {\n @include cat-visually-hidden;\n }\n\n &-show {\n opacity: 1;\n visibility: visible;\n }\n\n p {\n margin: 0;\n }\n}\n\n// ----- round\n\n.tooltip-round {\n border-radius: 10rem;\n}\n\n// ----- size\n\n.tooltip-s {\n padding: 0.25rem 0.375rem;\n @include cat-body('xs', 500);\n\n &.tooltip-round {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n }\n}\n\n.tooltip-m {\n padding: 0.375rem 0.5rem;\n @include cat-body('s', 500);\n\n &.tooltip-round {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n }\n}\n\n.tooltip-l {\n padding: 0.5rem 0.75rem;\n @include cat-body('m', 500);\n\n &.tooltip-round {\n padding-left: 1rem;\n padding-right: 1rem;\n }\n}\n","import { autoUpdate, computePosition, flip, offset, shift } from '@floating-ui/dom';\nimport { Placement } from '@floating-ui/utils';\nimport { Component, Element, h, Host, Listen, Prop, State } from '@stencil/core';\nimport isTouchScreen from '../../utils/is-touch-screen';\n\nlet nextUniqueId = 0;\n\nexport type TooltipPlacement = Placement;\n\n/**\n * Tooltips display additional information when the user hovers over or\n * interacts with a trigger element. The tooltip can be customized with\n * different placements, sizes, and styles.\n */\n@Component({\n tag: 'cat-tooltip',\n styleUrl: 'cat-tooltip.scss',\n shadow: true\n})\nexport class CatTooltip {\n private static readonly OFFSET = 4;\n private static readonly SHIFT_PADDING = 4;\n private readonly id = `cat-tooltip-${nextUniqueId++}`;\n private tooltip?: HTMLElement;\n private trigger?: Element;\n private showTimeout?: number;\n private hideTimeout?: number;\n private touchTimeout?: number;\n private inactive = false;\n private cleanupFloatingUi?: () => void;\n\n private readonly boundShowListener: () => void;\n private readonly boundHideListener: () => void;\n private readonly boundWindowTouchStartListener: () => void;\n private readonly boundTouchStartListener: (event: Event) => void;\n private readonly boundTouchEndListener: () => void;\n\n constructor() {\n this.boundShowListener = this.showListener.bind(this);\n this.boundHideListener = this.hideListener.bind(this);\n this.boundWindowTouchStartListener = this.windowTouchStartListener.bind(this);\n this.boundTouchStartListener = this.touchStartListener.bind(this);\n this.boundTouchEndListener = this.touchEndListener.bind(this);\n }\n\n @Element() hostElement!: HTMLElement;\n\n @State() open = false;\n\n /**\n * The content of the tooltip.\n */\n @Prop() content = '';\n\n /**\n * Specifies that the tooltip should be disabled. A disabled tooltip is unusable,\n * and invisible. Corresponds with the native HTML disabled attribute.\n */\n @Prop() disabled = false;\n\n /**\n * The placement of the tooltip.\n */\n @Prop() placement: TooltipPlacement = 'top';\n\n /**\n * Use round tooltip edges.\n */\n @Prop() round = false;\n\n /**\n * The size of the tooltip.\n */\n @Prop() size: 's' | 'm' | 'l' = 'm';\n\n /**\n * The delay time for showing tooltip in ms.\n */\n @Prop() showDelay = 250;\n\n /**\n * The delay time for hiding tooltip in ms.\n */\n @Prop() hideDelay = 0;\n\n /**\n * The duration of tap to show the tooltip.\n */\n @Prop() longTouchDuration = 1000;\n\n @Listen('keydown', { target: 'window' })\n handleKeyDown({ key }: KeyboardEvent) {\n key === 'Escape' && this.hideTooltip();\n }\n\n componentDidLoad(): void {\n const slot = this.hostElement.shadowRoot?.querySelector('slot');\n this.trigger = slot?.assignedElements?.()?.[0];\n if (this.trigger && !this.trigger.hasAttribute('aria-describedby')) {\n this.trigger.setAttribute('aria-describedby', this.id);\n }\n\n this.addListeners();\n }\n\n connectedCallback(): void {\n this.addListeners();\n }\n\n componentWillRender(): void {\n this.inactive = this.disabled || (!this.content && !this.hostElement.querySelector('[slot=\"content\"]'));\n }\n\n disconnectedCallback(): void {\n this.removeListeners();\n this.hideTooltip();\n }\n\n render() {\n return (\n <Host>\n <slot />\n <div\n ref={el => (this.tooltip = el)}\n id={this.id}\n role=\"tooltip\"\n aria-hidden={!this.open}\n aria-live={this.open ? 'polite' : 'off'}\n class={{\n tooltip: true,\n 'tooltip-hidden': this.inactive,\n 'tooltip-round': this.round,\n [`tooltip-${this.size}`]: Boolean(this.size)\n }}\n >\n <slot name=\"content\">\n {/* The paragraph is needed here to make aria-live work properly. */}\n <p>{this.content}</p>\n </slot>\n </div>\n </Host>\n );\n }\n\n private addListeners() {\n if (isTouchScreen) {\n window.addEventListener('touchstart', this.boundWindowTouchStartListener);\n this.trigger?.addEventListener('touchstart', this.boundTouchStartListener);\n this.trigger?.addEventListener('touchend', this.boundTouchEndListener);\n } else {\n this.trigger?.addEventListener('focusin', this.boundShowListener);\n this.trigger?.addEventListener('focusout', this.boundHideListener);\n this.trigger?.addEventListener('mouseenter', this.boundShowListener);\n this.trigger?.addEventListener('mouseleave', this.boundHideListener);\n }\n }\n\n private removeListeners() {\n if (isTouchScreen) {\n window.removeEventListener('touchstart', this.boundWindowTouchStartListener);\n this.trigger?.removeEventListener('touchstart', this.boundTouchStartListener);\n this.trigger?.removeEventListener('touchend', this.boundTouchEndListener);\n } else {\n this.trigger?.removeEventListener('mouseenter', this.boundShowListener);\n this.trigger?.removeEventListener('mouseleave', this.boundHideListener);\n this.trigger?.removeEventListener('focusin', this.boundShowListener);\n this.trigger?.removeEventListener('focusout', this.boundHideListener);\n }\n }\n\n private async update() {\n if (this.trigger && this.tooltip) {\n await computePosition(this.trigger, this.tooltip, {\n strategy: 'fixed',\n placement: this.placement,\n middleware: [\n offset(CatTooltip.OFFSET),\n flip({ fallbackAxisSideDirection: 'start' }),\n shift({ padding: CatTooltip.SHIFT_PADDING })\n ]\n }).then(({ x, y }) => {\n if (this.tooltip) {\n Object.assign(this.tooltip.style, {\n left: `${Math.max(0, x)}px`,\n top: `${y}px`\n });\n }\n });\n }\n }\n\n private showListener() {\n window.clearTimeout(this.hideTimeout);\n this.hideTimeout = undefined;\n if (!this.showTimeout) {\n this.showTimeout = window.setTimeout(() => {\n this.showTimeout = undefined;\n this.showTooltip();\n }, this.showDelay);\n }\n }\n\n private hideListener() {\n window.clearTimeout(this.showTimeout);\n this.showTimeout = undefined;\n if (!this.hideTimeout) {\n this.hideTimeout = window.setTimeout(() => {\n this.hideTimeout = undefined;\n this.hideTooltip();\n }, this.hideDelay);\n }\n }\n\n private touchStartListener(event: Event) {\n event.stopPropagation();\n if (!this.touchTimeout) {\n this.touchTimeout = window.setTimeout(() => {\n this.touchTimeout = undefined;\n this.showTooltip();\n }, this.longTouchDuration);\n }\n }\n\n private touchEndListener() {\n window.clearTimeout(this.touchTimeout);\n this.touchTimeout = undefined;\n this.hideTooltip();\n }\n\n private windowTouchStartListener() {\n this.hideTooltip();\n }\n\n private showTooltip() {\n if (this.trigger && this.tooltip) {\n this.cleanupFloatingUi = autoUpdate(this.trigger, this.tooltip, () => this.update());\n }\n if (!this.inactive) {\n this.open = true;\n this.tooltip?.classList.add('tooltip-show');\n }\n }\n\n private hideTooltip() {\n this.open = false;\n this.tooltip?.classList.remove('tooltip-show');\n this.cleanupFloatingUi?.();\n this.cleanupFloatingUi = undefined;\n }\n}\n"],"version":3}
|
|
@@ -7762,6 +7762,7 @@ const CatDropdown = class {
|
|
|
7762
7762
|
}
|
|
7763
7763
|
this._isOpen = null;
|
|
7764
7764
|
this.trap?.deactivate();
|
|
7765
|
+
this.trap = undefined;
|
|
7765
7766
|
this.content.classList.remove('show');
|
|
7766
7767
|
// give CSS transition time to apply
|
|
7767
7768
|
setTimeout(() => {
|
|
@@ -7778,8 +7779,12 @@ const CatDropdown = class {
|
|
|
7778
7779
|
this.initTrigger();
|
|
7779
7780
|
}
|
|
7780
7781
|
}
|
|
7782
|
+
disconnectedCallback() {
|
|
7783
|
+
this.trap?.deactivate();
|
|
7784
|
+
this.trap = undefined;
|
|
7785
|
+
}
|
|
7781
7786
|
render() {
|
|
7782
|
-
return (h(Host, { key: '
|
|
7787
|
+
return (h(Host, { key: 'c76a5d87c676da3b2744c685f5108d390e35691b' }, h("slot", { key: 'debf796d465c97d19fdd8bfa7029ccaad0056c28', name: "anchor", ref: el => (this.anchorSlot = el) }), h("slot", { key: 'f6780795027087c899c0a2dd8b826c9e23bc4d2b', name: "trigger", ref: el => (this.triggerSlot = el) }), h("div", { key: '2ed88e6ea720c329b01c9d935507565a6bcbd2d9', id: this.contentId, class: { content: true, 'overflow-auto': !this.overflow, justified: this.justify, aligned: !this.justify }, ref: el => (this.content = el) }, h("slot", { key: '686eacb75cd07a718aeb2cab2e41176116493d4a', name: "content" }))));
|
|
7783
7788
|
}
|
|
7784
7789
|
get contentId() {
|
|
7785
7790
|
return `cat-dropdown-${this.id}`;
|
|
@@ -12291,14 +12296,15 @@ const CatTooltip = class {
|
|
|
12291
12296
|
}
|
|
12292
12297
|
disconnectedCallback() {
|
|
12293
12298
|
this.removeListeners();
|
|
12299
|
+
this.hideTooltip();
|
|
12294
12300
|
}
|
|
12295
12301
|
render() {
|
|
12296
|
-
return (h(Host, { key: '
|
|
12302
|
+
return (h(Host, { key: '48ac6350d679c11d238d55442d6455fc38eb44d7' }, h("slot", { key: '2ecd767bae2429800d94707498dd0d292b0bf5b4' }), h("div", { key: 'c59512dbe2c57622f7827aa143230dc1c5046281', ref: el => (this.tooltip = el), id: this.id, role: "tooltip", "aria-hidden": !this.open, "aria-live": this.open ? 'polite' : 'off', class: {
|
|
12297
12303
|
tooltip: true,
|
|
12298
12304
|
'tooltip-hidden': this.inactive,
|
|
12299
12305
|
'tooltip-round': this.round,
|
|
12300
12306
|
[`tooltip-${this.size}`]: Boolean(this.size)
|
|
12301
|
-
} }, h("slot", { key: '
|
|
12307
|
+
} }, h("slot", { key: 'a0bdd025ca40adac969daef4a0b06b9aa8452fac', name: "content" }, h("p", { key: '83786352e3219af4e7cde38a1c8247042d44c66a' }, this.content)))));
|
|
12302
12308
|
}
|
|
12303
12309
|
addListeners() {
|
|
12304
12310
|
if (isTouchDevice) {
|