@getflip/swirl-components 0.326.0 → 0.328.0

package/dist/collection/components/swirl-table-row-group/swirl-table-row-group.js

@@ -40,10 +40,10 @@ export class SwirlTableRowGroup {
         const iconType = this.isVisible
             ? "<swirl-icon-expand-less></swirl-icon-expand-less"
             : "<swirl-icon-expand-more></swirl-icon-expand-more";
-        return (h(Host, { key: 'cdaf26a20bd780e5c316cd66dc68a9807f8a9e1c', class: "table-row-group", role: "rowgroup" }, h("div", { key: '7dc6930cf40f60602f451d42184823ccd335cfa5', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (h("swirl-button", { key: 'd760db8c16b6d32dddaa3286cb0f4472d9a7cb78', class: "table-row-group__collapse-icon", icon: iconType, label: this.collapseButtonLabel, onClick: this.toggleShowItems, swirlAriaExpanded: String(this.isVisible), variant: "plain", hideLabel: true })), h("span", { key: '8de0eda147af127fa5b4ea2d89999b81f50cc9ea', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (h("span", { key: '6c50f4794a72f235c216dfd2952447a9e3c13bdf', class: "table-row-group__tooltip" }, h("swirl-tooltip", { key: '07e6c41bdee573bedd2adcf1ca8a9357b832e0d9', content: this.tooltip, position: "top", positioning: "fixed" }, h("swirl-icon-info", { key: '809ad7f8390c938cd5e537c1c255b04be18ece2e', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), h("div", { key: 'c4f8a22f999fe6000090224e104dfcbcdd0e5eb3', class: {
+        return (h(Host, { key: '339b69da16a558b5511c898193d417abf23ec4d1', class: "table-row-group", role: "rowgroup" }, h("div", { key: '9fea8d8b1ee96aee6d0524969476acd9880a66bd', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (h("swirl-button", { key: '25a0f66069811d0aebcc32c53f2c1394caf3225d', class: "table-row-group__collapse-icon", icon: iconType, label: this.collapseButtonLabel, onClick: this.toggleShowItems, swirlAriaExpanded: String(this.isVisible), variant: "plain", hideLabel: true })), h("span", { key: '856d53ae778ab9ecbbc73f9967f97da8f2816519', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (h("span", { key: '88c0297108cf3729a5f1441b577f14c8dd138b8c', class: "table-row-group__tooltip" }, h("swirl-tooltip", { key: 'f6f4eea2f2d3094d70efcfe8ed4792a30c36b496', content: this.tooltip, position: "top", positioning: "fixed" }, h("swirl-icon-info", { key: '5fb3d113834082e10fc6c9d2845c4d4275ff7f22', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), h("div", { key: 'bd6297b209cb2adcc9f2361d9239a9a44e51625f', class: {
                 "table-row-group__rows-container": true,
                 "table-row-group__rows-container--is-hidden": this.isVisible,
-            }, "aria-hidden": !this.isVisible, ref: (el) => (this.tableRowElements = el) }, h("slot", { key: '0a615b88d61809c8b2b9436de421787e8e13eeab' }))));
+            }, "aria-hidden": !this.isVisible, ref: (el) => (this.tableRowElements = el) }, h("slot", { key: 'd6fee4657a13d8b96894e179481de4a5a65871fe' }))));
     }
     static get is() { return "swirl-table-row-group"; }
     static get encapsulation() { return "shadow"; }

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

@@ -78,7 +78,7 @@ export class SwirlTabs {
         }));
     }
     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' })));
     }
     static get is() { return "swirl-tabs"; }
     static get encapsulation() { return "scoped"; }

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

@@ -36,7 +36,7 @@ export class SwirlTag {
     }
     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 }))))));
     }
     static get is() { return "swirl-tag"; }
     static get encapsulation() { return "shadow"; }

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

@@ -54,7 +54,7 @@ export class SwirlText {
         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' }))));
     }
     static get is() { return "swirl-text"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/swirl-text-input/swirl-text-input.js

@@ -69,6 +69,7 @@ export class SwirlTextInput {
         this.autoFocus = undefined;
         this.autoGrow = undefined;
         this.autoSelect = undefined;
+        this.characterCounterLabel = "Used characters";
         this.clearable = undefined;
         this.clearButtonLabel = "Clear input";
         this.disabled = undefined;
@@ -178,7 +179,7 @@ export class SwirlTextInput {
             "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 is() { return "swirl-text-input"; }
     static get encapsulation() { return "scoped"; }
@@ -263,6 +264,24 @@ export class SwirlTextInput {
                 "attribute": "auto-select",
                 "reflect": false
             },
+            "characterCounterLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "character-counter-label",
+                "reflect": false,
+                "defaultValue": "\"Used characters\""
+            },
             "clearable": {
                 "type": "boolean",
                 "mutable": false,

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

@@ -145,7 +145,7 @@ export class SwirlThemeProvider {
         this.setDesignTokens = [];
     }
     render() {
-        return (h(Host, { key: 'db982cb09fcded4777d5964e7300aa31d1b6019e' }, h("slot", { key: '8aaed653f6aa88a2978867717bc089749e737409' })));
+        return (h(Host, { key: 'deb455cfb0b92e63606caf2844ca065176f102c0' }, h("slot", { key: '40b9366456f59967c1552a91ddf0f8e28ec91027' })));
     }
     static get is() { return "swirl-theme-provider"; }
     static get encapsulation() { return "scoped"; }

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

@@ -29,7 +29,7 @@ export class SwirlThumbnail {
             "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 is() { return "swirl-thumbnail"; }
     static get encapsulation() { return "shadow"; }

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

@@ -32,7 +32,7 @@ describe("swirl-thumbnail", () => {
             </span>
             <swirl-button-group class="thumbnail__buttons">
               <span>
-                <swirl-button hidelabel="" icon="<swirl-icon-close></swirl-icon-close>" label="Remove" pill="" variant="on-image"></swirl-button>
+                <swirl-button hidelabel="" icon="<swirl-icon-delete></swirl-icon-delete>" label="Remove" pill="" variant="on-image"></swirl-button>
               </span>
             </swirl-button-group>
             <span class="thumbnail__timestamp">

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

@@ -117,7 +117,7 @@ export class SwirlTimeInput {
         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 })))));
     }
     static get is() { return "swirl-time-input"; }
     static get encapsulation() { return "scoped"; }

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

@@ -53,7 +53,7 @@ export class SwirlToast {
     }
     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 is() { return "swirl-toast"; }
     static get encapsulation() { return "shadow"; }

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

@@ -49,7 +49,7 @@ export class SwirlToastProvider {
         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/collection/components/swirl-toggle-button/swirl-toggle-button.js

@@ -14,7 +14,7 @@ export class SwirlToggleButton {
         const classNames = classnames("button", {
             "button--pressed": this.isPressed,
         });
-        return (h("button", { key: 'af2ba87225e82d91424f80e8355fc9b949f0835c', class: classNames, 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, 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 is() { return "swirl-toggle-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -58,7 +58,7 @@ export class SwirlToggleGroup {
         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 })));
     }
     static get is() { return "swirl-toggle-group"; }
     static get encapsulation() { return "shadow"; }

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

@@ -66,7 +66,7 @@ export class SwirlToolbar {
         });
     }
     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' }))));
     }
     static get is() { return "swirl-toolbar"; }
     static get encapsulation() { return "shadow"; }

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

@@ -110,7 +110,7 @@ export class SwirlTooltip {
             "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`
                     : "",
@@ -118,7 +118,7 @@ export class SwirlTooltip {
                     ? `${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/collection/components/swirl-tree-navigation/swirl-tree-navigation.js

@@ -4,7 +4,7 @@ export class SwirlTreeNavigation {
         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 is() { return "swirl-tree-navigation"; }
     static get encapsulation() { return "shadow"; }

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

@@ -89,12 +89,12 @@ export class SwirlTreeNavigationItem {
             "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' }))))));
     }
     static get is() { return "swirl-tree-navigation-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -321,7 +321,7 @@ export class SwirlTreeView {
         }
     }
     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 }))));
     }
     static get is() { return "swirl-tree-view"; }
     static get originalStyleUrls() {

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

@@ -323,13 +323,13 @@ export class SwirlTreeViewItem {
             "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' })))));
     }
     static get is() { return "swirl-tree-view-item"; }
     static get originalStyleUrls() {

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

@@ -7,7 +7,7 @@ export class SwirlVideoThumbnail {
         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 is() { return "swirl-video-thumbnail"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-visually-hidden/swirl-visually-hidden.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SwirlVisuallyHidden {
     render() {
-        return (h(Host, { key: '3e4bdbd24e3cf7d3e818b5695608c27c0b984799' }, h("slot", { key: '5af4e846e8f92c2028382bce745696eef5b0c8c1' })));
+        return (h(Host, { key: 'bbce59be34e64a43c4732b42ad3b1f34a46140b8' }, h("slot", { key: '0ff4915e7df0be9aebd944b4760928333c7c8827' })));
     }
     static get is() { return "swirl-visually-hidden"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/prototypes/file-manager/file-manager.js

@@ -56,7 +56,7 @@ export class FileManager {
             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" })))));
     }
     static get is() { return "file-manager"; }
     static get encapsulation() { return "shadow"; }