@getflip/swirl-components-react 0.354.0 → 0.355.0

package/dist/{swirl-table.entry.dc2fb821.js → swirl-table.entry.f9aedaa3.js}

@@ -1,35 +1,35 @@
-import { r as x, c as _, h as a, H as R, g as k } from "./index.32954226.js";
-import { c as L, g as O } from "./index-orsBiyT_.fc4357c3.js";
-import { S as T } from "./sortable.esm-CMrz6687.dac971cd.js";
-import { d as A, i as f, q } from "./utils-D_MUFqkF.654ff3ce.js";
+import { r as x, c as R, h as a, H as _, g as k } from "./index.dece22df.js";
+import { c as O, g as L } from "./index-orsBiyT_.fc4357c3.js";
+import { S as A } from "./sortable.esm-CMrz6687.dac971cd.js";
+import { d as M, i as f, q as T } from "./utils-D_MUFqkF.654ff3ce.js";
 import "react";
 import "react-dom";
 var g, v;
-function I() {
+function E() {
   if (v)
     return g;
-  v = 1, g = function(i) {
-    var o = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0, s = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {}, n = void 0, l = void 0, u = void 0, d = [];
+  v = 1, g = function(o) {
+    var i = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0, s = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {}, n = void 0, l = void 0, u = void 0, d = [];
     return function() {
-      var y = e(o), m = new Date().getTime(), D = !n || m - n > y;
+      var y = e(i), m = new Date().getTime(), D = !n || m - n > y;
       n = m;
       for (var w = arguments.length, c = Array(w), h = 0; h < w; h++)
         c[h] = arguments[h];
       if (D && s.leading)
-        return s.accumulate ? Promise.resolve(i.call(this, [c])).then(function(b) {
-          return b[0];
-        }) : Promise.resolve(i.call.apply(i, [this].concat(c)));
+        return s.accumulate ? Promise.resolve(o.call(this, [c])).then(function(p) {
+          return p[0];
+        }) : Promise.resolve(o.call.apply(o, [this].concat(c)));
       if (l ? clearTimeout(u) : l = t(), d.push(c), u = setTimeout(C.bind(this), y), s.accumulate) {
         var S = d.length - 1;
-        return l.promise.then(function(b) {
-          return b[S];
+        return l.promise.then(function(p) {
+          return p[S];
         });
       }
       return l.promise;
     };
     function C() {
-      var p = l;
-      clearTimeout(u), Promise.resolve(s.accumulate ? i.call(this, d) : i.apply(this, d[d.length - 1])).then(p.resolve, p.reject), d = [], l = null;
+      var b = l;
+      clearTimeout(u), Promise.resolve(s.accumulate ? o.call(this, d) : o.apply(this, d[d.length - 1])).then(b.resolve, b.reject), d = [], l = null;
     }
   };
   function e(r) {
@@ -37,58 +37,56 @@ function I() {
   }
   function t() {
     var r = {};
-    return r.promise = new Promise(function(i, o) {
-      r.resolve = i, r.reject = o;
+    return r.promise = new Promise(function(o, i) {
+      r.resolve = o, r.reject = i;
     }), r;
   }
   return g;
 }
-var E = I(), K = /* @__PURE__ */ O(E);
-const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *.sc-swirl-table{box-sizing:border-box}.table--keyboard-move.sc-swirl-table:focus-within{--swirl-table-moving-row-border:var(--s-border-width-default) solid
+var q = E(), I = /* @__PURE__ */ L(q);
+const K = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *.sc-swirl-table{box-sizing:border-box}.table--keyboard-move.sc-swirl-table:focus-within{--swirl-table-moving-row-border:var(--s-border-width-default) solid
       var(--s-border-highlight)}.table__container.sc-swirl-table{position:relative;overflow:auto;width:100%}.table__container--scrolled.sc-swirl-table{--swirl-table-sticky-right-shadow:4px 0 16px -4px rgba(23, 23, 23, 0.04),
     2px 0 4px -2px rgba(23, 23, 23, 0.04)}.table__container--scrollable.sc-swirl-table:not(.table__container--scrolled-to-end){--swirl-table-sticky-left-shadow:0px 4px 16px 0px rgba(23, 23, 23, 0.04),
-    0px 1px 4px 0px rgba(23, 23, 23, 0.04)}.table__table.sc-swirl-table{width:-webkit-max-content;width:-moz-max-content;width:max-content;min-width:max(20rem, 100%)}.table__header.sc-swirl-table-s>*,.table__header .sc-swirl-table-s>*{display:flex}.table__empty-row.sc-swirl-table{display:flex}.table__empty-row-cell.sc-swirl-table{display:flex;overflow:auto;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);flex-basis:0;flex-grow:1;flex-shrink:1;align-items:center;background-color:var(--s-surface-default)}.table__empty-row-cell.sc-swirl-table>*.sc-swirl-table{flex-grow:1}`, M = {
+    0px 1px 4px 0px rgba(23, 23, 23, 0.04)}.table__table.sc-swirl-table{width:-webkit-max-content;width:-moz-max-content;width:max-content;min-width:max(20rem, 100%)}.table__header.sc-swirl-table-s>*,.table__header .sc-swirl-table-s>*{display:flex}.table__empty-row.sc-swirl-table{display:flex}.table__empty-row-cell.sc-swirl-table{display:flex;overflow:auto;padding-top:var(--s-space-8);padding-right:var(--s-space-16);padding-bottom:var(--s-space-8);padding-left:var(--s-space-16);flex-basis:0;flex-grow:1;flex-shrink:1;align-items:center;background-color:var(--s-surface-default)}.table__empty-row-cell.sc-swirl-table>*.sc-swirl-table{flex-grow:1}`, B = {
   end: "Dropped. Final position in table: {position} of {rowCount}.",
   initial: "Press space to move the row.",
   moved: "Current position in table: {position} of {rowCount}.",
   start: "Row grabbed. Current position in table: {position} of {rowCount}. Press up and down arrow keys to change position, Space to drop."
-}, H = class {
+}, W = class {
   constructor(e) {
-    x(this, e), this.dropRow = _(this, "dropRow", 7), this.dragDropInstructions = M, this.emptyStateLabel = "No results found.", this.liveRegionText = "", this.triggerRerender = A(async () => {
+    x(this, e), this.dropRow = R(this, "dropRow", 7), this.dragDropInstructions = B, this.emptyStateLabel = "No results found.", this.liveRegionText = "", this.triggerRerender = M(async () => {
       await this.updateLayout(), this.updateEmptyState();
-    }, 0, !0), this.updateLayout = K(async () => {
+    }, 0, !0), this.updateLayout = I(async () => {
       this.resetCellStyles(), this.resetColumnStyles(), this.resetEmptyRowStyles(), this.resetRowGroupStyles(), this.layoutEmptyRow(), this.layoutRowGroups(), this.layOutCellsAndColumns(), this.updateScrolledState();
     }, 16, { leading: !0 }), this.onScroll = () => {
       this.updateScrolledState();
-    }, this.onSlotChange = async () => {
-      await this.updateLayout(), this.updateEmptyState(), this.setupDragDrop();
     }, this.onFocus = (t) => {
-      var i;
+      var o;
       if (this.movingViaKeyboard) {
-        const o = this.el.querySelector(".table-row--moving");
-        o && this.focusDragHandleOfRow(o);
+        const i = this.el.querySelector(".table-row--moving");
+        i && this.focusDragHandleOfRow(i);
       }
-      const r = !!((i = t.target) != null && i.closest(this.dragDropHandle));
+      const r = !!((o = t.target) != null && o.closest(this.dragDropHandle));
       this.liveRegionText === "" && r && this.updateLiveRegionText("initial");
     }, this.onBlur = (t) => {
-      const r = t.relatedTarget, i = !!(r != null && r.closest(this.dragDropHandle));
-      this.el.contains(r) && i || this.liveRegionText !== "" && this.updateLiveRegionText();
+      const r = t.relatedTarget, o = !!(r != null && r.closest(this.dragDropHandle));
+      this.el.contains(r) && o || this.liveRegionText !== "" && this.updateLiveRegionText();
     }, this.onKeyDown = (t) => {
-      var o, s;
+      var i, s;
       if (!this.enableDragDrop)
         return;
-      const r = (o = t.target) == null ? void 0 : o.closest("swirl-table-row");
+      const r = (i = t.target) == null ? void 0 : i.closest("swirl-table-row");
       !((s = t.target) != null && s.closest(this.dragDropHandle)) || (t.code === "Space" ? (t.preventDefault(), t.stopPropagation(), this.toggleKeyboardMove(r)) : t.code === "ArrowUp" ? (t.preventDefault(), t.stopPropagation(), this.moveRow(r, "up")) : t.code === "ArrowDown" ? (t.preventDefault(), t.stopPropagation(), this.moveRow(r, "down")) : t.code === "Escape" && (t.preventDefault(), t.stopPropagation(), this.cancelKeyboardMove()));
     };
   }
   async componentDidLoad() {
-    this.setupIntersectionObserver(), queueMicrotask(() => {
+    this.setupIntersectionObserver(), this.setupMutationObservers(), queueMicrotask(() => {
       this.setupDragDrop();
     });
   }
   disconnectedCallback() {
-    var e, t;
-    (e = this.intersectionObserver) == null || e.disconnect(), (t = this.sortable) == null || t.destroy();
+    var e, t, r, o;
+    (e = this.intersectionObserver) == null || e.disconnect(), (t = this.columnMutationObserver) == null || t.disconnect(), (r = this.rowMutationObserver) == null || r.disconnect(), (o = this.sortable) == null || o.destroy();
   }
   handleEnableDragDropChange() {
     queueMicrotask(() => {
@@ -100,6 +98,18 @@ const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *
       threshold: 0
     }), this.intersectionObserver.observe(this.container);
   }
+  setupMutationObservers() {
+    this.columnMutationObserver = new MutationObserver((e) => {
+      e.some((r) => r.addedNodes.length || r.removedNodes.length) && this.updateLayout();
+    }), this.columnMutationObserver.observe(this.headerEl, {
+      childList: !0,
+      subtree: !0
+    }), this.rowMutationObserver = new MutationObserver((e) => {
+      e.some((r) => r.addedNodes.length || r.removedNodes.length) && (this.updateEmptyState(), this.setupDragDrop());
+    }), this.rowMutationObserver.observe(this.bodyEl, {
+      childList: !0
+    });
+  }
   setupDragDrop() {
     if (this.sortable && (this.sortable.destroy(), this.sortable = void 0), this.enableDragDrop) {
       if (!!this.el.querySelector("swirl-table-row-group")) {
@@ -111,7 +121,7 @@ const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *
         return;
       }
       const t = this.el.querySelector('[slot="rows"]');
-      this.dragDropContainer = (t == null ? void 0 : t.tagName) !== "SWIRL-TABLE-ROW" ? t != null ? t : this.bodyEl : this.bodyEl, this.sortable = new T(this.dragDropContainer, {
+      this.dragDropContainer = (t == null ? void 0 : t.tagName) !== "SWIRL-TABLE-ROW" ? t != null ? t : this.bodyEl : this.bodyEl, this.sortable = new A(this.dragDropContainer, {
         animation: 100,
         direction: "vertical",
         handle: this.dragDropHandle,
@@ -120,14 +130,14 @@ const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *
         onEnd: (r) => {
           var l;
           r.stopPropagation();
-          const { to: i, newIndex: o, oldIndex: s, item: n } = r;
+          const { to: o, newIndex: i, oldIndex: s, item: n } = r;
           this.dropRow.emit({
-            newIndex: o,
+            newIndex: i,
             oldIndex: s,
             item: n,
             itemId: (l = n.id) != null ? l : n.querySelector(":scope > swirl-table-row").id,
-            newNextSiblingItemId: o < i.children.length - 1 ? i.children[o + 1].id : void 0,
-            newPrevSiblingItemId: o > 0 ? i.children[o - 1].id : void 0
+            newNextSiblingItemId: i < o.children.length - 1 ? o.children[i + 1].id : void 0,
+            newPrevSiblingItemId: i > 0 ? o.children[i - 1].id : void 0
           });
         }
       });
@@ -171,8 +181,8 @@ const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *
     const e = f();
     if (this.container === void 0)
       return;
-    const t = this.container.scrollWidth > this.container.clientWidth, r = this.container.scrollLeft > 0, i = Math.ceil(this.container.clientWidth + this.container.scrollLeft) >= Math.floor(this.container.scrollWidth);
-    t !== this.scrollable && (t && !e ? this.container.classList.add("table__container--scrollable") : this.container.classList.remove("table__container--scrollable")), r !== this.scrolled && (r && !e ? this.container.classList.add("table__container--scrolled") : this.container.classList.remove("table__container--scrolled")), i !== this.scrolledToEnd && (i && !e ? this.container.classList.add("table__container--scrolled-to-end") : this.container.classList.remove("table__container--scrolled-to-end"));
+    const t = this.container.scrollWidth > this.container.clientWidth, r = this.container.scrollLeft > 0, o = Math.ceil(this.container.clientWidth + this.container.scrollLeft) >= Math.floor(this.container.scrollWidth);
+    t !== this.scrollable && (t && !e ? this.container.classList.add("table__container--scrollable") : this.container.classList.remove("table__container--scrollable")), r !== this.scrolled && (r && !e ? this.container.classList.add("table__container--scrolled") : this.container.classList.remove("table__container--scrolled")), o !== this.scrolledToEnd && (o && !e ? this.container.classList.add("table__container--scrolled-to-end") : this.container.classList.remove("table__container--scrolled-to-end"));
   }
   getColumns() {
     return Array.from(this.el.querySelectorAll("swirl-table-column"));
@@ -190,44 +200,44 @@ const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *
   layoutRowGroups() {
     var r;
     const e = Array.from(this.el.querySelectorAll("swirl-table-row-group")), t = `${(r = this.el.querySelector(".table__container")) == null ? void 0 : r.scrollWidth}px`;
-    e.forEach((i) => {
-      const o = i.shadowRoot.querySelector(".table-row-group__header-row");
-      !Boolean(o) || (i.shadowRoot.querySelector(".table-row-group__header-row").style.width = t);
+    e.forEach((o) => {
+      const i = o.shadowRoot.querySelector(".table-row-group__header-row");
+      !Boolean(i) || (o.shadowRoot.querySelector(".table-row-group__header-row").style.width = t);
     });
   }
   layOutCellsAndColumns() {
     const e = this.getColumns(), t = this.getCells();
-    e.forEach((r, i) => {
-      const o = this.getCellsForColumn(t, e, i), s = this.calculateColumnProperties(r, e, i);
-      o.forEach((n) => this.applyCellStyles(n, r, s)), this.applyColumnStyles(r, s);
+    e.forEach((r, o) => {
+      const i = this.getCellsForColumn(t, e, o), s = this.calculateColumnProperties(r, e, o);
+      i.forEach((n) => this.applyCellStyles(n, r, s)), this.applyColumnStyles(r, s);
     });
   }
   getCellsForColumn(e, t, r) {
-    return e.filter((i, o) => (r - o) % t.length === 0);
+    return e.filter((o, i) => (r - i) % t.length === 0);
   }
   calculateColumnProperties(e, t, r) {
-    const i = e.sticky ? this.getLeftOffsetForStickyColumn(t, r) : 0, o = `${e.getBoundingClientRect().width}px`, s = e.sticky && t.length === r + 1, n = e.sticky && !this.hasStickyColumnsToRight(t, r);
+    const o = e.sticky ? this.getLeftOffsetForStickyColumn(t, r) : 0, i = `${e.getBoundingClientRect().width}px`, s = e.sticky && t.length === r + 1, n = e.sticky && !this.hasStickyColumnsToRight(t, r);
     return {
-      leftOffsetForStickyColumn: i,
-      columnWidth: o,
+      leftOffsetForStickyColumn: o,
+      columnWidth: i,
       isLastColumnSticky: s,
       hasShadowRight: n
     };
   }
   applyCellStyles(e, t, r) {
-    const { leftOffsetForStickyColumn: i, columnWidth: o, isLastColumnSticky: s, hasShadowRight: n } = r;
-    e.style.flex = Boolean(o) ? `0 0 ${o}` : "", !f() && (t.sticky && !s && (e.classList.add("table-cell--is-sticky"), e.style.left = i + "px", n && e.classList.add("table-cell--has-shadow-right")), s && e.classList.add("table-cell--is-sticky-right", "table-cell--has-shadow-left"));
+    const { leftOffsetForStickyColumn: o, columnWidth: i, isLastColumnSticky: s, hasShadowRight: n } = r;
+    e.style.flex = Boolean(i) ? `0 0 ${i}` : "", !f() && (t.sticky && !s && (e.classList.add("table-cell--is-sticky"), e.style.left = o + "px", n && e.classList.add("table-cell--has-shadow-right")), s && e.classList.add("table-cell--is-sticky-right", "table-cell--has-shadow-left"));
   }
   applyColumnStyles(e, t) {
     if (f())
       return;
-    const { leftOffsetForStickyColumn: r, isLastColumnSticky: i, hasShadowRight: o } = t;
-    e.sticky && !i && (e.classList.add("table-column--is-sticky"), e.style.left = r + "px", o && e.classList.add("table-column--has-shadow-right")), i && e.classList.add("table-column--is-sticky-right", "table-column--has-shadow-left");
+    const { leftOffsetForStickyColumn: r, isLastColumnSticky: o, hasShadowRight: i } = t;
+    e.sticky && !o && (e.classList.add("table-column--is-sticky"), e.style.left = r + "px", i && e.classList.add("table-column--has-shadow-right")), o && e.classList.add("table-column--is-sticky-right", "table-column--has-shadow-left");
   }
   getLeftOffsetForStickyColumn(e, t) {
-    return e.slice(0, t).reduce((r, i) => {
-      if (i.sticky)
-        return r += i.getBoundingClientRect().width, r;
+    return e.slice(0, t).reduce((r, o) => {
+      if (o.sticky)
+        return r += o.getBoundingClientRect().width, r;
     }, 0);
   }
   hasStickyColumnsToRight(e, t) {
@@ -239,8 +249,8 @@ const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *
   }
   updateLiveRegionText(e, t = {}) {
     let r = e ? this.dragDropInstructions[e] : "";
-    for (const [i, o] of Object.entries(t != null ? t : {}))
-      r = r.replaceAll(`{${i}}`, String(o));
+    for (const [o, i] of Object.entries(t != null ? t : {}))
+      r = r.replaceAll(`{${o}}`, String(i));
     r !== this.liveRegionText && (this.liveRegionText = r);
   }
   toggleKeyboardMove(e) {
@@ -276,11 +286,11 @@ const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *
       return;
     let r;
     if (t === "up") {
-      const i = Array.from(this.dragDropContainer.children).indexOf(e);
-      r = Math.max(0, i - 1), this.dragDropContainer.insertBefore(e, this.dragDropContainer.children[r]);
+      const o = Array.from(this.dragDropContainer.children).indexOf(e);
+      r = Math.max(0, o - 1), this.dragDropContainer.insertBefore(e, this.dragDropContainer.children[r]);
     } else {
-      const i = Array.from(this.dragDropContainer.children).indexOf(e);
-      r = Math.min(this.dragDropContainer.children.length - 1, i + 1), this.dragDropContainer.insertBefore(e, this.dragDropContainer.children[r + 1]);
+      const o = Array.from(this.dragDropContainer.children).indexOf(e);
+      r = Math.min(this.dragDropContainer.children.length - 1, o + 1), this.dragDropContainer.insertBefore(e, this.dragDropContainer.children[r + 1]);
     }
     this.updateLiveRegionText("moved", {
       position: r + 1,
@@ -288,15 +298,15 @@ const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *
     }), this.focusDragHandleOfRow(e);
   }
   focusDragHandleOfRow(e) {
-    var r, i;
-    const t = (r = q(e, this.dragDropHandle)) == null ? void 0 : r[0];
-    t.tagName === "BUTTON" ? t.focus() : (i = t.querySelector("button")) == null || i.focus();
+    var r, o;
+    const t = (r = T(e, this.dragDropHandle)) == null ? void 0 : r[0];
+    t.tagName === "BUTTON" ? t.focus() : (o = t.querySelector("button")) == null || o.focus();
   }
   render() {
-    const e = L("table", {
+    const e = Boolean(this.el.querySelector('[slot="empty"]')), t = O("table", {
       "table--keyboard-move": this.movingViaKeyboard
     });
-    return a(R, { key: "fa6ada9c1392d25d14d63ce2148d8bbaa270d149" }, a("div", { key: "140ef307cb0fd252ea6008b55fa95af4d7ca0f9c", class: e }, this.enableDragDrop && a("swirl-visually-hidden", { key: "a09dce7d22ec1870f5ee0378992690ae68a2ebc9" }, a("span", { key: "06e0ab8c80ea295c02ca957fb6a0be5c3a98cd7e", "aria-live": "assertive" }, this.liveRegionText)), a("div", { key: "c4f714e2e50eb9309dc6777896e372090dde888e", class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (t) => this.container = t, tabIndex: -1 }, a("div", { key: "f8257288ed4e815b1469ff9a2d96967fb153afc7", "aria-describedby": Boolean(this.caption) ? "caption" : void 0, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && a("swirl-visually-hidden", { key: "278db6b1b073b46cd535c969471d19d2c9614d90" }, a("div", { key: "a31b610a3e67b2293e1504fce94dfb47346706c1", id: "caption" }, this.caption)), a("div", { key: "41fd55e7f494bf8dabaa481ccd5aafe3679055e8", role: "rowgroup" }, a("div", { key: "b7f01129b67b00306ec39455d7b108c3feb1c77e", class: "table__header", role: "row" }, a("slot", { key: "ee52ef1609b677f2d307e011486f1b2ed07b74e1", name: "columns", onSlotchange: this.onSlotChange }))), a("div", { key: "f9d16b425802a850d5bc27c07bac5d360b8e3a0c", class: "table__body", ref: (t) => this.bodyEl = t }, a("slot", { key: "deb3035903d219eafba45c3c1eaa4a92f7054a39", name: "rows", onSlotchange: this.onSlotChange }), this.empty && a("div", { key: "917acdea0696b4d2ad3f7ff95f1d02dce30dfa2d", class: "table__empty-row", role: "row" }, a("div", { key: "54ed9ec80c9c020b87dc52855cbbe422769137a7", "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, a("swirl-text", { key: "c29a1fb7518fae1c613eb2236870b232d7bfb140", align: "center", size: "sm" }, this.emptyStateLabel))))))));
+    return a(_, { key: "71798732e8e937a5a808cef5f867eef1b2adaecb" }, a("div", { key: "95a8ad30cb5b0c0bdea6e13729d638020fbda51b", class: t }, this.enableDragDrop && a("swirl-visually-hidden", { key: "65419c2fb9a489b70f863a2c421f923a60768476" }, a("span", { key: "ca398aaaa789a7c719a12527aba651f3736cf4eb", "aria-live": "assertive" }, this.liveRegionText)), a("div", { key: "8cd332bb331b31060fe839140b3704275739b70b", class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (r) => this.container = r, tabIndex: -1 }, a("div", { key: "68fa8e690620d48c2f14a4967857c67f94158a22", "aria-describedby": Boolean(this.caption) ? "caption" : void 0, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && a("swirl-visually-hidden", { key: "b93d4712fa44c52126c2609da1b1b60fa0d5fba6" }, a("div", { key: "d8d72ae82bed714eeb07e658dd3ac1aad9a549fd", id: "caption" }, this.caption)), a("div", { key: "e2f1f3d19401d1f44c8536a9efc0b8a909320b75", role: "rowgroup" }, a("div", { key: "1882aec17470e8dd8d12c90254aa1a9c1542d348", class: "table__header", ref: (r) => this.headerEl = r, role: "row" }, a("slot", { key: "b570c8ff4b54ae8d69980c81cf375fe828b1d063", name: "columns" }))), a("div", { key: "64de0ca255ee47f77f62eb86fc72d0e8a26c0bd4", class: "table__body", ref: (r) => this.bodyEl = r }, a("slot", { key: "c452844b1903346f40720d45df7871b7d0dfa0ba", name: "rows" }), this.empty && a("div", { key: "0f4f29a0bbcb119d9e7593c94f4e4f14ff9ab6e7", class: "table__empty-row", role: "row" }, a("div", { key: "b5bdcaa4375e6f40bb0c1aae6e4c78bc7bc7cdc1", "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, a("slot", { key: "d7e9b0ffd6bef6146556b36e23bb37dbe5b9dde8", name: "empty" }), !e && a("swirl-text", { key: "a010b37117f401b565be6e5e3c0290cea5bfbe8f", align: "center", size: "sm" }, this.emptyStateLabel))))))));
   }
   get el() {
     return k(this);
@@ -307,7 +317,7 @@ const B = `.sc-swirl-table-h{position:relative;display:block}.sc-swirl-table-h *
     };
   }
 };
-H.style = B;
+W.style = K;
 export {
-  H as swirl_table
+  W as swirl_table
 };

package/dist/{swirl-tabs.entry.02b173eb.js → swirl-tabs.entry.4dba114f.js}

@@ -1,4 +1,4 @@
-import { r as b, c as r, h as s, H as n, g as c } from "./index.32954226.js";
+import { r as b, c as r, h as s, H as c, g as n } from "./index.dece22df.js";
 import { n as e } from "./utils-D_MUFqkF.654ff3ce.js";
 import "react";
 import "react-dom";
@@ -51,10 +51,10 @@ const d = ".sc-swirl-tabs-h{display:block;width:100%}.sc-swirl-tabs-h *.sc-swirl
     }));
   }
   render() {
-    return s(n, { key: "3c530775f9ebfd8f4369e7b86dce940449995410" }, s("div", { key: "104a9fd35949e15edd491eb932b6c1d317a6c86f", class: "tabs" }, s("swirl-tab-bar", { key: "ba7ee621398c9e6e13f7ac09a40eb549f84acbd4", label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingBlockEnd: this.tabBarPaddingBlockEnd, paddingBlockStart: this.tabBarPaddingBlockStart, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart, variant: this.tabBarVariant })), s("slot", { key: "5a904b02f31de2b16d1359d6ee38a28d929c0e8d" }));
+    return s(c, { key: "1c0747c30868d370d0815d1c3c1f2bc5b153f403" }, s("div", { key: "1baee7ca4beb5ec7cf369ddb1d28f213ebb8f136", class: "tabs" }, s("swirl-tab-bar", { key: "c512daa17ef79321e5101c8183e71749bc4086e2", label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingBlockEnd: this.tabBarPaddingBlockEnd, paddingBlockStart: this.tabBarPaddingBlockStart, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart, variant: this.tabBarVariant })), s("slot", { key: "d70c67d563f614918000ad2a35ce880a9bb9b096" }));
   }
   get el() {
-    return c(this);
+    return n(this);
   }
 };
 h.style = d;

package/dist/{swirl-text-input.entry.fadef9b5.js → swirl-text-input.entry.a4281819.js}

@@ -1,4 +1,4 @@
-import { r as h, c as n, h as i, H as c } from "./index.32954226.js";
+import { r as h, c as n, h as i, H as c } from "./index.dece22df.js";
 import { c as d } from "./index-orsBiyT_.fc4357c3.js";
 import { D as x } from "./media-query.service-Cx_VEA2f.c4de15e1.js";
 import "react";

package/dist/{swirl-text.entry.7a7a5d1a.js → swirl-text.entry.c5c5712b.js}

@@ -1,4 +1,4 @@
-import { r as lt, h as Z, H as ct, g as ht } from "./index.32954226.js";
+import { r as lt, h as Z, H as ct, g as ht } from "./index.dece22df.js";
 import { c as dt, g as ft } from "./index-orsBiyT_.fc4357c3.js";
 import "react";
 import "react-dom";
@@ -287,7 +287,7 @@ const vt = ".sc-swirl-text-h{display:block;max-width:100%}.sc-swirl-text-h *.sc-
     }), r = {
       whiteSpace: l ? "nowrap" : this.whiteSpace
     };
-    return Z(ct, { key: "82e0117d293ca9a225e24f6eff5cd9313dd27624" }, Z(o, { key: "0106f56c416935d739cde0cba0a8114a3c52cf30", class: a, ref: (c) => this.textEl = c, style: r }, Z("slot", { key: "6a0b95c071c26990dbf7b42143aaefc62d4a956b" })));
+    return Z(ct, { key: "6c6919a45a6c4b1e26bb5dd8dbe683ffe3e6d0f4" }, Z(o, { key: "e859c0d25b65141ca90cb22043e079cfd6870590", class: a, ref: (c) => this.textEl = c, style: r }, Z("slot", { key: "44ee5c0ccec836aa24d4a12efa1484b24b98a1ad" })));
   }
   get el() {
     return ht(this);

package/dist/{swirl-theme-provider.entry.1491ead5.js → swirl-theme-provider.entry.e11cc09d.js}

@@ -1,9 +1,9 @@
-import { r as m, c as n, h as o, H as d } from "./index.32954226.js";
+import { r as m, c as a, h as o, H as d } from "./index.dece22df.js";
 import "react";
 import "react-dom";
 const l = ".sc-swirl-theme-provider-h{display:unset}", i = "swirl-preferred-theme", c = class {
   constructor(e) {
-    m(this, e), this.appThemeUpdated = n(this, "appThemeUpdated", 7), this.themeChange = n(this, "themeChange", 7), this.darkThemeMediaQuery = window.matchMedia("(prefers-color-scheme: dark)"), this.setDesignTokens = [], this.osThemeChangeHandler = (t) => {
+    m(this, e), this.appThemeUpdated = a(this, "appThemeUpdated", 7), this.themeChange = a(this, "themeChange", 7), this.darkThemeMediaQuery = window.matchMedia("(prefers-color-scheme: dark)"), this.setDesignTokens = [], this.osThemeChangeHandler = (t) => {
       this.osTheme = t.matches ? "dark" : "light", this.updateAppTheme();
     };
   }
@@ -69,8 +69,8 @@ const l = ".sc-swirl-theme-provider-h{display:unset}", i = "swirl-preferred-them
     }
     const t = this.resolvedConfig.rootElement;
     this.setDesignTokens = [], e.design_tokens.forEach((r) => {
-      const a = `--s-${r.id}`;
-      t.style.setProperty(a, `rgba(${r.color.r}, ${r.color.g}, ${r.color.b}, ${r.color.a})`), this.setDesignTokens.push(a);
+      const n = `--s-${r.id}`;
+      t.style.setProperty(n, `rgba(${r.color.r}, ${r.color.g}, ${r.color.b}, ${r.color.a})`), this.setDesignTokens.push(n);
     });
   }
   resetTenantVariables() {
@@ -80,7 +80,7 @@ const l = ".sc-swirl-theme-provider-h{display:unset}", i = "swirl-preferred-them
     }), this.setDesignTokens = [];
   }
   render() {
-    return o(d, { key: "a8e0f520db81eae93253a33b46e98bd9864b06b1" }, o("slot", { key: "5c0a115f0db1b481f2fbdf5aa7a27eac5232d8b5" }));
+    return o(d, { key: "43dbba5e1a68a2da91b331ed75fb3fe6c365db0c" }, o("slot", { key: "734d4489e5f188684dc0d50c4ed7cff14e3459b9" }));
   }
   static get watchers() {
     return {

package/dist/{swirl-time-input.entry.35cee8dc.js → swirl-time-input.entry.7872c863.js}

@@ -1,4 +1,4 @@
-import { r as m, c as n, h as s, H as h, g as d } from "./index.32954226.js";
+import { r as m, c as n, h as s, H as h, g as d } from "./index.dece22df.js";
 import { c as p } from "./index-orsBiyT_.fc4357c3.js";
 import { I as a, i as o, f as r, p as l } from "./index-D3UoejeY.7db8c51e.js";
 import { D as f } from "./media-query.service-Cx_VEA2f.c4de15e1.js";
@@ -100,7 +100,7 @@ const g = ".sc-swirl-time-input-h{display:flex;width:100%}.sc-swirl-time-input-h
     const i = this.invalid === !0 || this.invalid === !1 ? String(this.invalid) : void 0, t = p("time-input", {
       "time-input--inline": this.inline
     });
-    return s(h, { key: "b1a9c7a68342fd05d9b6a320f79d1fc7df8eb168" }, s("div", { key: "638e7b351f3964d65effadf8e7810061df159200", class: t }, s("input", { key: "36376c7316efdefa903d97b189e90557ec88b247", "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : void 0, "aria-invalid": i, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, placeholder: this.placeholder, ref: (e) => this.inputEl = e, required: this.required, type: "text" }), s("span", { key: "f9e34f92213c62d4f4c691418073febd861f24d8", class: "time-input__icon" }, s("swirl-icon-time-outlined", { key: "424c29132f935c39411bd69789376ce3eb22cf3c", size: this.iconSize }))));
+    return s(h, { key: "63fe32b4243c58bf9976db89a2946ada3930e27e" }, s("div", { key: "c67c974f9ea440be082eb481d6c4fbfd5a41af57", class: t }, s("input", { key: "e6f3ec79e7261dd56bb2a904f4940f887b500f46", "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : void 0, "aria-invalid": i, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, placeholder: this.placeholder, ref: (e) => this.inputEl = e, required: this.required, type: "text" }), s("span", { key: "617eae052d3c7291fd3401ca7daa1886cfdb95cf", class: "time-input__icon" }, s("swirl-icon-time-outlined", { key: "27adc8c216ee8f78e0231eca73d1478fda2214c2", size: this.iconSize }))));
   }
   get el() {
     return d(this);

package/dist/{swirl-toast-provider.entry.490090ba.js → swirl-toast-provider.entry.ee192bd8.js}

@@ -1,4 +1,4 @@
-import { r as o, h as i, H as r } from "./index.32954226.js";
+import { r as o, h as i, H as r } from "./index.dece22df.js";
 import "react";
 import "react-dom";
 const c = class {
@@ -25,7 +25,7 @@ const c = class {
     return this.toasts = [...this.toasts, s], s;
   }
   render() {
-    return i(r, { key: "94d132f9100dd9fd082d640b21d628a3db4e1a3f", role: "status" }, i("swirl-stack", { key: "b18e4a869d88028bc51bcfdd614a27fa0ebbd151", spacing: "12" }, this.toasts.map((t) => {
+    return i(r, { key: "0de522d0575f6023484863d9b1cad338b3bf3bcd", role: "status" }, i("swirl-stack", { key: "6833c4a10998d5a9edec3cac5add223ecb296dda", spacing: "12" }, this.toasts.map((t) => {
       const s = { ...t, content: void 0 };
       return i("swirl-toast", { key: t.toastId, onDismiss: this.onDismiss, ...s }, t.content);
     })));

package/dist/{swirl-toast.entry.6c9a22c4.js → swirl-toast.entry.b7b74b34.js}

@@ -1,4 +1,4 @@
-import { r as o, c as r, h as i, H as n } from "./index.32954226.js";
+import { r as o, c as r, h as i, H as n } from "./index.dece22df.js";
 import { c } from "./index-orsBiyT_.fc4357c3.js";
 import { D as d } from "./media-query.service-Cx_VEA2f.c4de15e1.js";
 import "react";
@@ -37,7 +37,7 @@ const h = ":host{display:flex}:host *{box-sizing:border-box}.toast{display:flex;
   }
   render() {
     const t = c("toast", `toast--intent-${this.intent}`);
-    return i(n, { key: "118c8e27bb38cedae3c1b1339c10b8d300168ebf" }, i("div", { key: "d7ad4d1bcdf63af049f51958fc9988aee0d9f576", class: t }, this.icon && i("span", { key: "b271a55631ab2fcb964140a8fe99d495a16320b1", class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (s) => this.iconEl = s }), i("span", { key: "5a33f2c3816f71324bfa589087bbbeccdbbe66a7", class: "toast__content", innerHTML: this.content, part: "toast__content" }, i("slot", { key: "4a39ec9490378171c941c4e39562eb70a09b03d3" })), i("button", { key: "26af50bfaa728d830e3cf01e7fc055563992cb0f", "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && i("swirl-icon-close", { key: "661bdc2e8acc67cc29c533cd310ade7754ce916a", ref: (s) => this.dismissIconEl = s }))));
+    return i(n, { key: "e9cca93020ec6d094231fe3d460aad88daf79809" }, i("div", { key: "f4596be9c122d15af428ee15a625f366dbaf59b2", class: t }, this.icon && i("span", { key: "600246de21c1784f1baec655517defbc9ea5e2ff", class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (s) => this.iconEl = s }), i("span", { key: "4f6bc65e3292cb7f56a01a762d7ce015dc545772", class: "toast__content", innerHTML: this.content, part: "toast__content" }, i("slot", { key: "ae02f27a9f683d98e44a876df6b5b7700ef1c68f" })), i("button", { key: "1dce24dffb6e7ccf30cb9f92a67dca3df20ebf8b", "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && i("swirl-icon-close", { key: "1d4478a02a772ae225e487bfdc8039502a1dcf41", ref: (s) => this.dismissIconEl = s }))));
   }
   static get watchers() {
     return {

package/dist/{swirl-toggle-button.entry.a0d051b8.js → swirl-toggle-button.entry.a16dbc55.js}

@@ -1,4 +1,4 @@
-import { r as s, h as e } from "./index.32954226.js";
+import { r as s, h as e } from "./index.dece22df.js";
 import { c as o } from "./index-orsBiyT_.fc4357c3.js";
 import "react";
 import "react-dom";
@@ -12,7 +12,7 @@ const i = ":host{display:inline-block}:host *{box-sizing:border-box}.button{disp
     const t = o("button", {
       "button--pressed": this.isPressed
     });
-    return e("button", { key: "11daa3126c66f02e581290af12635344c5f22c5b", class: t, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && e("swirl-icon", { key: "1950881492be5bccdd4cab315c04563177ac15f5", class: "button__icon", glyph: this.icon }), e("span", { key: "d7a35f51c3cc55df866c176267e4115ea170db1c", class: "button__label" }, this.label));
+    return e("button", { key: "ea79fcf895b9011cd51f9a6140d517171b7b951a", class: t, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && e("swirl-icon", { key: "a62236e31301b497d621c14760faac09b9eb605f", class: "button__icon", glyph: this.icon }), e("span", { key: "b8f9ae7f94850c1ab82fd83717cf915d01507b04", class: "button__label" }, this.label));
   }
 };
 n.style = i;

package/dist/{swirl-toggle-group.entry.8acde06d.js → swirl-toggle-group.entry.a7e0b218.js}

@@ -1,27 +1,27 @@
-import { r as i, c as g, h as o, g as r } from "./index.32954226.js";
+import { r as i, c as g, h as o, g as r } from "./index.dece22df.js";
 import { c as l } from "./index-orsBiyT_.fc4357c3.js";
 import "react";
 import "react-dom";
 const a = ":host{display:inline-block}:host *{box-sizing:border-box}.toggle-group{padding:var(--s-space-2);background-color:var(--s-surface-sunken-default);border-radius:var(--s-space-8);transition:box-shadow 0.3s}.toggle-group--elevated{box-shadow:var(--s-shadow-level-2)}.toggle-group--variant-outline{outline:var(--s-border-width-default) solid var(--s-border-strong);outline-offset:calc(var(--s-border-width-default) * -1)}", n = class {
-  constructor(e) {
-    i(this, e), this.selectedToggleChange = g(this, "selectedToggleChange", 7), this.variant = "flat", this.toggleButtons = [], this.onSlotChange = () => {
+  constructor(t) {
+    i(this, t), this.selectedToggleChange = g(this, "selectedToggleChange", 7), this.variant = "flat", this.toggleButtons = [], this.onSlotChange = () => {
       this.toggleButtons = Array.from(this.el.querySelectorAll("swirl-toggle-button")), this.setTogglePressedStates();
     };
   }
-  watchSelectedToggleId(e, t) {
-    e !== t && (this.selectedToggleChange.emit(e), this.setTogglePressedStates());
+  watchSelectedToggleId(t, e) {
+    t !== e && (this.selectedToggleChange.emit(t), this.setTogglePressedStates());
   }
-  onClick(e) {
-    const t = e.target;
-    if ((t == null ? void 0 : t.tagName) === "SWIRL-TOGGLE-BUTTON") {
-      e.stopPropagation();
-      const s = t;
+  onClick(t) {
+    const e = t.target;
+    if ((e == null ? void 0 : e.tagName) === "SWIRL-TOGGLE-BUTTON") {
+      t.stopPropagation();
+      const s = e;
       this.selectedToggleId = s.identifier;
     }
   }
   setTogglePressedStates() {
-    var t;
-    if (!((t = this.toggleButtons) != null && t.length))
+    var e;
+    if (!((e = this.toggleButtons) != null && e.length))
       return;
     if (!this.selectedToggleId) {
       this.toggleButtonWithId(this.toggleButtons[0].identifier);
@@ -33,17 +33,17 @@ const a = ":host{display:inline-block}:host *{box-sizing:border-box}.toggle-grou
     }
     this.toggleButtonWithId(this.selectedToggleId);
   }
-  toggleButtonWithId(e) {
-    var t;
-    !((t = this.toggleButtons) != null && t.length) || this.toggleButtons.forEach((s) => {
-      s.identifier === e ? s.isPressed = !0 : s.isPressed = !1;
+  toggleButtonWithId(t) {
+    var e;
+    !((e = this.toggleButtons) != null && e.length) || this.toggleButtons.forEach((s) => {
+      s.identifier === t ? s.isPressed = !0 : s.isPressed = !1;
     });
   }
   render() {
-    const e = l("toggle-group", `toggle-group--variant-${this.variant}`, {
+    const t = l("toggle-group", `toggle-group--variant-${this.variant}`, {
       "toggle-group--elevated": this.elevated
     });
-    return o("swirl-stack", { key: "c29631a9b7fa4e63added5b5cdbf194ab4a2eda8", class: e, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, o("slot", { key: "46e5493e37067d4968c0c92e6e433085045dbfc4", onSlotchange: this.onSlotChange }));
+    return o("swirl-stack", { key: "8f9966117b896681d452c4a3fdd0bcd45484ef9b", class: t, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, o("slot", { key: "f386dbde3ee531e00515aac62771d50b2f8997c1", onSlotchange: this.onSlotChange }));
   }
   get el() {
     return r(this);

package/dist/{swirl-toolbar.entry.f3083227.js → swirl-toolbar.entry.5a2269c0.js}

@@ -1,8 +1,8 @@
-import { r, h as s, H as n, g as i } from "./index.32954226.js";
-import { k as a } from "./utils-D_MUFqkF.654ff3ce.js";
+import { r, h as s, H as n, g as i } from "./index.dece22df.js";
+import { k as c } from "./utils-D_MUFqkF.654ff3ce.js";
 import "react";
 import "react-dom";
-const c = ":host{display:block}:host *{box-sizing:border-box}", l = class {
+const a = ":host{display:block}:host *{box-sizing:border-box}", l = class {
   constructor(e) {
     r(this, e), this.orientation = "horizontal", this.onKeyDown = (t) => {
       t.code === "ArrowDown" || t.code === "ArrowRight" ? (t.preventDefault(), this.focusNextItem()) : (t.code === "ArrowUp" || t.code === "ArrowLeft") && (t.preventDefault(), this.focusPreviousItem());
@@ -27,7 +27,7 @@ const c = ":host{display:block}:host *{box-sizing:border-box}", l = class {
     this.focusItem(e[o]);
   }
   getActiveItemIndex(e) {
-    const t = a();
+    const t = c();
     return e.findIndex((o) => o === (t == null ? void 0 : t.closest("swirl-button, swirl-chip")));
   }
   focusItem(e) {
@@ -44,13 +44,13 @@ const c = ":host{display:block}:host *{box-sizing:border-box}", l = class {
     });
   }
   render() {
-    return s(n, { key: "b06118460ee852605d765f5e4b8e501174c0d50d" }, s("swirl-stack", { key: "89adc2f2100ca9f07e3982ad259304718d5aee89", align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: !0 }, s("slot", { key: "5f2db6e92be289537831eabd4971f3ed2aabfccd" })));
+    return s(n, { key: "719236ca8a1f3fef172578d0d7d6932cabc763bb" }, s("swirl-stack", { key: "8fee5af69f1961c130ca87bd55ef3fb3977d8a78", align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: !0 }, s("slot", { key: "05df1964caede7ca58827d90fdcfc60660c72eb3" })));
   }
   get el() {
     return i(this);
   }
 };
-l.style = c;
+l.style = a;
 export {
   l as swirl_toolbar
 };

package/dist/{swirl-tooltip.entry.ef56ea6d.js → swirl-tooltip.entry.41d17542.js}

@@ -1,5 +1,5 @@
-import { r as p, h as i, H as c, g as h } from "./index.32954226.js";
-import { u as d, P as m, N as u, D as f, k as b, b as w } from "./floating-ui.dom.browser.min-BtsCuEVE.45e9e353.js";
+import { r as p, h as i, H as d, g as h } from "./index.dece22df.js";
+import { u as c, P as m, N as u, D as f, k as b, b as w } from "./floating-ui.dom.browser.min-BtsCuEVE.45e9e353.js";
 import { c as y } from "./index-orsBiyT_.fc4357c3.js";
 import "react";
 import "react-dom";
@@ -14,7 +14,7 @@ const v = ":host{display:contents;font-weight:var(--s-font-weight-normal)}:host
         return;
       const s = [
         ...this.options.middleware.filter((l) => l.name !== "arrow"),
-        d({ element: this.arrowElement, padding: 12 })
+        c({ element: this.arrowElement, padding: 12 })
       ];
       this.actualPosition = await m(t, this.popperEl, { ...this.options, middleware: s });
       const e = (r = this.actualPosition.middlewareData.arrow) == null ? void 0 : r.x, o = (n = this.actualPosition.middlewareData.arrow) == null ? void 0 : n.y;
@@ -70,11 +70,11 @@ const v = ":host{display:contents;font-weight:var(--s-font-weight-normal)}:host
       "tooltip--active": this.active,
       "tooltip--visible": this.visible
     });
-    return i(c, { key: "32f481650c6c5a8518a13da3309dd21da21fed1f", onKeydown: this.onKeydown }, i("span", { key: "9bd0a084ff6f9a2e32ef3bb091f9a700366eed81", class: a }, i("span", { key: "133b1a23d5cfee0c2136eac15cece2f6e2c3ab2c", class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, i("slot", { key: "d64bb77eb2cdbd05de2392586b62bec973988a25" })), i("span", { key: "cd65b4c6126cc0545a399d7888c0403ce8b14527", class: "tooltip__popper", ref: (o) => this.popperEl = o, style: {
+    return i(d, { key: "d4f44ac10eae2b884b38de92c267e4fb28957d42", onKeydown: this.onKeydown }, i("span", { key: "cd2e654187abaff40e055d5678d36f85573f1389", class: a }, i("span", { key: "01007180fc69b2ea7562aad8a914aab9f6a0559d", class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, i("slot", { key: "979270ff10a2af5f2900f101584bfe70da274c34" })), i("span", { key: "4d62c0967d26521147ca7daddfffa8686d752b80", class: "tooltip__popper", ref: (o) => this.popperEl = o, style: {
       top: Boolean(this.actualPosition) ? `${(s = this.actualPosition) == null ? void 0 : s.y}px` : "",
       left: Boolean(this.actualPosition) ? `${(e = this.actualPosition) == null ? void 0 : e.x}px` : "",
       position: this.positioning
-    } }, this.visible && i("span", { key: "fbb4c2e6dec7f72e56d1aa2369eebd72702b3184", class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, i("span", { key: "39c07f0dc02a98a129e4d7fa81e0a0c873409d84", class: "tooltip__content", innerHTML: this.content })), i("span", { key: "ae8e40c54f452df566a449d6651a6a43faec49ef", class: "tooltip__arrow", ref: (o) => this.arrowElement = o, style: {
+    } }, this.visible && i("span", { key: "c88d48b37dda6994960a59aa6dd0e6afa9e335d1", class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, i("span", { key: "3adf4b87fbc1e5613d4eaa6c6c7fa4b958353d68", class: "tooltip__content", innerHTML: this.content })), i("span", { key: "57397e5de9752c0e394be9cfb690cd9747b25c88", class: "tooltip__arrow", ref: (o) => this.arrowElement = o, style: {
       ...this.arrowStyles,
       visibility: this.visible ? "visible" : "hidden"
     } }))));