@getflip/swirl-components 0.218.0 → 0.220.0

package/dist/cjs/swirl-table-row-group.cjs.entry.js

@@ -46,10 +46,10 @@ const SwirlTableRowGroup = class {
         const iconType = this.isVisible
             ? "<swirl-icon-expand-less></swirl-icon-expand-less"
             : "<swirl-icon-expand-more></swirl-icon-expand-more";
-        return (index.h(index.Host, { key: 'd0eedcf8530bd366528b9954cba946199f9610a3', class: "table-row-group", role: "rowgroup" }, index.h("div", { key: 'e1fc4d960c34379977d6fd5a66c703ac3271e40a', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (index.h("swirl-button", { key: '284e80dff1c428671670b990384bbbc348a84e9c', class: "table-row-group__collapse-icon", icon: iconType, label: this.collapseButtonLabel, onClick: this.toggleShowItems, swirlAriaExpanded: String(this.isVisible), variant: "plain", hideLabel: true })), index.h("span", { key: '9c8ebb602a37c7432033fe305b62b86bd2b96d07', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (index.h("span", { key: '040955daad2cca989b394cefa54d4e1a5bfcbb1f', class: "table-row-group__tooltip" }, index.h("swirl-tooltip", { key: '617ac0dbac4edc909ff0ec28ae942e1ebe05f004', content: this.tooltip, position: "top", positioning: "fixed" }, index.h("swirl-icon-info", { key: 'c0316c69bd26f14910a85b79c0cc5487d602e665', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), index.h("div", { key: 'b37c8459ddf05a51da9ccccf37b5223fdf5e4f48', class: {
+        return (index.h(index.Host, { key: 'c9c76317168135bc2e0fa0dc305a601bf9e7cbd5', class: "table-row-group", role: "rowgroup" }, index.h("div", { key: 'c78346a6f1dbcd31f9cf8a3558a357db25f233dd', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (index.h("swirl-button", { key: '88ad151804f1692d6a6eb331e7f742bb8dc63969', class: "table-row-group__collapse-icon", icon: iconType, label: this.collapseButtonLabel, onClick: this.toggleShowItems, swirlAriaExpanded: String(this.isVisible), variant: "plain", hideLabel: true })), index.h("span", { key: '95a8edc40feaef6e8977076bbdfd091a1c1272d5', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (index.h("span", { key: 'd154150265619bbe4c437895bfb934d30dc46f81', class: "table-row-group__tooltip" }, index.h("swirl-tooltip", { key: '375f0db58378835d52b8a24e1ddb3aa9df17c0b5', content: this.tooltip, position: "top", positioning: "fixed" }, index.h("swirl-icon-info", { key: '9ecbb6180099158162f2690c5b306154881b8a26', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), index.h("div", { key: 'd17ca86340d930d77534c70806639253ebc67fd9', 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) }, index.h("slot", { key: 'a0a79309071d0b9c99baf5eaf0f39aeef4e1f036' }))));
+            }, "aria-hidden": !this.isVisible, ref: (el) => (this.tableRowElements = el) }, index.h("slot", { key: '1e0fdb181cfc7944b2e83edfb61816c467092827' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-table-row.cjs.entry.js

@@ -23,7 +23,7 @@ const SwirlTableRow = class {
         const className = index$1.classnames("table-row", {
             "table-row--highlighted": this.highlighted,
         });
-        return (index.h(index.Host, { key: '16b2a29634b43de3a34703885e7c4ab4ee05a79c', "aria-rowindex": this.index, class: className, role: "row" }, index.h("slot", { key: 'a89843821f7088216ba4441fc11a56f82c597ce9' })));
+        return (index.h(index.Host, { key: 'e5c6e39eb13c7a2e509796bb1f302dedced2ce67', "aria-rowindex": this.index, class: className, role: "row" }, index.h("slot", { key: '7fa31604a72246bacb95695e3eceddf4454c0b97' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-table.cjs.entry.js

@@ -239,7 +239,7 @@ const SwirlTable = class {
         this.empty = !Boolean(rowsContainer) || rowsContainer.children.length === 0;
     }
     render() {
-        return (index.h(index.Host, { key: 'd01d5142d913b8291272b36c0c39736a1bd7ac85' }, index.h("div", { key: '98ad251876ba781d090f58d8cf712fd1258ddaba', class: "table" }, index.h("div", { key: '8532593a4e4400f0dfb1116ceca3938436522358', class: "table__container", onScroll: this.onScroll, ref: (el) => (this.container = el) }, index.h("div", { key: '5a65edf97a0b10e4ef92764504601a570f1172da', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index.h("swirl-visually-hidden", { key: '0c6f7f5eba4df50eb8f91a6f13c6fa47c3d7c2aa' }, index.h("div", { key: '7b98be7d972b4029c73180c64a2bfccb32e3bb69', id: "caption" }, this.caption))), index.h("div", { key: 'ea5808dfebb39b1719642dd376d8d24d2366c548', role: "rowgroup" }, index.h("div", { key: 'cdb7d4f93046ae459f67dc7ca916bf8c8344de5c', class: "table__header", role: "row" }, index.h("slot", { key: '73a9a6a85b872453bcc082c5a030b02d23b5ec1c', name: "columns", onSlotchange: this.onSlotChange }))), index.h("div", { key: '0bb9f1229220ff7cdb7550affa6fdf9929f5a32d', class: "table__body" }, index.h("slot", { key: '9fdf89db348726907acf7a8498dc577f088f97f6', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (index.h("div", { key: '1311f7fd88947a08d1e71ed763aa0d2f8107966b', class: "table__empty-row", role: "row" }, index.h("div", { key: '5bf6f316dfe1d7a8968d60df02f3a5b1d2d7cc8c', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index.h("swirl-text", { key: '2d8c28155009c616821257da3a38e3a7431be2ec', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (index.h(index.Host, { key: 'b1f0af240d936904b960103568f929bf31397849' }, index.h("div", { key: 'fb0f701b67023ddc52765cff52b00bce7def4530', class: "table" }, index.h("div", { key: '8c41225148c9f058d314ae973a2ef91740b1cc8a', class: "table__container", onScroll: this.onScroll, ref: (el) => (this.container = el) }, index.h("div", { key: '8c67633613bd3a36bbc17dd9f49c7c1d5b9182b3', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index.h("swirl-visually-hidden", { key: '912e38cda9e1c447f614f9df13bb2c4dc6980ece' }, index.h("div", { key: '67685bbcecd9f1fa67cd48a39ef3718f459dbbd1', id: "caption" }, this.caption))), index.h("div", { key: 'c80f770dcf7e35c36365be7210e85657a682ef64', role: "rowgroup" }, index.h("div", { key: 'a14a6e9de7cdb0c7f60b886f9f733b8e27b0153f', class: "table__header", role: "row" }, index.h("slot", { key: '8c3ac3bb558109ee791338599c0ac96d80f441b7', name: "columns", onSlotchange: this.onSlotChange }))), index.h("div", { key: 'b221e7f4e314dcf425a1058ea8f001756f27a1b7', class: "table__body" }, index.h("slot", { key: '116ffc8eaceade3c1a4d935ffc6ea0226279975e', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (index.h("div", { key: 'a1d8d4f25895637b3b888549014f7aa939a9750f', class: "table__empty-row", role: "row" }, index.h("div", { key: '3d870da3885ee4ef26075304f6700cb689469155', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index.h("swirl-text", { key: '04c093fbd33e17d2402872dc02e0321385987e31', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-tabs.cjs.entry.js

@@ -84,7 +84,7 @@ const SwirlTabs = class {
         }));
     }
     render() {
-        return (index.h(index.Host, { key: '6aaea63ab8ef86e4a76252b69f1dfb4d879b1014' }, index.h("div", { key: 'bccb1d01e4521fc32be3d2493a947dc14045448d', class: "tabs" }, index.h("swirl-tab-bar", { key: 'b14d6ea345cc100ab9bc5162689fd6f9d81b9f8b', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart })), index.h("slot", { key: '0d53a4b6b8b9217627f1dedf21cf320a06e14e08' })));
+        return (index.h(index.Host, { key: '2c4dd2275d9d440b18066378d741f586dd79c4d8' }, index.h("div", { key: '0608cceb83b6bcfae209d7ff43acdda26f90ab9a', class: "tabs" }, index.h("swirl-tab-bar", { key: '93a7744ace0c0ba668b33f9ce783dd911db6ab00', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart })), index.h("slot", { key: 'ecf54ed3dfe0d4254137b7d4aa30d394edebee10' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/swirl-theme-provider.cjs.entry.js

@@ -156,7 +156,7 @@ const SwirlThemeProvider = class {
         this.setDesignTokens = [];
     }
     render() {
-        return (index.h(index.Host, { key: '9c82d8e55c791bfeae52b4372b61e54cd70a520c' }, index.h("slot", { key: '0d865519ef09e11c4a823212dc9982a10b5186b8' })));
+        return (index.h(index.Host, { key: '99539048460500a00938bb62b50e4f1b2af1012b' }, index.h("slot", { key: '21fff27b44f8a605a35f4bd8c041eb2e9cfa8915' })));
     }
     static get watchers() { return {
         "config": ["watchConfig"]

package/dist/cjs/swirl-time-input.cjs.entry.js

@@ -129,7 +129,7 @@ const SwirlTimeInput = class {
         const className = index$1.classnames("time-input", {
             "time-input--inline": this.inline,
         });
-        return (index.h(index.Host, { key: '9c074dc52719b09275f7dcf9486f459b3f8e51f7' }, index.h("div", { key: 'd2d0b1cf7863a8bc80f19379e4ee2ece4f6caf45', class: className }, index.h("input", { key: 'f08cabd38fba7de32ac2648872f2b83f09fe341c', "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 }), index.h("span", { key: 'bbb7cf593cfc74e799c84fa4758904ba5fdca283', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: '61db5641fedcae4f77c8f558f0118510f0f40de2', size: this.iconSize })))));
+        return (index.h(index.Host, { key: '2dd32785162c8ca3305e36f0343ef418b43eb0e0' }, index.h("div", { key: '27779840821f8c8d83df2cdb090ba8c0f1bb6aa3', class: className }, index.h("input", { key: '756b2f4de4c3c7c797d0bc273045797602483450', "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 }), index.h("span", { key: 'a302643673cd12503a7f0eb8222044bbc1e727e1', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: '25f458d861513fc34b51fef0bd8556853bb0b4a5', size: this.iconSize })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/swirl-tooltip.cjs.entry.js

@@ -6,7 +6,7 @@ const index = require('./index-6aba64ed.js');
 const floatingUi_dom_esm = require('./floating-ui.dom.esm-3e7933b7.js');
 const index$1 = require('./index-9f94303c.js');
 
-const swirlTooltipCss = ":host{display:contents;font-weight:var(--s-font-weight-normal)}:host *{box-sizing:border-box}.tooltip{display:contents}.tooltip--visible .tooltip__popper{animation:tooltip-fade-in 0.15s;animation-delay:0.1s;animation-fill-mode:forwards;opacity:0}.tooltip--actual-placement-top .tooltip__arrow{top:calc(100% - 0.0625rem);transform:translate3d(0, -50%, 0) rotate(45deg)}.tooltip--actual-placement-bottom .tooltip__arrow{bottom:calc(100% - 0.0625rem);transform:translate3d(0, 50%, 0) rotate(45deg)}.tooltip--actual-placement-left .tooltip__arrow{left:calc(100% - 0.0625rem);transform:translate3d(-50%, 0, 0) rotate(45deg)}.tooltip--actual-placement-right .tooltip__arrow{right:calc(100% - 0.0625rem);transform:translate3d(50%, 0, 0) rotate(45deg)}.tooltip .tooltip__reference{display:contents}.tooltip__popper{position:absolute;z-index:var(--s-z-40);max-width:17.5rem;opacity:0}.tooltip__bubble{position:relative;display:block;padding-top:var(--s-space-8);padding-right:var(--s-space-12);padding-bottom:calc(var(--s-space-8) + 0.0625rem);padding-left:var(--s-space-12);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);line-height:var(--s-line-height-base);box-shadow:var(--s-shadow-level-2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.tooltip__bubble{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.tooltip__content{white-space:normal}.tooltip__arrow{position:absolute;width:0.6875rem;height:0.6875rem;border-radius:0.125rem;background-color:var(--s-surface-neutral-default)}@keyframes tooltip-fade-in{from{opacity:0}to{opacity:1}}";
+const swirlTooltipCss = ":host{display:contents;font-weight:var(--s-font-weight-normal)}:host *{box-sizing:border-box}.tooltip{display:contents}.tooltip--active .tooltip__popper{display:block}.tooltip--visible .tooltip__popper{animation:tooltip-fade-in 0.15s;animation-delay:0.1s;animation-fill-mode:forwards;opacity:0}.tooltip--actual-placement-top .tooltip__arrow{top:calc(100% - 0.0625rem);transform:translate3d(0, -50%, 0) rotate(45deg)}.tooltip--actual-placement-bottom .tooltip__arrow{bottom:calc(100% - 0.0625rem);transform:translate3d(0, 50%, 0) rotate(45deg)}.tooltip--actual-placement-left .tooltip__arrow{left:calc(100% - 0.0625rem);transform:translate3d(-50%, 0, 0) rotate(45deg)}.tooltip--actual-placement-right .tooltip__arrow{right:calc(100% - 0.0625rem);transform:translate3d(50%, 0, 0) rotate(45deg)}.tooltip .tooltip__reference{display:contents}.tooltip__popper{position:absolute;z-index:var(--s-z-40);display:none;max-width:17.5rem;opacity:0}.tooltip__bubble{position:relative;display:block;padding-top:var(--s-space-8);padding-right:var(--s-space-12);padding-bottom:calc(var(--s-space-8) + 0.0625rem);padding-left:var(--s-space-12);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);line-height:var(--s-line-height-base);box-shadow:var(--s-shadow-level-2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.tooltip__bubble{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.tooltip__content{white-space:normal}.tooltip__arrow{position:absolute;width:0.6875rem;height:0.6875rem;border-radius:0.125rem;background-color:var(--s-surface-neutral-default)}@keyframes tooltip-fade-in{from{opacity:0}to{opacity:1}}";
 const SwirlTooltipStyle0 = swirlTooltipCss;
 
 const SwirlTooltip = class {
@@ -72,6 +72,7 @@ const SwirlTooltip = class {
                 strategy: this.positioning,
             };
         };
+        this.active = true;
         this.content = undefined;
         this.delay = 300;
         this.position = "top";
@@ -103,9 +104,10 @@ const SwirlTooltip = class {
     }
     render() {
         const className = index$1.classnames("tooltip", `tooltip--actual-placement-${this.actualPosition?.placement}`, {
+            "tooltip--active": this.active,
             "tooltip--visible": this.visible,
         });
-        return (index.h(index.Host, { key: 'c1cbf222e6f4df7ff1a1b1dcc4d878a41f3f4f40', onKeydown: this.onKeydown }, index.h("span", { key: '6819d99e6c7d0187bf831c570a8df04c48ae6fee', class: className }, index.h("span", { key: 'b4a1ca8b5ce716e9f7a28a5b49dafcc04fb89dbc', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: 'c4cbfc908cf866d1ddbceeca6670fb126f0b08cb' })), index.h("span", { key: 'a1dcd95b72a588c8728e831c3ab1f3e75e70e2d9', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
+        return (index.h(index.Host, { key: '99ad402b746b639c8625e0eb646d63f560da425a', onKeydown: this.onKeydown }, index.h("span", { key: '8c73e42b58c5ecb2372155655e336747d3d1be3f', class: className }, index.h("span", { key: '8418e9e1420652c64870f4835dac07534bdaa9f8', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: 'af395df4de2aa8ee7f6e90569a182ad4411adb88' })), index.h("span", { key: '7938378663f0ea549f3efd86fe53f172145c2d22', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
                 top: Boolean(this.actualPosition)
                     ? `${this.actualPosition?.y}px`
                     : "",
@@ -113,7 +115,7 @@ const SwirlTooltip = class {
                     ? `${this.actualPosition?.x}px`
                     : "",
                 position: this.positioning,
-            } }, this.visible && (index.h("span", { key: '82f02a2b298d9562011c97f604f4933e1690ecee', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: '603c4625cca8bb6330d404c35c0162fd63fd19a4', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: '760c5a9a193ecacc4cbc7de6c8051ba9a8b8f086', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
+            } }, this.visible && (index.h("span", { key: '12093168c063c684c014307d518c99e2f7de4bf4', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: '595c7b15b58551854cf2c8909249430349066aed', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: '89c75e9d5070c7ec9f149d4eacf576c5a51f387e', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
                 ...this.arrowStyles,
                 visibility: this.visible ? "visible" : "hidden",
             } })))));

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

@@ -24,7 +24,7 @@ const SwirlTreeNavigationItem = class {
             "tree-navigation-item--active": this.active,
             "tree-navigation-item--has-icon": Boolean(this.icon),
         });
-        return (index.h(index.Host, { key: 'ce72f757f6b7f852fe0db041a3a7cc3986360a42' }, index.h(Tag, { key: '60067bb6045b0faa8d3a04c6d263abbdb8d7d957', class: className, href: this.href, target: this.target, type: isLink ? undefined : "button" }, this.icon && (index.h("span", { key: '038c495fd16a2a73d982ad4a62ce54e89b1b29af', class: "tree-navigation-item__icon", innerHTML: this.icon })), index.h("span", { key: 'c96bbabfd94289dc85d0dd5e95ee9b2b39a8cb09', class: "tree-navigation-item__label" }, this.label))));
+        return (index.h(index.Host, { key: '4e317fcc351a001f54a3dd5aa6e837d5cc0cc434' }, index.h(Tag, { key: '092460e31d1022a7fc9be8bd47b491d9bfe395d5', class: className, href: this.href, target: this.target, type: isLink ? undefined : "button" }, this.icon && (index.h("span", { key: 'e20aa8b1c861f7d5240c70a8bd7ef50d60a805b4', class: "tree-navigation-item__icon", innerHTML: this.icon })), index.h("span", { key: '19809418e9914423f2c46474575c3c53789083af', class: "tree-navigation-item__label" }, this.label))));
     }
     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: 'eef575c4ee1ffd605c7c9029a9871b1042a89520' }, index.h("button", { key: '72a430f135cce621487b125fa753f40953c879ac', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: '1be4e9b6f97596955578ec96d10a0b503a73f469', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: '2e8e3e811f97bbb0ffd5eda6f6d730f1a1c3e28a', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: '9090e88326abe7c50f40b0d87064036f72172fa1' }, this.durationLabel), this.duration)), index.h("svg", { key: '2f6eb330c35308e97a045ea552f3d9510f87f5de', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '28348280637d0234dd92f8c03d2864e8150eb70a', 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: 'fe8d9a2eddd97446706f448bfb17c5470da12e2f' }, index.h("button", { key: '39284147198859363260fce3017f29151dc074ab', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: '3f30903daaf88760f632fea542c013c0feba3a37', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: 'bf3a9b204b470f53e83c124c9a33024068fa0e89', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: 'd17d5cf6b686c49c890a4a4ab20cefd48db2f9ef' }, this.durationLabel), this.duration)), index.h("svg", { key: 'fd4acf317e9f2a8e1a1bc4c3be7d502cb1f7f528', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'a34fcef9bb9078d34473f6e5c574e76038bf64fd', 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: 'd3ed1fe23d6437f9c8b1d35955d0011c1e96ca58' }, index.h("slot", { key: '1a071b54990853b4dab9ec371d2244f9d5067c8e' })));
+        return (index.h(index.Host, { key: 'ddcade8292390aa8638cafe0ff6a864f0a610a90' }, index.h("slot", { key: '1c30d08b885899adcdccca60cca9c6398098e072' })));
     }
 };
 SwirlVisuallyHidden.style = SwirlVisuallyHiddenStyle0;