@getflip/swirl-components 0.374.0 → 0.376.0

package/dist/collection/components/swirl-symbol/symbols/swirl-symbol-youtube.js

@@ -8,7 +8,7 @@ export class SwirlSymbolYoutube {
     render() {
         const viewBoxSize = this.size === 20 ? 24 : this.size;
         const className = classnames("swirl-symbol", `swirl-symbol--size-${this.size}`);
-        return (h("svg", { key: 'eaa9b130ca18086d837837f4ae7ecf36a04b0e88', class: className, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, h(Fragment, { key: 'f8cfe9f3d13e5290182c6db852773ba4000aa272' }, h("path", { key: 'd62a3ed86a970b723a2bd29513a3fb4f9424af19', d: "M21.582 7.201C21.4691 6.77542 21.2463 6.38698 20.936 6.07459C20.6257 5.76219 20.2388 5.5368 19.814 5.421C18.254 5 12 5 12 5C12 5 5.74599 5 4.18599 5.421C3.76123 5.5369 3.37436 5.76231 3.06408 6.0747C2.7538 6.38708 2.53101 6.77547 2.41799 7.201C2.12953 8.79965 1.9896 10.4216 1.99999 12.046C1.9896 13.6704 2.12953 15.2923 2.41799 16.891C2.53092 17.3166 2.75368 17.705 3.06397 18.0174C3.37426 18.3298 3.76118 18.5552 4.18599 18.671C5.74499 19.092 11.999 19.092 11.999 19.092C11.999 19.092 18.253 19.092 19.813 18.671C20.2378 18.5553 20.6248 18.3299 20.9351 18.0175C21.2454 17.7051 21.4682 17.3166 21.581 16.891C21.8695 15.2923 22.0098 13.6705 22 12.046C22.0104 10.4216 21.8704 8.79965 21.582 7.201ZM9.95399 15.019V9.072L15.181 12.045L9.95399 15.019Z", fill: "currentColor" }))));
+        return (h("svg", { key: '0d653ebda90123f9157887ec5e6cf351eb49b6ca', class: className, fill: "none", height: this.size, part: "symbol", viewBox: `0 0 ${viewBoxSize} ${viewBoxSize}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, h(Fragment, { key: '9cbfd6f164d2f2d75f67a3c7d1380ce6c3683953' }, h("path", { key: '51d959ea266e9beffff1bfd68d37ed06e81f5bf2', d: "M21.582 7.201C21.4691 6.77542 21.2463 6.38698 20.936 6.07459C20.6257 5.76219 20.2388 5.5368 19.814 5.421C18.254 5 12 5 12 5C12 5 5.74599 5 4.18599 5.421C3.76123 5.5369 3.37436 5.76231 3.06408 6.0747C2.7538 6.38708 2.53101 6.77547 2.41799 7.201C2.12953 8.79965 1.9896 10.4216 1.99999 12.046C1.9896 13.6704 2.12953 15.2923 2.41799 16.891C2.53092 17.3166 2.75368 17.705 3.06397 18.0174C3.37426 18.3298 3.76118 18.5552 4.18599 18.671C5.74499 19.092 11.999 19.092 11.999 19.092C11.999 19.092 18.253 19.092 19.813 18.671C20.2378 18.5553 20.6248 18.3299 20.9351 18.0175C21.2454 17.7051 21.4682 17.3166 21.581 16.891C21.8695 15.2923 22.0098 13.6705 22 12.046C22.0104 10.4216 21.8704 8.79965 21.582 7.201ZM9.95399 15.019V9.072L15.181 12.045L9.95399 15.019Z", fill: "currentColor" }))));
     }
     static get is() { return "swirl-symbol-youtube"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-table-cell/swirl-table-cell.js

@@ -4,7 +4,7 @@ import { h, Host } from "@stencil/core";
  */
 export class SwirlTableCell {
     render() {
-        return (h(Host, { key: 'caa6a0ead6554c367126f5073fc5d6f6dd7b81c5', class: "table-cell", role: "cell" }, h("slot", { key: 'a6b3deb661f69bb1ab969684d4c217d76c4ae986' })));
+        return (h(Host, { key: 'fc2b009be27363269122601a854fb07fe9ead689', class: "table-cell", role: "cell" }, h("slot", { key: '4455631349c3222325bdc75316a9d70d8f9d172a' })));
     }
     static get is() { return "swirl-table-cell"; }
     static get encapsulation() { return "shadow"; }

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

@@ -13,7 +13,7 @@ export class SwirlTableRow {
         const className = classnames("table-row", {
             "table-row--highlighted": this.highlighted,
         });
-        return (h(Host, { key: '88c230f066b64b23b28c8b2cffdd1e530b1fc4ca', "aria-rowindex": this.index, class: className, role: "row" }, h("slot", { key: 'e8d3f5ff24dd58c0a61b2a133de256b6ec014925' })));
+        return (h(Host, { key: 'e35a84ff43fe783dcbb634b5adc89fa7f50dac24', "aria-rowindex": this.index, class: className, role: "row" }, h("slot", { key: '53b3b7127821dedb87fbee74c924fd1257135467' })));
     }
     static get is() { return "swirl-table-row"; }
     static get encapsulation() { return "shadow"; }

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

@@ -38,10 +38,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: '466b29723fe0657d0224e31f41e24e40c8535051', class: "table-row-group", role: "rowgroup" }, h("div", { key: '570577ca2aabac6ec76324234e5493b3af1875f8', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (h("swirl-button", { key: 'db19f8f13726fd1d58d7da0b6dd8e5733d090c23', 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: 'eae2332e09e7e500ec47c403edaf3776faab41be', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (h("span", { key: '90b75405fb2c17a3ebf6debacf26abac0d0387a1', class: "table-row-group__tooltip" }, h("swirl-tooltip", { key: 'abe03bde8fa0a73b93a7fc2524b0fe574941d87c', content: this.tooltip, position: "top", positioning: "fixed" }, h("swirl-icon-info", { key: 'f85a9acf6b2cef3090c31b2b5e43160713329495', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), h("div", { key: '8e3dbaac26a1ddec5f47ba9b298127092e983f32', class: {
+        return (h(Host, { key: '421a51a4a07f48f73a128dafb1aeb85d4d6d3ab5', class: "table-row-group", role: "rowgroup" }, h("div", { key: 'd4a72a45c7589c978722e1e815b7f4da5e03bd87', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (h("swirl-button", { key: 'f5a5a4341b91990ee625bf4758c95508e346ec14', 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: 'eb5b6eb8e62db0f72d26426701fb6be53973dd63', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (h("span", { key: '290c8f8edbbcbec61437b89f814f52d58d183141', class: "table-row-group__tooltip" }, h("swirl-tooltip", { key: '79e01f4eec78fd323c6f84850e2d8582f92ae668', content: this.tooltip, position: "top", positioning: "fixed" }, h("swirl-icon-info", { key: 'e645da847be35ed69b775469fcefcc49c18cca05', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), h("div", { key: 'ebb6c02f701bed67efcd4b580123e27b56e269dc', 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: 'fc6272e8d8cb906eb3826a0719905e5ef2a7d936' }))));
+            }, "aria-hidden": !this.isVisible, ref: (el) => (this.tableRowElements = el) }, h("slot", { key: '7c4015a8815b4ba05ee5008442c60765e291261a' }))));
     }
     static get is() { return "swirl-table-row-group"; }
     static get encapsulation() { return "shadow"; }

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

@@ -70,7 +70,7 @@ export class SwirlTabs {
         }));
     }
     render() {
-        return (h(Host, { key: '1b71ed5ebc8c25ed689c2f007f258903f70f16b0' }, h("div", { key: '43d418a0accc3ff045c125910ec4ac78ccfcb7c3', class: "tabs" }, h("swirl-tab-bar", { key: '6fc41b7e6f1eb12a569aef6d1e43cbfe2fdb69df', 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: '099762d240237856fd73a448bad8b1794f91fed5' })));
+        return (h(Host, { key: 'd78b21bdd1f903eb77ad028aa396d761b5094ebe' }, h("div", { key: 'c3258e7b879253d06d2ac66b84df3d3fde928feb', class: "tabs" }, h("swirl-tab-bar", { key: 'd7caa79a2227439b3bb4c75e7d68399123c34db8', 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: 'cc62dc7beeac480a5a165668a67220e18373a204' })));
     }
     static get is() { return "swirl-tabs"; }
     static get encapsulation() { return "scoped"; }

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

@@ -144,7 +144,7 @@ export class SwirlThemeProvider {
         this.setDesignTokens = [];
     }
     render() {
-        return (h(Host, { key: '8393a61a05cc2eeb473ee1ef1feaf1e8e269eb4d' }, h("slot", { key: '8cc0185f22946934eac2c3d60ab73066477207d5' })));
+        return (h(Host, { key: 'd5905b314adf9a3ae78f7544359c7d331bcbe746' }, h("slot", { key: 'c3d11f71afa8361190e953b37fc8a03d6644c02e' })));
     }
     static get is() { return "swirl-theme-provider"; }
     static get encapsulation() { return "scoped"; }

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

@@ -136,7 +136,7 @@ export class SwirlTimeInput {
         const className = classnames("time-input", {
             "time-input--inline": this.inline,
         });
-        return (h(Host, { key: '981cf171001c3c69d9ca6499bdd7426848810711' }, h("div", { key: '2949f08e0a08ef2e159e59ce2d2fc7fb84dd274b', class: className }, h("input", { key: 'c2be09c877ca4ec6e10e7514cd85e674fc07a57b', "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, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text" }), h("span", { key: 'ae29d4c1ca5d831bfc7a5af272989603c9ce5f86', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '9fdef36886b40de6cafb94c09f0445a1c55da0b3', size: this.iconSize })))));
+        return (h(Host, { key: 'ad84575f3cbcf1e8b414b7e2d30b1e14ed6539b6' }, h("div", { key: '6d610587acf5a75a19a8396e526636e9feb1b2ab', class: className }, h("input", { key: '3b010fcce9dba4acd690758530fcff960c6dc119', "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, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text" }), h("span", { key: 'fa9e16c19287bf1b60a6a26613d7c82fc8a450ce', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '9a40e242b4eb53278b5c4d7503fc934caa83b778', size: this.iconSize })))));
     }
     static get is() { return "swirl-time-input"; }
     static get encapsulation() { return "scoped"; }

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

@@ -11,7 +11,7 @@ export class SwirlToggleButton {
         const classNames = classnames("button", {
             "button--pressed": this.isPressed,
         });
-        return (h("button", { key: '725fa8f8aecb56f47b055c9e337a23c04594842c', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (h("swirl-icon", { key: '28e52ad921ed4660a8767b2a4a2fbe4c09787bc5', class: "button__icon", glyph: this.icon })), h("span", { key: '725200238f3d8bcf14c9795386a4cc07198f881a', class: "button__label" }, this.label)));
+        return (h("button", { key: '59fa0013b0e89eac0bb722254ebca1505a884235', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (h("swirl-icon", { key: 'a9e9e990c71ad7c0537f07904eeef1d0fe55e9dd', class: "button__icon", glyph: this.icon })), h("span", { key: 'ed362ba930a914fe8735eaeb2690ddacb05e11af', class: "button__label" }, this.label)));
     }
     static get is() { return "swirl-toggle-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class SwirlTreeNavigation {
     render() {
-        return (h(Host, { key: '6de0c53c48ee5a11541f3f048da018df9a0d19f9' }, h("ul", { key: 'b9e5bf4dfb6aef8acb2e92421a71fe936d3912e9', "aria-label": this.label, class: "tree-navigation", role: "tree" }, h("slot", { key: 'd2999c3fbebc8629f3662b9536d1da42ec671b2d' }))));
+        return (h(Host, { key: '6bac13de4ea94acc65ea1c34c9d420aafd95232e' }, h("ul", { key: '0c47a6917c4cbcb1398703b7e3789083c21a4c26', "aria-label": this.label, class: "tree-navigation", role: "tree" }, h("slot", { key: '4947f3826f665b24eeb90d5f22cfb6beee76823c' }))));
     }
     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

@@ -83,12 +83,12 @@ export class SwirlTreeNavigationItem {
             "tree-navigation-item__link--active": this.active,
             "tree-navigation-item__link--has-icon": Boolean(this.icon),
         });
-        return (h(Host, { key: 'e5892006f6e0d479a93994f050a9bfc06d358cb9', role: "none" }, h("li", { key: '12fbbd5cf3ca7e97597a6faa1889e665e910becb', class: {
+        return (h(Host, { key: 'd6fb77d697125eeca188a806b4d3a5a3e759a02b', role: "none" }, h("li", { key: '77734f81922b60a49809a2ad6a0b347caa1c1034', 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: '44e9017d8b25ad561050666ad2e6c9a35d9fe2a3', 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: '7ec98ce065c42aaf96a8340da27b22888a9fcf49', class: "tree-navigation-item__content" }, this.icon && (h("swirl-icon", { key: '0110d7f713ca0040067bb4cecfe10f3c21140df5', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), h("span", { key: '321e98259f46f2537daa178b94880af5b654e7cd', class: "tree-navigation-item__label" }, h("span", { key: '03b40b5a27f2ebaabde7dd1eda9389e8a5ae5ab8', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (h("span", { key: '43bb07c08e0fb5c8e67b8ac2ef5a75e0c89d0f3a', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, h("swirl-icon-chevron-right", { key: 'e7b0b04613e89576cbd7e9052bf300fbe7936589', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (h("span", { key: '3c53d1fb965bc60273762fae697161dd07d79b7c', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, h("swirl-icon-open-in-new", { key: 'c0a534343158a84b62d1f2217020cbd831cf8ee3', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (h("ul", { key: 'ffb5c9030cfffa3e2717782678ed37c2edf51cd8', 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: 'a0926e1a489028e53f58d3f7669e2269af0a123a', 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: '9258266dc382c39f90919095eb4d59da1d196531', class: "tree-navigation-item__content" }, this.icon && (h("swirl-icon", { key: '50a25ce9cae0b3cd2e589cb88be65171f67b7a79', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), h("span", { key: '82ab0a3fd85a00716d5b4cf654b25a5dc735751e', class: "tree-navigation-item__label" }, h("span", { key: '793584416a380c2d09be90352009f859052aae35', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (h("span", { key: '519603990f680396254190c05e6ccd8dc27943ab', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, h("swirl-icon-chevron-right", { key: '6a99d31d9ce7314867de6037d0a4f227da208bbb', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (h("span", { key: 'd6c14a15acc3f51bfbcadd054a1f06453fa30b45', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, h("swirl-icon-open-in-new", { key: 'ad5e4376ab4458d4158b2f36d16793b9b6554615', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (h("ul", { key: 'b7e9f8883ca0547e5450194041ff3a11c9dc7fbe', 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: '0c6eefee8fbb6fe15702d739807cba7ac2e58231' }))))));
+            } }, h("slot", { key: 'e5343b9170600521092110e0566b8942853baeb1' }))))));
     }
     static get is() { return "swirl-tree-navigation-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -4,7 +4,7 @@ export class SwirlVideoThumbnail {
         this.durationLabel = "Duration";
     }
     render() {
-        return (h(Host, { key: '42f3f85dc459c8d7140d9052f9cf4c6edaa4dd51' }, h("button", { key: '82dd95b54642b3b108fd91dbf1a8f8afeb0fa271', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: '278f7980472b30d2611f4b2ea81f680d01f98ce0', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: '909ec9ce4fb84fd292047f01bf5b151e2d31d8ad', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: 'c116caa5cdfce1eaf4c90fc0952435677b7a8f91' }, this.durationLabel), this.duration)), h("svg", { key: 'f3def89bf9321a2bd650ce8da299927841492bd9', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'c680681835a6635574865c28eb9c579073b57068', 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: 'edf47faecac9e48faeb68ce9decdb5e5207624c5' }, h("button", { key: '75a450720702a5c2d2ace87324dbdd98e6d59236', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: '7bf9914494fa7e553403b66971fbeb97e97c5f36', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: 'a3573afe2eb65580d593e2ea5fa23e0fe18a3019', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: 'ad8a35f788adfe99367b61bf054166dac83c537e' }, this.durationLabel), this.duration)), h("svg", { key: 'fbeccac5ba6b4cc7b1e3bdb93691ac763ebf4ceb', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '6e3a6435f6060076af8698bad118967c32843ef6', 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: 'c60b98986bfc4bfe390d3d3e1eef5a54dcc25110' }, h("slot", { key: 'f150f7d98ab83d65e72983aa63ca593b915e2f5d' })));
+        return (h(Host, { key: 'ffcded2ad602c1ccaca037904892d07c923c501a' }, h("slot", { key: '23aacb88d35fd5411f1704da57ccad33ce52a264' })));
     }
     static get is() { return "swirl-visually-hidden"; }
     static get encapsulation() { return "scoped"; }

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

@@ -53,7 +53,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: 'ab4714e7adcd1a3741d1dcbc7c4de6004ecfc996' }, h("swirl-app-layout", { key: 'e3637d43b4707efdd35e73e60890c8cd2bd5b646', 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: '5388eacaa046de043945038ac2a8b3b816b5fb4d', label: "Documents", slot: "navigation" }, this.renderNavigation()), h("swirl-popover-trigger", { key: 'e1297dd14cc51d71ed09ba207cc8df6e7bedae12', swirlPopover: this.sortMenu, slot: "navigation-controls" }, h("swirl-button", { key: '907fed6b26950cbd86e3991863ec3436e6be7b62', label: "Sort items" })), h("swirl-stack", { key: '29a611316c2d000c8a09e80a9e0f588f51c56b39', orientation: "horizontal", slot: "app-bar" }, h("swirl-stack", { key: 'bddbf7535e6f77469ac27cc0c6ecbd34953148af' }, h("swirl-heading", { key: 'bc18e1ba33ca53bb5f456ce1bc08cdda15de5b93', as: "h2", level: 4, text: this.selectedFile?.name }), h("swirl-text", { key: 'cf4deeeb1b5943511a9b01928f93a679bba0d98b', 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: 'd2821633d911d455bd38e009e528274562d8170e', slot: "app-bar-controls" }, this.selectedFile && (h("swirl-button", { key: '9d8441a51bf38ab03b32919858322693c2a1c9e6', "hide-label": true, class: "info-button", icon: "<swirl-icon-info></swirl-icon-info>", label: "Open file info", onClick: this.toggleSidebar }))), h("swirl-box", { key: '444680fd39a768ef18e72b4e8b9c915b1bd80804', padding: "16", slot: "sidebar" }, h("swirl-text", { key: '74025b4637c984103d390183b1f890d8593c7454', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), h("swirl-popover", { key: '411fc06cec32bf3558cf0ee8f93fe492ca135eac', label: "Sort items", ref: (el) => (this.sortMenu = el) }, h("swirl-option-list", { key: '557323af43223ebf468a8eb76151c8e7ea528b73', value: ["ascending"] }, h("swirl-option-list-item", { key: '95f1a4ea683ea4ac31a25c75a6fece74ebf1cd3a', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), h("swirl-option-list-item", { key: 'c4624ca713d8f4cefc727093a0fa9cc5358e2a19', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), h("swirl-option-list-item", { key: 'cd3d0e016af8753032139ade20a6d2b8ac41142f', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
+        return (h(Host, { key: '505083ec6ccf1400a19934b8177062c2f8437a5f' }, h("swirl-app-layout", { key: 'f2101e6c920faabe7f8a2e4de1affbab17b12c41', 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: '0480ed0e39aad951a8d3a23ec4ce85ab482e5aca', label: "Documents", slot: "navigation" }, this.renderNavigation()), h("swirl-popover-trigger", { key: 'f650570702c7a499d18e11f776b60bef9ae991ba', swirlPopover: this.sortMenu, slot: "navigation-controls" }, h("swirl-button", { key: '7fe7cd9d69f8db623b239bdc310486424358e12d', label: "Sort items" })), h("swirl-stack", { key: '84c19ae34c66c1780bd463e7c2b2d10ce7e2c279', orientation: "horizontal", slot: "app-bar" }, h("swirl-stack", { key: 'ba8a9239110b3cf5af08460cb0376d071382c636' }, h("swirl-heading", { key: 'b6c01f2a051bfd53da66733c66b130c5d2167766', as: "h2", level: 4, text: this.selectedFile?.name }), h("swirl-text", { key: '5d77867c86ad9003fe320a049ab95e36ef077501', 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: '47d5d5fe0acd228efbffce6b53ca8ec182ae99b4', slot: "app-bar-controls" }, this.selectedFile && (h("swirl-button", { key: 'dd295db87d164e598639d5531e183b5e2915be71', "hide-label": true, class: "info-button", icon: "<swirl-icon-info></swirl-icon-info>", label: "Open file info", onClick: this.toggleSidebar }))), h("swirl-box", { key: '51af124a80d628f9671a881f6a6d3e2fb99aac17', padding: "16", slot: "sidebar" }, h("swirl-text", { key: '50461c80a73b734c654afc0bf87897e812706121', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), h("swirl-popover", { key: '976fe2df7dcc5095c604801c4a3b44e1eef97531', label: "Sort items", ref: (el) => (this.sortMenu = el) }, h("swirl-option-list", { key: '40f76488848bc1daec69913df063b77a76e6b951', value: ["ascending"] }, h("swirl-option-list-item", { key: '19c01d4897a1d5b9c4aea8a1b1a23438fe648a37', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), h("swirl-option-list-item", { key: 'd9e437e1caa86aa077d7d335eb0b66ab5df1854b', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), h("swirl-option-list-item", { key: '12f08df1327fce90035b2316bec148fa01957bb0', 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"; }