@getflip/swirl-components 0.311.0 → 0.312.0

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

@@ -16,7 +16,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: '76a4bbf469841312d537403643d539f791da580a', 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: 'e6d545142effa45c4773135ea98519b718a8937d' }, index.h("path", { key: '786bd8f8561ec754cb524700964027578c737893', 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: '11abde898ab4e155850c8e65605739035e597114', 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: 'dc0a03ba339cbb44e6c2499b71d6aeedae5fa40a' }, index.h("path", { key: 'eef7e075b1784f15dce414a3aa3d33d5ef70337f', 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 = SwirlSymbolXingStyle0;

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

@@ -16,7 +16,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: '2d963db3c02b4b32cf16d37e89bfdc70f16e0ecc', 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: 'f34dcb38275601d27ec2dd73c860926d76b2c470' }, index.h("path", { key: 'c12030311c602ef43b0a859b11075240adde440d', 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: '4f25a1ea356d222fd543df1b04b16b978a5a6897', 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: '0a5956ae7eb276561868ae465ad796fd6f4fbfbf' }, index.h("path", { key: '895967952eb6098a510ec84d619954b7903ec0f4', 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 = SwirlSymbolYoutubeStyle0;

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

@@ -15,7 +15,7 @@ const SwirlHeading = class {
     }
     render() {
         const Tag = `swirl-symbol-${this.glyph}`;
-        return (index.h(index.Host, { key: '6bd0cc5ab5b212c3d52c035bea20af711e0a2da3' }, index.h(Tag, { key: '066a23a077d96b07f9d2362ae22409488b690f3a', size: this.size })));
+        return (index.h(index.Host, { key: '0073d9de59130938071dbdaa593684bc2d8f69cb' }, index.h(Tag, { key: 'aa2bd716712c79bea03140ce124c952ba59a758a', size: this.size })));
     }
 };
 SwirlHeading.style = SwirlSymbolStyle0;

package/dist/cjs/swirl-tab-bar.cjs.entry.js

@@ -72,7 +72,7 @@ const SwirlTabBar = class {
                 ? `var(--s-space-${this.paddingBlockStart})`
                 : undefined,
         };
-        return (index.h(index.Host, { key: '6066d102ed7194ff5612974ad34f4bd4e2762bcf' }, index.h("div", { key: '9cd1f5b63a9f5ceb8b1a5039e6667f4c6ca4d6e0', "aria-label": this.label, class: className, onKeyDown: this.onKeyDown, role: this.disableTabSemantics ? undefined : "tablist", style: styles }, this.tabs.map((tab) => {
+        return (index.h(index.Host, { key: 'a5642987c6e0f12686e27dfe4b94e8d782e77080' }, index.h("div", { key: '877b884ee891e290cce6d18801c9ca5541832182', "aria-label": this.label, class: className, onKeyDown: this.onKeyDown, role: this.disableTabSemantics ? undefined : "tablist", style: styles }, this.tabs.map((tab) => {
             const className = index$1.classnames("tab-bar__tab", {
                 "tab-bar__tab--active": tab.active,
                 "tab-bar__tab--variant-pill": this.variant === "pill",

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

@@ -19,7 +19,7 @@ const SwirlTab = class {
     }
     render() {
         const className = index$1.classnames("tab", { "tab--active": this.active });
-        return (index.h(index.Host, { key: 'b08defd1b30ac10da3384b85eecd617631e285ef', "aria-labelledby": `tab-${this.tabId}`, id: this.tabId, role: "tabpanel", tabIndex: this.active ? 0 : -1, class: className, style: { padding: `var(--s-space-${this.padding})` } }, index.h("slot", { key: 'd5fd5e59ff4a68d580448908b72f15efdb94c0a7' })));
+        return (index.h(index.Host, { key: '7c680b571be6af2ba37e729b9cccfd8c0190204a', "aria-labelledby": `tab-${this.tabId}`, id: this.tabId, role: "tabpanel", tabIndex: this.active ? 0 : -1, class: className, style: { padding: `var(--s-space-${this.padding})` } }, index.h("slot", { key: '9004e283ecae74cfdedeb538339e4401cac34248' })));
     }
 };
 SwirlTab.style = SwirlTabStyle0;

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

@@ -12,7 +12,7 @@ const SwirlTableCell = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: 'afd196cf7cc0afe6958a310579bf54f5a0ceb038', class: "table-cell", role: "cell" }, index.h("slot", { key: 'cc99ea7002a3338354202549ed7f2ccc3ad81a3b' })));
+        return (index.h(index.Host, { key: 'a72e3516277ecd26d796ac27246f6d943dab0447', class: "table-cell", role: "cell" }, index.h("slot", { key: '0def1e17a99469ad85099dba79d601cbd7b63517' })));
     }
 };
 SwirlTableCell.style = SwirlTableCellStyle0;

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

@@ -28,7 +28,7 @@ const SwirlTableColumn = class {
             maxWidth: this.maxWidth || "",
             minWidth: this.minWidth || "",
         };
-        return (index.h(index.Host, { key: '12be8a43ebd5ff73f602be1e7d338e52ed37bf10', "aria-sort": this.sort, class: "table-column", role: "columnheader", style: styles }, index.h("span", { key: '89ad09b2d1f03c5c7aed571bd841b4450bd3ad57' }, index.h("slot", { key: '4cb26535828152ec646c8cfaa5c75258c44f830b' })), this.sortable && (index.h("span", { key: '46bddd37f5de890dcbb1deeefe99a5fe64a1d270', class: "table-column__sort-indicator" }, this.sort === "ascending" && (index.h("swirl-icon-arrow-upward", { key: 'd66664df0691719fd3732748da6974ced8292106', "aria-hidden": "true", size: 20 })), this.sort === "descending" && (index.h("swirl-icon-arrow-downward", { key: '213168a8d1c74d8979b778bc7a1d8f689d9a3655', "aria-hidden": "true", size: 20 })), !Boolean(this.sort) && " "))));
+        return (index.h(index.Host, { key: '13a91ce9f9cca2c6b555fe5190660c09de9ee73d', "aria-sort": this.sort, class: "table-column", role: "columnheader", style: styles }, index.h("span", { key: 'bc000e7c8e0a2ad202d2cbef34355035ed40785d' }, index.h("slot", { key: '0b95f4e092e10642ef9db410d226ba45da7f4ae0' })), this.sortable && (index.h("span", { key: 'e234bc44a5d454fef475cf0529de000b81e2ac09', class: "table-column__sort-indicator" }, this.sort === "ascending" && (index.h("swirl-icon-arrow-upward", { key: '7a41c81ae7b39cf6851328312553168e191f2d20', "aria-hidden": "true", size: 20 })), this.sort === "descending" && (index.h("swirl-icon-arrow-downward", { key: '3ed27adecbdc9e6996e4630d2e8d0ee73925d2be', "aria-hidden": "true", size: 20 })), !Boolean(this.sort) && " "))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -46,10 +46,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: 'e7765f0931961a01b7e4375479a8c5dc950572dc', class: "table-row-group", role: "rowgroup" }, index.h("div", { key: '2d315c7b17562e85b6a27eb71f706042b93ef7bf', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (index.h("swirl-button", { key: 'f3e1b6d3ffdfebf4e56079143d0d40d9e55073b2', 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: '397387f508312c2c41caf520440187a0a32d2670', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (index.h("span", { key: '611d1a9616667ef6657f8c3cef226dc979922730', class: "table-row-group__tooltip" }, index.h("swirl-tooltip", { key: '20bc818fdb2599a56cdd6aa4026066a47a9449ac', content: this.tooltip, position: "top", positioning: "fixed" }, index.h("swirl-icon-info", { key: '305175fe54110fe6fe50962a7cf79b954eb3b9c0', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), index.h("div", { key: '81d31bce114c8adc83187502c7bc29699182d9fb', class: {
+        return (index.h(index.Host, { key: '873848231e19955e3a177cd4e5f8f7171ea4fe90', class: "table-row-group", role: "rowgroup" }, index.h("div", { key: '935b972bc54973cce991597844702d174c138c4c', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (index.h("swirl-button", { key: '6900812b1e35785d71ee606e2686a2cdf6a96db1', 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: 'c4e3dc8b90fbc8eb1f0070fe065a383ddbcd345d', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (index.h("span", { key: '9e6c8dcc82a8e4a253dc05e225637f3402d59c98', class: "table-row-group__tooltip" }, index.h("swirl-tooltip", { key: '9414153f80b993bcf5b34ee04fb5adf0040e7bb2', content: this.tooltip, position: "top", positioning: "fixed" }, index.h("swirl-icon-info", { key: '715a9cac9b61c957e19325d731b110dcc24234c0', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), index.h("div", { key: 'e9387185233dfe57ec4d2bef8d4210d2284eebb8', 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: '415f1c65c9950fbce3efaea24d464e35a4b696c5' }))));
+            }, "aria-hidden": !this.isVisible, ref: (el) => (this.tableRowElements = el) }, index.h("slot", { key: '28dd9896610c1a4f36e6a596a329c7fc1d0be3a4' }))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -23,7 +23,7 @@ const SwirlTableRow = class {
         const className = index$1.classnames("table-row", {
             "table-row--highlighted": this.highlighted,
         });
-        return (index.h(index.Host, { key: 'e092412ed997a09905328d7d65c831d41b75700b', "aria-rowindex": this.index, class: className, role: "row" }, index.h("slot", { key: '651392c65a933d2ddd743850ebd0ffaa706698c1' })));
+        return (index.h(index.Host, { key: 'acff17878f7289446533e814db4b6c09ac59f10f', "aria-rowindex": this.index, class: className, role: "row" }, index.h("slot", { key: '84dd5cc9dfb9d1c5fdb8ea88d4cd6e415b41db51' })));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -540,7 +540,7 @@ const SwirlTable = class {
         const className = index$1.classnames("table", {
             "table--keyboard-move": this.movingViaKeyboard,
         });
-        return (index.h(index.Host, { key: '1447881d1efde84e8841c6d1aff531f7bb024a5a' }, index.h("div", { key: 'dbdc20d96a32973be23fda71e84ea1ce07955b5b', class: className }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: 'a3fcfa3c03a4fdf24b5fa6d014b3d7236472d873' }, index.h("span", { key: '7c2ce1663e664c58f16342efff083079c8deb040', "aria-live": "assertive" }, this.liveRegionText))), index.h("div", { key: '98e64f304653ea45e912a261077a2e39db3c7caf', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, index.h("div", { key: 'e7a7e24ae63747c6bb0cd3418207fdb4bc65ef82', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index.h("swirl-visually-hidden", { key: '4537f9b33fae4531eb8a10e0bc136c2cea949423' }, index.h("div", { key: '060dc5318ffe71018a4e6bde3e51cce04769d857', id: "caption" }, this.caption))), index.h("div", { key: '61598f2ba60d9def94e0a7c30a24e3108c67fc93', role: "rowgroup" }, index.h("div", { key: '6fc736dce4c2c50b2fc815b6065123cd9927462c', class: "table__header", role: "row" }, index.h("slot", { key: '4519fee7ab6b45db0f93ffc0921350a1c27b036c', name: "columns", onSlotchange: this.onSlotChange }))), index.h("div", { key: 'c4e8834e738d66abcefca20e22b52e2bc0b68d50', class: "table__body", ref: (el) => (this.bodyEl = el) }, index.h("slot", { key: '1df1d994c3f4f305bd3c6cdddb25fe6c28e560df', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (index.h("div", { key: '87b06f67bf19a91337bd05964aa9435327c366aa', class: "table__empty-row", role: "row" }, index.h("div", { key: '734d97aad4b8b7235e113f1d470ac8fa5ec7a1d9', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index.h("swirl-text", { key: 'b50a849e4fab6a8fdc100eb5db793fd2cb3aaa77', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (index.h(index.Host, { key: '2ae8540302a68acad9029fabf960923531ec934a' }, index.h("div", { key: '6b164e69ffa0182082ff290ff06ce36b8070b6b0', class: className }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: '714747c389de5a86222b098da0ff7d72b18bbcd7' }, index.h("span", { key: '718b5a9b3190ae8f4f754b45dd05137ca4215399', "aria-live": "assertive" }, this.liveRegionText))), index.h("div", { key: 'c93b7539dc26c4b2ddb758afff05a39cbdbce178', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, index.h("div", { key: '9991891878bc050164e8c2a97d92b4d94bf31230', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index.h("swirl-visually-hidden", { key: '4f3cd1c1702e628eb806e800e4ee71ee1d8a3f30' }, index.h("div", { key: 'abd58a04ee7ff3d59b649fb4e0a62f37836c2391', id: "caption" }, this.caption))), index.h("div", { key: 'd1229b8b8e99756be743a9c3a58080f8c5dde9a6', role: "rowgroup" }, index.h("div", { key: 'ae615779797edbae1f69a4f8f16a77bbb13a0e27', class: "table__header", role: "row" }, index.h("slot", { key: '8c423889a4e1d1347a49e99aa721dc8e71465c85', name: "columns", onSlotchange: this.onSlotChange }))), index.h("div", { key: 'ac7ad4eb1591ec7e1031d18b012d3422891eeda6', class: "table__body", ref: (el) => (this.bodyEl = el) }, index.h("slot", { key: '803f24597520f80fc4241c72e5e22b63d3ef5b6b', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (index.h("div", { key: 'c0e702dd177ec0a1ee0996acbf71943a3a4bb186', class: "table__empty-row", role: "row" }, index.h("div", { key: 'ae680509ac11d7ecf9b83802c5a36db19598e25c', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index.h("swirl-text", { key: 'e0e1486a9e1f13d2b700772d5f274f1dadf3b0e8', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -88,7 +88,7 @@ const SwirlTabs = class {
         }));
     }
     render() {
-        return (index.h(index.Host, { key: '9416903ca9d6b88cae2a3cb3774cd9144197421f' }, index.h("div", { key: 'd13670144eb66f3fb1daa3efb65f87ccbf2b5fdf', class: "tabs" }, index.h("swirl-tab-bar", { key: '41c0d6c00ad2c5053a7cb37feec2bb0f1042c1df', 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: 'f4ad6282aff0e59e73cd0b8beb7c0f9dabf8ee79' })));
+        return (index.h(index.Host, { key: '60260cb1f18a212dd2eabab8880fe0bdf107b559' }, index.h("div", { key: '182e210d264742891420dffc8ea131b661076cf0', class: "tabs" }, index.h("swirl-tab-bar", { key: 'a2669ccad64fc1f6002a3828f84d7f4e5a71b182', 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: 'a8487d716c79005cea85a470bc0aa855b735ac31' })));
     }
     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.h(index.Host, { key: '83e1fa2f130305615c7f3b5d0dd2c43be0678f4b' }, index.h(Tag, { key: 'e0722bc8f2d6546b2c67e5e3fa468bfad24d7823', class: className, ref: (el) => (this.textEl = el), style: styles }, index.h("slot", { key: '1b0adbcb9aa029c05cfd9063a0721608ffbe3a1e' }))));
+        return (index.h(index.Host, { key: '96ae82ae22a10e00647691edb5252db1e8dec4a9' }, index.h(Tag, { key: '57ec6835e2324b4e26d19e701e698eeefc1494e1', class: className, ref: (el) => (this.textEl = el), style: styles }, index.h("slot", { key: '0a6be461bab15f5ad6ce8cf5d3018c1943bb7400' }))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -156,7 +156,7 @@ const SwirlThemeProvider = class {
         this.setDesignTokens = [];
     }
     render() {
-        return (index.h(index.Host, { key: 'ca058bf771dd18b13dd047f2885a599a00647a5b' }, index.h("slot", { key: '50916c63269ea4c024c25dc06714af324521fe3e' })));
+        return (index.h(index.Host, { key: 'c412da23f8baf951faa754c36636458ec42f3b7c' }, index.h("slot", { key: '336242c2d1ec7b011aaba8059e5f309e36be476e' })));
     }
     static get watchers() { return {
         "config": ["watchConfig"]

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

@@ -129,7 +129,7 @@ const SwirlTimeInput = class {
         const className = index$1.classnames("time-input", {
             "time-input--inline": this.inline,
         });
-        return (index.h(index.Host, { key: 'd9d349da2d5dffc4263107ef073af2a8cdd0ec02' }, index.h("div", { key: '6e9b753c44fda2e9b473ea3fb25b7f18905d4311', class: className }, index.h("input", { key: '3b10ce81f3a052205298dcbf75790aec6108c79c', "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, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), index.h("span", { key: 'a016010c070cb9f3fa502cee2ba1b5150c17ce9b', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: '76bb525b214a5bdf1f64e844531eac7249a04412', size: this.iconSize })))));
+        return (index.h(index.Host, { key: 'd0b3fb3ed85f81fbc3df1854bf01a5927eaf3129' }, index.h("div", { key: '7a1aa4380fba14845c2c3ff7531ce2a38eca03c5', class: className }, index.h("input", { key: 'd29606690c220d2273b58189ddb99e0a0a8ad850', "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, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), index.h("span", { key: '006e537b7d623ba287481808397c1ba39f67be52', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: '228a37b93f2cd5fa86277baade38c82826d4879b', size: this.iconSize })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -55,7 +55,7 @@ const SwirlToastProvider = class {
         return newToastWithId;
     }
     render() {
-        return (index.h(index.Host, { key: '1d56b15f712d5700eedf795fdd056f23829084e1', role: "status" }, index.h("swirl-stack", { key: '1b0caf3ba9b0a659f8584bdae98c9c390c70d6c5', spacing: "12" }, this.toasts.map((toast) => {
+        return (index.h(index.Host, { key: '0998fba2aca64e83e30d1dd6521282e00b8fb11f', role: "status" }, index.h("swirl-stack", { key: '78c8d98ac284279192495b2350d090a4afa9d9f6', 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

@@ -63,7 +63,7 @@ const SwirlToast = class {
     }
     render() {
         const className = index$1.classnames("toast", `toast--intent-${this.intent}`);
-        return (index.h(index.Host, { key: '4e10fb63fb1be2e0ee05b35f4d6e40c5dff1e1ab' }, index.h("div", { key: '9b0a40561f9d22078f18e0ec648ec98a4ff26eeb', class: className }, this.icon && (index.h("span", { key: '8ec71ba2f631cd0c92f5082512064a68324ea85c', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'aa25c8b4b915f399ebc3ee43c8b43af31e74f4ee', class: "toast__content", innerHTML: this.content, part: "toast__content" }, index.h("slot", { key: '51b7fd7dd4a5ba1cf323c7535e3efdcd05fbbf9e' })), index.h("button", { key: '68dd43b53a9a600db3c0380b0432221746d9fca3', "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: 'b1eae00996c672014fc04ddef4f3a3f79408ccbf', ref: (el) => (this.dismissIconEl = el) }))))));
+        return (index.h(index.Host, { key: 'f6166d0f4e5056fb35f14de5f25eac8d58dd1c1a' }, index.h("div", { key: '62539278cb95d34d2fd81d90bb663036182cc449', class: className }, this.icon && (index.h("span", { key: 'b27cf85f7fa23bcb10d7c6734c20681f27d57ac8', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), index.h("span", { key: '78d34024974fbd20e74b818e155d3853486ef968', class: "toast__content", innerHTML: this.content, part: "toast__content" }, index.h("slot", { key: 'aaecc94e03ade48c3d7853eee2e55e2d619eff6d' })), index.h("button", { key: '854d3f18fcb5a03a71cdd04f8d10d3c0857a6d56', "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: '9c2d7bc628a096b4e1c0658de0ebd03aab329979', ref: (el) => (this.dismissIconEl = el) }))))));
     }
     static get watchers() { return {
         "duration": ["watchDuration"]

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

@@ -23,7 +23,7 @@ const SwirlToggleButton = class {
         const classNames = index$1.classnames("button", {
             "button--pressed": this.isPressed,
         });
-        return (index.h("button", { key: '74e8b4246d353bfd943f8f4d7447795c38f9e4de', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (index.h("swirl-icon", { key: '1c9f8f24faa20722664176f3badd22525bedd122', class: "button__icon", glyph: this.icon })), index.h("span", { key: '38c1a93f671686f9ee525597636a61b03fd0c0ce', class: "button__label" }, this.label)));
+        return (index.h("button", { key: '83c7fbb5fcda60398ac5c71fed5b5998a921bd72', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (index.h("swirl-icon", { key: '6e397adca526c1776322a170f0c45ea018b6e893', class: "button__icon", glyph: this.icon })), index.h("span", { key: 'a465db6330f888a5ae18bdee6fa4b0c31400499d', class: "button__label" }, this.label)));
     }
 };
 SwirlToggleButton.style = SwirlToggleButtonStyle0;

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

@@ -65,7 +65,7 @@ const SwirlToggleGroup = class {
     }
     render() {
         const className = index$1.classnames("toggle-group", `toggle-group--variant-${this.variant}`);
-        return (index.h("swirl-stack", { key: 'bbb892ebb0078f1d85221c09f45d26ab1a9394d7', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: 'b697050275ced33880041fa0f33fa9d9902c216d', onSlotchange: this.onSlotChange })));
+        return (index.h("swirl-stack", { key: 'f97cb2df8c324c931f4b644b6df0f4ec00a5d905', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: '7a492e568a5f46cb19e8c622bf4a5cd4de1254ff', onSlotchange: this.onSlotChange })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -75,7 +75,7 @@ const SwirlToolbar = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: 'e0050b4506c6a1fa8f3caa40c2072fd05ee7a905' }, index.h("swirl-stack", { key: 'a81e0333e80646ade8b45644a1838baf26da1873', 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: '92fa6c0f06ac9651b2f3abbc086f143b36d11277' }))));
+        return (index.h(index.Host, { key: 'c47f1477439dbc75cd98519c4085b22ccd1cdcd4' }, index.h("swirl-stack", { key: '3beb91a150632d2f26bab090e4ed190fe5be3dc5', 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: '8a8b20e1d846ef3d2e7c44c4f606f8cd692d525d' }))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -119,7 +119,7 @@ const SwirlTooltip = class {
             "tooltip--active": this.active,
             "tooltip--visible": this.visible,
         });
-        return (index.h(index.Host, { key: 'b98af38861cabd42aedd37fd9e55e4a4bab68349', onKeydown: this.onKeydown }, index.h("span", { key: '5bb42e83b24028a5b7497c639505f8617705ea0a', class: className }, index.h("span", { key: 'f6fb3fa48b455d68e538eea1a33d8c2a91abee2f', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: '8ba4672f84663444be5131a4d240b84dffd94350' })), index.h("span", { key: '513527ac1724ab0ffa7c73026a46328f495ce9dd', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
+        return (index.h(index.Host, { key: '2236c5b795c38c6d6099406fddfa6ac0cee7ab73', onKeydown: this.onKeydown }, index.h("span", { key: 'e5d0f6faf86e12294d005f3216341172f9974274', class: className }, index.h("span", { key: 'dc3270c80b0b59db83ad25e0de437227b5ef88b4', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: '891b4c0bf749fe9d0f0eea92a6791338b7893368' })), index.h("span", { key: '4676c247f77288c7a1fb98088b5e57322dc22f8d', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
                 top: Boolean(this.actualPosition)
                     ? `${this.actualPosition?.y}px`
                     : "",
@@ -127,7 +127,7 @@ const SwirlTooltip = class {
                     ? `${this.actualPosition?.x}px`
                     : "",
                 position: this.positioning,
-            } }, this.visible && (index.h("span", { key: 'f9bba867d35b5d9f9d2f6b76d933285162ba747a', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: 'e002a27b50e4dc5bb1fb76ec8951b0a07ba9f4d7', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: '7d986a3fd9dc05ed2e0798faf5bbc087ff6edc82', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
+            } }, this.visible && (index.h("span", { key: '9f24cf37428b014e9c3b0839b7cf1458b2825b6f', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: '0e3826c70432ea5a1e4572723b4d68ed7b4cb102', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: 'db27a117ce2dcd64108e3a28f8241a828be66e2e', 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

@@ -99,12 +99,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: '33bef3f2582f3a66876f540eb64a4adca9c42095', role: "none" }, index.h("li", { key: '3a1ff715d4ab97ce1a8c1d4a2490bf0bbc32a95d', class: {
+        return (index.h(index.Host, { key: 'e4576318687cd5c04204d9143d491daf9790849b', role: "none" }, index.h("li", { key: '39a2d1e87b7f87acea4384eb2a1a00c00fcaea5a', 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: '907aa367836e088e3f472f9579a2891a074c4d60', 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: '15440fbbe9c089a5bd4e83858cebe11ab6421003', class: "tree-navigation-item__content" }, this.icon && (index.h("swirl-icon", { key: '74174884788c27e30975823813b53bf8f81518a6', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), index.h("span", { key: 'b3bae7140c243df25b893fbf6121b2674ede0602', class: "tree-navigation-item__label" }, index.h("span", { key: '97b78af129e93c875efd89f7afe29c11c55e0e0d', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (index.h("span", { key: 'ba4c64f57a82e998c8a3b439af9a5f027f7dae16', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, index.h("swirl-icon-chevron-right", { key: '9b428893c69b34113363373c30d040092bfd60b6', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (index.h("span", { key: 'a123a58d0a5e5785e69c1874549ee02faed762de', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, index.h("swirl-icon-open-in-new", { key: '4e5125776c6a8ab2cc1a474ea4769797fd604f5e', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (index.h("ul", { key: 'efdf392212b852571d0db0228841f1761536e6f8', 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: '79e8b395fd48e48c4b78f47453bbf60c36d826b4', 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: '22d7ce73e9474afc48e9cd7926f39b813882cafe', class: "tree-navigation-item__content" }, this.icon && (index.h("swirl-icon", { key: '1f24379f70cd6c108d546ab42d6b2c0bf2cdd14f', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), index.h("span", { key: 'a4a68870512d4e9a41faed70714a4fdc5a846937', class: "tree-navigation-item__label" }, index.h("span", { key: '4b06a7994f819e16473c83979acc16640a992d71', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (index.h("span", { key: '9bdae5291ca9797ddee33b690ecbe58329cc3d50', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, index.h("swirl-icon-chevron-right", { key: '5a11991d104527610e9459529323a51300075a90', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (index.h("span", { key: '88940e3e66e14239e7bed6fb858d82bda2a64b5f', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, index.h("swirl-icon-open-in-new", { key: 'e9e9fd847926123ae371a2d4c8c1bfbd031531f6', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (index.h("ul", { key: '8419d950301dbbcc61deb81780dea70f3653de1b', 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: '8213c14e36a60a0a83665e28ee42b869004e2541' }))))));
+            } }, index.h("slot", { key: '9ec60dbb89df51923139feb9f213933129a623ba' }))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -13,7 +13,7 @@ const SwirlTreeNavigation = class {
         this.label = undefined;
     }
     render() {
-        return (index.h(index.Host, { key: '28f12d544f31a15e4768ccd2724dc590499d516a' }, index.h("ul", { key: 'eaa75ff170fb4ad27ac2e4aca793ad62fc8165c9', "aria-label": this.label, class: "tree-navigation", role: "tree" }, index.h("slot", { key: '006168e0a4d9dcc0e3b3820f7ea23cdc223a26ca' }))));
+        return (index.h(index.Host, { key: '2e21813754c1a402da019a6751fdffe7ba515e1c' }, index.h("ul", { key: '0b44976618b26bb7e7245bc5f0d93d4c195403c4', "aria-label": this.label, class: "tree-navigation", role: "tree" }, index.h("slot", { key: 'e2428f21a7cdfa5c53a17406617005f9cc0e2233' }))));
     }
 };
 SwirlTreeNavigation.style = SwirlTreeNavigationStyle0;

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

@@ -334,13 +334,13 @@ const SwirlTreeViewItem = class {
             "tree-view-item--disable-drag": this.disableDrag,
             "tree-view-item--has-tags": hasTags,
         });
-        return (index.h(index.Host, { key: '75dd63c2351c480395661aa8610d95f73ba847be', id: this.itemId, role: "none" }, index.h("li", { key: '122ed8c7439065d4a98b8482f70ca5085afeed50', class: className, role: "none" }, index.h("a", { key: '32c6ca8c645d70c1a5613f308b5b02647e681240', "aria-current": this.active ? "page" : undefined, "aria-expanded": !hasChildren ? undefined : String(this.expanded), "aria-level": this.level + 1, "aria-owns": hasChildren ? `${this.itemId}-children` : undefined, "aria-selected": String(this.selected), class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, !this.disableDrag && this.enableDragDrop && (index.h("span", { key: '5eece9bd6261c2dd0b4ff99ec6ee0bd23fd6eea4', class: "tree-view-item__drag-handle" }, index.h("swirl-icon-drag-handle", { key: '7539e72d5dc882dd7263ec4529ac406d69e77924', size: 20 }))), this.expandable && (index.h("span", { key: '062cd728c408668281f30ac640905fcdd6226c50', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: 'd4c8f1bcc9e4672217cd6ea9cf03f0d8760623a4' }, this.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: 'aed364abae35a0d71531816442974a3a1e422367' }, index.h("span", { key: 'fb00b679ad160b319f79548f69a2c1479514e542', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: '271390e11dff546cdb789b684ad128873213b441', class: "tree-view-item__label" }, this.label), index.h("span", { key: '877f094d48b4c80458021d84efc17f1f38cfffd5', class: "tree-view-item__tags" }, index.h("slot", { key: 'd610a4c86bfa2b1962cc94087382ca21c813e24b', name: "tags" }))), index.h("ul", { key: '12e5ebabf7f1b801846f0633a6116a093e81dbbc', "aria-label": this.label, class: `tree-view-item__children ${shouldShowChildrenDropZone
+        return (index.h(index.Host, { key: '93dc02e5eb22f1bd3c73ce98edf7f1d1f97541e8', id: this.itemId, role: "none" }, index.h("li", { key: 'dda1fa8815f770054c2c973657527eae92f09926', class: className, role: "none" }, index.h("a", { key: 'fd51ad27190a29e84b9bc5da1065fdbe3b68b5b9', "aria-current": this.active ? "page" : undefined, "aria-expanded": !hasChildren ? undefined : String(this.expanded), "aria-level": this.level + 1, "aria-owns": hasChildren ? `${this.itemId}-children` : undefined, "aria-selected": String(this.selected), class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, !this.disableDrag && this.enableDragDrop && (index.h("span", { key: '466864a5732100a81c125e01ccac77f61ffc935d', class: "tree-view-item__drag-handle" }, index.h("swirl-icon-drag-handle", { key: 'c9019bd29e980bce6bd5b6de8251d2d9a511a283', size: 20 }))), this.expandable && (index.h("span", { key: 'da78e6b937508ae712dbf45e97b451452703b22c', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: 'c0053bf890ba01d40da334f2a443825f47d52010' }, this.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: '571e97884326cb69f1bed60cb13855693dec61ab' }, index.h("span", { key: '524c89963b4be97fa50543f35458f09effa94189', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: '4fb7d9453369eb53c0a27001513fdcc61e00d356', class: "tree-view-item__label" }, this.label), index.h("span", { key: 'ca5ab620a3ba4e99192907627e1e5a5c31b322b0', class: "tree-view-item__tags" }, index.h("slot", { key: '000bdd02c2c99720b4684eb32abcf25ff17d1947', name: "tags" }))), index.h("ul", { key: '4ecb032a5172292d5fca2c5d4cece01efba90826', "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: "group", style: {
                 display: (!this.expanded || !hasChildren) && !shouldShowChildrenDropZone
                     ? "none"
                     : undefined,
-            } }, index.h("slot", { key: '6a4281e2924093ea470ee009f4178a296d4569af' })))));
+            } }, index.h("slot", { key: '8cab84b9a0f2dd58e2e2d90816a7f3d6058aa661' })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -329,7 +329,7 @@ const SwirlTreeView = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '16955aa0d14337164dad7afde596cb024a9db2da' }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: 'f057d62cdfc78ab6934c0896d9ab9dc49b536b92' }, index.h("span", { key: '535b2f2897208e08d5c3b9fe4f831643457d5bf5', "aria-live": "assertive" }, this.liveRegionText))), index.h("ul", { key: '16272c7b26ae0c84b0a6e876bb6253c344fa281c', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: "tree", ref: (el) => (this.listElement = el), tabIndex: -1 }, index.h("slot", { key: '505e3b9141e895a347cca881762b67ae126485d3', onSlotchange: this.onSlotChange }))));
+        return (index.h(index.Host, { key: '4c2065517b90c6f27eb937ceccf4c57425dced81' }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: '6e10ffbbe3678201b4dced3f50de90d23c0d0974' }, index.h("span", { key: '6a2ab0e869c1ad73563d3edb29414fd0b7bba536', "aria-live": "assertive" }, this.liveRegionText))), index.h("ul", { key: '452b6a1a77dccf7ef85099a282400c716a733a9b', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: "tree", ref: (el) => (this.listElement = el), tabIndex: -1 }, index.h("slot", { key: '8704ebd9fe02fae40fc6ffe88da4eb81a9f3d123', onSlotchange: this.onSlotChange }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -16,7 +16,7 @@ const SwirlVideoThumbnail = class {
         this.src = undefined;
     }
     render() {
-        return (index.h(index.Host, { key: '725be56f5eeb3c9b535e0581b0421d3c86e8f4bc' }, index.h("button", { key: '04a020b91a16eb900b7c30738401f1ccd838bff3', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: '9d441c9ecb649e25d34d7805b339a2e973d9cc04', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: '9fe1db1b3ef5c30471564e2e7359ee59867df9c3', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: '686264efcee5ad08e10dcff64132cecf3c26b336' }, this.durationLabel), this.duration)), index.h("svg", { key: '34ccc3ae31421ae0b63158fb2dd5748bd29c94a7', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'c75b854caf9c121031bbb83f3ec47cecf1f7221b', 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: '417bb1f3a63576455e32ad4cca9ae5146bcbb221' }, index.h("button", { key: '1cc51d2d880e45f1cc933f59267461bee2441507', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: 'de93241fdeeb0a9ed2f3f5ba379a18ad12d748b0', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: '62d3ccd011b5c2119b0a26f7f94456d89f785f49', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: '6b59f1270f440a3a9d45865894092d835ea0aee4' }, this.durationLabel), this.duration)), index.h("svg", { key: 'f4c011cd334f4347772c00e416b661d325089b29', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '5b2f0b42374aed1461134371e3e686340e79bf01', 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 = SwirlVideoThumbnailStyle0;

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

@@ -12,7 +12,7 @@ const SwirlVisuallyHidden = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '2915b24d87af8acf48c949ec521d11d2097ff073' }, index.h("slot", { key: 'c1991da67038c8aad9a4e09a2d05d213d474fa82' })));
+        return (index.h(index.Host, { key: '7294850eef8e84a5e02f997c93985c5637b8b8d3' }, index.h("slot", { key: '97659cec31fbca092e6e403c0fea4c0cdbe453aa' })));
     }
 };
 SwirlVisuallyHidden.style = SwirlVisuallyHiddenStyle0;

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

@@ -36,7 +36,7 @@ export class SwirlAccordion {
         });
     }
     render() {
-        return (h(Host, { key: 'a0238e83947d9afba57724fb36e774d78efd913e' }, h("slot", { key: 'f5c6514ddba5891899fce71770d0ff9b7d11119e' })));
+        return (h(Host, { key: '8ef36c3611f702d9a68fa14eff3f1df31501a004' }, h("slot", { key: '92a68a15db65f4f226b9c70ca3bb3800fb09f2bb' })));
     }
     static get is() { return "swirl-accordion"; }
     static get encapsulation() { return "shadow"; }

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

@@ -58,7 +58,7 @@ export class SwirlAccordionItem {
         const className = classnames("accordion-item", {
             "accordion-item--expanded": this.expanded,
         });
-        return (h(Host, { key: 'f951ccc4ac61db37d06140df2d431419cd82901c' }, h("div", { key: '7fa7d7e89d574372e4217db6964b339603c9b3fc', class: className }, h(HeadingTag, { key: 'f829db405a340e95b471eaf26a440a4c42235d83', class: "accordion-item__heading" }, h("button", { key: '2ce164da5ab47a682c0069412b17ff506a4c1486', "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: '2214bb46310023a5e9c67b2d41a08804cc062c80', class: "accordion-item__toggle-text" }, this.heading, this.description && (h("swirl-text", { key: '46d93be000154b0e26cdfafdfd0178608a0c5ad3', as: "span", color: "subdued", size: "sm" }, this.description))), h("span", { key: 'b0ea37c8e09ac78ae7fcae49503e9da0ba3990a4', class: "accordion-item__icon" }, !this.expanded && (h("swirl-icon", { key: '0860a668b53927c1809ddcd98e371457f4aea96f', glyph: "chevron-right", size: 20 })), this.expanded && (h("swirl-icon", { key: '294ef0b5d6289a69a66bb32c7c9aa4f6695b0ddf', glyph: "expand-more", size: 20 }))))), h("div", { key: 'f8a7be67ea974fce5bbadc6e0db545cbf785e581', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, h("slot", { key: 'c6c57bc5c5876f31ba20f7a78293ee710e5262d4' })))));
+        return (h(Host, { key: '1a90615a1c901d606d518e88641d0e85f526946e' }, h("div", { key: 'b866c9b99d6677391a5d168847471bcfdbad5628', class: className }, h(HeadingTag, { key: '6bc0d73419c7a515a964bc110bc316dd2825a393', class: "accordion-item__heading" }, h("button", { key: '7976196db3c1b4066c43a0fbc9a7c016232b9e06', "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: '17c4b129411d3c579ef54aaf81112c0239f3ce1a', class: "accordion-item__toggle-text" }, this.heading, this.description && (h("swirl-text", { key: 'bbacaf5009bf16b367114fa8c1852d045d89e0d3', as: "span", color: "subdued", size: "sm" }, this.description))), h("span", { key: '6bf59d3b45fca0f417df2e524b7e6f1f90932d56', class: "accordion-item__icon" }, !this.expanded && (h("swirl-icon", { key: '7597fe68474c59a67810eb7ff22a45b3c997efe4', glyph: "chevron-right", size: 20 })), this.expanded && (h("swirl-icon", { key: 'c7b18ac78d566b36c9b388e3b80070a147889080', glyph: "expand-more", size: 20 }))))), h("div", { key: 'ccce112d4cf2640f9bbfa944d6ad7edb8a5e5cbf', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, h("slot", { key: '52b64ccf5a6ea90570c66574c4eda47338bbf461' })))));
     }
     static get is() { return "swirl-accordion-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -90,7 +90,7 @@ export class SwirlActionList {
         });
     }
     render() {
-        return (h(Host, { key: '82241f786cb1b908d05d4d2a733be0bf51aee08f' }, h("div", { key: '8c5d86e958401b071587e3d4b7b842de267e4026', "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: '5e48f057027f3899c30f9c3181feff3935184a77', onSlotchange: this.setSectionSeparator }))));
+        return (h(Host, { key: '8d70b6b3e10116e0085d1a7697212870c9c0b2ac' }, h("div", { key: 'b266eed0683947cf48ac3d54c36026098736960d', "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: '7a64aadd127a1d348296bbdf0c22472dfc910a69', 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

@@ -10,7 +10,7 @@ export class SwirlActionListSection {
         this.hasSeparator = false;
     }
     render() {
-        return (h(Host, { key: 'df76f2b7c5b1fc5f37f9d191c3c688aeaa20db99' }, this.hasSeparator && (h("swirl-separator", { key: '9689c9fa14a69d33c56f62b09a935274ef69eb0b', spacing: this.separatorSpacing })), h("div", { key: '18d611cadb26d1a73c51c528495306b660dbb68e', "aria-labelledby": "label", class: "action-list-section", role: "group" }, h("span", { key: '1e2ba4d6358b5e11d68d6b4b175c63b049d7c7a4', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), h("swirl-stack", { key: '2676a9ca96414d35dd101f2b230a257678e96792', spacing: this.spacing, align: "stretch" }, h("slot", { key: '9238a1b9df58b33a34a68b9c21d1d61760f095fa' })))));
+        return (h(Host, { key: '30f49fcc99b81adbee8b2e62f38d54255b0623bd' }, this.hasSeparator && (h("swirl-separator", { key: 'd1f5363f99c9b5cc7d638d458101c4c20ded900e', spacing: this.separatorSpacing })), h("div", { key: '012bcbab8801f481f6e8dcec7297a83a68364bcc', "aria-labelledby": "label", class: "action-list-section", role: "group" }, h("span", { key: '96e36dd6aa3ef074459ddbf7ee9f6d9d6268355e', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), h("swirl-stack", { key: 'a5a3ffaf789bc4092ef90c4602ffc77b16a8bebd', spacing: this.spacing, align: "stretch" }, h("slot", { key: '1077b13cf4359fbcaebedea0e5d7ca07f782e363' })))));
     }
     static get is() { return "swirl-action-list-section"; }
     static get encapsulation() { return "shadow"; }

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

@@ -33,7 +33,7 @@ export class SwirlAppIcon {
         const className = classnames("app-icon", {
             "app-icon--has-icon": showIcon || showFallbackIcon,
         });
-        return (h(Host, { key: '1d540798f4137ca3932f465e8b5dc241b9dfe651' }, h("span", { key: 'f44fa6ca8d46f589cbab93aa1eea1ae5e1221cef', class: className }, showImage && (h("img", { key: '24f5f1df7531ecbd71d3aed31842ceacb171d5ce', alt: "", height: "256", ref: this.onImageElementUpdate, src: this.src, width: "256" })), showIcon && (h("span", { key: 'c5fec7fd12b4004027f0e62b21a41d72130313a6', class: "app-icon__icon", innerHTML: this.icon })))));
+        return (h(Host, { key: '6c5cf88ef1f7227b2e2f692284dd6b2dfcaa024c' }, h("span", { key: 'a86fe3a6fc8e531b60820015ac26f682f23364f5', class: className }, showImage && (h("img", { key: 'c3acb5e1dbb6bbc846b9ddae80838d682934a6ef', alt: "", height: "256", ref: this.onImageElementUpdate, src: this.src, width: "256" })), showIcon && (h("span", { key: '963ee092b53a4badb190e3c11d5713c604670524', 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

@@ -25,7 +25,7 @@ export class SwirlAvatarGroup {
             "avatar-group--has-badge": Boolean(this.badge),
         });
         const badgeClassName = classnames("avatar-group__badge");
-        return (h(Host, { key: '8006642426c32008d08219733f23ca90ce5b572e' }, h("div", { key: 'c2980d52eb16ff1a559230ce7f8cdb4c9cf60e0e', class: className, role: "group" }, h("slot", { key: '0ecaf6ce8e3831b44e23fcec3eeccc9ff8cee9b4' }), this.badge && (h("span", { key: '13fd0d6c4436938a328e0e8379a9c8e30b79f03d', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
+        return (h(Host, { key: 'c7257cd9ac2c94a11847ba5a56acd1815f066613' }, h("div", { key: 'e9bfad8bbbb6802c3b8017e24abe56fdbbea9d8a', class: className, role: "group" }, h("slot", { key: '7ccc570f803317d285bfa77df77f7ba866430137' }), this.badge && (h("span", { key: '7cd54c09e634a12bb48b863e46abc886f9add9ec', 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-card/swirl-card.css

@@ -14,6 +14,7 @@
   --swirl-resource-list-item-background-hovered: var(--s-surface-hovered);
   --swirl-resource-list-item-background-pressed: var(--s-surface-pressed);
 
+  position: relative;
   display: flex;
   overflow: hidden;
   width: 100%;
@@ -141,6 +142,12 @@ a.card:focus-visible, button.card:focus-visible, .card--interactive:focus-visibl
   background-color: var(--s-surface-highlight-default);
 }
 
+.card--has-floating-controls:focus-within .card__floating-controls,
+  .card--has-floating-controls:hover .card__floating-controls {
+    pointer-events: auto;
+    opacity: 1;
+  }
+
 .content-section {
   padding: 0 var(--s-space-16);
 }
@@ -158,6 +165,17 @@ a.card:focus-visible, button.card:focus-visible, .card--interactive:focus-visibl
        object-fit: cover;
   }
 
+.card__floating-controls {
+  position: absolute;
+  z-index: 1;
+  top: 0;
+  right: 0;
+  padding: var(--s-space-12);
+  transition: opacity 0.2s;
+  pointer-events: none;
+  opacity: 0;
+}
+
 .card__body {
   display: flex;
   min-height: 0;

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

@@ -2,7 +2,9 @@ import { h, Host, } from "@stencil/core";
 import classnames from "classnames";
 const swirlCardBorderRadiusTokens = ["xs", "sm", "base", "l", "xl"];
 /**
- * @slot slot - The card contents
+ * @slot content - The card contents
+ * @slot image - Optional image or image grid
+ * @slot floating-controls - Optional controls displayed on hover in the top right corner
  */
 export class SwirlCard {
     constructor() {
@@ -48,6 +50,7 @@ export class SwirlCard {
     }
     render() {
         const Tag = Boolean(this.href) ? "a" : this.as;
+        const hasFloatingControls = Boolean(this.el.querySelector('[slot="floating-controls"]'));
         const hasImage = Boolean(this.el.querySelector('[slot="image"]'));
         const styles = {
             borderRadius: swirlCardBorderRadiusTokens.includes(this.borderRadius)
@@ -77,14 +80,15 @@ export class SwirlCard {
         const className = classnames("card", `card--elevation-level-${this.elevationLevel}`, `card--intent-${this.intent}`, `card--justify-content-${this.justifyContent}`, {
             "card--elevated": this.elevated,
             "card--flashing": this.flashing,
+            "card--has-floating-controls": hasFloatingControls,
             "card--has-image": hasImage,
             "card--highlighted": this.highlighted,
             "card--interactive": this.interactive || this.href,
             "card--is--borderless": this.isBorderless,
         });
-        return (h(Host, { key: '9275906a65a55264d2b70c2f7e406315a267eca6', styles: { height: this.height } }, h(Tag, { key: '0ea75344d70f0ba3519ca36d37998e899b03e8a6', "aria-label": this.swirlAriaLabel, "aria-labelledby": this.swirlAriaLabelledby, class: className, href: this.href, rel: Boolean(this.href) && this.linkTarget === "_blank"
+        return (h(Host, { key: 'a529ab8d475d1ce1149af8f07b038209ff1cc107', styles: { height: this.height } }, h(Tag, { key: 'e92dec9f64ea96d110d199d38967d18f1a51b2a3', "aria-label": this.swirlAriaLabel, "aria-labelledby": this.swirlAriaLabelledby, class: className, href: this.href, rel: Boolean(this.href) && this.linkTarget === "_blank"
                 ? "noreferrer"
-                : undefined, style: styles, target: this.linkTarget }, h("div", { key: '20b1197520e50ac5d3a6e1f6675042123d6e46ef', class: "card__image", style: { aspectRatio: this.imageAspectRatio } }, h("slot", { key: '48d19587d91bc3f40144e2657c687d893011875e', name: "image" })), h("div", { key: '90dd49534a31e78955060233c963bef48fa8067e', class: "card__body", style: bodyStyles }, h("div", { key: 'bb667238706643cf3825658574a211304c4556c0', class: "card__content" }, h("slot", { key: '2f3abe22d702b215efdbae2337547ef09c902521', name: "content" }))))));
+                : undefined, style: styles, target: this.linkTarget }, h("div", { key: 'c2bab78c7aa2e0870323665fd1cf32b726555986', class: "card__image", style: { aspectRatio: this.imageAspectRatio } }, h("slot", { key: '81d4109c5d4083ca0c51f46efc5aee66a8a720c7', name: "image" })), h("div", { key: '40173769b7abb3fe39711adeff1184cbb4ef4ab8', class: "card__floating-controls" }, h("slot", { key: 'c75b077c34356024496573cada02613a75d9a139', name: "floating-controls" })), h("div", { key: 'f8a54d4101dd076f2235dc58bf6290d0edc023f2', class: "card__body", style: bodyStyles }, h("div", { key: '20f774d42589259219d42b35cb4216927a1edb8a', class: "card__content" }, h("slot", { key: 'f06732e9e53795fe23e3a48061c2de2ae7a279b0', name: "content" }))))));
     }
     static get is() { return "swirl-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-card/swirl-card.spec.js

@@ -13,6 +13,9 @@ describe("swirl-card", () => {
             <div class="card__image">
               <slot name="image"></slot>
             </div>
+            <div class="card__floating-controls">
+              <slot name="floating-controls"></slot>
+            </div>
             <div class="card__body">
               <div class="card__content">
                 <slot name="content"></slot>
@@ -36,6 +39,9 @@ describe("swirl-card", () => {
             <div class="card__image">
               <slot name="image"></slot>
             </div>
+            <div class="card__floating-controls">
+              <slot name="floating-controls"></slot>
+            </div>
             <div class="card__body">
               <div class="card__content">
                 <slot name="content"></slot>
@@ -71,6 +77,9 @@ describe("swirl-card", () => {
             <div class="card__image">
               <slot name="image"></slot>
             </div>
+            <div class="card__floating-controls">
+              <slot name="floating-controls"></slot>
+            </div>
             <div class="card__body" style="padding: var(--s-space-16); padding-block-end: var(--s-space-4); padding-block-start: var(--s-space-2); padding-inline-end: var(--s-space-12); padding-inline-start: var(--s-space-8);">
               <div class="card__content">
                 <slot name="content"></slot>

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

@@ -155,7 +155,7 @@ export class SwirlCarousel {
             "carousel--is-at-start": this.isAtStart,
             "carousel--is-at-end": this.isAtEnd,
         });
-        return (h(Host, { key: '4a31eea643388a6ebcf52cdd818a9bb3c689fdd8', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, h("div", { key: '0c514ec843a103b11a01ea3d82e2096dca5a7aef', class: className }, this.isScrollable && !this.isAtStart && (h("swirl-button", { key: '2fbf655f2234d14e06ff47d2f439f0bad3ce1e10', class: "carousel__previous-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: true, variant: "floating" })), this.isScrollable && !this.isAtEnd && (h("swirl-button", { key: 'aef153d9d78f45024d7c4eb122b505001a80112e', class: "carousel__next-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: true, variant: "floating" })), h("div", { key: '4dd88527e9bdb0f57b415f46d3f04ebf66d24895', "aria-live": "polite", class: "carousel__slides", style: slidesStyles, onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, h("slot", { key: 'a4b6b640183b5355c064ae8fe6fb4c910580c846', onSlotchange: this.onSlotChange })))));
+        return (h(Host, { key: '4a51de70cfbc822287ac89be9a023ce3b1765c72', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, h("div", { key: '9252572f5774605943cd9dcb5ce69fe80db082eb', class: className }, this.isScrollable && !this.isAtStart && (h("swirl-button", { key: 'e580f6713df6b45e9375aa8b235259d10c647d4e', class: "carousel__previous-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: true, variant: "floating" })), this.isScrollable && !this.isAtEnd && (h("swirl-button", { key: 'c6726a036c07c20f35931684c2ba4bb5f72fcd18', class: "carousel__next-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: true, variant: "floating" })), h("div", { key: '5e72c254a630d77df8cb29ea23e799b3a78081d0', "aria-live": "polite", class: "carousel__slides", style: slidesStyles, onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, h("slot", { key: '8b1a05d213ca9f011769154a19fb5d9777b26247', onSlotchange: this.onSlotChange })))));
     }
     static get is() { return "swirl-carousel"; }
     static get encapsulation() { return "shadow"; }