@getflip/swirl-components 0.375.0 → 0.376.0

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"; }