npm - @getflip/swirl-components - Versions diffs - 0.286.0 → 0.287.0 - Mend

@getflip/swirl-components 0.286.0 → 0.287.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1798) hide show

package/components.json CHANGED Viewed

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-01-30T10:55:56",
+  "timestamp": "2025-02-04T14:33:15",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.18.1",
@@ -543,6 +543,10 @@
         {
           "name": "slot",
           "text": "suffix - Used to add custom content to the end of the action list item."
+        },
+        {
+          "name": "slot",
+          "text": "avatar - Optional avatar displayed to the left of the label"
         }
       ],
       "usage": {},
@@ -808,6 +812,10 @@
       "listeners": [],
       "styles": [],
       "slots": [
+        {
+          "name": "avatar",
+          "docs": "Optional avatar displayed to the left of the label"
+        },
         {
           "name": "suffix",
           "docs": "Used to add custom content to the end of the action list item."
@@ -42740,7 +42748,12 @@
       "encapsulation": "shadow",
       "tag": "swirl-menu-item",
       "docs": "",
-      "docsTags": [],
+      "docsTags": [
+        {
+          "name": "slot",
+          "text": "avatar - Avatar displayed inside the item"
+        }
+      ],
       "usage": {},
       "props": [
         {
@@ -43024,7 +43037,12 @@
       "events": [],
       "listeners": [],
       "styles": [],
-      "slots": [],
+      "slots": [
+        {
+          "name": "avatar",
+          "docs": "Avatar displayed inside the item"
+        }
+      ],
       "parts": [],
       "dependents": [],
       "dependencies": [

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

@@ -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: 'ffffe91e896afccca4c19512fe2ef19e2da65c1e' }, index.h("swirl-app-layout", { key: '79ccd6e004981345d0f57dc645f5189091ee5df8', 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: '9cd41bbed75991719d261f30fc24d0c22f00637f', label: "Documents", slot: "navigation" }, this.renderNavigation()), index.h("swirl-popover-trigger", { key: '77576986bf05b6dbadde0e365cd5c6416bda2d95', swirlPopover: this.sortMenu, slot: "navigation-controls" }, index.h("swirl-button", { key: 'f5029d116fb316db144e79c8e540f563649265a7', label: "Sort items" })), index.h("swirl-stack", { key: '8ba26af82d9fb15591438c49632ec8143d82f7dd', orientation: "horizontal", slot: "app-bar" }, index.h("swirl-stack", { key: '874528e994a338116090b79c071fe1d4bde509ce' }, index.h("swirl-heading", { key: '92701ef6d8a08fd4483fbc66a87657999f1fe2be', as: "h2", level: 4, text: this.selectedFile?.name }), index.h("swirl-text", { key: '82cbe443a8e838c862ac01004fe82aa73c41783e', 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: '0428e017e42bdb1169b1605bb7c969cd0b3757fa', slot: "app-bar-controls" }, this.selectedFile && (index.h("swirl-button", { key: 'dc15f200a5b67a05ceee3036a35b52093c451792', "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: 'd8e8e590b5f420f2bb5c0fdb4a8a61350cd51f1f', padding: "16", slot: "sidebar" }, index.h("swirl-text", { key: '669d746fa05e44a8be207f332eefa0305f48bba3', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), index.h("swirl-popover", { key: 'fa3cb353fe87728c655a43465531e390ac6d61ec', label: "Sort items", ref: (el) => (this.sortMenu = el) }, index.h("swirl-option-list", { key: 'c9219ee1eb3b059ea59f09a84be0533c95fa7736', value: ["ascending"] }, index.h("swirl-option-list-item", { key: '7e682996eaa5ebc9243fc873dc6122c7289f6e8f', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), index.h("swirl-option-list-item", { key: 'b7e1c77a677793045d6b503ffec1631d5b4458ad', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), index.h("swirl-option-list-item", { key: 'df2e172efe264d63bdf868fc3810a2f0d944af5d', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
+        return (index.h(index.Host, { key: '6603abe64ac9ea6436bf164e5863dbe252485444' }, index.h("swirl-app-layout", { key: '41bf19429c03eedbe5b53a27a9e1f5ac53199872', 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: '9c27bc74c66a7551ff7d10c7e97a168e13a53ff3', label: "Documents", slot: "navigation" }, this.renderNavigation()), index.h("swirl-popover-trigger", { key: '347b1f00fc38adee4d9c3c8e61b068341b46bba1', swirlPopover: this.sortMenu, slot: "navigation-controls" }, index.h("swirl-button", { key: 'd4cfe8cf0018329a5bd5c0aafeb1b7d814848fc2', label: "Sort items" })), index.h("swirl-stack", { key: 'f5dfe41009bb7ce695eb7751e5d9c7da0de5b49e', orientation: "horizontal", slot: "app-bar" }, index.h("swirl-stack", { key: 'a32447f4da4b23c479eda986074cc6872fccec6c' }, index.h("swirl-heading", { key: '1b195e5c58b6b0547c2513279500ffac6708f5e9', as: "h2", level: 4, text: this.selectedFile?.name }), index.h("swirl-text", { key: 'fd5e67c61cccabf95c49dda8a797c1ffde13d244', 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: 'f3df316e5f0b4f83b5bb08b9909ed926f7c52ed9', slot: "app-bar-controls" }, this.selectedFile && (index.h("swirl-button", { key: 'f923387944645c02ac03e23395213b176ed09203', "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: '61a6233730516d6e3a9ee37f777372f1c68d428f', padding: "16", slot: "sidebar" }, index.h("swirl-text", { key: 'b1d547fbf54276b014329c6585b161531181a138', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), index.h("swirl-popover", { key: 'b076f7e20dd0d765480f8f42a0510231956f315f', label: "Sort items", ref: (el) => (this.sortMenu = el) }, index.h("swirl-option-list", { key: '730c7e0f5a54eac3d34270d34523b586b060cd13', value: ["ascending"] }, index.h("swirl-option-list-item", { key: 'd42dd5d600b0e67b3e11bc89374dd633f6024d47', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), index.h("swirl-option-list-item", { key: '2aeeffcb320b8e4614ca86557db63fe533e44adf', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), index.h("swirl-option-list-item", { key: 'bd7b9b047b2ed441d1f7b0545f4423c46b5e150b', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
     }
 };

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

@@ -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: '5f7a6ea811aad1cc1b8653ca1735e420707ef555' }, index.h("div", { key: 'd7dccc0fc31458bce87b5c3af3d758dc89e68575', class: className }, index.h(HeadingTag, { key: 'ec1b86fa802173c7d82d4dc91faf766fe895ee17', class: "accordion-item__heading" }, index.h("button", { key: '92c041b98384032d6d311ec73bb7fd35ba702d43', "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: '3f92ed1169629eeb4441ed15900db2c22cee97b8', class: "accordion-item__toggle-text" }, this.heading, this.description && (index.h("swirl-text", { key: 'bb5a29122c56cef6cbdf15d46930a90bf111740a', as: "span", color: "subdued", size: "sm" }, this.description))), index.h("span", { key: '2394f58df22908b5db4fecda353ee816f572db3b', class: "accordion-item__icon" }, !this.expanded && (index.h("swirl-icon", { key: '6868feb73403ff47b22f70ed2e9c3d6c6c719f0a', glyph: "chevron-right", size: 20 })), this.expanded && (index.h("swirl-icon", { key: '9f04ff5d6e0effdcd2c5269b47a06fd0614637bc', glyph: "expand-more", size: 20 }))))), index.h("div", { key: '8d46398c7867d2dff6efdb5006060b044c10171b', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, index.h("slot", { key: '50690f6f1dfcec03ef05ceaf0061f417e426071e' })))));
+        return (index.h(index.Host, { key: 'ce93a57fef055a3b912b9d74307caa48e9792c9a' }, index.h("div", { key: '7b164b2586f089ec5d03777873a2df1474a5c1d3', class: className }, index.h(HeadingTag, { key: '95e160a7ce0199ae5f42504386b9023a3c7ebc9d', class: "accordion-item__heading" }, index.h("button", { key: '0b046a3e376f888e084a1d0ee1edd87ac99b852f', "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: 'cb13c9193027463ea70f3e0179d3231768415552', class: "accordion-item__toggle-text" }, this.heading, this.description && (index.h("swirl-text", { key: 'b7a68f4b9c771e68d58ffac6aa8f64b548bd1d16', as: "span", color: "subdued", size: "sm" }, this.description))), index.h("span", { key: '6422613b1f9847cde1ce24a9d5360da2ec6b027e', class: "accordion-item__icon" }, !this.expanded && (index.h("swirl-icon", { key: '258fee1808b32595ef78cbc67c25a825a82a3f4c', glyph: "chevron-right", size: 20 })), this.expanded && (index.h("swirl-icon", { key: '4db06cd86fe17b6785ee700986816d4c8870f45b', glyph: "expand-more", size: 20 }))))), index.h("div", { key: '172b05165c975966d837595f7cecce43a3562441', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, index.h("slot", { key: 'b8340c9735970792ab184c10b6ab1d3d15c9be6e' })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -48,7 +48,7 @@ const SwirlAccordion = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '4d75f830088554c2de0b74df72e2c6a9beeb31e9' }, index.h("slot", { key: '0fcd720e4392e8f77fffda0e723311ef9d942b8d' })));
+        return (index.h(index.Host, { key: '55af41200054fe3f630d7fc1e9a6e051ad53b6ba' }, index.h("slot", { key: '9714a1232064b82c0d2047aefb4b87228931e213' })));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -13,7 +13,7 @@ const SwirlActionListSection = class {
         this.label = undefined;
     }
     render() {
-        return (index.h(index.Host, { key: '5c5e188520c3e876ca9d4e46900d78e223977ccb' }, index.h("div", { key: 'cfe4ece09f7f6726afb4bf4b593f6d667e5ef3db', "aria-labelledby": "label", class: "action-list-section", role: "group" }, index.h("span", { key: 'a84c15c53cd19fbcf035029a0e2573ac6687ebbe', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), index.h("div", { key: 'ab0eaefc1c827291a086eadbb7630e1e1e5ceef8', class: "action-list-section__items" }, index.h("slot", { key: '3720c008dcbfd5c6f62d4d60ad4bbf9960b3642b' })))));
+        return (index.h(index.Host, { key: '297688f160ff018c0a2ecce9cb2bd2334a63b4ed' }, index.h("div", { key: '410c162413ca42fc3ea67cb8f242d425b565bb1c', "aria-labelledby": "label", class: "action-list-section", role: "group" }, index.h("span", { key: '5c65d4afe15c9c7beed9b475e22f20c5ef4bbdfb', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), index.h("div", { key: '43ee7a618f4780e75b5d9434060807a0adeb522b', class: "action-list-section__items" }, index.h("slot", { key: 'fdccbc861430f3f6bc839e8166adfb64640fc56f' })))));
     }
 };
 SwirlActionListSection.style = SwirlActionListSectionStyle0;

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

@@ -83,7 +83,7 @@ const SwirlActionList = class {
             item === activeElement?.querySelector('[role="menuitem"]'));
     }
     render() {
-        return (index.h(index.Host, { key: 'd2c8c06e5f917d832fc9c6880de78ca6e2b24d3b' }, index.h("div", { key: 'ae86dc8ef560047f2e3cbbaece2faad334377ebd', "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: 'b5fe05b65edcc93576c19c59f072669e301bfb59' }))));
+        return (index.h(index.Host, { key: 'b16da7e5d0b8b4c9ee3e9160c013e5a2385d6900' }, index.h("div", { key: '1eeb9a88ebd644dd22c32022aabd83a9454dd2dc', "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: 'a2cbd9841b0a94a4fe40346c86301f548232d81d' }))));
     }
     get el() { return index.getElement(this); }
 };
@@ -138,7 +138,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: '408db106a78a73aeaf63fa8b745a1145ac2c35dd' }, index.h("button", { key: '8397b7be24712cbede7dbe4687c383cc4e6e3c4e', "aria-expanded": this.swirlAriaExpanded, "aria-haspopup": this.swirlAriaHaspopup, class: className, disabled: this.disabled, part: "action-list-item", role: "menuitem", tabIndex: -1, type: "button" }, this.icon && (index.h("span", { key: '52a764c0966f0204ef64df2ba6b813d2449fc720', class: "action-list-item__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) }, showIconBadge && (index.h("span", { key: 'db73545e030746a3dc9e07e9bd9ba0211576eb25', class: "action-list-item__icon-badge", innerHTML: this.iconBadge, ref: (el) => (this.iconBadgeEl = el) })))), index.h("span", { key: '322ebb8fb030fc4033119d38b2a67b9c13eaaa9f', class: "action-list-item__label-container" }, index.h("span", { key: '2598b48234b315f5e35cc7a17d97b40168290602', class: "action-list-item__label" }, this.label), this.description && (index.h("span", { key: 'd130bb6efb271595471fe094fd0375a61b73b5fb', class: "action-list-item__description" }, this.description))), showBadge && (index.h("span", { key: '2e5ca125470b24980585896283692ea95cd657d9', class: "action-list-item__badge", innerHTML: this.badge })), showSuffix && (index.h("span", { key: '12739299da6b4ee7982c32b6e2eee192e2612614', class: "action-list-item__suffix", innerHTML: !showSuffixSlot ? this.suffix : undefined, ref: (el) => (this.suffixEl = el) }, index.h("slot", { key: '358f31549326363064e8441beffe292113b4ffdc', name: "suffix" }))))));
+        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" }))))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-app-bar.cjs.entry.js CHANGED Viewed

@@ -65,7 +65,7 @@ const SwirlAppBar = class {
             paddingInlineEnd: `var(--s-space-${this.paddingInlineEnd})`,
             paddingInlineStart: `var(--s-space-${this.paddingInlineStart})`,
         };
-        return (index.h(index.Host, { key: 'c06a23cfd8dbe4ee10cfcdaea7c61c34b2607377' }, index.h("div", { key: '9b109b19a7671f1db36274931e6c375a36358b6b', class: className, style: styles }, showLeftControls && (index.h("div", { key: '816bb1fb098065fcd958ea02ff02175d557795ea', class: "app-bar__left-controls" }, (this.showBackButton || this.showCloseButton) && (index.h("div", { key: 'e36f84156257773d5a4afc14b4a57d5d3c6a5119', class: "app-bar__main-navigation-control" }, this.showBackButton && (index.h("swirl-button", { key: 'ee8c47a842578086bae71252ae84468cb591e370', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButtonLabel, onClick: this.onBackButtonClick })), this.showCloseButton && (index.h("swirl-button", { key: 'd80654406c9385f8642a48298a68996e9b07ecf2', hideLabel: true, icon: this.closeButtonIcon, label: this.closeButtonLabel, onClick: this.onCloseButtonClick })))), this.showStepperControls && (index.h("div", { key: '6dd148c9dc3fb90904f2f196b4cc9cad2443f807', class: "app-bar__stepper-controls" }, index.h("swirl-button", { key: 'ccfdf9bd6dd04919e41c71ec3450f745035beb53', hideLabel: true, icon: "<swirl-icon-arrow-upward></swirl-icon-arrow-upward>", label: this.stepUpButtonLabel, onClick: this.onStepUpButtonClick }), index.h("swirl-button", { key: '8c2ff8a3d7eac53b9755be4e59ba117b83b29d1b', hideLabel: true, icon: "<swirl-icon-arrow-downward></swirl-icon-arrow-downward>", label: this.stepDownButtonLabel, onClick: this.onStepDownButtonClick }))))), index.h("div", { key: '38d8ef8d61ae1a6b26b2c04718d11a6b5737d5d3', class: "app-bar__cta" }, index.h("slot", { key: '10f913949cb291e0d297e6cc4d1ecb86aaae7865', name: "cta" })), index.h("div", { key: 'a977186f42b4b4aafb456d0fc559198cdd43646c', class: "app-bar__heading" }, index.h("slot", { key: 'c5f89f5d5b89b7292e569c486042d4e252068e82', name: "heading" })), index.h("div", { key: '3aaca53d45a8566f6c83980b66d16cfd4c143f4b', class: "app-bar__center-controls" }, index.h("slot", { key: '25b3353688b3c16b1949b05ccee83b9ca58ece61', name: "center-controls" })), index.h("div", { key: 'd6daeec18cc5c1ae2f539b514efcfe994ecc40ff', class: "app-bar__right-controls" }, index.h("slot", { key: '52a3c7bd52599c81a6dc6172a67b91eb1cbd778f', name: "right-controls" })))));
+        return (index.h(index.Host, { key: 'f21458799a37778b5c7078c2f9679e4b323c306e' }, index.h("div", { key: '3ef4a4192a9422eb196869d72d7918057ed4427d', class: className, style: styles }, showLeftControls && (index.h("div", { key: '0f1c91a944780502d4253fc29a4119364b050f23', class: "app-bar__left-controls" }, (this.showBackButton || this.showCloseButton) && (index.h("div", { key: '300dec3bcb2e8d077c85d44549eb3fd43cd389b8', class: "app-bar__main-navigation-control" }, this.showBackButton && (index.h("swirl-button", { key: 'b703037e0f9cbf948cb2ffbe8fc708adc5b12808', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButtonLabel, onClick: this.onBackButtonClick })), this.showCloseButton && (index.h("swirl-button", { key: '7636c5ca8f7c835a873931e97064ebdb4e734f47', hideLabel: true, icon: this.closeButtonIcon, label: this.closeButtonLabel, onClick: this.onCloseButtonClick })))), this.showStepperControls && (index.h("div", { key: '807553c0a0ba911a725aa22e4e10156e4a3a1f38', class: "app-bar__stepper-controls" }, index.h("swirl-button", { key: 'ae37678f60560b2cf13e75bd4e31f2da51db9371', hideLabel: true, icon: "<swirl-icon-arrow-upward></swirl-icon-arrow-upward>", label: this.stepUpButtonLabel, onClick: this.onStepUpButtonClick }), index.h("swirl-button", { key: 'd38fa06e1b0b2e6bfa37401ab22c98bba39f1a82', hideLabel: true, icon: "<swirl-icon-arrow-downward></swirl-icon-arrow-downward>", label: this.stepDownButtonLabel, onClick: this.onStepDownButtonClick }))))), index.h("div", { key: '018f6e09dd24883fbcbbe045f5d90b2f1feb2a71', class: "app-bar__cta" }, index.h("slot", { key: '8691491e1759aee6b4a553ba7b4ed0794995a0bf', name: "cta" })), index.h("div", { key: 'e944c68e3d6a76818e98a8bf66d3c38f8e7484f9', class: "app-bar__heading" }, index.h("slot", { key: '2430a78a86602115a27f363139eec4520b3f8a00', name: "heading" })), index.h("div", { key: '5fbaca57c7b1dd1207f3fcd941ce583397bd5d9e', class: "app-bar__center-controls" }, index.h("slot", { key: '134470957f50dca26f9d5eb199caa5d02e9d61e5', name: "center-controls" })), index.h("div", { key: 'd7ad558e053ea6e76d24a317136669c338b95049', class: "app-bar__right-controls" }, index.h("slot", { key: 'a5a2d0dda80b23e3b855b4a84f834af53f24236f', name: "right-controls" })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -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: 'a3c326ddb9b5f885998f068d75dd2368128dbdc3' }, index.h("span", { key: '18d236b54e882d532a68e2b4c138511ae1780400', class: className }, showImage && (index.h("img", { key: 'afd2630244eb9b2bcfc868ed08ef111c24f84a59', alt: "", height: "256", onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: "256" })), showIcon && (index.h("span", { key: 'c1e6d2320b8dec4446aa69acd28fd27f5cf62e54', class: "app-icon__icon", innerHTML: this.icon })))));
+        return (index.h(index.Host, { key: 'dd70f3b87a44a926c7b4da93b9e81a1eed6e2d97' }, index.h("span", { key: 'b2428a9fca48e5a9ad36dc345298254afefe2c90', class: className }, showImage && (index.h("img", { key: 'a0c55e77b3e238de83246752a37d9a376f624a6b', alt: "", height: "256", onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: "256" })), showIcon && (index.h("span", { key: 'bedcd164cd1cc1fd698bcf74598e66c4d718e0c8', class: "app-icon__icon", innerHTML: this.icon })))));
     }
 };
 SwirlAppIcon.style = SwirlAppIconStyle0;

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

@@ -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: '6ecc40ce75a553155a68b0745a6e60b4f2b3708f' }, index.h("section", { key: 'af7797588e0fde39764ab8214e61c75aaf89cfe1', "aria-labelledby": "app-name", class: className }, index.h("div", { key: '987264b968313a9a33e79c862e8b41f3c36f778f', class: "app-layout__grid" }, index.h("header", { key: 'd7e57a83f373f722271f07d84f07ebe1fdfa9a8a', class: "app-layout__header", ref: (el) => (this.headerEl = el) }, index.h("span", { key: 'c9229ebfac14bb9a4f31c40eaed007026fef603c', class: "app-layout__navigation-mobile-menu-button" }, index.h("slot", { key: '62e423f89b2d80e2aeab629822014362a5f5807d', name: "navigation-mobile-menu-button" })), this.collapsibleNavigation && (index.h("span", { key: 'e0cb00b70c6385d01fa7304cfa1e8d842e89beb3', class: "app-layout__nav-overlay-toggle" }, index.h("swirl-button", { key: 'e7942691b237be46f7c5b08f77880c13a2a302f5', hideLabel: true, icon: this.navExpansionState !== "expanded"
+        return (index.h(index.Host, { key: '2192bf3336762dea743265d083becd45482eedbf' }, index.h("section", { key: '3f8a980332d4f0ff89cb8b54731d06e2ed6923b5', "aria-labelledby": "app-name", class: className }, index.h("div", { key: '5b4efbeacb72bd6854e13b60017f16b49c7d3470', class: "app-layout__grid" }, index.h("header", { key: '496182fbe63fb76e8039079c7efc2a77f2c2f7be', class: "app-layout__header", ref: (el) => (this.headerEl = el) }, index.h("span", { key: 'aa33206028b8895027099dbb0ae1a702e132e039', class: "app-layout__navigation-mobile-menu-button" }, index.h("slot", { key: '58b240a3dfa39c69700f68b4c9a149077e48bead', name: "navigation-mobile-menu-button" })), this.collapsibleNavigation && (index.h("span", { key: 'a3e6c91b9f57424f46c9bf9ba7550328552a26ce', class: "app-layout__nav-overlay-toggle" }, index.h("swirl-button", { key: '37b5cbee5f7207cd453471eba7d071bd7693bed5', 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: 'd2b359d9d695a99f758699cb61b9731616cc5ae1', class: "app-layout__navigation-back-button" }, index.h("swirl-button", { key: '8441e59724620b73146895d54542f699a22c35cd', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.navigationBackButtonLabel, onClick: this.onNavigationBackButtonClick }))), index.h("swirl-heading", { key: '9dc4ac2355a32292d40e1f326ad8b8b95080b56d', as: "h1", class: "app-layout__app-name", headingId: "app-name", level: 3, text: this.appName }), navigationActive && (index.h("span", { key: '77e150c323290bee296b7747ee940e0c3bedee4a', class: "app-layout__navigation-controls" }, index.h("slot", { key: '8cd86420650529d632d3f83e25f8c80e2acc6022', name: "navigation-controls" })))), index.h("nav", { key: 'c3b93be1c802b940c2f7e877e2ed1f463123c378', "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: '1b76d9241b88495dba00de2e6fb98926ee1d2861', class: "app-layout__navigation-back-button" }, index.h("swirl-button", { key: '51b1e6a6accad4a4173034e12e5aef256fd4d4af', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.navigationBackButtonLabel, onClick: this.onNavigationBackButtonClick }))), index.h("swirl-heading", { key: '3aa52779b10916a02cb8af0ac538311a11752f9a', as: "h1", class: "app-layout__app-name", headingId: "app-name", level: 3, text: this.appName }), navigationActive && (index.h("span", { key: '1d182d4371456b494ade1f9f076706879a198231', class: "app-layout__navigation-controls" }, index.h("slot", { key: '85b394015a62588dc44374b6a4950e2118529f4e', name: "navigation-controls" })))), index.h("nav", { key: '6992a88da55541eb067e905de93c8bc1a093b04b', "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: 'd6a22b90ee21847cd22fec51d874b1428942bd61', name: "navigation" })), index.h("section", { key: 'b88c64d74bb2534ff424d7f3794181cfde17eb2c', "aria-labelledby": "app-name", class: "app-layout__body" }, !this.hideAppBar && (index.h("header", { key: '51163ecb84407e968f78089bb22a99daeaaf269b', class: "app-layout__app-bar" }, index.h("span", { key: 'a89226ec4b5c8c69568158dc08461f151a254a14', class: "app-layout__app-bar-mobile-menu-button" }, index.h("slot", { key: '6c0d79c4830d75136e54068321b4e5b541470cf0', name: "app-bar-mobile-menu-button" })), showBackToNavigationButton && (index.h("span", { key: '320948753c656a79e71936b4de8e5b51b87e03d9', class: "app-layout__back-to-navigation-button" }, index.h("swirl-button", { key: 'eb6d1f309242d6019ee2e0e071c1a6586135c07f', hideLabel: true, icon: this.transitionStyle === "dialog"
+                this.navExpansionState === "collapsed" }, index.h("slot", { key: '68d20399402968c86fa57320274c5f047bd1ca7b', name: "navigation" })), index.h("section", { key: '52d59e9636b4ab053b0908bf990b73f48e6b5947', "aria-labelledby": "app-name", class: "app-layout__body" }, !this.hideAppBar && (index.h("header", { key: '333ed1a7c47c50ca54c5cd50172aa3b7971913b3', class: "app-layout__app-bar" }, index.h("span", { key: '0c7fd56eb217ed64e3dd6308c88c71f97bae167f', class: "app-layout__app-bar-mobile-menu-button" }, index.h("slot", { key: '5839a57d6e77288c0195a788e9a869e65063c465', name: "app-bar-mobile-menu-button" })), showBackToNavigationButton && (index.h("span", { key: '0840f9bb0c1c1a40360e7a7b376498b2dd81a94f', class: "app-layout__back-to-navigation-button" }, index.h("swirl-button", { key: 'e92ab3c9702c9121861996bf051ed972cbcf1af7', 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: '4d7f01de584fd6fd4dc8407af6dc968724bfcdb8', class: "app-layout__nav-expansion-toggle" }, index.h("swirl-button", { key: '15a5c8bd78ac1b109ddb0949cf69244ae41d3900', hideLabel: true, icon: "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", label: this.navigationOverlayLabel, onClick: this.overlayNavigation }))), index.h("span", { key: 'd63c412b4ccf0428d417680c3c806de43d7acfca', class: "app-layout__custom-app-bar-back-button" }, index.h("slot", { key: '270c3efca63bdf06b93e1defebc883d53ba3391b', name: "custom-app-bar-back-button" })), index.h("div", { key: '0c550e11e751a1b8d2087c662ec9c15963ad684e', class: "app-layout__app-bar-content" }, index.h("slot", { key: '984272347565d4b3043a3d467af1bc18099ce69a', name: "app-bar" })), index.h("div", { key: '955a810e5b8eb78d98460869fdd620e4d1938d3a', class: "app-layout__app-bar-controls" }, index.h("slot", { key: '821d02306c8e70b8b89562079e40b839c9dfae4e', name: "app-bar-controls" })))), index.h("div", { key: 'c6da60f1ef567e34727f0d67327330a2e9c2aa36', class: "app-layout__banner" }, index.h("slot", { key: 'a729e318c6de2eefd2c963155d826d0879f1d663', name: "banner" })), index.h("div", { key: '7b8c7a9cb400174cef52e7c8fffdb14be5e34260', class: "app-layout__content", onScroll: this.onContentScroll, ref: (el) => (this.contentEl = el) }, index.h("slot", { key: '22d1bb04bcb05723f65973ae64d7e4d401d4cc6f', name: "content" })), index.h("div", { key: '7ed6075864710943a424e51985a9710ce7c89efd', class: "app-layout__bottom-bar" }, index.h("slot", { key: '1b9c4c30f69e86c1324ea3f1fccef4884af7acc3', name: "bottom-bar" }))), index.h("aside", { key: '0ff3195bd3033562704f6c4bac449e01d37d9e0f', class: "app-layout__sidebar" }, index.h("header", { key: 'e22f2f2d02e38673c4173337eaa6f16e3e79c7a1', class: "app-layout__custom-sidebar-header" }, index.h("slot", { key: '34458e91090e415bfe92ccf5286864a6c5a424e5', name: "custom-sidebar-header" })), index.h("header", { key: '981e497873e44a6575d27bc3255bcc50816e861f', class: "app-layout__sidebar-header" }, index.h("swirl-button", { key: 'f2e2aa0e042cc3b10510a04ae25910cba508c459', 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: 'c1c76e420e5041d6e3facc61438d05f25b397836', as: "h3", class: "app-layout__sidebar-heading", headingId: "sidebar-heading", level: 3, text: this.sidebarHeading })), index.h("div", { key: '7f29f7c8eb440562135ae0618b982c9229008c77', class: "app-layout__sidebar-content", onScroll: this.onSidebarScroll, ref: (el) => (this.sidebarEl = el) }, index.h("slot", { key: 'd04d989f5cc28a6843f514e1839089b11be15472', name: "sidebar" }))), index.h("span", { key: 'd82c7e67f1a82e4840b707bf2e5358f33f04e120', class: "app-layout__floating-action-button" }, this.ctaLabel && (index.h("swirl-button", { key: '3a0e0c130307c174650ea50e73aa01fc99559615', hideLabel: Boolean(this.ctaIcon), icon: this.ctaIcon, intent: "primary", label: this.ctaLabel, onClick: this.onCtaClick, variant: "floating" })), index.h("slot", { key: '59e97c933d122437a298b469af220e50e50aca39', name: "floating-action-button" }))))));
+            this.navExpansionState !== "expanded" && (index.h("span", { key: '710f1bb3eabe05a6242399d7eafd75b888a5804d', class: "app-layout__nav-expansion-toggle" }, index.h("swirl-button", { key: 'f563b708831eb84fac2837c282b4b4b1425acea7', hideLabel: true, icon: "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", label: this.navigationOverlayLabel, onClick: this.overlayNavigation }))), index.h("span", { key: '12571f31a669a614acfd32f7454d84d461607bb2', class: "app-layout__custom-app-bar-back-button" }, index.h("slot", { key: 'f7ff9464709e45343e507348182e381fe6ea384e', name: "custom-app-bar-back-button" })), index.h("div", { key: 'a666f10d9164da4ab09cd004b60e482e0a97e073', class: "app-layout__app-bar-content" }, index.h("slot", { key: 'ed2f67119740628b3728edc3667a187080e57c5e', name: "app-bar" })), index.h("div", { key: '2b6e269d6f7336e3c63f3682faa1a315c345649d', class: "app-layout__app-bar-controls" }, index.h("slot", { key: '8b156da7c2adfd5fa9d40053a07338a1480434b1', name: "app-bar-controls" })))), index.h("div", { key: '0b4579d78afefd3b85b90d0cef8707e778744ffa', class: "app-layout__banner" }, index.h("slot", { key: '689ccbd5956315c652b3ce5324983c0e8c6c7f82', name: "banner" })), index.h("div", { key: '10797e673aa548b3e3891f6ac52ba3192af4a0b3', class: "app-layout__content", onScroll: this.onContentScroll, ref: (el) => (this.contentEl = el) }, index.h("slot", { key: '7e7a12ce18cf8253aa2635cca54cefeb67ca739b', name: "content" })), index.h("div", { key: 'f72168b8c94062f8308ebd3b057200f8e573dd0a', class: "app-layout__bottom-bar" }, index.h("slot", { key: '01c84573749948a602bea15202a421e9207f2406', name: "bottom-bar" }))), index.h("aside", { key: '98fc39d9398c704382c9eda5ff8ecd480f560458', class: "app-layout__sidebar" }, index.h("header", { key: '51d7d5da2a7c49a2b7f2e40075439b7c67528fd6', class: "app-layout__custom-sidebar-header" }, index.h("slot", { key: '3118ca488b32ff7a41a257d81bb0bcaee0223b8d', name: "custom-sidebar-header" })), index.h("header", { key: '22ce181e892eaf567682756c22091ec67fa79a6e', class: "app-layout__sidebar-header" }, index.h("swirl-button", { key: 'dd49fc0e2b3eb997250cf74b10b87eb0f7a3361c', 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: '3b9efe7bc6f5fdb423860806387843790c4d81f6', as: "h3", class: "app-layout__sidebar-heading", headingId: "sidebar-heading", level: 3, text: this.sidebarHeading })), index.h("div", { key: 'd251b48e76f0b4439f2de573cdd99fc22e98d141', class: "app-layout__sidebar-content", onScroll: this.onSidebarScroll, ref: (el) => (this.sidebarEl = el) }, index.h("slot", { key: 'ff32199befe85da72ba7f135ab2e14979f714183', name: "sidebar" }))), index.h("span", { key: 'b523374e50d55d49ae969d9dba0664b4c3d16229', class: "app-layout__floating-action-button" }, this.ctaLabel && (index.h("swirl-button", { key: '6cd1a016a4ddff57117e55acf16e348f310ed4a4', hideLabel: Boolean(this.ctaIcon), icon: this.ctaIcon, intent: "primary", label: this.ctaLabel, onClick: this.onCtaClick, variant: "floating" })), index.h("slot", { key: 'db7051c0e81d62907746be98d713771e27cb0326', 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: '6bfc54d84f45480a5b54736763f147c2b7fb7f7f' }, index.h("div", { key: '4a4fa841cabf67c3a6d8e33924821f7d7cb71efb', class: className }, this.illustration && !hasSlottedIllustration && (index.h("img", { key: '14b1f1d7670cdbb98f0519a1a9ca5250c8674942', alt: "", class: "empty-state__illustration", src: this.illustration })), index.h("div", { key: '265b51870b0baf971ae883201b9e8c91272f3e5d', class: "empty-state__slotted-illustration" }, index.h("slot", { key: '4ff434e86a95ef5f2eb8780dd6af4b07cd277044', name: "illustration" })), index.h("div", { key: 'e76e06dff72c76a9ee3ad82ea50d9dffd3c92e43', class: "empty-state__body" }, index.h("swirl-stack", { key: '640f0bbfc929d259034ba56b163ffe0d2668de55', align: "stretch", spacing: "8" }, this.heading && (index.h("swirl-heading", { key: '617eb955f35ed844abd71b5edd72e4197c5dbf63', align: "center", as: "p", level: 4, text: this.heading })), index.h("div", { key: '9d25561e40f954711e8241cf1acc8dedfab81362', class: "empty-state__content" }, index.h("swirl-text", { key: '31a111081b467af164755021d1521692f2aaa108', align: "center", color: "subdued" }, index.h("slot", { key: 'cf37b1da356651ce2aca52d1ad653f0bfdb0fa44' })))), index.h("div", { key: '21a53fc474e0fb5f9b74836b81e09c1042b97635', class: "empty-state__controls" }, index.h("slot", { key: '84d8519b5e69894b1f2162fef80c4e7ce0513e9c', name: "controls" }))))));
+        return (index.h(index.Host, { key: '6fd342665b5b403286eac3941f1cd7728bc95399' }, index.h("div", { key: '5041edc31be2635f851fe8e4e2a29f07854ecdf6', class: className }, this.illustration && !hasSlottedIllustration && (index.h("img", { key: 'db0325e5facde952517650a9fa266dee594122ca', alt: "", class: "empty-state__illustration", src: this.illustration })), index.h("div", { key: '1cb27589bb93cba13a248be90623bf81d64b75c6', class: "empty-state__slotted-illustration" }, index.h("slot", { key: 'e7f556576a4394e96d89a2b81645ad99533be933', name: "illustration" })), index.h("div", { key: 'f09590b2bcdc46eaa089511897ce308c3d62254d', class: "empty-state__body" }, index.h("swirl-stack", { key: '3edbed259af55f7d5ec6b4d5b5e5d9420f2f1cbb', align: "stretch", spacing: "8" }, this.heading && (index.h("swirl-heading", { key: 'ea37ca571cb1ebc4d116dfb19a647a89c041c11d', align: "center", as: "p", level: 4, text: this.heading })), index.h("div", { key: '85223085648ed2989214785503f79eb4a6f947b0', class: "empty-state__content" }, index.h("swirl-text", { key: 'fce26928b3651f56dd4bb9a37e86b9a17903a5c4', align: "center", color: "subdued" }, index.h("slot", { key: 'e888f6679cb8a44ba80d69b5ec9db699d70ebdd0' })))), index.h("div", { key: '6143252588db52a4c6354a3a34cf689d8518824c', class: "empty-state__controls" }, index.h("slot", { key: 'bdbd8a067023afa7ec8f8b351b71f11bb88bf547', 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: 'dd61d0673ce3fd89c292b5605aef4ed252a7ba8d', "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: '331b81d2a635d7885ebb114536395cc5f1df322a' }, index.h("path", { key: '0eefa569cce03cbbe44811c30a1b47920d7907c9', 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: '966034831634f52e6330f065e68c83e93b4c3dee' }, index.h("path", { key: 'a82e22567168186716ccd8c608557ed6327ce818', 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: 'ea112049b2f9d941395c2233e21d6ae8e996137b' }, index.h("path", { key: '5975c3b8a5cdfa6b063dcd0e006902905c20d8a0', 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: '9989ae58d7e8a4d9230398d33373fa1a4cb85c07', "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: '0e18c632aa5f131b05fb7a805d8d947d48545643' }, index.h("path", { key: '6882c9ede67ae3bc9889a1cf779ec485970d3475', 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: '3b7b3bf040634c3179b33a2862397ca3decec95e' }, index.h("path", { key: '231c4c49a37aaf522fef798e330c753cf619e9e7', 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: 'a965db082edfd4fc0430a0f4d6711cd81ada0850' }, index.h("path", { key: '7bf44fe5bdad3b8b84f1d0d0d8968c06bdec6bbb', 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: 'b829d882a0389d7795d3055286a28c98609a61a8', onKeyDown: this.onKeyDown }, index.h("swirl-visually-hidden", { key: '7b0b44f4292f766a90f2e8c5aed9239a58797e98', role: "alert" }, this.assistiveText), index.h("swirl-box", { key: '92e9416067806de8ef2604dd6b370dc62fa69a6c', paddingInlineEnd: "8", paddingInlineStart: "8" }, index.h("swirl-stack", { key: 'd7fcfeeec899efce5cf7f3854abd10c86dce1f11', "aria-label": this.label, class: "resource-list", id: this.listId, ref: (el) => (this.gridEl = el), role: "grid", spacing: this.spacing }, index.h("slot", { key: '0b659d70063658be470c269bc72a3c2c0d8d3455' })))));
+        return (index.h(index.Host, { key: '07a472a8a7bcb02703c483c0ad755d9d787acb5c', onKeyDown: this.onKeyDown }, index.h("swirl-visually-hidden", { key: 'f14c34e2922d82431f0de15aea599d9c61d0a195', role: "alert" }, this.assistiveText), index.h("swirl-box", { key: 'f58048586f6f46a678db400bf3e3ed9af21b38b0', paddingInlineEnd: "8", paddingInlineStart: "8" }, index.h("swirl-stack", { key: 'ead6286f509dc5874e3492624a79f0c9ec1a6879', "aria-label": this.label, class: "resource-list", id: this.listId, ref: (el) => (this.gridEl = el), role: "grid", spacing: this.spacing }, index.h("slot", { key: 'fdf20fb257cfc1df4e8c307a4368acfa13bc06ad' })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -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: 'fc15e85b085941445aa3a2a7d71ccdd0ea6af19c', role: "row" }, index.h("div", { key: 'a0553e63ce1299e5a62057ca9f1990ec9671ed77', class: className, role: "gridcell" }, index.h(Tag, { key: '9f4014a9ccd2a7ac4bcd68e01bdd1768422d609e', "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: 'b02811e97da3b6a5dc9f787272b8227c6207c687', class: "resource-list-item__media" }, index.h("slot", { key: 'f4d86546da5d2cfca9c228fef25d991ac260948d', name: "media" }))), index.h("span", { key: '2355aca510e6951620e1ea34da2eef27d2a207a4', class: "resource-list-item__label-container", style: labelContainerStyles }, index.h("span", { key: 'fb39dda628c00db225bf1ee452bf0a166db1de8d', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (index.h("span", { key: 'a916f5124b9c8ff2e6b601280a3175f1349e939f', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (index.h("span", { key: '73258750157de4e94d14e4956782c8cf83555db0', class: "resource-list-item__meta" }, index.h("span", { key: 'c29f3b509061f2e40dcebf71a8f13897c6092fa2', class: "resource-list-item__meta-text" }, this.meta), index.h("span", { key: 'f7ed8f082b3ef7804650ce8c86adc5911cabfe7c', class: "resource-list-item__badges" }, index.h("slot", { key: '9dfeb082eec0328d2e08027a6c723b280dbc1a19', name: "badges" }))))), this.selectable && (index.h("span", { key: 'e857a822d88fd2d01559bc8c35eaf96cdd77488e', "aria-hidden": "true", class: "resource-list-item__checkbox" }, index.h("span", { key: 'c98486bf0496467b27e7c6633b00105846cb84a3', class: "resource-list-item__checkbox-icon" }, this.checked && (index.h("swirl-icon-check-strong", { key: 'b5b256bc8bde87f39a620510f7b547daab125ac0' }))))), index.h("span", { key: 'b029706236061019e32aa417dfcdc33811a9b559', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, index.h("slot", { key: '68ff8e77665fedf97a235ae23533ee362ad48163', name: "control" })), showMenu && (index.h("swirl-popover-trigger", { key: '961689dbb84882471844552db3b6253123ded392', swirlPopover: this.menuTriggerId }, index.h("swirl-button", { key: '2cd065fc916c630ce66ccc75ceac6b71f745ee0d', "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: 'aea77ee92742ffe9059496a8e67949e4c92f5f2d', "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: '3c6a964e10d9bf676fac8ad3d75ea366088c0d83', size: this.iconSize })))));
+        return (index.h(index.Host, { key: '157d4fc9cba405bb31a8cb05407427afbefebb51', role: "row" }, index.h("div", { key: '55163da3bb7467cb2e55b22649c857ebba8cf3bb', class: className, role: "gridcell" }, index.h(Tag, { key: 'f72a323c58fd8dd2a02ecfa773f438e25e20aa19', "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: 'e0daee03791106cb35b354f83ca66f1b434f8dc7', class: "resource-list-item__media" }, index.h("slot", { key: '8b2812557c5778cc77e1e224dbfc58a8365202c4', name: "media" }))), index.h("span", { key: 'debf86b9b7b5df6e944cb9e62bf61626ca469f21', class: "resource-list-item__label-container", style: labelContainerStyles }, index.h("span", { key: 'dffbea7a465e5c0bf7fd6c5410e83daddfb3acea', class: "resource-list-item__label", id: this.elementId, innerHTML: this.allowHtml ? this.label : undefined }, !this.allowHtml && this.label), this.description && (index.h("span", { key: 'fb12e69166e4981e643a7c10709138a349fed78d', class: "resource-list-item__description", innerHTML: this.allowHtml ? this.description : undefined }, !this.allowHtml && this.description))), showMeta && (index.h("span", { key: 'b086cca27c69ed8d7410b274fa5132e5a0ff2fa5', class: "resource-list-item__meta" }, index.h("span", { key: '5adda4d904035658783411cb568b20560ad670fc', class: "resource-list-item__meta-text" }, this.meta), index.h("span", { key: 'acd7b96926d0922728990a4867bbf1dae4785249', class: "resource-list-item__badges" }, index.h("slot", { key: 'b1d5013e66c771f77112044663d664456e01d833', name: "badges" }))))), this.selectable && (index.h("span", { key: 'a35df9328d978ded4b10b7c72fd33642ab9994c4', "aria-hidden": "true", class: "resource-list-item__checkbox" }, index.h("span", { key: '89a4ffe0830737606c4899d8b1d80ca586aaf351', class: "resource-list-item__checkbox-icon" }, this.checked && (index.h("swirl-icon-check-strong", { key: 'f3df832b9f0beca06f9bd1e1e9628de20ae96f0a' }))))), index.h("span", { key: '01fa67e1edbe005dc754dd4a4d008dc0246c2b85', class: "resource-list-item__control", onClick: this.onControlClick, ref: (el) => (this.controlContainer = el) }, index.h("slot", { key: '6716e77c8ad2654684c306f33102be7c52f25eea', name: "control" })), showMenu && (index.h("swirl-popover-trigger", { key: '2c56ac7fbf140c1a917e2dac77fb127b391a2d5d', swirlPopover: this.menuTriggerId }, index.h("swirl-button", { key: '0d0803fedb6400d80b31500faffb2f0a24cbabb2', "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: 'b266295b821e8610e977d00123bb0e38d20d034f', "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: '0a42e8696eee548149f46812ae0bc567613bf512', size: this.iconSize })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-autocomplete.cjs.entry.js CHANGED Viewed

@@ -210,17 +210,17 @@ const SwirlAutocomplete = class {
         const className = index$1.classnames("autocomplete", {
             "autocomplete--inactive": !this.active,
         });
-        return (index.h(index.Host, { key: '6ac4eb7a1f520ca9292004fb07da32ada3268808' }, index.h("div", { key: '4a5d55d90fa0ab8387f67b30dca24225c577b32f', class: className, onKeyDown: this.onKeyDown }, this.multiSelect &&
+        return (index.h(index.Host, { key: '7ccdc5bbc34c0b67dd4bc43558672bfcaa925370' }, index.h("div", { key: '5db7afde57cedcd7f2f76cf3d3bf41ea3d1121f7', class: className, onKeyDown: this.onKeyDown }, this.multiSelect &&
             Array.isArray(this.value) &&
-            this.value.length > 0 && (index.h("div", { key: 'a22265baff3265c999a162647c2216ea5cb1969e', class: "autocomplete__multi-select-tags" }, index.h("swirl-stack", { key: '5619bc2bd934857c663efd58c91b9eaaf0207e63', orientation: "horizontal", spacing: "8", wrap: true }, this.value.map((item) => {
+            this.value.length > 0 && (index.h("div", { key: '99b003b46ce6aca813468233ec46b9746afd5863', class: "autocomplete__multi-select-tags" }, index.h("swirl-stack", { key: 'ad3f43e26a3ee67ffc1fa4a980d8a8a412f89787', orientation: "horizontal", spacing: "8", wrap: true }, this.value.map((item) => {
             return (index.h("swirl-tag", { key: item.id, label: item.label,
                 // eslint-disable-next-line react/jsx-no-bind
                 onRemove: () => this.onRemoveValue(item.id), removable: !this.disabled }));
-        })))), index.h("swirl-text-input", { key: 'a691e9b3aa419b8bdf3a0927d4ae171ada91aecf', autoSelect: this.autoSelect, class: "autocomplete__input", clearable: clearable, clearButtonLabel: this.clearButtonLabel, disabled: this.disabled, disableDynamicWidth: true, id: this.id, inline: this.inline, invalid: this.invalid, onInputFocus: this.onFocus, onKeyDown: this.onInputKeyDown, onValueChange: this.onChange, maxLength: this.maxLength, mode: this.mode, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, spellCheck: this.spellCheck, swirlAriaAutocomplete: "list", swirlAriaControls: suggestionsMenuId, swirlAriaDescribedby: this.swirlAriaDescribedby, swirlAriaExpanded: String(this.active), swirlRole: "combobox", value: valueLabel }), index.h("div", { key: 'd6d85b173b4b889422deed9d26b2a3edd2558383', class: "autocomplete__listbox-container", onFocusout: this.onFocusOut, ref: (el) => (this.listboxContainerEl = el), style: {
+        })))), index.h("swirl-text-input", { key: 'b81c39bc6b02321f9ec1da7510e1ff5fefacf6eb', autoSelect: this.autoSelect, class: "autocomplete__input", clearable: clearable, clearButtonLabel: this.clearButtonLabel, disabled: this.disabled, disableDynamicWidth: true, id: this.id, inline: this.inline, invalid: this.invalid, onInputFocus: this.onFocus, onKeyDown: this.onInputKeyDown, onValueChange: this.onChange, maxLength: this.maxLength, mode: this.mode, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, spellCheck: this.spellCheck, swirlAriaAutocomplete: "list", swirlAriaControls: suggestionsMenuId, swirlAriaDescribedby: this.swirlAriaDescribedby, swirlAriaExpanded: String(this.active), swirlRole: "combobox", value: valueLabel }), index.h("div", { key: 'e78b9b6e1179036e2c6133fab4e88e929450ba26', class: "autocomplete__listbox-container", onFocusout: this.onFocusOut, ref: (el) => (this.listboxContainerEl = el), style: {
                 top: Boolean(this.position) ? `${this.position?.y}px` : "",
                 left: Boolean(this.position) ? `${this.position?.x}px` : "",
                 width: `${this.inputEl?.getBoundingClientRect().width + 32}px`,
-            } }, this.loading && (index.h("div", { key: '61d3b7a03a79c66c7dbb8885ff3a95d57badc19f', class: "autocomplete__spinner" }, index.h("swirl-spinner", { key: '666f366558c17cb9d57fdc36ddaf95862706d04c' }))), this.suggestions.length > 0 && (index.h("swirl-option-list", { key: 'db951c479c16b6fe1ead86e5c46de0431237937f', allowDeselect: this.multiSelect === true, label: this.menuLabel, multiSelect: this.multiSelect, onValueChange: this.onSelect, optionListId: suggestionsMenuId, ref: (el) => (this.listboxEl = el), value: optionListValue }, this.suggestions.map((suggestion) => (index.h("swirl-option-list-item", { selected: Array.isArray(this.value)
+            } }, this.loading && (index.h("div", { key: '464609dbec26c61919d20b617afc2c8b2bb2a1ae', class: "autocomplete__spinner" }, index.h("swirl-spinner", { key: '57467b10cf6732da9d3e913994cad372cfc4bdbe' }))), this.suggestions.length > 0 && (index.h("swirl-option-list", { key: '2e377e61b4dc64f51d48f73f4f92ffee8fc5816e', allowDeselect: this.multiSelect === true, label: this.menuLabel, multiSelect: this.multiSelect, onValueChange: this.onSelect, optionListId: suggestionsMenuId, ref: (el) => (this.listboxEl = el), value: optionListValue }, this.suggestions.map((suggestion) => (index.h("swirl-option-list-item", { selected: Array.isArray(this.value)
                 ? this.value.some((item) => item.id === suggestion.id)
                 : this.value?.id === suggestion.id, key: suggestion.id, disabled: suggestion.disabled, label: suggestion.label, value: suggestion.id })))))))));
     }

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

@@ -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: '8b1974dc2a231ee1de52209f9e5ae412f0f8011d' }, index.h("div", { key: 'bae70688b047700541351d086a730cea828265e4', class: className, role: "group" }, index.h("slot", { key: '49eaf6ad73bc4aaefdae4c2b453449e34496085c' }), this.badge && (index.h("span", { key: 'ffbd195fd9b470ad199e5ca3526b6d8457fa70a0', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
+        return (index.h(index.Host, { key: 'b002259b0fc555dd7c6d88e81be0b47eb990397d' }, index.h("div", { key: '3ebd30115f4866b87d995015f0e16bda6dbb4ad5', class: className, role: "group" }, index.h("slot", { key: '806e160bf43e964c3ac05db900b62d0bf420a903' }), this.badge && (index.h("span", { key: 'e40106fa24b4751600ac71bfcb4e1ebf338e2fc8', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
     }
 };
 SwirlAvatarGroup.style = SwirlAvatarGroupStyle0;

package/dist/cjs/swirl-avatar.cjs.entry.js CHANGED Viewed

@@ -110,7 +110,7 @@ const SwirlAvatar = class {
         });
         const badgeClassName = index$1.classnames("avatar__badge", `avatar__badge--position-${this.badgePosition}`);
         const toolClassName = index$1.classnames("avatar__tool", `avatar__tool--position-${this.toolPosition}`);
-        return (index.h(index.Host, { key: '15278a114f52a9f68d0bf7f1f6fa30e7fa937649', "aria-label": this.interactive ? this.label : undefined, onKeydown: this.interactive ? this.onKeydown : undefined, onKeyup: this.interactive ? this.onKeyup : undefined, role: role, tabIndex: this.interactive ? 0 : undefined }, index.h("span", { key: 'e31108d3217700983679b19317768f2de000f4cd', class: className, part: "avatar" }, showImage && (index.h("span", { key: '004a6eb9195d75aa32097aeb8324910ea2b03579', class: "avatar__image" }, index.h("img", { key: '27249340a3715ba3440ab6d0687457d9a41a38e2', alt: "", height: swirlAvatarSizeMappings[this.size], loading: this.loading !== "intersecting" ? this.loading : undefined, onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: swirlAvatarSizeMappings[this.size] }))), showInitials && (index.h("span", { key: '4d1545a4fdda13d56727a4fd66ffe7835d9a8745', class: "avatar__initials" }, index.h("span", { key: '0b2b97fc6403d2f8cedbef447838b1e7d88a21a6' }, this.initials))), showIcon && index.h("span", { key: '53c2ecde366fa25580a9c68fdf1c9648a48ce7d1', class: "avatar__icon", innerHTML: this.icon }), showFallbackIcon && (index.h("span", { key: '14a9f49eaf1085146ed32777bf198a506d29ea47', class: "avatar__icon" }, index.h("swirl-icon-person", { key: 'e252ae666d81bb9854e0285e5b2ad029151a5cec' }))), showBadge && (index.h("span", { key: '69bbc5582ebdccc744a88f03a201899056a25b54', class: badgeClassName, innerHTML: this.badge })), index.h("span", { key: '929ebb5406c2c2fa2ab5ff7717f20ba0a15e35f2', class: toolClassName }, index.h("slot", { key: 'bd2d4989f989ac54c08b23ff18297a728d4eb9cb', name: "tool" }))), this.showLabel && (index.h("span", { key: '39d12f1d8e5a480e2c4bd51907198d224f6b2cc0', "aria-hidden": true, class: "avatar__label" }, this.label))));
+        return (index.h(index.Host, { key: '56ebefc98134484870d719fda35e05d311716032', "aria-label": this.interactive ? this.label : undefined, onKeydown: this.interactive ? this.onKeydown : undefined, onKeyup: this.interactive ? this.onKeyup : undefined, role: role, tabIndex: this.interactive ? 0 : undefined }, index.h("span", { key: 'd6a8354aeb6d7e8ae7a01de79f66fc481d0627ed', class: className, part: "avatar" }, showImage && (index.h("span", { key: '212b277b9361c2935a4a937cda716bbd5f79afa6', class: "avatar__image" }, index.h("img", { key: 'd037a0e2ee08c7a324383ca075be9fa21e1bfbeb', alt: "", height: swirlAvatarSizeMappings[this.size], loading: this.loading !== "intersecting" ? this.loading : undefined, onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: swirlAvatarSizeMappings[this.size] }))), showInitials && (index.h("span", { key: '08f7d449924aa06a5429668cdc8ca1b9aff81212', class: "avatar__initials" }, index.h("span", { key: '96c8725ee16bc7334675c44541aea46a50670bb4' }, this.initials))), showIcon && index.h("span", { key: '0e1794e27361d8b5a1c52fd604fd9e7d037ffbdb', class: "avatar__icon", innerHTML: this.icon }), showFallbackIcon && (index.h("span", { key: 'ab06d6de3e3a501d66f4584ecc36179158c145a6', class: "avatar__icon" }, index.h("swirl-icon-person", { key: 'ba5d839ad1e4f6229ecd9dcef13d7150407dcc65' }))), showBadge && (index.h("span", { key: '956fad51793775322e5b608ea4226029ebe21d78', class: badgeClassName, innerHTML: this.badge })), index.h("span", { key: 'ea68303bb71630ef8e08985a45ecddb6102e1e04', class: toolClassName }, index.h("slot", { key: 'ae8b5bddf5231b0ea69fae465d73485affa9f430', name: "tool" }))), this.showLabel && (index.h("span", { key: '40236aaed6670ed3359ee656837d54b54323a0a8', "aria-hidden": true, class: "avatar__label" }, this.label))));
     }
     get element() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-badge.cjs.entry.js CHANGED Viewed

@@ -21,7 +21,7 @@ const SwirlBadge = class {
         const className = index$1.classnames("badge", `badge--intent-${this.intent}`, `badge--size-${this.size}`, `badge--variant-${this.variant}`, {
             "badge--has-icon": this.icon,
         });
-        return (index.h(index.Host, { key: '7ec199a85eb07c43407da840c5b1964c86291e00', role: "status" }, index.h("span", { key: 'a7304947718959455a295168b5a3923d619c035d', class: className, part: "badge" }, this.icon && index.h("span", { key: 'e9c1845f11ee7f0f3f74d2bf9158b28bed1cb0ed', class: "badge__icon", innerHTML: this.icon }), this.icon === undefined && this.variant !== "dot" ? (index.h("span", { class: "badge__label" }, this.label)) : (index.h(index.Fragment, null, this.icon === undefined && (index.h("span", { class: "badge__label" }, "\u00A0")), index.h("swirl-visually-hidden", null, this.label))))));
+        return (index.h(index.Host, { key: 'bae92c831dde2b32bfa7261d43afa1535c8e2e52', role: "status" }, index.h("span", { key: 'b0fae374f4fb64a1f08644f87583a4f566b0a37f', class: className, part: "badge" }, this.icon && index.h("span", { key: 'b315a6e43dd61d71651417182df6a1ca5f9d6241', class: "badge__icon", innerHTML: this.icon }), this.icon === undefined && this.variant !== "dot" ? (index.h("span", { class: "badge__label" }, this.label)) : (index.h(index.Fragment, null, this.icon === undefined && (index.h("span", { class: "badge__label" }, "\u00A0")), index.h("swirl-visually-hidden", null, this.label))))));
     }
 };
 SwirlBadge.style = SwirlBadgeStyle0;

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

@@ -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: 'fcbf3df259fdc2f6a1a87a9156f87c576a28bda8' }, index.h("div", { key: 'eb8cff02af80842164c9f4b9867e4c684fc76825', "aria-describedby": "content", class: className, role: this.importance, tabIndex: 0 }, index.h("div", { key: 'd114781c6d652f7bf1ef575cc5d357e7962eb9b8', class: "banner__content", id: "content", part: "banner__content" }, showIcon && (index.h("span", { key: '01ac20daad7dd1452bb8325e6b619c7697f4800e', "aria-hidden": "true", class: "banner__icon", innerHTML: icon, ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'b5614f90d8ce542046a9f7caceeeb117a2770d20', class: "banner__text" }, this.content)), showControls && (index.h("div", { key: 'a05e4bed3bf3fb3982a89dd71b2feb335fcb9322', class: "banner__controls" }, this.actionLabel && (index.h("button", { key: '3f0b7a87f1fdcb5efd3ac0dc6d4ef7101ae21013', class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel)), this.dismissable && (index.h("button", { key: '5ce2751d784bdc4d0839924cd38d6105329088bf', "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: '4ee74722160180d6cf5371f5f009f3f423b08bf6' }))))))));
+        return (index.h(index.Host, { key: 'e738d297a3c16fec81cb03bbcc0eec4b18fffe10' }, index.h("div", { key: '731ebb82ec0f46beea8aca6b9dbc305f18cab5ce', "aria-describedby": "content", class: className, role: this.importance, tabIndex: 0 }, index.h("div", { key: 'f817862b889d81a440725024a2632a8a532e425b', class: "banner__content", id: "content", part: "banner__content" }, showIcon && (index.h("span", { key: '3022fbf7fc75fa93e5c01cc2697f0276d7d39618', "aria-hidden": "true", class: "banner__icon", innerHTML: icon, ref: (el) => (this.iconEl = el) })), index.h("span", { key: '89e76fcf3bd2099011359bfc27d02f3e06a34959', class: "banner__text" }, this.content)), showControls && (index.h("div", { key: '8e46586058861b274a00b7872c16858a2685bb1b', class: "banner__controls" }, this.actionLabel && (index.h("button", { key: '508bd8be18739c3c02309b31ed7e3c5053095a3c', class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel)), this.dismissable && (index.h("button", { key: '8bea66c5271fd11dea470ffc61b33bd476170aa3', "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: 'a9fbe97bcddf9cef64d2b97adb92f97c943d05d9' }))))))));
     }
     get element() { return index.getElement(this); }
 };

package/dist/cjs/swirl-box.cjs.entry.js CHANGED Viewed

@@ -120,7 +120,7 @@ const SwirlBox = class {
             "box--scrolled-to-top": this.scrollState.scrolledToTop,
             "box--scrolled-to-bottom": this.scrollState.scrolledToBottom,
         });
-        return (index.h(index.Host, { key: '31f4331552b01e796f7923ebc8a302a97cc499df', class: className, onScroll: this.onScroll, style: styles }, index.h("slot", { key: '1b8c8c79e009617e311203b6d004a7e4e25bd211' })));
+        return (index.h(index.Host, { key: '1fba3acf95ec0fcd18a7efe25fcc17344f8a576e', class: className, onScroll: this.onScroll, style: styles }, index.h("slot", { key: '75059cde1d626d95784e32b76498d9f659c41386' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-button-group.cjs.entry.js CHANGED Viewed

@@ -22,11 +22,11 @@ const SwirlButtonGroup = class {
         const className = index$1.classnames("button-group", {
             "button-group--segmented": this.segmented,
         });
-        return (index.h(index.Host, { key: 'a32468ae01627af933623c22b640fa3f50b4d068' }, index.h("swirl-stack", { key: '1b2951f02b3171bc556dbb7e24b9fefefe74a791', align: this.orientation === "vertical" && this.stretch
+        return (index.h(index.Host, { key: '9d7e0ea4b44869f77fa372f4ae4621b9f9dfe8dd' }, index.h("swirl-stack", { key: '6fbf8996d24abf7adbaa39d23b3db4eaa2b1bc60', align: this.orientation === "vertical" && this.stretch
                 ? "stretch"
                 : "start", class: className, justify: this.orientation === "horizontal" && this.stretch
                 ? "stretch"
-                : "start", orientation: this.orientation, role: "group", spacing: spacing, wrap: this.wrap }, index.h("slot", { key: 'ced53e457fce3021ec5a1bcca7099b709e6d52df' }))));
+                : "start", orientation: this.orientation, role: "group", spacing: spacing, wrap: this.wrap }, index.h("slot", { key: '6b9ba670905fae3fca44b764be75208ae03c9714' }))));
     }
 };
 SwirlButtonGroup.style = SwirlButtonGroupStyle0;

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

@@ -100,9 +100,9 @@ const SwirlButton = class {
             "button--pressed": this.pressed,
         });
         const Tag = isLink ? "a" : "button";
-        return (index.h(index.Host, { key: '67c5602db91b6efe4a7218dff1357b9a0dbb05ce', style: { pointerEvents: this.disabled ? "none" : "" } }, index.h(Tag, { key: '5ccb8f4d84207fedef3e99d3109ba46e75c6179f', "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: '635a1065811fc352a9be9a8afcd3214a9650282d', style: { pointerEvents: this.disabled ? "none" : "" } }, index.h(Tag, { key: 'ff06cd64a1d8eea339c9ab0afea3e69623bd1b2f', "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: '8136de46e80e1ece4412b21a91d80387b1beffe3', class: "button__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !Boolean(this.icon) && (index.h("span", { key: 'f5b65971de71a8cec64e65a9e8f32457b3ff7935', class: "button__icon", ref: (el) => (this.iconEl = el) }, index.h("slot", { key: 'f5772e810bf6c0525f6f09c004b68cb473ed9a3c', name: "icon" }))), !hideLabel && index.h("span", { key: 'e8af5f9bb49bcf10cb72540fe3d953612d33851e', class: "button__label" }, this.label), hasTag && (index.h("span", { key: '58839bee6bf483cc383c8051f59cc8dd25e496a8', class: "button__tag" }, index.h("slot", { key: 'fd6b3171b0ecf275e15e333524edf980e0517860', name: "tag" }))))));
+                : {} }, Boolean(this.icon) && (index.h("span", { key: '51b0054616c9b26f5217591384fcef5f634d0a07', class: "button__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !Boolean(this.icon) && (index.h("span", { key: '18bf3a811562dbb9489d9fae2fb192b7e178bad1', class: "button__icon", ref: (el) => (this.iconEl = el) }, index.h("slot", { key: '40d9cf93df9ff77687d3410ef1a4178a7a82a627', name: "icon" }))), !hideLabel && index.h("span", { key: 'd629db6c30a294022b29ae2ba1214e22f5581a53', class: "button__label" }, this.label), hasTag && (index.h("span", { key: '1e11954dd364ba68414048dd133b0429c049964a', class: "button__tag" }, index.h("slot", { key: '07bfc30e7f989e134e5733ba0c3c2251d1668a51', name: "tag" }))))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-card.cjs.entry.js CHANGED Viewed

@@ -89,9 +89,9 @@ const SwirlCard = class {
             "card--interactive": this.interactive || this.href,
             "card--is--borderless": this.isBorderless,
         });
-        return (index.h(index.Host, { key: '4f3f5a5071de38d0e5e61db11f7ffae8ca1c73e7', styles: { height: this.height } }, index.h(Tag, { key: 'bf957c91919f3465f467fc18167e1c34dee5e310', "aria-label": this.swirlAriaLabel, "aria-labelledby": this.swirlAriaLabelledby, class: className, href: this.href, rel: Boolean(this.href) && this.linkTarget === "_blank"
+        return (index.h(index.Host, { key: '9a0dc5d885be38ee2e94c7641257eb018e258ad3', styles: { height: this.height } }, index.h(Tag, { key: 'd863db3119f975a3f96e679b5a164c1ed792177c', "aria-label": this.swirlAriaLabel, "aria-labelledby": this.swirlAriaLabelledby, class: className, href: this.href, rel: Boolean(this.href) && this.linkTarget === "_blank"
                 ? "noreferrer"
-                : undefined, style: styles, target: this.linkTarget }, index.h("div", { key: 'fd3c0ab76e5710e1a36b5d637a49b49913c2eec4', class: "card__image", style: { aspectRatio: this.imageAspectRatio } }, index.h("slot", { key: '07be5fcc88f997b3f857dce8654be2bae6793723', name: "image" })), index.h("div", { key: 'ae0dd7f377ed5d2dd4701824c7cd0d22a63359e5', class: "card__body", style: bodyStyles }, index.h("div", { key: '716fd0468a3864bde4b67f6f2921ca04f8ce56b6', class: "card__content" }, index.h("slot", { key: '988e0aabbbe450703688a2fdb71a91103bed7484', name: "content" }))))));
+                : undefined, style: styles, target: this.linkTarget }, index.h("div", { key: '02f660fa638a355f0bf9cc3fb57a9f728df27ef9', class: "card__image", style: { aspectRatio: this.imageAspectRatio } }, index.h("slot", { key: '73c1a1cf4914865e23f5dc0a37d298b226673040', name: "image" })), index.h("div", { key: 'ed7413be702708dc44ed0b54c052602ec46aef43', class: "card__body", style: bodyStyles }, index.h("div", { key: '0ac40a967d3a3df98cb2094b9bbc76ef59c4c5d5', class: "card__content" }, index.h("slot", { key: 'beea6852b0cd7c32430e42c7bab74ae6990ec37f', name: "content" }))))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -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: '98ebeeaf4beb6d66cc8bb360a2119f9db6bc1e36', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, index.h("slot", { key: '5b88284bf48d0ca280696c1033e2344fc01f151f' })));
+        return (index.h(index.Host, { key: '8e51a221c5008156f57a983719cb0f4e89309975', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, index.h("slot", { key: '68acc357fb4c3ea6f69e12e946e3cd13234b4fdf' })));
     }
 };
 SwirlCarouselSlide.style = SwirlCarouselSlideStyle0;

package/dist/cjs/swirl-carousel.cjs.entry.js CHANGED Viewed

@@ -147,7 +147,7 @@ const SwirlCarousel = class {
             "carousel--is-at-start": this.isAtStart,
             "carousel--is-at-end": this.isAtEnd,
         });
-        return (index.h(index.Host, { key: 'dc282887cedadc493fda9f71fd249cb62a0efd3f', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, index.h("div", { key: 'f48fab6833ba11a2493513b8b2fbfd28c5c62339', class: className }, this.isScrollable && !this.isAtStart && (index.h("swirl-button", { key: 'fdeb6ff51115359928fbce0d58c7c74ec0bb606a', class: "carousel__previous-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: true, variant: "floating" })), this.isScrollable && !this.isAtEnd && (index.h("swirl-button", { key: '5a73745fb749bf9bbc5d1a8f511c2da0cccf26f1', class: "carousel__next-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: true, variant: "floating" })), index.h("div", { key: '247e8f2b15b9d37159f0a7faaca86db851310a18', "aria-live": "polite", class: "carousel__slides", style: slidesStyles, onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, index.h("slot", { key: '16d4b9884689f40d72a912466b0579042941b4b6', onSlotchange: this.onSlotChange })))));
+        return (index.h(index.Host, { key: '8c8ca585ecff7b41f8dfdc9e66bbcec0ed60a20e', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, index.h("div", { key: 'e6370b762f1822d608c395a1ab5e257688b04de3', class: className }, this.isScrollable && !this.isAtStart && (index.h("swirl-button", { key: '7958568cc3a087979a061cc8ab8e920a4b4cc4c0', class: "carousel__previous-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: true, variant: "floating" })), this.isScrollable && !this.isAtEnd && (index.h("swirl-button", { key: 'faa888df896a1517ed6d4ad0ef411504fc9af373', class: "carousel__next-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: true, variant: "floating" })), index.h("div", { key: '4ec9cec82b7d3b57c27606ba147147fee4908009', "aria-live": "polite", class: "carousel__slides", style: slidesStyles, onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, index.h("slot", { key: '751e7e966e6f7b5b6051a83cd566e96a46424526', onSlotchange: this.onSlotChange })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-checkbox.cjs.entry.js CHANGED Viewed

@@ -55,7 +55,7 @@ const SwirlCheckbox = class {
             "checkbox--invalid": this.invalid,
             "checkbox--unchecked": unchecked,
         });
-        return (index.h(index.Host, { key: '47e2bb1334f5370dc6733ce92e24c9561339077a', style: { width: this.variant === "card" ? "100%" : undefined } }, index.h("label", { key: '80abed84bb07d0a3949ab6619654653010d0fb97', class: className, htmlFor: this.inputId }, index.h("span", { key: '4be8a5ea2485614530f48930f01601ea69b8e429', class: "checkbox__control" }, index.h("swirl-visually-hidden", { key: '951b2431cb4b257b874a1398cd098572afef818c' }, index.h("input", { key: '3b9c896b18c5ab5566274d1651822fdd73a8716d', "aria-checked": ariaCheckedLabel, "aria-describedby": this.swirlAriaDescribedby, "aria-invalid": ariaInvalid, "aria-label": this.swirlAriaLabel, checked: checked, class: "checkbox__input", disabled: this.disabled, id: this.inputId, indeterminate: indeterminate, name: this.inputName, onChange: this.onChange, type: "checkbox", value: this.value })), index.h("span", { key: '240669d2a046ad4a233654e882ac7aafe7bd6cbf', "aria-hidden": "true", class: "checkbox__box" }, index.h("span", { key: 'e58d952cf7e5f8bda65d74e4ea99f98b30c55ab9', class: "checkbox__icon" }, checked && index.h("swirl-icon-check-strong", { key: '761aadd9c03b94f134c90f0b05f1feaf49aa8f89' }), indeterminate && (index.h("span", { key: '3c9042575b66be70f1f727425bd85c21e33e8377', class: "checkbox__indeterminate-icon" }))))), showLabelContainer && (index.h("span", { key: 'b5b9b877597a083a847e8fea977da5373eb85471', class: "checkbox__label-container" }, this.label && index.h("span", { key: '25eaf96669b412282e6805b42635c7630eb0c1ac', class: "checkbox__label" }, this.label), this.description && (index.h("span", { key: '2cf8b31a6d1d4860fb01cfce2421d5b0535ca45e', class: "checkbox__description" }, this.description)))))));
+        return (index.h(index.Host, { key: 'aac65bf193091a8bea9fba0400ba73214b59e3e0', style: { width: this.variant === "card" ? "100%" : undefined } }, index.h("label", { key: '07c5b04f6809c2a96796ae899305d6197e34948b', class: className, htmlFor: this.inputId }, index.h("span", { key: 'b6ff60df3a61f63c11880f553d65aef8aa5fd12f', class: "checkbox__control" }, index.h("swirl-visually-hidden", { key: 'c53b3f70f0137c69003fd7098b235fa2bcf37f33' }, index.h("input", { key: 'aacb2b661d7c7f90710b4c115730609a4e6305d2', "aria-checked": ariaCheckedLabel, "aria-describedby": this.swirlAriaDescribedby, "aria-invalid": ariaInvalid, "aria-label": this.swirlAriaLabel, checked: checked, class: "checkbox__input", disabled: this.disabled, id: this.inputId, indeterminate: indeterminate, name: this.inputName, onChange: this.onChange, type: "checkbox", value: this.value })), index.h("span", { key: 'ef9cc2b5a745021f67f78f985146e325da793e44', "aria-hidden": "true", class: "checkbox__box" }, index.h("span", { key: '07f423ba9b9a5b43b89114a7b9a09287197ba09f', class: "checkbox__icon" }, checked && index.h("swirl-icon-check-strong", { key: 'c2583703af27ed11acc996cf7e0beefc99149923' }), indeterminate && (index.h("span", { key: '90398aa1acb1cebf30ce3ae518ce8d0eec017410', class: "checkbox__indeterminate-icon" }))))), showLabelContainer && (index.h("span", { key: '5a5aaf43dcc186aa21934f5150f1f76445945a3d', class: "checkbox__label-container" }, this.label && index.h("span", { key: 'fee226c02adbd1b677a3e4657c0c8056c260daa4', class: "checkbox__label" }, this.label), this.description && (index.h("span", { key: '2e1bc11d4e655d1ca517531625ad2ea953753a07', class: "checkbox__description" }, this.description)))))));
     }
 };
 SwirlCheckbox.style = SwirlCheckboxStyle0;

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

@@ -57,7 +57,7 @@ const SwirlChip = class {
             "chip--interactive": this.interactive || this.pressed !== undefined,
             "chip--removable": this.removable,
         });
-        return (index.h(index.Host, { key: 'bf343033f4413d195c6746338678f0f7e8a8f766' }, index.h(Tag, { key: '97b2f2ee1db67797a6d7d56aa1b6729d62cc14b4', "aria-pressed": this.pressed !== undefined ? String(this.pressed) : undefined, class: className, onClick: this.chipClick.emit, type: this.interactive ? "button" : undefined }, index.h("span", { key: 'ba597b789fdcc9e459050b07689486d21927a9b4', class: "chip__inner" }, showAvatar && (index.h("span", { key: '78fa63d15badf26266d233b70e32efd028b1df74', class: "chip__avatar" }, index.h("slot", { key: '0a556db41ea252ec2b8bd6a4b68da0013e853d16', name: "avatar" }))), showIcon && (index.h("span", { key: 'd6c90653278a472e4028060b2ff8755201869bfe', class: "chip__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'da2bb584ec8c7f9fb746aefc5ff43aca3828526d', class: "chip__label" }, this.label)), this.progress !== undefined && (index.h("span", { key: 'e3d994faad82dd035ff6e2081c22852c6011ca42', class: "chip__progress-indicator" }, index.h("swirl-progress-indicator", { key: 'd0eddd986b078dc4e549940e0b781d0c07541697', label: this.progressBarLabel, value: this.progress })))), this.removable && (index.h("button", { key: '8ad96165e26097e8e9da65d54fc335ebdcc0a842', "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.remove.emit, type: "button" }, index.h("swirl-icon-close", { key: 'b916f233e0329a7f0bf36241deff78f1624f9818', size: 20 })))));
+        return (index.h(index.Host, { key: '285e189df4a4358b7d07fc91b9f06ea562d295af' }, index.h(Tag, { key: 'fb4d13ac4afbeffebc9b44b8cf5800e7f6063839', "aria-pressed": this.pressed !== undefined ? String(this.pressed) : undefined, class: className, onClick: this.chipClick.emit, type: this.interactive ? "button" : undefined }, index.h("span", { key: 'bee9a24a811db37cdf02f1b3fba4f82a213154ee', class: "chip__inner" }, showAvatar && (index.h("span", { key: '0887a96c9e1b4fe697d7d53a9df24baab62fd33b', class: "chip__avatar" }, index.h("slot", { key: 'b9f4d49ebba68e3102792392efc6cf3d1401af40', name: "avatar" }))), showIcon && (index.h("span", { key: '577e4bdfbc406cfd54fe507e3e75c1d9a0693933', class: "chip__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'b6660e15ca44dea2ab591a7ac292c567d4073c56', class: "chip__label" }, this.label)), this.progress !== undefined && (index.h("span", { key: 'fb2eba1ae34bc3e7b137044c4bd5814fc68493e1', class: "chip__progress-indicator" }, index.h("swirl-progress-indicator", { key: '93eed0c553045420b30d05f660c93dae3b431ad5', label: this.progressBarLabel, value: this.progress })))), this.removable && (index.h("button", { key: 'abff273245b609e14c2e7bfaa505aff50ff9bc92', "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.remove.emit, type: "button" }, index.h("swirl-icon-close", { key: '22482cfa3b2da13e5a93a4fea5487b26850da6d4', size: 20 })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -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: '67685139e5a399b98a884c57f0579f77e1f341ee' }, index.h("div", { key: '2f328355e40b143f77ae167797796db63f2c1397', class: className }, index.h("input", { key: '9da66032dc78c6b4bf132fe8241a1339f5f94505', "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: '3195f52afae359d25c04d9353ddc56bd9aa941df', swirlPopover: this.pickerId }, index.h("button", { key: '3fc16c5ea5097dcc27e05f27d6f23445aeaa53fb', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
+        return (index.h(index.Host, { key: '914da429bdcdd6576cecfcf3dd90bf104d803a09' }, index.h("div", { key: 'dc9f505383021faba447463c50811027d4b0be6b', class: className }, index.h("input", { key: '909c98a18b7fda96f7ebe7341180736a91697f71', "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: '906c3aba8ba37be0a08d19ac203ecadafd109ea3', swirlPopover: this.pickerId }, index.h("button", { key: 'd770b523445bc12b7171bc30eadd66ae922f6119', "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: 'bbbaa4331db5f67a8a413e3b11cf7ab47cd1f428', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, index.h("swirl-box", { key: 'ca52b4563f99c98a8a1989185fc0995a5b821f18', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, index.h("hex-color-picker", { key: 'a1b2c59033fbb4c80b6d98289176f646c14a4a14', color: this.value, ref: (el) => (this.picker = el) }))))));
+            }, type: "button" })), index.h("swirl-popover", { key: 'da0f865759500a54152e98eaf4dff87f0f7b9d1e', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, index.h("swirl-box", { key: '025409345855e9cd4d601c9b14a077b347f72c2d', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, index.h("hex-color-picker", { key: '635cfa8885c5de97f240f5def31e6bfb72afb42f', color: this.value, ref: (el) => (this.picker = el) }))))));
     }
     static get watchers() { return {
         "value": ["watchValue"]

package/dist/cjs/swirl-columns.cjs.entry.js CHANGED Viewed

@@ -14,10 +14,10 @@ const SwirlColumns = class {
         this.spacing = undefined;
     }
     render() {
-        return (index.h(index.Host, { key: 'f95ec95c66e777fc5f3ba9ea7383f6292fa8edbc' }, index.h("div", { key: '49f32dedc864c768b62076e8d46a254e7be3f4ac', class: "columns", style: {
+        return (index.h(index.Host, { key: 'e03996b556c972c081c2bd4283d006579cf3a1ba' }, index.h("div", { key: '95eee3bf0911dd60c08223ab389bc9a3e0a2a1a2', class: "columns", style: {
                 gridTemplateColumns: this.columns,
                 gap: `var(--s-space-${this.spacing})`,
-            } }, index.h("slot", { key: '0d6094db0d7f4e6b5ebfd3a88fe802ad3a562ff6' }))));
+            } }, index.h("slot", { key: '0d364bfbce8fda3431817a1cf2b35b71160d46ae' }))));
     }
 };
 SwirlColumns.style = SwirlColumnsStyle0;