@getflip/swirl-components 0.317.2 → 0.319.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: 'f0d5694e1e059ab965fdc7e2b607e261532d703f', class: "table-row-group", role: "rowgroup" }, index.h("div", { key: '800048ad7fd655fc5af4c8191f3360e8851b509b', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (index.h("swirl-button", { key: '61b3e0a0a38981c24e98fb01fbf9c49e043d1fc9', 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: 'b79e1f65a0f314a9a8760267ac34ed7baf9bdce4', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (index.h("span", { key: '52f88965859eaae0b66e9a5c21d14bb867b060e3', class: "table-row-group__tooltip" }, index.h("swirl-tooltip", { key: '314652318532ec760a11342c11852a5691fe51f1', content: this.tooltip, position: "top", positioning: "fixed" }, index.h("swirl-icon-info", { key: '9313d6970e318278416c186a28aaa042b59fa47b', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), index.h("div", { key: '591c668040232242ed66e0a7df51ac0af0bccdf4', class: {
+        return (index.h(index.Host, { key: '2a2e7fe67b8507f5696bc6ca918f1466ebdc95f3', class: "table-row-group", role: "rowgroup" }, index.h("div", { key: '0cfa308378587ce771395ccab24b5e6b9492694c', class: "table-row-group__header-row", role: "row", ref: (el) => (this.headerRowElement = el) }, this.collapsible && (index.h("swirl-button", { key: 'e500805e29d933703093592bcff1184c009a6ba7', 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: '6b52d7eca0994b81674eb9d170a89b3b659f035e', "aria-rowspan": rowspan, class: "table-row-group__label", role: "rowheader" }, this.label, this.tooltip && (index.h("span", { key: 'c92d8cededeafd7b6f36337cbc2008fcbe0feae0', class: "table-row-group__tooltip" }, index.h("swirl-tooltip", { key: 'e02266c290332122247be89789a78a4660a905ea', content: this.tooltip, position: "top", positioning: "fixed" }, index.h("swirl-icon-info", { key: '881a1e47888d6e83649e493455de9647999a43f6', size: 16, tabIndex: 0, class: "table-row-group__tooltip-icon" })))))), index.h("div", { key: 'c54b4037c5083a8b245304f88c68855eb0402c5d', 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: '28bc94871656b92d5c762790cbfe0d8d64632021' }))));
+            }, "aria-hidden": !this.isVisible, ref: (el) => (this.tableRowElements = el) }, index.h("slot", { key: '79fae27eaa8351ed46252f43e63d85af04390ccc' }))));
     }
     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: 'fed4dbe7f08a3fb88b02d50c1d4acdb52d5fd8cb', "aria-rowindex": this.index, class: className, role: "row" }, index.h("slot", { key: '4171a5037cf322c570d0876a563ebe50c51968e5' })));
+        return (index.h(index.Host, { key: '5b5b4bce99c377bc03e9f4a4f6041f2f83f9645a', "aria-rowindex": this.index, class: className, role: "row" }, index.h("slot", { key: '9e9fb42ae9a05451dbd2c6d57e930efb691fb91c' })));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -540,7 +540,7 @@ const SwirlTable = class {
         const className = index$1.classnames("table", {
             "table--keyboard-move": this.movingViaKeyboard,
         });
-        return (index.h(index.Host, { key: '70d70f2fe5172ab3c87d5b39eeefd249ceacf17c' }, index.h("div", { key: 'd79df4da4e63b1963ccff990da89522512126261', class: className }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: 'b6abbae3e118be1fdaab0edeecb1f2814d572b9c' }, index.h("span", { key: '673361ae4cbebc86b4520ca46f65a916d3838303', "aria-live": "assertive" }, this.liveRegionText))), index.h("div", { key: 'b2a9065e354213fe8259e180f6f2540399da2300', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, index.h("div", { key: 'b4f81a07737c4fe428c3fc57abcdfe5618dc1ca3', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index.h("swirl-visually-hidden", { key: 'ba17478ca94bde5ba8cdf244f8b872a3dbaa2ab5' }, index.h("div", { key: '47e0bd31477cc5e7c64337c28690f3386ae85e72', id: "caption" }, this.caption))), index.h("div", { key: '3e455dda45297918b78d0c254bc230704fd2db9a', role: "rowgroup" }, index.h("div", { key: '3db95acac7ea49a44acc604c4263bb07080e785f', class: "table__header", role: "row" }, index.h("slot", { key: '029ce35ec20332fec73daaa40787885f42482a41', name: "columns", onSlotchange: this.onSlotChange }))), index.h("div", { key: '1219cffdd1f457be32ee043deaa880cc527c130d', class: "table__body", ref: (el) => (this.bodyEl = el) }, index.h("slot", { key: '7c66a9eda64a555963f210b1b406c74f2b35d9f0', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (index.h("div", { key: '342aac36b4c2d751b5e236880da1d1aff33f091c', class: "table__empty-row", role: "row" }, index.h("div", { key: '9a35950c09440c4375061740f21a5c20a55abf7f', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index.h("swirl-text", { key: '625d8f81e7a1d02dbfff5ac1da6d055aff8a9292', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (index.h(index.Host, { key: '06e4c1b14c85f8087eff6c4c17b57b4151d2da27' }, index.h("div", { key: '0fa9a677c268ebb92b3d7becf1f53b52b0a4ff33', class: className }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: 'ec7fa3d2a112dd55c5a051105625f2b25a2afee9' }, index.h("span", { key: '3a320a8fa201510cc12496ef083c2141c68ae3f6', "aria-live": "assertive" }, this.liveRegionText))), index.h("div", { key: 'af6ae8d224182cdd082932fd881fe0e795d0f973', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, index.h("div", { key: '4228435aadc21ce48de348c8d7bd48e808105124', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index.h("swirl-visually-hidden", { key: 'be36a39145637066fd362d07f27a3886d896159b' }, index.h("div", { key: 'e580026d98bcd20aeeb9316c5a264186184f6a40', id: "caption" }, this.caption))), index.h("div", { key: '699109dccaf98aadb7f0279c5f0964ab38a1c05f', role: "rowgroup" }, index.h("div", { key: 'b981c5a0ead32416480a1ecc0e77fa097ccd81f0', class: "table__header", role: "row" }, index.h("slot", { key: '0a2f315e8ffca378e6597fa9a168d18277e3bbc8', name: "columns", onSlotchange: this.onSlotChange }))), index.h("div", { key: '89461021eb6ed43feadd275d62dfd5fcc1c009db', class: "table__body", ref: (el) => (this.bodyEl = el) }, index.h("slot", { key: '9a4103790373c423fca54fc8f101b0e9818cc211', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (index.h("div", { key: '1de4404351aaed5527d6e622673071fcdca81736', class: "table__empty-row", role: "row" }, index.h("div", { key: '8f6e316b6a22c2c81f2ef4cfa804e3c8cfb3ee48', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index.h("swirl-text", { key: '402ff27d0e0f7b8c773470b160a1e82fb7246d38', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -88,7 +88,7 @@ const SwirlTabs = class {
         }));
     }
     render() {
-        return (index.h(index.Host, { key: 'e1bc3e52f4edb01ea96e401d7ed59de539944f88' }, index.h("div", { key: '982efb444b10fde86e161c83ae93259ea5488e90', class: "tabs" }, index.h("swirl-tab-bar", { key: '1040f2c4c1b9b95d9523a3712d9dfe24fcb26436', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingBlockEnd: this.tabBarPaddingBlockEnd, paddingBlockStart: this.tabBarPaddingBlockStart, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart, variant: this.tabBarVariant })), index.h("slot", { key: '434360730ce3b4f1df6f6c95b253a6e757ecd7e0' })));
+        return (index.h(index.Host, { key: 'cdf2b0f3aaf046adda389c6f7ebecac192998891' }, index.h("div", { key: '6c19b1a65dc2b1b3af976b17edc3ddebbb8ab3d9', class: "tabs" }, index.h("swirl-tab-bar", { key: 'b6e1cb8885a0074a1eb00d31d29df3d8ad49639c', label: this.label, onActivateNextTab: this.onActivateNextTab, onActivatePreviousTab: this.onActivatePreviousTab, onActivateTab: this.onActivateTab, tabs: this.tabBarTabs, justify: this.justifyTabBar, paddingBlockEnd: this.tabBarPaddingBlockEnd, paddingBlockStart: this.tabBarPaddingBlockStart, paddingInlineEnd: this.tabBarPaddingInlineEnd, paddingInlineStart: this.tabBarPaddingInlineStart, variant: this.tabBarVariant })), index.h("slot", { key: '37f1a0abbf1db3a4dfb07275ce5a164399b16571' })));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -92,6 +92,7 @@ const SwirlTextInput = class {
         this.max = undefined;
         this.min = undefined;
         this.mode = undefined;
+        this.inputName = undefined;
         this.passwordToggleLabel = "Toggle password display";
         this.placeholder = undefined;
         this.prefixLabel = undefined;
@@ -189,7 +190,7 @@ const SwirlTextInput = class {
             "text-input--inline": this.inline,
             "text-input--show-password": this.type === "password" && this.showPassword,
         });
-        return (index.h(index.Host, { key: 'e57f2ddeb2239ceffd449efacbc6bddf17777e2c' }, index.h("div", { key: '62eb95ad562fe4cbe7fd56cc9ac0b8d07b97afdf', class: className }, this.prefixLabel && (index.h("span", { key: 'c7d38898067ec7fdd924167e037323bacef742e3', class: "text-input__prefix" }, this.prefixLabel)), index.h(Tag, { key: 'ea0fff8fe61f6323d39dea8490fb722587e58080', "aria-autocomplete": this.swirlAriaAutocomplete, "aria-controls": this.swirlAriaControls, "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-expanded": this.swirlAriaExpanded, "aria-invalid": ariaInvalid, autoComplete: this.autoComplete, autoFocus: this.autoFocus, class: "text-input__input", disabled: this.disabled, inputMode: this.mode, maxLength: this.maxLength, max: this.type === "number" ? this.max : undefined, min: this.type === "number" ? this.min : undefined, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, onKeyPress: this.onKeyPress, placeholder: !Boolean(this.suffixLabel) ? this.placeholder : undefined, ref: (el) => (this.inputEl = el), required: this.required, role: this.swirlRole, rows: this.rows > 1 ? this.rows : this.autoGrow ? 1 : undefined, spellcheck: this.spellCheck, step: this.type === "number" ? this.step : undefined, type: type, value: this.value }, this.rows > 1 && this.value), this.suffixLabel && (index.h("span", { key: '2ae0f456126a27f0256b5dfd851da830ea379018', class: "text-input__suffix" }, this.suffixLabel)), showClearButton && (index.h("button", { key: 'ea47c05178f0ce61188ca8ed15f3bbe6f132b1dc', "aria-label": this.clearButtonLabel, class: "text-input__clear-button", onClick: this.clear, part: "text-input__clear-button", type: "button" }, index.h("swirl-icon-cancel", { key: 'd419f462f82b28bc6c8602f3d4cf65d2649d0234', size: this.iconSize }))), showPasswordToggle && (index.h("button", { key: '565f3c92ef3fd90d1d43c673b94feec9bcf213cf', "aria-label": this.passwordToggleLabel, class: "text-input__password-toggle", onClick: this.togglePassword, type: "button" }, this.showPassword ? (index.h("swirl-icon-visibility-off", { size: this.iconSize })) : (index.h("swirl-icon-visibility", { size: this.iconSize })))), showStepper && (index.h("span", { key: 'ec02752a5258a06827fc156fd4b4cd5a0e712751', class: "text-input__stepper" }, index.h("button", { key: 'c698d2fda7bf64b338920410ef0c894955cf6372', "aria-hidden": "true", class: "text-input__step-button", onClick: this.increaseValue, tabIndex: -1, type: "button" }, index.h("swirl-icon-expand-less", { key: '0f662dd62d1a315d288622a31e4f0dfb0ee530e0', size: this.iconSize })), index.h("button", { key: '49fc4ece3d4b67e3b6fa38ecdb681edf5e2e0791', "aria-hidden": "true", class: "text-input__step-button", onClick: this.decreaseValue, tabIndex: -1, type: "button" }, index.h("swirl-icon-expand-more", { key: '49de410032a3f513ba78e7f6a986645441db80eb', size: this.iconSize })))), this.showCharacterCounter && (index.h("span", { key: 'c2e4a3b9e5dc0c1eb4ef0ee686a7dd2cd2c1a6d7', class: "text-input__character-counter" }, this.value?.length || 0, " ", Boolean(this.maxLength) ? `/ ${this.maxLength}` : "")))));
+        return (index.h(index.Host, { key: '3edc8d70a80cf16de6465fd52d9d7edf983b460a' }, index.h("div", { key: 'ba5fe8eac53b507395100b6333dc9ea803aad5ba', class: className }, this.prefixLabel && (index.h("span", { key: '66482b8599b93da4b4169d6b88583231d2c62b86', class: "text-input__prefix" }, this.prefixLabel)), index.h(Tag, { key: '83d0ab76defde133a45e52819b3057c99c583dd8', "aria-autocomplete": this.swirlAriaAutocomplete, "aria-controls": this.swirlAriaControls, "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-expanded": this.swirlAriaExpanded, "aria-invalid": ariaInvalid, autoComplete: this.autoComplete, autoFocus: this.autoFocus, class: "text-input__input", disabled: this.disabled, inputMode: this.mode, maxLength: this.maxLength, max: this.type === "number" ? this.max : undefined, min: this.type === "number" ? this.min : undefined, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, onKeyPress: this.onKeyPress, placeholder: !Boolean(this.suffixLabel) ? this.placeholder : undefined, ref: (el) => (this.inputEl = el), required: this.required, role: this.swirlRole, name: this.inputName, rows: this.rows > 1 ? this.rows : this.autoGrow ? 1 : undefined, spellcheck: this.spellCheck, step: this.type === "number" ? this.step : undefined, type: type, value: this.value }, this.rows > 1 && this.value), this.suffixLabel && (index.h("span", { key: '9aee718bfeb28d7954654382b95ac2e22af0b0f2', class: "text-input__suffix" }, this.suffixLabel)), showClearButton && (index.h("button", { key: 'a37f8aa0bb18118b04d89b669a713236bcc1d5a0', "aria-label": this.clearButtonLabel, class: "text-input__clear-button", onClick: this.clear, part: "text-input__clear-button", type: "button" }, index.h("swirl-icon-cancel", { key: '3bec16e0c57ff7985f0977b582866bc760221d46', size: this.iconSize }))), showPasswordToggle && (index.h("button", { key: '4365e0853a72a081729957b3d959582527b7b5d5', "aria-label": this.passwordToggleLabel, class: "text-input__password-toggle", onClick: this.togglePassword, type: "button" }, this.showPassword ? (index.h("swirl-icon-visibility-off", { size: this.iconSize })) : (index.h("swirl-icon-visibility", { size: this.iconSize })))), showStepper && (index.h("span", { key: 'b0cc92e6baa711d2392af993d2b7042ccca99870', class: "text-input__stepper" }, index.h("button", { key: '8ea6a3c179d6c89c9f548651cf22db97ea93982d', "aria-hidden": "true", class: "text-input__step-button", onClick: this.increaseValue, tabIndex: -1, type: "button" }, index.h("swirl-icon-expand-less", { key: 'd8c39b731368868d3bd90f3bafc5965ba293a0b1', size: this.iconSize })), index.h("button", { key: 'ba7af221e7b0100062c4e5299f9cfb436be37c4c', "aria-hidden": "true", class: "text-input__step-button", onClick: this.decreaseValue, tabIndex: -1, type: "button" }, index.h("swirl-icon-expand-more", { key: 'bcf40411b9947f0b5b3bfb1f60a383b208adaea5', size: this.iconSize })))), this.showCharacterCounter && (index.h("span", { key: '15021626928e1240ad4898070e584bdca420013a', class: "text-input__character-counter" }, this.value?.length || 0, " ", Boolean(this.maxLength) ? `/ ${this.maxLength}` : "")))));
     }
     static get watchers() { return {
         "value": ["watchValue"]

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

@@ -988,7 +988,7 @@ const SwirlText = class {
         const styles = {
             whiteSpace: truncate ? "nowrap" : this.whiteSpace,
         };
-        return (index.h(index.Host, { key: '9e4cd62b8e5d38f778220ff4d623e5ec2092e7cc' }, index.h(Tag, { key: 'e8f8a08a98a85235c16b1b7fa7af885466b47b0b', class: className, ref: (el) => (this.textEl = el), style: styles }, index.h("slot", { key: 'd01b357af42f737f2227403e89ac261c35abbabe' }))));
+        return (index.h(index.Host, { key: 'fcf86b63f5415e82340941373071de1d3d500667' }, index.h(Tag, { key: '38b4bbdcc3002509bebcaae494897666729425cf', class: className, ref: (el) => (this.textEl = el), style: styles }, index.h("slot", { key: 'c58d26bb8f1fc6365bdb74e378ed37a2c9adf5d0' }))));
     }
     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: '368df9fdcb9723b7087dd77bd3824bfe75dadc33' }, index.h("slot", { key: 'ec2ff8f04b529a26812f762939c005250d18136d' })));
+        return (index.h(index.Host, { key: '287ef027798030dedfe3ebc017c97b3fa0beaf8c' }, index.h("slot", { key: 'f9d60b411730b393306ecfcee1b659884ab60178' })));
     }
     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: '5c5c86382799dd7139300ae0d50d69836813fa08' }, index.h("div", { key: '6183e964b5f7480ace037ffc38451246a4411b7c', class: className }, index.h("input", { key: 'e457912cc0c1e0f71866a87d74ed25ccd8015239', "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: '2395d8c95a23cdb452c270bfbc6d91d79e58eed0', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: '70c60371d3bc2bd525a96d1ec1fb98a0e9e14343', size: this.iconSize })))));
+        return (index.h(index.Host, { key: '62cad8160514e5d742505e6a39e55df30ac9bf3f' }, index.h("div", { key: 'cf232d9443be8c35549138d2414ab655cd1ed648', class: className }, index.h("input", { key: '6856af41a01e6fd0bebf7d412e7ccf90b4a927a9', "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: '791576da99aaf53545bae4ff29221c1ece69b2cc', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: 'f78a4765dbb5a4fdcded534bd0d95a3c34f39e6f', size: this.iconSize })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -55,7 +55,7 @@ const SwirlToastProvider = class {
         return newToastWithId;
     }
     render() {
-        return (index.h(index.Host, { key: '3102f7a7b97d39bf4786b4d69edef75c382f901b', role: "status" }, index.h("swirl-stack", { key: '4b737934696d5ad985324fb710bae11e1a722126', spacing: "12" }, this.toasts.map((toast) => {
+        return (index.h(index.Host, { key: 'b89c578a32dbd961465ee23f8a4e521d10d8bbfa', role: "status" }, index.h("swirl-stack", { key: '292cbae48deafe0a76a515e2eac35f0dfb99826d', spacing: "12" }, this.toasts.map((toast) => {
             const props = { ...toast, content: undefined };
             return (index.h("swirl-toast", { key: toast.toastId, onDismiss: this.onDismiss, ...props }, toast.content));
         }))));

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

@@ -63,7 +63,7 @@ const SwirlToast = class {
     }
     render() {
         const className = index$1.classnames("toast", `toast--intent-${this.intent}`);
-        return (index.h(index.Host, { key: '66b602af1531b3a1a9dba23b54d94bfd0917df6d' }, index.h("div", { key: '668b27ec01b2bfbc884d4e5470b61619941bffc4', class: className }, this.icon && (index.h("span", { key: 'b9e77f4ea760858c21e2cae858431573885c4a8c', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'c964b92496149e8f818b2a79ec8b0ad3b39e110d', class: "toast__content", innerHTML: this.content, part: "toast__content" }, index.h("slot", { key: '171350974098a84e90e7702e53745524e2e07b96' })), index.h("button", { key: '9315b36ec5dcceb59d7af7a7e1703be2818baa43', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (index.h("swirl-icon-close", { key: '44a05abbadc66519fe6e591447d247594c454f9e', ref: (el) => (this.dismissIconEl = el) }))))));
+        return (index.h(index.Host, { key: 'c0d869b690436deacc2d3c203da75561cbabf303' }, index.h("div", { key: 'e9fa09c4d9ab4f71bbfacac56b19248ed93c30c5', class: className }, this.icon && (index.h("span", { key: '91e3a639f3f911cab2e159e20c15840c4558ff71', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), index.h("span", { key: '0f04c7e25e203c4ab52d9b0bef316bd587c1b31b', class: "toast__content", innerHTML: this.content, part: "toast__content" }, index.h("slot", { key: 'f97d934f8bf11bc623e6da6512a675eb38b7c806' })), index.h("button", { key: 'e2d60aeaca787a51e038c31a8880935808eb59cf', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (index.h("swirl-icon-close", { key: 'fb68588c3086cba14d95d0e48f16980da6e8f1a2', ref: (el) => (this.dismissIconEl = el) }))))));
     }
     static get watchers() { return {
         "duration": ["watchDuration"]

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

@@ -23,7 +23,7 @@ const SwirlToggleButton = class {
         const classNames = index$1.classnames("button", {
             "button--pressed": this.isPressed,
         });
-        return (index.h("button", { key: 'b939577877c21e3c6c7bc581f59b946986690402', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (index.h("swirl-icon", { key: '8cb26aa017034b6b3b6f8bcfefa660aca0aa7022', class: "button__icon", glyph: this.icon })), index.h("span", { key: '0844be3462394e334bd63ee8eaec34b942fe6f9b', class: "button__label" }, this.label)));
+        return (index.h("button", { key: '7cc5d2a7d5ffe8b792cc76c639a762f862402d12', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, this.icon && (index.h("swirl-icon", { key: 'dca7033d3833f625b0ffac8b191edb314f50778d', class: "button__icon", glyph: this.icon })), index.h("span", { key: '5380169ce206429406894ba691dd3012ed43467a', class: "button__label" }, this.label)));
     }
 };
 SwirlToggleButton.style = SwirlToggleButtonStyle0;

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

@@ -65,7 +65,7 @@ const SwirlToggleGroup = class {
     }
     render() {
         const className = index$1.classnames("toggle-group", `toggle-group--variant-${this.variant}`);
-        return (index.h("swirl-stack", { key: 'ab1b5a6a78bc82c75d662f390f37fe014ecf7d71', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: 'ef1cf15216bc8c9b655add013c1c9decac3c4ef9', onSlotchange: this.onSlotChange })));
+        return (index.h("swirl-stack", { key: '3001e0c25049e8dbb50b40f0cfcd8d0dd31cea88', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: '37c228914b23670b517b3aece235574f3aac1388', onSlotchange: this.onSlotChange })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -75,7 +75,7 @@ const SwirlToolbar = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '0f08bb5931e56f1cc56917fbf52a410c1262d566' }, index.h("swirl-stack", { key: '8b0f10dcf385da8f4b402a3cbcb2c6efc60fb13c', align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: true }, index.h("slot", { key: '238b66c42520886409fa64a4fa92e7782ad0d4a9' }))));
+        return (index.h(index.Host, { key: '2209c72d725863c4a00b7818f7807afec6ce9476' }, index.h("swirl-stack", { key: '28122759e485039ebd1293316115707fc0c0f4fa', align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: true }, index.h("slot", { key: '839470d432295a35e89149203d8761e0aa5000da' }))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -119,7 +119,7 @@ const SwirlTooltip = class {
             "tooltip--active": this.active,
             "tooltip--visible": this.visible,
         });
-        return (index.h(index.Host, { key: '4db218f313da01033b87acd2379054d5f3df40c2', onKeydown: this.onKeydown }, index.h("span", { key: 'ac530e0fbe013b6a9f5754ca37b9dd286a816f6a', class: className }, index.h("span", { key: 'a86c4bbce69fd8193908890ce035dc886c14b178', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: '0a348ef1b9136e9a9cde6b68ad6f2dff8aed9ca6' })), index.h("span", { key: '2afaf4a6779ef8e8238aa294761ea07b06a494b4', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
+        return (index.h(index.Host, { key: 'fab7025501b2b85e03b31af571bfe2556a2fbf1d', onKeydown: this.onKeydown }, index.h("span", { key: '30ca7d1404e2fd6f2c9becaf6b9411af2d8a9979', class: className }, index.h("span", { key: 'be87c4cab59e4fd973fa9ea0da81b07d8ba056b0', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: '4189b67bd8a6ebfd95bdd7e7e131e9e7f1ef4d65' })), index.h("span", { key: '484c29090af80fe4acc66eee3808c75be3a16528', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
                 top: Boolean(this.actualPosition)
                     ? `${this.actualPosition?.y}px`
                     : "",
@@ -127,7 +127,7 @@ const SwirlTooltip = class {
                     ? `${this.actualPosition?.x}px`
                     : "",
                 position: this.positioning,
-            } }, this.visible && (index.h("span", { key: '03d41c3dedab3fe5829234a5167ede80de87ba7e', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: '9a35f9c8caa44ef676fdf914d7af0a92891faf48', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: '667386c4a56c49b3d0ece38a8282083b46fc5e6b', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
+            } }, this.visible && (index.h("span", { key: '07da4e4ee3c3bbf5e8f8f7fad9ec11716b99b175', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: '9d0e50ebdb013eeba59011945ed6e559c3d3bbf9', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: '85c760dc089cf71b0e43e13de679b2ad795ad97f', 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

@@ -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: 'f057207f2e8d0e1c7edf04100b6f0be095418e82', role: "none" }, index.h("li", { key: 'd00ea289fbf323e754c28ffb738947f2c7b1796c', class: {
+        return (index.h(index.Host, { key: 'd4bd1525dc7f73254f0730db018608fd57042063', role: "none" }, index.h("li", { key: '13cdf618522cc29f85fa8eae21dbbb880fd1bdbe', 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: '6eeff235437541f45adff53633e1a7200b89b804', 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: '4573e9b26b5cd34369e156eccea0a5ef76b8df5a', class: "tree-navigation-item__content" }, this.icon && (index.h("swirl-icon", { key: '40efe54de1e31392fa1dabefa37535fc088fb1b8', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), index.h("span", { key: 'b5d9c26df5afac9a734a34a9ff77b6dfaee74b4e', class: "tree-navigation-item__label" }, index.h("span", { key: 'aec77460b750b898fcce37c9adf381b8d0fa198e', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (index.h("span", { key: 'bff0bc516c2dded34660e04af38ae1adbceb43e6', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, index.h("swirl-icon-chevron-right", { key: '6b9899f03ef854de004013776c75508c1a9e3b17', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (index.h("span", { key: '8dda736bb7b593a74762f2168ee393d69c400806', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, index.h("swirl-icon-open-in-new", { key: 'fface871913d1cdd637f8213a41943d57409ca36', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (index.h("ul", { key: 'c046cda05be68a047754825b6c2894b91a2bb0ad', 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: '766f3abc27868c37624a43c41fab80e13806dae9', 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: '800e66e35bccc69c986b07f03f9469262da11d3f', class: "tree-navigation-item__content" }, this.icon && (index.h("swirl-icon", { key: '6fa428d0000cfd68a0bc2d62cc541fe022c1ec24', class: "tree-navigation-item__icon", glyph: this.icon, size: 20, "aria-hidden": "true", role: "img", "aria-label": `${this.label} icon` })), index.h("span", { key: '8024409708d5a89112d87cb9cfa9cef748d9dba2', class: "tree-navigation-item__label" }, index.h("span", { key: '821a70bb13ab77f343007cb211e3aa04e7685deb', class: "tree-navigation-item__label-text" }, this.label), this.expandable && this.hasChildren && !this.external && (index.h("span", { key: '3f25bf7f893d5bcc99f2bc6c526da57d8b0b40dc', class: "tree-navigation-item__toggle-icon", "aria-hidden": "true" }, index.h("swirl-icon-chevron-right", { key: 'de9318ee7c6ba345585c39714dcca1c3537185a7', size: 16, role: "img", "aria-label": "Expand" }))), this.external && (index.h("span", { key: '81665225542afc273b02768ff0b6091f3229be03', class: "tree-navigation-item__external-icon", "aria-hidden": "true" }, index.h("swirl-icon-open-in-new", { key: '413056e3aab8a57891262502517d7b23fba33e99', size: 16, role: "img", "aria-label": "External link" })))))), this.hasChildren && (index.h("ul", { key: '5141f8db8278a28d3ea8b8591a469eaf4783e841', 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: 'aff032044a5ac0e21d795f102ce30e180301dd64' }))))));
+            } }, index.h("slot", { key: 'd141cb5f47d0b2d47a6706351092687b89cefd70' }))))));
     }
     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: '872d53d006a47c2f9929f9757ecd03b066ce9cb9' }, index.h("ul", { key: 'ce670865a6fbb1ecde94264a0363165aeb76591a', "aria-label": this.label, class: "tree-navigation", role: "tree" }, index.h("slot", { key: '6fdf68ade28854c7524855e164b4273feea5442c' }))));
+        return (index.h(index.Host, { key: 'd64a1dd341a5211587d8cc7b148371c16571ccab' }, index.h("ul", { key: '8c6bd4e37aed34dda2140ff37fe9687e9c6ff48f', "aria-label": this.label, class: "tree-navigation", role: "tree" }, index.h("slot", { key: 'aca30c87ebdb9cabec3b4365f4d8f67c00893b3e' }))));
     }
 };
 SwirlTreeNavigation.style = SwirlTreeNavigationStyle0;

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

@@ -334,13 +334,13 @@ const SwirlTreeViewItem = class {
             "tree-view-item--disable-drag": this.disableDrag,
             "tree-view-item--has-tags": hasTags,
         });
-        return (index.h(index.Host, { key: '01ca9cc89f5eb7c66ae47680591e378c09f67d3d', id: this.itemId, role: "none" }, index.h("li", { key: '1b1d36073813b3bb207d3e2a20515bce93dbd226', class: className, role: "none" }, index.h("a", { key: '86d9cca76300bd49749c096125b9d22cb697cc50', "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, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, !this.disableDrag && this.enableDragDrop && (index.h("span", { key: '228858a5745c9f6c20d9567d758e469647818036', class: "tree-view-item__drag-handle" }, index.h("swirl-icon-drag-handle", { key: 'ee78522ed5de0420940ed3863a689c6f9d511cee', size: 20 }))), this.expandable && (index.h("span", { key: 'e6f2e65376329d9c3c292759150073e8a1b731ab', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: '575c9975bf329f7635f83bd08f188d5d07920009' }, 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: 'cfc4cb15788507d1ee43b27d83917e0ca4df7091' }, index.h("span", { key: 'fbae6155ff22a1237b851cadb7db8f943b9cab9a', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: '20d11a4893c03d2cdf885785375b5bf83bb62db6', class: "tree-view-item__label" }, this.label), index.h("span", { key: '5bfca18ada019bcc182c96c97858fd0e7e6db783', class: "tree-view-item__tags" }, index.h("slot", { key: 'c69e510d1d46b26eae73011864162f03ce2615e3', name: "tags" }))), index.h("ul", { key: '77ae8fd3096eb8aeb68dfd8bafd7682c586d8932', "aria-label": this.label, class: `tree-view-item__children ${shouldShowChildrenDropZone
+        return (index.h(index.Host, { key: '359205749fd0fa8cdd09b902a535169cfa410031', id: this.itemId, role: "none" }, index.h("li", { key: '5e13cbe565927ba5fa14e3f99309a2c880b262b3', class: className, role: "none" }, index.h("a", { key: '776901fdfc6d1879285a3a37b131b4cc41ec7efc', "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, onKeyDown: this.onKeyDown, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, !this.disableDrag && this.enableDragDrop && (index.h("span", { key: '726f0d283a32cafb9b8924fe8a26eabfb5eaaa1f', class: "tree-view-item__drag-handle" }, index.h("swirl-icon-drag-handle", { key: 'c6d9ccbeca76689b7ffd72fe765c6196a6c4437d', size: 20 }))), this.expandable && (index.h("span", { key: '45873aeb8ee0ef116351e300397ff202d5950033', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: 'fe6bdc75d7beabe8ab58687ddd07f8a461426479' }, 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: '095e710bc88d20c62cbc79aaa66993b203b70cf5' }, index.h("span", { key: 'b7a0c0b5446ce314e3bfb3778953a412d0d088f7', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: 'bb2fced3c07abca46d4fe1542ebc310a00acfdb6', class: "tree-view-item__label" }, this.label), index.h("span", { key: '7705d52ac2befb94f0b161a0875babbaed63b891', class: "tree-view-item__tags" }, index.h("slot", { key: 'ed0d4949b0814388e305694dbc833319f215b1f3', name: "tags" }))), index.h("ul", { key: '1a6b4cfbedb4e8eab88b29c5df6ee26c964478fd', "aria-label": this.label, class: `tree-view-item__children ${shouldShowChildrenDropZone
                 ? "tree-view-item__children--drop-zone"
                 : ""}`, id: `${this.itemId}-children`, ref: (el) => (this.childList = el), role: "group", style: {
                 display: (!this.expanded || !hasChildren) && !shouldShowChildrenDropZone
                     ? "none"
                     : undefined,
-            } }, index.h("slot", { key: '81a3a31a6d70578df79cf64802480e0aaf856e91' })))));
+            } }, index.h("slot", { key: '173b8f94cb788699ef8ed8925084766337389409' })))));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -329,7 +329,7 @@ const SwirlTreeView = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'dd10c741ea08fa6de714c07f1c2fd8bf33da3aee' }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: 'c1b184641c0a64ea7353910854413c1512fc2635' }, index.h("span", { key: '7e9fdf484ebccebc6164a4ff8b5d01f932f332bb', "aria-live": "assertive" }, this.liveRegionText))), index.h("ul", { key: '1c7b63be88e2d085a72dc6deccfac71ee27352d5', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: "tree", ref: (el) => (this.listElement = el), tabIndex: -1 }, index.h("slot", { key: 'cc38bcaab78bbea68503c699962fb19f228e20b6', onSlotchange: this.onSlotChange }))));
+        return (index.h(index.Host, { key: '356121cb7f5adc3b4a9627b370233916cad1ae29' }, this.enableDragDrop && (index.h("swirl-visually-hidden", { key: 'a6f46439112356816f0f853a96a373a960b1bd14' }, index.h("span", { key: '2bab282efa908ea48a31683b6dde185cb153c1af', "aria-live": "assertive" }, this.liveRegionText))), index.h("ul", { key: 'ef9a99fe169c8752c982d9f0d4a02d6b091b042e', "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: "tree", ref: (el) => (this.listElement = el), tabIndex: -1 }, index.h("slot", { key: '85a2a2c04d985d0892180c30f0c5b63bb85587fb', onSlotchange: this.onSlotChange }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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: '55e1613b1eb5cfab6b61722a1e00aadbfd3fe860' }, index.h("button", { key: '13a60b3cfff2d809f199ffc6a22f547591a3f522', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: 'cd2ed40c9b3745b8c806d532d2ca5a26d99fec9a', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: '37fb6952598d1ebbf74ecdcb6f739d31ed202a66', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: '2a227c9d7b6c3cca2683bd8023a87e8382ae5ac9' }, this.durationLabel), this.duration)), index.h("svg", { key: 'f1a26e7451069483c0bb8a2265f92a696a8f661d', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '5eb84639a2d60932def50287f92bb366d17e10bc', 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: '89b30ebbabaa0125ea604e37ab15ba8e4ed8a70f' }, index.h("button", { key: '3eccecc8fc13e0107c06ab6f5b7061890a2cc586', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: '46a3b1ffd73342381e5a653e4882164046cc7acb', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: 'ce763f7f7139820fa7dca759f75423561ab77082', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: 'e24762998cc8964572a171714e2863120a31843e' }, this.durationLabel), this.duration)), index.h("svg", { key: 'bea7034af79ae9405b17303db7a63aefd4d07198', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '1b76a07faf72896a78c7263087475e7e3ee4c347', 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: 'a14091d8a5955c1752e7f5c7614d2508bdea3126' }, index.h("slot", { key: '46c833b51eab44f79da4a3c32a6bbd49b9fb0bdf' })));
+        return (index.h(index.Host, { key: '69846d59ed62a94845e0943463263a760121e458' }, index.h("slot", { key: 'a13661b354d562468572064c0362f23a8d9e509a' })));
     }
 };
 SwirlVisuallyHidden.style = SwirlVisuallyHiddenStyle0;