@getflip/swirl-components 0.326.0 → 0.328.0

package/dist/components/swirl-table.js

@@ -539,7 +539,7 @@ const SwirlTable$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTable extends H
         const className = classNames("table", {
             "table--keyboard-move": this.movingViaKeyboard,
         });
-        return (h(Host, { key: '06e4c1b14c85f8087eff6c4c17b57b4151d2da27' }, h("div", { key: '0fa9a677c268ebb92b3d7becf1f53b52b0a4ff33', class: className }, this.enableDragDrop && (h("swirl-visually-hidden", { key: 'ec7fa3d2a112dd55c5a051105625f2b25a2afee9' }, h("span", { key: '3a320a8fa201510cc12496ef083c2141c68ae3f6', "aria-live": "assertive" }, this.liveRegionText))), h("div", { key: 'af6ae8d224182cdd082932fd881fe0e795d0f973', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, h("div", { key: '4228435aadc21ce48de348c8d7bd48e808105124', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: 'be36a39145637066fd362d07f27a3886d896159b' }, h("div", { key: 'e580026d98bcd20aeeb9316c5a264186184f6a40', id: "caption" }, this.caption))), h("div", { key: '699109dccaf98aadb7f0279c5f0964ab38a1c05f', role: "rowgroup" }, h("div", { key: 'b981c5a0ead32416480a1ecc0e77fa097ccd81f0', class: "table__header", role: "row" }, h("slot", { key: '0a2f315e8ffca378e6597fa9a168d18277e3bbc8', name: "columns", onSlotchange: this.onSlotChange }))), h("div", { key: '89461021eb6ed43feadd275d62dfd5fcc1c009db', class: "table__body", ref: (el) => (this.bodyEl = el) }, h("slot", { key: '9a4103790373c423fca54fc8f101b0e9818cc211', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (h("div", { key: '1de4404351aaed5527d6e622673071fcdca81736', class: "table__empty-row", role: "row" }, h("div", { key: '8f6e316b6a22c2c81f2ef4cfa804e3c8cfb3ee48', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("swirl-text", { key: '402ff27d0e0f7b8c773470b160a1e82fb7246d38', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (h(Host, { key: 'e5625a5599994aa49cde89dd4b3089c4e4be70ee' }, h("div", { key: '9a3782be9fd19433e40d177c72538812a02fee96', class: className }, this.enableDragDrop && (h("swirl-visually-hidden", { key: '5b09498b3b83ecc365e6cf34d611dc725e0c9380' }, h("span", { key: '1c8669d438082e37a98461cbe3a891cad28b16c8', "aria-live": "assertive" }, this.liveRegionText))), h("div", { key: '0254ab703e36e344ed718692b24b7181a35c1662', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, h("div", { key: '8bea0a0edaab0f359da5056066eeb2de2d0bd6c1', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: '90c368641f8d29ea1e55c8c5a74148c9c86f7dc6' }, h("div", { key: '717e06879bc83642ebce452e49a61a1ab0102be8', id: "caption" }, this.caption))), h("div", { key: '63cc6bc50f68ca4d0aca3d28fd4c7afcbe320977', role: "rowgroup" }, h("div", { key: '25114fb05a16198cc5a387149df3ca46e2afa93e', class: "table__header", role: "row" }, h("slot", { key: 'f25129b8a5c49919c18e24b92e08535113659a2a', name: "columns", onSlotchange: this.onSlotChange }))), h("div", { key: 'e74840547f0f891959efe8c651c7589fa5a84596', class: "table__body", ref: (el) => (this.bodyEl = el) }, h("slot", { key: '4ae4f10734e2a31225ccde5d07a234355bf37d30', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (h("div", { key: '58b5e36698de1e9e9fd36e8dd0d247976d8dbdb0', class: "table__empty-row", role: "row" }, h("div", { key: '33f8e6b1c6d48dff5d0cef521f704493f9d85e7b', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("swirl-text", { key: 'c854a3ac132935900c6150e0d90f5e1990989532', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/swirl-tabs.js

@@ -86,7 +86,7 @@ const SwirlTabs$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTabs extends HTM
         }));
     }
     render() {
-        return (h(Host, { key: '7452164d90f9a6cedf522a5b56059d201feed7a5' }, h("div", { key: '0583fe2822576f803cc175dbd7b4b0ba0a3b4296', class: "tabs" }, h("swirl-tab-bar", { key: '2d6ae5d6d7b982e342c5fb0d8413e6643a423763', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingBlockEnd: this.tabBarPaddingBlockEnd, paddingBlockStart: this.tabBarPaddingBlockStart, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart, variant: this.tabBarVariant })), h("slot", { key: '021aa9a7dcc28f561b68d5e81dc922c5f91c3dd1' })));
+        return (h(Host, { key: '6330eb0e5835f27d6a2b33516c30616e7142fc31' }, h("div", { key: 'fc0b58490e4ce7844b5132c2b7aeb2923adeb551', class: "tabs" }, h("swirl-tab-bar", { key: '395a45e6d4dbe9f298718f70033fe84a67aab29a', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingBlockEnd: this.tabBarPaddingBlockEnd, paddingBlockStart: this.tabBarPaddingBlockStart, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart, variant: this.tabBarVariant })), h("slot", { key: '049a63dcfa026ce1410e8928c79eeeedc265a597' })));
     }
     get el() { return this; }
     static get style() { return SwirlTabsStyle0; }

package/dist/components/swirl-tag2.js

@@ -45,7 +45,7 @@ const SwirlTag = /*@__PURE__*/ proxyCustomElement(class SwirlTag extends HTMLEle
     }
     render() {
         const className = classNames("tag", `tag--icon-position-${this.iconPosition}`, `tag--intent-${this.intent}`, `tag--size-${this.size}`, `tag--variant-${this.variant}`);
-        return (h(Host, { key: 'a1f2f0ad84547ea62b11ad4340aeef072c405bda' }, h("span", { key: '49cd19c19c6589e905918b9f7361c67e7926f750', class: className, part: "tag" }, this.icon && (h("span", { key: 'aac560c02e88365dd5fa63704a11621ad4ef434f', class: "tag__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), h("span", { key: '9bf2deccf5aec4f08ceef5f84d1953877122b188', class: "tag__label" }, this.label), this.removable && (h("button", { key: '3f28e71afe4092df5ba593a06f5d96636bf5c04e', "aria-label": this.removalButtonLabel, class: "tag__removal-button", onClick: this.onRemove, tabIndex: this.el.ariaHidden === "true" ? -1 : undefined, type: "button" }, h("swirl-icon-close", { key: '7962ddb75c8dfa7a93025318ea0ca27146ec5a81', size: 16 }))))));
+        return (h(Host, { key: '47c30c429b8e910b006b21f6e39753a710ff7425' }, h("span", { key: '91c7946323875360ac053a28a83849b669d35913', class: className, part: "tag" }, this.icon && (h("span", { key: '000de8f304e3accd6d3647e9934063fc8cd7da05', class: "tag__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), h("span", { key: 'cadd70a25bbd6214719275f8a24aa2882c0e90d1', class: "tag__label" }, this.label), this.removable && (h("button", { key: '5278b9fceb383c5854c6053d943da4e4171551fd', "aria-label": this.removalButtonLabel, class: "tag__removal-button", onClick: this.onRemove, tabIndex: this.el.ariaHidden === "true" ? -1 : undefined, type: "button" }, h("swirl-icon-close", { key: '76b23763ac812f53e4caa07a94094982847d0525', size: 16 }))))));
     }
     get el() { return this; }
     static get style() { return SwirlTagStyle0; }

package/dist/components/swirl-text-input2.js

@@ -1,11 +1,12 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { c as classNames } from './index2.js';
 import { g as getDesktopMediaQuery } from './utils.js';
-import { d as defineCustomElement$5 } from './swirl-icon-cancel2.js';
-import { d as defineCustomElement$4 } from './swirl-icon-expand-less2.js';
-import { d as defineCustomElement$3 } from './swirl-icon-expand-more2.js';
-import { d as defineCustomElement$2 } from './swirl-icon-visibility2.js';
-import { d as defineCustomElement$1 } from './swirl-icon-visibility-off2.js';
+import { d as defineCustomElement$6 } from './swirl-icon-cancel2.js';
+import { d as defineCustomElement$5 } from './swirl-icon-expand-less2.js';
+import { d as defineCustomElement$4 } from './swirl-icon-expand-more2.js';
+import { d as defineCustomElement$3 } from './swirl-icon-visibility2.js';
+import { d as defineCustomElement$2 } from './swirl-icon-visibility-off2.js';
+import { d as defineCustomElement$1 } from './swirl-visually-hidden2.js';
 
 const swirlTextInputCss = ".sc-swirl-text-input-h{display:block;width:100%}.sc-swirl-text-input-h *.sc-swirl-text-input{box-sizing:border-box}.text-input.sc-swirl-text-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);font:inherit;line-height:var(--s-line-height-sm);cursor:text}.text-input--auto-grow.sc-swirl-text-input .text-input__input.sc-swirl-text-input{max-height:none}.text-input--clearable.sc-swirl-text-input,.text-input--type-number.sc-swirl-text-input,.text-input--type-password.sc-swirl-text-input{padding-right:calc(1.5rem + var(--s-space-8))}.text-input--show-password.sc-swirl-text-input .text-input__input.sc-swirl-text-input{width:100%}.text-input--disabled.sc-swirl-text-input .text-input__character-counter.sc-swirl-text-input{color:var(--s-text-disabled)}.text-input--font-size-sm.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input--font-size-sm.sc-swirl-text-input .text-input__input.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text-input--font-size-base.sc-swirl-text-input{--swirl-text-input-placeholder-size:var(--s-font-size-base);font-size:var(--s-font-size-base);line-height:var(--s-line-height-base)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input--font-size-base.sc-swirl-text-input .text-input__input.sc-swirl-text-input{font-size:var(--s-font-size-base);line-height:var(--s-line-height-base)}}.text-input--has-suffix.sc-swirl-text-input input.text-input__input.sc-swirl-text-input:not([type=\"password\"]){width:0.25rem;min-width:0.25rem}.text-input--inline.sc-swirl-text-input .text-input__stepper.sc-swirl-text-input{top:calc(-1 * var(--s-space-8));right:calc(-1 * var(--s-space-12))}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input--inline.sc-swirl-text-input .text-input__stepper.sc-swirl-text-input{top:calc(-1 * var(--s-space-8));right:calc(-1 * var(--s-space-12))}}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input{width:2rem;height:1.125rem;justify-content:center;background-color:var(--s-surface-raised-default)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input:first-of-type{border-top-right-radius:var(--s-border-radius-sm)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input:last-of-type{border-bottom-right-radius:var(--s-border-radius-sm)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input:hover{background-color:var(--s-surface-raised-hovered)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input swirl-icon-expand-less.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input swirl-icon-expand-more.sc-swirl-text-input{width:1rem}.text-input--inline.sc-swirl-text-input .text-input__clear-button.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__password-toggle.sc-swirl-text-input{top:-0.0625rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input--inline.sc-swirl-text-input .text-input__clear-button.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__password-toggle.sc-swirl-text-input{top:0}}.text-input--inline.sc-swirl-text-input .text-input__character-counter.sc-swirl-text-input{top:calc(100% + var(--s-space-12) + var(--s-border-width-default));right:calc(-1 * var(--s-space-12));max-width:6rem}.text-input__input.sc-swirl-text-input{display:inline-flex;width:100%;max-height:13.75rem;margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);resize:none;caret-color:var(--s-border-highlight)}.text-input__input.sc-swirl-text-input:focus{outline:none}.text-input__input.sc-swirl-text-input:disabled{color:var(--s-text-disabled);background-color:transparent}.text-input__input.sc-swirl-text-input::-webkit-outer-spin-button,.text-input__input.sc-swirl-text-input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.text-input__input[type=\"number\"].sc-swirl-text-input{-moz-appearance:textfield}.text-input__input.sc-swirl-text-input::-moz-placeholder{font-size:var(--swirl-text-input-placeholder-size)}.text-input__input.sc-swirl-text-input::placeholder{font-size:var(--swirl-text-input-placeholder-size)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__input.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text-input--disable-dynamic-width.sc-swirl-text-input input.text-input__input.sc-swirl-text-input:not([type=\"password\"]){width:100%;min-width:0}.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__clear-button.sc-swirl-text-input:focus:not(:focus-visible),.text-input__password-toggle.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__clear-button.sc-swirl-text-input:focus-visible,.text-input__password-toggle.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{top:-0.625rem}}.text-input__stepper.sc-swirl-text-input{position:absolute;top:-1.4375rem;right:0;display:flex;flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__stepper.sc-swirl-text-input{top:-1.25rem}}.text-input__step-button.sc-swirl-text-input{display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__step-button.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__step-button.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}.text-input__character-counter.sc-swirl-text-input{position:absolute;top:-1.375rem;right:0;display:flex;color:var(--s-text-subdued);line-height:var(--s-line-height-sm);flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__character-counter.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text-input__prefix.sc-swirl-text-input{padding-right:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}.text-input__suffix.sc-swirl-text-input{padding-left:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}";
 const SwirlTextInputStyle0 = swirlTextInputCss;
@@ -83,6 +84,7 @@ const SwirlTextInput = /*@__PURE__*/ proxyCustomElement(class SwirlTextInput ext
         this.autoFocus = undefined;
         this.autoGrow = undefined;
         this.autoSelect = undefined;
+        this.characterCounterLabel = "Used characters";
         this.clearable = undefined;
         this.clearButtonLabel = "Clear input";
         this.disabled = undefined;
@@ -192,7 +194,7 @@ const SwirlTextInput = /*@__PURE__*/ proxyCustomElement(class SwirlTextInput ext
             "text-input--inline": this.inline,
             "text-input--show-password": this.type === "password" && this.showPassword,
         });
-        return (h(Host, { key: '3edc8d70a80cf16de6465fd52d9d7edf983b460a' }, h("div", { key: 'ba5fe8eac53b507395100b6333dc9ea803aad5ba', class: className }, this.prefixLabel && (h("span", { key: '66482b8599b93da4b4169d6b88583231d2c62b86', class: "text-input__prefix" }, this.prefixLabel)), h(Tag, { key: '83d0ab76defde133a45e52819b3057c99c583dd8', "aria-autocomplete": this.swirlAriaAutocomplete, "aria-controls": this.swirlAriaControls, "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-expanded": this.swirlAriaExpanded, "aria-invalid": ariaInvalid, autoComplete: this.autoComplete, autoFocus: this.autoFocus, class: "text-input__input", disabled: this.disabled, inputMode: this.mode, maxLength: this.maxLength, max: this.type === "number" ? this.max : undefined, min: this.type === "number" ? this.min : undefined, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, onKeyPress: this.onKeyPress, placeholder: !Boolean(this.suffixLabel) ? this.placeholder : undefined, ref: (el) => (this.inputEl = el), required: this.required, role: this.swirlRole, name: this.inputName, rows: this.rows > 1 ? this.rows : this.autoGrow ? 1 : undefined, spellcheck: this.spellCheck, step: this.type === "number" ? this.step : undefined, type: type, value: this.value }, this.rows > 1 && this.value), this.suffixLabel && (h("span", { key: '9aee718bfeb28d7954654382b95ac2e22af0b0f2', class: "text-input__suffix" }, this.suffixLabel)), showClearButton && (h("button", { key: 'a37f8aa0bb18118b04d89b669a713236bcc1d5a0', "aria-label": this.clearButtonLabel, class: "text-input__clear-button", onClick: this.clear, part: "text-input__clear-button", type: "button" }, h("swirl-icon-cancel", { key: '3bec16e0c57ff7985f0977b582866bc760221d46', size: this.iconSize }))), showPasswordToggle && (h("button", { key: '4365e0853a72a081729957b3d959582527b7b5d5', "aria-label": this.passwordToggleLabel, class: "text-input__password-toggle", onClick: this.togglePassword, type: "button" }, this.showPassword ? (h("swirl-icon-visibility-off", { size: this.iconSize })) : (h("swirl-icon-visibility", { size: this.iconSize })))), showStepper && (h("span", { key: 'b0cc92e6baa711d2392af993d2b7042ccca99870', class: "text-input__stepper" }, h("button", { key: '8ea6a3c179d6c89c9f548651cf22db97ea93982d', "aria-hidden": "true", class: "text-input__step-button", onClick: this.increaseValue, tabIndex: -1, type: "button" }, h("swirl-icon-expand-less", { key: 'd8c39b731368868d3bd90f3bafc5965ba293a0b1', size: this.iconSize })), h("button", { key: 'ba7af221e7b0100062c4e5299f9cfb436be37c4c', "aria-hidden": "true", class: "text-input__step-button", onClick: this.decreaseValue, tabIndex: -1, type: "button" }, h("swirl-icon-expand-more", { key: 'bcf40411b9947f0b5b3bfb1f60a383b208adaea5', size: this.iconSize })))), this.showCharacterCounter && (h("span", { key: '15021626928e1240ad4898070e584bdca420013a', class: "text-input__character-counter" }, this.value?.length || 0, " ", Boolean(this.maxLength) ? `/ ${this.maxLength}` : "")))));
+        return (h(Host, { key: 'c88e6bd426c87abc2e5aa4a6a67b92a33705c737' }, h("div", { key: '88e1c2cdf842a603bb81ca75abe0869c6b321e95', class: className }, this.prefixLabel && (h("span", { key: '6bc23160f6d688b9cb245d6089e129cf350f9533', class: "text-input__prefix" }, this.prefixLabel)), h(Tag, { key: '880004143dd812f6af0f74fe9a7fa0d4ccd231fd', "aria-autocomplete": this.swirlAriaAutocomplete, "aria-controls": this.swirlAriaControls, "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-expanded": this.swirlAriaExpanded, "aria-invalid": ariaInvalid, autoComplete: this.autoComplete, autoFocus: this.autoFocus, class: "text-input__input", disabled: this.disabled, inputMode: this.mode, maxLength: this.maxLength, max: this.type === "number" ? this.max : undefined, min: this.type === "number" ? this.min : undefined, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, onKeyPress: this.onKeyPress, placeholder: !Boolean(this.suffixLabel) ? this.placeholder : undefined, ref: (el) => (this.inputEl = el), required: this.required, role: this.swirlRole, name: this.inputName, rows: this.rows > 1 ? this.rows : this.autoGrow ? 1 : undefined, spellcheck: this.spellCheck, step: this.type === "number" ? this.step : undefined, type: type, value: this.value }, this.rows > 1 && this.value), this.suffixLabel && (h("span", { key: 'e4bece6d11b65ccddb4e73b330bb7a98203553ad', class: "text-input__suffix" }, this.suffixLabel)), showClearButton && (h("button", { key: '209d064d58f71f255181a8b4c8277e94d7fc6840', "aria-label": this.clearButtonLabel, class: "text-input__clear-button", onClick: this.clear, part: "text-input__clear-button", type: "button" }, h("swirl-icon-cancel", { key: '2c10978eb66b7c9e05b194d51ff540b1774cdde7', size: this.iconSize }))), showPasswordToggle && (h("button", { key: '7d14538e3f4816f0230de3178fe8d5857b541cd2', "aria-label": this.passwordToggleLabel, class: "text-input__password-toggle", onClick: this.togglePassword, type: "button" }, this.showPassword ? (h("swirl-icon-visibility-off", { size: this.iconSize })) : (h("swirl-icon-visibility", { size: this.iconSize })))), showStepper && (h("span", { key: 'dfcabad170b5312132722cd18e3894bdda4dabee', class: "text-input__stepper" }, h("button", { key: '29fe802c07d61744a0a2411dde31ace11332c90c', "aria-hidden": "true", class: "text-input__step-button", onClick: this.increaseValue, tabIndex: -1, type: "button" }, h("swirl-icon-expand-less", { key: '629dbfef2caf408b3b34ddcfe3beb8305ff14dd8', size: this.iconSize })), h("button", { key: '41f995a4aff79d37d77bc67ceab02da7acbf2841', "aria-hidden": "true", class: "text-input__step-button", onClick: this.decreaseValue, tabIndex: -1, type: "button" }, h("swirl-icon-expand-more", { key: '57101c11f11133c49f1bb422e0d78fd0701e92dd', size: this.iconSize })))), this.showCharacterCounter && (h("span", { key: 'e0e9b2a54e8d264529c213e5fe5cc225d7829353', class: "text-input__character-counter", "aria-live": "polite" }, h("swirl-visually-hidden", { key: '21f37a30db4fdc8ffd032e8fee392a2e90f41cc4' }, this.characterCounterLabel), this.value?.length || 0, " ", Boolean(this.maxLength) ? `/ ${this.maxLength}` : "")))));
     }
     static get watchers() { return {
         "value": ["watchValue"]
@@ -203,6 +205,7 @@ const SwirlTextInput = /*@__PURE__*/ proxyCustomElement(class SwirlTextInput ext
         "autoFocus": [4, "auto-focus"],
         "autoGrow": [4, "auto-grow"],
         "autoSelect": [4, "auto-select"],
+        "characterCounterLabel": [1, "character-counter-label"],
         "clearable": [4],
         "clearButtonLabel": [1, "clear-button-label"],
         "disabled": [4],
@@ -242,7 +245,7 @@ function defineCustomElement() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["swirl-text-input", "swirl-icon-cancel", "swirl-icon-expand-less", "swirl-icon-expand-more", "swirl-icon-visibility", "swirl-icon-visibility-off"];
+    const components = ["swirl-text-input", "swirl-icon-cancel", "swirl-icon-expand-less", "swirl-icon-expand-more", "swirl-icon-visibility", "swirl-icon-visibility-off", "swirl-visually-hidden"];
     components.forEach(tagName => { switch (tagName) {
         case "swirl-text-input":
             if (!customElements.get(tagName)) {
@@ -251,25 +254,30 @@ function defineCustomElement() {
             break;
         case "swirl-icon-cancel":
             if (!customElements.get(tagName)) {
-                defineCustomElement$5();
+                defineCustomElement$6();
             }
             break;
         case "swirl-icon-expand-less":
             if (!customElements.get(tagName)) {
-                defineCustomElement$4();
+                defineCustomElement$5();
             }
             break;
         case "swirl-icon-expand-more":
             if (!customElements.get(tagName)) {
-                defineCustomElement$3();
+                defineCustomElement$4();
             }
             break;
         case "swirl-icon-visibility":
             if (!customElements.get(tagName)) {
-                defineCustomElement$2();
+                defineCustomElement$3();
             }
             break;
         case "swirl-icon-visibility-off":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "swirl-visually-hidden":
             if (!customElements.get(tagName)) {
                 defineCustomElement$1();
             }

package/dist/components/swirl-text2.js

@@ -985,7 +985,7 @@ const SwirlText = /*@__PURE__*/ proxyCustomElement(class SwirlText extends HTMLE
         const styles = {
             whiteSpace: truncate ? "nowrap" : this.whiteSpace,
         };
-        return (h(Host, { key: 'fcf86b63f5415e82340941373071de1d3d500667' }, h(Tag, { key: '38b4bbdcc3002509bebcaae494897666729425cf', class: className, ref: (el) => (this.textEl = el), style: styles }, h("slot", { key: 'c58d26bb8f1fc6365bdb74e378ed37a2c9adf5d0' }))));
+        return (h(Host, { key: '822bd6e9f4c819eb8b129830d4c06fd5d1bce2ce' }, h(Tag, { key: '2135b841568ff3302aef6911ffd9eaf182492bbc', class: className, ref: (el) => (this.textEl = el), style: styles }, h("slot", { key: '84dbd1c071ce8545defb00bf6c182ce659bfd36f' }))));
     }
     get el() { return this; }
     static get style() { return SwirlTextStyle0; }

package/dist/components/swirl-theme-provider.js

@@ -153,7 +153,7 @@ const SwirlThemeProvider$1 = /*@__PURE__*/ proxyCustomElement(class SwirlThemePr
         this.setDesignTokens = [];
     }
     render() {
-        return (h(Host, { key: 'db982cb09fcded4777d5964e7300aa31d1b6019e' }, h("slot", { key: '8aaed653f6aa88a2978867717bc089749e737409' })));
+        return (h(Host, { key: 'deb455cfb0b92e63606caf2844ca065176f102c0' }, h("slot", { key: '40b9366456f59967c1552a91ddf0f8e28ec91027' })));
     }
     static get watchers() { return {
         "config": ["watchConfig"]

package/dist/components/swirl-thumbnail2.js

@@ -43,7 +43,7 @@ const SwirlThumbnail = /*@__PURE__*/ proxyCustomElement(class SwirlThumbnail ext
             "thumbnail--interactive": this.interactive,
             "thumbnail--has-progress": this.progress !== undefined,
         });
-        return (h(Host, { key: 'cb64694897c1a0eebefb632950b6a3c9db9562a1' }, h("span", { key: '906e198b9916e209b0a1ee93176ae5767aee3f71', class: className, role: "group" }, h(ImageWrapper, { key: 'b74ae16b0acf8cfb0a7d32c8d6cfa8d7444c55e5', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, h("img", { key: '24019dacc72eacc9db95e2f330b759a7cd7b7e84', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: '905458596e1c0387cf8ab5733b906d67c8f3da31', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: 'b794419cc14a92c67f25247362010c1e1de44298', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: 'df5fc82bf57f8177abaab7c82b0560a3bf7d7499', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: 'c85862f305ddfa4ca8dd1b4c57701635e4cf382c' }, h("swirl-button", { key: 'bc2faebee460188ab12ba528ac742566155a462e', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: '5b9a462d7427907d82b09e7ce62f32437a0842d9' }, h("swirl-button", { key: '4fbca44187f9db29ac0a6031961539c91f5b13c7', hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (h("span", { key: '170a9a5169982ef4cadf0cc7773e47423484a664', class: "thumbnail__timestamp" }, this.timestamp)))));
+        return (h(Host, { key: '2e7d8a2af40ab17c3df28862fe0c2c9c05f2f69c' }, h("span", { key: '2fe30db45cfd4604e192d2164ca870a197d4360e', class: className, role: "group" }, h(ImageWrapper, { key: '42524512e533c3ad2f2caadef52b802636aa2134', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, h("img", { key: '4c534afce95a513180574272628818527f0bce53', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: 'cb4917f90d7d2b7b0859d3a1142a4ba4e6a59ec8', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: 'f2497053d0a5b27ce0ef91781cc760e4d313770f', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: '7526578f439eaddaf5c7bd911286f27e31979d48', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: 'a420b268092d9fddb68c99ff7d7bfd327f5a1489' }, h("swirl-button", { key: 'b5dffd826299d0f7b872352261e88f4cb60eba46', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: 'c2d7ed53d67cc8cd15fb52395ede90a998209d2e' }, h("swirl-button", { key: 'b777d76cfa50d7696fe2db8614b80911f00266d4', hideLabel: true, icon: "<swirl-icon-delete></swirl-icon-delete>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (h("span", { key: '0d9fd6ac344d6ebcf9b71a220f8ba2d099e20a78', class: "thumbnail__timestamp" }, this.timestamp)))));
     }
     static get style() { return SwirlThumbnailStyle0; }
 }, [1, "swirl-thumbnail", {

package/dist/components/swirl-time-input.js

@@ -125,7 +125,7 @@ const SwirlTimeInput$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTimeInput e
         const className = classNames("time-input", {
             "time-input--inline": this.inline,
         });
-        return (h(Host, { key: '900afc8090ce0fd88d83a264adaee5fc4cfc2d51' }, h("div", { key: '8732b5e089da44001fde6938d8b3d5ff6658e819', class: className }, h("input", { key: '771c65e387b8bb59633411363ad7d88aeb35344d', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), h("span", { key: 'e3617424c2d5a5f7c7645ec688a231868d925c4b', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: 'e405cf6671e0e20ba95e6374efba80590bc7c8e2', size: this.iconSize })))));
+        return (h(Host, { key: '79a26dde9234e3a299397b83b1b9ae1dda8a0bc8' }, h("div", { key: 'df7c7b47c6064401b118c473df401bdab9ab9725', class: className }, h("input", { key: '47d9d231296388ee23401edf8544dd63c9b447bc', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "time-input__input", disabled: this.disabled, id: this.id, inputmode: "numeric", onBlur: this.onBlur, onClick: this.onClick, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), h("span", { key: '442d49d35b95e50d6418cf813a1fdaf6b0e65b80', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: 'd7b652a4bf230f1daa5b655f996ef55da32cb392', size: this.iconSize })))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/swirl-toast-provider.js

@@ -56,7 +56,7 @@ const SwirlToastProvider$1 = /*@__PURE__*/ proxyCustomElement(class SwirlToastPr
         return newToastWithId;
     }
     render() {
-        return (h(Host, { key: 'b89c578a32dbd961465ee23f8a4e521d10d8bbfa', role: "status" }, h("swirl-stack", { key: '292cbae48deafe0a76a515e2eac35f0dfb99826d', spacing: "12" }, this.toasts.map((toast) => {
+        return (h(Host, { key: '5016a14ee953a31f67d13bf1ae1e85c15354bde0', role: "status" }, h("swirl-stack", { key: 'c543587f49c16ab6601bb7c6e2edaf7cbd242050', spacing: "12" }, this.toasts.map((toast) => {
             const props = { ...toast, content: undefined };
             return (h("swirl-toast", { key: toast.toastId, onDismiss: this.onDismiss, ...props }, toast.content));
         }))));

package/dist/components/swirl-toast2.js

@@ -62,7 +62,7 @@ const SwirlToast = /*@__PURE__*/ proxyCustomElement(class SwirlToast extends HTM
     }
     render() {
         const className = classNames("toast", `toast--intent-${this.intent}`);
-        return (h(Host, { key: 'c0d869b690436deacc2d3c203da75561cbabf303' }, h("div", { key: 'e9fa09c4d9ab4f71bbfacac56b19248ed93c30c5', class: className }, this.icon && (h("span", { key: '91e3a639f3f911cab2e159e20c15840c4558ff71', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), h("span", { key: '0f04c7e25e203c4ab52d9b0bef316bd587c1b31b', class: "toast__content", innerHTML: this.content, part: "toast__content" }, h("slot", { key: 'f97d934f8bf11bc623e6da6512a675eb38b7c806' })), h("button", { key: 'e2d60aeaca787a51e038c31a8880935808eb59cf', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (h("swirl-icon-close", { key: 'fb68588c3086cba14d95d0e48f16980da6e8f1a2', ref: (el) => (this.dismissIconEl = el) }))))));
+        return (h(Host, { key: '63b2524f2a2d1190684086bde48c934d32566c70' }, h("div", { key: '21920f98742a4ad51ba8d303d5ba4d3472cab259', class: className }, this.icon && (h("span", { key: 'da3bd02686663fc0793bc69b6d4fdd86f25f8bb4', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), h("span", { key: '64e558f31a9a03ea39dc3a28b16a62096dba3cf5', class: "toast__content", innerHTML: this.content, part: "toast__content" }, h("slot", { key: '9046dd7e88bca0a6de43ed367bf78455a240e208' })), h("button", { key: 'df8bd60a80ca63e77ec1e5b1e8f70e9b9c813f5a', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (h("swirl-icon-close", { key: 'e0de40c23452b0b9725947021a4e5316a92ea84f', ref: (el) => (this.dismissIconEl = el) }))))));
     }
     static get watchers() { return {
         "duration": ["watchDuration"]

package/dist/components/swirl-toggle-button.js

@@ -22,7 +22,7 @@ const SwirlToggleButton$1 = /*@__PURE__*/ proxyCustomElement(class SwirlToggleBu
         const classNames$1 = classNames("button", {
             "button--pressed": this.isPressed,
         });
-        return (h("button", { key: 'af2ba87225e82d91424f80e8355fc9b949f0835c', class: classNames$1, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (h("swirl-icon", { key: 'c0e0e372aa08582ef08a171c9db46eac0a2bfd14', class: "button__icon", glyph: this.icon })), h("span", { key: 'b6656bf5684b319dfe51c97086326e6f1ef144fb', class: "button__label" }, this.label)));
+        return (h("button", { key: 'de79d401c0df2c80e2eb181fa0704863b8bb31b7', class: classNames$1, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (h("swirl-icon", { key: '2b389c4dcbafb5abeab0631f4431bef2386c5fea', class: "button__icon", glyph: this.icon })), h("span", { key: '87fa2cc7de771f5e54dc17a013d9f3aeb3094407', class: "button__label" }, this.label)));
     }
     static get style() { return SwirlToggleButtonStyle0; }
 }, [1, "swirl-toggle-button", {

package/dist/components/swirl-toggle-group.js

@@ -67,7 +67,7 @@ const SwirlToggleGroup$1 = /*@__PURE__*/ proxyCustomElement(class SwirlToggleGro
         const className = classNames("toggle-group", `toggle-group--variant-${this.variant}`, {
             "toggle-group--elevated": this.elevated,
         });
-        return (h("swirl-stack", { key: '07c92877560b8ea2bb8bf8beea2cdcfe875e1c9d', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, h("slot", { key: 'ca807e7d17146a3b0de3ce1a45ca19e5d648386c', onSlotchange: this.onSlotChange })));
+        return (h("swirl-stack", { key: 'b9dcd7dcb1dabd27227568473287bebbacd08d85', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, h("slot", { key: '0d54fe748fc081ef7930aff6027a2ed460f275eb', onSlotchange: this.onSlotChange })));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/swirl-toolbar.js

@@ -74,7 +74,7 @@ const SwirlToolbar$1 = /*@__PURE__*/ proxyCustomElement(class SwirlToolbar exten
         });
     }
     render() {
-        return (h(Host, { key: '2209c72d725863c4a00b7818f7807afec6ce9476' }, h("swirl-stack", { key: '28122759e485039ebd1293316115707fc0c0f4fa', align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: true }, h("slot", { key: '839470d432295a35e89149203d8761e0aa5000da' }))));
+        return (h(Host, { key: '7a89a37bf47c2ca12422e4b69fc49c6b1478c373' }, h("swirl-stack", { key: '7349ee2ab52619ff8104f1fe122599178a139400', align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: true }, h("slot", { key: '4c5b9382755409876bc554a7ee698ed326ec8ace' }))));
     }
     get el() { return this; }
     static get style() { return SwirlToolbarStyle0; }

package/dist/components/swirl-tooltip2.js

@@ -117,7 +117,7 @@ const SwirlTooltip = /*@__PURE__*/ proxyCustomElement(class SwirlTooltip extends
             "tooltip--active": this.active,
             "tooltip--visible": this.visible,
         });
-        return (h(Host, { key: 'fab7025501b2b85e03b31af571bfe2556a2fbf1d', onKeydown: this.onKeydown }, h("span", { key: '30ca7d1404e2fd6f2c9becaf6b9411af2d8a9979', class: className }, h("span", { key: 'be87c4cab59e4fd973fa9ea0da81b07d8ba056b0', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, h("slot", { key: '4189b67bd8a6ebfd95bdd7e7e131e9e7f1ef4d65' })), h("span", { key: '484c29090af80fe4acc66eee3808c75be3a16528', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
+        return (h(Host, { key: '6b15209f9e0d9cfafc7af244f1ef22cb4d7da719', onKeydown: this.onKeydown }, h("span", { key: '7c75a8e5d9f2e5b1099fcf7f750ef12095b58402', class: className }, h("span", { key: 'ed98c804d5526c58ed70705b8a63a7d6f2ff7734', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, h("slot", { key: '6dcbf266cdb3521c6d8e8d37cf293149f0469190' })), h("span", { key: 'a2f3b747288d55f9d46c5476d100f8a230e56615', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
                 top: Boolean(this.actualPosition)
                     ? `${this.actualPosition?.y}px`
                     : "",
@@ -125,7 +125,7 @@ const SwirlTooltip = /*@__PURE__*/ proxyCustomElement(class SwirlTooltip extends
                     ? `${this.actualPosition?.x}px`
                     : "",
                 position: this.positioning,
-            } }, this.visible && (h("span", { key: '07da4e4ee3c3bbf5e8f8f7fad9ec11716b99b175', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, h("span", { key: '9d0e50ebdb013eeba59011945ed6e559c3d3bbf9', class: "tooltip__content", innerHTML: this.content }))), h("span", { key: '85c760dc089cf71b0e43e13de679b2ad795ad97f', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
+            } }, this.visible && (h("span", { key: '216ff9495331d0a424c0bce32a32e52f8fb46d4c', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, h("span", { key: 'bf5df3af6609b7a00230f108386435283a340aa9', class: "tooltip__content", innerHTML: this.content }))), h("span", { key: 'a95c884426bc39651f749305f3d16568dc0da4b1', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
                 ...this.arrowStyles,
                 visibility: this.visible ? "visible" : "hidden",
             } })))));

package/dist/components/swirl-tree-navigation-item.js

@@ -100,12 +100,12 @@ const SwirlTreeNavigationItem$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTr
             "tree-navigation-item__link--active": this.active,
             "tree-navigation-item__link--has-icon": Boolean(this.icon),
         });
-        return (h(Host, { key: '436e229c63629bbf33cfd9387913f29002772ba5', role: "none" }, h("li", { key: 'b93b11114cd1bdec19fd6480ae43bd4d312788ed', class: {
+        return (h(Host, { key: 'cbfa3ee30519b917689f3934e1472672858ab2f9', role: "none" }, h("li", { key: '58106a2fe23e30ea71fcc3c946b99c5f355684d4', class: {
                 "tree-navigation-item": true,
                 "tree-navigation-item--expanded": this.expanded,
-            }, role: "treeitem", "aria-expanded": this.hasChildren ? this.expanded : undefined, "aria-level": this.level }, h(Tag, { key: '3cb033573bd82c660ebb2b205eba3dd05268510f', onClick: this.toggleExpanded, onKeyDown: this.onKeyDown, class: linkClassName, href: this.href, target: this.target, type: isLink ? undefined : "button", id: this.buttonId, "aria-current": this.active ? "page" : undefined, "aria-controls": this.hasChildren ? this.childrenId : undefined, "aria-expanded": this.hasChildren ? this.expanded : undefined }, h("span", { key: 'b9d80cec28ec80ee0143c6099a829c272990b63c', class: "tree-navigation-item__content" }, this.icon && (h("swirl-icon", { key: 'a183be4e2d0ebf65237afe7cdf174d3af8359ce3', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), h("span", { key: '90e18dcac4cea02d55fc862e540a65c0f74276ad', class: "tree-navigation-item__label" }, h("span", { key: '7a361a6bc31dcc1872e30802425ada404c225f39', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (h("span", { key: '272232cc2e2d656681866dc4b78adc711f0bdd70', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, h("swirl-icon-chevron-right", { key: '36ba51ddc567420a8dccad68c6adcec43b183ec5', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (h("span", { key: '0f8b22a61b3eb4b6488e119c7c213199664c1945', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, h("swirl-icon-open-in-new", { key: 'e1f8c7724a94be0e9ea020a5737985e68e3e2afa', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (h("ul", { key: '5aad5f8edbc707b7fe25112666863cd279748703', class: "tree-navigation-item__children", id: this.childrenId, role: "group", "aria-label": `${this.label} submenu`, ref: (el) => (this.childrenRef = el), style: {
+            }, role: "treeitem", "aria-expanded": this.hasChildren ? this.expanded : undefined, "aria-level": this.level }, h(Tag, { key: '03af0e66654d726dac0c772423d86d9857e063f9', onClick: this.toggleExpanded, onKeyDown: this.onKeyDown, class: linkClassName, href: this.href, target: this.target, type: isLink ? undefined : "button", id: this.buttonId, "aria-current": this.active ? "page" : undefined, "aria-controls": this.hasChildren ? this.childrenId : undefined, "aria-expanded": this.hasChildren ? this.expanded : undefined }, h("span", { key: 'b096c86dce06c8e30c4ee6048063014b6fda117e', class: "tree-navigation-item__content" }, this.icon && (h("swirl-icon", { key: '75527045affbd70ae2790001777bab47078bc5d3', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), h("span", { key: 'd2f977d009a25ae94bf056c98028ee7fa4b0d4b8', class: "tree-navigation-item__label" }, h("span", { key: '45828333378b5eccc6bc9e165db4e239253dee71', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (h("span", { key: 'a41e592ea10d8539160ced1d9135ede6e18c5e98', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, h("swirl-icon-chevron-right", { key: '594618f24d340ebf14ccee7186ea2b86c56c10f6', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (h("span", { key: 'f27b54244a2390dbd61dbc14c170eccbe0483d4f', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, h("swirl-icon-open-in-new", { key: 'a2143ca8178b3ef84332fe95fcc049b4c972ba30', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (h("ul", { key: '875b18b4740bfcefe2d6b0846f23a823914b30d2', class: "tree-navigation-item__children", id: this.childrenId, role: "group", "aria-label": `${this.label} submenu`, ref: (el) => (this.childrenRef = el), style: {
                 height: this.childrenHeight,
-            } }, h("slot", { key: '21fce3eaeb9df813e6d860c93657d257fd4ee032' }))))));
+            } }, h("slot", { key: '20d47ce7642a41a9f01f82440451c252cd8a1130' }))))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/swirl-tree-navigation.js

@@ -11,7 +11,7 @@ const SwirlTreeNavigation$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTreeNa
         this.label = undefined;
     }
     render() {
-        return (h(Host, { key: 'c795b120b5f9d2cd543d7ef9d5407734d3beaf7d' }, h("ul", { key: 'c8a4f2ca4c52b4bdef5b5d71c39f15b6675c7d6a', "aria-label": this.label, class: "tree-navigation", role: "tree" }, h("slot", { key: '476a4b9b357774b9ecc6cc62e1e4ef1873c14594' }))));
+        return (h(Host, { key: 'f070785a8989a7f668cfccaef516f28e83e8a9ff' }, h("ul", { key: 'b31636d03b08c87afff4189ff0ff468b83c374ed', "aria-label": this.label, class: "tree-navigation", role: "tree" }, h("slot", { key: 'adf1bd58529d2149050e13a46dbcdc0571587a50' }))));
     }
     static get style() { return SwirlTreeNavigationStyle0; }
 }, [1, "swirl-tree-navigation", {

package/dist/components/swirl-tree-view-item.js

@@ -335,13 +335,13 @@ const SwirlTreeViewItem$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTreeView
             "tree-view-item--disable-drag": this.disableDrag,
             "tree-view-item--has-tags": hasTags,
         });
-        return (h(Host, { key: '359205749fd0fa8cdd09b902a535169cfa410031', id: this.itemId, role: "none" }, h("li", { key: '5e13cbe565927ba5fa14e3f99309a2c880b262b3', class: className, role: "none" }, h("a", { key: '776901fdfc6d1879285a3a37b131b4cc41ec7efc', "aria-current": this.active ? "page" : undefined, "aria-expanded": !hasChildren ? undefined : String(this.expanded), "aria-level": this.level + 1, "aria-owns": hasChildren ? `${this.itemId}-children` : undefined, "aria-selected": String(this.selected), class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, !this.disableDrag && this.enableDragDrop && (h("span", { key: '726f0d283a32cafb9b8924fe8a26eabfb5eaaa1f', class: "tree-view-item__drag-handle" }, h("swirl-icon-drag-handle", { key: 'c6d9ccbeca76689b7ffd72fe765c6196a6c4437d', size: 20 }))), this.expandable && (h("span", { key: '45873aeb8ee0ef116351e300397ff202d5950033', class: "tree-view-item__toggle-icon" }, hasChildren && (h(Fragment, { key: 'fe6bdc75d7beabe8ab58687ddd07f8a461426479' }, this.expanded ? (h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (h(Fragment, { key: '095e710bc88d20c62cbc79aaa66993b203b70cf5' }, h("span", { key: 'b7a0c0b5446ce314e3bfb3778953a412d0d088f7', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), h("span", { key: 'bb2fced3c07abca46d4fe1542ebc310a00acfdb6', class: "tree-view-item__label" }, this.label), h("span", { key: '7705d52ac2befb94f0b161a0875babbaed63b891', class: "tree-view-item__tags" }, h("slot", { key: 'ed0d4949b0814388e305694dbc833319f215b1f3', name: "tags" }))), h("ul", { key: '1a6b4cfbedb4e8eab88b29c5df6ee26c964478fd', "aria-label": this.label, class: `tree-view-item__children ${shouldShowChildrenDropZone
+        return (h(Host, { key: 'd044ae199022dcc3b022b2d4dc266d82db00a2fc', id: this.itemId, role: "none" }, h("li", { key: '106bc3696b6d68b5ba22badaa9d457e3e72d62f8', class: className, role: "none" }, h("a", { key: '0fcae2ed328de5bcb0f85e712b5e88a2fe3e3771', "aria-current": this.active ? "page" : undefined, "aria-expanded": !hasChildren ? undefined : String(this.expanded), "aria-level": this.level + 1, "aria-owns": hasChildren ? `${this.itemId}-children` : undefined, "aria-selected": String(this.selected), class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, !this.disableDrag && this.enableDragDrop && (h("span", { key: '24aa0852201a264f2e596851d9acef1f653b669a', class: "tree-view-item__drag-handle" }, h("swirl-icon-drag-handle", { key: 'f23b5c4a9c0e56320e53b9da3ad55462c4f265e1', size: 20 }))), this.expandable && (h("span", { key: 'cd5933c4674e8095e00d66157fd646f3edc6af04', class: "tree-view-item__toggle-icon" }, hasChildren && (h(Fragment, { key: 'd8dc9940a46e7de9b2148e98f06a8b8edbbfac61' }, this.expanded ? (h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (h(Fragment, { key: 'da21cb2a18f2755d747a854ff3d1a3ddc27d6c70' }, h("span", { key: '5eb18d4f3e9c9268c93f16989cce4332fe91dbf5', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), h("span", { key: '70715c356b263b1d78f20dd015ec93aaba5b271f', class: "tree-view-item__label" }, this.label), h("span", { key: '77fec8960d46a38e198196073841cc0cceae27c2', class: "tree-view-item__tags" }, h("slot", { key: '3940dae27077c4b8a71f2dcc6b82208c90d8b34a', name: "tags" }))), h("ul", { key: '17e1c7a2dffd64a8a4d9a1af5503ab454552e9fe', "aria-label": this.label, class: `tree-view-item__children ${shouldShowChildrenDropZone
                 ? "tree-view-item__children--drop-zone"
                 : ""}`, id: `${this.itemId}-children`, ref: (el) => (this.childList = el), role: "group", style: {
                 display: (!this.expanded || !hasChildren) && !shouldShowChildrenDropZone
                     ? "none"
                     : undefined,
-            } }, h("slot", { key: '173b8f94cb788699ef8ed8925084766337389409' })))));
+            } }, h("slot", { key: '84e8e55f032818f56c1cd38d3f7949d0be2db270' })))));
     }
     get el() { return this; }
     static get style() { return SwirlTreeViewItemStyle0; }

package/dist/components/swirl-tree-view.js

@@ -327,7 +327,7 @@ const SwirlTreeView$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTreeView ext
         }
     }
     render() {
-        return (h(Host, { key: '356121cb7f5adc3b4a9627b370233916cad1ae29' }, this.enableDragDrop && (h("swirl-visually-hidden", { key: 'a6f46439112356816f0f853a96a373a960b1bd14' }, h("span", { key: '2bab282efa908ea48a31683b6dde185cb153c1af', "aria-live": "assertive" }, this.liveRegionText))), h("ul", { key: 'ef9a99fe169c8752c982d9f0d4a02d6b091b042e', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: "tree", ref: (el) => (this.listElement = el), tabIndex: -1 }, h("slot", { key: '85a2a2c04d985d0892180c30f0c5b63bb85587fb', onSlotchange: this.onSlotChange }))));
+        return (h(Host, { key: '51aa3a81589abb63a2d736f430ad154c7c75d9ee' }, this.enableDragDrop && (h("swirl-visually-hidden", { key: 'c0a5e93d03187dc182921d0561c09b76b00382a1' }, h("span", { key: 'f25313f606c553ef032184a599efda8c0bd42fc4', "aria-live": "assertive" }, this.liveRegionText))), h("ul", { key: '494475bf9856ee93fa4e4cf0a4e0e0bbb9c40dc7', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: "tree", ref: (el) => (this.listElement = el), tabIndex: -1 }, h("slot", { key: '6004a1690b501c446c4fadbcef7b107bb5a3ab24', onSlotchange: this.onSlotChange }))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/swirl-video-thumbnail.js

@@ -15,7 +15,7 @@ const SwirlVideoThumbnail$1 = /*@__PURE__*/ proxyCustomElement(class SwirlVideoT
         this.src = undefined;
     }
     render() {
-        return (h(Host, { key: 'dca368d90c692683617f7c44c1a22a587bfb26c6' }, h("button", { key: 'e9ea7c736331408005a52cfe2718e749209686f7', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: '214505b3a818f82c3d7dad7cb0daf6149b8d11a9', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: '44a3851b89dd86d766503a77390503224a2f2929', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: 'fb1b0b915a193344184a33fbaa21c8185ac6c7e9' }, this.durationLabel), this.duration)), h("svg", { key: '4fabe0d99002f9e3d5bc56dd379747ca179bcb8c', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '05f76c89944a9fbe1e835516d5c1c6ca2a25c554', d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" })))));
+        return (h(Host, { key: 'a4d771567bbd6814b21ff6abaeb1375d178f10fe' }, h("button", { key: 'fb04a5ac015a0767d3176c24a3da57245c4b0090', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: '2c9eb441ba2040e5a60f6fb209658fd2d4068fa5', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: 'bc844b91ee57a88055428d2c3e4957dd3613cc24', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: 'b7884530163c9e32bb19f2411472e171085089c4' }, this.durationLabel), this.duration)), h("svg", { key: '56832739a15a970d9bdbc083db83cc2fc6dfe081', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '173ad96f1486f6eace0dbc5269b55a958ee514bf', d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" })))));
     }
     static get style() { return SwirlVideoThumbnailStyle0; }
 }, [1, "swirl-video-thumbnail", {

package/dist/components/swirl-visually-hidden2.js

@@ -9,7 +9,7 @@ const SwirlVisuallyHidden = /*@__PURE__*/ proxyCustomElement(class SwirlVisually
         this.__registerHost();
     }
     render() {
-        return (h(Host, { key: '3e4bdbd24e3cf7d3e818b5695608c27c0b984799' }, h("slot", { key: '5af4e846e8f92c2028382bce745696eef5b0c8c1' })));
+        return (h(Host, { key: 'bbce59be34e64a43c4732b42ad3b1f34a46140b8' }, h("slot", { key: '0ff4915e7df0be9aebd944b4760928333c7c8827' })));
     }
     static get style() { return SwirlVisuallyHiddenStyle0; }
 }, [6, "swirl-visually-hidden"]);

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

@@ -58,7 +58,7 @@ const FileManager = class {
             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: 'e7c447dcde7b5e83364b5f2bb1e4ce56b664ce4a' }, h("swirl-app-layout", { key: '51659c602df6dd1b4bca57a6463be8a1443141e4', 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: 'fa03ad6a9c0fe2ceefd07ab0b85385de1a110266', label: "Documents", slot: "navigation" }, this.renderNavigation()), h("swirl-popover-trigger", { key: 'f34dd21259771c2e19bb7861f7a16d3bcb17d6ae', swirlPopover: this.sortMenu, slot: "navigation-controls" }, h("swirl-button", { key: 'b271cfe84c653eea96f2de41bf512a9795ceac2a', label: "Sort items" })), h("swirl-stack", { key: '51aa35e3b7a7ce71680d572792d167621b38ceb2', orientation: "horizontal", slot: "app-bar" }, h("swirl-stack", { key: '3954da4255b54e241a1587ebd9a8c446091ca671' }, h("swirl-heading", { key: '321cdec474405b1c3c6e0e3e0f234a8c8dbbdd00', as: "h2", level: 4, text: this.selectedFile?.name }), h("swirl-text", { key: '2186ca0e5fc52d8c9df2595450f4d6fce3aeb7f3', 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: '01e00b61f51fd760b72a1a51747d1a217d4a6ac0', slot: "app-bar-controls" }, this.selectedFile && (h("swirl-button", { key: '46717af8a604adb5b6cc828e6ec35ec3b861004e', "hide-label": true, class: "info-button", icon: "<swirl-icon-info></swirl-icon-info>", label: "Open file info", onClick: this.toggleSidebar }))), h("swirl-box", { key: 'ff0981373d63a977d8224b7e77594b9bd258ea24', padding: "16", slot: "sidebar" }, h("swirl-text", { key: 'a89deb8d3f244b22a97b2340f50b3330f6b041e6', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), h("swirl-popover", { key: '51a7ce5d59c9625f017b7df56254eb63910108f2', label: "Sort items", ref: (el) => (this.sortMenu = el) }, h("swirl-option-list", { key: '445f492b2cc0ff502ea2b826d9a96eddb47f375e', value: ["ascending"] }, h("swirl-option-list-item", { key: 'ec810264c2b253a2587a7ee1658b4ad95a5af142', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), h("swirl-option-list-item", { key: 'b279e92c665ff6408fec9a4d641d7ff1042e6660', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), h("swirl-option-list-item", { key: 'c8760ddfaaf97bb9dd7f6866f983271564e5ee13', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
+        return (h(Host, { key: 'd3c7447f0f498ed7d93b03f7aa7ad14d47105bb4' }, h("swirl-app-layout", { key: 'fed258b3fddaa254c5ebb16d9decd09211ba46e2', 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: '685d58ad37cc5d3eb19d133c4e5d6e8a51e6af83', label: "Documents", slot: "navigation" }, this.renderNavigation()), h("swirl-popover-trigger", { key: 'dda0f1bb5cf2b617dc12804e2b2b71e0db628f1e', swirlPopover: this.sortMenu, slot: "navigation-controls" }, h("swirl-button", { key: '3c864ed76ed82b711d5f766a7ee408ab1f859e25', label: "Sort items" })), h("swirl-stack", { key: '2a0118ce488ca5246a6b770f17e6892478bd6edb', orientation: "horizontal", slot: "app-bar" }, h("swirl-stack", { key: '6bac2eb3f290af6df396aed34850e19d6ab56901' }, h("swirl-heading", { key: '94cd681aeaab0b917a5fcb7f909ecb74a7c3b053', as: "h2", level: 4, text: this.selectedFile?.name }), h("swirl-text", { key: '4af41f621851df757bc45230755c03286e74a8ee', 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: '1de67a750f4f71a57d563c7ba159b49dedf0c2da', slot: "app-bar-controls" }, this.selectedFile && (h("swirl-button", { key: 'cdbe66b7bd543bad6b8cf1dcd0f58437d4b54f08', "hide-label": true, class: "info-button", icon: "<swirl-icon-info></swirl-icon-info>", label: "Open file info", onClick: this.toggleSidebar }))), h("swirl-box", { key: '4b6b8d435d2d3de4891b2b58fda37037275e8336', padding: "16", slot: "sidebar" }, h("swirl-text", { key: '6d0a486370330bccffb3c1c962f517485a4d0f78', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), h("swirl-popover", { key: '5eac6ec4bef940f06476c9f47ded73e9d9b7f0b0', label: "Sort items", ref: (el) => (this.sortMenu = el) }, h("swirl-option-list", { key: '7cd817a43af2d87001ea0516639764c85c263bbb', value: ["ascending"] }, h("swirl-option-list-item", { key: '371d87ccdecdb43312dd224c2a31f41b36493ab0', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), h("swirl-option-list-item", { key: 'a2de79d5fa51eb578d9f8f4e173f572c6da29140', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), h("swirl-option-list-item", { key: 'c571a0affcd0ebc0b518c81c44d3a85e6db1bcf4', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
     }
 };
 

package/dist/esm/index-6124252f.js

@@ -2002,6 +2002,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return import(
                       /* webpackMode: "lazy" */
                       './swirl-icon-attachment.entry.js').then(processMod, consoleError);
+                case 'swirl-icon-audio-file':
+                    return import(
+                      /* webpackMode: "lazy" */
+                      './swirl-icon-audio-file.entry.js').then(processMod, consoleError);
                 case 'swirl-icon-bar-chart':
                     return import(
                       /* webpackMode: "lazy" */
@@ -2406,6 +2410,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return import(
                       /* webpackMode: "lazy" */
                       './swirl-icon-photo-camera.entry.js').then(processMod, consoleError);
+                case 'swirl-icon-picture-as-pdf':
+                    return import(
+                      /* webpackMode: "lazy" */
+                      './swirl-icon-picture-as-pdf.entry.js').then(processMod, consoleError);
                 case 'swirl-icon-picture-in-picture':
                     return import(
                       /* webpackMode: "lazy" */
@@ -2434,6 +2442,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return import(
                       /* webpackMode: "lazy" */
                       './swirl-icon-present.entry.js').then(processMod, consoleError);
+                case 'swirl-icon-preview':
+                    return import(
+                      /* webpackMode: "lazy" */
+                      './swirl-icon-preview.entry.js').then(processMod, consoleError);
                 case 'swirl-icon-print':
                     return import(
                       /* webpackMode: "lazy" */