@getflip/swirl-components 0.296.2 → 0.298.0

package/components.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-02-21T15:54:44",
+  "timestamp": "2025-02-26T10:37:58",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.18.1",
@@ -9769,6 +9769,10 @@
         {
           "name": "slot",
           "text": "slot - The dialog content"
+        },
+        {
+          "name": "slot",
+          "text": "left-controls - Controls displayed on the left side of the default ones"
         }
       ],
       "usage": {},
@@ -10008,6 +10012,10 @@
       "listeners": [],
       "styles": [],
       "slots": [
+        {
+          "name": "left-controls",
+          "docs": "Controls displayed on the left side of the default ones"
+        },
         {
           "name": "slot",
           "docs": "The dialog content"

package/dist/cjs/file-manager.cjs.entry.js

@@ -62,7 +62,7 @@ const FileManager = class {
             onClick: () => this.selectItem(item) }, "type" in item ? (index.h("swirl-icon-file", { slot: "media" })) : (index.h("swirl-icon-folder-shared", { slot: "media" })))))) : (index.h("swirl-box", { padding: "16" }, index.h("swirl-text", { color: "subdued", weight: "medium" }, "This directory is empty.")));
     }
     render() {
-        return (index.h(index.Host, { key: 'f07f71a8482ef4aa1014acac792c87aa95065889' }, index.h("swirl-app-layout", { key: '071087d9402d0e8d36ff31dd5df600f0acf9f79a', appName: "Documents", backToNavigationViewButtonLabel: "Back to documents list", ctaIcon: "<swirl-icon-add></swirl-icon-add>", ctaLabel: "Upload file", navigationLabel: "Documents", onNavigationBackButtonClick: this.resetSelectedDirectory, ref: (el) => (this.layout = el), sidebarCloseButtonLabel: "Close file info", sidebarHeading: "File info", showNavigationBackButton: Boolean(this.selectedDirectory), transitionStyle: "dialog" }, index.h("swirl-resource-list", { key: 'ab306f991325be61eefd3c2c1a7a7f606fed46e6', label: "Documents", slot: "navigation" }, this.renderNavigation()), index.h("swirl-popover-trigger", { key: 'dbcc751b460b5c6d0e00e52e099214b94cc0ba99', swirlPopover: this.sortMenu, slot: "navigation-controls" }, index.h("swirl-button", { key: 'f02622174bd02ce62cc78426ba13d39a52b40fb9', label: "Sort items" })), index.h("swirl-stack", { key: '07b9eda2c15ee9b5e23ebdecb47c21805ada3508', orientation: "horizontal", slot: "app-bar" }, index.h("swirl-stack", { key: '7be067deffc92e3d4efadca7c35c7ce97763bfee' }, index.h("swirl-heading", { key: '89e7cfd1432000f74b62fd7dc35e9202b7b8647f', as: "h2", level: 4, text: this.selectedFile?.name }), index.h("swirl-text", { key: 'c450212a5f9aeb3b0b399297ad72cbe86c8798f5', color: "subdued", truncate: true }, this.selectedFile?.description))), Boolean(this.selectedFile) ? (index.h("swirl-file-viewer", { file: this.selectedFile.url, slot: "content", type: this.selectedFile.type })) : (index.h("swirl-box", { cover: true, centerBlock: true, centerInline: true, padding: "16", slot: "content" }, index.h("swirl-empty-state", { heading: "Nothing to see here.", illustration: "/images/empty-state-1.svg" }, "Please select a file from the list."))), index.h("div", { key: '6b347770944a0f6e58bbbf5dd6dde1170179a153', slot: "app-bar-controls" }, this.selectedFile && (index.h("swirl-button", { key: '440fecb0f70b86d994fbf528d820d54eb7b0fa4e', "hide-label": true, class: "info-button", icon: "<swirl-icon-info></swirl-icon-info>", label: "Open file info", onClick: this.toggleSidebar }))), index.h("swirl-box", { key: '0d5df914f57717ab125dee0bebcc09484925c54a', padding: "16", slot: "sidebar" }, index.h("swirl-text", { key: '69c9e14adbfccd08373af6ec4d9c1caf79f54c83', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), index.h("swirl-popover", { key: '3132c5582663180abe622ba001d561e2e3b642b7', label: "Sort items", ref: (el) => (this.sortMenu = el) }, index.h("swirl-option-list", { key: 'eb7edd7cf4941eb80fdd988958c394bcee716a9b', value: ["ascending"] }, index.h("swirl-option-list-item", { key: '5af8b499e3bb16214a62f9c888307242d43a4404', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), index.h("swirl-option-list-item", { key: 'adbf0e0110bfc8597e88f6750b75ef483712997b', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), index.h("swirl-option-list-item", { key: '5eb660a5d4e438c8181073c9f297eab59912a14c', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
+        return (index.h(index.Host, { key: 'a646901e811c2b01e8c26d08dcd7eacee52f8716' }, index.h("swirl-app-layout", { key: '9749db15091be64d25eac767ea762fc67bc8e40d', appName: "Documents", backToNavigationViewButtonLabel: "Back to documents list", ctaIcon: "<swirl-icon-add></swirl-icon-add>", ctaLabel: "Upload file", navigationLabel: "Documents", onNavigationBackButtonClick: this.resetSelectedDirectory, ref: (el) => (this.layout = el), sidebarCloseButtonLabel: "Close file info", sidebarHeading: "File info", showNavigationBackButton: Boolean(this.selectedDirectory), transitionStyle: "dialog" }, index.h("swirl-resource-list", { key: '121e13b98f9040e4603f90d2144f614ad061c290', label: "Documents", slot: "navigation" }, this.renderNavigation()), index.h("swirl-popover-trigger", { key: '432a46a472b8e74bb2b4ba7996157742a40f68f8', swirlPopover: this.sortMenu, slot: "navigation-controls" }, index.h("swirl-button", { key: '229e5cfedaeb8e02e0646ae8a17e5e2a9b06011a', label: "Sort items" })), index.h("swirl-stack", { key: 'ca4b984d0ea43322377a1792ca8af7e69f3b398b', orientation: "horizontal", slot: "app-bar" }, index.h("swirl-stack", { key: '83f2d8c2062a7e9b342c6201cb8df84fde83c128' }, index.h("swirl-heading", { key: '909d0eba1bb47de0d4fb00eeb9945f54310b7490', as: "h2", level: 4, text: this.selectedFile?.name }), index.h("swirl-text", { key: 'a2624b5a8cd2f35f0ff4cf37854c2027df80407a', color: "subdued", truncate: true }, this.selectedFile?.description))), Boolean(this.selectedFile) ? (index.h("swirl-file-viewer", { file: this.selectedFile.url, slot: "content", type: this.selectedFile.type })) : (index.h("swirl-box", { cover: true, centerBlock: true, centerInline: true, padding: "16", slot: "content" }, index.h("swirl-empty-state", { heading: "Nothing to see here.", illustration: "/images/empty-state-1.svg" }, "Please select a file from the list."))), index.h("div", { key: '49432c3fd1a329549893045a8e4e4bd23815e2ec', slot: "app-bar-controls" }, this.selectedFile && (index.h("swirl-button", { key: '7be0a44b5a0c6b775018274409a900fb0a6ffd9d', "hide-label": true, class: "info-button", icon: "<swirl-icon-info></swirl-icon-info>", label: "Open file info", onClick: this.toggleSidebar }))), index.h("swirl-box", { key: '17af77fa485f3f5cd26762504aa16b67989c203a', padding: "16", slot: "sidebar" }, index.h("swirl-text", { key: 'fddf7dac1114dd8cd2b87fe703457b88cc3b1dfb', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), index.h("swirl-popover", { key: '328ec24bbae951e40a6be30ad74544db279ae6d4', label: "Sort items", ref: (el) => (this.sortMenu = el) }, index.h("swirl-option-list", { key: '947be717cf392facad72e8c68015c827127a818f', value: ["ascending"] }, index.h("swirl-option-list-item", { key: '037a85c211cedfb0a07c818bec2863f645cff3e9', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), index.h("swirl-option-list-item", { key: '4a09b62c61e718a4138e1d50a18e1788aee774f1', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), index.h("swirl-option-list-item", { key: '9d985f191349675473aea0b50ca7f6db3e9175f9', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
     }
 };
 

package/dist/cjs/swirl-accordion-item.cjs.entry.js

@@ -68,7 +68,7 @@ const SwirlAccordionItem = class {
         const className = index$1.classnames("accordion-item", {
             "accordion-item--expanded": this.expanded,
         });
-        return (index.h(index.Host, { key: '9912336775c2532382821b2209a1b48a65e6e865' }, index.h("div", { key: 'ca62514d43014590acf4521c0f751b8c5d2183d1', class: className }, index.h(HeadingTag, { key: 'bd5b6f13cf2740ebc5d1f9fb59d24f61467812ba', class: "accordion-item__heading" }, index.h("button", { key: '1bbd759b89d5cedf399cc20d3e24511330ccbe20', "aria-controls": this.itemId, "aria-expanded": String(this.expanded), class: "accordion-item__toggle", disabled: this.disabled, id: this.headingId, onClick: this.onHeadingClick, type: "button" }, index.h("span", { key: '826e0bfabe1fbdf988555d90e6da0afb6ebb4e3f', class: "accordion-item__toggle-text" }, this.heading, this.description && (index.h("swirl-text", { key: '8e218b1786d3261625a9bac0f90a0aef15f2b5a2', as: "span", color: "subdued", size: "sm" }, this.description))), index.h("span", { key: 'ea9fe7c19affc28d1dcea431e33ae72763d0b767', class: "accordion-item__icon" }, !this.expanded && (index.h("swirl-icon", { key: '2adc3f65e44c9ab9b70dcfeeea9568d91a4cc52b', glyph: "chevron-right", size: 20 })), this.expanded && (index.h("swirl-icon", { key: '2031e4e7b9b08a428eb4f406287dabef4d85889f', glyph: "expand-more", size: 20 }))))), index.h("div", { key: '6086716993b5702405478f45e7259bc8d52ee6f9', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, index.h("slot", { key: '75efb121a31901fefb57f72830e3123d526273b6' })))));
+        return (index.h(index.Host, { key: '027eca8e100997e077b0768d158dd4f0199c3033' }, index.h("div", { key: 'e2afc1887d9b70646a8a1b8b0e382af2d3aa5ccd', class: className }, index.h(HeadingTag, { key: 'efc5b14c99373524b68672fa8fd268de2afe0fba', class: "accordion-item__heading" }, index.h("button", { key: '1e21c2b4d8d3612cdddd3c2c4f3bdaccab6e394b', "aria-controls": this.itemId, "aria-expanded": String(this.expanded), class: "accordion-item__toggle", disabled: this.disabled, id: this.headingId, onClick: this.onHeadingClick, type: "button" }, index.h("span", { key: 'fcd513558a99a04636114c7677f4bd5c7c2d0f91', class: "accordion-item__toggle-text" }, this.heading, this.description && (index.h("swirl-text", { key: 'fc6eea82d94fd6656d106d7f2ebe5089eae63628', as: "span", color: "subdued", size: "sm" }, this.description))), index.h("span", { key: '150db63ec08beb59d0daee7d3c09b6d85b7428d7', class: "accordion-item__icon" }, !this.expanded && (index.h("swirl-icon", { key: '9f99cde2bf92897c754a20328e534f70c999c683', glyph: "chevron-right", size: 20 })), this.expanded && (index.h("swirl-icon", { key: '3ff127641a8494ccf728b52be3dcc2fdf6949a7f', glyph: "expand-more", size: 20 }))))), index.h("div", { key: '9e2431b5f68d49b734586e1d261a97d9092ea3f4', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, index.h("slot", { key: '5ba670d8e1484bae528f51ede23f21350c113d17' })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -48,7 +48,7 @@ const SwirlAccordion = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: 'a127e248e3fceab33f9b5cd71726e589884f8c08' }, index.h("slot", { key: '6186c8608fe321f2d7ccbe412d03aebf0c67b366' })));
+        return (index.h(index.Host, { key: 'd79f39615c4a806c565258eb9875d1272a90fb02' }, index.h("slot", { key: '18be93ceeeb76245dcf92061ac969a7b49bd37ff' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-action-list-section.cjs.entry.js

@@ -16,7 +16,7 @@ const SwirlActionListSection = class {
         this.hasSeparator = false;
     }
     render() {
-        return (index.h(index.Host, { key: '45209a11f46a6ba497b4c3d461ba3781cb0d57a8' }, this.hasSeparator && (index.h("swirl-separator", { key: '937e89a08f4697ddbcaccb1343b3355cb73227bf', spacing: this.separatorSpacing })), index.h("div", { key: 'ccddbc647093e14a09c62e3dedc55069b6c57114', "aria-labelledby": "label", class: "action-list-section", role: "group" }, index.h("span", { key: 'e80da46246f9e3ead338d4b64af8ae9aa9387f01', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), index.h("swirl-stack", { key: '8b6a8493e5b09d0c98b744592d4e422c9206bfeb', spacing: this.spacing, align: "stretch" }, index.h("slot", { key: 'e02a428d84f4afabb1a66c32f4ce04775724d87e' })))));
+        return (index.h(index.Host, { key: 'd86ace949877affd32ca7cab4e3f0d4531fcc16a' }, this.hasSeparator && (index.h("swirl-separator", { key: '8c63131c65b9757bc82c893c9733731d401998f2', spacing: this.separatorSpacing })), index.h("div", { key: 'd3b093965aa160b2596998739bf74fc9e9423d96', "aria-labelledby": "label", class: "action-list-section", role: "group" }, index.h("span", { key: 'b3453329dd293d766f1613d822a33f9e7392e6eb', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), index.h("swirl-stack", { key: 'd32adcf0bca646ecd736857c1ed27faf7c13d6d5', spacing: this.spacing, align: "stretch" }, index.h("slot", { key: 'a0ff52ae37648692d6b6890cc5e781f084df9fd7' })))));
     }
 };
 SwirlActionListSection.style = SwirlActionListSectionStyle0;

package/dist/cjs/swirl-action-list_2.cjs.entry.js

@@ -97,7 +97,7 @@ const SwirlActionList = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '37339869bab4a9aa81791f84d38451de0104d168' }, index.h("div", { key: '21d32faabb06850785a904a275da30862f98ca13', "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" }, index.h("slot", { key: '872037b1cca2d5a76f5a63353d8489d5e329611a', onSlotchange: this.setSectionSeparator }))));
+        return (index.h(index.Host, { key: 'cb793b95fbadce7885f9ffd2df7a86e1d11ba687' }, index.h("div", { key: '7c2d0453c968ffb4280db7c1f15849795a19f9f5', "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" }, index.h("slot", { key: 'afc7aa5790d37dc0e660aae4289c91745d849d1c', onSlotchange: this.setSectionSeparator }))));
     }
     get el() { return index.getElement(this); }
 };
@@ -127,7 +127,7 @@ const SwirlActionListItem = class {
     }
     componentDidLoad() {
         this.forceIconProps(this.desktopMediaQuery.matches);
-        this.desktopMediaQuery.onchange = this.desktopMediaQueryHandler;
+        this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
     }
     componentDidRender() {
         this.forceIconProps(this.desktopMediaQuery.matches);
@@ -152,7 +152,7 @@ const SwirlActionListItem = class {
         const showSuffixSlot = Boolean(this.el.querySelector('[slot="suffix"]'));
         const showSuffix = (Boolean(this.suffix) || showSuffixSlot) && !this.disabled;
         const className = index$1.classnames("action-list-item", `action-list-item--intent-${this.intent}`, `action-list-item--size-${this.size}`);
-        return (index.h(index.Host, { key: '7b4f52c16da4f4f5c2c9a51856c9aae7e9c04f23' }, index.h("button", { key: 'a74a9c60edc2a183c04f93e9030554c551ceba67', "aria-expanded": this.swirlAriaExpanded, "aria-haspopup": this.swirlAriaHaspopup, class: className, disabled: this.disabled, part: "action-list-item", role: "menuitem", tabIndex: -1, type: "button" }, index.h("slot", { key: '9bb61a72d80c55a35e0dc3c809d8bebb7ff30437', name: "avatar" }), this.icon && (index.h("span", { key: 'ba49170992a1dc9e6d8b68e64af781273bf4b7e8', class: "action-list-item__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) }, showIconBadge && (index.h("span", { key: '3284724f84d3d6e018f244cde0a7ddc233f7459d', class: "action-list-item__icon-badge", innerHTML: this.iconBadge, ref: (el) => (this.iconBadgeEl = el) })))), index.h("span", { key: '2084ba440fee7881921d10781ab0100c8aef26d6', class: "action-list-item__label-container" }, index.h("span", { key: '81d4f0652172c6e468b7a6d5c2381d05905d5e22', class: "action-list-item__label" }, this.label), this.description && (index.h("span", { key: 'f09d273290bfc00630c592ed45013b565845eb5a', class: "action-list-item__description" }, this.description))), showBadge && (index.h("span", { key: '06cfa9c3a1af2b53a472b472529267549b4926de', class: "action-list-item__badge", innerHTML: this.badge })), showSuffix && (index.h("span", { key: '7ab7dd54bb3f1e2c9cac00dbf98775e18f66ab98', class: "action-list-item__suffix", innerHTML: !showSuffixSlot ? this.suffix : undefined, ref: (el) => (this.suffixEl = el) }, index.h("slot", { key: 'f2bd1ae7bf49c5e22757dbdb23fada915ab13e2a', name: "suffix" }))))));
+        return (index.h(index.Host, { key: 'cf72c77a7238b89ac5737fbd26a4f9c5fb8d2aaf' }, index.h("button", { key: 'b883df9fba48c6f1e3fa18cb2acbddcb1c4f7903', "aria-expanded": this.swirlAriaExpanded, "aria-haspopup": this.swirlAriaHaspopup, class: className, disabled: this.disabled, part: "action-list-item", role: "menuitem", tabIndex: -1, type: "button" }, index.h("slot", { key: '2903ffa6a0b97a9d1f30a3ab485a5f4625016893', name: "avatar" }), this.icon && (index.h("span", { key: '687e8b468e26a239a45829f5448e3f4fae991a18', class: "action-list-item__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) }, showIconBadge && (index.h("span", { key: 'db6fa0aa9ee28b495febd9278f464add1d195295', class: "action-list-item__icon-badge", innerHTML: this.iconBadge, ref: (el) => (this.iconBadgeEl = el) })))), index.h("span", { key: 'd64137da6c8345faf3fb14f6963b267e2bc83f91', class: "action-list-item__label-container" }, index.h("span", { key: 'a7e623ccfdaef36bd426f4e0121337926a04132c', class: "action-list-item__label" }, this.label), this.description && (index.h("span", { key: 'eae257be5f0974019afdd7a1517c2efed55d397c', class: "action-list-item__description" }, this.description))), showBadge && (index.h("span", { key: 'f6837cf900a859145f4360ec9d407ea51659c0f0', class: "action-list-item__badge", innerHTML: this.badge })), showSuffix && (index.h("span", { key: '4aa5cd117be445a278cefcd6c7ffaea2e72a642e', class: "action-list-item__suffix", innerHTML: !showSuffixSlot ? this.suffix : undefined, ref: (el) => (this.suffixEl = el) }, index.h("slot", { key: 'c496345eea881fc5d6742710a053aa45cd4d94e6', name: "suffix" }))))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-app-icon.cjs.entry.js

@@ -29,7 +29,7 @@ const SwirlAppIcon = class {
         const className = index$1.classnames("app-icon", {
             "app-icon--has-icon": showIcon || showFallbackIcon,
         });
-        return (index.h(index.Host, { key: 'ce5423e05738bc7881dd6f9d678bdb1092a34165' }, index.h("span", { key: '6cc990326010d117bf9bdbc3087e5f82de856c76', class: className }, showImage && (index.h("img", { key: '474e88894b36fbd2e934b4613b474b87768f3c40', alt: "", height: "256", onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: "256" })), showIcon && (index.h("span", { key: 'c4bc17d99f83fcb30b971b0084e33d3bc9199970', class: "app-icon__icon", innerHTML: this.icon })))));
+        return (index.h(index.Host, { key: '18668b1b36052a50087ca49a711fa39dd23ed647' }, index.h("span", { key: '2e62fb4176cbc9029370c9ade98d85973a53595c', class: className }, showImage && (index.h("img", { key: '50c4908d815251a971731721e7aafdb3a7080962', alt: "", height: "256", onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: "256" })), showIcon && (index.h("span", { key: '6650b12d71a7ddd6b255513192f1c632aca7845e', class: "app-icon__icon", innerHTML: this.icon })))));
     }
 };
 SwirlAppIcon.style = SwirlAppIconStyle0;

package/dist/cjs/swirl-app-layout_5.cjs.entry.js

@@ -115,7 +115,7 @@ const SwirlAppLayout = class {
         });
     }
     componentDidLoad() {
-        this.desktopMediaQuery.onchange = this.desktopMediaQueryHandler;
+        this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
         queueMicrotask(() => {
             this.isDesktop = this.desktopMediaQuery.matches;
             this.restoreNavExpansionState();
@@ -351,14 +351,14 @@ const SwirlAppLayout = class {
             "app-layout--sidebar-scrollable": this.sidebarScrollState.scrollable,
             "app-layout--sidebar-scrolled-to-top": this.sidebarScrollState.scrolledToTop,
         });
-        return (index.h(index.Host, { key: 'bd1757d198f8e629b2e9754b47c30ebe5dc419a9' }, index.h("section", { key: '28b25940f98881967f1b39fabec35a839751159c', "aria-labelledby": "app-name", class: className }, index.h("div", { key: '52a19dc00ab90f4d0b774f84501e3eece9b4f42e', class: "app-layout__grid" }, index.h("header", { key: '820a3e03ad0c622e73df292141e78ffc5196f968', class: "app-layout__header", ref: (el) => (this.headerEl = el) }, index.h("span", { key: 'b3706641288a68f18319f0e4e5ba3ef47d6f398c', class: "app-layout__navigation-mobile-menu-button" }, index.h("slot", { key: 'e5cacf0ebf353dd1760ef0b7dc124b0160554b12', name: "navigation-mobile-menu-button" })), this.collapsibleNavigation && (index.h("span", { key: '1e5e367858b4ae2ff731d96c9274c2dc580f47aa', class: "app-layout__nav-overlay-toggle" }, index.h("swirl-button", { key: '50d53650575d35d0fa744371e4b1b66b8c34632f', hideLabel: true, icon: this.navExpansionState !== "expanded"
+        return (index.h(index.Host, { key: 'e9ce1a534b9acff55e07b798afb306e07a619a81' }, index.h("section", { key: '4d328d6707d7dff74ad9c6016af1ada8f1384e28', "aria-labelledby": "app-name", class: className }, index.h("div", { key: '2b7e59a9abf6c8d1379136e1446ce7e708974f43', class: "app-layout__grid" }, index.h("header", { key: 'e3e8a94655fa12bc7daa7b9ae984217654d5d8d0', class: "app-layout__header", ref: (el) => (this.headerEl = el) }, index.h("span", { key: '4842de5ed8cb9d055f75426f09d4c4221ce3248c', class: "app-layout__navigation-mobile-menu-button" }, index.h("slot", { key: '24607acca33855b93dba77e0cab7b43cc19dbf6f', name: "navigation-mobile-menu-button" })), this.collapsibleNavigation && (index.h("span", { key: 'b5e0b5c1ab49c9a77de1e6d8c9157cf907a5d331', class: "app-layout__nav-overlay-toggle" }, index.h("swirl-button", { key: 'de84a867b3b81da15a8a1a91feaf3d555b05d830', hideLabel: true, icon: this.navExpansionState !== "expanded"
                 ? "<swirl-icon-dock-left-expand></swirl-icon-dock-left-expand>"
-                : "<swirl-icon-dock-left-collapse></swirl-icon-dock-left-collapse>", label: this.navigationToggleLabel, onClick: this.toggleNavigation }))), this.showNavigationBackButton && (index.h("span", { key: 'c7ee551266b168aac662963dba75667cf201a48e', class: "app-layout__navigation-back-button" }, index.h("swirl-button", { key: '448cbde3919cdd986b7b49933d6afa8e96646db6', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.navigationBackButtonLabel, onClick: this.onNavigationBackButtonClick }))), index.h("swirl-heading", { key: '3c467742d3c0f80fe5aa56987c868a3b4e253988', as: "h1", class: "app-layout__app-name", headingId: "app-name", level: 3, text: this.appName }), navigationActive && (index.h("span", { key: '80c04d971369df12490ae87d86664622aeb601b7', class: "app-layout__navigation-controls" }, index.h("slot", { key: '8e732928e682abe5eef49fc22614907f0fec0a91', name: "navigation-controls" })))), index.h("nav", { key: '71c3dc8235d56ce5c9cbfa5b701e020a735d6a22', "aria-label": this.navigationLabel, class: "app-layout__navigation", onScroll: this.onNavScroll, ref: (el) => (this.navEl = el), inert: this.isDesktop &&
+                : "<swirl-icon-dock-left-collapse></swirl-icon-dock-left-collapse>", label: this.navigationToggleLabel, onClick: this.toggleNavigation }))), this.showNavigationBackButton && (index.h("span", { key: '7a146162ce324567d3bd9ac1e94fb4270e841491', class: "app-layout__navigation-back-button" }, index.h("swirl-button", { key: '01e4e8588d68a858b3199883255a4de4a5890bf3', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.navigationBackButtonLabel, onClick: this.onNavigationBackButtonClick }))), index.h("swirl-heading", { key: '89125641f790dfc3134265a212768b6aa8f17f25', as: "h1", class: "app-layout__app-name", headingId: "app-name", level: 3, text: this.appName }), navigationActive && (index.h("span", { key: '695f0de46afd902d3d69bd85d74ef9915a5a9c75', class: "app-layout__navigation-controls" }, index.h("slot", { key: '2f239735632860d0edfe5fb967bac05b21f14452', name: "navigation-controls" })))), index.h("nav", { key: '3bc5df6af2555a12164b8695f2b1b637ec2d086d', "aria-label": this.navigationLabel, class: "app-layout__navigation", onScroll: this.onNavScroll, ref: (el) => (this.navEl = el), inert: this.isDesktop &&
                 this.collapsibleNavigation &&
-                this.navExpansionState === "collapsed" }, index.h("slot", { key: 'f6a8b3b5bf48ca9a00017f907c7e1e4c245a129e', name: "navigation" })), index.h("section", { key: 'e44e1e6b08465e000378c80339b11680a1a8e725', "aria-labelledby": "app-name", class: "app-layout__body" }, !this.hideAppBar && (index.h("header", { key: '3e0019dd933bc095980a871010a8723ebf95c89d', class: "app-layout__app-bar" }, index.h("span", { key: '1d2437a685cbba57563aa942c6dea4f5dc7ad728', class: "app-layout__app-bar-mobile-menu-button" }, index.h("slot", { key: 'a6f8147d45b2cc9aa877cb549f2e52e47a02975b', name: "app-bar-mobile-menu-button" })), showBackToNavigationButton && (index.h("span", { key: '7678ad0057afab1ec8845940271a5e19d659c976', class: "app-layout__back-to-navigation-button" }, index.h("swirl-button", { key: '920ad1ff5b75f93179c4bf07ab56f3d042dd58ba', hideLabel: true, icon: this.transitionStyle === "dialog"
+                this.navExpansionState === "collapsed" }, index.h("slot", { key: 'd5e1ac3dc3187e1b4761b83d66d4fa98c7c4e3b4', name: "navigation" })), index.h("section", { key: '422313cc9de344ef4b66a37f0f69b709b6f71687', "aria-labelledby": "app-name", class: "app-layout__body" }, !this.hideAppBar && (index.h("header", { key: '46ea9b5669da12d8e78151977dc55b1e197e8dcb', class: "app-layout__app-bar" }, index.h("span", { key: 'b35d5938aadcdffa64b8927c096bb3f5b87fa349', class: "app-layout__app-bar-mobile-menu-button" }, index.h("slot", { key: '2be2762f6d1cfdf8f569006557b5c51b8fc28b36', name: "app-bar-mobile-menu-button" })), showBackToNavigationButton && (index.h("span", { key: 'edfb91e719c8b77c73e945ca138f334fca56540b', class: "app-layout__back-to-navigation-button" }, index.h("swirl-button", { key: 'e8cc48db20975a04dd63a8dc86c39b86bbb5630f', hideLabel: true, icon: this.transitionStyle === "dialog"
                 ? "<swirl-icon-close></swirl-icon-close>"
                 : "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backToNavigationViewButtonLabel, onClick: this.onBackToNavigationViewButtonClick }))), this.collapsibleNavigation &&
-            this.navExpansionState !== "expanded" && (index.h("span", { key: '4356a054ba73b43ab719983f5e28f08618187c87', class: "app-layout__nav-expansion-toggle" }, index.h("swirl-button", { key: '0dcc0b5175f72e651e9ba8fc54343bb8b10f044b', hideLabel: true, icon: "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", label: this.navigationOverlayLabel, onClick: this.overlayNavigation }))), index.h("span", { key: 'c409377d66e5d9653c3a4edacd00a7d1c36d41d8', class: "app-layout__custom-app-bar-back-button" }, index.h("slot", { key: '19f1249cca6eb3d297c1bfb5c1237adf0563615d', name: "custom-app-bar-back-button" })), index.h("div", { key: '4d8ffb803fd1d60aeedc3abb27c2b587126b0809', class: "app-layout__app-bar-content" }, index.h("slot", { key: 'aa9769d6902c0dcea2873ed874d9efd39bcfdccb', name: "app-bar" })), index.h("div", { key: '87956c0906c878a60ba38a32ddd84b62e64c341d', class: "app-layout__app-bar-controls" }, index.h("slot", { key: 'de90973e95f87d557659269036fe3ba2ff841514', name: "app-bar-controls" })))), index.h("div", { key: '9092cbe26316ae42d16271d12ca0e22dba5f1d2d', class: "app-layout__banner" }, index.h("slot", { key: '442bba275cb42942e1f0910d9c02dda2a9af682f', name: "banner" })), index.h("div", { key: '924a188b2bbe99a0e75c70f1c7f5625995f1a099', class: "app-layout__content", onScroll: this.onContentScroll, ref: (el) => (this.contentEl = el) }, index.h("slot", { key: '94d6c1a191484f78595cc39eab5ff8229603d75d', name: "content" })), index.h("div", { key: '7c6aea10fad5a2852e7dd7c1faf2537e561ca7f7', class: "app-layout__bottom-bar" }, index.h("slot", { key: '425f8d91ec4c6970224cb8384ffa40c5f3242bec', name: "bottom-bar" }))), index.h("aside", { key: '7849759ec39060fa137dba9b466211568cd0746a', class: "app-layout__sidebar" }, index.h("header", { key: 'aaa9d7aaf245afee95d5b10bbe6cdd0fc3b0467f', class: "app-layout__custom-sidebar-header" }, index.h("slot", { key: '9d215a803a91fe07e6f819a19ee44ff87e279fe4', name: "custom-sidebar-header" })), index.h("header", { key: '4c148f600be258693004721d74cfeacce295a54b', class: "app-layout__sidebar-header" }, index.h("swirl-button", { key: 'f4b0155f52a24d448fe3215d765bd5c6984f100e', class: "app-layout__sidebar-close-button", hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick }), index.h("swirl-heading", { key: '69992a92cd4ec148de847b7235ec35b50d28beae', as: "h3", class: "app-layout__sidebar-heading", headingId: "sidebar-heading", level: 3, text: this.sidebarHeading })), index.h("div", { key: 'efba1faaebfc7fe100b0d53a1c5a5de79f5b7a29', class: "app-layout__sidebar-content", onScroll: this.onSidebarScroll, ref: (el) => (this.sidebarEl = el) }, index.h("slot", { key: 'f297a2f2db5bdafd7a88d7fea6fec50b8bac8e75', name: "sidebar" }))), index.h("span", { key: '4e87773e33eacaa27710a018e9f07803dc267ae9', class: "app-layout__floating-action-button" }, this.ctaLabel && (index.h("swirl-button", { key: '704b7695fd2ece0c20f971f158e04cec95ffdb4f', hideLabel: Boolean(this.ctaIcon), icon: this.ctaIcon, intent: "primary", label: this.ctaLabel, onClick: this.onCtaClick, variant: "floating" })), index.h("slot", { key: 'a4c4bcfb8f498c7c6b878016ca84a29c7443c3d1', name: "floating-action-button" }))))));
+            this.navExpansionState !== "expanded" && (index.h("span", { key: '8c96a9e2f67470bd86c72d66272306901585d81e', class: "app-layout__nav-expansion-toggle" }, index.h("swirl-button", { key: '36b26a023643f6fc3f43d2df344583004ee60b78', hideLabel: true, icon: "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", label: this.navigationOverlayLabel, onClick: this.overlayNavigation }))), index.h("span", { key: 'b005af6a600db164a8251478d8d6f0b63dad6d48', class: "app-layout__custom-app-bar-back-button" }, index.h("slot", { key: '829e1e1145543dbb9658566051e69d28095ed4ee', name: "custom-app-bar-back-button" })), index.h("div", { key: 'e25d3fe097657c6ce637d075d7f886faebb8dcde', class: "app-layout__app-bar-content" }, index.h("slot", { key: '7913c7ce6ca420a4ea5c6640e57e8718c5b8cdc5', name: "app-bar" })), index.h("div", { key: '5f6df0102cebfcaaa4e2bde25e218e6a506c81ca', class: "app-layout__app-bar-controls" }, index.h("slot", { key: 'b4b19bf2bb4a51732f9ea647758b42721169aa5e', name: "app-bar-controls" })))), index.h("div", { key: 'a1cbbdffab4675813ee104abcdcf5722ad33242e', class: "app-layout__banner" }, index.h("slot", { key: '0fc317305b8d94dc2670f2731ab7ac841ddad69e', name: "banner" })), index.h("div", { key: '6c434829a6c78aeaea9f084735122d685b1ca636', class: "app-layout__content", onScroll: this.onContentScroll, ref: (el) => (this.contentEl = el) }, index.h("slot", { key: '5ab35d69d738ac114725661f296f89624ce5aa21', name: "content" })), index.h("div", { key: '14a299ef135a30d6f8975db14bdb668e79c39b7b', class: "app-layout__bottom-bar" }, index.h("slot", { key: 'b6f039e3ca95a896c38bfa97943b46f21d0688e4', name: "bottom-bar" }))), index.h("aside", { key: '403077f3384c185e97eb0205f11a932e4c1ad76c', class: "app-layout__sidebar" }, index.h("header", { key: 'a951e471e8363a025b4ba1ce377e7e1ef17d7e79', class: "app-layout__custom-sidebar-header" }, index.h("slot", { key: 'f6e9ca768e57b30b3faa072250fe9c0cba196b5c', name: "custom-sidebar-header" })), index.h("header", { key: '1ff00d0311949b3bdacb38ebef268a5b6e3aa00d', class: "app-layout__sidebar-header" }, index.h("swirl-button", { key: 'cc5a33cb40af30a16fdd9442fc34de516022c15d', class: "app-layout__sidebar-close-button", hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick }), index.h("swirl-heading", { key: '96241a517463e025991a2c376e450e5128086209', as: "h3", class: "app-layout__sidebar-heading", headingId: "sidebar-heading", level: 3, text: this.sidebarHeading })), index.h("div", { key: 'a0f11ec60312ab95b56ae4465f23cd0e60f8c3e9', class: "app-layout__sidebar-content", onScroll: this.onSidebarScroll, ref: (el) => (this.sidebarEl = el) }, index.h("slot", { key: 'ed6139ae751d7701098e441d9bde7faa10d6ea1c', name: "sidebar" }))), index.h("span", { key: 'ea00d4875343af4d76c96c3591931b342098c0e4', class: "app-layout__floating-action-button" }, this.ctaLabel && (index.h("swirl-button", { key: 'd29b393a6ac566bf7b3eac1b6080f7da67e25b7f', hideLabel: Boolean(this.ctaIcon), icon: this.ctaIcon, intent: "primary", label: this.ctaLabel, onClick: this.onCtaClick, variant: "floating" })), index.h("slot", { key: '7952de1a32de0b06d50911abcd9267ccb323e819', name: "floating-action-button" }))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -383,7 +383,7 @@ const SwirlEmptyState = class {
             "empty-state--has-controls": hasControls,
             "empty-state--has-slotted-illustration": hasSlottedIllustration,
         });
-        return (index.h(index.Host, { key: '9e213dd4e696e4ecf1c001b3301ebbaadadff252' }, index.h("div", { key: '2d493ef2259cbd9d430c977d325e89db233b6b96', class: className }, this.illustration && !hasSlottedIllustration && (index.h("img", { key: '53ee001b7e39e0fda7749ff22bea86f0e06238fe', alt: "", class: "empty-state__illustration", src: this.illustration })), index.h("div", { key: '0eca6481e481ae8b5009f118c3d56d47ace4378e', class: "empty-state__slotted-illustration" }, index.h("slot", { key: '9980c61b5a07d6d550e656b813416244c012834a', name: "illustration" })), index.h("div", { key: '4d198e8345bde588034bc599b9ca262fbe0bd55a', class: "empty-state__body" }, index.h("swirl-stack", { key: '3f0892232fe8d815e38e75531cc5429541d937aa', align: "stretch", spacing: "8" }, this.heading && (index.h("swirl-heading", { key: '16ef2c5ec259f51ea433612bc993402c3c67bbb1', align: "center", as: "p", level: 4, text: this.heading })), index.h("div", { key: 'e364422f96b1f5cefe9df95ba954afb16a2f641e', class: "empty-state__content" }, index.h("swirl-text", { key: '801038dd3a91e8a780c02faacbd1dd9300141492', align: "center", color: "subdued" }, index.h("slot", { key: '9569100a8699974ee8853d26639d4cd83fa261a2' })))), index.h("div", { key: '2f5387dcdf6298e61c996254d85c4180c5c9b488', class: "empty-state__controls" }, index.h("slot", { key: '636c14384a30c712ad1818534c900d77f98a5965', name: "controls" }))))));
+        return (index.h(index.Host, { key: '5fff5a5dacd531c360332c1c80f93a09981aef41' }, index.h("div", { key: '46e3dbe9f765a6b3024b7c2bbaa7111f728a4591', class: className }, this.illustration && !hasSlottedIllustration && (index.h("img", { key: '706db8fbff1927e1ad1502d1fcec13f6f5abfdda', alt: "", class: "empty-state__illustration", src: this.illustration })), index.h("div", { key: 'b9bcc134cfc77764c26c89aecb0a81d4f1667a1d', class: "empty-state__slotted-illustration" }, index.h("slot", { key: 'e4f68b7b5ff2bb714004eefc981b4967b40bfb1e', name: "illustration" })), index.h("div", { key: '3e49c1fa45a9eab36553c77b1405614eac58cfa3', class: "empty-state__body" }, index.h("swirl-stack", { key: 'd0b060f38e273a27c2925649850ac3b1246473ee', align: "stretch", spacing: "8" }, this.heading && (index.h("swirl-heading", { key: 'b437e9041f8aff7d191f8cfa52e05ab4c63d2e93', align: "center", as: "p", level: 4, text: this.heading })), index.h("div", { key: '62e0fa0b042ea72920a32a75b797c45a999a7f6d', class: "empty-state__content" }, index.h("swirl-text", { key: 'b8b759fbebb0bc88c737933dddc269cc4a7618e2', align: "center", color: "subdued" }, index.h("slot", { key: '3b5f25cf981bb54a033b0faec7bc84cf8e190151' })))), index.h("div", { key: 'f9f40812af3f2eb58725f994ba5f967c971dda1c', class: "empty-state__controls" }, index.h("slot", { key: '2378cba88b0a0d41cbd14ff19b6f24ad0925c9bd', name: "controls" }))))));
     }
     get el() { return index.getElement(this); }
 };
@@ -404,7 +404,7 @@ const SwirlIconFolderShared = class {
             color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
         };
         const className = index$1.classnames("swirl-icon", `swirl-icon--size-${this.size}`);
-        return (index.h("svg", { key: '072b201e0760c96472bbeab332ed53ebdf0cae5b', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (index.h(index.Fragment, { key: '4fee992ecc4b118fc9c84ea8e2db735d7e28f796' }, index.h("path", { key: '74064db934f735f87e9063c3c22736c25739903c', d: "M9.99998 8.66669C10.3666 8.66669 10.6806 8.53602 10.942 8.27469C11.2029 8.0138 11.3333 7.70002 11.3333 7.33335C11.3333 6.96669 11.2029 6.65269 10.942 6.39135C10.6806 6.13046 10.3666 6.00002 9.99998 6.00002C9.63331 6.00002 9.31953 6.13046 9.05865 6.39135C8.79731 6.65269 8.66665 6.96669 8.66665 7.33335C8.66665 7.70002 8.79731 8.0138 9.05865 8.27469C9.31953 8.53602 9.63331 8.66669 9.99998 8.66669ZM7.33331 11.3334H12.6666V10.9667C12.6666 10.4667 12.4222 10.0694 11.9333 9.77469C11.4444 9.48046 10.8 9.33335 9.99998 9.33335C9.19998 9.33335 8.55553 9.48046 8.06665 9.77469C7.57776 10.0694 7.33331 10.4667 7.33331 10.9667V11.3334ZM2.66665 13.3334C2.29998 13.3334 1.9862 13.2029 1.72531 12.942C1.46398 12.6807 1.33331 12.3667 1.33331 12V4.00002C1.33331 3.63335 1.46398 3.31958 1.72531 3.05869C1.9862 2.79735 2.29998 2.66669 2.66665 2.66669H6.11665C6.29442 2.66669 6.46398 2.70002 6.62531 2.76669C6.7862 2.83335 6.92776 2.9278 7.04998 3.05002L7.99998 4.00002H13.3333C13.7 4.00002 14.014 4.13069 14.2753 4.39202C14.5362 4.65291 14.6666 4.96669 14.6666 5.33335V12C14.6666 12.3667 14.5362 12.6807 14.2753 12.942C14.014 13.2029 13.7 13.3334 13.3333 13.3334H2.66665ZM2.66665 4.00002V12H13.3333V5.33335H7.44998L6.11665 4.00002H2.66665Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (index.h(index.Fragment, { key: 'b7b7c3a000452e077ff35220d5f4bc1b6ef77505' }, index.h("path", { key: '447c96aece590053f70ee891271e8ffb37321ca6', d: "M15 13C15.55 13 16.021 12.804 16.413 12.412C16.8043 12.0207 17 11.55 17 11C17 10.45 16.8043 9.979 16.413 9.587C16.021 9.19567 15.55 9 15 9C14.45 9 13.9793 9.19567 13.588 9.587C13.196 9.979 13 10.45 13 11C13 11.55 13.196 12.0207 13.588 12.412C13.9793 12.804 14.45 13 15 13ZM11 17H19V16.45C19 15.7 18.6333 15.104 17.9 14.662C17.1667 14.2207 16.2 14 15 14C13.8 14 12.8333 14.2207 12.1 14.662C11.3667 15.104 11 15.7 11 16.45V17ZM4 20C3.45 20 2.97933 19.8043 2.588 19.413C2.196 19.021 2 18.55 2 18V6C2 5.45 2.196 4.97933 2.588 4.588C2.97933 4.196 3.45 4 4 4H9.175C9.44167 4 9.696 4.05 9.938 4.15C10.1793 4.25 10.3917 4.39167 10.575 4.575L12 6H20C20.55 6 21.021 6.196 21.413 6.588C21.8043 6.97933 22 7.45 22 8V18C22 18.55 21.8043 19.021 21.413 19.413C21.021 19.8043 20.55 20 20 20H4ZM4 6V18H20V8H11.175L9.175 6H4Z", fill: "currentColor" }))), this.size === 28 && (index.h(index.Fragment, { key: 'e3d56b1ae2c76ba37968b4b64bfb79d97b763ec4' }, index.h("path", { key: '740a6238f1587681319fdd5c39b0eef9ca5e8e27', d: "M17.5 15.1667C18.1416 15.1667 18.6911 14.938 19.1485 14.4807C19.605 14.0241 19.8333 13.475 19.8333 12.8334C19.8333 12.1917 19.605 11.6422 19.1485 11.1849C18.6911 10.7283 18.1416 10.5 17.5 10.5C16.8583 10.5 16.3092 10.7283 15.8526 11.1849C15.3953 11.6422 15.1666 12.1917 15.1666 12.8334C15.1666 13.475 15.3953 14.0241 15.8526 14.4807C16.3092 14.938 16.8583 15.1667 17.5 15.1667ZM12.8333 19.8334H22.1666V19.1917C22.1666 18.3167 21.7389 17.6214 20.8833 17.1057C20.0278 16.5908 18.9 16.3334 17.5 16.3334C16.1 16.3334 14.9722 16.5908 14.1166 17.1057C13.2611 17.6214 12.8333 18.3167 12.8333 19.1917V19.8334ZM4.66665 23.3334C4.02498 23.3334 3.47587 23.1051 3.01931 22.6485C2.56198 22.1912 2.33331 21.6417 2.33331 21V7.00002C2.33331 6.35835 2.56198 5.80924 3.01931 5.35269C3.47587 4.89535 4.02498 4.66669 4.66665 4.66669H10.7041C11.0153 4.66669 11.312 4.72502 11.5943 4.84169C11.8759 4.95835 12.1236 5.12363 12.3375 5.33752L14 7.00002H23.3333C23.975 7.00002 24.5245 7.22869 24.9818 7.68602C25.4384 8.14258 25.6666 8.69169 25.6666 9.33335V21C25.6666 21.6417 25.4384 22.1912 24.9818 22.6485C24.5245 23.1051 23.975 23.3334 23.3333 23.3334H4.66665ZM4.66665 7.00002V21H23.3333V9.33335H13.0375L10.7041 7.00002H4.66665Z", fill: "currentColor" })))));
+        return (index.h("svg", { key: '0bd40f969808d78d8a456a16ebbf20d1a12582a7', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (index.h(index.Fragment, { key: '81db7c5d453652109e3787e93ed1b36b00008d52' }, index.h("path", { key: 'b73ba8be0b608840ece7f324db584b1f8aecb2d9', d: "M9.99998 8.66669C10.3666 8.66669 10.6806 8.53602 10.942 8.27469C11.2029 8.0138 11.3333 7.70002 11.3333 7.33335C11.3333 6.96669 11.2029 6.65269 10.942 6.39135C10.6806 6.13046 10.3666 6.00002 9.99998 6.00002C9.63331 6.00002 9.31953 6.13046 9.05865 6.39135C8.79731 6.65269 8.66665 6.96669 8.66665 7.33335C8.66665 7.70002 8.79731 8.0138 9.05865 8.27469C9.31953 8.53602 9.63331 8.66669 9.99998 8.66669ZM7.33331 11.3334H12.6666V10.9667C12.6666 10.4667 12.4222 10.0694 11.9333 9.77469C11.4444 9.48046 10.8 9.33335 9.99998 9.33335C9.19998 9.33335 8.55553 9.48046 8.06665 9.77469C7.57776 10.0694 7.33331 10.4667 7.33331 10.9667V11.3334ZM2.66665 13.3334C2.29998 13.3334 1.9862 13.2029 1.72531 12.942C1.46398 12.6807 1.33331 12.3667 1.33331 12V4.00002C1.33331 3.63335 1.46398 3.31958 1.72531 3.05869C1.9862 2.79735 2.29998 2.66669 2.66665 2.66669H6.11665C6.29442 2.66669 6.46398 2.70002 6.62531 2.76669C6.7862 2.83335 6.92776 2.9278 7.04998 3.05002L7.99998 4.00002H13.3333C13.7 4.00002 14.014 4.13069 14.2753 4.39202C14.5362 4.65291 14.6666 4.96669 14.6666 5.33335V12C14.6666 12.3667 14.5362 12.6807 14.2753 12.942C14.014 13.2029 13.7 13.3334 13.3333 13.3334H2.66665ZM2.66665 4.00002V12H13.3333V5.33335H7.44998L6.11665 4.00002H2.66665Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (index.h(index.Fragment, { key: '33db9f0e18e5402c1559da46c911c77d5271a861' }, index.h("path", { key: '4cf50f8aa344d6bc9ba575080dadc354bad7d7cf', d: "M15 13C15.55 13 16.021 12.804 16.413 12.412C16.8043 12.0207 17 11.55 17 11C17 10.45 16.8043 9.979 16.413 9.587C16.021 9.19567 15.55 9 15 9C14.45 9 13.9793 9.19567 13.588 9.587C13.196 9.979 13 10.45 13 11C13 11.55 13.196 12.0207 13.588 12.412C13.9793 12.804 14.45 13 15 13ZM11 17H19V16.45C19 15.7 18.6333 15.104 17.9 14.662C17.1667 14.2207 16.2 14 15 14C13.8 14 12.8333 14.2207 12.1 14.662C11.3667 15.104 11 15.7 11 16.45V17ZM4 20C3.45 20 2.97933 19.8043 2.588 19.413C2.196 19.021 2 18.55 2 18V6C2 5.45 2.196 4.97933 2.588 4.588C2.97933 4.196 3.45 4 4 4H9.175C9.44167 4 9.696 4.05 9.938 4.15C10.1793 4.25 10.3917 4.39167 10.575 4.575L12 6H20C20.55 6 21.021 6.196 21.413 6.588C21.8043 6.97933 22 7.45 22 8V18C22 18.55 21.8043 19.021 21.413 19.413C21.021 19.8043 20.55 20 20 20H4ZM4 6V18H20V8H11.175L9.175 6H4Z", fill: "currentColor" }))), this.size === 28 && (index.h(index.Fragment, { key: '85ad5994680b3c9f44e7ad5a2b3940beee3f1f3f' }, index.h("path", { key: 'bd92509bdf638a155bd423aa58a42df1fd6e605e', d: "M17.5 15.1667C18.1416 15.1667 18.6911 14.938 19.1485 14.4807C19.605 14.0241 19.8333 13.475 19.8333 12.8334C19.8333 12.1917 19.605 11.6422 19.1485 11.1849C18.6911 10.7283 18.1416 10.5 17.5 10.5C16.8583 10.5 16.3092 10.7283 15.8526 11.1849C15.3953 11.6422 15.1666 12.1917 15.1666 12.8334C15.1666 13.475 15.3953 14.0241 15.8526 14.4807C16.3092 14.938 16.8583 15.1667 17.5 15.1667ZM12.8333 19.8334H22.1666V19.1917C22.1666 18.3167 21.7389 17.6214 20.8833 17.1057C20.0278 16.5908 18.9 16.3334 17.5 16.3334C16.1 16.3334 14.9722 16.5908 14.1166 17.1057C13.2611 17.6214 12.8333 18.3167 12.8333 19.1917V19.8334ZM4.66665 23.3334C4.02498 23.3334 3.47587 23.1051 3.01931 22.6485C2.56198 22.1912 2.33331 21.6417 2.33331 21V7.00002C2.33331 6.35835 2.56198 5.80924 3.01931 5.35269C3.47587 4.89535 4.02498 4.66669 4.66665 4.66669H10.7041C11.0153 4.66669 11.312 4.72502 11.5943 4.84169C11.8759 4.95835 12.1236 5.12363 12.3375 5.33752L14 7.00002H23.3333C23.975 7.00002 24.5245 7.22869 24.9818 7.68602C25.4384 8.14258 25.6666 8.69169 25.6666 9.33335V21C25.6666 21.6417 25.4384 22.1912 24.9818 22.6485C24.5245 23.1051 23.975 23.3334 23.3333 23.3334H4.66665ZM4.66665 7.00002V21H23.3333V9.33335H13.0375L10.7041 7.00002H4.66665Z", fill: "currentColor" })))));
     }
 };
 SwirlIconFolderShared.style = SwirlIconFolderSharedStyle0;
@@ -662,7 +662,7 @@ const SwirlResourceList = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: 'f47fb82ffd2bedbc76c84eea6ef01a3894d502b4', onKeyDown: this.onKeyDown }, index.h("swirl-visually-hidden", { key: '1d0e981546bfdbc319e7985ce3976ff75c5ced25', role: "alert" }, this.assistiveText), index.h("swirl-box", { key: '9e2de6e3664dbb7b9977198da2c6846751792d9b', paddingInlineEnd: "8", paddingInlineStart: "8" }, index.h("swirl-stack", { key: '9ab85a95f3568f5235cb3352e3f6413649e898a3', "aria-label": this.label, class: "resource-list", id: this.listId, ref: (el) => (this.gridEl = el), role: "grid", spacing: this.spacing }, index.h("slot", { key: '967afc8cf9ff110f06254cd94ba45754fa478188' })))));
+        return (index.h(index.Host, { key: '88e5cdf18d6920b9d7f9fcdfd4990cc2116f78f1', onKeyDown: this.onKeyDown }, index.h("swirl-visually-hidden", { key: '2f0f2a8a27ada544bfce2e5b51b4e0435442a2ed', role: "alert" }, this.assistiveText), index.h("swirl-box", { key: 'd4f7419074775539a7915d1095e92a29adfd28f9', paddingInlineEnd: "8", paddingInlineStart: "8" }, index.h("swirl-stack", { key: 'fab52f716e0ad4399d2544d87eb6ec61e6667770', "aria-label": this.label, class: "resource-list", id: this.listId, ref: (el) => (this.gridEl = el), role: "grid", spacing: this.spacing }, index.h("slot", { key: 'fd1a8cb8db98333214bb87c1d5ea8358128de036' })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -744,7 +744,7 @@ const SwirlResourceListItem = class {
     componentDidLoad() {
         this.forceIconProps(this.desktopMediaQuery.matches);
         this.updateIconSize(this.desktopMediaQuery.matches);
-        this.desktopMediaQuery.onchange = this.desktopMediaQueryHandler;
+        this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
         this.makeControlUnfocusable();
         if (Boolean(this.menuTriggerId)) {
             console.warn('[Swirl] The "menu-trigger-id" prop of swirl-resource-list-item is deprecated and will be removed with the next major release. Please use the "control" slot to add a menu button instead. https://swirl-storybook.flip-app.dev/?path=/docs/components-swirlresourcelistitem--docs');
@@ -824,7 +824,7 @@ const SwirlResourceListItem = class {
             "resource-list-item--wrap-description": this.descriptionWrap,
             "resource-list-item--wrap-label": this.labelWrap,
         });
-        return (index.h(index.Host, { key: 'b2fdfd045107ff31006b9c1c70239d048c0ee4c4', role: "row" }, index.h("div", { key: 'c4f23462a7fd51d4c1d4f3b3360d078aae1863fb', class: className, role: "gridcell" }, index.h(Tag, { key: 'f9d3e15925524650ad3d352896a34ebd529c5cfb', "aria-checked": ariaChecked, "aria-disabled": disabled ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": Boolean(this.swirlAriaLabel) ? undefined : this.elementId, class: "resource-list-item__content", href: href, disabled: disabled, onClick: this.onClick, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: role, tabIndex: 0, type: Tag === "button" ? "button" : undefined }, this.hasMedia && (index.h("span", { key: 'e907d216795c6e2abbcf6d14e5083a3677a0dcbf', class: "resource-list-item__media" }, index.h("slot", { key: '39ec5acfbf25cae0cb424de566a4dc50d89efd02', name: "media" }))), index.h("span", { key: 'd96920f31bfb501805df70955bd7389c08de2c1f', class: "resource-list-item__label-container", style: labelContainerStyles }, index.h("span", { key: 'b0af7095f0fd9fcc6d50cdc42e6c0d23562f2ee4', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (index.h("span", { key: 'dd1b3b2bea0e5282bb32a4c53855678a4c263765', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (index.h("span", { key: '2b91026e0082c1d2540e4de4bd220c582f5b71cb', class: "resource-list-item__meta" }, index.h("span", { key: 'ab9864395aa27b8c2cf59810cc85ba61394d2496', class: "resource-list-item__meta-text" }, this.meta), index.h("span", { key: '0a6a8b113989be0c4d8c664d230c734cf261b559', class: "resource-list-item__badges" }, index.h("slot", { key: '967c198ac7cc9ec912a5c61c311855619d061596', name: "badges" }))))), this.selectable && (index.h("span", { key: 'a3ce01ecaa19d44b2a06fef31ab8a8e78d8f3bdb', "aria-hidden": "true", class: "resource-list-item__checkbox" }, index.h("span", { key: '3c4bbdae0e5e0e5d65a11d768fba1396799c391a', class: "resource-list-item__checkbox-icon" }, this.checked && (index.h("swirl-icon-check-strong", { key: '8678a5de3e9e5e76055a55c814761a388294bac1' }))))), index.h("span", { key: '51a69042f7f7ff408e8efee4e8f3d5b926de3ff5', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, index.h("slot", { key: 'eab156d4541297e5d918c66955fe9e55b16ce3f9', name: "control" })), showMenu && (index.h("swirl-popover-trigger", { key: 'f49958ff0c2f6963c868901e3971a031f44d2ed3', swirlPopover: this.menuTriggerId }, index.h("swirl-button", { key: '4a64aa449fb01dc3b29ebba82452aa21068f5c67', "aria-disabled": disabled ? "true" : undefined, class: "resource-list-item__menu-trigger", disabled: disabled, hideLabel: true, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick })))), this.allowDrag && (index.h("button", { key: '84ab327ee3d8ba4eb444a7f83c1c01466fcbecf5', "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, index.h("swirl-icon-drag-handle", { key: '0da1c7c370fcf65ec0765676777de94b2843c704', size: this.iconSize })))));
+        return (index.h(index.Host, { key: '9ab8d5b6c71f699ada0554534d05231bcab05b4f', role: "row" }, index.h("div", { key: 'f1e3b59de7165503220e230256fe0dbaf584dbf1', class: className, role: "gridcell" }, index.h(Tag, { key: 'c018cd666438e26be62cceb14fc5b659298cb66c', "aria-checked": ariaChecked, "aria-disabled": disabled ? "true" : undefined, "aria-label": ariaLabel, "aria-labelledby": Boolean(this.swirlAriaLabel) ? undefined : this.elementId, class: "resource-list-item__content", href: href, disabled: disabled, onClick: this.onClick, onBlur: this.onBlur, onFocus: this.onFocus, part: "resource-list-item__content", role: role, tabIndex: 0, type: Tag === "button" ? "button" : undefined }, this.hasMedia && (index.h("span", { key: 'eb0648775d1a8d3f6279aaba67df5fc69078bc14', class: "resource-list-item__media" }, index.h("slot", { key: 'f9eed6eee88cfd13484830592bcde5ec9a8ff2fd', name: "media" }))), index.h("span", { key: 'abdf852d91330d353b3fa0d79ef286f8a654ed17', class: "resource-list-item__label-container", style: labelContainerStyles }, index.h("span", { key: '31d2e2095cfa5fa6d8c0ff6c9cd74352215bf31b', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (index.h("span", { key: 'bba851aebfc9ae97d8e86bc377b2645f2c008f40', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (index.h("span", { key: '1b92b21080990b5cd922becbca08ef8d491470e3', class: "resource-list-item__meta" }, index.h("span", { key: '87ddd62278eaded6e154af605dca7f568b1c1b24', class: "resource-list-item__meta-text" }, this.meta), index.h("span", { key: '74e13c780b46e097e429289f343855010abd262a', class: "resource-list-item__badges" }, index.h("slot", { key: '2684ae7f3771da2c15a91abe11e5376c092b5418', name: "badges" }))))), this.selectable && (index.h("span", { key: 'da36e0f78c70ef6639bc5969fed63e8e7191f69b', "aria-hidden": "true", class: "resource-list-item__checkbox" }, index.h("span", { key: 'a28270546758f11d38a4503b566d93b26cdbe8c5', class: "resource-list-item__checkbox-icon" }, this.checked && (index.h("swirl-icon-check-strong", { key: 'a302ecfae71661cd95adfee5a4a1479288b90131' }))))), index.h("span", { key: '3e85d9ed06e4d6dceee9db5c67799b83ef3e6701', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, index.h("slot", { key: '59321aba61fd5c10732db1281afc7d3487822bff', name: "control" })), showMenu && (index.h("swirl-popover-trigger", { key: '9f9d329b6be6921cc2a346462d6191e306ab8f6a', swirlPopover: this.menuTriggerId }, index.h("swirl-button", { key: '3171ea36c90c935bc9e3dcfd5227d4953a87a899', "aria-disabled": disabled ? "true" : undefined, class: "resource-list-item__menu-trigger", disabled: disabled, hideLabel: true, icon: "<swirl-icon-more-horizontal></swirl-icon-more-horizontal>", intent: "primary", label: this.menuTriggerLabel, onClick: this.onMenuTriggerClick })))), this.allowDrag && (index.h("button", { key: 'f2326a36dd18d5084fbc2c328649fdf806e81135', "aria-describedby": this.dragHandleDescription, "aria-label": `${this.dragHandleLabel} "${this.label}"`, class: "resource-list-item__drag-handle", onKeyDown: this.onDragHandleKeyDown, type: "button" }, index.h("swirl-icon-drag-handle", { key: '295742018c703c5a7c8da55c9e3c93f3be723407', size: this.iconSize })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -31,7 +31,7 @@ const SwirlAvatarGroup = class {
             "avatar-group--has-badge": Boolean(this.badge),
         });
         const badgeClassName = index$1.classnames("avatar-group__badge");
-        return (index.h(index.Host, { key: '2167ae83d47c069fd687a223f6d3220a05571d0e' }, index.h("div", { key: 'ad824d7e97d1705593c328a3a04cc72382950460', class: className, role: "group" }, index.h("slot", { key: 'e85bb42969d592919524148734e73e9393f24dea' }), this.badge && (index.h("span", { key: '1bb9ecdeed5974a6ced80414649945106ac82904', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
+        return (index.h(index.Host, { key: '6e450a07e7a605f78a47dff3e476ad065a739437' }, index.h("div", { key: '81af3f871b919312fa62b64899246cb3608680eb', class: className, role: "group" }, index.h("slot", { key: 'b582e1b748839a296dd61fd2a918246230d0ed46' }), this.badge && (index.h("span", { key: 'c5f83c4964f58208243f595a49e5df1b4d56cb4c', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
     }
 };
 SwirlAvatarGroup.style = SwirlAvatarGroupStyle0;

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

@@ -43,7 +43,7 @@ const SwirlBanner = class {
     }
     componentDidLoad() {
         this.forceIconProps(this.desktopMediaQuery.matches);
-        this.desktopMediaQuery.onchange = this.desktopMediaQueryHandler;
+        this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
     }
     disconnectedCallback() {
         this.desktopMediaQuery.removeEventListener?.("change", this.desktopMediaQueryHandler);
@@ -64,7 +64,7 @@ const SwirlBanner = class {
         const className = index$1.classnames("banner", `banner--intent-${this.intent}`, `banner--size-${this.size}`, {
             "banner--has-icon": showIcon,
         });
-        return (index.h(index.Host, { key: '2b926334556876ce750c890243dac923d8ae5b75' }, index.h("div", { key: 'f7aefa810673bd5e18a5c14aac01a078298df404', "aria-describedby": "content", class: className, role: this.importance, tabIndex: 0 }, index.h("div", { key: '9712a2db49d78fc6228e91f696e442c316b62231', class: "banner__content", id: "content", part: "banner__content" }, showIcon && (index.h("span", { key: '5632af1834cd2ffd0918628e53dcbc766fc0c29c', "aria-hidden": "true", class: "banner__icon", innerHTML: icon, ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'f5bfc1bf786936873522b8c42763166b9bb4b22a', class: "banner__text" }, this.content)), showControls && (index.h("div", { key: '18b8931ee8cfdbecca4ac7330049321023f3f1fb', class: "banner__controls" }, this.actionLabel && (index.h("button", { key: 'b6c7913a77b3872a74ba8c2770803379d268e5c3', class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel)), this.dismissable && (index.h("button", { key: '9119dad3a6d3526e5aebbd0ede243373b7072252', "aria-label": this.dismissLabel, class: "banner__dismiss-button", onClick: this.onDismiss, part: "banner__dismiss-button", ref: (el) => (this.dismissButtonEl = el), type: "button" }, index.h("swirl-icon-close", { key: 'b0a59c1a5104ee71bc31be6c2f5648afbf1748f1' }))))))));
+        return (index.h(index.Host, { key: 'be4bdebb17f5f9611c21c9eded65510ce2cf8427' }, index.h("div", { key: '2153f4b7cc6565e5a525f1131ce48b74ee2ebc7a', "aria-describedby": "content", class: className, role: this.importance, tabIndex: 0 }, index.h("div", { key: '010865c0f43d00bfff18d7c510f48b191bb5b025', class: "banner__content", id: "content", part: "banner__content" }, showIcon && (index.h("span", { key: 'e33800d612c9bf594e3db60acf599357b0851383', "aria-hidden": "true", class: "banner__icon", innerHTML: icon, ref: (el) => (this.iconEl = el) })), index.h("span", { key: '03e082a2db918623b06b1487fd2bdfc6f270e08e', class: "banner__text" }, this.content)), showControls && (index.h("div", { key: 'a2041ef90d239380260e150581b7b06ed5dbc4b2', class: "banner__controls" }, this.actionLabel && (index.h("button", { key: 'c8a469c6d1ac12a9ba66fc1b3a4fdf252aeb8c52', class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel)), this.dismissable && (index.h("button", { key: 'a49e1ac3a5188b0344794fd93f7d5d56f3a520d1', "aria-label": this.dismissLabel, class: "banner__dismiss-button", onClick: this.onDismiss, part: "banner__dismiss-button", ref: (el) => (this.dismissButtonEl = el), type: "button" }, index.h("swirl-icon-close", { key: '95f2d21a48eeb6c5cc845d1dc674502ed89a0467' }))))))));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -45,7 +45,7 @@ const SwirlButton = class {
     componentDidLoad() {
         this.forceIconProps(this.desktopMediaQuery.matches);
         this.updateFormAttribute();
-        this.desktopMediaQuery.onchange = this.desktopMediaQueryHandler;
+        this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
     }
     componentDidRender() {
         this.forceIconProps(this.desktopMediaQuery.matches);
@@ -100,9 +100,9 @@ const SwirlButton = class {
             "button--pressed": this.pressed,
         });
         const Tag = isLink ? "a" : "button";
-        return (index.h(index.Host, { key: '644f280827046e78c58e7c45647c5c0552e95463', style: { pointerEvents: this.disabled ? "none" : "" } }, index.h(Tag, { key: '23a5862e91f6f7d9fd6a2dd85e9c75bc90c559a1', "aria-controls": this.swirlAriaControls, "aria-current": this.swirlAriaCurrent, "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled && !isLink ? "true" : undefined, "aria-expanded": this.swirlAriaExpanded, "aria-haspopup": this.swirlAriaHaspopup, "aria-label": ariaLabel, "aria-pressed": this.pressed ? "true" : undefined, class: className, disabled: isLink ? undefined : this.disabled, download: isLink ? undefined : this.download, form: isLink ? undefined : this.form, href: this.href, name: isLink ? undefined : this.name, ref: (el) => (this.buttonEl = el), target: isLink ? this.target : undefined, type: isLink ? undefined : this.type, value: isLink ? undefined : this.value, style: this.inheritFontSize
+        return (index.h(index.Host, { key: '9c5a6973ea658678167f384b99703c2a5cc932e6', style: { pointerEvents: this.disabled ? "none" : "" } }, index.h(Tag, { key: 'd8d39728274e53aef4a028478ecc6834539c975f', "aria-controls": this.swirlAriaControls, "aria-current": this.swirlAriaCurrent, "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled && !isLink ? "true" : undefined, "aria-expanded": this.swirlAriaExpanded, "aria-haspopup": this.swirlAriaHaspopup, "aria-label": ariaLabel, "aria-pressed": this.pressed ? "true" : undefined, class: className, disabled: isLink ? undefined : this.disabled, download: isLink ? undefined : this.download, form: isLink ? undefined : this.form, href: this.href, name: isLink ? undefined : this.name, ref: (el) => (this.buttonEl = el), target: isLink ? this.target : undefined, type: isLink ? undefined : this.type, value: isLink ? undefined : this.value, style: this.inheritFontSize
                 ? { fontSize: "inherit", lineHeight: "inherit" }
-                : {} }, Boolean(this.icon) && (index.h("span", { key: '37948fe0cb6315080a42a0a0e9d7f14df87db473', class: "button__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !Boolean(this.icon) && (index.h("span", { key: '39cb7279f339fc9b102edc990202adc71424cca0', class: "button__icon", ref: (el) => (this.iconEl = el) }, index.h("slot", { key: '9b176cfb970a3eabc3de0222cdb2dcc09a74017e', name: "icon" }))), !hideLabel && index.h("span", { key: '2784fc9b630954936434165b537358d5950083ae', class: "button__label" }, this.label), hasTag && (index.h("span", { key: '8e2335251d17103e3f79200090be9af69e4420e3', class: "button__tag" }, index.h("slot", { key: '101ab368afa228413d9aac05caa7b77ddbcc858d', name: "tag" }))))));
+                : {} }, Boolean(this.icon) && (index.h("span", { key: 'f8c59b55181804a88e7fbea215955394581085d0', class: "button__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !Boolean(this.icon) && (index.h("span", { key: 'f10549e0f2a5a0ad195bf7a9622dd6764f22074d', class: "button__icon", ref: (el) => (this.iconEl = el) }, index.h("slot", { key: 'd20e1abea1853532c4db9285554e08c01bbd2110', name: "icon" }))), !hideLabel && index.h("span", { key: '1953a32f75eab8d16f8d8b370869b58d7293b83d', class: "button__label" }, this.label), hasTag && (index.h("span", { key: 'ba2fd1ab2514f309dbe41b07440a1e034173756b', class: "button__tag" }, index.h("slot", { key: '79d7921baa4f8744ee3f1328f73f7427c4bf89ba', name: "tag" }))))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-carousel-slide.cjs.entry.js

@@ -19,7 +19,7 @@ const SwirlCarouselSlide = class {
         const className = index$1.classnames("carousel-slide", {
             "carousel-slide--has-min-height": Boolean(this.minHeight),
         });
-        return (index.h(index.Host, { key: '30539973b6ab487e7469d57d7fddc2b5528c363c', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, index.h("slot", { key: '24a72fd7084f06db1e8dd2635e7c9bead7df6cf4' })));
+        return (index.h(index.Host, { key: 'ceffb757f56b25570828a4d5074818ed33f822d6', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, index.h("slot", { key: 'd7858f141ba68421c6b531832a6fb1b9ce6c176c' })));
     }
 };
 SwirlCarouselSlide.style = SwirlCarouselSlideStyle0;

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

@@ -34,7 +34,7 @@ const SwirlChip = class {
     }
     componentDidLoad() {
         this.forceIconProps(this.desktopMediaQuery.matches);
-        this.desktopMediaQuery.onchange = this.desktopMediaQueryHandler;
+        this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
     }
     disconnectedCallback() {
         this.desktopMediaQuery.removeEventListener?.("change", this.desktopMediaQueryHandler);
@@ -57,7 +57,7 @@ const SwirlChip = class {
             "chip--interactive": this.interactive || this.pressed !== undefined,
             "chip--removable": this.removable,
         });
-        return (index.h(index.Host, { key: '9b1e52461918edbaac63ee90bf5a3e553f9d310e' }, index.h(Tag, { key: 'dcbc86988cd9e4227c8d567c84daa76b9ac739cd', "aria-pressed": this.pressed !== undefined ? String(this.pressed) : undefined, class: className, onClick: this.chipClick.emit, type: this.interactive ? "button" : undefined }, index.h("span", { key: '04997af02a853a3baa62a1f26bcc2a6d7f0d0e23', class: "chip__inner" }, showAvatar && (index.h("span", { key: 'd58d29238444cdd44a7a4d1fc8e1f1dcba15c6d7', class: "chip__avatar" }, index.h("slot", { key: '59705540be0270d9c03dc282d0b95323baddc4fc', name: "avatar" }))), showIcon && (index.h("span", { key: '8d568bc86288170c642834787f6f62d14385cfe1', class: "chip__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'b8242740bd0becbd22b2569a9dee60ac46146f46', class: "chip__label" }, this.label)), this.progress !== undefined && (index.h("span", { key: '8dab74c41f4521d82cdc1aa7abac3d0a12c76af9', class: "chip__progress-indicator" }, index.h("swirl-progress-indicator", { key: '9ba51b553551ff5c0d2e163fc9c5b7106089bca7', label: this.progressBarLabel, value: this.progress })))), this.removable && (index.h("button", { key: '730613d93c56281943e0a036cc2afad9e967b1f0', "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.removeChip.emit, type: "button" }, index.h("swirl-icon-close", { key: '06051a334307deb3d0e0b4de1b4fa23a986c4a17', size: 20 })))));
+        return (index.h(index.Host, { key: '3fa170e58fcdd39a85afb56ec10f8f77615eb9b9' }, index.h(Tag, { key: '4e96ce9cd653f9afa6a335734a25c10f92c42edc', "aria-pressed": this.pressed !== undefined ? String(this.pressed) : undefined, class: className, onClick: this.chipClick.emit, type: this.interactive ? "button" : undefined }, index.h("span", { key: '9b6107cc84794c069d0ff46031b886b3f0d4b78e', class: "chip__inner" }, showAvatar && (index.h("span", { key: 'd8a1a42f5ddede7223b78b617171eff7dd065906', class: "chip__avatar" }, index.h("slot", { key: '1bc65807864057fca37fcfec7599bf3606e9384f', name: "avatar" }))), showIcon && (index.h("span", { key: '0baa6dc9f1241a05a11882a4bc748963241e681d', class: "chip__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'd215f1a4d64e8b41648aaa19571f23c90e8a1fc1', class: "chip__label" }, this.label)), this.progress !== undefined && (index.h("span", { key: '173af6fba33eb25cc8d07a24e38757dd5738138b', class: "chip__progress-indicator" }, index.h("swirl-progress-indicator", { key: '46bc43fcc5da5d003bfb71991941fa758d8bae36', label: this.progressBarLabel, value: this.progress })))), this.removable && (index.h("button", { key: 'eb8945c1ca5f26d8d95776c6cb6de10b1b9d985a', "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.removeChip.emit, type: "button" }, index.h("swirl-icon-close", { key: 'c554907b6bcbfbf0b35da2091209b9256e60e545', size: 20 })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -458,11 +458,11 @@ const SwirlColorInput = class {
         const className = index$1.classnames("color-input", {
             "color-input--inline": this.inline,
         });
-        return (index.h(index.Host, { key: 'f4b210728d2dab17496ba08660e3571f9cacdc3f' }, index.h("div", { key: 'efb95089a96cf9120741e212d7398c2a68beffd9', class: className }, index.h("input", { key: '821e90e0964a3a9be0925e74b8dd71b789eff0c8', "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 }), index.h("swirl-popover-trigger", { key: 'b46d7e2f9758e51473029523aa710cdf8258c545', swirlPopover: this.pickerId }, index.h("button", { key: 'ecedca689d662827174ad1b81030493b9ca7a1e1', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
+        return (index.h(index.Host, { key: '6e1b10816dbedff68bea262e40c021699b70efd3' }, index.h("div", { key: '5b29f918032f4ebc460b733d6653944ed6e70d26', class: className }, index.h("input", { key: 'c4011397ab62dad48635a75dd6d82d6823694185', "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 }), index.h("swirl-popover-trigger", { key: 'd1d1ef15b41b815c1de320e121af7627029f5534', swirlPopover: this.pickerId }, index.h("button", { key: 'fce34dbb05daaaa0da9edf43862fd70c31891f7f', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
                 backgroundColor: this.disabled
                     ? "var(--s-border-subdued)"
                     : this.value,
-            }, type: "button" })), index.h("swirl-popover", { key: 'ab1a8724bf3e1aaecfd92af4cff02575dbb70a5c', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, index.h("swirl-box", { key: '78769426685284ff424c87ddc43062fbbb9adf19', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, index.h("hex-color-picker", { key: 'cba38d4c28c6b9c2f1dee2b9a3de3e8aa3b79fc8', color: this.value, ref: (el) => (this.picker = el) }))))));
+            }, type: "button" })), index.h("swirl-popover", { key: '0d4d06c0bb4b0637a1319d68ac6bfb79956050dc', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, index.h("swirl-box", { key: 'f82ee4119af41821fa5664499d04a9039767c30b', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, index.h("hex-color-picker", { key: '229f3536f3d1566092da3b9edf909386917ba531', color: this.value, ref: (el) => (this.picker = el) }))))));
     }
     static get watchers() { return {
         "value": ["watchValue"]

package/dist/cjs/swirl-console-layout.cjs.entry.js

@@ -125,11 +125,11 @@ const SwirlConsoleLayout = class {
             "console-layout--sidebar-active": this.sidebarActive,
             "console-layout--empty-app-bar": !Boolean(this.appName) && !this.showHelpButton,
         });
-        return (index.h(index.Host, { key: '55382641883ca84190aaf206eda8ee2371677302' }, index.h("div", { key: '9518a5bf8834e58c58a5eadbae5d69da69ed0eaf', class: className, onClick: this.onClick, onKeyDown: this.onKeyDown }, index.h("header", { key: '32e8a7e89fbd34fe2369e51fcf256047ca665f31', "aria-hidden": String(!this.sidebarActive), class: "console-layout__sidebar", ref: (el) => (this.sidebarEl = el) }, index.h("div", { key: '1489fd403ae32fed62db279538c71c110e7a3b9b', class: "console-layout__header" }, index.h("div", { key: '308d2ec0abff2c614a2e6fc22cb851cec4d170ae', class: "console-layout__logo" }, index.h("svg", { key: 'ef8af50646106fd9095ec486ab7edb927115a228', class: "console-layout__logo-mark", fill: "none", height: "26", viewBox: "0 0 16 26", width: "16", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '4ffb8da8a77ba36718bab9737fadeae81305707e', d: "M0.624238 14.0705C0.326496 13.5353 0.118077 12.9406 0.0287543 12.3161C-0.0307941 11.662 -0.0010199 11.0375 0.147851 10.4428C0.296722 9.84813 0.594464 9.25343 0.951754 8.77767C1.33882 8.27217 1.78543 7.85588 2.35114 7.55853L14.6181 0.362671C14.9159 0.8979 15.1243 1.4926 15.2136 2.11703C15.3029 2.74147 15.2434 3.3659 15.0945 3.99034C14.9456 4.58504 14.6479 5.17974 14.2906 5.6555C13.9035 6.16099 13.4569 6.57728 12.8912 6.87463L0.624238 14.0705Z", fill: "#145AF5" }), index.h("path", { key: 'd32ce97a8434da9a8a736e2c539e4137dd0e9f3b', d: "M3.69214 21.4743C3.3944 20.9391 3.18598 20.3444 3.09666 19.72C3.00733 19.0956 3.06688 18.4711 3.21575 17.8467C3.36462 17.252 3.66237 16.6573 4.01966 16.1815C4.40672 15.676 4.85333 15.2597 5.41904 14.9624L12.2076 10.9779C12.5053 11.5131 12.7137 12.1078 12.803 12.7323C12.8924 13.3567 12.8328 13.9811 12.6839 14.6056C12.5351 15.2003 12.2373 15.795 11.88 16.2707C11.493 16.7762 11.0464 17.1925 10.4807 17.4899L3.69214 21.4743Z", fill: "#145AF5" }), index.h("path", { key: 'baf96dd80112e4c1efa38aa8df9463317d751a86', d: "M3.69141 21.4739L7.77047 19.0951C8.39573 20.1953 8.5446 21.5036 8.24686 22.7228C7.91934 23.9419 7.14521 24.9826 6.04357 25.6368L3.69141 21.4739Z", fill: "#80A8F4" }), index.h("path", { key: '69398ffe4efa1c29d815e203b95f44ec17244ed0', d: "M12.2072 10.9785L7.32419 10.1459L0.625 14.0709L5.38887 14.9629L12.2072 10.9785Z", fill: "#80A8F4" })), index.h("swirl-text", { key: '73deccd54520b3b1b787dea968785bc6bffb76f5', class: "console-layout__logo-text", weight: "medium" }, this.logoText))), index.h("nav", { key: '7a613bad605c07d6dbb1aa533cc7471e572ffa0d', "aria-label": this.navigationLabel, class: "console-layout__navigation" }, index.h("slot", { key: '7d5833cdb8716ac1139775cac4fd35b66643e2e1', name: "navigation" })), index.h("div", { key: '9b619abfb289f4462f399c2cfbcb1fc13990e86d', class: "console-layout__user" }, index.h("slot", { key: '91df851942daaaf611dc784d703fb3d91db75ee3', name: "user" }))), index.h("main", { key: '22168b5844ebed0f00d071c0897b48fc23df4c20', "aria-labelledby": Boolean(this.appName) ? "app-name" : undefined, class: "console-layout__main" }, index.h("header", { key: 'c2a5388612f400d163dbc6474fce9c7ed65dcf6f', class: "console-layout__app-bar" }, index.h("span", { key: '91de605cd9589a84c226ccb3e70d5fb37985e69c', class: "console-layout__mobile-navigation-button" }, index.h("swirl-button", { key: '3375cd56ed6b8c7ac8d765dc67ace1bff2d59f9c', swirlAriaExpanded: String(this.sidebarActive), hideLabel: true, icon: this.sidebarActive
+        return (index.h(index.Host, { key: '9eae3a95be22ea7aaf4e20341df8aa853825cff6' }, index.h("div", { key: 'c2439333a98ff2c31a67163f162064c7f4b484a8', class: className, onClick: this.onClick, onKeyDown: this.onKeyDown }, index.h("header", { key: '0c5a275f17e499b6800b582454e9d30f006892a7', "aria-hidden": String(!this.sidebarActive), class: "console-layout__sidebar", ref: (el) => (this.sidebarEl = el) }, index.h("div", { key: '8217e531bda8f3231922c4c79b4827fd846132f6', class: "console-layout__header" }, index.h("div", { key: 'bb1b2ff46f199f45d46dbb3cd11f5942effd40d2', class: "console-layout__logo" }, index.h("svg", { key: '85232e92114e98cceb292120d3031bf769ef41f9', class: "console-layout__logo-mark", fill: "none", height: "26", viewBox: "0 0 16 26", width: "16", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'a5b1c28db029d8f5eeafcd8ca9ba108d60fe6d23', d: "M0.624238 14.0705C0.326496 13.5353 0.118077 12.9406 0.0287543 12.3161C-0.0307941 11.662 -0.0010199 11.0375 0.147851 10.4428C0.296722 9.84813 0.594464 9.25343 0.951754 8.77767C1.33882 8.27217 1.78543 7.85588 2.35114 7.55853L14.6181 0.362671C14.9159 0.8979 15.1243 1.4926 15.2136 2.11703C15.3029 2.74147 15.2434 3.3659 15.0945 3.99034C14.9456 4.58504 14.6479 5.17974 14.2906 5.6555C13.9035 6.16099 13.4569 6.57728 12.8912 6.87463L0.624238 14.0705Z", fill: "#145AF5" }), index.h("path", { key: '5369534901d1bd825f3dadbb1b0777cbc3038c58', d: "M3.69214 21.4743C3.3944 20.9391 3.18598 20.3444 3.09666 19.72C3.00733 19.0956 3.06688 18.4711 3.21575 17.8467C3.36462 17.252 3.66237 16.6573 4.01966 16.1815C4.40672 15.676 4.85333 15.2597 5.41904 14.9624L12.2076 10.9779C12.5053 11.5131 12.7137 12.1078 12.803 12.7323C12.8924 13.3567 12.8328 13.9811 12.6839 14.6056C12.5351 15.2003 12.2373 15.795 11.88 16.2707C11.493 16.7762 11.0464 17.1925 10.4807 17.4899L3.69214 21.4743Z", fill: "#145AF5" }), index.h("path", { key: 'cb700811147a9e80c1b989e214f656ec3a71f341', d: "M3.69141 21.4739L7.77047 19.0951C8.39573 20.1953 8.5446 21.5036 8.24686 22.7228C7.91934 23.9419 7.14521 24.9826 6.04357 25.6368L3.69141 21.4739Z", fill: "#80A8F4" }), index.h("path", { key: '788e2f63db212f1cea1932f97cc45592ad35bff7', d: "M12.2072 10.9785L7.32419 10.1459L0.625 14.0709L5.38887 14.9629L12.2072 10.9785Z", fill: "#80A8F4" })), index.h("swirl-text", { key: 'cc3432abedf3b5d5d4f64a50b9b6c5fbb79e7b8d', class: "console-layout__logo-text", weight: "medium" }, this.logoText))), index.h("nav", { key: '30656dbc948badce7c9c2fcd0c07c0c25cbd10c5', "aria-label": this.navigationLabel, class: "console-layout__navigation" }, index.h("slot", { key: '7f2cf3cdafd97528f4ebe7e501cb558e657b7b3c', name: "navigation" })), index.h("div", { key: '7e4de3ee5974d5db6c8ffe73b398178e6315c7ac', class: "console-layout__user" }, index.h("slot", { key: 'ef6611b1d4fd1f7871bee6f8aa816429a3d59305', name: "user" }))), index.h("main", { key: '5ef5b41374886064a1096afa69821a0e2a2c65a8', "aria-labelledby": Boolean(this.appName) ? "app-name" : undefined, class: "console-layout__main" }, index.h("header", { key: '757777dcd0731014dcd7cd6b328ee4a0eb268af2', class: "console-layout__app-bar" }, index.h("span", { key: '85a212b35525e99ef43c22ed9d2c10f45cdd1448', class: "console-layout__mobile-navigation-button" }, index.h("swirl-button", { key: 'c0e9d8bec6380e420316133cbe8fdbe7cb69dd7e', swirlAriaExpanded: String(this.sidebarActive), hideLabel: true, icon: this.sidebarActive
                 ? "<swirl-icon-close></swirl-icon-close>"
                 : "<swirl-icon-menu></swirl-icon-menu>", label: this.sidebarActive
                 ? this.hideNavigationButtonLabel
-                : this.showNavigationButtonLabel, onClick: this.onMobileNavigationToggleClick })), index.h("div", { key: '8a571901ac4ba6b1abbe2131c27d66d2e043f45e', class: "console-layout__app-name" }, this.appName && (index.h("swirl-heading", { key: 'a0b90d6a97b14a28ccf58fa726794927cc2683dc', as: "h1", headingId: "app-name", level: 4, text: this.appName }))), this.showHelpButton && (index.h("swirl-button", { key: 'd6f3453a6123d0b3d18415ad41eee47f53ac21bc', class: "console-layout__help-button", hideLabel: true, icon: "<swirl-icon-help></swirl-icon-help>", label: this.helpButonLabel, onClick: this.onHelpButtonClick }))), index.h("section", { key: '54e23f908184e7b58347d2f4e3cae569f02cbbed', "aria-labelledby": "heading", class: "console-layout__content", style: contentStyles }, index.h("header", { key: 'd3fc76a51365c677e8287e27acd8c3ace3d5b297', class: "console-layout__content-header" }, this.showBackButton && (index.h("swirl-button", { key: 'c5eb672729505730f3851d78493f0c37f238a037', class: "console-layout__back-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButonLabel, onClick: this.onBackButtonClick })), Boolean(this.heading) && (index.h("div", { key: '32384ab5403fafd5c4a9ccd608d7f8f637599982', class: "console-layout__heading-container" }, index.h("swirl-heading", { key: '53c671addacb3c7e1f08a44b97ae04daf35c84fc', as: Boolean(this.appName) ? "h2" : "h1", class: "console-layout__heading", headingId: "heading", level: 1, text: this.heading }), this.subheading && (index.h("swirl-text", { key: '84ec881d9d82afc6eac05841b476c3ee26733c5a', class: "console-layout__subheading", color: "subdued" }, this.subheading)))), !Boolean(this.heading) && (index.h("div", { key: 'd9226c9fa947b0c43ed390d81d2e38aa16939d1b', class: "console-layout__heading-container" }, index.h("slot", { key: '9c7eebe531698ce08c7c36b26fb142facafa0428', name: "heading" }))), index.h("div", { key: '5341c5d6958bbf963e310a398aef23e99e071e0a', class: "console-layout__content-header-tools" }, index.h("slot", { key: '0c550b87dd833f18161e78d99e2f08583cda5bfe', name: "content-header-tools" }))), index.h("div", { key: 'bdf655db92f6704e40dac1d62fefb949bbebd3d2', class: "console-layout__integration" }, index.h("slot", { key: 'fa4b861802ad73ad39da7609a6ad4e78b3422304', name: "content" }))), index.h("div", { key: 'a76dc713a45689e9fe4eb11053f3056f29c7a8e0', class: "console-layout__overlays" }, index.h("slot", { key: '9e938275349485e24f67f58aaa2f6c11d2d7dd77', name: "overlays" }))))));
+                : this.showNavigationButtonLabel, onClick: this.onMobileNavigationToggleClick })), index.h("div", { key: '776c5688dd5df6666069723090bb55a4eb25b4bf', class: "console-layout__app-name" }, this.appName && (index.h("swirl-heading", { key: 'c5097c74e1e9c7d25d41a0401ae57fef87380f8b', as: "h1", headingId: "app-name", level: 4, text: this.appName }))), this.showHelpButton && (index.h("swirl-button", { key: '6e97cecf6d158d16fb5b2cead14e0736c3276cb2', class: "console-layout__help-button", hideLabel: true, icon: "<swirl-icon-help></swirl-icon-help>", label: this.helpButonLabel, onClick: this.onHelpButtonClick }))), index.h("section", { key: 'c2e81d97acec2fe6ab22b32f7347d56095028137', "aria-labelledby": "heading", class: "console-layout__content", style: contentStyles }, index.h("header", { key: '64ca8252b455e5e192577d66d74e443d0dd29b54', class: "console-layout__content-header" }, this.showBackButton && (index.h("swirl-button", { key: '88b482a6ca62d18e16b6a595ebf7bc1a121f5edd', class: "console-layout__back-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButonLabel, onClick: this.onBackButtonClick })), Boolean(this.heading) && (index.h("div", { key: 'fdf655d69778fd56858f3cc81fa7d4aff8fc296d', class: "console-layout__heading-container" }, index.h("swirl-heading", { key: 'f223e7adc7c37f9edd595a424abeaa81cdef1b4b', as: Boolean(this.appName) ? "h2" : "h1", class: "console-layout__heading", headingId: "heading", level: 1, text: this.heading }), this.subheading && (index.h("swirl-text", { key: 'a4634f4e08e5e0059aa85161a1d62bfc1cca60fe', class: "console-layout__subheading", color: "subdued" }, this.subheading)))), !Boolean(this.heading) && (index.h("div", { key: '6efc46ef5ee44716c095a4ab67220ec93e467c17', class: "console-layout__heading-container" }, index.h("slot", { key: 'b3dd442e78f2ed1ad9dc443d94b725a675c67c04', name: "heading" }))), index.h("div", { key: '3ecc3f90eba6abd910779b7b7824e7e3976162c0', class: "console-layout__content-header-tools" }, index.h("slot", { key: '88a89549069fe0037819566a37f15be9c577450d', name: "content-header-tools" }))), index.h("div", { key: '6af01cc21666c89c474023596f3f2913a3798d29', class: "console-layout__integration" }, index.h("slot", { key: '8cde850848d0423876b8e059335a7c9081d33315', name: "content" }))), index.h("div", { key: '1c8d18fd34a993f6a4d0c0563053e2ea2284b966', class: "console-layout__overlays" }, index.h("slot", { key: 'fca6923277da32bb48620b88952a6bddf54e76f3', name: "overlays" }))))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -100,7 +100,7 @@ const SwirlDateInput = class {
     componentDidLoad() {
         this.setupMask();
         this.updateIconSize(this.desktopMediaQuery.matches);
-        this.desktopMediaQuery.onchange = this.desktopMediaQueryHandler;
+        this.desktopMediaQuery.addEventListener("change", this.desktopMediaQueryHandler);
         // see https://stackoverflow.com/a/27314017
         if (this.autoFocus) {
             this.focus();
@@ -159,7 +159,7 @@ const SwirlDateInput = class {
         const className = index$1.classnames("date-input", {
             "date-input--inline": this.inline,
         });
-        return (index.h(index.Host, { key: '7f69f0ce8597ad322510331a8cbb79479d21181a' }, index.h("div", { key: 'ec24b30f274d46792fddbe02b94694bc69c91cc2', class: className }, index.h("input", { key: 'edb7f355cfa77cc0c79501d9bf15f09eaedda5bf', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "date-input__input", disabled: this.disabled, readonly: this.readonly, id: this.id, inputmode: "numeric", onClick: this.onClick, onMouseDown: this.onMouseDown, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), index.h("swirl-popover-trigger", { key: '98cb4b0c8f7445671c2310f72cedaae71f3cec76', swirlPopover: `popover-${this.id}` }, index.h("button", { key: '62880cf97edc8c7b4b6f4f1afc2f2b6c25c3e71e', "aria-label": this.datePickerTriggerLabel, class: "date-input__date-picker-button", disabled: this.disabled, type: "button" }, index.h("swirl-icon-today", { key: 'da1bae29e544207b77987a163cf40830d553d6d9', size: this.iconSize })))), !this.disabled && (index.h("swirl-popover", { key: 'e011209e205dc9c534c5dcdf01d83d5ed67244b5', animation: "scale-in-y", class: "date-input__date-picker-popover", id: `popover-${this.id}`, label: this.datePickerLabel, placement: "bottom-end", ref: (el) => (this.pickerPopover = el) }, index.h("swirl-date-picker", { key: '52514f01386ef24f845b0f0c670c2e73d187dfe3', disableDate: this.datePickerDisableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onValueChange: this.onPickDate, value: dateValue, startDate: dateValue })))));
+        return (index.h(index.Host, { key: '40aee0ed18df588c7e7de56ac15d2a899229240d' }, index.h("div", { key: 'ec0931b258f5de0aed8f4bb474ee7fafdb6f015b', class: className }, index.h("input", { key: 'e167d4115c27b58cdb35b135dcbd90c048063cb2', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "date-input__input", disabled: this.disabled, readonly: this.readonly, id: this.id, inputmode: "numeric", onClick: this.onClick, onMouseDown: this.onMouseDown, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), index.h("swirl-popover-trigger", { key: '8935b2ae6de652d302dacf729a1d10c1e98b1a83', swirlPopover: `popover-${this.id}` }, index.h("button", { key: '1f409c2f827c813b76e06aa7c10204c5e5984dc4', "aria-label": this.datePickerTriggerLabel, class: "date-input__date-picker-button", disabled: this.disabled, type: "button" }, index.h("swirl-icon-today", { key: '0ae84ce7a870a5a6ccb6de23db3f90aaeedafc7d', size: this.iconSize })))), !this.disabled && (index.h("swirl-popover", { key: '8770b10b3bee1fffd7a71afad25cc889882b17f4', animation: "scale-in-y", class: "date-input__date-picker-popover", id: `popover-${this.id}`, label: this.datePickerLabel, placement: "bottom-end", ref: (el) => (this.pickerPopover = el) }, index.h("swirl-date-picker", { key: '26269ce9a256f6dfedceeab811a427dd642a8aab', disableDate: this.datePickerDisableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onValueChange: this.onPickDate, value: dateValue, startDate: dateValue })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-date-picker_2.cjs.entry.js

@@ -46,7 +46,7 @@ const SwirlDatePicker = class {
         const startDate = this.startDate instanceof Date
             ? utils.getISODateString(this.startDate)
             : undefined;
-        return (index.h(index.Host, { key: '26f740cfc83e9c017ef6f66e12da2fa28b61a838', onClick: this.onClick }, index.h("wc-datepicker", { key: '31758155598bfc8e3f95ac24163d6222080212d1', elementClassName: "date-picker", disableDate: this.disableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onSelectDate: this.onSelectDate, range: this.range, startDate: startDate, value: this.value })));
+        return (index.h(index.Host, { key: '1308d168101e84afb51948b884bd3d3f7f3f7322', onClick: this.onClick }, index.h("wc-datepicker", { key: 'b3e0237ce70711cd55b0a7b037be042dd150f247', elementClassName: "date-picker", disableDate: this.disableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onSelectDate: this.onSelectDate, range: this.range, startDate: startDate, value: this.value })));
     }
     get el() { return index.getElement(this); }
 };
@@ -67,7 +67,7 @@ const SwirlIconToday = class {
             color: Boolean(this.color) ? `var(--s-icon-${this.color})` : undefined,
         };
         const className = index$1.classnames("swirl-icon", `swirl-icon--size-${this.size}`);
-        return (index.h("svg", { key: '9740786c2cb5a77a996a5f1e58630ce4ecb12a10', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (index.h(index.Fragment, { key: 'ee3d967eebdcfaac5c8bfd518e767d949dda3ed5' }, index.h("path", { key: '76bdbe80310e0bb5b75129a2db71e917aa7348c2', d: "M6 10.9999C5.53333 10.9999 5.13889 10.8388 4.81667 10.5166C4.49444 10.1944 4.33333 9.79992 4.33333 9.33325C4.33333 8.86658 4.49444 8.47214 4.81667 8.14992C5.13889 7.8277 5.53333 7.66658 6 7.66658C6.46667 7.66658 6.86111 7.8277 7.18333 8.14992C7.50556 8.47214 7.66667 8.86658 7.66667 9.33325C7.66667 9.79992 7.50556 10.1944 7.18333 10.5166C6.86111 10.8388 6.46667 10.9999 6 10.9999ZM3.33333 14.6666C2.96667 14.6666 2.65267 14.5361 2.39133 14.2753C2.13044 14.0139 2 13.6999 2 13.3333V3.99992C2 3.63325 2.13044 3.31947 2.39133 3.05859C2.65267 2.79725 2.96667 2.66659 3.33333 2.66659H4V1.99992C4 1.81103 4.06378 1.65259 4.19133 1.52459C4.31933 1.39703 4.47778 1.33325 4.66667 1.33325C4.85556 1.33325 5.014 1.39703 5.142 1.52459C5.26956 1.65259 5.33333 1.81103 5.33333 1.99992V2.66659H10.6667V1.99992C10.6667 1.81103 10.7307 1.65259 10.8587 1.52459C10.9862 1.39703 11.1444 1.33325 11.3333 1.33325C11.5222 1.33325 11.6804 1.39703 11.808 1.52459C11.936 1.65259 12 1.81103 12 1.99992V2.66659H12.6667C13.0333 2.66659 13.3473 2.79725 13.6087 3.05859C13.8696 3.31947 14 3.63325 14 3.99992V13.3333C14 13.6999 13.8696 14.0139 13.6087 14.2753C13.3473 14.5361 13.0333 14.6666 12.6667 14.6666H3.33333ZM3.33333 13.3333H12.6667V6.66658H3.33333V13.3333ZM3.33333 5.33325H12.6667V3.99992H3.33333V5.33325Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (index.h(index.Fragment, { key: 'cfdb86a74f20516e47f684940f4f4c00749e597f' }, index.h("path", { key: '1a06a21712a5a7460536c56f4e8e13523f5e71e6', d: "M9 16.5C8.3 16.5 7.70833 16.2583 7.225 15.775C6.74167 15.2917 6.5 14.7 6.5 14C6.5 13.3 6.74167 12.7083 7.225 12.225C7.70833 11.7417 8.3 11.5 9 11.5C9.7 11.5 10.2917 11.7417 10.775 12.225C11.2583 12.7083 11.5 13.3 11.5 14C11.5 14.7 11.2583 15.2917 10.775 15.775C10.2917 16.2583 9.7 16.5 9 16.5ZM5 22C4.45 22 3.979 21.8043 3.587 21.413C3.19567 21.021 3 20.55 3 20V6C3 5.45 3.19567 4.97933 3.587 4.588C3.979 4.196 4.45 4 5 4H6V3C6 2.71667 6.09567 2.479 6.287 2.287C6.479 2.09567 6.71667 2 7 2C7.28333 2 7.521 2.09567 7.713 2.287C7.90433 2.479 8 2.71667 8 3V4H16V3C16 2.71667 16.096 2.479 16.288 2.287C16.4793 2.09567 16.7167 2 17 2C17.2833 2 17.5207 2.09567 17.712 2.287C17.904 2.479 18 2.71667 18 3V4H19C19.55 4 20.021 4.196 20.413 4.588C20.8043 4.97933 21 5.45 21 6V20C21 20.55 20.8043 21.021 20.413 21.413C20.021 21.8043 19.55 22 19 22H5ZM5 20H19V10H5V20ZM5 8H19V6H5V8Z", fill: "currentColor" }))), this.size === 28 && (index.h(index.Fragment, { key: '9526926d2e6d85c11cf4bc14ea2e2e3312917c15' }, index.h("path", { key: 'a49dfe76dedfb520497ff4dc30d4f800311f438f', d: "M10.5 19.2499C9.68333 19.2499 8.99306 18.968 8.42917 18.4041C7.86528 17.8402 7.58333 17.1499 7.58333 16.3333C7.58333 15.5166 7.86528 14.8263 8.42917 14.2624C8.99306 13.6985 9.68333 13.4166 10.5 13.4166C11.3167 13.4166 12.0069 13.6985 12.5708 14.2624C13.1347 14.8263 13.4167 15.5166 13.4167 16.3333C13.4167 17.1499 13.1347 17.8402 12.5708 18.4041C12.0069 18.968 11.3167 19.2499 10.5 19.2499ZM5.83333 25.6666C5.19167 25.6666 4.64217 25.4383 4.18483 24.9818C3.72828 24.5244 3.5 23.9749 3.5 23.3333V6.99992C3.5 6.35825 3.72828 5.80914 4.18483 5.35259C4.64217 4.89525 5.19167 4.66659 5.83333 4.66659H7V3.49992C7 3.16936 7.11161 2.89209 7.33483 2.66809C7.55883 2.44486 7.83611 2.33325 8.16667 2.33325C8.49722 2.33325 8.7745 2.44486 8.9985 2.66809C9.22172 2.89209 9.33333 3.16936 9.33333 3.49992V4.66659H18.6667V3.49992C18.6667 3.16936 18.7787 2.89209 19.0027 2.66809C19.2259 2.44486 19.5028 2.33325 19.8333 2.33325C20.1639 2.33325 20.4408 2.44486 20.664 2.66809C20.888 2.89209 21 3.16936 21 3.49992V4.66659H22.1667C22.8083 4.66659 23.3578 4.89525 23.8152 5.35259C24.2717 5.80914 24.5 6.35825 24.5 6.99992V23.3333C24.5 23.9749 24.2717 24.5244 23.8152 24.9818C23.3578 25.4383 22.8083 25.6666 22.1667 25.6666H5.83333ZM5.83333 23.3333H22.1667V11.6666H5.83333V23.3333ZM5.83333 9.33325H22.1667V6.99992H5.83333V9.33325Z", fill: "currentColor" })))));
+        return (index.h("svg", { key: '61ccb175d4f28022a7ac92c003e8a864b8d3abf6', "aria-hidden": "true", class: className, fill: "none", height: this.size, part: "icon", style: styles, viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (index.h(index.Fragment, { key: '00026c8e34ea080be6404697bdc78126650d13db' }, index.h("path", { key: '9ae66270279e7d97e52eabc881cf581c266c7b46', d: "M6 10.9999C5.53333 10.9999 5.13889 10.8388 4.81667 10.5166C4.49444 10.1944 4.33333 9.79992 4.33333 9.33325C4.33333 8.86658 4.49444 8.47214 4.81667 8.14992C5.13889 7.8277 5.53333 7.66658 6 7.66658C6.46667 7.66658 6.86111 7.8277 7.18333 8.14992C7.50556 8.47214 7.66667 8.86658 7.66667 9.33325C7.66667 9.79992 7.50556 10.1944 7.18333 10.5166C6.86111 10.8388 6.46667 10.9999 6 10.9999ZM3.33333 14.6666C2.96667 14.6666 2.65267 14.5361 2.39133 14.2753C2.13044 14.0139 2 13.6999 2 13.3333V3.99992C2 3.63325 2.13044 3.31947 2.39133 3.05859C2.65267 2.79725 2.96667 2.66659 3.33333 2.66659H4V1.99992C4 1.81103 4.06378 1.65259 4.19133 1.52459C4.31933 1.39703 4.47778 1.33325 4.66667 1.33325C4.85556 1.33325 5.014 1.39703 5.142 1.52459C5.26956 1.65259 5.33333 1.81103 5.33333 1.99992V2.66659H10.6667V1.99992C10.6667 1.81103 10.7307 1.65259 10.8587 1.52459C10.9862 1.39703 11.1444 1.33325 11.3333 1.33325C11.5222 1.33325 11.6804 1.39703 11.808 1.52459C11.936 1.65259 12 1.81103 12 1.99992V2.66659H12.6667C13.0333 2.66659 13.3473 2.79725 13.6087 3.05859C13.8696 3.31947 14 3.63325 14 3.99992V13.3333C14 13.6999 13.8696 14.0139 13.6087 14.2753C13.3473 14.5361 13.0333 14.6666 12.6667 14.6666H3.33333ZM3.33333 13.3333H12.6667V6.66658H3.33333V13.3333ZM3.33333 5.33325H12.6667V3.99992H3.33333V5.33325Z", fill: "currentColor" }))), (this.size === 20 || this.size === 24) && (index.h(index.Fragment, { key: 'd5e0d823eee57677a6da4e6e2a19d9ddfdf88575' }, index.h("path", { key: '80f5b67e1a880eb4dba97b3b9426290ae4049f7c', d: "M9 16.5C8.3 16.5 7.70833 16.2583 7.225 15.775C6.74167 15.2917 6.5 14.7 6.5 14C6.5 13.3 6.74167 12.7083 7.225 12.225C7.70833 11.7417 8.3 11.5 9 11.5C9.7 11.5 10.2917 11.7417 10.775 12.225C11.2583 12.7083 11.5 13.3 11.5 14C11.5 14.7 11.2583 15.2917 10.775 15.775C10.2917 16.2583 9.7 16.5 9 16.5ZM5 22C4.45 22 3.979 21.8043 3.587 21.413C3.19567 21.021 3 20.55 3 20V6C3 5.45 3.19567 4.97933 3.587 4.588C3.979 4.196 4.45 4 5 4H6V3C6 2.71667 6.09567 2.479 6.287 2.287C6.479 2.09567 6.71667 2 7 2C7.28333 2 7.521 2.09567 7.713 2.287C7.90433 2.479 8 2.71667 8 3V4H16V3C16 2.71667 16.096 2.479 16.288 2.287C16.4793 2.09567 16.7167 2 17 2C17.2833 2 17.5207 2.09567 17.712 2.287C17.904 2.479 18 2.71667 18 3V4H19C19.55 4 20.021 4.196 20.413 4.588C20.8043 4.97933 21 5.45 21 6V20C21 20.55 20.8043 21.021 20.413 21.413C20.021 21.8043 19.55 22 19 22H5ZM5 20H19V10H5V20ZM5 8H19V6H5V8Z", fill: "currentColor" }))), this.size === 28 && (index.h(index.Fragment, { key: 'b93f367036751ed04ce039316a52ac7f103049d1' }, index.h("path", { key: 'ee2865611f7cae9301b9e32b4ac185de85122a2c', d: "M10.5 19.2499C9.68333 19.2499 8.99306 18.968 8.42917 18.4041C7.86528 17.8402 7.58333 17.1499 7.58333 16.3333C7.58333 15.5166 7.86528 14.8263 8.42917 14.2624C8.99306 13.6985 9.68333 13.4166 10.5 13.4166C11.3167 13.4166 12.0069 13.6985 12.5708 14.2624C13.1347 14.8263 13.4167 15.5166 13.4167 16.3333C13.4167 17.1499 13.1347 17.8402 12.5708 18.4041C12.0069 18.968 11.3167 19.2499 10.5 19.2499ZM5.83333 25.6666C5.19167 25.6666 4.64217 25.4383 4.18483 24.9818C3.72828 24.5244 3.5 23.9749 3.5 23.3333V6.99992C3.5 6.35825 3.72828 5.80914 4.18483 5.35259C4.64217 4.89525 5.19167 4.66659 5.83333 4.66659H7V3.49992C7 3.16936 7.11161 2.89209 7.33483 2.66809C7.55883 2.44486 7.83611 2.33325 8.16667 2.33325C8.49722 2.33325 8.7745 2.44486 8.9985 2.66809C9.22172 2.89209 9.33333 3.16936 9.33333 3.49992V4.66659H18.6667V3.49992C18.6667 3.16936 18.7787 2.89209 19.0027 2.66809C19.2259 2.44486 19.5028 2.33325 19.8333 2.33325C20.1639 2.33325 20.4408 2.44486 20.664 2.66809C20.888 2.89209 21 3.16936 21 3.49992V4.66659H22.1667C22.8083 4.66659 23.3578 4.89525 23.8152 5.35259C24.2717 5.80914 24.5 6.35825 24.5 6.99992V23.3333C24.5 23.9749 24.2717 24.5244 23.8152 24.9818C23.3578 25.4383 22.8083 25.6666 22.1667 25.6666H5.83333ZM5.83333 23.3333H22.1667V11.6666H5.83333V23.3333ZM5.83333 9.33325H22.1667V6.99992H5.83333V9.33325Z", fill: "currentColor" })))));
     }
 };
 SwirlIconToday.style = SwirlIconTodayStyle0;

package/dist/cjs/swirl-description-list-item.cjs.entry.js

@@ -24,7 +24,7 @@ const SwirlDescriptionListItem = class {
             "description-list-item--has-additional-content": hasAdditionalContent,
             "description-list-item--has-tools": hasTools,
         });
-        return (index.h(index.Host, { key: '8052944a07ed9d134f59a1e07a30cdadb34e9cc5', role: "listitem" }, index.h("div", { key: '53f2be38cc7518826139930f5595d8cc21fa7d0d', class: className, part: "description-list-item", role: "group" }, index.h("div", { key: '8d75cbc7c439cb40f6e6b3ab29ec0ae0366bffe2', class: "description-list-item__inner" }, index.h("div", { key: 'b4649be338a58f3b4a9d124843f5bf7b83a7a063', class: "description-list-item__text-container" }, index.h("div", { key: '08b496049fc23ad0130263cf807f13e83bd775b2', class: "description-list-item__term", part: "description-list-item__term", role: "term" }, this.term, this.tooltip && (index.h("span", { key: 'b4722a977bfa2382bd09988f985be99a9264a139', class: "description-list-item__tooltip" }, index.h("swirl-tooltip", { key: 'a063649f6ebdea9e6344266689edf6466f0d4e38', content: this.tooltip, position: "right" }, index.h("swirl-icon-info", { key: '00fdd32e8f0e83a5ae69d8bba04c0c9bb3216478', size: 16, tabIndex: 0 }))))), index.h("div", { key: '989a9a632667504013f6f233ae66c0fb700acee5', style: { maxWidth: this.maxWidth }, class: "description-list-item__description", role: "definition" }, index.h("slot", { key: '573596a4c662d82dabf25107b7cfea727ce57032' }))), index.h("div", { key: '140917f2ebd409b59037e7028234aa3c384bac42', class: "description-list-item__tools" }, index.h("slot", { key: 'cae6b40790ee4703902863b24fdc9934335f4e70', name: "tools" }))), index.h("div", { key: '84528a4a1be9e278ce0f6aedf588ec278f490488', class: "description-list-item__additional-content" }, index.h("slot", { key: 'c39b94bb7102854a4397f3e4d421c6252876ff3a', name: "additional-content" })))));
+        return (index.h(index.Host, { key: '24880ec932f85f8bab070358ae74e878204143fc', role: "listitem" }, index.h("div", { key: '9a78a10403d03af454a390a51c16995e2344e7d7', class: className, part: "description-list-item", role: "group" }, index.h("div", { key: '7f292225fe34a0fac3c35b43e8273d4971444f28', class: "description-list-item__inner" }, index.h("div", { key: '864991f1dd047f7d9b4144e69471bd30b89382fa', class: "description-list-item__text-container" }, index.h("div", { key: '3d8c04ef6093c9991451b2b9ec4e9c581c54adbb', class: "description-list-item__term", part: "description-list-item__term", role: "term" }, this.term, this.tooltip && (index.h("span", { key: 'ac9ea268e5eda1b38197d1bb751fed2bad808aec', class: "description-list-item__tooltip" }, index.h("swirl-tooltip", { key: '3f74b2c7f2a0a717b1e55c520b8d11f9c38ce45c', content: this.tooltip, position: "right" }, index.h("swirl-icon-info", { key: '3e84e0f69502f70ebf0a291ee64f431504965f5e', size: 16, tabIndex: 0 }))))), index.h("div", { key: 'd97314eb88bccdf407b57a57f684dbe6a841a948', style: { maxWidth: this.maxWidth }, class: "description-list-item__description", role: "definition" }, index.h("slot", { key: '584f7856d02da64e26b8b797765b981ba9201429' }))), index.h("div", { key: 'd825fd7c81cd524270c9aef203545a0ee96c0ce7', class: "description-list-item__tools" }, index.h("slot", { key: '040c4051e05ef3fe5dbfb0cd37bb1d53c2aaec42', name: "tools" }))), index.h("div", { key: '2484790fd02dcba4804912fb5c0fee859126a61a', class: "description-list-item__additional-content" }, index.h("slot", { key: 'eed20e643f70742967513d9690049b6de819489c', name: "additional-content" })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-description-list.cjs.entry.js

@@ -12,7 +12,7 @@ const SwirlDescriptionList = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '265ee77a49320add007518f90b2309698c5a8052' }, index.h("div", { key: 'eefe7b2b4002947d891c3f2df9da587d3b493f78', class: "description-list", role: "list" }, index.h("slot", { key: '506b3c1c16ed49a151791431d1aa8076defaa412' }))));
+        return (index.h(index.Host, { key: '4b78ebb93142286f1ef92e9d10c983b2d502b7da' }, index.h("div", { key: '027a87f126bfba1c115bada780930ebc4b8fe75d', class: "description-list", role: "list" }, index.h("slot", { key: '8a339cb49294c12d1aade958869d83d44b61c4cb' }))));
     }
 };
 SwirlDescriptionList.style = SwirlDescriptionListStyle0;