@getflip/swirl-components 0.245.0 → 0.247.0

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

@@ -10,7 +10,7 @@ const SwirlTableCell$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTableCell e
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: 'f9eadde84e522f9211891f00eaca2853fd1bc885', class: "table-cell", role: "cell" }, h("slot", { key: '56a92db72f118eb73e0a6eaadc113c6de8a6ca63' })));
+        return (h(Host, { key: 'fc7da675df63b41262aab0ca5047cfc6c7c1a482', class: "table-cell", role: "cell" }, h("slot", { key: '5503681f11d794201347e8e705afb2c2dbcf19a6' })));
     }
     static get style() { return SwirlTableCellStyle0; }
 }, [1, "swirl-table-cell"]);

package/dist/components/swirl-table-column.js

@@ -28,7 +28,7 @@ const SwirlTableColumn$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTableColu
             maxWidth: this.maxWidth || "",
             minWidth: this.minWidth || "",
         };
-        return (h(Host, { key: '5eaa343f5d9344f85a0f2b2617b3b67a51f936c2', "aria-sort": this.sort, class: "table-column", role: "columnheader", style: styles }, h("span", { key: '13109489a86afe1855ff52f5f8bfe891df007e25' }, h("slot", { key: 'dbcbad744cc3d64993261addb14ce1dfe94c8dab' })), this.sortable && (h("span", { key: '742952495996feb84140f194c7355e3e00079d0b', class: "table-column__sort-indicator" }, this.sort === "ascending" && (h("swirl-icon-arrow-upward", { key: 'bd67d3c8b75e95aef25505a885856d6cbdec50b3', "aria-hidden": "true", size: 20 })), this.sort === "descending" && (h("swirl-icon-arrow-downward", { key: '5c0c3dbc9ab7183e2560a04f28d7d311cb857432', "aria-hidden": "true", size: 20 })), !Boolean(this.sort) && " "))));
+        return (h(Host, { key: 'e0bcfbe22bb43085840659c7b1adda74201cb73d', "aria-sort": this.sort, class: "table-column", role: "columnheader", style: styles }, h("span", { key: '2ce347c683a9aef70016be71b4356acc5b0bb569' }, h("slot", { key: '1d10da6f2ad240fdf82e32c7d5cf1de61b4f90a4' })), this.sortable && (h("span", { key: '455f62cd7abeada63643452dba8640acffd29bf5', class: "table-column__sort-indicator" }, this.sort === "ascending" && (h("swirl-icon-arrow-upward", { key: 'f5777bbe4c8621ffd82577a83289e3f958152f51', "aria-hidden": "true", size: 20 })), this.sort === "descending" && (h("swirl-icon-arrow-downward", { key: '19590f02f9e9dfd4d9f1b5e14670c68f3b2f6e5f', "aria-hidden": "true", size: 20 })), !Boolean(this.sort) && " "))));
     }
     get el() { return this; }
     static get style() { return SwirlTableColumnStyle0; }

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

@@ -47,10 +47,10 @@ const SwirlTableRowGroup$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTableRo
         const iconType = this.isVisible
             ? "<swirl-icon-expand-less></swirl-icon-expand-less"
             : "<swirl-icon-expand-more></swirl-icon-expand-more";
-        return (h(Host, { key: '8ab8e97bd2985aef56c20ffe7eee056dffcd7bb9', class: "table-row-group", role: "rowgroup" }, h("div", { key: '9821838d4f5ecd879bc8e80a41c09b8c6c441625', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (h("swirl-button", { key: 'c3ebdfc8a90f49e60ac4df2b597d78a20d9be692', 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: 'fb574ba6ac2e46086341c3fae30dda6fb203102a', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (h("span", { key: 'b35e73d76c526fa60f059728646874e4fd2ab83e', class: "table-row-group__tooltip" }, h("swirl-tooltip", { key: 'f898ad2cfa2a45b9fdcd5143a680367b5574d163', content: this.tooltip, position: "top", positioning: "fixed" }, h("swirl-icon-info", { key: 'ee122f7abf912c9232371a4923e88d12a804c3d9', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), h("div", { key: '0d63fd520cfa39e936b0836c1d405027df6caa03', class: {
+        return (h(Host, { key: '42c1ae8cc2f029b64e6d5c30b385602968ab5795', class: "table-row-group", role: "rowgroup" }, h("div", { key: '41cbdfd1e008b3915e85205b2707a4788a966ebe', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (h("swirl-button", { key: 'a9a33ca05064140a5e0b4ff440b16bcc8130be85', 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: 'cf2e90d35fe85bb3b4282dea826b7928ec434ad4', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (h("span", { key: '73af6e7cda606e913f9d75458c2f8c23950e43e7', class: "table-row-group__tooltip" }, h("swirl-tooltip", { key: '7d42b1ff4c5962d3691df08677a2369ac91f0d93', content: this.tooltip, position: "top", positioning: "fixed" }, h("swirl-icon-info", { key: '77c8d123bb003b4418f6fc6c820eeef1fefa7171', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), h("div", { key: '25232d5ef791eca3be4763a3895c9204416be5c4', 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: '2b2875ff98c35caf314c8ca4fe006e0cf9f071dc' }))));
+            }, "aria-hidden": !this.isVisible, ref: (el) => (this.tableRowElements = el) }, h("slot", { key: 'aff3caec1e960700f892a36f013889feaa1cba6b' }))));
     }
     get el() { return this; }
     static get style() { return SwirlTableRowGroupStyle0; }

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

@@ -21,7 +21,7 @@ const SwirlTableRow$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTableRow ext
         const className = classNames("table-row", {
             "table-row--highlighted": this.highlighted,
         });
-        return (h(Host, { key: '3c1f477c956b256c59460f941a75a8ca1aff3f1e', "aria-rowindex": this.index, class: className, role: "row" }, h("slot", { key: '09399cfe33fb05eaad0879f7543f3bfd8d0cfe04' })));
+        return (h(Host, { key: 'ba098072d7003e074599dca860bea7791482f2dc', "aria-rowindex": this.index, class: className, role: "row" }, h("slot", { key: 'c2f6c8ea382d21ecf2ba2e22236d549108255b02' })));
     }
     get el() { return this; }
     static get style() { return SwirlTableRowStyle0; }

package/dist/components/swirl-table.js

@@ -326,7 +326,7 @@ const SwirlTable$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTable extends H
         this.empty = !Boolean(rowsContainer) || rowsContainer.children.length === 0;
     }
     render() {
-        return (h(Host, { key: 'd4e09fdfb2b375ad0709a0b74f731affb5d20a1e' }, h("div", { key: '636dad1473cfea4a29bd8518ee06684f93d9c02a', class: "table" }, h("div", { key: '9a42704c52756fc41a44d21634b215cee09022ae', class: "table__container", onScroll: this.onScroll, ref: (el) => (this.container = el) }, h("div", { key: '3145e090db5b29d5591bc9c185a5beec3ecfd85a', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: '6d3db839fa88962ed3d24951675a3591cb8f8dc5' }, h("div", { key: '167930537efee21f546583599916246430b68c68', id: "caption" }, this.caption))), h("div", { key: '28e1955378ff6494c127e72bc4a4720d992e8d3c', role: "rowgroup" }, h("div", { key: 'a37ec0c0c7321cf3e2d62e562b2139090ea7014c', class: "table__header", role: "row" }, h("slot", { key: '59404fe81504021eef9a120263562279349c770e', name: "columns", onSlotchange: this.onSlotChange }))), h("div", { key: 'bed97aa8b63ce2daa11bf3b584fbc378be780e14', class: "table__body" }, h("slot", { key: 'cd60da9b7e47bb926679cb7cbec88cbb68e8b53b', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (h("div", { key: '01c66b3b1c60aa2c8b1506db6b12db2a7b7afac2', class: "table__empty-row", role: "row" }, h("div", { key: '045ed304534a05efbf268bff844150e80e43c5fc', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("swirl-text", { key: 'f412f7a8b7a430b5a3417f08f2754ac2616ac899', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (h(Host, { key: '211d3134f18e62f7f02f46645fde6e9c4ae07f12' }, h("div", { key: '342e7fc3f43e934c4850a730b15c55044b6ffae2', class: "table" }, h("div", { key: '7e7cfeeb4242ff504d3f523cd02e517dea86c6de', class: "table__container", onScroll: this.onScroll, ref: (el) => (this.container = el) }, h("div", { key: '44221dbaed809884355ed108ab1c1713cf2bd123', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: '57d579d1971de2d6115e585a4baf1fec894bfbd5' }, h("div", { key: '677f67a5395a1724e14e817cfe2a41bf73653978', id: "caption" }, this.caption))), h("div", { key: 'cfffde89247b9c0cb50512ebfc735fecf04a0fc2', role: "rowgroup" }, h("div", { key: 'c5fdb3c72b3b87f17a2da913ccd7820205b550ba', class: "table__header", role: "row" }, h("slot", { key: '717a3592a66bff785b483a73b32e71f7a322a4e7', name: "columns", onSlotchange: this.onSlotChange }))), h("div", { key: 'e20d6e3f38b93015a71fc58e90ceb22e35ae8a13', class: "table__body" }, h("slot", { key: '79e5828baeb733d274bb0c17e6e564c9627aeeeb', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (h("div", { key: '723c25b4d747782529669e3e60d248bb2d91d2e4', class: "table__empty-row", role: "row" }, h("div", { key: '0dd9bafab682f5a632360fe1e3743119d8f5d653', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("swirl-text", { key: '938019e1f358a974deecc760b63fc262be3a8c30', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
     }
     get el() { return this; }
     static get style() { return SwirlTableStyle0; }

package/dist/components/swirl-tabs.js

@@ -82,7 +82,7 @@ const SwirlTabs$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTabs extends HTM
         }));
     }
     render() {
-        return (h(Host, { key: 'ddf35971559241b7bcc6e92560ffd541907eed7a' }, h("div", { key: 'e5169c27f142233a5f5f39aa58d462e6672ebe0c', class: "tabs" }, h("swirl-tab-bar", { key: 'ab63b3352dd63ab90297c206cf60feae37d27a0e', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart })), h("slot", { key: '89f009e2d1ccab578e0e61cd954b4324ecec1c37' })));
+        return (h(Host, { key: '7495ad88433612a876374ca84c56193ec16263e8' }, h("div", { key: 'e1bd37e48815f19f72172e890071ed3bc0ab9749', class: "tabs" }, h("swirl-tab-bar", { key: '13b411c9c2e789151cae647b31b7e25c2886cfea', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart })), h("slot", { key: 'd9604a021dc4226aa1939ecd6a99264528061fcf' })));
     }
     get el() { return this; }
     static get style() { return SwirlTabsStyle0; }

package/dist/components/swirl-tag2.js

@@ -41,7 +41,7 @@ const SwirlTag = /*@__PURE__*/ proxyCustomElement(class SwirlTag extends HTMLEle
     }
     render() {
         const className = classNames("tag", `tag--intent-${this.intent}`, `tag--size-${this.size}`, `tag--variant-${this.variant}`);
-        return (h(Host, { key: '45e5a4bbcf96b35c7a3752e35da0420df14f2af1' }, h("span", { key: '3cba8136d0ec0cd88228570098b03876729b2e68', class: className, part: "tag" }, this.icon && (h("span", { key: '24595925205a07cb706120fae8dabc6794952414', class: "tag__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), h("span", { key: 'b42a3b38173a39ed5d75b40d7b05b8c8a93d19a9', class: "tag__label" }, this.label), this.removable && (h("button", { key: 'dd4b5a3b52e137a5a532435106b38ec5c27ba3e7', "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: 'ca6459abd4a29d5c27f7d8051bd0b70b5ca18e9e', size: 16 }))))));
+        return (h(Host, { key: '0f24f803283d0ae31836832248631c31c3868052' }, h("span", { key: 'a45e560b24f3cef29e7e6b483a4e21cba145c28b', class: className, part: "tag" }, this.icon && (h("span", { key: 'd94c11147ca629d61ec1abc59b08dfaf7d2c4a62', class: "tag__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), h("span", { key: '08be192bc7291eee2e544471e8cc8d10275ac092', class: "tag__label" }, this.label), this.removable && (h("button", { key: 'a1951eec41ca1e82228f5c95b330714b983d491b', "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: 'bc678f5de89bf5b7df6d2247d5cf127b072a0b30', size: 16 }))))));
     }
     get el() { return this; }
     static get style() { return SwirlTagStyle0; }

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: 'e745ae5ee49419e9993e764a8a4cea5b544bcf55' }, h(Tag, { key: '441dc1ef0cff74cf151820913d1e92069cb000df', class: className, ref: (el) => (this.textEl = el), style: styles }, h("slot", { key: 'd32e5ed3edefd646afcacc08fe4daa7ab5d9a1ac' }))));
+        return (h(Host, { key: '83c9324751af58f7ffc5b46dd0de6fe691c58524' }, h(Tag, { key: '15686add3044af674ee4d124376fcb552addba4d', class: className, ref: (el) => (this.textEl = el), style: styles }, h("slot", { key: '57a2e0f601059fd4a37bf8b6cd39fa237dbc68f8' }))));
     }
     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: 'e3bf065bed2b942b8449d86bc9f9616b76cd3c8d' }, h("slot", { key: '1ccc30cd4dfd98ee2153a909e4036f715d8dd6af' })));
+        return (h(Host, { key: '979ca9efaea42949aa0bdaf849921b74d4fc1f06' }, h("slot", { key: '89835b441ff86c54f44252fefe17fee8abe359df' })));
     }
     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: 'fe8b54784f53e9476875288900813ed3d56d7ae7' }, h("span", { key: 'bf8f4021d0463a249ede4f9064f1e1b8f7b01fef', class: className, role: "group" }, h(ImageWrapper, { key: '8d76cacc2d872c5af83c81e75534478d267d63b7', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, h("img", { key: 'abd165e7e5efe56e38a898bef431ef8d3916efa5', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: 'dcbf10469ecca2efd6e8ad396ec7892a5c2e34bb', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: '094ad69094a713d8d968b992d2003d52a7ac06b5', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: 'b9e2ba93d2a6b2d6bae69e566ef6a851f5301723', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: 'b8e7ff0f5bd8cf8325990cc117c044e335ec5fa8' }, h("swirl-button", { key: '16889dde7558128b919ddbe8c337bea620041fac', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: 'fc5f1c213d4fb29369fec87acc9567b92b595b6d' }, h("swirl-button", { key: '9c9ab28aa6d0aa54bebcedd91bd820b071e3e688', 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: '24a2efd1dc21d634e27ff8d13f54cf228fdd2c73', class: "thumbnail__timestamp" }, this.timestamp)))));
+        return (h(Host, { key: '1bdbf8e044a66453ee5615824ac754c91fce4c35' }, h("span", { key: '4c51a527eb1702b1a62787515295ea4cdeecbedc', class: className, role: "group" }, h(ImageWrapper, { key: 'a1812bb2b531a0c3db89a9cde8546c148df5eda5', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, h("img", { key: '8e9de50d0df07c6612f1b18f1c80acbe2eaab27d', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: '80d7ef081fed7d046d1c0e73abfac42666596888', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: '5ad89f005baeaad484d9fb73c06c29d55b77f1dd', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: '255fd4bb4546e285964693ee0ac41f7ff0bf6663', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: 'a4ed20e9402c8f15cc4dd135704245272d4be562' }, h("swirl-button", { key: '1f933976630e136842a6e993cbc57d1b2e729e94', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: '7e05091590d605437b8bf6aeb0eb119dd4c70051' }, h("swirl-button", { key: 'cae4ae3aee2eb1cea01a0c6de1a4d8880d5a1983', 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: '4bc5300253832a20c3a2fd47b68cc0a0f003a321', 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: '35a284345f274c642291fbc43b3ff0ca17856563' }, h("div", { key: '7622671c6e5bf21d98b91b26d7de25c748995baa', class: className }, h("input", { key: '46784998ff8f45c4c2a847b1db1348ec9db3f9da', "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: '6a5aa3cfa4f8f655f224952200bef9fc69c821b9', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '500b38a516301c72dce21a353957ec6329b6a9fe', size: this.iconSize })))));
+        return (h(Host, { key: 'dd32efdce7b60f40c927166c39dd7af360147a7d' }, h("div", { key: '34aa896e2c51a378c563506fb27bbb82c863ef01', class: className }, h("input", { key: '0d00c63be92b9725f3541cc765b146665b4da04c', "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: '40f974e579ebca3a974849e84fbbe66ad7b46ae9', class: "time-input__icon" }, h("swirl-icon-time-outlined", { key: '11d40f17ed904411818b1ce878e79418a36e9bee', 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: '9ad8bd900c35bae7dc87319ed6123b3fd4c79312', role: "status" }, h("swirl-stack", { key: 'b1f42c45828153de003906253eb80b8a974c475e', spacing: "12" }, this.toasts.map((toast) => {
+        return (h(Host, { key: 'e958e449de2556f3a01440cb34d916522dafd849', role: "status" }, h("swirl-stack", { key: '2ff83044cc6f5f1072d2df3498b49e7f70f38627', 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: 'c99dfdb7fb408541c85dc0f992e7db60948bbccb' }, h("div", { key: 'c45887e366fcb433bd68d495c15df4d618012055', class: className }, this.icon && (h("span", { key: '9335e85961d8fda675e1fd3987651acdc1b62fe8', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), h("span", { key: 'e0cbcc8fda5aa8d2c326c8b6369fd906cb13a0dd', class: "toast__content", innerHTML: this.content, part: "toast__content" }, h("slot", { key: '0f9e37a7ae612fc6efb90b60002e509692295b10' })), h("button", { key: 'b98bb0250b6a30956c623b3521aef9d9bb101167', "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: 'd555ff6dd1a3217c6677f89a6beb46c524db1f36', ref: (el) => (this.dismissIconEl = el) }))))));
+        return (h(Host, { key: 'aa416865a4d1ec73a1c414e729f1d064dc905b4f' }, h("div", { key: 'b30606dfd61085995f2e75cd6721bf24a3fbf1b5', class: className }, this.icon && (h("span", { key: '225f83723f9bb35e4c40d70377c03970db6d6062', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), h("span", { key: '77f4acb27ebbd47fbb6e562c61d75f290d4c3e46', class: "toast__content", innerHTML: this.content, part: "toast__content" }, h("slot", { key: 'c9175baa8208dc8c204d919bc7a0bb76afc090e8' })), h("button", { key: '25fa9b5f3b554744fa5b5f0b6f834450922f473c', "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: '9f290ae34e1bbe97f61c7cef4b5455ef99fde3ef', ref: (el) => (this.dismissIconEl = el) }))))));
     }
     static get watchers() { return {
         "duration": ["watchDuration"]

package/dist/components/swirl-toolbar.js

@@ -74,7 +74,7 @@ const SwirlToolbar$1 = /*@__PURE__*/ proxyCustomElement(class SwirlToolbar exten
         });
     }
     render() {
-        return (h(Host, { key: '6f5c646bd9899b76f7c3ed04fa79f0a0261e1605' }, h("swirl-stack", { key: '6d3bf09a8dab3eea1e86b80aba821b04fe5b23de', 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: '4b952d57c53c5ba8c1b4c453dddaa6cc902c97f1' }))));
+        return (h(Host, { key: '77eafeb0997b550cbb4ad2e933ac87f0f7b194ab' }, h("swirl-stack", { key: '5ad5d221226ed9ab2148576b3f4b8f0d4c3c8db8', 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: '5a0974bb650224bc0fc771d293ea64b855544afc' }))));
     }
     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: '032f7f7faed3c0beb1aaf995860c67428cf1d083', onKeydown: this.onKeydown }, h("span", { key: 'a5189bd18e5cc1ea5d9695efbb4abb36c11a09c1', class: className }, h("span", { key: 'd17f03e1e30b2be77393e3c4c97be5dc21e55b75', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, h("slot", { key: '0c35fc5c5d80b47c57850e37b8e535d7e84c52b6' })), h("span", { key: 'a0e64797b14566a02ffb65ccb4f46aeb19990704', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
+        return (h(Host, { key: 'e8ed392cf038f8c7dda28d1b0f37f7fff7a99c67', onKeydown: this.onKeydown }, h("span", { key: 'f396b86fa0472dc9a1c30d33a8467c998a611c37', class: className }, h("span", { key: 'cf7e40414997d42d10a9fcb8ee010ed0d1b8f454', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, h("slot", { key: '4b4b954f3235f3b9e796a58c682f609fd7e11cc3' })), h("span", { key: 'b921c1388acc8775530b90fbee13268c7086ee7e', 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: '1f5eaedac815954cc6a08e921049df0e1e5f5e17', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, h("span", { key: '94b4d83056bc12d8605cef28c2a7e914705333fd', class: "tooltip__content", innerHTML: this.content }))), h("span", { key: '8e03769cc91742255b1e097b5cc22e3fc6773a39', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
+            } }, this.visible && (h("span", { key: '13332b6bd6ab0daabcfb060834d5cb0493d8e827', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, h("span", { key: '1a8ad1c43a2b86064a141f4d51ef158051974789', class: "tooltip__content", innerHTML: this.content }))), h("span", { key: '48fa4b800e6964d9d58301bcf9904f7d9ce5cf79', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
                 ...this.arrowStyles,
                 visibility: this.visible ? "visible" : "hidden",
             } })))));

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

@@ -22,7 +22,7 @@ const SwirlTreeNavigationItem$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTr
             "tree-navigation-item--active": this.active,
             "tree-navigation-item--has-icon": Boolean(this.icon),
         });
-        return (h(Host, { key: '685ad5463f4cd2529d77b96cdfb448bc72050e0c' }, h(Tag, { key: 'fc55249c9c4bf22260dfa164900eb781cbac5974', class: className, href: this.href, target: this.target, type: isLink ? undefined : "button" }, this.icon && (h("span", { key: '406abc2df2a00869c7b559a44a4858a08b07a8a2', class: "tree-navigation-item__icon", innerHTML: this.icon })), h("span", { key: '5b0edc2516ff14f94a30736e2b23574af6c5dcd9', class: "tree-navigation-item__label" }, this.label))));
+        return (h(Host, { key: '98d6a30a0df95c83024c06f8381b2cdfa825a0a0' }, h(Tag, { key: '4b00f039a17fcd44264d90cb67d3350c88f7101a', class: className, href: this.href, target: this.target, type: isLink ? undefined : "button" }, this.icon && (h("span", { key: 'efdd020658971918eba5ddd2636f762d10e17a55', class: "tree-navigation-item__icon", innerHTML: this.icon })), h("span", { key: 'b66d5ac19e8f74642e0b30ae6c6d3149f9a662c5', class: "tree-navigation-item__label" }, this.label))));
     }
     get el() { return this; }
     static get style() { return SwirlTreeNavigationItemStyle0; }

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

@@ -81,11 +81,11 @@ const SwirlTreeViewItem$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTreeView
             "tree-view-item--has-tags": hasTags,
         });
         const hasChildren = Boolean(this.el.querySelector("swirl-tree-view-item"));
-        return (h(Host, { key: '6aed3838b85950a041147d3b5e0b7e19f1202d47', id: this.itemId, role: "none" }, h("li", { key: '225c53b2130a8a5e1f85990bf4e8b9c93b024cbe', class: className, role: "none" }, h("a", { key: 'baada86aa5db298bab7ecdf9287dab3a7fdf09ac', "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, style: {
+        return (h(Host, { key: 'ce367fefd45d1d50c202fa9ef3065eebcfccab7a', id: this.itemId, role: "none" }, h("li", { key: 'ee966b1714d8415bdc2e658ab8fa42ceeb29a15a', class: className, role: "none" }, h("a", { key: '8be8b57d214fe8cb9172ea8d413b7d2adbce26f9', "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, style: {
                 paddingLeft: `calc(${this.level} * var(--s-space-12) + var(--s-space-${this.expandable ? "4" : "8"}))`,
-            }, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, this.expandable && (h("span", { key: '09f7377d4177ed746bb7574125e2fe602261da57', class: "tree-view-item__toggle-icon" }, hasChildren && (h(Fragment, { key: '9e07e333b2106457d32bac104803ab1d140c0b90' }, 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: 'b1ddc56c30f695715ed78fb65fdf62650d66706c' }, h("span", { key: 'f1e0cb841cc74efe91ee72343102a88991634141', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), h("span", { key: 'dfe0cd3a6b9fef717e62d9a800b8263cd7e58ad2', class: "tree-view-item__label" }, this.label), h("span", { key: 'ee783bcfbcf26b80de8d395d0636dcf8105e51ed', class: "tree-view-item__tags" }, h("slot", { key: '4abbe92f473c5235611b56474e27435c3f81295e', name: "tags" }))), h("ul", { key: '7388edec8e202eb51b5b086b3da98d9a56437075', "aria-label": this.label, class: "tree-view-item__children", id: `${this.itemId}-children`, role: "group", style: {
+            }, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, this.expandable && (h("span", { key: '2845aeda99755558b9b4f819472fd025ac1eae13', class: "tree-view-item__toggle-icon" }, hasChildren && (h(Fragment, { key: '50c496922accbf86cbbe26aff3b5fed207f9d1bc' }, 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: '6a5d0160e158b8c0135cc182128974ab84e6c900' }, h("span", { key: 'a01e6768933afc225125fc5540a05dedf0e9b295', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), h("span", { key: '72dcaafd287e07fcfade3af12e71d68c1abfe514', class: "tree-view-item__label" }, this.label), h("span", { key: 'a13263d1a457240cbc39b02eb1028cb8b9c3ab22', class: "tree-view-item__tags" }, h("slot", { key: '74abf719eb9604bb0749b50001efc95b3fb3c0df', name: "tags" }))), h("ul", { key: 'a210013fde5ae34efc2006bddca079a5d0e251b5', "aria-label": this.label, class: "tree-view-item__children", id: `${this.itemId}-children`, role: "group", style: {
                 display: !this.expanded || !hasChildren ? "none" : undefined,
-            } }, h("slot", { key: '1267ae90169fef0a64b08f7a574cba930d85a7a5' })))));
+            } }, h("slot", { key: '84e698eb01a8a13b508bddb94eaf711061284576' })))));
     }
     get el() { return this; }
     static get style() { return SwirlTreeViewItemStyle0; }

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

@@ -197,7 +197,7 @@ const SwirlTreeView$1 = /*@__PURE__*/ proxyCustomElement(class SwirlTreeView ext
         return nestedSibling ?? undefined;
     }
     render() {
-        return (h(Host, { key: 'a5dca9db44170d2156cf786e83c418e7abbe245f' }, h("ul", { key: 'a342d4f621049a1d386663282e691050072f442c', "aria-label": this.label, class: "tree-view", role: "tree" }, h("slot", { key: 'bdec75a3b590f9b30e177b071cc221a45af4173a', onSlotchange: this.onSlotChange }))));
+        return (h(Host, { key: 'ffa39d336af033486bbf479935588592e7e75fc3' }, h("ul", { key: '26135c964f61c1c9f5c7be91a8cddb8f6850503a', "aria-label": this.label, class: "tree-view", role: "tree" }, h("slot", { key: '2aab87e526eb259e67b23d5db60c21fdcb69258b', onSlotchange: this.onSlotChange }))));
     }
     get el() { return this; }
     static get style() { return SwirlTreeViewStyle0; }

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: '87ee3d6f3333be7488a3336a8db36f063a0cf573' }, h("button", { key: 'a33470339e976461db616646d5513381a9768592', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: '9848231bc14d3eb04b6bf78bf205418e97d85aee', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: '1f7ab5421873511db04b0f290d76d5377346266b', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: '87343cbf4b908c854db17b5f1fa99a789deab7c8' }, this.durationLabel), this.duration)), h("svg", { key: '9344ef1c278faf7343a727c160e91b0b74288e1f', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '2473ad0d51fd53eb6b48067c5f9d764bce414599', 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: 'ac33fdb74d0be7fcf9e99e2ba7ebf42b116007ba' }, h("button", { key: '1a6f39295e1854480120c12705c330a36ce25739', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: 'ab4244d3499bf5ad9237d1c991b7c03eab79cf58', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: '31ac5e9ecf02b3d49da7c9e6f3b6c1765b5f31e7', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: '385f3dd48d240f6ada32e108224d9cf485ccb9dd' }, this.durationLabel), this.duration)), h("svg", { key: 'fe0295f39cd1801ef80b97ecf16fb44ac4d22166', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '9319b02da21bee47728845c25e1c41e16236718f', 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: '3551734df55c27104189b924a0fff220f6f33ad5' }, h("slot", { key: '2079ff50ce7ac505a6ba9e6ae27260130071eaf7' })));
+        return (h(Host, { key: '5de7b276847b2a8ca2710007304e037574a1ae60' }, h("slot", { key: 'cce674faf9c097966291ec7f4189c627611471e1' })));
     }
     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: 'ce77d34c23e03318a39eef402e50155b8a770aa2' }, h("swirl-app-layout", { key: 'a3add763a08f6695001ab0be2bb50396a7906fc2', 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: 'f3d8f6ee26210f6edf0d479fc56f90cce1bfc034', label: "Documents", slot: "navigation" }, this.renderNavigation()), h("swirl-popover-trigger", { key: '780e39c49d4b8773350d6817ece57e50b6609858', swirlPopover: this.sortMenu, slot: "navigation-controls" }, h("swirl-button", { key: '9ce300815d019220c6a17aed54ede4ac095d1455', label: "Sort items" })), h("swirl-stack", { key: 'aad461761edba54b2e51a91c612c43c7a4f8382e', orientation: "horizontal", slot: "app-bar" }, h("swirl-stack", { key: '759e913289cc1f61fddec15f2a40f1c603c22f93' }, h("swirl-heading", { key: '662f48f197b13c2e9b487ea1151319c64ffeb344', as: "h2", level: 4, text: this.selectedFile?.name }), h("swirl-text", { key: '48530a45c0c4ab6e5154c13adfcef5e13e010c2e', 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: 'c604a696f3f43b2db5202d009dd58ae430e482a5', slot: "app-bar-controls" }, this.selectedFile && (h("swirl-button", { key: 'd18e3ca16c82988234e32f60db32c759fe8e0bf5', "hide-label": true, class: "info-button", icon: "<swirl-icon-info></swirl-icon-info>", label: "Open file info", onClick: this.toggleSidebar }))), h("swirl-box", { key: 'c4d89f71c8f23d66198e880853f7b4c80ba52ddf', padding: "16", slot: "sidebar" }, h("swirl-text", { key: 'dbd61162448e3d6c9a1b6163899424c61deeec24', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), h("swirl-popover", { key: 'a834d0228e1ef643e43861eb4e72c720f95cea12', label: "Sort items", ref: (el) => (this.sortMenu = el) }, h("swirl-option-list", { key: '95a5383f44232b4a2dbdb4cb5673919407b57d23', value: ["ascending"] }, h("swirl-option-list-item", { key: 'd9f50b966ee6343ff108992b3bdbeac9783de43d', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), h("swirl-option-list-item", { key: '2540257f88e790bceb60f9b32d863b55dcdda0e3', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), h("swirl-option-list-item", { key: '5b2af0f803d8b9eb7cdb4739cd3a6a65d73cb177', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
+        return (h(Host, { key: '5453ee8e8c61f3e0bc4cb483c07f05ba4e387d68' }, h("swirl-app-layout", { key: 'd377fe05b9f56b2463b9b01aa3cd5b60019fa701', 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: '72fea5b42851cf43a979e2435b16853d4e4f34b9', label: "Documents", slot: "navigation" }, this.renderNavigation()), h("swirl-popover-trigger", { key: '639f5903367eb877250fda70f7685385af7ee421', swirlPopover: this.sortMenu, slot: "navigation-controls" }, h("swirl-button", { key: 'cf21bb0727840d286d6566e6e82da95e4aa415df', label: "Sort items" })), h("swirl-stack", { key: '9dfb683d6b03526dc8f3914869514e6f22955015', orientation: "horizontal", slot: "app-bar" }, h("swirl-stack", { key: '669b7b71d05c11805bbd22c24ad8289c89e806b9' }, h("swirl-heading", { key: '242a062fae982a94b8c1e99bf2775a18e73ddea0', as: "h2", level: 4, text: this.selectedFile?.name }), h("swirl-text", { key: '8f326b417d910df16a4f1a52fbab370fe6395dd4', 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: 'dab0ffc87ea39523792b57792c52366b2b833954', slot: "app-bar-controls" }, this.selectedFile && (h("swirl-button", { key: 'dfe0b1d340396b89284400e136a1ad9d4d82346b', "hide-label": true, class: "info-button", icon: "<swirl-icon-info></swirl-icon-info>", label: "Open file info", onClick: this.toggleSidebar }))), h("swirl-box", { key: '1daa9d840d85bd642776154cc8453e2bb00722be', padding: "16", slot: "sidebar" }, h("swirl-text", { key: 'bbd87aac3134c3f5fc1bd3c33e88ca4677b8ab13', color: "subdued", weight: "medium" }, "File info goes here \u2026"))), h("swirl-popover", { key: 'dca8b1205b3cf95323e848248e6e53410e21c228', label: "Sort items", ref: (el) => (this.sortMenu = el) }, h("swirl-option-list", { key: 'd5af97d7f574b8705ece534a0aac980a246c8512', value: ["ascending"] }, h("swirl-option-list-item", { key: 'e15704993b056fbe2be03a01d20c0a8875b448bf', icon: "<swirl-icon-expand-less></swirl-icon-expand-less>", label: "Ascending", value: "ascending" }), h("swirl-option-list-item", { key: '0430c995c5d9ebea06c54991c551026e4d47a40b', icon: "<swirl-icon-expand-more></swirl-icon-expand-more>", label: "Descending", value: "descending" }), h("swirl-option-list-item", { key: 'ef7242962609ee2936f57f86eb1608d646acf62d', icon: "<swirl-icon-time-outlined></swirl-icon-time-outlined>", label: "By date", value: "date" })))));
     }
 };