@sbb-esta/lyne-elements 3.10.0 → 3.11.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.
Files changed (107) hide show
  1. package/calendar/calendar.component.d.ts +2 -1
  2. package/calendar/calendar.component.d.ts.map +1 -1
  3. package/core/controllers/escapable-overlay-controller.d.ts +3 -0
  4. package/core/controllers/escapable-overlay-controller.d.ts.map +1 -1
  5. package/core/controllers/overlay-position-controller.d.ts +60 -0
  6. package/core/controllers/overlay-position-controller.d.ts.map +1 -0
  7. package/core/controllers/overlay-position-controller.js +224 -0
  8. package/core/controllers.d.ts +1 -0
  9. package/core/controllers.d.ts.map +1 -1
  10. package/core/controllers.js +12 -10
  11. package/core/styles/core.scss +27 -2
  12. package/core.css +21 -2
  13. package/custom-elements.json +1996 -544
  14. package/development/calendar/calendar.component.d.ts +2 -1
  15. package/development/calendar/calendar.component.d.ts.map +1 -1
  16. package/development/calendar/calendar.component.js +1 -1
  17. package/development/core/controllers/escapable-overlay-controller.d.ts +3 -0
  18. package/development/core/controllers/escapable-overlay-controller.d.ts.map +1 -1
  19. package/development/core/controllers/escapable-overlay-controller.js +1 -1
  20. package/development/core/controllers/overlay-position-controller.d.ts +60 -0
  21. package/development/core/controllers/overlay-position-controller.d.ts.map +1 -0
  22. package/development/core/controllers/overlay-position-controller.js +306 -0
  23. package/development/core/controllers.d.ts +1 -0
  24. package/development/core/controllers.d.ts.map +1 -1
  25. package/development/core/controllers.js +3 -1
  26. package/development/mini-calendar/mini-calendar/mini-calendar.component.d.ts +35 -0
  27. package/development/mini-calendar/mini-calendar/mini-calendar.component.d.ts.map +1 -0
  28. package/development/mini-calendar/mini-calendar/mini-calendar.component.js +201 -0
  29. package/development/mini-calendar/mini-calendar-day/mini-calendar-day.component.d.ts +23 -0
  30. package/development/mini-calendar/mini-calendar-day/mini-calendar-day.component.d.ts.map +1 -0
  31. package/development/mini-calendar/mini-calendar-day/mini-calendar-day.component.js +181 -0
  32. package/development/mini-calendar/mini-calendar-day.d.ts +5 -0
  33. package/development/mini-calendar/mini-calendar-day.d.ts.map +1 -0
  34. package/development/mini-calendar/mini-calendar-day.js +5 -0
  35. package/development/mini-calendar/mini-calendar-month/mini-calendar-month.component.d.ts +25 -0
  36. package/development/mini-calendar/mini-calendar-month/mini-calendar-month.component.d.ts.map +1 -0
  37. package/development/mini-calendar/mini-calendar-month/mini-calendar-month.component.js +123 -0
  38. package/development/mini-calendar/mini-calendar-month.d.ts +5 -0
  39. package/development/mini-calendar/mini-calendar-month.d.ts.map +1 -0
  40. package/development/mini-calendar/mini-calendar-month.js +5 -0
  41. package/development/mini-calendar/mini-calendar.d.ts +5 -0
  42. package/development/mini-calendar/mini-calendar.d.ts.map +1 -0
  43. package/development/mini-calendar/mini-calendar.js +5 -0
  44. package/development/mini-calendar.d.ts +7 -0
  45. package/development/mini-calendar.d.ts.map +1 -0
  46. package/development/mini-calendar.js +9 -0
  47. package/development/sidebar/icon-sidebar-button/icon-sidebar-button.component.d.ts +4 -1
  48. package/development/sidebar/icon-sidebar-button/icon-sidebar-button.component.d.ts.map +1 -1
  49. package/development/sidebar/icon-sidebar-button/icon-sidebar-button.component.js +5 -1
  50. package/development/sidebar/icon-sidebar-link/icon-sidebar-link.component.d.ts +4 -1
  51. package/development/sidebar/icon-sidebar-link/icon-sidebar-link.component.d.ts.map +1 -1
  52. package/development/sidebar/icon-sidebar-link/icon-sidebar-link.component.js +5 -1
  53. package/development/tabs/tab/tab.component.d.ts +9 -0
  54. package/development/tabs/tab/tab.component.d.ts.map +1 -1
  55. package/development/tabs/tab/tab.component.js +48 -7
  56. package/development/tabs/tab-group/tab-group.component.d.ts +7 -3
  57. package/development/tabs/tab-group/tab-group.component.d.ts.map +1 -1
  58. package/development/tabs/tab-group/tab-group.component.js +19 -39
  59. package/development/tabs/tab-label/tab-label.component.d.ts.map +1 -1
  60. package/development/tabs/tab-label/tab-label.component.js +4 -3
  61. package/development/tooltip/tooltip.component.d.ts +11 -4
  62. package/development/tooltip/tooltip.component.d.ts.map +1 -1
  63. package/development/tooltip/tooltip.component.js +57 -78
  64. package/index.d.ts +6 -0
  65. package/index.js +6 -0
  66. package/mini-calendar/mini-calendar/mini-calendar.component.d.ts +35 -0
  67. package/mini-calendar/mini-calendar/mini-calendar.component.d.ts.map +1 -0
  68. package/mini-calendar/mini-calendar/mini-calendar.component.js +133 -0
  69. package/mini-calendar/mini-calendar-day/mini-calendar-day.component.d.ts +23 -0
  70. package/mini-calendar/mini-calendar-day/mini-calendar-day.component.d.ts.map +1 -0
  71. package/mini-calendar/mini-calendar-day/mini-calendar-day.component.js +66 -0
  72. package/mini-calendar/mini-calendar-day.d.ts +5 -0
  73. package/mini-calendar/mini-calendar-day.d.ts.map +1 -0
  74. package/mini-calendar/mini-calendar-day.js +4 -0
  75. package/mini-calendar/mini-calendar-month/mini-calendar-month.component.d.ts +25 -0
  76. package/mini-calendar/mini-calendar-month/mini-calendar-month.component.d.ts.map +1 -0
  77. package/mini-calendar/mini-calendar-month/mini-calendar-month.component.js +59 -0
  78. package/mini-calendar/mini-calendar-month.d.ts +5 -0
  79. package/mini-calendar/mini-calendar-month.d.ts.map +1 -0
  80. package/mini-calendar/mini-calendar-month.js +4 -0
  81. package/mini-calendar/mini-calendar.d.ts +5 -0
  82. package/mini-calendar/mini-calendar.d.ts.map +1 -0
  83. package/mini-calendar/mini-calendar.js +4 -0
  84. package/mini-calendar.d.ts +7 -0
  85. package/mini-calendar.d.ts.map +1 -0
  86. package/mini-calendar.js +8 -0
  87. package/off-brand-theme.css +21 -2
  88. package/package.json +21 -1
  89. package/safety-theme.css +21 -2
  90. package/sidebar/icon-sidebar-button/icon-sidebar-button.component.d.ts +4 -1
  91. package/sidebar/icon-sidebar-button/icon-sidebar-button.component.d.ts.map +1 -1
  92. package/sidebar/icon-sidebar-button/icon-sidebar-button.component.js +9 -6
  93. package/sidebar/icon-sidebar-link/icon-sidebar-link.component.d.ts +4 -1
  94. package/sidebar/icon-sidebar-link/icon-sidebar-link.component.d.ts.map +1 -1
  95. package/sidebar/icon-sidebar-link/icon-sidebar-link.component.js +13 -10
  96. package/standard-theme.css +21 -2
  97. package/tabs/tab/tab.component.d.ts +9 -0
  98. package/tabs/tab/tab.component.d.ts.map +1 -1
  99. package/tabs/tab/tab.component.js +37 -18
  100. package/tabs/tab-group/tab-group.component.d.ts +7 -3
  101. package/tabs/tab-group/tab-group.component.d.ts.map +1 -1
  102. package/tabs/tab-group/tab-group.component.js +51 -52
  103. package/tabs/tab-label/tab-label.component.d.ts.map +1 -1
  104. package/tabs/tab-label/tab-label.component.js +12 -12
  105. package/tooltip/tooltip.component.d.ts +11 -4
  106. package/tooltip/tooltip.component.d.ts.map +1 -1
  107. package/tooltip/tooltip.component.js +60 -84
@@ -1,41 +1,40 @@
1
- var E = (s) => {
2
- throw TypeError(s);
1
+ var x = (i) => {
2
+ throw TypeError(i);
3
3
  };
4
- var O = (s, i, a) => i.has(s) || E("Cannot " + a);
5
- var w = (s, i, a) => (O(s, i, "read from private field"), a ? a.call(s) : i.get(s)), P = (s, i, a) => i.has(s) ? E("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, a), u = (s, i, a, r) => (O(s, i, "write to private field"), r ? r.call(s, a) : i.set(s, a), a);
6
- import { __esDecorate as b, __runInitializers as h } from "tslib";
7
- import { css as k, isServer as A, html as S } from "lit";
8
- import { customElement as z, property as c } from "lit/decorators.js";
9
- import { ref as N } from "lit/directives/ref.js";
10
- import { SbbOpenCloseBaseElement as I } from "../core/base-elements.js";
4
+ var O = (i, s, a) => s.has(i) || x("Cannot " + a);
5
+ var w = (i, s, a) => (O(i, s, "read from private field"), a ? a.call(i) : s.get(i)), k = (i, s, a) => s.has(i) ? x("Cannot add the same private member more than once") : s instanceof WeakSet ? s.add(i) : s.set(i, a), u = (i, s, a, r) => (O(i, s, "write to private field"), r ? r.call(i, a) : s.set(i, a), a);
6
+ import { __esDecorate as b, __runInitializers as c } from "tslib";
7
+ import { css as L, isServer as E, html as S } from "lit";
8
+ import { customElement as z, property as h } from "lit/decorators.js";
9
+ import { SbbOpenCloseBaseElement as N } from "../core/base-elements.js";
11
10
  import { readConfig as g } from "../core/config.js";
12
- import { SbbEscapableOverlayController as M } from "../core/controllers.js";
13
- import { idReference as H } from "../core/decorators.js";
14
- import { queueDomContentLoaded as F, addToListAttribute as U, removeFromListAttribute as Z, isZeroAnimationDuration as $, isAndroid as q, isIOS as R } from "../core/dom.js";
15
- import { SbbDisabledMixin as B } from "../core/mixins.js";
16
- import { sbbOverlayOutsidePointerEventListener as L, getElementPosition as W } from "../core/overlay.js";
17
- const j = k`*,:before,:after{box-sizing:border-box}:host{--sbb-tooltip-position: absolute;--sbb-tooltip-position-x: 0;--sbb-tooltip-position-y: 0;--sbb-tooltip-pointer-events: all;--sbb-tooltip-max-width: min( 25rem, calc(100% - var(--sbb-spacing-fixed-2x)) );--sbb-tooltip-border-color: var(--sbb-background-color-1-inverted);--sbb-tooltip-border-radius: var(--sbb-border-radius-8x);--sbb-tooltip-padding: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-fixed-4x);--sbb-tooltip-background-color: var(--sbb-background-color-1-inverted);--sbb-tooltip-color: var(--sbb-color-2-inverted);--sbb-tooltip-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-tooltip-animation-easing: ease-out;--sbb-tooltip-animation-translate: 0 var(--sbb-spacing-fixed-2x);display:none;position:fixed;inset:0;z-index:var(--sbb-tooltip-z-index, var(--sbb-overlay-default-z-index))}:host([data-state]:not([data-state=closed])){display:block;--sbb-tooltip-animation-name: open}:host([data-state][data-state=closing]){--sbb-tooltip-animation-name: close;--sbb-tooltip-pointer-events: none}:host([data-position=below]){--sbb-tooltip-hover-patch-inset: calc(-1 * var(--sbb-spacing-fixed-4x)) 0}:host([data-position=above]){--sbb-tooltip-hover-patch-inset: 0 calc(-1 * var(--sbb-spacing-fixed-4x))}.sbb-tooltip{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-color-soft-2),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-color-soft-1);--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);position:var(--sbb-tooltip-position);pointer-events:var(--sbb-tooltip-pointer-events);top:var(--sbb-tooltip-position-y);bottom:unset;left:var(--sbb-tooltip-position-x);right:unset;border:var(--sbb-border-width-1x) solid var(--sbb-tooltip-border-color);border-radius:var(--sbb-tooltip-border-radius);padding:var(--sbb-tooltip-padding);max-width:var(--sbb-tooltip-max-width);width:max-content;color:var(--sbb-tooltip-color);background-color:var(--sbb-tooltip-background-color);outline:none;animation-name:var(--sbb-tooltip-animation-name);animation-duration:var(--sbb-tooltip-animation-duration);animation-timing-function:var(--sbb-tooltip-animation-easing)}.sbb-tooltip:before{content:"";display:block;position:absolute;inset:0;z-index:-1;background-color:transparent;inset-block:var(--sbb-tooltip-hover-patch-inset)}@keyframes open{0%{opacity:0;translate:var(--sbb-tooltip-animation-translate)}to{opacity:1;translate:0}}@keyframes close{0%{opacity:1;translate:0}to{opacity:0;translate:var(--sbb-tooltip-animation-translate)}}`, G = 500, V = 8, Y = 16, J = q || R, m = /* @__PURE__ */ new WeakMap();
18
- let K = 0, pt = (() => {
19
- var n, l;
20
- let s = [z("sbb-tooltip")], i, a = [], r, v = B(I), p = [], _, y = [], f = [], T, C, x;
11
+ import { SbbEscapableOverlayController as I, SbbOverlayPositionController as M } from "../core/controllers.js";
12
+ import { idReference as U } from "../core/decorators.js";
13
+ import { queueDomContentLoaded as H, addToListAttribute as q, removeFromListAttribute as Z, isZeroAnimationDuration as j, isAndroid as B, isIOS as $ } from "../core/dom.js";
14
+ import { SbbDisabledMixin as F } from "../core/mixins.js";
15
+ import { sbbOverlayOutsidePointerEventListener as P } from "../core/overlay.js";
16
+ const R = L`*,:before,:after{box-sizing:border-box}:host{--sbb-tooltip-pointer-events: all;--sbb-tooltip-min-width: var(--sbb-spacing-fixed-8x);--sbb-tooltip-max-width: min( 25rem, calc(100vw - var(--sbb-spacing-fixed-2x)) );--sbb-tooltip-border-color: var(--sbb-background-color-1-inverted);--sbb-tooltip-border-radius: var(--sbb-border-radius-8x);--sbb-tooltip-padding: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-fixed-4x);--sbb-tooltip-background-color: var(--sbb-background-color-1-inverted);--sbb-tooltip-color: var(--sbb-color-2-inverted);--sbb-tooltip-animation-duration: var( --sbb-disable-animation-duration, var(--sbb-animation-duration-4x) );--sbb-tooltip-animation-easing: ease-out;--sbb-tooltip-animation-translate: 0 var(--sbb-spacing-fixed-2x);--sbb-tooltip-gap: var(--sbb-spacing-fixed-2x);--sbb-overlay-position-area: block-start;--sbb-overlay-position-try-fallbacks: block-start span-inline-end, block-start span-inline-start, block-end, block-end span-inline-end, block-end span-inline-start;position-area:var(--sbb-overlay-position-area);position-try-fallbacks:var(--sbb-overlay-position-try-fallbacks);display:none;position:fixed;background-color:transparent;pointer-events:var(--sbb-tooltip-pointer-events);z-index:var(--sbb-tooltip-z-index, var(--sbb-overlay-default-z-index));animation-name:var(--sbb-tooltip-animation-name);animation-duration:var(--sbb-tooltip-animation-duration);animation-timing-function:var(--sbb-tooltip-animation-easing);border:none;inset:initial;padding:0;margin:0}:host([data-state]:not([data-state=closed])){display:block;--sbb-tooltip-animation-name: open}:host([data-state][data-state=closing]){--sbb-tooltip-animation-name: close;--sbb-tooltip-pointer-events: none}:host(:is([data-position~=block-end],[data-position~=bottom],[data-position^=end])){padding-block-start:var(--sbb-tooltip-gap)}:host(:is([data-position~=block-start],[data-position~=top],[data-position^=start])){padding-block-end:var(--sbb-tooltip-gap)}:host(:is([data-position~=inline-start],[data-position~=inline-end],[data-position~=left],[data-position~=right],[data-position$=" start"],[data-position$=" end"])){padding-inline:var(--sbb-tooltip-gap)}.sbb-tooltip{box-shadow:var(--sbb-shadow-elevation-level-5-shadow-2-offset-x) var(--sbb-shadow-elevation-level-5-shadow-2-offset-y) var(--sbb-shadow-elevation-level-5-shadow-2-blur) var(--sbb-shadow-elevation-level-5-shadow-2-spread) var(--sbb-shadow-color-soft-2),var(--sbb-shadow-elevation-level-5-shadow-1-offset-x) var(--sbb-shadow-elevation-level-5-shadow-1-offset-y) var(--sbb-shadow-elevation-level-5-shadow-1-blur) var(--sbb-shadow-elevation-level-5-shadow-1-spread) var(--sbb-shadow-color-soft-1);--sbb-text-font-size: var(--sbb-font-size-text-xs);font-family:var(--sbb-typo-font-family);font-weight:400;line-height:var(--sbb-typo-line-height-body-text);letter-spacing:var(--sbb-typo-letter-spacing-body-text);font-size:var(--sbb-text-font-size);border:var(--sbb-border-width-1x) solid var(--sbb-tooltip-border-color);border-radius:var(--sbb-tooltip-border-radius);padding:var(--sbb-tooltip-padding);color:var(--sbb-tooltip-color);background-color:var(--sbb-tooltip-background-color);min-width:var(--sbb-tooltip-min-width);max-width:var(--sbb-tooltip-max-width)}@keyframes open{0%{opacity:0;translate:var(--sbb-tooltip-animation-translate)}to{opacity:1;translate:0}}@keyframes close{0%{opacity:1;translate:0}to{opacity:0;translate:var(--sbb-tooltip-animation-translate)}}`, G = 500, W = B || $, m = /* @__PURE__ */ new WeakMap();
17
+ let Y = 0, rt = (() => {
18
+ var d, l;
19
+ let i = [z("sbb-tooltip")], s, a = [], r, v = F(N), p = [], y, _ = [], f = [], T, C, D;
21
20
  return l = class extends v {
22
21
  constructor() {
23
22
  super();
24
- P(this, n);
25
- u(this, n, (h(this, p), h(this, y, null))), this._openDelay = (h(this, f), null), this._closeDelay = null, this._triggerElement = null, this._escapableOverlayController = new M(this), this.addEventListener("mouseleave", (t) => {
23
+ k(this, d);
24
+ u(this, d, (c(this, p), c(this, _, null))), this._openDelay = (c(this, f), null), this._closeDelay = null, this._triggerElement = null, this._escapableOverlayController = new I(this), this._overlayController = new M(this), this.addEventListener("mouseleave", (t) => {
26
25
  (this.state === "opened" || this.state === "opening") && (!t.relatedTarget || !this._triggerElement?.contains(t.relatedTarget)) && this._delayedClose();
27
- }, { passive: !0 }), this.addEventListener("overlayOutsidePointer", () => this.close(), { passive: !0 });
26
+ }, { passive: !0 }), this.addEventListener("overlayOutsidePointer", () => this.close(), { passive: !0 }), this.addEventListener("animationend", (t) => this._onTooltipAnimationEnd(t), { passive: !0 });
28
27
  }
29
28
  /**
30
- * The element that will trigger the popover overlay.
29
+ * The element that will trigger the tooltip overlay.
31
30
  *
32
31
  * For attribute usage, provide an id reference.
33
32
  */
34
33
  get trigger() {
35
- return w(this, n);
34
+ return w(this, d);
36
35
  }
37
36
  set trigger(t) {
38
- u(this, n, t);
37
+ u(this, d, t);
39
38
  }
40
39
  /**
41
40
  * Open the tooltip after a given delay in milliseconds.
@@ -74,20 +73,20 @@ let K = 0, pt = (() => {
74
73
  return this._longPressCloseDelay ?? g().tooltip?.longPressCloseDelay ?? 1500;
75
74
  }
76
75
  static _initializeTooltipOutlet() {
77
- this._tooltipOutlet = document.createElement("div"), this._tooltipOutlet.classList.add("sbb-overlay-outlet"), document.body.appendChild(this._tooltipOutlet);
78
- const t = /* @__PURE__ */ new Map([
79
- ["sbb-tooltip-open-delay", "open-delay"],
80
- ["sbb-tooltip-close-delay", "close-delay"]
81
- ]);
82
- new MutationObserver((e) => {
83
- for (const o of e)
84
- if (o.type === "attributes")
85
- this._handleTooltipTrigger(o.target);
86
- else if (o.type === "childList")
87
- for (const d of [...o.addedNodes, ...o.removedNodes].filter((D) => D.nodeType === D.ELEMENT_NODE))
88
- this._handleTooltipTrigger(d), this._findAndHandleTooltipTriggers(d);
76
+ this._tooltipOutlet = document.createElement("div"), this._tooltipOutlet.classList.add("sbb-overlay-outlet"), document.body.appendChild(this._tooltipOutlet), new MutationObserver((t) => {
77
+ for (const e of t)
78
+ if (e.type === "attributes")
79
+ this._handleTooltipTrigger(e.target);
80
+ else if (e.type === "childList")
81
+ for (const o of [...e.addedNodes, ...e.removedNodes].filter((n) => n.nodeType === n.ELEMENT_NODE))
82
+ this._handleTooltipTrigger(o), this._findAndHandleTooltipTriggers(o);
89
83
  }).observe(document.documentElement, {
90
- attributeFilter: ["sbb-tooltip", ...t.keys()],
84
+ attributeFilter: [
85
+ "sbb-tooltip",
86
+ "sbb-tooltip-open-delay",
87
+ "sbb-tooltip-close-delay",
88
+ "sbb-tooltip-position"
89
+ ],
91
90
  childList: !0,
92
91
  subtree: !0
93
92
  }), this._findAndHandleTooltipTriggers(document.body);
@@ -98,22 +97,26 @@ let K = 0, pt = (() => {
98
97
  static _handleTooltipTrigger(t) {
99
98
  const e = t.getAttribute("sbb-tooltip");
100
99
  let o = m.get(t);
101
- e && t.isConnected ? (o || (o = document.createElement("sbb-tooltip"), m.set(t, o), this._tooltipOutlet.appendChild(o), o.trigger = t), o.textContent = e, o.openDelay = t.hasAttribute("sbb-tooltip-open-delay") ? +t.getAttribute("sbb-tooltip-open-delay") : null, o.closeDelay = t.hasAttribute("sbb-tooltip-close-delay") ? +t.getAttribute("sbb-tooltip-close-delay") : null) : o && (m.delete(t), o._destroy());
100
+ if (e && t.isConnected) {
101
+ o || (o = document.createElement("sbb-tooltip"), m.set(t, o), this._tooltipOutlet.appendChild(o), o.trigger = t), o.textContent = e, o.openDelay = t.hasAttribute("sbb-tooltip-open-delay") ? +t.getAttribute("sbb-tooltip-open-delay") : null, o.closeDelay = t.hasAttribute("sbb-tooltip-close-delay") ? +t.getAttribute("sbb-tooltip-close-delay") : null;
102
+ const n = t.hasAttribute("sbb-tooltip-position") ? t.getAttribute("sbb-tooltip-position").split(",").map((A) => A.trim()) : t.tooltipPositions;
103
+ n && n.length > 0 ? (o.style.setProperty("--sbb-overlay-position-area", n[0]), o.style.setProperty("--sbb-overlay-position-try-fallbacks", n.slice(1).join(", "))) : (o.style.removeProperty("--sbb-overlay-position-area"), o.style.removeProperty("--sbb-overlay-position-try-fallbacks"));
104
+ } else o && (m.delete(t), o._destroy());
102
105
  }
103
106
  connectedCallback() {
104
- super.connectedCallback(), this.popover = "manual", this.id ||= `sbb-tooltip-${++K}`, this.state = "closed", L.connect(this), this.hasUpdated && this.trigger && this._attach(this.trigger);
107
+ super.connectedCallback(), this.popover = "manual", this.id ||= `sbb-tooltip-${++Y}`, this.state = "closed", P.connect(this), this.hasUpdated && this.trigger && this._attach(this.trigger);
105
108
  }
106
109
  disconnectedCallback() {
107
- super.disconnectedCallback(), L.disconnect(this), this._detach();
110
+ super.disconnectedCallback(), P.disconnect(this), this._detach();
108
111
  }
109
112
  requestUpdate(t, e, o) {
110
- super.requestUpdate(t, e, o), !A && (!t || t === "trigger") && this.hasUpdated && this._attach(this.trigger);
113
+ super.requestUpdate(t, e, o), !E && (!t || t === "trigger") && this.hasUpdated && this._attach(this.trigger);
111
114
  }
112
115
  firstUpdated(t) {
113
116
  super.firstUpdated(t), this._attach(this.trigger);
114
117
  }
115
118
  open() {
116
- this._resetOpenCloseTimeout(), !(this.state !== "closed" && this.state !== "closing" || this.disabled || !this.overlay || !this.dispatchBeforeOpenEvent()) && (this.showPopover?.(), this.state = "opening", this._setTooltipPosition(), this._isZeroAnimationDuration() && this._handleOpening());
119
+ this._resetOpenCloseTimeout(), !(this.state !== "closed" && this.state !== "closing" || this.disabled || !this.trigger || !this.dispatchBeforeOpenEvent()) && (this.showPopover?.(), this.state = "opening", this._overlayController.connect(this.trigger), this._isZeroAnimationDuration() && this._handleOpening());
117
120
  }
118
121
  close() {
119
122
  this._resetOpenCloseTimeout(), !(this.state !== "opened" && this.state !== "opening") && (this.dispatchBeforeCloseEvent(), this.state = "closing", this._isZeroAnimationDuration() && this._handleClosing());
@@ -122,19 +125,19 @@ let K = 0, pt = (() => {
122
125
  this._resetOpenCloseTimeout(), this._openTimeout = setTimeout(() => this.open(), this.openDelay);
123
126
  }
124
127
  _handleOpening() {
125
- this.state = "opened", this._attachWindowEvents(), this._escapableOverlayController.connect(), this.dispatchOpenEvent();
128
+ this.state = "opened", this._escapableOverlayController.connect(), this.dispatchOpenEvent();
126
129
  }
127
130
  _delayedClose() {
128
131
  this._resetOpenCloseTimeout(), this._closeTimeout = setTimeout(() => this.close(), this.closeDelay);
129
132
  }
130
133
  _handleClosing() {
131
- this.state = "closed", this.hidePopover?.(), this._escapableOverlayController.disconnect(), this.dispatchCloseEvent(), this._openStateController?.abort();
134
+ this.state = "closed", this.hidePopover?.(), this._overlayController.disconnect(), this._escapableOverlayController.disconnect(), this.dispatchCloseEvent(), this._openStateController?.abort();
132
135
  }
133
136
  _onTooltipAnimationEnd(t) {
134
137
  t.animationName === "open" && this.state === "opening" ? this._handleOpening() : t.animationName === "close" && this.state === "closing" && this._handleClosing();
135
138
  }
136
139
  _attach(t) {
137
- this._triggerElement && this._detach(), this._triggerElement = t, this._triggerElement && (U(this._triggerElement, "aria-describedby", this.id), this._addTriggerEventHandlers());
140
+ this._triggerElement && this._detach(), this._triggerElement = t, this._triggerElement && (q(this._triggerElement, "aria-describedby", this.id), this._addTriggerEventHandlers());
138
141
  }
139
142
  _detach() {
140
143
  this._triggerAbortController?.abort(), this._openStateController?.abort(), this._resetOpenCloseTimeout(), clearTimeout(this._longPressOpenTimeout), clearTimeout(this._longPressCloseTimeout), this._triggerElement && (Z(this._triggerElement, "aria-describedby", this.id), this._triggerElement = null);
@@ -142,17 +145,6 @@ let K = 0, pt = (() => {
142
145
  _destroy() {
143
146
  this._detach(), this.remove();
144
147
  }
145
- _setTooltipPosition() {
146
- if (!this.overlay || !this._triggerElement)
147
- return;
148
- const t = W(this.overlay, this._triggerElement, this, {
149
- verticalOffset: V,
150
- horizontalOffset: Y,
151
- centered: !0,
152
- responsiveHeight: !0
153
- });
154
- this.setAttribute("data-position", t.alignment.vertical), this.style.setProperty("--sbb-tooltip-position-x", `${t.left}px`), this.style.setProperty("--sbb-tooltip-position-y", `${t.top}px`);
155
- }
156
148
  _addTriggerEventHandlers() {
157
149
  const t = this._triggerElement;
158
150
  if (!t)
@@ -162,9 +154,9 @@ let K = 0, pt = (() => {
162
154
  signal: this._triggerAbortController.signal,
163
155
  passive: !0
164
156
  };
165
- J || (t.addEventListener("mouseenter", () => this._delayedOpen(), e), t.addEventListener("mouseleave", (o) => {
166
- const d = o.relatedTarget;
167
- (!d || d !== this) && this._delayedClose();
157
+ W || (t.addEventListener("mouseenter", () => this._delayedOpen(), e), t.addEventListener("mouseleave", (o) => {
158
+ const n = o.relatedTarget;
159
+ (!n || n !== this) && this._delayedClose();
168
160
  }, e), t.addEventListener("blur", () => this.close(), e), t.addEventListener("focus", () => this._delayedOpen(), e)), t.addEventListener("touchstart", () => {
169
161
  clearTimeout(this._longPressOpenTimeout), clearTimeout(this._longPressCloseTimeout), this._longPressOpenTimeout = setTimeout(() => this.open(), G);
170
162
  }, e), t.addEventListener("touchend", () => {
@@ -173,48 +165,32 @@ let K = 0, pt = (() => {
173
165
  clearTimeout(this._longPressOpenTimeout);
174
166
  }, e);
175
167
  }
176
- _attachWindowEvents() {
177
- this._openStateController = new AbortController(), document.addEventListener("scroll", () => this._setTooltipPosition(), {
178
- passive: !0,
179
- signal: this._openStateController.signal,
180
- // Without capture, other scroll contexts would not bubble to this event listener.
181
- // Capture allows us to react to all scroll contexts in this DOM.
182
- capture: !0
183
- }), window.addEventListener("resize", () => this._setTooltipPosition(), {
184
- passive: !0,
185
- signal: this._openStateController.signal
186
- });
187
- }
188
168
  _isZeroAnimationDuration() {
189
- return $(this, "--sbb-tooltip-animation-duration");
169
+ return j(this, "--sbb-tooltip-animation-duration");
190
170
  }
191
171
  _resetOpenCloseTimeout() {
192
172
  clearTimeout(this._openTimeout), clearTimeout(this._closeTimeout);
193
173
  }
194
174
  render() {
195
175
  return S`
196
- <div
197
- @animationend=${this._onTooltipAnimationEnd}
198
- class="sbb-tooltip"
199
- ${N((t) => this.overlay = t)}
200
- >
176
+ <div class="sbb-tooltip">
201
177
  <slot></slot>
202
178
  </div>
203
179
  `;
204
180
  }
205
- }, n = new WeakMap(), r = l, (() => {
181
+ }, d = new WeakMap(), r = l, (() => {
206
182
  const t = typeof Symbol == "function" && Symbol.metadata ? Object.create(v[Symbol.metadata] ?? null) : void 0;
207
- _ = [H(), c()], T = [c({ attribute: "open-delay", type: Number })], C = [c({ attribute: "close-delay", type: Number })], x = [c({ attribute: "long-press-close-delay", type: Number })], b(l, null, _, { kind: "accessor", name: "trigger", static: !1, private: !1, access: { has: (e) => "trigger" in e, get: (e) => e.trigger, set: (e, o) => {
183
+ y = [U(), h()], T = [h({ attribute: "open-delay", type: Number })], C = [h({ attribute: "close-delay", type: Number })], D = [h({ attribute: "long-press-close-delay", type: Number })], b(l, null, y, { kind: "accessor", name: "trigger", static: !1, private: !1, access: { has: (e) => "trigger" in e, get: (e) => e.trigger, set: (e, o) => {
208
184
  e.trigger = o;
209
- } }, metadata: t }, y, f), b(l, null, T, { kind: "setter", name: "openDelay", static: !1, private: !1, access: { has: (e) => "openDelay" in e, set: (e, o) => {
185
+ } }, metadata: t }, _, f), b(l, null, T, { kind: "setter", name: "openDelay", static: !1, private: !1, access: { has: (e) => "openDelay" in e, set: (e, o) => {
210
186
  e.openDelay = o;
211
187
  } }, metadata: t }, null, p), b(l, null, C, { kind: "setter", name: "closeDelay", static: !1, private: !1, access: { has: (e) => "closeDelay" in e, set: (e, o) => {
212
188
  e.closeDelay = o;
213
- } }, metadata: t }, null, p), b(l, null, x, { kind: "setter", name: "longPressCloseDelay", static: !1, private: !1, access: { has: (e) => "longPressCloseDelay" in e, set: (e, o) => {
189
+ } }, metadata: t }, null, p), b(l, null, D, { kind: "setter", name: "longPressCloseDelay", static: !1, private: !1, access: { has: (e) => "longPressCloseDelay" in e, set: (e, o) => {
214
190
  e.longPressCloseDelay = o;
215
- } }, metadata: t }, null, p), b(null, i = { value: r }, s, { kind: "class", name: r.name, metadata: t }, null, a), r = i.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
216
- })(), l.role = "tooltip", l.styles = j, A || F(() => r._initializeTooltipOutlet()), h(r, a), r;
191
+ } }, metadata: t }, null, p), b(null, s = { value: r }, i, { kind: "class", name: r.name, metadata: t }, null, a), r = s.value, t && Object.defineProperty(r, Symbol.metadata, { enumerable: !0, configurable: !0, writable: !0, value: t });
192
+ })(), l.role = "tooltip", l.styles = R, E || H(() => r._initializeTooltipOutlet()), c(r, a), r;
217
193
  })();
218
194
  export {
219
- pt as SbbTooltipElement
195
+ rt as SbbTooltipElement
220
196
  };