@getflip/swirl-components 0.267.0 → 0.268.0

package/dist/cjs/swirl-toggle-button.cjs.entry.js

@@ -22,7 +22,7 @@ const SwirlToggleButton = class {
         const classNames = index$1.classnames("button", {
             "button--pressed": this.isPressed,
         });
-        return (index.h("button", { key: 'e4b8d08845c0c1987ee12f6b8c68c154f1abef63', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, index.h("span", { key: 'f1fc7b8bfaec51f6cf870e60f807235fe4542935', class: "button__label" }, this.label)));
+        return (index.h("button", { key: '112d6672a5cd6ec7ccdca41b9db152332b996d84', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, index.h("span", { key: '81becb308083342853c6182d0eb95d1735b21629', class: "button__label" }, this.label)));
     }
 };
 SwirlToggleButton.style = SwirlToggleButtonStyle0;

package/dist/cjs/swirl-toggle-group.cjs.entry.js

@@ -61,7 +61,7 @@ const SwirlToggleGroup = class {
         });
     }
     render() {
-        return (index.h("swirl-stack", { key: '39cb88c126872e07430aad3fd2257db2b06bf6a2', class: "toggle-group", spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: 'c2361ea04a7267267180e556faf2ded5bd8eccbf', onSlotchange: this.onSlotChange })));
+        return (index.h("swirl-stack", { key: '93ae55ea71fe4553daf266c997a0fb7cf4cbc83e', class: "toggle-group", spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: '56a7c7912fbf884857ce958874806f37475c357e', onSlotchange: this.onSlotChange })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-tree-navigation-item.cjs.entry.js

@@ -99,12 +99,12 @@ const SwirlTreeNavigationItem = class {
             "tree-navigation-item__link--active": this.active,
             "tree-navigation-item__link--has-icon": Boolean(this.icon),
         });
-        return (index.h(index.Host, { key: 'cf726832cb0a6d48b9872041ea741bf7ae50a2fc', role: "none" }, index.h("li", { key: '07541c3b63cc1ec66ce957e56bf34e5db34e7b08', class: {
+        return (index.h(index.Host, { key: '9d1e3c508514cfc13348b8b080f8f37843c773ef', role: "none" }, index.h("li", { key: '7723964ef7c26f059e46aa92a9048c93e3e8b4f5', class: {
                 "tree-navigation-item": true,
                 "tree-navigation-item--expanded": this.expanded,
-            }, role: "treeitem", "aria-expanded": this.hasChildren ? this.expanded : undefined, "aria-level": this.level }, index.h(Tag, { key: '50ce666548e13a80b290c4a15aac3ae5a87ed45e', 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 }, index.h("span", { key: '7b10d71ee084a647ed4ad3bc984006feff5c0693', class: "tree-navigation-item__content" }, this.icon && (index.h("swirl-icon", { key: '48c30ce22e79c8712f72641fa413a432110645f6', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), index.h("span", { key: 'e019e05cfa3dc0b44be48c54ea6cdadd80fe1bda', class: "tree-navigation-item__label" }, index.h("span", { key: '6cdf08bcc2935bebaa0d738a2b2ddc293910e1f0', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (index.h("span", { key: '4406a1468fa08f855618633666e81f411e8de85a', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, index.h("swirl-icon-chevron-right", { key: 'c0c9c1a74ffe35939e092420e005dbc6f9197435', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (index.h("span", { key: 'fa517b61c96454cc57fa317818f46bd5ea550a9a', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, index.h("swirl-icon-open-in-new", { key: 'f9add0b5570730032a4667a2ef999a22402ae5cf', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (index.h("ul", { key: 'bf70346d91410d6fafc43c8d08072948c9b5315d', 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 }, index.h(Tag, { key: '1fd93515545b71ed3bcc8fdb2bebb792f3608243', 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 }, index.h("span", { key: '42140fd75dfd12419045ce46fc90d14ac7791cb2', class: "tree-navigation-item__content" }, this.icon && (index.h("swirl-icon", { key: 'd0cb10d1dbc8bead0abb433d1a2216520692fa03', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), index.h("span", { key: '9ec8006c02507d1f3e6f8f916542785cb82b4b83', class: "tree-navigation-item__label" }, index.h("span", { key: '108a9bb3266474e7a8cbe030195640e954339da7', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (index.h("span", { key: '5a1246ebd23518fbf4ce82931c299ec75dc2c549', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, index.h("swirl-icon-chevron-right", { key: '24a44c9fa94f629ad3b93c349682609aa4b93747', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (index.h("span", { key: 'b8090cecae66e21435344886a16083503bb63b2c', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, index.h("swirl-icon-open-in-new", { key: '8af6d8ff2b003cba94998ea6fec1ed317d98ec12', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (index.h("ul", { key: '780489849aef7915dda58f419bf78b23e8f2aa86', class: "tree-navigation-item__children", id: this.childrenId, role: "group", "aria-label": `${this.label} submenu`, ref: (el) => (this.childrenRef = el), style: {
                 height: this.childrenHeight,
-            } }, index.h("slot", { key: '6687d02d82e60acbd3761efbaa82e57643985e6b' }))))));
+            } }, index.h("slot", { key: 'a533582ba1c29d845993b8d45765de5593229bc4' }))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-tree-navigation.cjs.entry.js

@@ -13,7 +13,7 @@ const SwirlTreeNavigation = class {
         this.label = undefined;
     }
     render() {
-        return (index.h(index.Host, { key: 'd8601a6aed64a36011c2dcdb720d6a92666d4e8b' }, index.h("ul", { key: '0a07e4abce94a9c21f5f1f9aa25a7937708b7283', "aria-label": this.label, class: "tree-navigation", role: "tree" }, index.h("slot", { key: '84b1ac669e25c634d78e78d7556f9f2abdcb3032' }))));
+        return (index.h(index.Host, { key: '1b514b22d0e829bd080b9f5961edfb8fdc79fc0c' }, index.h("ul", { key: 'b9cc66ea88680ad23d42f1c13910f57b62c58bf2', "aria-label": this.label, class: "tree-navigation", role: "tree" }, index.h("slot", { key: '0ca2b6f861223124bc46a0c196a2d7e5623ba1fe' }))));
     }
 };
 SwirlTreeNavigation.style = SwirlTreeNavigationStyle0;

package/dist/cjs/swirl-tree-view-item.cjs.entry.js

@@ -81,11 +81,11 @@ const SwirlTreeViewItem = class {
             "tree-view-item--has-tags": hasTags,
         });
         const hasChildren = Boolean(this.el.querySelector("swirl-tree-view-item"));
-        return (index.h(index.Host, { key: 'b8e2c6a92fb374acd8942726bf97823505604243', id: this.itemId, role: "none" }, index.h("li", { key: 'a6ec359ca8dfe1a45a185a0702bf49a6b728980c', class: className, role: "none" }, index.h("a", { key: '72311df072dc341d3c355d837cf7c9630bf59286', "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 (index.h(index.Host, { key: '8df1f9d21e407612e986bfeccee08274d797ca0f', id: this.itemId, role: "none" }, index.h("li", { key: 'f8df69a9a44a3a93d2ec30aa9f65599d387369b3', class: className, role: "none" }, index.h("a", { key: 'ded8a38e932a12b405be8206acc78d4cfa75da28', "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 && (index.h("span", { key: '9102d8b203e05e94d0958bc2ff932124ebcd262e', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: 'fb3ab557847ef9d8a7fb4e1659b9ec82cee35fbc' }, this.expanded ? (index.h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (index.h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (index.h(index.Fragment, { key: '96df692d43c0ec3ba6b89b3f975ac4bd14087e1e' }, index.h("span", { key: '6690cff6688711290f84763e305d41f4e8dcbd0c', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: '9b6a226d4a7668e53a211fbafa652e0233206bee', class: "tree-view-item__label" }, this.label), index.h("span", { key: '920ac7a2386b40d040603537cde22323ff72a1dd', class: "tree-view-item__tags" }, index.h("slot", { key: '43b6674aa96e1b9fb44135486b590e67b052129a', name: "tags" }))), index.h("ul", { key: 'd38101fa037d0b863e0a9b943b6deb4e07402f00', "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 && (index.h("span", { key: '84799516e4b3c76ae40db5c33c19b3a2a5a54391', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: '965efc17557697de252408b515d0b893c0eb1cdf' }, this.expanded ? (index.h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (index.h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (index.h(index.Fragment, { key: '93e51e3c24ab4352e858ac4f687b262d229913af' }, index.h("span", { key: '88771dfbf970fb368709dc395064eb44d7a05b43', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: '7af77572bd5c936501c76538e1973099fb4ff886', class: "tree-view-item__label" }, this.label), index.h("span", { key: 'c1e3c76430e50e2bc9d80be2fc7364bbeb429d1a', class: "tree-view-item__tags" }, index.h("slot", { key: '7357803ce470d4ed6d6f78f883a4020fe062fe22', name: "tags" }))), index.h("ul", { key: '2c1d33348129ea81ae0f7d4f460d77061ab4388e', "aria-label": this.label, class: "tree-view-item__children", id: `${this.itemId}-children`, role: "group", style: {
                 display: !this.expanded || !hasChildren ? "none" : undefined,
-            } }, index.h("slot", { key: 'a9ecf846cdeaa662dc24b59870da9557cc39f15c' })))));
+            } }, index.h("slot", { key: 'b21654a00709f3e784ccfb970743483670277997' })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-tree-view.cjs.entry.js

@@ -199,7 +199,7 @@ const SwirlTreeView = class {
         return nestedSibling ?? undefined;
     }
     render() {
-        return (index.h(index.Host, { key: 'e1353d99168e7c7e6b5b66a6973996bfbd4c51a9' }, index.h("ul", { key: 'd1f0d799218817fad7f0bc87108cf16a3b123782', "aria-label": this.label, class: "tree-view", role: "tree" }, index.h("slot", { key: '83d1b8bfc2f4013788749363f5421321d21e607f', onSlotchange: this.onSlotChange }))));
+        return (index.h(index.Host, { key: '9a74415f413554f47ddd5e1da78d3f7774c23145' }, index.h("ul", { key: '04535789e4f12c640b24d882a7e85ee87e0ad4ba', "aria-label": this.label, class: "tree-view", role: "tree" }, index.h("slot", { key: 'ffceb96a6ebf9a524b54843ee7ac433312546c2d', onSlotchange: this.onSlotChange }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-video-thumbnail.cjs.entry.js

@@ -16,7 +16,7 @@ const SwirlVideoThumbnail = class {
         this.src = undefined;
     }
     render() {
-        return (index.h(index.Host, { key: 'd8351ae7c2d885a612251c0915fb60a62f2f5ca7' }, index.h("button", { key: 'b8d166f56e3861bc778f634295993dd7199a3565', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: '303ebde2d6c1732274c2a3769af6aa12ca68bc53', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: '2414d916f68ad2be818084ba7a7e38ce108a24a9', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: 'c64c3da49ac5720b0a1b23afa6252642dd9f7be3' }, this.durationLabel), this.duration)), index.h("svg", { key: '46fa1742445698ed1f34c789195c5f0dbecdd4b6', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '60045c2059310c3737741bdd3df0f97fa74f7671', 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 (index.h(index.Host, { key: 'c826282d9807680c69b886912b849c6b73ec7fdb' }, index.h("button", { key: '93ffbe4624fe5b94c1bb95cd26d48a1b217d2119', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: 'e441130993184542b5b17e9662f4bfac65a18b69', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: 'd8e0333465f4bbd5260ff94e938dd9fbdabeb6e7', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: '9058d0e5e7f60da21519a0cae5d7541ebc71aede' }, this.durationLabel), this.duration)), index.h("svg", { key: '5d2a4238047f67396e3ec3996d400b71ce985966', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '97e859064f6a812381681492cd105adce482eaad', 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" })))));
     }
 };
 SwirlVideoThumbnail.style = SwirlVideoThumbnailStyle0;

package/dist/cjs/swirl-visually-hidden.cjs.entry.js

@@ -12,7 +12,7 @@ const SwirlVisuallyHidden = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: 'e4436e78fb4f140ae2830badd6c08e691ea90eee' }, index.h("slot", { key: '2400dcfb2132a1b205d6d84cfdfc8aa7204b9036' })));
+        return (index.h(index.Host, { key: 'c9d2040dd71e149e57a293f92883bf951560a211' }, index.h("slot", { key: 'ed4e637b8de6e1a18ed62e37687f1c68d136d5be' })));
     }
 };
 SwirlVisuallyHidden.style = SwirlVisuallyHiddenStyle0;