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

@getflip/swirl-components 0.284.0 → 0.286.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 (1830) hide show

package/dist/components/file-manager.js CHANGED Viewed

@@ -90,7 +90,7 @@ const FileManager$1 = /*@__PURE__*/ proxyCustomElement(class FileManager extends
             onClick: () => this.selectItem(item) }, "type" in item ? (h("swirl-icon-file", { slot: "media" })) : (h("swirl-icon-folder-shared", { slot: "media" })))))) : (h("swirl-box", { padding: "16" }, h("swirl-text", { color: "subdued", weight: "medium" }, "This directory is empty.")));
     }
     render() {
-        return (h(Host, { key: '190b1e5695f2bb8b03a00d2a4e496bd00d09a301' }, h("swirl-app-layout", { key: '7907adf47e5c8d6c4e03b162b84e3b011aa8b3b9', 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" }, h("swirl-resource-list", { key: '86f0a83e2295e7fa30b77f74f88f45c6ac8e50e4', label: "Documents", slot: "navigation" }, this.renderNavigation()), h("swirl-popover-trigger", { key: 'a574aa6a3e11d6acf7dba1ab63e47071937d8fcf', swirlPopover: this.sortMenu, slot: "navigation-controls" }, h("swirl-button", { key: 'f9c572b5bb81ee8b49ddd4708d2ed1a20d2512a4', label: "Sort items" })), h("swirl-stack", { key: '01b68ecf5b141038291ea05823fc3c07e7b48668', orientation: "horizontal", slot: "app-bar" }, h("swirl-stack", { key: '03a2bb0589fcc90290390fffc2d8d43a6310d936' }, h("swirl-heading", { key: '128a17deca25cc760d0c67ea3a2af989bbd76162', as: "h2", level: 4, text: this.selectedFile?.name }), h("swirl-text", { key: '94ded472f785bcb3b7c91b3e07d0998242cdfc8e', color: "subdued", truncate: true }, this.selectedFile?.description))), Boolean(this.selectedFile) ? (h("swirl-file-viewer", { file: this.selectedFile.url, slot: "content", type: this.selectedFile.type })) : (h("swirl-box", { cover: true, centerBlock: true, centerInline: true, padding: "16", slot: "content" }, h("swirl-empty-state", { heading: "Nothing to see here.", illustration: "/images/empty-state-1.svg" }, "Please select a file from the list."))), h("div", { key: '269e411033840d17150c39b74692e28a6fced62a', slot: "app-bar-controls" }, this.selectedFile && (h("swirl-button", { key: 'b566c774ef5c06bcf17ee5c6dda7248ab8a46477', "hide-label": true, class: "info-button", icon: "<swirl-icon-info></swirl-icon-info>", label: "Open file info", onClick: this.toggleSidebar }))), h("swirl-box", { key: 'eb639d1c031a96822252cb66c4d60a940c57cfc4', padding: "16", slot: "sidebar" }, h("swirl-text", { key: '92639660b01b3dfd5d92a0abd8f9019c66baa896', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), h("swirl-popover", { key: '2d17fcce26c39e2b867a8811ab7668a90d265fd5', label: "Sort items", ref: (el) => (this.sortMenu = el) }, h("swirl-option-list", { key: '4a3ba39b370be490fd74ba6b400928b9e48f9129', value: ["ascending"] }, h("swirl-option-list-item", { key: 'f38d53b1ecada1e94af75e0bba06db6274f9a5ae', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), h("swirl-option-list-item", { key: '5c326e2053359dec242a04e4f0f74dcd1537274f', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), h("swirl-option-list-item", { key: 'f3bbf96da04a1bc69d72bf7b4457cd609667df16', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
+        return (h(Host, { key: 'ffffe91e896afccca4c19512fe2ef19e2da65c1e' }, 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" }, h("swirl-resource-list", { key: '9cd41bbed75991719d261f30fc24d0c22f00637f', label: "Documents", slot: "navigation" }, this.renderNavigation()), h("swirl-popover-trigger", { key: '77576986bf05b6dbadde0e365cd5c6416bda2d95', swirlPopover: this.sortMenu, slot: "navigation-controls" }, h("swirl-button", { key: 'f5029d116fb316db144e79c8e540f563649265a7', label: "Sort items" })), h("swirl-stack", { key: '8ba26af82d9fb15591438c49632ec8143d82f7dd', orientation: "horizontal", slot: "app-bar" }, h("swirl-stack", { key: '874528e994a338116090b79c071fe1d4bde509ce' }, h("swirl-heading", { key: '92701ef6d8a08fd4483fbc66a87657999f1fe2be', as: "h2", level: 4, text: this.selectedFile?.name }), h("swirl-text", { key: '82cbe443a8e838c862ac01004fe82aa73c41783e', color: "subdued", truncate: true }, this.selectedFile?.description))), Boolean(this.selectedFile) ? (h("swirl-file-viewer", { file: this.selectedFile.url, slot: "content", type: this.selectedFile.type })) : (h("swirl-box", { cover: true, centerBlock: true, centerInline: true, padding: "16", slot: "content" }, h("swirl-empty-state", { heading: "Nothing to see here.", illustration: "/images/empty-state-1.svg" }, "Please select a file from the list."))), h("div", { key: '0428e017e42bdb1169b1605bb7c969cd0b3757fa', slot: "app-bar-controls" }, this.selectedFile && (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 }))), h("swirl-box", { key: 'd8e8e590b5f420f2bb5c0fdb4a8a61350cd51f1f', padding: "16", slot: "sidebar" }, h("swirl-text", { key: '669d746fa05e44a8be207f332eefa0305f48bba3', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), h("swirl-popover", { key: 'fa3cb353fe87728c655a43465531e390ac6d61ec', label: "Sort items", ref: (el) => (this.sortMenu = el) }, h("swirl-option-list", { key: 'c9219ee1eb3b059ea59f09a84be0533c95fa7736', value: ["ascending"] }, h("swirl-option-list-item", { key: '7e682996eaa5ebc9243fc873dc6122c7289f6e8f', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), h("swirl-option-list-item", { key: 'b7e1c77a677793045d6b503ffec1631d5b4458ad', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), h("swirl-option-list-item", { key: 'df2e172efe264d63bdf868fc3810a2f0d944af5d', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
     }
 }, [1, "file-manager", {
         "selectedDirectory": [32],

package/dist/components/index.js CHANGED Viewed

@@ -85,6 +85,7 @@ import { SwirlIconCloseSmall } from './swirl-icon-close-small.js';
 import { SwirlIconCloudUpload } from './swirl-icon-cloud-upload.js';
 import { SwirlIconColumn } from './swirl-icon-column.js';
 import { SwirlIconComment } from './swirl-icon-comment.js';
+import { SwirlIconContrast } from './swirl-icon-contrast.js';
 import { SwirlIconCopy } from './swirl-icon-copy.js';
 import { SwirlIconCrop } from './swirl-icon-crop.js';
 import { SwirlIconDarkMode } from './swirl-icon-dark-mode.js';
@@ -456,6 +457,7 @@ const defineCustomElements = (opts) => {
             SwirlIconCloudUpload,
             SwirlIconColumn,
             SwirlIconComment,
+            SwirlIconContrast,
             SwirlIconCopy,
             SwirlIconCrop,
             SwirlIconDarkMode,

package/dist/components/swirl-accordion-item.js CHANGED Viewed

@@ -68,7 +68,7 @@ const SwirlAccordionItem$1 = /*@__PURE__*/ proxyCustomElement(class SwirlAccordi
         const className = classNames("accordion-item", {
             "accordion-item--expanded": this.expanded,
         });
-        return (h(Host, { key: '29710e3b90bc91e4290687f120dda4dc8172bf1a' }, h("div", { key: '68680d0041529a5cf74ca84139c505d38987eb71', class: className }, h(HeadingTag, { key: '0148138907529f3c1eab7cb95d35e8c05d56fc6a', class: "accordion-item__heading" }, h("button", { key: 'f72a42c42a7ee1bf35646b44fa7e289f572e23c8', "aria-controls": this.itemId, "aria-expanded": String(this.expanded), class: "accordion-item__toggle", disabled: this.disabled, id: this.headingId, onClick: this.onHeadingClick, type: "button" }, h("span", { key: 'fc9f06dbd96372ededa39d68334aaf33b53a94e2', class: "accordion-item__toggle-text" }, this.heading, this.description && (h("swirl-text", { key: 'd4df097cc2b96c6216e9dfc94486e08f571e3954', as: "span", color: "subdued", size: "sm" }, this.description))), h("span", { key: '3606ddc91d2e808421137cd781ef682938b02f78', class: "accordion-item__icon" }, !this.expanded && (h("swirl-icon", { key: '501fe59ef0b0e4692c65f8cdfd24ca1ac9335001', glyph: "chevron-right", size: 20 })), this.expanded && (h("swirl-icon", { key: 'e389b4dfdc9306f07043ff902be7e538ee89c92f', glyph: "expand-more", size: 20 }))))), h("div", { key: '0b796af4c2c698547e9c54aa435443892d2047d4', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, h("slot", { key: '4cfa18cc7900a67b0d24ce55e5b5da1edf2b8a7a' })))));
+        return (h(Host, { key: '5f7a6ea811aad1cc1b8653ca1735e420707ef555' }, h("div", { key: 'd7dccc0fc31458bce87b5c3af3d758dc89e68575', class: className }, h(HeadingTag, { key: 'ec1b86fa802173c7d82d4dc91faf766fe895ee17', class: "accordion-item__heading" }, 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" }, h("span", { key: '3f92ed1169629eeb4441ed15900db2c22cee97b8', class: "accordion-item__toggle-text" }, this.heading, this.description && (h("swirl-text", { key: 'bb5a29122c56cef6cbdf15d46930a90bf111740a', as: "span", color: "subdued", size: "sm" }, this.description))), h("span", { key: '2394f58df22908b5db4fecda353ee816f572db3b', class: "accordion-item__icon" }, !this.expanded && (h("swirl-icon", { key: '6868feb73403ff47b22f70ed2e9c3d6c6c719f0a', glyph: "chevron-right", size: 20 })), this.expanded && (h("swirl-icon", { key: '9f04ff5d6e0effdcd2c5269b47a06fd0614637bc', glyph: "expand-more", size: 20 }))))), h("div", { key: '8d46398c7867d2dff6efdb5006060b044c10171b', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, h("slot", { key: '50690f6f1dfcec03ef05ceaf0061f417e426071e' })))));
     }
     get el() { return this; }
     static get style() { return SwirlAccordionItemStyle0; }

package/dist/components/swirl-accordion.js CHANGED Viewed

@@ -46,7 +46,7 @@ const SwirlAccordion$1 = /*@__PURE__*/ proxyCustomElement(class SwirlAccordion e
         });
     }
     render() {
-        return (h(Host, { key: '0da292c39800abd564844ef83efd150ae18f9bce' }, h("slot", { key: '5267813019864387c8853836bcb5e7609b8498f7' })));
+        return (h(Host, { key: '4d75f830088554c2de0b74df72e2c6a9beeb31e9' }, h("slot", { key: '0fcd720e4392e8f77fffda0e723311ef9d942b8d' })));
     }
     get el() { return this; }
     static get style() { return SwirlAccordionStyle0; }

package/dist/components/swirl-action-list-item2.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 import { c as classNames } from './index2.js';
 import { g as getDesktopMediaQuery } from './utils.js';
-const swirlActionListItemCss = ":host{display:block}:host *{box-sizing:border-box}.action-list-item{display:inline-flex;width:100%;min-width:15rem;margin:0;padding:var(--s-space-12) var(--s-space-16);justify-content:flex-start;align-items:center;border:none;color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;line-height:var(--s-line-height-base);text-align:left;cursor:pointer;gap:var(--s-space-12)}.action-list-item:hover{background-color:var(--s-surface-overlay-hovered);--swirl-tag-background-default:var(--s-surface-sunken-pressed)}.action-list-item:focus{outline:none}.action-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered)}.action-list-item:active{background-color:var(--s-surface-overlay-pressed)}.action-list-item:disabled{background-color:var(--s-surface-overlay-default);cursor:default}.action-list-item:disabled .action-list-item__label,.action-list-item:disabled .action-list-item__description{color:var(--s-text-disabled)}.action-list-item:disabled .action-list-item__icon{color:var(--s-icon-disabled)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.action-list-item{padding:var(--s-space-8) var(--s-space-12);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);gap:var(--s-space-8)}}.action-list-item--size-l{padding:var(--s-space-16)}.action-list-item--intent-critical ::part(icon){color:var(--s-icon-critical)}.action-list-item--intent-critical:not(:disabled) .action-list-item__label{color:var(--s-text-critical)}.action-list-item--intent-critical:not(:disabled) .action-list-item__icon{color:var(--s-icon-critical)}.action-list-item__icon{display:inline-flex;width:1.5rem;height:1.5rem;flex-shrink:0;color:var(--s-icon-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.action-list-item__icon{width:1.25rem;height:1.25rem}}.action-list-item__label-container{display:inline-flex;min-width:0;flex-grow:1;flex-shrink:1;align-items:flex-start;flex-direction:column}.action-list-item__label{overflow:hidden;max-width:100%;font-weight:var(--s-font-weight-medium);white-space:nowrap;text-overflow:ellipsis}.action-list-item__description{color:var(--s-text-subdued)}.action-list-item__badge{overflow:hidden;min-width:4rem;padding-left:var(--s-space-8);flex-shrink:3;color:var(--s-text-subdued);font-weight:var(--s-font-weight-medium);text-align:right;white-space:nowrap;text-overflow:ellipsis}.action-list-item__suffix{display:inline-flex;flex-shrink:0;color:var(--s-icon-highlight)}";
+const swirlActionListItemCss = ":host{display:block}:host *{box-sizing:border-box}.action-list-item{display:inline-flex;width:100%;min-width:15rem;margin:0;padding:var(--s-space-12) var(--s-space-16);justify-content:flex-start;align-items:center;border:none;color:var(--s-text-default);background-color:var(--s-surface-overlay-default);font:inherit;line-height:var(--s-line-height-base);text-align:left;cursor:pointer;gap:var(--s-space-12)}.action-list-item:hover{background-color:var(--s-surface-overlay-hovered);--swirl-tag-background-default:var(--s-surface-sunken-pressed)}.action-list-item:focus{outline:none}.action-list-item:focus-visible{background-color:var(--s-surface-overlay-hovered)}.action-list-item:active{background-color:var(--s-surface-overlay-pressed)}.action-list-item:disabled{background-color:var(--s-surface-overlay-default);cursor:default}.action-list-item:disabled .action-list-item__label,.action-list-item:disabled .action-list-item__description{color:var(--s-text-disabled)}.action-list-item:disabled .action-list-item__icon{color:var(--s-icon-disabled)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.action-list-item{padding:var(--s-space-8) var(--s-space-12);font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);gap:var(--s-space-8)}}.action-list-item--size-l{padding:var(--s-space-16)}.action-list-item--intent-critical ::part(icon){color:var(--s-icon-critical)}.action-list-item--intent-critical:not(:disabled) .action-list-item__label{color:var(--s-text-critical)}.action-list-item--intent-critical:not(:disabled) .action-list-item__icon{color:var(--s-icon-critical)}.action-list-item__icon{display:inline-flex;position:relative;width:1.5rem;height:1.5rem;flex-shrink:0;color:var(--s-icon-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.action-list-item__icon{width:1.25rem;height:1.25rem}}.action-list-item__icon-badge{position:absolute;display:grid;bottom:0;right:0}.action-list-item__label-container{display:inline-flex;min-width:0;flex-grow:1;flex-shrink:1;align-items:flex-start;flex-direction:column}.action-list-item__label{overflow:hidden;max-width:100%;font-weight:var(--s-font-weight-medium);white-space:nowrap;text-overflow:ellipsis}.action-list-item__description{color:var(--s-text-subdued)}.action-list-item__badge{overflow:hidden;min-width:4rem;padding-left:var(--s-space-8);flex-shrink:3;color:var(--s-text-subdued);font-weight:var(--s-font-weight-medium);text-align:right;white-space:nowrap;text-overflow:ellipsis}.action-list-item__suffix{display:inline-flex;flex-shrink:0;color:var(--s-icon-default)}";
 const SwirlActionListItemStyle0 = swirlActionListItemCss;
 const SwirlActionListItem = /*@__PURE__*/ proxyCustomElement(class SwirlActionListItem extends HTMLElement {
@@ -18,6 +18,7 @@ const SwirlActionListItem = /*@__PURE__*/ proxyCustomElement(class SwirlActionLi
         this.disabled = undefined;
         this.description = undefined;
         this.icon = undefined;
+        this.iconBadge = undefined;
         this.intent = "default";
         this.label = undefined;
         this.size = "m";
@@ -39,16 +40,20 @@ const SwirlActionListItem = /*@__PURE__*/ proxyCustomElement(class SwirlActionLi
         const icon = this.iconEl?.children[0];
         const suffix = this.suffixEl?.children[0];
         icon?.setAttribute("size", smallIcon ? "20" : "24");
+        const iconBadge = this.iconBadgeEl?.children[0];
+        iconBadge?.setAttribute("size", "xs");
+        iconBadge?.setAttribute("variant", "dot");
         if (suffix?.tagName === "SWIRL-TAG")
             return;
         suffix?.setAttribute("size", smallIcon ? "20" : "24");
     }
     render() {
         const showBadge = Boolean(this.badge);
+        const showIconBadge = Boolean(this.iconBadge);
         const showSuffixSlot = Boolean(this.el.querySelector('[slot="suffix"]'));
         const showSuffix = (Boolean(this.suffix) || showSuffixSlot) && !this.disabled;
         const className = classNames("action-list-item", `action-list-item--intent-${this.intent}`, `action-list-item--size-${this.size}`);
-        return (h(Host, { key: '06605ecf01b587dbfb1de890ba776cdb72926c5b' }, h("button", { key: 'c70ad0ecbc3e58a6b5c8543c37907346f3301284', "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 && (h("span", { key: 'e250cabb8119ad251d4d3d70cd080408f2122d5d', class: "action-list-item__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), h("span", { key: '28361e8c9cd8696c3661d7263d550a66c87fd26e', class: "action-list-item__label-container" }, h("span", { key: 'c8d504ca27d5ba2d1c8979ce45dda984c1e48436', class: "action-list-item__label" }, this.label), this.description && (h("span", { key: '303dec5fe699a2c47a4e9e5417d06e3285a30d6f', class: "action-list-item__description" }, this.description))), showBadge && (h("span", { key: '96c4500b611acc6a1cb40cbb8b6088deffb273b6', class: "action-list-item__badge", innerHTML: this.badge })), showSuffix && (h("span", { key: '739d6e49ad6890a23c1b12eea9037da43c9c9e52', class: "action-list-item__suffix", innerHTML: !showSuffixSlot ? this.suffix : undefined, ref: (el) => (this.suffixEl = el) }, h("slot", { key: 'a391b536421efd55d4132772d143ec89e757c9d8', name: "suffix" }))))));
+        return (h(Host, { key: '408db106a78a73aeaf63fa8b745a1145ac2c35dd' }, 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 && (h("span", { key: '52a764c0966f0204ef64df2ba6b813d2449fc720', class: "action-list-item__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) }, showIconBadge && (h("span", { key: 'db73545e030746a3dc9e07e9bd9ba0211576eb25', class: "action-list-item__icon-badge", innerHTML: this.iconBadge, ref: (el) => (this.iconBadgeEl = el) })))), h("span", { key: '322ebb8fb030fc4033119d38b2a67b9c13eaaa9f', class: "action-list-item__label-container" }, h("span", { key: '2598b48234b315f5e35cc7a17d97b40168290602', class: "action-list-item__label" }, this.label), this.description && (h("span", { key: 'd130bb6efb271595471fe094fd0375a61b73b5fb', class: "action-list-item__description" }, this.description))), showBadge && (h("span", { key: '2e5ca125470b24980585896283692ea95cd657d9', class: "action-list-item__badge", innerHTML: this.badge })), showSuffix && (h("span", { key: '12739299da6b4ee7982c32b6e2eee192e2612614', class: "action-list-item__suffix", innerHTML: !showSuffixSlot ? this.suffix : undefined, ref: (el) => (this.suffixEl = el) }, h("slot", { key: '358f31549326363064e8441beffe292113b4ffdc', name: "suffix" }))))));
     }
     get el() { return this; }
     static get style() { return SwirlActionListItemStyle0; }
@@ -57,6 +62,7 @@ const SwirlActionListItem = /*@__PURE__*/ proxyCustomElement(class SwirlActionLi
         "disabled": [4],
         "description": [1],
         "icon": [1],
+        "iconBadge": [1, "icon-badge"],
         "intent": [1],
         "label": [1],
         "size": [1],

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

@@ -11,7 +11,7 @@ const SwirlActionListSection$1 = /*@__PURE__*/ proxyCustomElement(class SwirlAct
         this.label = undefined;
     }
     render() {
-        return (h(Host, { key: '40bda032cab1a7b0f79a2b5881d9326b062156ea' }, h("div", { key: '0c82c51957b3707724636f33193023c7344b8104', "aria-labelledby": "label", class: "action-list-section", role: "group" }, h("span", { key: '58f78c65728f336de01b7cb903566aa8becbaaeb', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), h("div", { key: 'ba803eaa5eb3b24d0c7cbb4c71f014bd708a36ce', class: "action-list-section__items" }, h("slot", { key: '456bbed6e34639d50f1b00efa172c4e7ea50461c' })))));
+        return (h(Host, { key: '5c5e188520c3e876ca9d4e46900d78e223977ccb' }, h("div", { key: 'cfe4ece09f7f6726afb4bf4b593f6d667e5ef3db', "aria-labelledby": "label", class: "action-list-section", role: "group" }, h("span", { key: 'a84c15c53cd19fbcf035029a0e2573ac6687ebbe', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), h("div", { key: 'ab0eaefc1c827291a086eadbb7630e1e1e5ceef8', class: "action-list-section__items" }, h("slot", { key: '3720c008dcbfd5c6f62d4d60ad4bbf9960b3642b' })))));
     }
     static get style() { return SwirlActionListSectionStyle0; }
 }, [1, "swirl-action-list-section", {

package/dist/components/swirl-action-list2.js CHANGED Viewed

@@ -80,7 +80,7 @@ const SwirlActionList = /*@__PURE__*/ proxyCustomElement(class SwirlActionList e
             item === activeElement?.querySelector('[role="menuitem"]'));
     }
     render() {
-        return (h(Host, { key: 'a9c578bd188dd7099dc6e730a9e7e0712b141376' }, h("div", { key: 'a59a86d89fac7df60915f24dda0a311d1315178f', "aria-orientation": "vertical", class: "action-list", onFocusout: this.isInsidePopover ? undefined : this.onFocusOut, onFocus: this.isInsidePopover ? undefined : this.onFocus, onKeyDown: this.onKeyDown, part: "action-list", ref: (el) => (this.container = el), role: "menu" }, h("slot", { key: '59950a3821a5dfe5813605c14f5527e3cf257c96' }))));
+        return (h(Host, { key: 'd2c8c06e5f917d832fc9c6880de78ca6e2b24d3b' }, 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" }, h("slot", { key: 'b5fe05b65edcc93576c19c59f072669e301bfb59' }))));
     }
     get el() { return this; }
     static get style() { return SwirlActionListStyle0; }

package/dist/components/swirl-app-bar.js CHANGED Viewed

@@ -64,7 +64,7 @@ const SwirlAppBar$1 = /*@__PURE__*/ proxyCustomElement(class SwirlAppBar extends
             paddingInlineEnd: `var(--s-space-${this.paddingInlineEnd})`,
             paddingInlineStart: `var(--s-space-${this.paddingInlineStart})`,
         };
-        return (h(Host, { key: 'e3c441ae152c5f32628341d93ab9c01267fdcd14' }, h("div", { key: 'f5d2d48ddb1a3226e0fb5ca4789ff59ddd866dec', class: className, style: styles }, showLeftControls && (h("div", { key: 'c9f3c6f1cab3c15d99f373ddc53ee6dce3e51a6a', class: "app-bar__left-controls" }, (this.showBackButton || this.showCloseButton) && (h("div", { key: '9ae0620bef35977af26de20b4fbe7725062ab0d0', class: "app-bar__main-navigation-control" }, this.showBackButton && (h("swirl-button", { key: '05e57714c3649dbf722d74f135d0c5fb7591e16b', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButtonLabel, onClick: this.onBackButtonClick })), this.showCloseButton && (h("swirl-button", { key: '54d48e492a7cbc94e7784829ce4288e339e38526', hideLabel: true, icon: this.closeButtonIcon, label: this.closeButtonLabel, onClick: this.onCloseButtonClick })))), this.showStepperControls && (h("div", { key: '65637f25c16f60d7b7028a8b985520688439a2a8', class: "app-bar__stepper-controls" }, h("swirl-button", { key: 'b46ca47a50c9ff3f938d0adc4e5145e1c4d7a6d5', hideLabel: true, icon: "<swirl-icon-arrow-upward></swirl-icon-arrow-upward>", label: this.stepUpButtonLabel, onClick: this.onStepUpButtonClick }), h("swirl-button", { key: 'ce4bbb821ad76249caf680965853aefed6bbf041', hideLabel: true, icon: "<swirl-icon-arrow-downward></swirl-icon-arrow-downward>", label: this.stepDownButtonLabel, onClick: this.onStepDownButtonClick }))))), h("div", { key: '75042cd5d3c9c5f82d1d8c2b5a1ba156890f83a0', class: "app-bar__cta" }, h("slot", { key: '195d9d91da4e64688b281f0a7c5cd8dfdd3f661d', name: "cta" })), h("div", { key: '92fdfb5748e8e1578205c97c13ff361fd3020fac', class: "app-bar__heading" }, h("slot", { key: 'c62711620a9b717c340bfac1a92f8eb639207fd0', name: "heading" })), h("div", { key: 'cd37b16d36b2115ca3c63adbae7635b5a412ba38', class: "app-bar__center-controls" }, h("slot", { key: '1b884ef50fdbf39da5bb738174defa6e17b93efa', name: "center-controls" })), h("div", { key: '9dc46b4fa36e8d34837c26aed63b4bb80c2c08fe', class: "app-bar__right-controls" }, h("slot", { key: '83aa64ac31b9a68f6777e8ad75a0c1ad262a815b', name: "right-controls" })))));
+        return (h(Host, { key: 'c06a23cfd8dbe4ee10cfcdaea7c61c34b2607377' }, h("div", { key: '9b109b19a7671f1db36274931e6c375a36358b6b', class: className, style: styles }, showLeftControls && (h("div", { key: '816bb1fb098065fcd958ea02ff02175d557795ea', class: "app-bar__left-controls" }, (this.showBackButton || this.showCloseButton) && (h("div", { key: 'e36f84156257773d5a4afc14b4a57d5d3c6a5119', class: "app-bar__main-navigation-control" }, this.showBackButton && (h("swirl-button", { key: 'ee8c47a842578086bae71252ae84468cb591e370', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButtonLabel, onClick: this.onBackButtonClick })), this.showCloseButton && (h("swirl-button", { key: 'd80654406c9385f8642a48298a68996e9b07ecf2', hideLabel: true, icon: this.closeButtonIcon, label: this.closeButtonLabel, onClick: this.onCloseButtonClick })))), this.showStepperControls && (h("div", { key: '6dd148c9dc3fb90904f2f196b4cc9cad2443f807', class: "app-bar__stepper-controls" }, h("swirl-button", { key: 'ccfdf9bd6dd04919e41c71ec3450f745035beb53', hideLabel: true, icon: "<swirl-icon-arrow-upward></swirl-icon-arrow-upward>", label: this.stepUpButtonLabel, onClick: this.onStepUpButtonClick }), h("swirl-button", { key: '8c2ff8a3d7eac53b9755be4e59ba117b83b29d1b', hideLabel: true, icon: "<swirl-icon-arrow-downward></swirl-icon-arrow-downward>", label: this.stepDownButtonLabel, onClick: this.onStepDownButtonClick }))))), h("div", { key: '38d8ef8d61ae1a6b26b2c04718d11a6b5737d5d3', class: "app-bar__cta" }, h("slot", { key: '10f913949cb291e0d297e6cc4d1ecb86aaae7865', name: "cta" })), h("div", { key: 'a977186f42b4b4aafb456d0fc559198cdd43646c', class: "app-bar__heading" }, h("slot", { key: 'c5f89f5d5b89b7292e569c486042d4e252068e82', name: "heading" })), h("div", { key: '3aaca53d45a8566f6c83980b66d16cfd4c143f4b', class: "app-bar__center-controls" }, h("slot", { key: '25b3353688b3c16b1949b05ccee83b9ca58ece61', name: "center-controls" })), h("div", { key: 'd6daeec18cc5c1ae2f539b514efcfe994ecc40ff', class: "app-bar__right-controls" }, h("slot", { key: '52a3c7bd52599c81a6dc6172a67b91eb1cbd778f', name: "right-controls" })))));
     }
     get el() { return this; }
     static get style() { return SwirlAppBarStyle0; }

package/dist/components/swirl-app-icon.js CHANGED Viewed

@@ -27,7 +27,7 @@ const SwirlAppIcon$1 = /*@__PURE__*/ proxyCustomElement(class SwirlAppIcon exten
         const className = classNames("app-icon", {
             "app-icon--has-icon": showIcon || showFallbackIcon,
         });
-        return (h(Host, { key: 'fcfbd3332b8ffdc129b4a5b336054a2f4b7c0cf2' }, h("span", { key: '1d085a88743d7341f83709283300a7e4fecb76b2', class: className }, showImage && (h("img", { key: 'bc9cac7895c5f9e0b58348a01dc6a4d14834b3a0', alt: "", height: "256", onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: "256" })), showIcon && (h("span", { key: '74fef35e39cc3b2f19c11e1846659d369218bda9', class: "app-icon__icon", innerHTML: this.icon })))));
+        return (h(Host, { key: 'a3c326ddb9b5f885998f068d75dd2368128dbdc3' }, h("span", { key: '18d236b54e882d532a68e2b4c138511ae1780400', class: className }, showImage && (h("img", { key: 'afd2630244eb9b2bcfc868ed08ef111c24f84a59', alt: "", height: "256", onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: "256" })), showIcon && (h("span", { key: 'c1e6d2320b8dec4446aa69acd28fd27f5cf62e54', class: "app-icon__icon", innerHTML: this.icon })))));
     }
     static get style() { return SwirlAppIconStyle0; }
 }, [1, "swirl-app-icon", {

package/dist/components/swirl-app-layout2.js CHANGED Viewed

@@ -349,14 +349,14 @@ const SwirlAppLayout = /*@__PURE__*/ proxyCustomElement(class SwirlAppLayout ext
             "app-layout--sidebar-scrollable": this.sidebarScrollState.scrollable,
             "app-layout--sidebar-scrolled-to-top": this.sidebarScrollState.scrolledToTop,
         });
-        return (h(Host, { key: 'e4098dcdd2f208b1dd2fce4fa4239c5115610fae' }, h("section", { key: '74d1b87b9cc1f3444dbd0d4f9f9438691b6a038f', "aria-labelledby": "app-name", class: className }, h("div", { key: 'ba69ff7c4ca1304e68681f21538fc51293557d66', class: "app-layout__grid" }, h("header", { key: '2d0cf6c6c14f4e5cc65f80e29ed83da677298d91', class: "app-layout__header", ref: (el) => (this.headerEl = el) }, h("span", { key: 'ad33a7a8bbcf159a339500af5dfb1fdbcec832bb', class: "app-layout__navigation-mobile-menu-button" }, h("slot", { key: '6430dddd996413590a4a44c1f8b10605e2846e15', name: "navigation-mobile-menu-button" })), this.collapsibleNavigation && (h("span", { key: 'bb382dd6ed579a103df8d2db491704e50f46e989', class: "app-layout__nav-overlay-toggle" }, h("swirl-button", { key: '33b7c62a2929be9f5faed27e6bb382a03860909e', hideLabel: true, icon: this.navExpansionState !== "expanded"
+        return (h(Host, { key: '6ecc40ce75a553155a68b0745a6e60b4f2b3708f' }, h("section", { key: 'af7797588e0fde39764ab8214e61c75aaf89cfe1', "aria-labelledby": "app-name", class: className }, h("div", { key: '987264b968313a9a33e79c862e8b41f3c36f778f', class: "app-layout__grid" }, h("header", { key: 'd7e57a83f373f722271f07d84f07ebe1fdfa9a8a', class: "app-layout__header", ref: (el) => (this.headerEl = el) }, h("span", { key: 'c9229ebfac14bb9a4f31c40eaed007026fef603c', class: "app-layout__navigation-mobile-menu-button" }, h("slot", { key: '62e423f89b2d80e2aeab629822014362a5f5807d', name: "navigation-mobile-menu-button" })), this.collapsibleNavigation && (h("span", { key: 'e0cb00b70c6385d01fa7304cfa1e8d842e89beb3', class: "app-layout__nav-overlay-toggle" }, h("swirl-button", { key: 'e7942691b237be46f7c5b08f77880c13a2a302f5', 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 && (h("span", { key: '6a949d43a362498d9b0dd9b833b4ff6da672f551', class: "app-layout__navigation-back-button" }, h("swirl-button", { key: '8e94dc58d62a8acd872830f939c56d60ac80dfe6', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.navigationBackButtonLabel, onClick: this.onNavigationBackButtonClick }))), h("swirl-heading", { key: '2d5b82a5179556db32cdf8af3a1803e89fe7295d', as: "h1", class: "app-layout__app-name", headingId: "app-name", level: 3, text: this.appName }), navigationActive && (h("span", { key: 'c6870ca94e78496a41c7d6cb2bfe8adcb97b7fee', class: "app-layout__navigation-controls" }, h("slot", { key: '265797c583cf51b061f883a66522a61478ff543f', name: "navigation-controls" })))), h("nav", { key: '07b5b0e935513aab2e09f43a185abbc37829dc2a', "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 && (h("span", { key: 'd2b359d9d695a99f758699cb61b9731616cc5ae1', class: "app-layout__navigation-back-button" }, h("swirl-button", { key: '8441e59724620b73146895d54542f699a22c35cd', hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.navigationBackButtonLabel, onClick: this.onNavigationBackButtonClick }))), h("swirl-heading", { key: '9dc4ac2355a32292d40e1f326ad8b8b95080b56d', as: "h1", class: "app-layout__app-name", headingId: "app-name", level: 3, text: this.appName }), navigationActive && (h("span", { key: '77e150c323290bee296b7747ee940e0c3bedee4a', class: "app-layout__navigation-controls" }, h("slot", { key: '8cd86420650529d632d3f83e25f8c80e2acc6022', name: "navigation-controls" })))), h("nav", { key: 'c3b93be1c802b940c2f7e877e2ed1f463123c378', "aria-label": this.navigationLabel, class: "app-layout__navigation", onScroll: this.onNavScroll, ref: (el) => (this.navEl = el), inert: this.isDesktop &&
                 this.collapsibleNavigation &&
-                this.navExpansionState === "collapsed" }, h("slot", { key: '7d41b776a7d30606a2a4f6bf9432507d3215c724', name: "navigation" })), h("section", { key: 'c62375fecbad605fdd6c8a989e1df595c8b9b53b', "aria-labelledby": "app-name", class: "app-layout__body" }, !this.hideAppBar && (h("header", { key: '32bccc6df13d9c18bae6ffd3aa1321fba2adf681', class: "app-layout__app-bar" }, h("span", { key: '7761897c9f493da17376c38a90cc22e7770d7f7b', class: "app-layout__app-bar-mobile-menu-button" }, h("slot", { key: '78436397b99689627a11f0a7b0b80ef79c7faf50', name: "app-bar-mobile-menu-button" })), showBackToNavigationButton && (h("span", { key: '9503fe9dcb32ad8ac71132c9065305e471b3566a', class: "app-layout__back-to-navigation-button" }, h("swirl-button", { key: '1e4ba308c482b3b9c8aefaf04bd8e42d3599f228', hideLabel: true, icon: this.transitionStyle === "dialog"
+                this.navExpansionState === "collapsed" }, h("slot", { key: 'd6a22b90ee21847cd22fec51d874b1428942bd61', name: "navigation" })), h("section", { key: 'b88c64d74bb2534ff424d7f3794181cfde17eb2c', "aria-labelledby": "app-name", class: "app-layout__body" }, !this.hideAppBar && (h("header", { key: '51163ecb84407e968f78089bb22a99daeaaf269b', class: "app-layout__app-bar" }, h("span", { key: 'a89226ec4b5c8c69568158dc08461f151a254a14', class: "app-layout__app-bar-mobile-menu-button" }, h("slot", { key: '6c0d79c4830d75136e54068321b4e5b541470cf0', name: "app-bar-mobile-menu-button" })), showBackToNavigationButton && (h("span", { key: '320948753c656a79e71936b4de8e5b51b87e03d9', class: "app-layout__back-to-navigation-button" }, h("swirl-button", { key: 'eb6d1f309242d6019ee2e0e071c1a6586135c07f', 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" && (h("span", { key: 'b2e67d86af90a03ce4e592b8c05344c3b0bd3bb7', class: "app-layout__nav-expansion-toggle" }, h("swirl-button", { key: '900b525ab072ef7c2118ea4df022948e86d86441', hideLabel: true, icon: "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", label: this.navigationOverlayLabel, onClick: this.overlayNavigation }))), h("span", { key: '90e02383bd578c0ac5c4e71565c017d45da2e8ca', class: "app-layout__custom-app-bar-back-button" }, h("slot", { key: '3dd9e2e8fff75b7df3c62904d129d7da833338b4', name: "custom-app-bar-back-button" })), h("div", { key: '5c47928c8c160efd11e8ba065aee682139c31909', class: "app-layout__app-bar-content" }, h("slot", { key: '595bb77fa075c7c93a1c01cce9f8646085271a71', name: "app-bar" })), h("div", { key: 'c38221c515655f0ea29b99130ceed886ba9a8346', class: "app-layout__app-bar-controls" }, h("slot", { key: 'cdeb2c4c92b528e7668b0ca75c8a6d9909586139', name: "app-bar-controls" })))), h("div", { key: '4451d20caf3c9bf625481bcb69339161f3ce59fd', class: "app-layout__banner" }, h("slot", { key: '55cdf9dc49401cdbf108429f5b88eabfb0a5a8fd', name: "banner" })), h("div", { key: 'bdfaed66354fb98f0261e6c1471acb42288d4a1f', class: "app-layout__content", onScroll: this.onContentScroll, ref: (el) => (this.contentEl = el) }, h("slot", { key: '61e27fdad1c8d00ef4784b9710f63f96fa6a1f7c', name: "content" })), h("div", { key: 'e2664aab92aac1ca42c4ae6214f0a0639c851dbc', class: "app-layout__bottom-bar" }, h("slot", { key: 'e8ed7aa1b4db87c99c04342a5a92592cc7558457', name: "bottom-bar" }))), h("aside", { key: 'd54e38fc2a6572fd906c2dc29fed83f393165c5e', class: "app-layout__sidebar" }, h("header", { key: 'e9d8da24a7a66e0c5603c7b3e596c61e0f37f485', class: "app-layout__custom-sidebar-header" }, h("slot", { key: '4c9eef2c7776fb17e2b6a0ef29c191e1b01e1210', name: "custom-sidebar-header" })), h("header", { key: '0fbabae4205fcf10719c09b91137eb9976570f42', class: "app-layout__sidebar-header" }, h("swirl-button", { key: '429a029aaf97c70501607e290d33a21851f5387a', class: "app-layout__sidebar-close-button", hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.sidebarCloseButtonLabel, onClick: this.onSidebarCloseButtonClick }), h("swirl-heading", { key: 'c97527b8045a638d4a8ac6353b76412141495bae', as: "h3", class: "app-layout__sidebar-heading", headingId: "sidebar-heading", level: 3, text: this.sidebarHeading })), h("div", { key: '98586801b5d898ded16c86930098d2c465f0f5b5', class: "app-layout__sidebar-content", onScroll: this.onSidebarScroll, ref: (el) => (this.sidebarEl = el) }, h("slot", { key: 'b9143060027fecaf71539b82148debb484e444e2', name: "sidebar" }))), h("span", { key: '65a9d8644e838ec685f6ed5733c185b991bc8ecb', class: "app-layout__floating-action-button" }, this.ctaLabel && (h("swirl-button", { key: '478178ad5bf08c07a71bbb9c861374b7dc0019a4', hideLabel: Boolean(this.ctaIcon), icon: this.ctaIcon, intent: "primary", label: this.ctaLabel, onClick: this.onCtaClick, variant: "floating" })), h("slot", { key: '5e00f2a754c8da6cb395c11347b4ae85f6d5ce3d', name: "floating-action-button" }))))));
+            this.navExpansionState !== "expanded" && (h("span", { key: '4d7f01de584fd6fd4dc8407af6dc968724bfcdb8', class: "app-layout__nav-expansion-toggle" }, h("swirl-button", { key: '15a5c8bd78ac1b109ddb0949cf69244ae41d3900', hideLabel: true, icon: "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", label: this.navigationOverlayLabel, onClick: this.overlayNavigation }))), h("span", { key: 'd63c412b4ccf0428d417680c3c806de43d7acfca', class: "app-layout__custom-app-bar-back-button" }, h("slot", { key: '270c3efca63bdf06b93e1defebc883d53ba3391b', name: "custom-app-bar-back-button" })), h("div", { key: '0c550e11e751a1b8d2087c662ec9c15963ad684e', class: "app-layout__app-bar-content" }, h("slot", { key: '984272347565d4b3043a3d467af1bc18099ce69a', name: "app-bar" })), h("div", { key: '955a810e5b8eb78d98460869fdd620e4d1938d3a', class: "app-layout__app-bar-controls" }, h("slot", { key: '821d02306c8e70b8b89562079e40b839c9dfae4e', name: "app-bar-controls" })))), h("div", { key: 'c6da60f1ef567e34727f0d67327330a2e9c2aa36', class: "app-layout__banner" }, h("slot", { key: 'a729e318c6de2eefd2c963155d826d0879f1d663', name: "banner" })), h("div", { key: '7b8c7a9cb400174cef52e7c8fffdb14be5e34260', class: "app-layout__content", onScroll: this.onContentScroll, ref: (el) => (this.contentEl = el) }, h("slot", { key: '22d1bb04bcb05723f65973ae64d7e4d401d4cc6f', name: "content" })), h("div", { key: '7ed6075864710943a424e51985a9710ce7c89efd', class: "app-layout__bottom-bar" }, h("slot", { key: '1b9c4c30f69e86c1324ea3f1fccef4884af7acc3', name: "bottom-bar" }))), h("aside", { key: '0ff3195bd3033562704f6c4bac449e01d37d9e0f', class: "app-layout__sidebar" }, h("header", { key: 'e22f2f2d02e38673c4173337eaa6f16e3e79c7a1', class: "app-layout__custom-sidebar-header" }, h("slot", { key: '34458e91090e415bfe92ccf5286864a6c5a424e5', name: "custom-sidebar-header" })), h("header", { key: '981e497873e44a6575d27bc3255bcc50816e861f', class: "app-layout__sidebar-header" }, 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 }), h("swirl-heading", { key: 'c1c76e420e5041d6e3facc61438d05f25b397836', as: "h3", class: "app-layout__sidebar-heading", headingId: "sidebar-heading", level: 3, text: this.sidebarHeading })), h("div", { key: '7f29f7c8eb440562135ae0618b982c9229008c77', class: "app-layout__sidebar-content", onScroll: this.onSidebarScroll, ref: (el) => (this.sidebarEl = el) }, h("slot", { key: 'd04d989f5cc28a6843f514e1839089b11be15472', name: "sidebar" }))), h("span", { key: 'd82c7e67f1a82e4840b707bf2e5358f33f04e120', class: "app-layout__floating-action-button" }, this.ctaLabel && (h("swirl-button", { key: '3a0e0c130307c174650ea50e73aa01fc99559615', hideLabel: Boolean(this.ctaIcon), icon: this.ctaIcon, intent: "primary", label: this.ctaLabel, onClick: this.onCtaClick, variant: "floating" })), h("slot", { key: '59e97c933d122437a298b469af220e50e50aca39', name: "floating-action-button" }))))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/swirl-autocomplete.js CHANGED Viewed

@@ -223,17 +223,17 @@ const SwirlAutocomplete$1 = /*@__PURE__*/ proxyCustomElement(class SwirlAutocomp
         const className = classNames("autocomplete", {
             "autocomplete--inactive": !this.active,
         });
-        return (h(Host, { key: '35803245ee554c6f4d3ead9f87a1cdf73343007f' }, h("div", { key: '0237472750287689c060557515ffcf6d208c2a6e', class: className, onKeyDown: this.onKeyDown }, this.multiSelect &&
+        return (h(Host, { key: '6ac4eb7a1f520ca9292004fb07da32ada3268808' }, h("div", { key: '4a5d55d90fa0ab8387f67b30dca24225c577b32f', class: className, onKeyDown: this.onKeyDown }, this.multiSelect &&
             Array.isArray(this.value) &&
-            this.value.length > 0 && (h("div", { key: 'e06650357d144482792cb5a78ced14a49f77df6c', class: "autocomplete__multi-select-tags" }, h("swirl-stack", { key: '2b93f17cae1e7d2683d41eb4da28beb9fd9c378e', orientation: "horizontal", spacing: "8", wrap: true }, this.value.map((item) => {
+            this.value.length > 0 && (h("div", { key: 'a22265baff3265c999a162647c2216ea5cb1969e', class: "autocomplete__multi-select-tags" }, h("swirl-stack", { key: '5619bc2bd934857c663efd58c91b9eaaf0207e63', orientation: "horizontal", spacing: "8", wrap: true }, this.value.map((item) => {
             return (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 }));
-        })))), h("swirl-text-input", { key: 'fe61f1a45792f11098c08c9a519c7286288c3ff2', 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 }), h("div", { key: '13c30246e60759e39e6f86b95286673d096e7724', class: "autocomplete__listbox-container", onFocusout: this.onFocusOut, ref: (el) => (this.listboxContainerEl = el), style: {
+        })))), 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 }), h("div", { key: 'd6d85b173b4b889422deed9d26b2a3edd2558383', 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 && (h("div", { key: 'eb4fef11c6eedb9b5aa04ea9275f80d1249bad28', class: "autocomplete__spinner" }, h("swirl-spinner", { key: '8dd45fb707d886f01bcb8b7036a30fa6af4c0918' }))), this.suggestions.length > 0 && (h("swirl-option-list", { key: '95db25769911dcc9876eb94730adeb092844d97d', 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) => (h("swirl-option-list-item", { selected: Array.isArray(this.value)
+            } }, this.loading && (h("div", { key: '61d3b7a03a79c66c7dbb8885ff3a95d57badc19f', class: "autocomplete__spinner" }, h("swirl-spinner", { key: '666f366558c17cb9d57fdc36ddaf95862706d04c' }))), this.suggestions.length > 0 && (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) => (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/components/swirl-avatar-group.js CHANGED Viewed

@@ -29,7 +29,7 @@ const SwirlAvatarGroup$1 = /*@__PURE__*/ proxyCustomElement(class SwirlAvatarGro
             "avatar-group--has-badge": Boolean(this.badge),
         });
         const badgeClassName = classNames("avatar-group__badge");
-        return (h(Host, { key: '5b386bdc0c753d8ef01cbb733643a60e96ab89fe' }, h("div", { key: 'd3e47d6670ac21c8d202b76dbde2861f6bcaf57a', class: className, role: "group" }, h("slot", { key: 'a81602480b721dcd9b90b8c36c5f795d7a5d6463' }), this.badge && (h("span", { key: '224ac43404406dbcd768b812fc6940514b9ea36f', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
+        return (h(Host, { key: '8b1974dc2a231ee1de52209f9e5ae412f0f8011d' }, h("div", { key: 'bae70688b047700541351d086a730cea828265e4', class: className, role: "group" }, h("slot", { key: '49eaf6ad73bc4aaefdae4c2b453449e34496085c' }), this.badge && (h("span", { key: 'ffbd195fd9b470ad199e5ca3526b6d8457fa70a0', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
     }
     static get style() { return SwirlAvatarGroupStyle0; }
 }, [1, "swirl-avatar-group", {

package/dist/components/swirl-avatar.js CHANGED Viewed

@@ -109,7 +109,7 @@ const SwirlAvatar$1 = /*@__PURE__*/ proxyCustomElement(class SwirlAvatar extends
         });
         const badgeClassName = classNames("avatar__badge", `avatar__badge--position-${this.badgePosition}`);
         const toolClassName = classNames("avatar__tool", `avatar__tool--position-${this.toolPosition}`);
-        return (h(Host, { key: '58a018fec9dcb72f391e50040a6b4e6b4559751e', "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 }, h("span", { key: 'f44174ddb46d74bdeea62dd6f81846913c46b8ad', class: className, part: "avatar" }, showImage && (h("span", { key: '1ed67acba8ab9f7c154c7e6647c15dd991db55e1', class: "avatar__image" }, h("img", { key: '4efe8dcf0fa3c5a0aab5c0ec53ea09be8c49bccf', 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 && (h("span", { key: 'b8e05f3d8cefe38da0c24fb9fef0f215cff01f1d', class: "avatar__initials" }, h("span", { key: 'e57114e2cacf55923020e6fda9ad16bb6eecc887' }, this.initials))), showIcon && h("span", { key: 'd1d9ee462bf6574cf98f991b6b963d51963dfa3b', class: "avatar__icon", innerHTML: this.icon }), showFallbackIcon && (h("span", { key: 'a7dfe378cb3f824094bfd59ce3c49bcbd3c3ded6', class: "avatar__icon" }, h("swirl-icon-person", { key: '162e29ddddd261833c31d679d4169fd056461ad1' }))), showBadge && (h("span", { key: '82a4f2a24fe237de8722e39a2a43030d24c7bf0f', class: badgeClassName, innerHTML: this.badge })), h("span", { key: 'aebe16ddb21e9ab756168a15d0e0478bc9c7fdd6', class: toolClassName }, h("slot", { key: '207a5c9b2b59e9e6dd4c424a5e8c968a5973b904', name: "tool" }))), this.showLabel && (h("span", { key: '5c76d712a42ef23ac0603e4c9268b57b621e4c1b', "aria-hidden": true, class: "avatar__label" }, this.label))));
+        return (h(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 }, h("span", { key: 'e31108d3217700983679b19317768f2de000f4cd', class: className, part: "avatar" }, showImage && (h("span", { key: '004a6eb9195d75aa32097aeb8324910ea2b03579', class: "avatar__image" }, 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 && (h("span", { key: '4d1545a4fdda13d56727a4fd66ffe7835d9a8745', class: "avatar__initials" }, h("span", { key: '0b2b97fc6403d2f8cedbef447838b1e7d88a21a6' }, this.initials))), showIcon && h("span", { key: '53c2ecde366fa25580a9c68fdf1c9648a48ce7d1', class: "avatar__icon", innerHTML: this.icon }), showFallbackIcon && (h("span", { key: '14a9f49eaf1085146ed32777bf198a506d29ea47', class: "avatar__icon" }, h("swirl-icon-person", { key: 'e252ae666d81bb9854e0285e5b2ad029151a5cec' }))), showBadge && (h("span", { key: '69bbc5582ebdccc744a88f03a201899056a25b54', class: badgeClassName, innerHTML: this.badge })), h("span", { key: '929ebb5406c2c2fa2ab5ff7717f20ba0a15e35f2', class: toolClassName }, h("slot", { key: 'bd2d4989f989ac54c08b23ff18297a728d4eb9cb', name: "tool" }))), this.showLabel && (h("span", { key: '39d12f1d8e5a480e2c4bd51907198d224f6b2cc0', "aria-hidden": true, class: "avatar__label" }, this.label))));
     }
     get element() { return this; }
     static get watchers() { return {

package/dist/components/swirl-badge2.js CHANGED Viewed

@@ -20,7 +20,7 @@ const SwirlBadge = /*@__PURE__*/ proxyCustomElement(class SwirlBadge extends HTM
         const className = classNames("badge", `badge--intent-${this.intent}`, `badge--size-${this.size}`, `badge--variant-${this.variant}`, {
             "badge--has-icon": this.icon,
         });
-        return (h(Host, { key: '06a07667ccb9474de7010dfc31c2119d651bb476', role: "status" }, h("span", { key: 'e677f471ca17db30f0fb63c53b4b175f1bb23082', class: className, part: "badge" }, this.icon && h("span", { key: '8773650b811868a363f29b63d35b890bbc97baf7', class: "badge__icon", innerHTML: this.icon }), this.icon === undefined && this.variant !== "dot" ? (h("span", { class: "badge__label" }, this.label)) : (h(Fragment, null, this.icon === undefined && (h("span", { class: "badge__label" }, "\u00A0")), h("swirl-visually-hidden", null, this.label))))));
+        return (h(Host, { key: '7ec199a85eb07c43407da840c5b1964c86291e00', role: "status" }, h("span", { key: 'a7304947718959455a295168b5a3923d619c035d', class: className, part: "badge" }, this.icon && h("span", { key: 'e9c1845f11ee7f0f3f74d2bf9158b28bed1cb0ed', class: "badge__icon", innerHTML: this.icon }), this.icon === undefined && this.variant !== "dot" ? (h("span", { class: "badge__label" }, this.label)) : (h(Fragment, null, this.icon === undefined && (h("span", { class: "badge__label" }, "\u00A0")), h("swirl-visually-hidden", null, this.label))))));
     }
     static get style() { return SwirlBadgeStyle0; }
 }, [1, "swirl-badge", {

package/dist/components/swirl-banner.js CHANGED Viewed

@@ -63,7 +63,7 @@ const SwirlBanner$1 = /*@__PURE__*/ proxyCustomElement(class SwirlBanner extends
         const className = classNames("banner", `banner--intent-${this.intent}`, `banner--size-${this.size}`, {
             "banner--has-icon": showIcon,
         });
-        return (h(Host, { key: '59ad8b46103af68b01514dffb4a8ffc3f7366135' }, h("div", { key: 'e7a44b513cc0e362187b7972bbe30370b9789b1d', "aria-describedby": "content", class: className, role: this.importance, tabIndex: 0 }, h("div", { key: '4465f6f6ab0afe3231e25a52192a9f56d5756efe', class: "banner__content", id: "content", part: "banner__content" }, showIcon && (h("span", { key: '4aa59545611d08217a0edb767ee34f5d7fc2e18b', "aria-hidden": "true", class: "banner__icon", innerHTML: icon, ref: (el) => (this.iconEl = el) })), h("span", { key: '91ee916917e08fd7d19277740a63c6efa2493910', class: "banner__text" }, this.content)), showControls && (h("div", { key: '49b0b4c1f8b83e60e033fd3729c1591f3ba961bc', class: "banner__controls" }, this.actionLabel && (h("button", { key: '3642186b3c70e2a2a2fef4ec21ab3cda77d345c6', class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel)), this.dismissable && (h("button", { key: 'a09f723ea799b686f0e06baeeb87590a1b60f1fa', "aria-label": this.dismissLabel, class: "banner__dismiss-button", onClick: this.onDismiss, part: "banner__dismiss-button", ref: (el) => (this.dismissButtonEl = el), type: "button" }, h("swirl-icon-close", { key: 'caaba0ff27439dd72e1efd50178a253e496abd4d' }))))))));
+        return (h(Host, { key: 'fcbf3df259fdc2f6a1a87a9156f87c576a28bda8' }, h("div", { key: 'eb8cff02af80842164c9f4b9867e4c684fc76825', "aria-describedby": "content", class: className, role: this.importance, tabIndex: 0 }, h("div", { key: 'd114781c6d652f7bf1ef575cc5d357e7962eb9b8', class: "banner__content", id: "content", part: "banner__content" }, showIcon && (h("span", { key: '01ac20daad7dd1452bb8325e6b619c7697f4800e', "aria-hidden": "true", class: "banner__icon", innerHTML: icon, ref: (el) => (this.iconEl = el) })), h("span", { key: 'b5614f90d8ce542046a9f7caceeeb117a2770d20', class: "banner__text" }, this.content)), showControls && (h("div", { key: 'a05e4bed3bf3fb3982a89dd71b2feb335fcb9322', class: "banner__controls" }, this.actionLabel && (h("button", { key: '3f0b7a87f1fdcb5efd3ac0dc6d4ef7101ae21013', class: "banner__action-button", onClick: this.onAction, part: "banner__action-button", type: "button" }, this.actionLabel)), this.dismissable && (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" }, h("swirl-icon-close", { key: '4ee74722160180d6cf5371f5f009f3f423b08bf6' }))))))));
     }
     get element() { return this; }
     static get style() { return SwirlBannerStyle0; }

package/dist/components/swirl-box2.js CHANGED Viewed

@@ -118,7 +118,7 @@ const SwirlBox = /*@__PURE__*/ proxyCustomElement(class SwirlBox extends HTMLEle
             "box--scrolled-to-top": this.scrollState.scrolledToTop,
             "box--scrolled-to-bottom": this.scrollState.scrolledToBottom,
         });
-        return (h(Host, { key: '22989d7972a37c53b50f879639bff0581214d528', class: className, onScroll: this.onScroll, style: styles }, h("slot", { key: '8628bb4a2474579564e1352967b8e4c48026c906' })));
+        return (h(Host, { key: '31f4331552b01e796f7923ebc8a302a97cc499df', class: className, onScroll: this.onScroll, style: styles }, h("slot", { key: '1b8c8c79e009617e311203b6d004a7e4e25bd211' })));
     }
     get el() { return this; }
     static get style() { return SwirlBoxStyle0; }

package/dist/components/swirl-button-group2.js CHANGED Viewed

@@ -21,11 +21,11 @@ const SwirlButtonGroup = /*@__PURE__*/ proxyCustomElement(class SwirlButtonGroup
         const className = classNames("button-group", {
             "button-group--segmented": this.segmented,
         });
-        return (h(Host, { key: '663df05c0ea2f6abeb84e5e8d505d86182b8db03' }, h("swirl-stack", { key: '24b8bfa87aedd82c415c09ef003ba5fcfc77d65a', align: this.orientation === "vertical" && this.stretch
+        return (h(Host, { key: 'a32468ae01627af933623c22b640fa3f50b4d068' }, h("swirl-stack", { key: '1b2951f02b3171bc556dbb7e24b9fefefe74a791', 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 }, h("slot", { key: '06f198d3ec7d7a064a074358ba446fdc66595f0b' }))));
+                : "start", orientation: this.orientation, role: "group", spacing: spacing, wrap: this.wrap }, h("slot", { key: 'ced53e457fce3021ec5a1bcca7099b709e6d52df' }))));
     }
     static get style() { return SwirlButtonGroupStyle0; }
 }, [1, "swirl-button-group", {

package/dist/components/swirl-button2.js CHANGED Viewed

@@ -97,9 +97,9 @@ const SwirlButton = /*@__PURE__*/ proxyCustomElement(class SwirlButton extends H
             "button--pressed": this.pressed,
         });
         const Tag = isLink ? "a" : "button";
-        return (h(Host, { key: '9f7e6331c399db3c4bfd13decb2122be60e5e065', style: { pointerEvents: this.disabled ? "none" : "" } }, h(Tag, { key: '859b6ac29de2c34bb8d83195f15204e533e6def2', "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 (h(Host, { key: '67c5602db91b6efe4a7218dff1357b9a0dbb05ce', style: { pointerEvents: this.disabled ? "none" : "" } }, 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
                 ? { fontSize: "inherit", lineHeight: "inherit" }
-                : {} }, Boolean(this.icon) && (h("span", { key: '5c7f0e5a64b7a340f2150f389f20cd9316b187aa', class: "button__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !Boolean(this.icon) && (h("span", { key: 'd6a785644558af85728463ae5a91a0356597f234', class: "button__icon", ref: (el) => (this.iconEl = el) }, h("slot", { key: 'fc0967d404034583af2e3de17f466cd16bb7a9b0', name: "icon" }))), !hideLabel && h("span", { key: 'adffba35ce4ab6113dbdcf9250d288f5ee0755d2', class: "button__label" }, this.label), hasTag && (h("span", { key: 'e9fd1d4ab56df41b7c20b54fd830735571273f4d', class: "button__tag" }, h("slot", { key: 'b102bba403ef8ec9f380fca6153ba242d789e0f0', name: "tag" }))))));
+                : {} }, Boolean(this.icon) && (h("span", { key: '8136de46e80e1ece4412b21a91d80387b1beffe3', class: "button__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !Boolean(this.icon) && (h("span", { key: 'f5b65971de71a8cec64e65a9e8f32457b3ff7935', class: "button__icon", ref: (el) => (this.iconEl = el) }, h("slot", { key: 'f5772e810bf6c0525f6f09c004b68cb473ed9a3c', name: "icon" }))), !hideLabel && h("span", { key: 'e8af5f9bb49bcf10cb72540fe3d953612d33851e', class: "button__label" }, this.label), hasTag && (h("span", { key: '58839bee6bf483cc383c8051f59cc8dd25e496a8', class: "button__tag" }, h("slot", { key: 'fd6b3171b0ecf275e15e333524edf980e0517860', name: "tag" }))))));
     }
     get el() { return this; }
     static get style() { return SwirlButtonStyle0; }

package/dist/components/swirl-card.js CHANGED Viewed

@@ -87,9 +87,9 @@ const SwirlCard$1 = /*@__PURE__*/ proxyCustomElement(class SwirlCard extends HTM
             "card--interactive": this.interactive || this.href,
             "card--is--borderless": this.isBorderless,
         });
-        return (h(Host, { key: '4d6f94076fcdb889d3ce746039607d59be1cd2b8', styles: { height: this.height } }, h(Tag, { key: 'e90f4f6e05f6bce9dc7529e994ac20b78288075f', "aria-label": this.swirlAriaLabel, "aria-labelledby": this.swirlAriaLabelledby, class: className, href: this.href, rel: Boolean(this.href) && this.linkTarget === "_blank"
+        return (h(Host, { key: '4f3f5a5071de38d0e5e61db11f7ffae8ca1c73e7', styles: { height: this.height } }, h(Tag, { key: 'bf957c91919f3465f467fc18167e1c34dee5e310', "aria-label": this.swirlAriaLabel, "aria-labelledby": this.swirlAriaLabelledby, class: className, href: this.href, rel: Boolean(this.href) && this.linkTarget === "_blank"
                 ? "noreferrer"
-                : undefined, style: styles, target: this.linkTarget }, h("div", { key: 'b807d3babd972a8fe3ea78cf09f85a9ba3ef0c60', class: "card__image", style: { aspectRatio: this.imageAspectRatio } }, h("slot", { key: '50785ca3afed12023065baf6f2a6a11d0fc694b2', name: "image" })), h("div", { key: '9cfb96ea5290cbb124c830bb3fb9b24db8d22764', class: "card__body", style: bodyStyles }, h("div", { key: 'b499e82609144d547db7ac0c3a9155d2f5c2edd5', class: "card__content" }, h("slot", { key: '5de143023d98501f3c98c319223aab370d42c46f', name: "content" }))))));
+                : undefined, style: styles, target: this.linkTarget }, h("div", { key: 'fd3c0ab76e5710e1a36b5d637a49b49913c2eec4', class: "card__image", style: { aspectRatio: this.imageAspectRatio } }, h("slot", { key: '07be5fcc88f997b3f857dce8654be2bae6793723', name: "image" })), h("div", { key: 'ae0dd7f377ed5d2dd4701824c7cd0d22a63359e5', class: "card__body", style: bodyStyles }, h("div", { key: '716fd0468a3864bde4b67f6f2921ca04f8ce56b6', class: "card__content" }, h("slot", { key: '988e0aabbbe450703688a2fdb71a91103bed7484', name: "content" }))))));
     }
     get el() { return this; }
     static get style() { return SwirlCardStyle0; }

package/dist/components/swirl-carousel-slide.js CHANGED Viewed

@@ -17,7 +17,7 @@ const SwirlCarouselSlide$1 = /*@__PURE__*/ proxyCustomElement(class SwirlCarouse
         const className = classNames("carousel-slide", {
             "carousel-slide--has-min-height": Boolean(this.minHeight),
         });
-        return (h(Host, { key: '1e818397fe4302ceaba585b537c123317307452d', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, h("slot", { key: '0dfc63ca13321615bb5b3295e767c9e4ed82bac2' })));
+        return (h(Host, { key: '98ebeeaf4beb6d66cc8bb360a2119f9db6bc1e36', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, h("slot", { key: '5b88284bf48d0ca280696c1033e2344fc01f151f' })));
     }
     static get style() { return SwirlCarouselSlideStyle0; }
 }, [1, "swirl-carousel-slide", {

package/dist/components/swirl-carousel.js CHANGED Viewed

@@ -146,7 +146,7 @@ const SwirlCarousel$1 = /*@__PURE__*/ proxyCustomElement(class SwirlCarousel ext
             "carousel--is-at-start": this.isAtStart,
             "carousel--is-at-end": this.isAtEnd,
         });
-        return (h(Host, { key: '7a23607d98ec5bc759fdcae7ba70df9a6940f187', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, h("div", { key: '1223f0cd4acd6556cce428276f2664201bddbad0', class: className }, this.isScrollable && !this.isAtStart && (h("swirl-button", { key: '86a5e0b334e7bff828bb2477cf912d54b9489f2e', class: "carousel__previous-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: true, variant: "floating" })), this.isScrollable && !this.isAtEnd && (h("swirl-button", { key: '794a310026cec6b9203a99207e2aa4e732ff9e01', class: "carousel__next-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: true, variant: "floating" })), h("div", { key: '98179d7a5467375248823e59e5f8d1f080d5b39c', "aria-live": "polite", class: "carousel__slides", style: slidesStyles, onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, h("slot", { key: '0ff0113a8d91b2366b517da4ef9d9219062d32b0', onSlotchange: this.onSlotChange })))));
+        return (h(Host, { key: 'dc282887cedadc493fda9f71fd249cb62a0efd3f', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, h("div", { key: 'f48fab6833ba11a2493513b8b2fbfd28c5c62339', class: className }, this.isScrollable && !this.isAtStart && (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 && (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" })), h("div", { key: '247e8f2b15b9d37159f0a7faaca86db851310a18', "aria-live": "polite", class: "carousel__slides", style: slidesStyles, onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, h("slot", { key: '16d4b9884689f40d72a912466b0579042941b4b6', onSlotchange: this.onSlotChange })))));
     }
     get el() { return this; }
     static get style() { return SwirlCarouselStyle0; }

package/dist/components/swirl-checkbox.js CHANGED Viewed

@@ -54,7 +54,7 @@ const SwirlCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class SwirlCheckbox ext
             "checkbox--invalid": this.invalid,
             "checkbox--unchecked": unchecked,
         });
-        return (h(Host, { key: '3f791853cc40f9cea14b696c97a7e0ffcbe83b2f', style: { width: this.variant === "card" ? "100%" : undefined } }, h("label", { key: '5343b2eb0c188c8bba2ac717d62de26711b29aa3', class: className, htmlFor: this.inputId }, h("span", { key: '0e3c767e4cf73aa2daddfb574f48a24f8753bc32', class: "checkbox__control" }, h("swirl-visually-hidden", { key: '518d7373a43419fb06b5f4a5cee587bfe469ff89' }, h("input", { key: '389abda596f18256d386f233e6472bd3e091f63a', "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 })), h("span", { key: 'c3ea514dbc59eb64e8e9f58f8d66c9460e09fc12', "aria-hidden": "true", class: "checkbox__box" }, h("span", { key: '03f2234bf274c734f1ddcd30e3e7fcb03f7c0e9e', class: "checkbox__icon" }, checked && h("swirl-icon-check-strong", { key: '3676909668e487ad3eced64ca05aef2617e6c99a' }), indeterminate && (h("span", { key: '8b114f66464a5c125888ad3571993b71a4c51a6b', class: "checkbox__indeterminate-icon" }))))), showLabelContainer && (h("span", { key: '5d28ddb318680a3373d4ca771c972ff223d38b25', class: "checkbox__label-container" }, this.label && h("span", { key: '4baefd6cb705a6b9181c4e3c5653016f2713d653', class: "checkbox__label" }, this.label), this.description && (h("span", { key: '4beba68c4124354bcb15251332bf25c666787b9d', class: "checkbox__description" }, this.description)))))));
+        return (h(Host, { key: '47e2bb1334f5370dc6733ce92e24c9561339077a', style: { width: this.variant === "card" ? "100%" : undefined } }, h("label", { key: '80abed84bb07d0a3949ab6619654653010d0fb97', class: className, htmlFor: this.inputId }, h("span", { key: '4be8a5ea2485614530f48930f01601ea69b8e429', class: "checkbox__control" }, h("swirl-visually-hidden", { key: '951b2431cb4b257b874a1398cd098572afef818c' }, 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 })), h("span", { key: '240669d2a046ad4a233654e882ac7aafe7bd6cbf', "aria-hidden": "true", class: "checkbox__box" }, h("span", { key: 'e58d952cf7e5f8bda65d74e4ea99f98b30c55ab9', class: "checkbox__icon" }, checked && h("swirl-icon-check-strong", { key: '761aadd9c03b94f134c90f0b05f1feaf49aa8f89' }), indeterminate && (h("span", { key: '3c9042575b66be70f1f727425bd85c21e33e8377', class: "checkbox__indeterminate-icon" }))))), showLabelContainer && (h("span", { key: 'b5b9b877597a083a847e8fea977da5373eb85471', class: "checkbox__label-container" }, this.label && h("span", { key: '25eaf96669b412282e6805b42635c7630eb0c1ac', class: "checkbox__label" }, this.label), this.description && (h("span", { key: '2cf8b31a6d1d4860fb01cfce2421d5b0535ca45e', class: "checkbox__description" }, this.description)))))));
     }
     static get style() { return SwirlCheckboxStyle0; }
 }, [2, "swirl-checkbox", {

package/dist/components/swirl-chip.js CHANGED Viewed

@@ -56,7 +56,7 @@ const SwirlChip$1 = /*@__PURE__*/ proxyCustomElement(class SwirlChip extends HTM
             "chip--interactive": this.interactive || this.pressed !== undefined,
             "chip--removable": this.removable,
         });
-        return (h(Host, { key: 'be1a929a9efe4fe6a6fee27f08218063ac03a8ba' }, h(Tag, { key: '2c816c3c7ba603c3c403947d9e2f043ea00c4061', "aria-pressed": this.pressed !== undefined ? String(this.pressed) : undefined, class: className, onClick: this.chipClick.emit, type: this.interactive ? "button" : undefined }, h("span", { key: 'e570bc840be98fd23d6ff46517115e1ea6e1a111', class: "chip__inner" }, showAvatar && (h("span", { key: '18e721ec9c55170f398e2b9d2df0be97a54626a4', class: "chip__avatar" }, h("slot", { key: '952ae3c808156b4a3f9d53e45d00af33d8f1d070', name: "avatar" }))), showIcon && (h("span", { key: '179d91ff81b35f53469f8f5816b73b7fe324f744', class: "chip__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), h("span", { key: 'fa57586bd59ebd9c9722f3bbf64c5c37ab1ab5e6', class: "chip__label" }, this.label)), this.progress !== undefined && (h("span", { key: '4f15b8329caa1ff0de30812340c1ef6efead3797', class: "chip__progress-indicator" }, h("swirl-progress-indicator", { key: '5e349c092244b2aae8b33e485aa8794e22745a2a', label: this.progressBarLabel, value: this.progress })))), this.removable && (h("button", { key: '94d8906bbef7392a08326f0e6ab6c63c98b6979d', "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.remove.emit, type: "button" }, h("swirl-icon-close", { key: 'd2ebf4e2cb3ad637ccd42fdefc4ce1d2e4b27950', size: 20 })))));
+        return (h(Host, { key: 'bf343033f4413d195c6746338678f0f7e8a8f766' }, h(Tag, { key: '97b2f2ee1db67797a6d7d56aa1b6729d62cc14b4', "aria-pressed": this.pressed !== undefined ? String(this.pressed) : undefined, class: className, onClick: this.chipClick.emit, type: this.interactive ? "button" : undefined }, h("span", { key: 'ba597b789fdcc9e459050b07689486d21927a9b4', class: "chip__inner" }, showAvatar && (h("span", { key: '78fa63d15badf26266d233b70e32efd028b1df74', class: "chip__avatar" }, h("slot", { key: '0a556db41ea252ec2b8bd6a4b68da0013e853d16', name: "avatar" }))), showIcon && (h("span", { key: 'd6c90653278a472e4028060b2ff8755201869bfe', class: "chip__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), h("span", { key: 'da2bb584ec8c7f9fb746aefc5ff43aca3828526d', class: "chip__label" }, this.label)), this.progress !== undefined && (h("span", { key: 'e3d994faad82dd035ff6e2081c22852c6011ca42', class: "chip__progress-indicator" }, h("swirl-progress-indicator", { key: 'd0eddd986b078dc4e549940e0b781d0c07541697', label: this.progressBarLabel, value: this.progress })))), this.removable && (h("button", { key: '8ad96165e26097e8e9da65d54fc335ebdcc0a842', "aria-label": this.removeButtonLabel, class: "chip__remove-button", onClick: this.remove.emit, type: "button" }, h("swirl-icon-close", { key: 'b916f233e0329a7f0bf36241deff78f1624f9818', size: 20 })))));
     }
     get el() { return this; }
     static get style() { return SwirlChipStyle0; }

package/dist/components/swirl-color-input.js CHANGED Viewed

@@ -458,11 +458,11 @@ const SwirlColorInput$1 = /*@__PURE__*/ proxyCustomElement(class SwirlColorInput
         const className = classNames("color-input", {
             "color-input--inline": this.inline,
         });
-        return (h(Host, { key: '9c6c2ae8eea70b1c7a3d655966f01eb10fa02126' }, h("div", { key: '9e9952887c16d3b416c733ce3f4b296f1a20bd84', class: className }, h("input", { key: '11f9f1059e8d0794b977d9de4092d3a663088c95', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "color-input__input", disabled: this.disabled, maxLength: 7, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, spellcheck: "false", type: "text", value: this.value }), h("swirl-popover-trigger", { key: 'e1eaf6acc5216eac9720e49b0da4db3ed3d44263', swirlPopover: this.pickerId }, h("button", { key: '2835b722d009daf3018de69061a67274f6cf66a0', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
+        return (h(Host, { key: '67685139e5a399b98a884c57f0579f77e1f341ee' }, h("div", { key: '2f328355e40b143f77ae167797796db63f2c1397', class: className }, 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 }), h("swirl-popover-trigger", { key: '3195f52afae359d25c04d9353ddc56bd9aa941df', swirlPopover: this.pickerId }, h("button", { key: '3fc16c5ea5097dcc27e05f27d6f23445aeaa53fb', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
                 backgroundColor: this.disabled
                     ? "var(--s-border-subdued)"
                     : this.value,
-            }, type: "button" })), h("swirl-popover", { key: 'bc1d9f94ef65a8307e6e006f013d9a354576cbe7', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, h("swirl-box", { key: 'd2e9af494473cfdc2031f77d39e4fa3c5fffb2ae', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, h("hex-color-picker", { key: 'd90d1d25866639f722abd765de86985d865931f0', color: this.value, ref: (el) => (this.picker = el) }))))));
+            }, type: "button" })), h("swirl-popover", { key: 'bbbaa4331db5f67a8a413e3b11cf7ab47cd1f428', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, h("swirl-box", { key: 'ca52b4563f99c98a8a1989185fc0995a5b821f18', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, h("hex-color-picker", { key: 'a1b2c59033fbb4c80b6d98289176f646c14a4a14', color: this.value, ref: (el) => (this.picker = el) }))))));
     }
     static get watchers() { return {
         "value": ["watchValue"]

package/dist/components/swirl-columns.js CHANGED Viewed

@@ -12,10 +12,10 @@ const SwirlColumns$1 = /*@__PURE__*/ proxyCustomElement(class SwirlColumns exten
         this.spacing = undefined;
     }
     render() {
-        return (h(Host, { key: '513552bd948ca6af6ce0514800f01150fa81aaea' }, h("div", { key: 'fd74ac26cfe66fc07aaa27ba5d54ffab58e1631a', class: "columns", style: {
+        return (h(Host, { key: 'f95ec95c66e777fc5f3ba9ea7383f6292fa8edbc' }, h("div", { key: '49f32dedc864c768b62076e8d46a254e7be3f4ac', class: "columns", style: {
                 gridTemplateColumns: this.columns,
                 gap: `var(--s-space-${this.spacing})`,
-            } }, h("slot", { key: '72c0008f8f6c08239659b779794455864f7f7b08' }))));
+            } }, h("slot", { key: '0d6094db0d7f4e6b5ebfd3a88fe802ad3a562ff6' }))));
     }
     static get style() { return SwirlColumnsStyle0; }
 }, [1, "swirl-columns", {

package/dist/components/swirl-console-layout.js CHANGED Viewed

@@ -126,11 +126,11 @@ const SwirlConsoleLayout$1 = /*@__PURE__*/ proxyCustomElement(class SwirlConsole
             "console-layout--sidebar-active": this.sidebarActive,
             "console-layout--empty-app-bar": !Boolean(this.appName) && !this.showHelpButton,
         });
-        return (h(Host, { key: '75ed644620dd6dd6fbfe481181404f63b43bf668' }, h("div", { key: '930295355c9adad85f8d1fb0ffa72105ee9d81ed', class: className, onClick: this.onClick, onKeyDown: this.onKeyDown }, h("header", { key: '2b135ece93effa297f2676feb8a3784153c990cf', "aria-hidden": String(!this.sidebarActive), class: "console-layout__sidebar", ref: (el) => (this.sidebarEl = el) }, h("div", { key: '2469171f4c53b0b47c0a11f2559273da03cc8e4f', class: "console-layout__header" }, h("div", { key: 'ea1785c30bdfc66f26d060e9b21e1bd95e08de7b', class: "console-layout__logo" }, h("svg", { key: '4d6a8b892200363145996ce3ffc1f5e9c66e20d9', class: "console-layout__logo-mark", fill: "none", height: "26", viewBox: "0 0 16 26", width: "16", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '310df4ff4e8cd172ebaa278bf30eb2cb2ffb2b92', d: "M0.624238 14.0705C0.326496 13.5353 0.118077 12.9406 0.0287543 12.3161C-0.0307941 11.662 -0.0010199 11.0375 0.147851 10.4428C0.296722 9.84813 0.594464 9.25343 0.951754 8.77767C1.33882 8.27217 1.78543 7.85588 2.35114 7.55853L14.6181 0.362671C14.9159 0.8979 15.1243 1.4926 15.2136 2.11703C15.3029 2.74147 15.2434 3.3659 15.0945 3.99034C14.9456 4.58504 14.6479 5.17974 14.2906 5.6555C13.9035 6.16099 13.4569 6.57728 12.8912 6.87463L0.624238 14.0705Z", fill: "#145AF5" }), h("path", { key: '357d0b108de4f1a41a1f28ebd54ce4373900233f', d: "M3.69214 21.4743C3.3944 20.9391 3.18598 20.3444 3.09666 19.72C3.00733 19.0956 3.06688 18.4711 3.21575 17.8467C3.36462 17.252 3.66237 16.6573 4.01966 16.1815C4.40672 15.676 4.85333 15.2597 5.41904 14.9624L12.2076 10.9779C12.5053 11.5131 12.7137 12.1078 12.803 12.7323C12.8924 13.3567 12.8328 13.9811 12.6839 14.6056C12.5351 15.2003 12.2373 15.795 11.88 16.2707C11.493 16.7762 11.0464 17.1925 10.4807 17.4899L3.69214 21.4743Z", fill: "#145AF5" }), h("path", { key: 'fd78a60381f3b4899b8d2a9f64ad8e464e69d5bb', d: "M3.69141 21.4739L7.77047 19.0951C8.39573 20.1953 8.5446 21.5036 8.24686 22.7228C7.91934 23.9419 7.14521 24.9826 6.04357 25.6368L3.69141 21.4739Z", fill: "#80A8F4" }), h("path", { key: '675eaedbd6f6c31a2ee3863eb4f055d957476964', d: "M12.2072 10.9785L7.32419 10.1459L0.625 14.0709L5.38887 14.9629L12.2072 10.9785Z", fill: "#80A8F4" })), h("swirl-text", { key: '4aa22ee51a9b06aa5295491ce3bfb0d4591a3b0c', class: "console-layout__logo-text", weight: "medium" }, this.logoText))), h("nav", { key: '0eb660b82f53b80637d72d67b4f58be787a96157', "aria-label": this.navigationLabel, class: "console-layout__navigation" }, h("slot", { key: 'f6db2aec137cf9a4a6b6a076178dbe88c740193c', name: "navigation" })), h("div", { key: '4ff4932553cf449eb7807fd4c02a6c98bf4f2a14', class: "console-layout__user" }, h("slot", { key: 'e03924c209585283216ac4caec3d9d3e0dba46fa', name: "user" }))), h("main", { key: '961a8e76f831093faa4dff577d16d5e219181b4f', "aria-labelledby": Boolean(this.appName) ? "app-name" : undefined, class: "console-layout__main" }, h("header", { key: 'c93823d2615478e3b372767dd552be282089d2f9', class: "console-layout__app-bar" }, h("span", { key: 'f67587cbd1b2c1486e52bd17f231d47fadeb7d13', class: "console-layout__mobile-navigation-button" }, h("swirl-button", { key: '1b35b8c259050f9ad810a3a677e042c3e18f2b78', swirlAriaExpanded: String(this.sidebarActive), hideLabel: true, icon: this.sidebarActive
+        return (h(Host, { key: '0f046eb6eedcaae0638b0f7c63428549a4f6b399' }, h("div", { key: '8b14182bc052f107c3df784d89d26be28d61fc4f', class: className, onClick: this.onClick, onKeyDown: this.onKeyDown }, h("header", { key: 'b5d470785930c47d3bd359c865fdf4b39fd68f57', "aria-hidden": String(!this.sidebarActive), class: "console-layout__sidebar", ref: (el) => (this.sidebarEl = el) }, h("div", { key: 'd7f968eab1395cdc747f234b43a78e1e17cb23a8', class: "console-layout__header" }, h("div", { key: '61e58e078562b5c7e697f7c3b4b0d34feda304be', class: "console-layout__logo" }, h("svg", { key: '1a9b2af0b2297053a43e492479857bacc115e805', class: "console-layout__logo-mark", fill: "none", height: "26", viewBox: "0 0 16 26", width: "16", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '56bcd815daa57f69d14577179107bb1adccecb5a', d: "M0.624238 14.0705C0.326496 13.5353 0.118077 12.9406 0.0287543 12.3161C-0.0307941 11.662 -0.0010199 11.0375 0.147851 10.4428C0.296722 9.84813 0.594464 9.25343 0.951754 8.77767C1.33882 8.27217 1.78543 7.85588 2.35114 7.55853L14.6181 0.362671C14.9159 0.8979 15.1243 1.4926 15.2136 2.11703C15.3029 2.74147 15.2434 3.3659 15.0945 3.99034C14.9456 4.58504 14.6479 5.17974 14.2906 5.6555C13.9035 6.16099 13.4569 6.57728 12.8912 6.87463L0.624238 14.0705Z", fill: "#145AF5" }), h("path", { key: '7e27fd822acfb0750452a72f79e29f90604aee75', d: "M3.69214 21.4743C3.3944 20.9391 3.18598 20.3444 3.09666 19.72C3.00733 19.0956 3.06688 18.4711 3.21575 17.8467C3.36462 17.252 3.66237 16.6573 4.01966 16.1815C4.40672 15.676 4.85333 15.2597 5.41904 14.9624L12.2076 10.9779C12.5053 11.5131 12.7137 12.1078 12.803 12.7323C12.8924 13.3567 12.8328 13.9811 12.6839 14.6056C12.5351 15.2003 12.2373 15.795 11.88 16.2707C11.493 16.7762 11.0464 17.1925 10.4807 17.4899L3.69214 21.4743Z", fill: "#145AF5" }), h("path", { key: '7895d92663b4ad47c09f05053e2ed55a256ac47c', d: "M3.69141 21.4739L7.77047 19.0951C8.39573 20.1953 8.5446 21.5036 8.24686 22.7228C7.91934 23.9419 7.14521 24.9826 6.04357 25.6368L3.69141 21.4739Z", fill: "#80A8F4" }), h("path", { key: 'dbe5e9af9183c7162b4ccbabc898d20166c411aa', d: "M12.2072 10.9785L7.32419 10.1459L0.625 14.0709L5.38887 14.9629L12.2072 10.9785Z", fill: "#80A8F4" })), h("swirl-text", { key: '935f73680279f02497d2f7bec9e4caccf83cfb8c', class: "console-layout__logo-text", weight: "medium" }, this.logoText))), h("nav", { key: 'c7f38107fb0c6f43f6de3ff93a4de47f655685a3', "aria-label": this.navigationLabel, class: "console-layout__navigation" }, h("slot", { key: '043b3e752f719da2c9afb720cb68a4d95eeb320b', name: "navigation" })), h("div", { key: '5956ffab8bae927e90cb0d2d79c83b75693b9055', class: "console-layout__user" }, h("slot", { key: 'fe2084dde620a0d3e72bbc0fd38194e140d290fc', name: "user" }))), h("main", { key: '300eab9e325837adf0bbc6239ea29212a2682466', "aria-labelledby": Boolean(this.appName) ? "app-name" : undefined, class: "console-layout__main" }, h("header", { key: '1bd46509681500efea29681ec453ea9dd80049c5', class: "console-layout__app-bar" }, h("span", { key: '33a66a88001d17a8212307ea0a7e1a688e431fe6', class: "console-layout__mobile-navigation-button" }, h("swirl-button", { key: 'c1517911434a849d483bcb702c2db5587868eb28', swirlAriaExpanded: String(this.sidebarActive), hideLabel: true, icon: this.sidebarActive
                 ? "<swirl-icon-close></swirl-icon-close>"
                 : "<swirl-icon-menu></swirl-icon-menu>", label: this.sidebarActive
                 ? this.hideNavigationButtonLabel
-                : this.showNavigationButtonLabel, onClick: this.onMobileNavigationToggleClick })), h("div", { key: '008daa8874535ad343ed05aa7d77e8320ba2e7e8', class: "console-layout__app-name" }, this.appName && (h("swirl-heading", { key: '4ad05c8d745647c68d431f898fe479bebe0c2a67', as: "h1", headingId: "app-name", level: 4, text: this.appName }))), this.showHelpButton && (h("swirl-button", { key: '1f555370a62f9ed20268f130bf9cf4d21f1e79d6', class: "console-layout__help-button", hideLabel: true, icon: "<swirl-icon-help></swirl-icon-help>", label: this.helpButonLabel, onClick: this.onHelpButtonClick }))), h("section", { key: 'f7fe8db11cba3e8597f4b57f8ec2e7373f5e6638', "aria-labelledby": "heading", class: "console-layout__content", style: contentStyles }, h("header", { key: 'e21f508a98ae0f82e0f90e528fc9896379516936', class: "console-layout__content-header" }, this.showBackButton && (h("swirl-button", { key: 'd9bb9db7d5a63b843003ba1d71160c0195ea0c34', class: "console-layout__back-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButonLabel, onClick: this.onBackButtonClick })), Boolean(this.heading) && (h("div", { key: 'afd67e72011390767de47c60b7221f8fdffe09f4', class: "console-layout__heading-container" }, h("swirl-heading", { key: 'f37db40ba500a367f979bd0beabe9a5c0bdb7232', as: Boolean(this.appName) ? "h2" : "h1", class: "console-layout__heading", headingId: "heading", level: 1, text: this.heading }), this.subheading && (h("swirl-text", { key: 'dc2a19713110e4637e5dc2d092441c0a4b7fb953', class: "console-layout__subheading", color: "subdued" }, this.subheading)))), !Boolean(this.heading) && (h("div", { key: '4a91698804092c72b94ff1b69df3629b7f56cad8', class: "console-layout__heading-container" }, h("slot", { key: '8cd7b053055d78586685446dad60258038b8efa2', name: "heading" }))), h("div", { key: 'd4119e94bdfb42de34b36d67297bc7af64e29fa2', class: "console-layout__content-header-tools" }, h("slot", { key: 'ad6c40d1e415f5e5d3584214a0d13fa21bf33877', name: "content-header-tools" }))), h("div", { key: '21542321dcd2e49c8999b50b64e71f8d3edd651a', class: "console-layout__integration" }, h("slot", { key: 'e5b7c28eb23edbdd6a55e2fa22c8bee71fb496c5', name: "content" }))), h("div", { key: '104a1dbbabc502cde4f5678268b30e391bbd39ad', class: "console-layout__overlays" }, h("slot", { key: 'aa0d9761d84593c32e7034345465f9b301b5d630', name: "overlays" }))))));
+                : this.showNavigationButtonLabel, onClick: this.onMobileNavigationToggleClick })), h("div", { key: '3312be4d5f58607887e510ea359974f5a1ca5ba0', class: "console-layout__app-name" }, this.appName && (h("swirl-heading", { key: '76afe986b60f5c2af8824a435551b72752bce449', as: "h1", headingId: "app-name", level: 4, text: this.appName }))), this.showHelpButton && (h("swirl-button", { key: '72ce1dfea39cc2c78f453f03f0f4a957026bcdaf', class: "console-layout__help-button", hideLabel: true, icon: "<swirl-icon-help></swirl-icon-help>", label: this.helpButonLabel, onClick: this.onHelpButtonClick }))), h("section", { key: 'cf1bb7ab84c7c92ae945a0e30dd5179dc726a91b', "aria-labelledby": "heading", class: "console-layout__content", style: contentStyles }, h("header", { key: 'a30f542803acb725dd33b1a61e2d16971b022901', class: "console-layout__content-header" }, this.showBackButton && (h("swirl-button", { key: '31f826671a789f7c209dabed912cfd63b55abaa6', class: "console-layout__back-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButonLabel, onClick: this.onBackButtonClick })), Boolean(this.heading) && (h("div", { key: '1e9ced9ac4788c4fb990f25cf5db7fd08d6a5be2', class: "console-layout__heading-container" }, h("swirl-heading", { key: '2fa4f3db252d29095cd041d123152a178ed3df89', as: Boolean(this.appName) ? "h2" : "h1", class: "console-layout__heading", headingId: "heading", level: 1, text: this.heading }), this.subheading && (h("swirl-text", { key: 'c5cc991bd0b04ec0ce422a3832888a4d36784692', class: "console-layout__subheading", color: "subdued" }, this.subheading)))), !Boolean(this.heading) && (h("div", { key: 'a513bd74b1169c5c196e1f29dc2cbecde610ea2b', class: "console-layout__heading-container" }, h("slot", { key: 'c01aa2df76e9bc63196e96bc81a7bb10632550a2', name: "heading" }))), h("div", { key: 'f61152be9ccd48e887dea756d14b60d0f5c3759b', class: "console-layout__content-header-tools" }, h("slot", { key: '177dd575d141a103cde526000bc990d48a6992a6', name: "content-header-tools" }))), h("div", { key: '8cf3107df87a2e519f111f95bf397aed4bcab2a6', class: "console-layout__integration" }, h("slot", { key: '5f59b4de368f6b262de64ebd5d246d8dd1c0d2a5', name: "content" }))), h("div", { key: 'cc89695345373b27ee3d87b4aa2cb360cf012788', class: "console-layout__overlays" }, h("slot", { key: '5fa45d9633bd2ed0fa6a61086c6d07b314914e2a', name: "overlays" }))))));
     }
     get el() { return this; }
     static get style() { return SwirlConsoleLayoutStyle0; }

package/dist/components/swirl-date-input.js CHANGED Viewed

@@ -160,7 +160,7 @@ const SwirlDateInput$1 = /*@__PURE__*/ proxyCustomElement(class SwirlDateInput e
         const className = classNames("date-input", {
             "date-input--inline": this.inline,
         });
-        return (h(Host, { key: '760d49e0cfa1b75bafd91f6dc63af304b4a28fb5' }, h("div", { key: '25f237684f05361f41874752d94825cc01c9563c', class: className }, h("input", { key: '13cbe35237ff39527df92a28c2f3efca2a64ac6d', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "date-input__input", disabled: this.disabled, readonly: this.readonly, id: this.id, inputmode: "numeric", onClick: this.onClick, onMouseDown: this.onMouseDown, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), h("swirl-popover-trigger", { key: '295dfe2e795d26f4298c5cf4cb3c9295078b201a', swirlPopover: `popover-${this.id}` }, h("button", { key: '08d2905061476ab4ca9a1b720c31262c18ccded3', "aria-label": this.datePickerTriggerLabel, class: "date-input__date-picker-button", disabled: this.disabled, type: "button" }, h("swirl-icon-today", { key: '366515b84ffeebf39e9f99285f4e959906856caf', size: this.iconSize })))), !this.disabled && (h("swirl-popover", { key: '5ee771ea748a6f92c328f13e41fae578c951a94e', animation: "scale-in-y", class: "date-input__date-picker-popover", id: `popover-${this.id}`, label: this.datePickerLabel, placement: "bottom-end", ref: (el) => (this.pickerPopover = el) }, h("swirl-date-picker", { key: 'f7ac32c0696428502a5cc850d061be0323089284', disableDate: this.datePickerDisableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onValueChange: this.onPickDate, value: dateValue, startDate: dateValue })))));
+        return (h(Host, { key: '6f1c7e87cfac74ff45f260a7970c5489b371c8f0' }, h("div", { key: '8f496c6ae7e1570f42a4e51e3dda84daf118144c', class: className }, h("input", { key: '9b735ede8e499046eb7b1f95d479de9e9a6960f8', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "date-input__input", disabled: this.disabled, readonly: this.readonly, id: this.id, inputmode: "numeric", onClick: this.onClick, onMouseDown: this.onMouseDown, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), h("swirl-popover-trigger", { key: '29b6774d6a009b3ed001a8b948107ab86518bbd6', swirlPopover: `popover-${this.id}` }, h("button", { key: 'd448931a65cb3308444ed09dff1d665a71da6385', "aria-label": this.datePickerTriggerLabel, class: "date-input__date-picker-button", disabled: this.disabled, type: "button" }, h("swirl-icon-today", { key: 'f5f26fe7b2f167c1a2ff45ffeb558bdb42f47756', size: this.iconSize })))), !this.disabled && (h("swirl-popover", { key: '690f07e7f5eeea73a547a0729099a9f9c5bed2a6', animation: "scale-in-y", class: "date-input__date-picker-popover", id: `popover-${this.id}`, label: this.datePickerLabel, placement: "bottom-end", ref: (el) => (this.pickerPopover = el) }, h("swirl-date-picker", { key: 'fafbf985379dc75b7839ded3fa5af72c4e0b468e', disableDate: this.datePickerDisableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onValueChange: this.onPickDate, value: dateValue, startDate: dateValue })))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/swirl-date-picker2.js CHANGED Viewed

@@ -44,7 +44,7 @@ const SwirlDatePicker = /*@__PURE__*/ proxyCustomElement(class SwirlDatePicker e
         const startDate = this.startDate instanceof Date
             ? getISODateString(this.startDate)
             : undefined;
-        return (h(Host, { key: '307829ba5710662434ecb629020f1865a2f5650a', onClick: this.onClick }, h("wc-datepicker", { key: '88b5b0a79692ca10a3c723ea369a63d5f61165ec', elementClassName: "date-picker", disableDate: this.disableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onSelectDate: this.onSelectDate, range: this.range, startDate: startDate, value: this.value })));
+        return (h(Host, { key: 'eea27d2d9723d52ea6cea08cfdb8374af18ca8eb', onClick: this.onClick }, h("wc-datepicker", { key: '16376584edc6b6cf4bb53995e5a47cddd9d95426', elementClassName: "date-picker", disableDate: this.disableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onSelectDate: this.onSelectDate, range: this.range, startDate: startDate, value: this.value })));
     }
     get el() { return this; }
     static get style() { return SwirlDatePickerStyle0; }