@getflip/swirl-components 0.354.0 → 0.355.1

package/dist/cjs/swirl-symbol-work.cjs.entry.js

@@ -13,7 +13,7 @@ const SwirlSymbolWork = class {
     render() {
         const viewBoxSize = this.size === 20 ? 24 : this.size;
         const className = index$1.classnames("swirl-symbol", `swirl-symbol--size-${this.size}`);
-        return (index.h("svg", { key: 'cb54a9517235e0dd4023106c97f224673d84ecad', class: className, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, index.h(index.Fragment, { key: '2d3c2e0b2f1da541c35df93bd8eac19e07c473a2' }, index.h("path", { key: 'ed70cf60b843c65c78bd5b83ba8e4fb741924c48', d: "M20 6H16V4C16.0009 3.73709 15.9498 3.47661 15.8496 3.23354C15.7495 2.99047 15.6022 2.76962 15.4163 2.58372C15.2304 2.39782 15.0095 2.25054 14.7665 2.15035C14.5234 2.05017 14.2629 1.99907 14 2H10C9.73709 1.99907 9.47661 2.05017 9.23354 2.15035C8.99047 2.25054 8.76962 2.39782 8.58372 2.58372C8.39782 2.76962 8.25054 2.99047 8.15035 3.23354C8.05017 3.47661 7.99907 3.73709 8 4V6H4C3.73764 5.99933 3.47774 6.05068 3.23535 6.15107C2.99296 6.25147 2.77287 6.39892 2.58782 6.58491C2.40277 6.77089 2.25642 6.99171 2.15724 7.2346C2.05806 7.4775 2.00801 7.73764 2.01 8L2 19C1.99907 19.2629 2.05017 19.5234 2.15035 19.7665C2.25054 20.0095 2.39782 20.2304 2.58372 20.4163C2.76962 20.6022 2.99047 20.7495 3.23354 20.8496C3.47661 20.9498 3.73709 21.0009 4 21H20C20.2629 21.0009 20.5234 20.9498 20.7665 20.8496C21.0095 20.7495 21.2304 20.6022 21.4163 20.4163C21.6022 20.2304 21.7495 20.0095 21.8496 19.7665C21.9498 19.5234 22.0009 19.2629 22 19V8C22.0009 7.73709 21.9498 7.47661 21.8496 7.23354C21.7495 6.99047 21.6022 6.76962 21.4163 6.58372C21.2304 6.39782 21.0095 6.25054 20.7665 6.15035C20.5234 6.05017 20.2629 5.99907 20 6ZM14 6H10V4H14V6Z", fill: "currentColor" }))));
+        return (index.h("svg", { key: 'e4f8bc26287d5149e2b73b45ccc620b93eeb1475', class: className, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, index.h(index.Fragment, { key: '13b5545e6c3b96e730ca3a3a7fd0dca729530dd8' }, index.h("path", { key: 'fd5ad359f31421c6b696083d9179a50ec52d3e3c', d: "M20 6H16V4C16.0009 3.73709 15.9498 3.47661 15.8496 3.23354C15.7495 2.99047 15.6022 2.76962 15.4163 2.58372C15.2304 2.39782 15.0095 2.25054 14.7665 2.15035C14.5234 2.05017 14.2629 1.99907 14 2H10C9.73709 1.99907 9.47661 2.05017 9.23354 2.15035C8.99047 2.25054 8.76962 2.39782 8.58372 2.58372C8.39782 2.76962 8.25054 2.99047 8.15035 3.23354C8.05017 3.47661 7.99907 3.73709 8 4V6H4C3.73764 5.99933 3.47774 6.05068 3.23535 6.15107C2.99296 6.25147 2.77287 6.39892 2.58782 6.58491C2.40277 6.77089 2.25642 6.99171 2.15724 7.2346C2.05806 7.4775 2.00801 7.73764 2.01 8L2 19C1.99907 19.2629 2.05017 19.5234 2.15035 19.7665C2.25054 20.0095 2.39782 20.2304 2.58372 20.4163C2.76962 20.6022 2.99047 20.7495 3.23354 20.8496C3.47661 20.9498 3.73709 21.0009 4 21H20C20.2629 21.0009 20.5234 20.9498 20.7665 20.8496C21.0095 20.7495 21.2304 20.6022 21.4163 20.4163C21.6022 20.2304 21.7495 20.0095 21.8496 19.7665C21.9498 19.5234 22.0009 19.2629 22 19V8C22.0009 7.73709 21.9498 7.47661 21.8496 7.23354C21.7495 6.99047 21.6022 6.76962 21.4163 6.58372C21.2304 6.39782 21.0095 6.25054 20.7665 6.15035C20.5234 6.05017 20.2629 5.99907 20 6ZM14 6H10V4H14V6Z", fill: "currentColor" }))));
     }
 };
 SwirlSymbolWork.style = swirlSymbolCss;

package/dist/cjs/swirl-symbol-xing.cjs.entry.js

@@ -13,7 +13,7 @@ const SwirlSymbolXing = class {
     render() {
         const viewBoxSize = this.size === 20 ? 24 : this.size;
         const className = index$1.classnames("swirl-symbol", `swirl-symbol--size-${this.size}`);
-        return (index.h("svg", { key: '09a698cdc068457be05819086068546e146f8c48', class: className, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, index.h(index.Fragment, { key: 'c5d9b702dae5c3e6cd1c62d8acf6e26049bc848d' }, index.h("path", { key: '61046c7f4d31a5d9f8eeb7214e05ec4ec14df63b', d: "M17.158 2.128C16.9889 2.13178 16.8248 2.18623 16.687 2.28428C16.5492 2.38234 16.444 2.51949 16.385 2.678C16.385 2.678 10.173 13.698 9.967 14.059C9.98 14.079 14.067 21.578 14.067 21.578C14.1342 21.7375 14.246 21.8742 14.389 21.9717C14.5319 22.0693 14.7 22.1235 14.873 22.128H17.751C17.8257 22.1338 17.9006 22.1199 17.9683 22.0878C18.036 22.0557 18.0942 22.0065 18.137 21.945C18.1743 21.8762 18.1933 21.7989 18.192 21.7206C18.1908 21.6423 18.1694 21.5656 18.13 21.498L14.063 14.068C14.0614 14.0653 14.0606 14.0622 14.0606 14.059C14.0606 14.0558 14.0614 14.0527 14.063 14.05L20.45 2.758C20.4882 2.68988 20.5082 2.61309 20.5082 2.535C20.5082 2.4569 20.4882 2.38012 20.45 2.312C20.4084 2.25141 20.3518 2.20262 20.2857 2.17038C20.2197 2.13813 20.1464 2.12353 20.073 2.128H17.158ZM5.041 6.078C4.96541 6.07176 4.88949 6.08504 4.8205 6.11656C4.75151 6.14808 4.69177 6.19678 4.647 6.258C4.61116 6.32697 4.59388 6.40408 4.59686 6.48175C4.59984 6.55942 4.62298 6.63498 4.664 6.701L6.613 10.076V10.093L3.551 15.504C3.5116 15.5708 3.49081 15.6469 3.49081 15.7245C3.49081 15.8021 3.5116 15.8782 3.551 15.945C3.59031 16.0081 3.64585 16.0595 3.71182 16.0938C3.77779 16.1281 3.85176 16.1441 3.926 16.14H6.81C6.98108 16.1336 7.14662 16.0776 7.2865 15.9789C7.42639 15.8802 7.5346 15.743 7.598 15.584L10.709 10.076L8.728 6.614C8.66239 6.45468 8.55179 6.31791 8.40972 6.22042C8.26765 6.12292 8.10026 6.06892 7.928 6.065H5.041V6.078Z", fill: "currentColor" }))));
+        return (index.h("svg", { key: '73f1b2db6197f3e7a28a439f50527ba339e34284', class: className, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, index.h(index.Fragment, { key: '3f79e6579dabac90668aea43b43e7e11cc4ca4d1' }, index.h("path", { key: '6333b1ed2ccd01f89f487c4da31055b1e5d23feb', d: "M17.158 2.128C16.9889 2.13178 16.8248 2.18623 16.687 2.28428C16.5492 2.38234 16.444 2.51949 16.385 2.678C16.385 2.678 10.173 13.698 9.967 14.059C9.98 14.079 14.067 21.578 14.067 21.578C14.1342 21.7375 14.246 21.8742 14.389 21.9717C14.5319 22.0693 14.7 22.1235 14.873 22.128H17.751C17.8257 22.1338 17.9006 22.1199 17.9683 22.0878C18.036 22.0557 18.0942 22.0065 18.137 21.945C18.1743 21.8762 18.1933 21.7989 18.192 21.7206C18.1908 21.6423 18.1694 21.5656 18.13 21.498L14.063 14.068C14.0614 14.0653 14.0606 14.0622 14.0606 14.059C14.0606 14.0558 14.0614 14.0527 14.063 14.05L20.45 2.758C20.4882 2.68988 20.5082 2.61309 20.5082 2.535C20.5082 2.4569 20.4882 2.38012 20.45 2.312C20.4084 2.25141 20.3518 2.20262 20.2857 2.17038C20.2197 2.13813 20.1464 2.12353 20.073 2.128H17.158ZM5.041 6.078C4.96541 6.07176 4.88949 6.08504 4.8205 6.11656C4.75151 6.14808 4.69177 6.19678 4.647 6.258C4.61116 6.32697 4.59388 6.40408 4.59686 6.48175C4.59984 6.55942 4.62298 6.63498 4.664 6.701L6.613 10.076V10.093L3.551 15.504C3.5116 15.5708 3.49081 15.6469 3.49081 15.7245C3.49081 15.8021 3.5116 15.8782 3.551 15.945C3.59031 16.0081 3.64585 16.0595 3.71182 16.0938C3.77779 16.1281 3.85176 16.1441 3.926 16.14H6.81C6.98108 16.1336 7.14662 16.0776 7.2865 15.9789C7.42639 15.8802 7.5346 15.743 7.598 15.584L10.709 10.076L8.728 6.614C8.66239 6.45468 8.55179 6.31791 8.40972 6.22042C8.26765 6.12292 8.10026 6.06892 7.928 6.065H5.041V6.078Z", fill: "currentColor" }))));
     }
 };
 SwirlSymbolXing.style = swirlSymbolCss;

package/dist/cjs/swirl-symbol-youtube.cjs.entry.js

@@ -13,7 +13,7 @@ const SwirlSymbolYoutube = class {
     render() {
         const viewBoxSize = this.size === 20 ? 24 : this.size;
         const className = index$1.classnames("swirl-symbol", `swirl-symbol--size-${this.size}`);
-        return (index.h("svg", { key: '7d298ab12d2e993906721f69a2eccf580247bf0a', class: className, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, index.h(index.Fragment, { key: 'adbc3226ee8a878ea57907782eefc5e111efbc2e' }, index.h("path", { key: 'f97d51051981197848508ff71875a62b6e067b6c', d: "M21.582 7.201C21.4691 6.77542 21.2463 6.38698 20.936 6.07459C20.6257 5.76219 20.2388 5.5368 19.814 5.421C18.254 5 12 5 12 5C12 5 5.74599 5 4.18599 5.421C3.76123 5.5369 3.37436 5.76231 3.06408 6.0747C2.7538 6.38708 2.53101 6.77547 2.41799 7.201C2.12953 8.79965 1.9896 10.4216 1.99999 12.046C1.9896 13.6704 2.12953 15.2923 2.41799 16.891C2.53092 17.3166 2.75368 17.705 3.06397 18.0174C3.37426 18.3298 3.76118 18.5552 4.18599 18.671C5.74499 19.092 11.999 19.092 11.999 19.092C11.999 19.092 18.253 19.092 19.813 18.671C20.2378 18.5553 20.6248 18.3299 20.9351 18.0175C21.2454 17.7051 21.4682 17.3166 21.581 16.891C21.8695 15.2923 22.0098 13.6705 22 12.046C22.0104 10.4216 21.8704 8.79965 21.582 7.201ZM9.95399 15.019V9.072L15.181 12.045L9.95399 15.019Z", fill: "currentColor" }))));
+        return (index.h("svg", { key: 'e0a6d355eabb1a886ad293ff4ce19237b66963f1', class: className, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, index.h(index.Fragment, { key: '81a5145d6813d10af2c3d0a8251ac81e1be492cb' }, index.h("path", { key: '3119d8b418579843bbe2ae8b760a6c25f8e44715', d: "M21.582 7.201C21.4691 6.77542 21.2463 6.38698 20.936 6.07459C20.6257 5.76219 20.2388 5.5368 19.814 5.421C18.254 5 12 5 12 5C12 5 5.74599 5 4.18599 5.421C3.76123 5.5369 3.37436 5.76231 3.06408 6.0747C2.7538 6.38708 2.53101 6.77547 2.41799 7.201C2.12953 8.79965 1.9896 10.4216 1.99999 12.046C1.9896 13.6704 2.12953 15.2923 2.41799 16.891C2.53092 17.3166 2.75368 17.705 3.06397 18.0174C3.37426 18.3298 3.76118 18.5552 4.18599 18.671C5.74499 19.092 11.999 19.092 11.999 19.092C11.999 19.092 18.253 19.092 19.813 18.671C20.2378 18.5553 20.6248 18.3299 20.9351 18.0175C21.2454 17.7051 21.4682 17.3166 21.581 16.891C21.8695 15.2923 22.0098 13.6705 22 12.046C22.0104 10.4216 21.8704 8.79965 21.582 7.201ZM9.95399 15.019V9.072L15.181 12.045L9.95399 15.019Z", fill: "currentColor" }))));
     }
 };
 SwirlSymbolYoutube.style = swirlSymbolCss;

package/dist/cjs/swirl-symbol.cjs.entry.js

@@ -11,7 +11,7 @@ const SwirlHeading = class {
     }
     render() {
         const Tag = `swirl-symbol-${this.glyph}`;
-        return (index.h(index.Host, { key: 'cc117d921db27ebc182534f9b757c17f3ab5d0b6' }, index.h(Tag, { key: '0746c0fba444e82cb3d053bbc2eae007849b1e70', size: this.size })));
+        return (index.h(index.Host, { key: '135eaf61bd843743b7d2cda891e36217de497a00' }, index.h(Tag, { key: 'c53a8c773d6de6e32d08f0f524e9a09f1e173adf', size: this.size })));
     }
 };
 SwirlHeading.style = swirlSymbolCss;

package/dist/cjs/swirl-table-cell.cjs.entry.js

@@ -9,7 +9,7 @@ const SwirlTableCell = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: 'd0faee2bf022a7216a5a693f16aa31478108aea1', class: "table-cell", role: "cell" }, index.h("slot", { key: '1ba9f358c92984e2a166b02789f345eb37d1e902' })));
+        return (index.h(index.Host, { key: '0f9e1449f6cd3c0b7f350152d354beb1ac2bdab5', class: "table-cell", role: "cell" }, index.h("slot", { key: 'eeb69aa44f15173ef2c07eefc61f717235d9a02c' })));
     }
 };
 SwirlTableCell.style = swirlTableCellCss;

package/dist/cjs/swirl-table-column.cjs.entry.js

@@ -20,7 +20,7 @@ const SwirlTableColumn = class {
             maxWidth: this.maxWidth || "",
             minWidth: this.minWidth || "",
         };
-        return (index.h(index.Host, { key: 'c65eb6102989bb709ed0ba17f2086166100dac11', "aria-sort": this.sort, class: "table-column", role: "columnheader", style: styles }, index.h("span", { key: '4165a6f3d8d2164251a3a1a052e584e1fc93b1b1' }, index.h("slot", { key: 'fae7d6dd522800b3482b92773e878905ff0e43d1' })), this.sortable && (index.h("span", { key: '9841b1bf59f561d48afd4df492c985b20e2da488', class: "table-column__sort-indicator" }, this.sort === "ascending" && (index.h("swirl-icon-arrow-upward", { key: 'a3225364732ff55ea2a2d1070d3fccc4155a90dd', "aria-hidden": "true", size: 20 })), this.sort === "descending" && (index.h("swirl-icon-arrow-downward", { key: 'd098d5dd6fcdb503fc311cef9acbd300e9b06877', "aria-hidden": "true", size: 20 })), !Boolean(this.sort) && " "))));
+        return (index.h(index.Host, { key: '4618b5ba5a17fb5fad256603c7630666d4d55ad0', "aria-sort": this.sort, class: "table-column", role: "columnheader", style: styles }, index.h("span", { key: 'c00bc2d8fca143729660c5aa87882fcdb780bbcc' }, index.h("slot", { key: '158003813a4ccb7e21ce3b0e5c1892e59feafc04' })), this.sortable && (index.h("span", { key: 'ab82ace186788d68d8623352c2a0911678366a5c', class: "table-column__sort-indicator" }, this.sort === "ascending" && (index.h("swirl-icon-arrow-upward", { key: '47cd68dc731611e390ae0d1c87ebe2c5cd330ef2', "aria-hidden": "true", size: 20 })), this.sort === "descending" && (index.h("swirl-icon-arrow-downward", { key: '84b602debe5988755de73f5b79d1a443d7fd88ef', "aria-hidden": "true", size: 20 })), !Boolean(this.sort) && " "))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-table-row-group.cjs.entry.js

@@ -41,10 +41,10 @@ const SwirlTableRowGroup = class {
         const iconType = this.isVisible
             ? "<swirl-icon-expand-less></swirl-icon-expand-less"
             : "<swirl-icon-expand-more></swirl-icon-expand-more";
-        return (index.h(index.Host, { key: '42688f52ef928b9ed71bc0a78feed58191cd5405', class: "table-row-group", role: "rowgroup" }, index.h("div", { key: 'b8e1bb97194aefc3c116e60c81fd32b69ca33e08', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (index.h("swirl-button", { key: 'dfd0faa695787cbb2e2087737e48ff93edfb3242', class: "table-row-group__collapse-icon", icon: iconType, label: this.collapseButtonLabel, onClick: this.toggleShowItems, swirlAriaExpanded: String(this.isVisible), variant: "plain", hideLabel: true })), index.h("span", { key: 'f8b4394a4caa822bc88250f7f9dc55e975cb6815', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (index.h("span", { key: '7feb5fadda28e6cce214d755f3dbba244e3a2822', class: "table-row-group__tooltip" }, index.h("swirl-tooltip", { key: 'd964ccb500408c76a869e8748029eeb12b6608d8', content: this.tooltip, position: "top", positioning: "fixed" }, index.h("swirl-icon-info", { key: '27c0c7ffaffa506161ff231a2aebc92f7f1ab844', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), index.h("div", { key: '98091a90d087d53d65c7b071226833c0d1960193', class: {
+        return (index.h(index.Host, { key: '06d2abe11c5375fa2a8f71d0e90bbcbe03a4b9f9', class: "table-row-group", role: "rowgroup" }, index.h("div", { key: 'ba862a2498da7ad69fbd8a5278d3c7c687b28d51', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (index.h("swirl-button", { key: '34026b3df55989cc20a7646c51f40cd101adc8a8', class: "table-row-group__collapse-icon", icon: iconType, label: this.collapseButtonLabel, onClick: this.toggleShowItems, swirlAriaExpanded: String(this.isVisible), variant: "plain", hideLabel: true })), index.h("span", { key: 'f8b1d3d5b51ae2c45b54d1acc690eee1dd141631', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (index.h("span", { key: '1170f8afb5856bccee36259b0176f17cd852ecd9', class: "table-row-group__tooltip" }, index.h("swirl-tooltip", { key: '3b7a2624777ca2b01673f3982abe6e9eb0445a22', content: this.tooltip, position: "top", positioning: "fixed" }, index.h("swirl-icon-info", { key: '21ad879970b782735af8e44f72578014eb03436c', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), index.h("div", { key: '010c667f036b1d29657ff20eb6bf0534e404368d', class: {
                 "table-row-group__rows-container": true,
                 "table-row-group__rows-container--is-hidden": this.isVisible,
-            }, "aria-hidden": !this.isVisible, ref: (el) => (this.tableRowElements = el) }, index.h("slot", { key: '4bf79c6a538ac2823fe18b426dd4cd34a9c5bb82' }))));
+            }, "aria-hidden": !this.isVisible, ref: (el) => (this.tableRowElements = el) }, index.h("slot", { key: 'fdddf808fe1113853342e103d29051dcecc6f6ee' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-table-row.cjs.entry.js

@@ -18,7 +18,7 @@ const SwirlTableRow = class {
         const className = index$1.classnames("table-row", {
             "table-row--highlighted": this.highlighted,
         });
-        return (index.h(index.Host, { key: 'e0713fc439d14ec46ec073d7aa86b4376dfd676e', "aria-rowindex": this.index, class: className, role: "row" }, index.h("slot", { key: 'b4161c81438b54a588a6b2abfa909f5510ad2a0e' })));
+        return (index.h(index.Host, { key: '6682f0b469ffd43890a4126057b1ad9c4951c8b3', "aria-rowindex": this.index, class: className, role: "row" }, index.h("slot", { key: '9a126b155bc518ca152da3be91e520dd590cdfb1' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-table.cjs.entry.js

@@ -121,11 +121,6 @@ const SwirlTable = class {
         this.onScroll = () => {
             this.updateScrolledState();
         };
-        this.onSlotChange = async () => {
-            await this.updateLayout();
-            this.updateEmptyState();
-            this.setupDragDrop();
-        };
         this.onFocus = (event) => {
             if (this.movingViaKeyboard) {
                 const movingRow = this.el.querySelector(".table-row--moving");
@@ -181,12 +176,15 @@ const SwirlTable = class {
     }
     async componentDidLoad() {
         this.setupIntersectionObserver();
+        this.setupMutationObservers();
         queueMicrotask(() => {
             this.setupDragDrop();
         });
     }
     disconnectedCallback() {
         this.intersectionObserver?.disconnect();
+        this.columnMutationObserver?.disconnect();
+        this.rowMutationObserver?.disconnect();
         this.sortable?.destroy();
     }
     handleEnableDragDropChange() {
@@ -205,6 +203,34 @@ const SwirlTable = class {
         });
         this.intersectionObserver.observe(this.container);
     }
+    /**
+     * We are not using shadow DOM for the table, so we cannot use the
+     * `slotchange` event to detect changes in the slotted content. Instead, we
+     * use a MutationObserver to watch for changes of rows.
+     */
+    setupMutationObservers() {
+        this.columnMutationObserver = new MutationObserver((mutations) => {
+            const columnWasAddedOrRemoved = mutations.some((mutation) => mutation.addedNodes.length || mutation.removedNodes.length);
+            if (columnWasAddedOrRemoved) {
+                this.updateLayout();
+            }
+        });
+        this.columnMutationObserver.observe(this.headerEl, {
+            childList: true,
+            subtree: true,
+        });
+        this.rowMutationObserver = new MutationObserver((mutations) => {
+            const rowWasAddedOrRemoved = mutations.some((mutation) => mutation.addedNodes.length || mutation.removedNodes.length);
+            if (rowWasAddedOrRemoved) {
+                this.updateEmptyState();
+                this.setupDragDrop();
+            }
+        });
+        this.rowMutationObserver.observe(this.bodyEl, {
+            childList: true,
+            subtree: true,
+        });
+    }
     setupDragDrop() {
         if (this.sortable) {
             this.sortable.destroy();
@@ -539,10 +565,11 @@ const SwirlTable = class {
         }
     }
     render() {
+        const hasEmptyStateSlotAssignment = Boolean(this.el.querySelector('[slot="empty"]'));
         const className = index.classnames("table", {
             "table--keyboard-move": this.movingViaKeyboard,
         });
-        return (index$1.h(index$1.Host, { key: 'fa6ada9c1392d25d14d63ce2148d8bbaa270d149' }, index$1.h("div", { key: '140ef307cb0fd252ea6008b55fa95af4d7ca0f9c', class: className }, this.enableDragDrop && (index$1.h("swirl-visually-hidden", { key: 'a09dce7d22ec1870f5ee0378992690ae68a2ebc9' }, index$1.h("span", { key: '06e0ab8c80ea295c02ca957fb6a0be5c3a98cd7e', "aria-live": "assertive" }, this.liveRegionText))), index$1.h("div", { key: 'c4f714e2e50eb9309dc6777896e372090dde888e', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, index$1.h("div", { key: 'f8257288ed4e815b1469ff9a2d96967fb153afc7', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index$1.h("swirl-visually-hidden", { key: '278db6b1b073b46cd535c969471d19d2c9614d90' }, index$1.h("div", { key: 'a31b610a3e67b2293e1504fce94dfb47346706c1', id: "caption" }, this.caption))), index$1.h("div", { key: '41fd55e7f494bf8dabaa481ccd5aafe3679055e8', role: "rowgroup" }, index$1.h("div", { key: 'b7f01129b67b00306ec39455d7b108c3feb1c77e', class: "table__header", role: "row" }, index$1.h("slot", { key: 'ee52ef1609b677f2d307e011486f1b2ed07b74e1', name: "columns", onSlotchange: this.onSlotChange }))), index$1.h("div", { key: 'f9d16b425802a850d5bc27c07bac5d360b8e3a0c', class: "table__body", ref: (el) => (this.bodyEl = el) }, index$1.h("slot", { key: 'deb3035903d219eafba45c3c1eaa4a92f7054a39', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (index$1.h("div", { key: '917acdea0696b4d2ad3f7ff95f1d02dce30dfa2d', class: "table__empty-row", role: "row" }, index$1.h("div", { key: '54ed9ec80c9c020b87dc52855cbbe422769137a7', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index$1.h("swirl-text", { key: 'c29a1fb7518fae1c613eb2236870b232d7bfb140', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (index$1.h(index$1.Host, { key: 'd09c8462d08878a85fcb6acc09b1abd3842ddf59' }, index$1.h("div", { key: '1a58d897b032ba1d956145a4a3f463deaef25954', class: className }, this.enableDragDrop && (index$1.h("swirl-visually-hidden", { key: '2a4a97c04b0c1eab141d0061b2f5318f0ef2eb06' }, index$1.h("span", { key: 'fd1d908a5a8dc07de46fb250e8f80d3e7c664deb', "aria-live": "assertive" }, this.liveRegionText))), index$1.h("div", { key: 'b6b760bcb1868eb5046e78ba1a1ecb544c591e44', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, index$1.h("div", { key: 'e0d3bbd9884b5b276e26ed9a8d77f2673f7641f4', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index$1.h("swirl-visually-hidden", { key: 'a3b3450f652f06b546085319a835385f24c4290d' }, index$1.h("div", { key: 'b0a14cb4fc8cff4802ea0ca8c7bfd409703add52', id: "caption" }, this.caption))), index$1.h("div", { key: '69f5cc1e7341cc35cf3277f9d040dd4bb7440a63', role: "rowgroup" }, index$1.h("div", { key: '078e55799fb188c98bba3555f974c908d0f8d567', class: "table__header", ref: (el) => (this.headerEl = el), role: "row" }, index$1.h("slot", { key: '1b43e8d83fc7046714655c386bc6b987ac2c6a28', name: "columns" }))), index$1.h("div", { key: '74dc59b7f3e19ce121dc637bd7e6456298132238', class: "table__body", ref: (el) => (this.bodyEl = el) }, index$1.h("slot", { key: '0ff61dfa4cff198fb2c8fd44304cdc57cead2440', name: "rows" }), this.empty && (index$1.h("div", { key: 'e326641b5168d3020e06b24ca51114764a7cdbb9', class: "table__empty-row", role: "row" }, index$1.h("div", { key: 'd215ae8668e684f5cfee230bd175db40014a9484', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index$1.h("slot", { key: 'efae0b8038adf50ff2f5320acc7328edfae22190', name: "empty" }), !hasEmptyStateSlotAssignment && (index$1.h("swirl-text", { key: '4b97b4c843a430e3712cdfe464b0a54a36b075a4', align: "center", size: "sm" }, this.emptyStateLabel)))))))))));
     }
     get el() { return index$1.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-tabs.cjs.entry.js

@@ -77,7 +77,7 @@ const SwirlTabs = class {
         }));
     }
     render() {
-        return (index.h(index.Host, { key: '3c530775f9ebfd8f4369e7b86dce940449995410' }, index.h("div", { key: '104a9fd35949e15edd491eb932b6c1d317a6c86f', class: "tabs" }, index.h("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 })), index.h("slot", { key: '5a904b02f31de2b16d1359d6ee38a28d929c0e8d' })));
+        return (index.h(index.Host, { key: '1c0747c30868d370d0815d1c3c1f2bc5b153f403' }, index.h("div", { key: '1baee7ca4beb5ec7cf369ddb1d28f213ebb8f136', class: "tabs" }, index.h("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 })), index.h("slot", { key: 'd70c67d563f614918000ad2a35ce880a9bb9b096' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-text.cjs.entry.js

@@ -988,7 +988,7 @@ const SwirlText = class {
         const styles = {
             whiteSpace: truncate ? "nowrap" : this.whiteSpace,
         };
-        return (index$1.h(index$1.Host, { key: '82e0117d293ca9a225e24f6eff5cd9313dd27624' }, index$1.h(Tag, { key: '0106f56c416935d739cde0cba0a8114a3c52cf30', class: className, ref: (el) => (this.textEl = el), style: styles }, index$1.h("slot", { key: '6a0b95c071c26990dbf7b42143aaefc62d4a956b' }))));
+        return (index$1.h(index$1.Host, { key: '6c6919a45a6c4b1e26bb5dd8dbe683ffe3e6d0f4' }, index$1.h(Tag, { key: 'e859c0d25b65141ca90cb22043e079cfd6870590', class: className, ref: (el) => (this.textEl = el), style: styles }, index$1.h("slot", { key: '44ee5c0ccec836aa24d4a12efa1484b24b98a1ad' }))));
     }
     get el() { return index$1.getElement(this); }
 };

package/dist/cjs/swirl-theme-provider.cjs.entry.js

@@ -152,7 +152,7 @@ const SwirlThemeProvider = class {
         this.setDesignTokens = [];
     }
     render() {
-        return (index.h(index.Host, { key: 'a8e0f520db81eae93253a33b46e98bd9864b06b1' }, index.h("slot", { key: '5c0a115f0db1b481f2fbdf5aa7a27eac5232d8b5' })));
+        return (index.h(index.Host, { key: '43dbba5e1a68a2da91b331ed75fb3fe6c365db0c' }, index.h("slot", { key: '734d4489e5f188684dc0d50c4ed7cff14e3459b9' })));
     }
     static get watchers() { return {
         "config": ["watchConfig"]

package/dist/cjs/swirl-time-input.cjs.entry.js

@@ -144,7 +144,7 @@ const SwirlTimeInput = class {
         const className = index$2.classnames("time-input", {
             "time-input--inline": this.inline,
         });
-        return (index.h(index.Host, { key: 'b1a9c7a68342fd05d9b6a320f79d1fc7df8eb168' }, index.h("div", { key: '638e7b351f3964d65effadf8e7810061df159200', class: className }, index.h("input", { key: '36376c7316efdefa903d97b189e90557ec88b247', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, 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: (el) => (this.inputEl = el), required: this.required, type: "text" }), index.h("span", { key: 'f9e34f92213c62d4f4c691418073febd861f24d8', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: '424c29132f935c39411bd69789376ce3eb22cf3c', size: this.iconSize })))));
+        return (index.h(index.Host, { key: '63fe32b4243c58bf9976db89a2946ada3930e27e' }, index.h("div", { key: 'c67c974f9ea440be082eb481d6c4fbfd5a41af57', class: className }, index.h("input", { key: 'e6f3ec79e7261dd56bb2a904f4940f887b500f46', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, 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: (el) => (this.inputEl = el), required: this.required, type: "text" }), index.h("span", { key: '617eae052d3c7291fd3401ca7daa1886cfdb95cf', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: '27adc8c216ee8f78e0231eca73d1478fda2214c2', size: this.iconSize })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-toast-provider.cjs.entry.js

@@ -45,7 +45,7 @@ const SwirlToastProvider = class {
         return newToastWithId;
     }
     render() {
-        return (index.h(index.Host, { key: '94d132f9100dd9fd082d640b21d628a3db4e1a3f', role: "status" }, index.h("swirl-stack", { key: 'b18e4a869d88028bc51bcfdd614a27fa0ebbd151', spacing: "12" }, this.toasts.map((toast) => {
+        return (index.h(index.Host, { key: '0de522d0575f6023484863d9b1cad338b3bf3bcd', role: "status" }, index.h("swirl-stack", { key: '6833c4a10998d5a9edec3cac5add223ecb296dda', spacing: "12" }, this.toasts.map((toast) => {
             const props = { ...toast, content: undefined };
             return (index.h("swirl-toast", { key: toast.toastId, onDismiss: this.onDismiss, ...props }, toast.content));
         }))));

package/dist/cjs/swirl-toast.cjs.entry.js

@@ -54,7 +54,7 @@ const SwirlToast = class {
     }
     render() {
         const className = index$1.classnames("toast", `toast--intent-${this.intent}`);
-        return (index.h(index.Host, { key: '118c8e27bb38cedae3c1b1339c10b8d300168ebf' }, index.h("div", { key: 'd7ad4d1bcdf63af049f51958fc9988aee0d9f576', class: className }, this.icon && (index.h("span", { key: 'b271a55631ab2fcb964140a8fe99d495a16320b1', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), index.h("span", { key: '5a33f2c3816f71324bfa589087bbbeccdbbe66a7', class: "toast__content", innerHTML: this.content, part: "toast__content" }, index.h("slot", { key: '4a39ec9490378171c941c4e39562eb70a09b03d3' })), index.h("button", { key: '26af50bfaa728d830e3cf01e7fc055563992cb0f', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (index.h("swirl-icon-close", { key: '661bdc2e8acc67cc29c533cd310ade7754ce916a', ref: (el) => (this.dismissIconEl = el) }))))));
+        return (index.h(index.Host, { key: 'e9cca93020ec6d094231fe3d460aad88daf79809' }, index.h("div", { key: 'f4596be9c122d15af428ee15a625f366dbaf59b2', class: className }, this.icon && (index.h("span", { key: '600246de21c1784f1baec655517defbc9ea5e2ff', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), index.h("span", { key: '4f6bc65e3292cb7f56a01a762d7ce015dc545772', class: "toast__content", innerHTML: this.content, part: "toast__content" }, index.h("slot", { key: 'ae02f27a9f683d98e44a876df6b5b7700ef1c68f' })), index.h("button", { key: '1dce24dffb6e7ccf30cb9f92a67dca3df20ebf8b', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (index.h("swirl-icon-close", { key: '1d4478a02a772ae225e487bfdc8039502a1dcf41', ref: (el) => (this.dismissIconEl = el) }))))));
     }
     static get watchers() { return {
         "duration": ["watchDuration"]

package/dist/cjs/swirl-toggle-button.cjs.entry.js

@@ -17,7 +17,7 @@ const SwirlToggleButton = class {
         const classNames = index$1.classnames("button", {
             "button--pressed": this.isPressed,
         });
-        return (index.h("button", { key: '11daa3126c66f02e581290af12635344c5f22c5b', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (index.h("swirl-icon", { key: '1950881492be5bccdd4cab315c04563177ac15f5', class: "button__icon", glyph: this.icon })), index.h("span", { key: 'd7a35f51c3cc55df866c176267e4115ea170db1c', class: "button__label" }, this.label)));
+        return (index.h("button", { key: 'ea79fcf895b9011cd51f9a6140d517171b7b951a', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (index.h("swirl-icon", { key: 'a62236e31301b497d621c14760faac09b9eb605f', class: "button__icon", glyph: this.icon })), index.h("span", { key: 'b8f9ae7f94850c1ab82fd83717cf915d01507b04', class: "button__label" }, this.label)));
     }
 };
 SwirlToggleButton.style = swirlToggleButtonCss;

package/dist/cjs/swirl-toggle-group.cjs.entry.js

@@ -62,7 +62,7 @@ const SwirlToggleGroup = class {
         const className = index$1.classnames("toggle-group", `toggle-group--variant-${this.variant}`, {
             "toggle-group--elevated": this.elevated,
         });
-        return (index.h("swirl-stack", { key: 'c29631a9b7fa4e63added5b5cdbf194ab4a2eda8', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: '46e5493e37067d4968c0c92e6e433085045dbfc4', onSlotchange: this.onSlotChange })));
+        return (index.h("swirl-stack", { key: '8f9966117b896681d452c4a3fdd0bcd45484ef9b', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: 'f386dbde3ee531e00515aac62771d50b2f8997c1', onSlotchange: this.onSlotChange })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-toolbar.cjs.entry.js

@@ -71,7 +71,7 @@ const SwirlToolbar = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: 'b06118460ee852605d765f5e4b8e501174c0d50d' }, index.h("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: true }, index.h("slot", { key: '5f2db6e92be289537831eabd4971f3ed2aabfccd' }))));
+        return (index.h(index.Host, { key: '719236ca8a1f3fef172578d0d7d6932cabc763bb' }, index.h("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: true }, index.h("slot", { key: '05df1964caede7ca58827d90fdcfc60660c72eb3' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-tooltip.cjs.entry.js

@@ -113,7 +113,7 @@ const SwirlTooltip = class {
             "tooltip--active": this.active,
             "tooltip--visible": this.visible,
         });
-        return (index.h(index.Host, { key: '32f481650c6c5a8518a13da3309dd21da21fed1f', onKeydown: this.onKeydown }, index.h("span", { key: '9bd0a084ff6f9a2e32ef3bb091f9a700366eed81', class: className }, index.h("span", { key: '133b1a23d5cfee0c2136eac15cece2f6e2c3ab2c', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: 'd64bb77eb2cdbd05de2392586b62bec973988a25' })), index.h("span", { key: 'cd65b4c6126cc0545a399d7888c0403ce8b14527', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
+        return (index.h(index.Host, { key: 'd4f44ac10eae2b884b38de92c267e4fb28957d42', onKeydown: this.onKeydown }, index.h("span", { key: 'cd2e654187abaff40e055d5678d36f85573f1389', class: className }, index.h("span", { key: '01007180fc69b2ea7562aad8a914aab9f6a0559d', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: '979270ff10a2af5f2900f101584bfe70da274c34' })), index.h("span", { key: '4d62c0967d26521147ca7daddfffa8686d752b80', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
                 top: Boolean(this.actualPosition)
                     ? `${this.actualPosition?.y}px`
                     : "",
@@ -121,7 +121,7 @@ const SwirlTooltip = class {
                     ? `${this.actualPosition?.x}px`
                     : "",
                 position: this.positioning,
-            } }, this.visible && (index.h("span", { key: 'fbb4c2e6dec7f72e56d1aa2369eebd72702b3184', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: '39c07f0dc02a98a129e4d7fa81e0a0c873409d84', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: 'ae8e40c54f452df566a449d6651a6a43faec49ef', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
+            } }, this.visible && (index.h("span", { key: 'c88d48b37dda6994960a59aa6dd0e6afa9e335d1', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: '3adf4b87fbc1e5613d4eaa6c6c7fa4b958353d68', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: '57397e5de9752c0e394be9cfb690cd9747b25c88', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
                 ...this.arrowStyles,
                 visibility: this.visible ? "visible" : "hidden",
             } })))));

package/dist/cjs/swirl-tree-navigation-item.cjs.entry.js

@@ -90,12 +90,12 @@ const SwirlTreeNavigationItem = class {
             "tree-navigation-item__link--active": this.active,
             "tree-navigation-item__link--has-icon": Boolean(this.icon),
         });
-        return (index.h(index.Host, { key: '7453150b3eac84e3ae9556fd1d6a570d30583be9', role: "none" }, index.h("li", { key: '88b7695cda336ad31d0fd49d1c05a9dd8b47fd17', class: {
+        return (index.h(index.Host, { key: '39c9d830252adec9be51e6cd5a0fae6f50ff51d9', role: "none" }, index.h("li", { key: '6f5236d05c45425393d3371e305189face53dbd6', class: {
                 "tree-navigation-item": true,
                 "tree-navigation-item--expanded": this.expanded,
-            }, role: "treeitem", "aria-expanded": this.hasChildren ? this.expanded : undefined, "aria-level": this.level }, index.h(Tag, { key: '49562490eb7db514ee16f146a78022c6aafa041e', onClick: this.toggleExpanded, onKeyDown: this.onKeyDown, class: linkClassName, href: this.href, target: this.target, type: isLink ? undefined : "button", id: this.buttonId, "aria-current": this.active ? "page" : undefined, "aria-controls": this.hasChildren ? this.childrenId : undefined, "aria-expanded": this.hasChildren ? this.expanded : undefined }, index.h("span", { key: '754f083bfacaf6558abea3e59c59c0e419e9431e', class: "tree-navigation-item__content" }, this.icon && (index.h("swirl-icon", { key: '986023149934e7982142bd0582912dc27d08de2e', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), index.h("span", { key: '01a3b720091e3978bde5542efd2106ce9879e39c', class: "tree-navigation-item__label" }, index.h("span", { key: '69b0d2f71b2b55eacf9e32406148fc5d30b81c95', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (index.h("span", { key: '6fe19107b22f3cf116e0ca35bd7bc385ada81cb6', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, index.h("swirl-icon-chevron-right", { key: '9bf4775f00a4152e834a3a86e9b136c9affa4f36', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (index.h("span", { key: '466b79df59fd0c93114d7f8faa0e3f2568f2867c', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, index.h("swirl-icon-open-in-new", { key: 'a4ec32915634fb77231f9d8abfb10de98f16cdc4', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (index.h("ul", { key: '256cc19f63bee0de2831fdcdbf8b1a52d5a21418', class: "tree-navigation-item__children", id: this.childrenId, role: "group", "aria-label": `${this.label} submenu`, ref: (el) => (this.childrenRef = el), style: {
+            }, role: "treeitem", "aria-expanded": this.hasChildren ? this.expanded : undefined, "aria-level": this.level }, index.h(Tag, { key: '8ae91cf369108cade1e27a0b12a65c867657d816', onClick: this.toggleExpanded, onKeyDown: this.onKeyDown, class: linkClassName, href: this.href, target: this.target, type: isLink ? undefined : "button", id: this.buttonId, "aria-current": this.active ? "page" : undefined, "aria-controls": this.hasChildren ? this.childrenId : undefined, "aria-expanded": this.hasChildren ? this.expanded : undefined }, index.h("span", { key: '6cf2ae2af4221eeedbcaf729be206125f8e38a83', class: "tree-navigation-item__content" }, this.icon && (index.h("swirl-icon", { key: 'f8bc6f3cadceb6c8ad0257ed7dfa59684c9f2131', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), index.h("span", { key: '28ce59d45b0d0f0540e239a19aca1b269748a692', class: "tree-navigation-item__label" }, index.h("span", { key: '29706b9fabca1188562e988cd557fed7e6d26453', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (index.h("span", { key: 'eb6880d400f19b1f51f2fe1c6dadc0fa72063492', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, index.h("swirl-icon-chevron-right", { key: '5d1382aa660613faa1ee4f31bcf3ab0d835e6b26', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (index.h("span", { key: 'b393d466390c9890a1398c7609a4fec65bc6a947', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, index.h("swirl-icon-open-in-new", { key: '80b5de2a73045b8387bfdf91be4fb5e37e7b54a7', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (index.h("ul", { key: 'a38548095cd8a83327dcf13f3fa05bae58117ec8', class: "tree-navigation-item__children", id: this.childrenId, role: "group", "aria-label": `${this.label} submenu`, ref: (el) => (this.childrenRef = el), style: {
                 height: this.childrenHeight,
-            } }, index.h("slot", { key: 'ad370e3f964f987277e24193a32a4b8935e1fa94' }))))));
+            } }, index.h("slot", { key: 'ae6e41bf6226ed66f7a030448df18d8e5f77730c' }))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-tree-navigation.cjs.entry.js

@@ -9,7 +9,7 @@ const SwirlTreeNavigation = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '8a77f0a5bcde7f86da5e18494cd0468a20d73c50' }, index.h("ul", { key: '2284ff6d8ee937e3e06f891806764b35312544e1', "aria-label": this.label, class: "tree-navigation", role: "tree" }, index.h("slot", { key: '112d7fb106752b439fe7903bd3ffb11fdfc9f318' }))));
+        return (index.h(index.Host, { key: 'cb38614c23f0094033ec98a3baa74c78f6c442a2' }, index.h("ul", { key: '98ae37462a1aa9f4463d59eeab9fb273d2b8b6d8', "aria-label": this.label, class: "tree-navigation", role: "tree" }, index.h("slot", { key: '3f79b9c2ff0f4124b8f75b3cf58f021b6765abb5' }))));
     }
 };
 SwirlTreeNavigation.style = swirlTreeNavigationCss;

package/dist/cjs/swirl-tree-view-item.cjs.entry.js

@@ -337,17 +337,17 @@ const SwirlTreeViewItem = class {
             "tree-view-item--disable-drag": this.disableDrag,
             "tree-view-item--has-tags": hasTags,
         });
-        return (index.h(index.Host, { key: '505fb72c566d6526be15ee395129a78a838d4b86', id: this.itemId, role: semantics === "tree" ? "none" : "listitem" }, index.h(Tag, { key: '79392fc902dc311a6366538f577a184e376b95cc', class: className, role: semantics === "tree" ? "none" : undefined }, index.h("a", { key: '930933256243635920b5f783bd469a1796da97fb', "aria-current": this.active ? "page" : undefined, "aria-expanded": !hasChildren || semantics !== "tree"
+        return (index.h(index.Host, { key: '9c15110c17c0e525e9d795a56fe3c9e6027066e8', id: this.itemId, role: semantics === "tree" ? "none" : "listitem" }, index.h(Tag, { key: 'b4d4501bba0bc9ce223de8b4db9430bc42197bc1', class: className, role: semantics === "tree" ? "none" : undefined }, index.h("a", { key: '32fa772b5646f0b6140a4bbb9365a8e818578bea', "aria-current": this.active ? "page" : undefined, "aria-expanded": !hasChildren || semantics !== "tree"
                 ? undefined
                 : String(expanded), "aria-level": semantics === "tree" ? this.level + 1 : undefined, "aria-owns": hasChildren && semantics === "tree"
                 ? `${this.itemId}-children`
-                : undefined, "aria-selected": semantics === "tree" ? String(this.selected) : undefined, class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: semantics === "tree" ? "treeitem" : undefined, tabIndex: tabIndex }, !this.disableDrag && this.enableDragDrop && (index.h("span", { key: '477cc3a28ca0c2aab0619df41f961b33c7c4679f', class: "tree-view-item__drag-handle" }, index.h("swirl-icon-drag-handle", { key: 'd44f4415553b1ddd763596ef46962f8b30828a60', size: 20 }))), this.expandable && semantics === "tree" && (index.h("span", { key: '448dadd940d5905216f3f0d2346dd44d8ff9d33b', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: 'e1979d0536d287e79289f999eaab9cc9f9f186fd' }, expanded ? (index.h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (index.h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (index.h(index.Fragment, { key: 'f098f325315c455a31021e78e6caa5f5f49810dc' }, index.h("span", { key: '009c92d2c7c7a1033dbe54e24f6131456cb8f1a5', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: 'e4a02a1ca6d57bbf0f4ddc4c659afa62ae5922f3', class: "tree-view-item__label" }, this.label), index.h("span", { key: '0d03f75ec727180084e6e31ec32918d4b313039d', class: "tree-view-item__tags" }, index.h("slot", { key: '22dd691a9c3d7910342beab6c1dc69f40bbaf705', name: "tags" }))), index.h("ul", { key: '88384486c1816e91b8b1d9357973d388abff8160', "aria-label": this.label, class: `tree-view-item__children ${shouldShowChildrenDropZone
+                : undefined, "aria-selected": semantics === "tree" ? String(this.selected) : undefined, class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: semantics === "tree" ? "treeitem" : undefined, tabIndex: tabIndex }, !this.disableDrag && this.enableDragDrop && (index.h("span", { key: '5d0cdeb21ee8c7549e797b6dad33c2caeacbbcd8', class: "tree-view-item__drag-handle" }, index.h("swirl-icon-drag-handle", { key: '1073ab90768adcce824848016a58bda4a7d78856', size: 20 }))), this.expandable && semantics === "tree" && (index.h("span", { key: '1a65e9c5055e0222782a6fc0fd9a054cf6dda870', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: '9e8fd067a2f8cf6b6c2e4f34cb06e24b0071690e' }, expanded ? (index.h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (index.h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (index.h(index.Fragment, { key: 'a4b24adfbfe9d5a07c0004a3d621cf5d38542ace' }, index.h("span", { key: 'bda81f006ed0cc4d04a7c0e68eda2c75bfe3ef78', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: '522285b44bae82edd1ddafcbb1070b433cae1f35', class: "tree-view-item__label" }, this.label), index.h("span", { key: '3c5adab020bcb559b88124e91c49073580edb219', class: "tree-view-item__tags" }, index.h("slot", { key: 'd73e04abccdf715067af3f2f420247996621da40', name: "tags" }))), index.h("ul", { key: 'c4174b53e35864d3168a72d0734f5ce3e2ef89c7', "aria-label": this.label, class: `tree-view-item__children ${shouldShowChildrenDropZone
                 ? "tree-view-item__children--drop-zone"
                 : ""}`, id: `${this.itemId}-children`, ref: (el) => (this.childList = el), role: semantics === "tree" ? "group" : undefined, style: {
                 display: (!expanded || !hasChildren) && !shouldShowChildrenDropZone
                     ? "none"
                     : undefined,
-            } }, index.h("slot", { key: 'e62016fd5b647dca8b0243476ff1e7b798dde283' })))));
+            } }, index.h("slot", { key: '3ea98ba83f784ed98896977156f15ee37483dc05' })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-tree-view.cjs.entry.js

@@ -332,7 +332,7 @@ const SwirlTreeView = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'bc68811d359cd1b0e89d2cd4ccdcca4091cc562b' }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: '51682efe2cd20fb56d5961fbb03bfe9f86111b57' }, index.h("span", { key: '4f0523e122037fb3c7e6cc1c353b16acff57f6ff', "aria-live": "assertive" }, this.liveRegionText))), index.h("ul", { key: 'fe0aff2aa1ab2e74bb045b60aab1a0ae228cb816', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: this.semantics === "tree" ? "tree" : undefined, ref: (el) => (this.listElement = el), tabIndex: -1 }, index.h("slot", { key: '663bd1838841c272b2660e94abc72bbb3a9082a4', onSlotchange: this.onSlotChange }))));
+        return (index.h(index.Host, { key: 'd70ad5db06afd4a8d6d83ad591d09994f59c0325' }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: '2acc3e4542fb2687575500a6f603dca34ff310d8' }, index.h("span", { key: 'f3ae5aa66ff53b19db1b888eb03234709a264fe6', "aria-live": "assertive" }, this.liveRegionText))), index.h("ul", { key: 'ec7454804f6b5d93cbffd699f17a1bf9dcf15859', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: this.semantics === "tree" ? "tree" : undefined, ref: (el) => (this.listElement = el), tabIndex: -1 }, index.h("slot", { key: '836eead8ff82f16ea9ee81354bedb6c6c7e8d52b', onSlotchange: this.onSlotChange }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-video-thumbnail.cjs.entry.js

@@ -10,7 +10,7 @@ const SwirlVideoThumbnail = class {
         this.durationLabel = "Duration";
     }
     render() {
-        return (index.h(index.Host, { key: '8b0586b9170888a10132070f6e659bfb191d4ca0' }, index.h("button", { key: '01b757c42e9ba91dab7c88c98e39098d481df6d1', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: '401a387bf46078c7b3d971f1215ff87bf489df16', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: '4e7bc131dd91a16485cff9fc67134906ebed3f30', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: 'ac68630f9feebc6ef0e04181c8916412828ee72b' }, this.durationLabel), this.duration)), index.h("svg", { key: '9db659b60b7b18295a04b6cd06b8d58ba60728b6', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '8e1f1b6cb3e56ceadea2f701391ce2d2ebff2dbe', d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" })))));
+        return (index.h(index.Host, { key: 'ebf4104933fe996a1b5bf75429860ca35af45873' }, index.h("button", { key: '560064ca78b5bac9f9f557d669b0943781d2979b', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: 'c5e0d43b0fadc2dddc8064adfbf5e81a43248e58', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: 'ea42f74167078cac846c3d2ed8abc8daac091a6f', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: '88f0ea33a732fc930136499d3487290097aae01e' }, this.durationLabel), this.duration)), index.h("svg", { key: '3985277d983a2528959ecee9ba80037c3037e90c', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '00639d70e38416d5479e79f7657e226b42629e07', d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" })))));
     }
 };
 SwirlVideoThumbnail.style = swirlVideoThumbnailCss;

package/dist/cjs/swirl-visually-hidden.cjs.entry.js

@@ -9,7 +9,7 @@ const SwirlVisuallyHidden = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '13235af778fcfa2a273fbb21352fa6b067e9b1df' }, index.h("slot", { key: '4e325143f16806b2ef2791fa691b8e649daa529f' })));
+        return (index.h(index.Host, { key: '555af564691d195bb1ff8c8ae17adfbaff274da4' }, index.h("slot", { key: 'dccd2bc55134f02e7b5e20dd38bc356e2a50dd82' })));
     }
 };
 SwirlVisuallyHidden.style = swirlVisuallyHiddenCss;

package/dist/collection/components/swirl-accordion/swirl-accordion.js

@@ -36,7 +36,7 @@ export class SwirlAccordion {
         });
     }
     render() {
-        return (h(Host, { key: '64993ad2baa9c31e6c60ec980ca5b3580ed603cb' }, h("slot", { key: 'eec3488a347a2edc444b6354bcd2967fee8b5655' })));
+        return (h(Host, { key: '14ae7fa556c8418ed83b89b408ec0d6e8efbc816' }, h("slot", { key: 'a67fd41293c0606520b5dd6d3e45274ec583594a' })));
     }
     static get is() { return "swirl-accordion"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-accordion-item/swirl-accordion-item.js

@@ -54,7 +54,7 @@ export class SwirlAccordionItem {
         const className = classnames("accordion-item", {
             "accordion-item--expanded": this.expanded,
         });
-        return (h(Host, { key: '72e9e9ac13d186738928b8e980c6209551533c9f' }, h("div", { key: 'ccd89c1be4e1c0485f96bdd37ed59316112091af', class: className }, h(HeadingTag, { key: 'd55e20e2766c5c45cab2d87d9decfb26bafb6bda', class: "accordion-item__heading" }, h("button", { key: 'dc9e6ec6b643ba2048da106c052e926dc0961fd0', "aria-controls": this.itemId, "aria-expanded": String(this.expanded), class: "accordion-item__toggle", disabled: this.disabled, id: this.headingId, onClick: this.onHeadingClick, type: "button" }, h("span", { key: '6bb5529bd31016e1f55a484b2b0d6ecdba2e48b2', class: "accordion-item__toggle-text" }, this.heading, this.description && (h("swirl-text", { key: '19cf25a43a59482fcf0af60ac901e490fa0b91b7', as: "span", color: "subdued", size: "sm" }, this.description))), h("span", { key: 'ead14b0bcbeeb7c2c1fc80951a05ee406271974f', class: "accordion-item__icon" }, !this.expanded && (h("swirl-icon", { key: 'e91d346f75c7a7426a76bbacd75975d399ac7a5b', glyph: "chevron-right", size: 20 })), this.expanded && (h("swirl-icon", { key: '1a4f7a806897bde6fbdc1b79ea34c79074cae3eb', glyph: "expand-more", size: 20 }))))), h("div", { key: 'ce4f9952bf9a8682816b3bcd235829040509b22e', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, h("slot", { key: 'd82a46ddc9b13812dc24d212c73e6ded6f836912' })))));
+        return (h(Host, { key: '0585ed5acfc7dff3fafa11ec0cfb2d469d84f9e2' }, h("div", { key: 'dc12ae03c587084e4db14102c36a3c2520249c75', class: className }, h(HeadingTag, { key: 'bdea010f52fea7c3eadc92cad466e2095097a9cb', class: "accordion-item__heading" }, h("button", { key: '2740ec26889940db9b476060c24b434ee6a5102b', "aria-controls": this.itemId, "aria-expanded": String(this.expanded), class: "accordion-item__toggle", disabled: this.disabled, id: this.headingId, onClick: this.onHeadingClick, type: "button" }, h("span", { key: '50a172747b20583130cbf83bb4ebfa6e14b6d417', class: "accordion-item__toggle-text" }, this.heading, this.description && (h("swirl-text", { key: '57c92c649d043736f5f04453fda549a79fb2d9be', as: "span", color: "subdued", size: "sm" }, this.description))), h("span", { key: 'd21c056161f0a018272d2fac9c8ac78873cb97d0', class: "accordion-item__icon" }, !this.expanded && (h("swirl-icon", { key: '063049b3afbb1b3324239ee4dfc77157d37a76ce', glyph: "chevron-right", size: 20 })), this.expanded && (h("swirl-icon", { key: '803d43579f453a8dedbce20fdec3eac1b7f30a73', glyph: "expand-more", size: 20 }))))), h("div", { key: '2435091e461eae245e003fefcca05e5c06ea355d', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, h("slot", { key: '2b3f5840d414178e2db539fb359b7f9bc8b3a2ff' })))));
     }
     static get is() { return "swirl-accordion-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-action-list/swirl-action-list.js

@@ -89,7 +89,7 @@ export class SwirlActionList {
         });
     }
     render() {
-        return (h(Host, { key: 'e051cbc525ae8cf430325665335adb2643d72cd4' }, h("div", { key: '5cd25a3d497e53cc78b4a463e8ce100739c49a15', "aria-orientation": "vertical", class: "action-list", onFocusout: this.isInsidePopover ? undefined : this.onFocusOut, onFocus: this.isInsidePopover ? undefined : this.onFocus, onKeyDown: this.onKeyDown, part: "action-list", ref: (el) => (this.container = el), role: "menu" }, h("slot", { key: '48f499fc622ab600d5885b34c2860175fe8cc48a', onSlotchange: this.setSectionSeparator }))));
+        return (h(Host, { key: 'be081a33787b32237d996d38d2c7d1d6aeccd08a' }, h("div", { key: 'a41ed4a72c31740add6c757999cec0a00a85cfb3', "aria-orientation": "vertical", class: "action-list", onFocusout: this.isInsidePopover ? undefined : this.onFocusOut, onFocus: this.isInsidePopover ? undefined : this.onFocus, onKeyDown: this.onKeyDown, part: "action-list", ref: (el) => (this.container = el), role: "menu" }, h("slot", { key: 'bc113761c4c4191be0431379f115eb6f3a0abcfa', onSlotchange: this.setSectionSeparator }))));
     }
     static get is() { return "swirl-action-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-action-list-section/swirl-action-list-section.js

@@ -9,7 +9,7 @@ export class SwirlActionListSection {
         this.hasSeparator = false;
     }
     render() {
-        return (h(Host, { key: '82f6c96fcfbd7ac0b92b66d37c9a09654c51f90f' }, this.hasSeparator && (h("swirl-separator", { key: 'f02e1b5598b2aeac0c3687eccf2f2ac7328e56a7', spacing: this.separatorSpacing })), h("div", { key: '53c1fbdd7b2da339e668767c86953c674971c18a', "aria-labelledby": "label", class: "action-list-section", role: "group" }, h("span", { key: '19856b64286c60b04f946c0cbdef9df322925eaa', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), h("swirl-stack", { key: 'd9f3851221c5dae97957bbd178d3c69b12d3d05f', spacing: this.spacing, align: "stretch" }, h("slot", { key: '2057cda1703f7cd5462f501ea197b7d3a540c60a' })))));
+        return (h(Host, { key: 'a3d1af938e7d15b2d019ec947a224ea908a789a4' }, this.hasSeparator && (h("swirl-separator", { key: 'df4880ee4b69761ead7ecda78541216ba9fdf241', spacing: this.separatorSpacing })), h("div", { key: 'fde81917cc7f0ea3e96198dd2d684cfd75ba7658', "aria-labelledby": "label", class: "action-list-section", role: "group" }, h("span", { key: 'd9e649b1a643f843e4c4e8c8003fb09cadddf4ce', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), h("swirl-stack", { key: '9c09ad4a9f6ec010de47ea9fba198ef67a926e1a', spacing: this.spacing, align: "stretch" }, h("slot", { key: '72f9ec0b1218eab25d7e2ce3e59f20c5b1a969b7' })))));
     }
     static get is() { return "swirl-action-list-section"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-app-icon/swirl-app-icon.js

@@ -30,7 +30,7 @@ export class SwirlAppIcon {
         const className = classnames("app-icon", {
             "app-icon--has-icon": showIcon || showFallbackIcon,
         });
-        return (h(Host, { key: '48b3be2e631cbaa20e9ffef341b1bd902ed1d726' }, h("span", { key: '89d9e1a445f6bb1ee0515748aa01631e67d323a5', class: className }, showImage && (h("img", { key: '1d0212ea931e6d724a8699fea6579ec7145af6e7', alt: "", height: "256", ref: this.onImageElementUpdate, src: this.src, width: "256" })), showIcon && (h("span", { key: 'e63a2e4e03d8fb28c493ad325f0b7c70ef2e038e', class: "app-icon__icon", innerHTML: this.icon })))));
+        return (h(Host, { key: '2073405dc023facc8321a26be91cc1cc56653348' }, h("span", { key: '8a37894d5aeb9660ba61ca58d6e25d5a4799afad', class: className }, showImage && (h("img", { key: '0e638f9b5d020e811e0dd573baad991ed5e2dc53', alt: "", height: "256", ref: this.onImageElementUpdate, src: this.src, width: "256" })), showIcon && (h("span", { key: '15573bd9533b881471d951b23a3e24b6fb2ae6b8', class: "app-icon__icon", innerHTML: this.icon })))));
     }
     static get is() { return "swirl-app-icon"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-avatar-group/swirl-avatar-group.js

@@ -22,7 +22,7 @@ export class SwirlAvatarGroup {
             "avatar-group--has-badge": Boolean(this.badge),
         });
         const badgeClassName = classnames("avatar-group__badge");
-        return (h(Host, { key: '8fb44a9d81b4cf05ff18934a00499f2319157814' }, h("div", { key: '65a8a2cd06a186ba5cb3313ab7c1de13ae8f513a', class: className, role: "group" }, h("slot", { key: '877aa5190da92785129f4fc15925d319c366f409' }), this.badge && (h("span", { key: '115b9b937583ca3f05ec4bc14a831a3b4eb74d53', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
+        return (h(Host, { key: 'ba163a394e3c9475c5d5f4c3a6c9b53ed1538199' }, h("div", { key: 'f852e4ccc6ff3af8aa9c543850370165d28335ba', class: className, role: "group" }, h("slot", { key: 'd0645fd5fb665aed27760df214ecdac8e3483594' }), this.badge && (h("span", { key: '76c4597cff6646318cc50d57ed468e3341be768b', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
     }
     static get is() { return "swirl-avatar-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-carousel-slide/swirl-carousel-slide.js

@@ -11,11 +11,11 @@ export class SwirlCarouselSlide {
         const className = classnames("carousel-slide", {
             "carousel-slide--has-min-height": Boolean(this.minHeight),
         });
-        return (h(Host, { key: 'd50b846053d487691b02b66e9d1fd2ce73e39e79', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: {
+        return (h(Host, { key: 'f2ece15a830aed50ac09c6667a22c1f21ada5c95', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: {
                 aspectRatio: this.aspectRatio,
                 flexBasis: this.width,
                 minHeight: this.minHeight,
-            }, tabIndex: 0 }, h("slot", { key: 'ba58e38f8d0561d9fc4d7e84d830c602141e39d2' })));
+            }, tabIndex: 0 }, h("slot", { key: '3d031a88d84034bbd46f9e1640f759b53818f80d' })));
     }
     static get is() { return "swirl-carousel-slide"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-color-input/swirl-color-input.js

@@ -55,11 +55,11 @@ export class SwirlColorInput {
         const className = classnames("color-input", {
             "color-input--inline": this.inline,
         });
-        return (h(Host, { key: '6ceafd585281f533634d92fe8f0cdce91722fa29' }, h("div", { key: '296120abcf3e8de528bbe140fca0d5ef3bf3828c', class: className }, h("input", { key: '21d7459e8703afb9b69d7e87ef58ed2473b67034', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "color-input__input", disabled: this.disabled, maxLength: 7, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, spellcheck: "false", type: "text", value: this.value }), h("swirl-popover-trigger", { key: '09818829e44f9eb99b30b65fab4df46cfcb1abee', swirlPopover: this.pickerId }, h("button", { key: 'ac1c2e699ddceafb20ecfe3b8ea8d3f0131ed684', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
+        return (h(Host, { key: '3497a5228d21e3888155ee30fdcc8f4b06071075' }, h("div", { key: '70dec42e3c74bea566f9ea3cffcbf5bca2995372', class: className }, h("input", { key: 'bd533e1032afc8d11b1afe24f9c0857e637c2a73', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "color-input__input", disabled: this.disabled, maxLength: 7, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, spellcheck: "false", type: "text", value: this.value }), h("swirl-popover-trigger", { key: '4898506bae164efe7503c02d1e9b4fbc1c792f25', swirlPopover: this.pickerId }, h("button", { key: '9238e7ba3ee36d5d4802fe1cbcc93b90da1e784d', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
                 backgroundColor: this.disabled
                     ? "var(--s-border-subdued)"
                     : this.value,
-            }, type: "button" })), h("swirl-popover", { key: 'cb216507c45e36a1369e2702073791bdbdcded24', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, h("swirl-box", { key: '749ae44bbdafcba65b8a9f703edc5fb56a8ca0b8', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, h("hex-color-picker", { key: 'cfba277121b02199fa9253b7bfbe2b4c98228ce7', color: this.value, ref: (el) => (this.picker = el) }))))));
+            }, type: "button" })), h("swirl-popover", { key: 'a692a8e6fa94b10b27a304a40a85746ecf95e3f0', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, h("swirl-box", { key: '781ad6a845f19b321aeacbaa03d803492f54bc37', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, h("hex-color-picker", { key: '78401ba31a8b66b809b9f362bd501f1dcb490880', color: this.value, ref: (el) => (this.picker = el) }))))));
     }
     static get is() { return "swirl-color-input"; }
     static get encapsulation() { return "scoped"; }