@getflip/swirl-components 0.254.1 → 0.255.0

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

@@ -326,7 +326,7 @@ const SwirlTable = class {
         this.empty = !Boolean(rowsContainer) || rowsContainer.children.length === 0;
     }
     render() {
-        return (index.h(index.Host, { key: 'dc149744e4cb0f6125c3dfc06bd336b36c3983ed' }, index.h("div", { key: '6d44476ddc209f2012d9932cc39e8e125dc3c99b', class: "table" }, index.h("div", { key: 'a56c99c754f4de878992ac40f897d4e29a6b4f6b', class: "table__container", onScroll: this.onScroll, ref: (el) => (this.container = el) }, index.h("div", { key: 'c758a42db34732245b08969de11f34a0e9540cf5', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index.h("swirl-visually-hidden", { key: '71a0a29e0b7b687c452f4310eb85a1e1ce28ff98' }, index.h("div", { key: '3746d4b318889b2b7c80a370ca63477c72c40307', id: "caption" }, this.caption))), index.h("div", { key: '348b469e5038d801451d029f243308b4a59065dd', role: "rowgroup" }, index.h("div", { key: 'deb4cc6efd06150e178179e2509e04d6ee4f1e83', class: "table__header", role: "row" }, index.h("slot", { key: '493af00b74fa0ece2444048910ee2dfd87d05bef', name: "columns", onSlotchange: this.onSlotChange }))), index.h("div", { key: '9e3bc7105b3542d82b19d17e356906d206620b4f', class: "table__body" }, index.h("slot", { key: 'a461da2788519e3f0b4fb9c14d8081f687606732', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (index.h("div", { key: 'e04a85ad4dfdde31efba3d07fd5836512dcb783f', class: "table__empty-row", role: "row" }, index.h("div", { key: 'c795e6f35a50eedd208e93323f2d74b81cc24d85', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index.h("swirl-text", { key: 'f15929d3e4c51aaf067eeeed050e2872286ed92d', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (index.h(index.Host, { key: '22428ff9e118a7ed189cb33e91e62223ef284fa2' }, index.h("div", { key: '91155c06c37dc930b94850089ab640b2b29fd8f2', class: "table" }, index.h("div", { key: '6da9f3578213904b608e438faa46265636633321', class: "table__container", onScroll: this.onScroll, ref: (el) => (this.container = el) }, index.h("div", { key: 'e9714b742b1328e84551656f3e2d4b17d65a0c12', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (index.h("swirl-visually-hidden", { key: '800a5a220d24c404e70a183262bebaf02a5fcc4d' }, index.h("div", { key: '7cb18553948e4dbac48d495fd487b8108208207f', id: "caption" }, this.caption))), index.h("div", { key: 'e94da364a91e3f8eba42f2bdf476c99c41fe0676', role: "rowgroup" }, index.h("div", { key: 'af00f2d137187b35bbe94204eec924d7053607c8', class: "table__header", role: "row" }, index.h("slot", { key: 'd24e969f9024ce6d82f629184c06a8e3045a411a', name: "columns", onSlotchange: this.onSlotChange }))), index.h("div", { key: 'd9359dc1be4474f4b0bc8d06df859ca2383a7c93', class: "table__body" }, index.h("slot", { key: '8cce694ed1389275a189d354bf9b2e67345f1fd9', name: "rows", onSlotchange: this.onSlotChange }), this.empty && (index.h("div", { key: '997154e5deb62b9a7c899c6834a5964fe1b659cd', class: "table__empty-row", role: "row" }, index.h("div", { key: '0457c0ef49962f1a8884ba1526d05058708ee443', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, index.h("swirl-text", { key: '5b2b13a053cb752a1c480402a28328b43a5b2a83', 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: 'fa84a93633a63f8b008dcb4facc00d7863ad856f' }, index.h("div", { key: 'b078b1f67deccd39937ba831c3855deb66c0382c', class: "tabs" }, index.h("swirl-tab-bar", { key: '5af27dc9e0485891d3a71b283969d4355149389e', 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: '86571d95576e5a67803f276a8081e2ae2f2f6832' })));
+        return (index.h(index.Host, { key: '3089c06c74dd4876e94f2de43f389e73cd8c38e3' }, index.h("div", { key: 'f83cab1ce8cbc664d0c579475349a242c5f971ae', class: "tabs" }, index.h("swirl-tab-bar", { key: '1a9a6954dd218d61601404c31439c7a824a02fd6', 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: 'ba49f898cb01f11eafa7ea257b9f52eaccd41d79' })));
     }
     get el() { return index.getElement(this); }
 };

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: '1c70325988126cc54a9c8942ba337f2615caa5f9' }, index.h(Tag, { key: '719cde01bef1a2baae91eaa7d1f25e069706cb45', class: className, ref: (el) => (this.textEl = el), style: styles }, index.h("slot", { key: 'bee24f184bdaf8da03c7b3c3a09adbbc000e55df' }))));
+        return (index.h(index.Host, { key: '67b3f84f719c449587fdee7cec69b658137b7318' }, index.h(Tag, { key: 'ed03d274cde2bba9af7bf6cc0d65e66592392c0d', class: className, ref: (el) => (this.textEl = el), style: styles }, index.h("slot", { key: 'c5ebf1c1a2ea1619100a8dd05fffc3fbbcf80071' }))));
     }
     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: 'e200ab2b068a93d90f991b118078f4ff6a17ee7f' }, index.h("slot", { key: 'eca8ad2eebec5d60da9842723215bba6c756eab5' })));
+        return (index.h(index.Host, { key: '1266378fdaa0421b4a28d5c133f6990e4dd842c7' }, index.h("slot", { key: 'ebf5af293a781e4b405f4dd3c6a8c0f0399e0d41' })));
     }
     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: '825c7aefe5770d5d8e28a35531c10e448bf08bb1' }, index.h("div", { key: '7c1ac3c752e2778b380ca513a90e8e2484e29b7d', class: className }, index.h("input", { key: 'c9ccc6d7afee9c7b5875ff8eb0809d00cf8ea16c', "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: '961180beb8d133377e6fec941b879348b3268b5d', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: 'fa023c4f00d534935904b471990d48524a3bc961', size: this.iconSize })))));
+        return (index.h(index.Host, { key: '6326c3a42f6ff4a21778fea7933efd21e7f586ad' }, index.h("div", { key: 'aad488c92bd2232bcb98453ab80182f5509a26cd', class: className }, index.h("input", { key: 'dfd55229a490341a911524f9c68c62a999653c58', "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: 'c9dd879952e1e1cf2305980297e890ae57b7185d', class: "time-input__icon" }, index.h("swirl-icon-time-outlined", { key: 'ce749a3f6cb76f482a1fc3a18f10f9b7a9c4a0fe', 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: '4ca07c887b78a25c8cfb65f62de4597b1311151d', role: "status" }, index.h("swirl-stack", { key: '072c718f837a9e2b07b42257171ba04a1ee6ac24', spacing: "12" }, this.toasts.map((toast) => {
+        return (index.h(index.Host, { key: '291cbaa4de84f5642e2e81f2a1dc5725fc1f760f', role: "status" }, index.h("swirl-stack", { key: '3a0ddb12cdfa15889ae18097657dd448f77e5348', 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: '1da46b96aef7cec3e3b3711964a2d8083f45131e' }, index.h("div", { key: '22e1fb9c7bf3314e3aba587f884783baebfd07dd', class: className }, this.icon && (index.h("span", { key: 'ee45314f8a40d8a72500704c2f2b2f8b895f8f9d', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), index.h("span", { key: 'a8e12cf94d5f78dc75fa7b3087563020733e75cf', class: "toast__content", innerHTML: this.content, part: "toast__content" }, index.h("slot", { key: '93eba2783424f44a5fe4d27ba7ea8d7b177e325a' })), index.h("button", { key: '794ab47b83f98e9ed36280539ea17a863725daee', "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: 'd3f3ea7b0faf733ac7a0acd01bef775fcd086f56', ref: (el) => (this.dismissIconEl = el) }))))));
+        return (index.h(index.Host, { key: 'd1a206cc1408bd32f79b2feb9dfd26dbcfe1789a' }, index.h("div", { key: 'ae3d5d0cb7670db77bff1dabaa44c25f65aea10a', class: className }, this.icon && (index.h("span", { key: '7cf231b57090e4bdd862662e4e847ba22c9117ad', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), index.h("span", { key: '87ead7ae92ad5c54455942c47b81a436dedeba63', class: "toast__content", innerHTML: this.content, part: "toast__content" }, index.h("slot", { key: '095331448ed5216d25a6afb5509b31ac64a6796e' })), index.h("button", { key: 'cca7dd9b24296c10cc17139fe687e26598303d54', "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: 'ce360cc5829a71d521cceebb6a8b0418f3692302', ref: (el) => (this.dismissIconEl = el) }))))));
     }
     static get watchers() { return {
         "duration": ["watchDuration"]

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: 'e3fd405e07b5a94eceb77e42681cbbdd563d1946', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, index.h("span", { key: 'bff2993c2631e575332a5107d39cd7355f441b12', class: "button__label" }, this.label)));
+        return (index.h("button", { key: '3861fde82eabc6dfbd4ea9d329ea36010c48e9a0', class: classNames, type: "button", "aria-pressed": this.isPressed ? "true" : "false", onClick: this.onClick }, index.h("span", { key: 'ae3b3b0635ca955084ded5360f419bbc8e00af56', 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: '5170589489c60e79ea7e8ae00f7c3e3df002a628', class: "toggle-group", spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: '13c3cc274a5844a430640a8ea2b268dcc9650495', onSlotchange: this.onSlotChange })));
+        return (index.h("swirl-stack", { key: '8bffb40c1f341f5ba672ac8fd3335fde1259b6fd', class: "toggle-group", spacing: "4", orientation: "horizontal", align: "center", role: "group" }, index.h("slot", { key: 'f85e75cef254a1dd0522ef0cd9edb89603b965a4', 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: '4088eb0256fc47727edce81af5829f4ebbbbeed1' }, index.h("swirl-stack", { key: 'b18ad85af85caf9418e498602d387d2bb888e8e6', 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: 'f644ae3de4b776e4822240dc033779a671c4a684' }))));
+        return (index.h(index.Host, { key: '72977493f6b33b2b1d053027fa0f4ab363090973' }, index.h("swirl-stack", { key: 'f7d0790b83c039a0550e3e355111b1e96445303b', 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: '08334df6038b818ca78243beaec98d85f97a7e04' }))));
     }
     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: 'f3706b57f74c0223d9a0de457ae39737a23a4038', onKeydown: this.onKeydown }, index.h("span", { key: '27535b77f5b2e1e4adf25e2bce512dd019912e25', class: className }, index.h("span", { key: '5440bc1e39796bdec1dd1836fbc4e0483ec6a4a6', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: '6e30483c1a9ca4d1118c0f785d56a5fef246d7df' })), index.h("span", { key: 'f7c45dfe92b9ad8192538f7b37cd8f117ac687f8', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
+        return (index.h(index.Host, { key: '7a14595f01dd2cc707ef5d540664f0cca2766e3f', onKeydown: this.onKeydown }, index.h("span", { key: 'cd4f0f8f6ecf8db5aa096822f69abf8859ca4bcb', class: className }, index.h("span", { key: '55da1452153d3bdbf2dec9a597cae31343b803d8', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.hide, onClick: this.hide, onFocusin: this.show }, index.h("slot", { key: '62c1e9c1a88102d18dfc6ca4686102b419ff79c4' })), index.h("span", { key: '6243161edb779b3bb9d885416f4688382ceeac03', 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: 'e8579729115384e96187814ad455d7a68fdcbe4f', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: '2e490d94936c5dfb4fc983d084d7fa629ca51f9a', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: '878b49d11caef03cbf0bcdd78e40d492bfc93d03', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
+            } }, this.visible && (index.h("span", { key: '3fced37e021251c5d868641536ebf9ec9470b480', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, index.h("span", { key: '77f9e4ff72dfe1c8427a7eaae83632a16fe5e38d', class: "tooltip__content", innerHTML: this.content }))), index.h("span", { key: '555e04a2f087b29d380fac6d6ac85f8aa553758c', 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: 'f9bc80e6c911dc7030d180ce5f675f90e84fc80f' }, index.h(Tag, { key: '2ca99a21c102a2137e61472c654d9c7195ed3d2c', class: className, href: this.href, target: this.target, type: isLink ? undefined : "button" }, this.icon && (index.h("span", { key: 'a657d7199e22b81315780d5264c04269d347df98', class: "tree-navigation-item__icon", innerHTML: this.icon })), index.h("span", { key: '0d612bf1dbdfa0a4b8979c9dfa438c4821f6d339', class: "tree-navigation-item__label" }, this.label))));
+        return (index.h(index.Host, { key: 'f9cadfd076d14950488b114f4efbab0330a70172' }, index.h(Tag, { key: 'b78001b5376e0c1f0e4d97965f5fa3d6e316414f', class: className, href: this.href, target: this.target, type: isLink ? undefined : "button" }, this.icon && (index.h("span", { key: '48fceebb6c56be3f2a96a7411f581698bfa4f8b7', class: "tree-navigation-item__icon", innerHTML: this.icon })), index.h("span", { key: 'b3de5413ab8b45e98f455fbd1873b1d9c25eb6d5', class: "tree-navigation-item__label" }, this.label))));
     }
     get el() { return index.getElement(this); }
 };

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: '45ddddf9e282ed3afbb4fc6606c4b75e19f45ae3', id: this.itemId, role: "none" }, index.h("li", { key: '49ad755ce87e8021d159110f14504d977a2ef685', class: className, role: "none" }, index.h("a", { key: 'c8d9a279b733241173d8c22d69f5aa25e4e7ac7f', "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: '0e2af8248203e90bbac24ada811a3227821b215c', id: this.itemId, role: "none" }, index.h("li", { key: 'ffb0b8a5d984855cea00b7d55c6c5e1a7abae87e', class: className, role: "none" }, index.h("a", { key: 'c38f8b1c4dfdbdd36c99482901d2a47d976d3586', "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: '4f2457f90eeb8d5841b5ae82b8214c5b25b05b9b', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: '57b52745d6f0d9849b39fbf687168d9f37aebf12' }, 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: 'cccbc0943a56a8dc1c7d4bef194b14030fa39b6d' }, index.h("span", { key: '673aa7207123120566de9a95f1f20b1eb99504b9', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: '4db5b2da5445dbc39b4ec43028511515833e78a6', class: "tree-view-item__label" }, this.label), index.h("span", { key: '571d246e294c3a4e654c49868defa16adf576062', class: "tree-view-item__tags" }, index.h("slot", { key: 'e1c619ee29b232e4653f6edea8549625d96d7544', name: "tags" }))), index.h("ul", { key: '44bf72064a95bc3504176b00f8656c7f2e2689fa', "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: '8f37cc76cc31d7be558ef88afe7a4b7d53573b54', class: "tree-view-item__toggle-icon" }, hasChildren && (index.h(index.Fragment, { key: '13d0b9b334ea8a98788e0b2552506f95977d1910' }, 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: '180aeb1daf320302256c2a810d61c7b11e5cd4d6' }, index.h("span", { key: '2c210128e558c257376d5d553865795f95a3b762', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (index.h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), index.h("span", { key: '0278c88a4d7d87d0bdf9b4af007840822e83aa65', class: "tree-view-item__label" }, this.label), index.h("span", { key: '8ba4b1e0b5c82a12fbac7ba4333e2b5aa8ada3d2', class: "tree-view-item__tags" }, index.h("slot", { key: '1e03e13118893e30f699c2c09c616eef7da980c2', name: "tags" }))), index.h("ul", { key: 'cc47c02c20d6819618caee618d7489436ec41b72', "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: '8ca6c92b00ffb2af2da537fa79f90548f44ebe03' })))));
+            } }, index.h("slot", { key: '24784fcc3a80d13b36e9a2a66e7dc3be5943d347' })))));
     }
     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: 'd9265aef73021237709d82d2942014e16f193f8c' }, index.h("ul", { key: '0c435bad394708adb3a98564d58de09ca435872c', "aria-label": this.label, class: "tree-view", role: "tree" }, index.h("slot", { key: 'b48b40863ea888e67246ba7dfd7b1ead648b2c60', onSlotchange: this.onSlotChange }))));
+        return (index.h(index.Host, { key: 'f6cd60716528a4bc08ae34b7f7b8bcc468fa87af' }, index.h("ul", { key: '5353f9e9f359c6b3eeb53107d47cc62ec8820a9e', "aria-label": this.label, class: "tree-view", role: "tree" }, index.h("slot", { key: '93f6e2df68fb6c837a185c24c8f8afc53faba4f0', 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: 'd67938cbd04fbffc368ad324630bd8622c1e8c5b' }, index.h("button", { key: '2233218d1d04cca359795a4037e2e475a114a9bc', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: '6533b6476b62f35adf46a76a88b946727ceaeb33', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: '9afe4e6bcc2080be2e19a7d2f14a661841c1971a', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: 'f416764dedb92def3f33a1a3ea124425a06cb2a4' }, this.durationLabel), this.duration)), index.h("svg", { key: '3f9d5bf02620449267629cb325b87a1784f5b8ec', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'aaa31ee0aac6020ef6ca4f611b491bb82d2a032d', 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: '5bece81a92879404b264d43716fc8c4c6221fa1e' }, index.h("button", { key: '208242ba2a4db8bee97a3459483ef230865021c4', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, index.h("img", { key: 'bb371fe167c3f4a5a2e6a5951226a098375d89d2', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (index.h("span", { key: '9099ba6df115019e0e3e6caf68b18678936d2376', class: "video-thumbnail__duration", id: "duration" }, index.h("swirl-visually-hidden", { key: '3285eca5bb93ffd981fa66821b7810c22859e0d8' }, this.durationLabel), this.duration)), index.h("svg", { key: '127b1082041d0dea0f6d6c3015d1b967ad786156', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '1b83f69e25704549ff46c422d31e50ad881fbe1c', 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: '2bc61727b59b308d63a22df3d0e4c1275ff724ea' }, index.h("slot", { key: '2fbb79aa18b39cdc3361081d460b1ab74f5ca7e0' })));
+        return (index.h(index.Host, { key: '50e93b9287d485366e949a82ce4620d57e75898a' }, index.h("slot", { key: '8f2682a482b5bf224bd4855d61deaedd66866a45' })));
     }
 };
 SwirlVisuallyHidden.style = SwirlVisuallyHiddenStyle0;

package/dist/collection/components/swirl-accordion/swirl-accordion.js

@@ -36,7 +36,7 @@ export class SwirlAccordion {
         });
     }
     render() {
-        return (h(Host, { key: 'e598bbf01637b555d81979af8169e5765ba6ab80' }, h("slot", { key: '29e4116f06f3337fb61f1bd6163bdc51a019bc0a' })));
+        return (h(Host, { key: '004b1573b2075e23a5b1a0a154c4ec1c6f5d27be' }, h("slot", { key: 'b2f412f6020ef6d8d90bd837091d4e5896ecb38e' })));
     }
     static get is() { return "swirl-accordion"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-accordion-item/swirl-accordion-item.js

@@ -58,7 +58,7 @@ export class SwirlAccordionItem {
         const className = classnames("accordion-item", {
             "accordion-item--expanded": this.expanded,
         });
-        return (h(Host, { key: 'd20864b7a190aa60d6e84fd9566b76f0b225ebbf' }, h("div", { key: '0495c32558ba037a6a34a3b471d535cc79094319', class: className }, h(HeadingTag, { key: '179b731e15cdea46baf0e62c7aa0b3a80f6eb276', class: "accordion-item__heading" }, h("button", { key: '52fdb8aae9a5919a193413066c1dcd8f07fa6f03', "aria-controls": this.itemId, "aria-expanded": String(this.expanded), class: "accordion-item__toggle", disabled: this.disabled, id: this.headingId, onClick: this.onHeadingClick, type: "button" }, h("span", { key: 'e5322713bebd4af0973077afda7b1e307e4898d3', class: "accordion-item__toggle-text" }, this.heading, this.description && (h("swirl-text", { key: '308fcaf2aa5213a78bbbbaa85855c97c6128bd4e', as: "span", color: "subdued", size: "sm" }, this.description))), h("span", { key: 'a2c873f03eb89b908d3ecb033dcb2351e5b3ce14', class: "accordion-item__icon" }, !this.expanded && (h("swirl-icon", { key: '8ca407506f305e7178ffd7a397c13b35d650916b', glyph: "chevron-right", size: 20 })), this.expanded && (h("swirl-icon", { key: '8b2231c486f76b21b9a31c36b533caac027400c0', glyph: "expand-more", size: 20 }))))), h("div", { key: 'c77f0e3c85f73ea225569d1e9b03b1a8574224fb', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, h("slot", { key: '5bfe1ea819a7d4c271251a26ece6988fba765745' })))));
+        return (h(Host, { key: 'c6d9fc10a2ac8f527a9d808287041166aaab4870' }, h("div", { key: '234903b1094c4dad2ca0c677fa483d6eb9fc10ba', class: className }, h(HeadingTag, { key: '6ec1f491bc0abecfbb6366cfc85ee0ce68f5dde1', class: "accordion-item__heading" }, h("button", { key: '84fcf94c50141cfc9e6c40d3187b2c20d65ad8fb', "aria-controls": this.itemId, "aria-expanded": String(this.expanded), class: "accordion-item__toggle", disabled: this.disabled, id: this.headingId, onClick: this.onHeadingClick, type: "button" }, h("span", { key: 'cdbaf4f3ebdde6ee4a0a756bd69c4c0c13dbba03', class: "accordion-item__toggle-text" }, this.heading, this.description && (h("swirl-text", { key: '85564f3d319e46d89cca9c6f5b64e2f087394ac4', as: "span", color: "subdued", size: "sm" }, this.description))), h("span", { key: 'f7e739a84c489e399a56dfd7ae5f270044b3b17b', class: "accordion-item__icon" }, !this.expanded && (h("swirl-icon", { key: '8a8de5ae8958b1f63af03e00772b02f1d6b7e801', glyph: "chevron-right", size: 20 })), this.expanded && (h("swirl-icon", { key: 'd325057cd997f9c88adfb3bc44ae3a6287410ce3', glyph: "expand-more", size: 20 }))))), h("div", { key: '43c47bdf78e3889c20e19cd752eda010d83c4218', "aria-labelledby": this.headingId, class: "accordion-item__content", id: this.itemId, role: "region" }, h("slot", { key: '6e89f9bdd0f1226037a97919445dc734fabc99cc' })))));
     }
     static get is() { return "swirl-accordion-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-action-list/swirl-action-list.js

@@ -76,7 +76,7 @@ export class SwirlActionList {
             item === activeElement?.querySelector('[role="menuitem"]'));
     }
     render() {
-        return (h(Host, { key: 'f130ed86606be59c58c0d7e1166ae6d9d028dcdf' }, h("div", { key: '770e6691bd13ca71fcb3f60746d8bccc07a19e83', "aria-orientation": "vertical", class: "action-list", onFocusout: this.isInsidePopover ? undefined : this.onFocusOut, onFocus: this.isInsidePopover ? undefined : this.onFocus, onKeyDown: this.onKeyDown, part: "action-list", ref: (el) => (this.container = el), role: "menu" }, h("slot", { key: '08ee019835e7a054d63accdff30d7ff70999fe2b' }))));
+        return (h(Host, { key: '9f6c3f33370fb9a3ed2dae5b032ed6aa2516f7d7' }, h("div", { key: 'ee3535a465baf0ebe9c37cbb6424f55d764a8144', "aria-orientation": "vertical", class: "action-list", onFocusout: this.isInsidePopover ? undefined : this.onFocusOut, onFocus: this.isInsidePopover ? undefined : this.onFocus, onKeyDown: this.onKeyDown, part: "action-list", ref: (el) => (this.container = el), role: "menu" }, h("slot", { key: '8b9de9551a41afa6f2b74ec787501e078881c334' }))));
     }
     static get is() { return "swirl-action-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-action-list-section/swirl-action-list-section.js

@@ -7,7 +7,7 @@ export class SwirlActionListSection {
         this.label = undefined;
     }
     render() {
-        return (h(Host, { key: 'cbbdfd6f7fc5591c7cee2229bf6b6c797bb74cc7' }, h("div", { key: 'b1e1e3f98314fb21e32f42b9a8e14d3f9becafc3', "aria-labelledby": "label", class: "action-list-section", role: "group" }, h("span", { key: 'f0c50d2dc0d094c31a08589d69c7d0170c1ed9c5', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), h("div", { key: '56f127cb581b2df701ec0ad184dfb986c28e4f55', class: "action-list-section__items" }, h("slot", { key: 'dc64d1341deddf34ce32d44599b33b82ce47dab7' })))));
+        return (h(Host, { key: '8cae6b24fa63e2a4293dd290d046a181acec4114' }, h("div", { key: '938b89ab19e4e864964841d7c8792a88fb9715db', "aria-labelledby": "label", class: "action-list-section", role: "group" }, h("span", { key: '3f0cade363242d3b2abf07c17adadaff8985d54b', class: "action-list-section__label", id: "label", part: "action-list-section__label" }, this.label), h("div", { key: 'ae351506f15b64702e5163f3ae3370e542f51552', class: "action-list-section__items" }, h("slot", { key: '106c08d0dd9c83d2e6e54e02e71763906aa2946c' })))));
     }
     static get is() { return "swirl-action-list-section"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-app-icon/swirl-app-icon.js

@@ -20,7 +20,7 @@ export class SwirlAppIcon {
         const className = classnames("app-icon", {
             "app-icon--has-icon": showIcon || showFallbackIcon,
         });
-        return (h(Host, { key: '949e4c6f89bcf570e23ccdb2dca62b8fa590b595' }, h("span", { key: 'faf2ed8b84352e57267a95a3108773e8b42ac09c', class: className }, showImage && (h("img", { key: 'db28155e17a2eadd28f015b581af873959dcc0e4', alt: "", height: "256", onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: "256" })), showIcon && (h("span", { key: '2ac3b8de21200d8866694e985a0737b87da891dc', class: "app-icon__icon", innerHTML: this.icon })))));
+        return (h(Host, { key: '6842caf131f2b105538cd14e25a0f8bf0a44c26a' }, h("span", { key: '331a8d940fa7d65f523cbc2aba537458296a63bb', class: className }, showImage && (h("img", { key: 'a17f3b3945401d487247e6ac92beb8d1ddd3fbc1', alt: "", height: "256", onError: this.setImageUnavailable, onLoad: this.setImageAvailable, src: this.src, width: "256" })), showIcon && (h("span", { key: '944dafe88937ac7af4bc65e7eadb006c4e5981d4', class: "app-icon__icon", innerHTML: this.icon })))));
     }
     static get is() { return "swirl-app-icon"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-avatar-group/swirl-avatar-group.js

@@ -25,7 +25,7 @@ export class SwirlAvatarGroup {
             "avatar-group--has-badge": Boolean(this.badge),
         });
         const badgeClassName = classnames("avatar-group__badge");
-        return (h(Host, { key: '0fb00cbec4533c9dba3678c2ea19e3e10feea383' }, h("div", { key: '8f51d3f11ffec646fbdfc7c847b6119db7fa0c0a', class: className, role: "group" }, h("slot", { key: '790a777b8a79a1fb004971451ebb4753e1bd6435' }), this.badge && (h("span", { key: 'cd64c635336fd04c1fd3236477518d44f47c630e', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
+        return (h(Host, { key: 'f499e91465cf9179cd6e3139f4c21f6bb0f7dda5' }, h("div", { key: 'cf2868c85e93991f7c850f016d3151f64680e5b8', class: className, role: "group" }, h("slot", { key: 'f1606a310a7a63fdd9c764ae6d3c8feddcd7b6a1' }), this.badge && (h("span", { key: '3002d8955d5c68a683f85ce7c68a727bce406c1e', class: badgeClassName, innerHTML: this.badge, ref: (el) => (this.badgeEl = el) })))));
     }
     static get is() { return "swirl-avatar-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-carousel/swirl-carousel.js

@@ -104,7 +104,7 @@ export class SwirlCarousel {
         return inInView;
     }
     render() {
-        return (h(Host, { key: '8c11edc4d4b47bc2e14f67a02e915ae36accfde0', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, h("div", { key: '545694170893141f767e634ca7f06a311c485a4d', class: "carousel" }, this.isScrollable && !this.isAtStart && (h("swirl-button", { key: '295bad656ae38a49d7f8434c17034749abf41b59', class: "carousel__previous-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: true, variant: "floating" })), this.isScrollable && !this.isAtEnd && (h("swirl-button", { key: '15d4e944515c6761a77fa4bd828ac3077c9b13d6', class: "carousel__next-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: true, variant: "floating" })), h("div", { key: 'f16f809f3bce510b8d8c59380e2f800f22ed5cdc', "aria-live": "polite", class: "carousel__slides", onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, h("slot", { key: '7e37f897764033cc2777c37d2fd5b206e6a2d190', onSlotchange: this.onSlotChange })))));
+        return (h(Host, { key: '801697822fd433c46ba90d32b73fbedf3e7b1d5d', "aria-label": this.label, "aria-roledescription": "carousel", role: "group" }, h("div", { key: '275ba2f4cda4630a8af16fe7eeabec632d4932b3', class: "carousel" }, this.isScrollable && !this.isAtStart && (h("swirl-button", { key: '246e774f5f8d1506d109c8e68d83c626be472641', class: "carousel__previous-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.previousSlideButtonLabel, onClick: this.onPreviousSlideButtonClick, pill: true, variant: "floating" })), this.isScrollable && !this.isAtEnd && (h("swirl-button", { key: '5c847d86819472aebd8d22348efbc57a25a49a8e', class: "carousel__next-slide-button", hideLabel: true, icon: "<swirl-icon-arrow-forward></swirl-icon-arrow-forward>", label: this.nextSlideButtonLabel, onClick: this.onNextSlideButtonClick, pill: true, variant: "floating" })), h("div", { key: '2bb930b8f2458177507db8ac62fbf165e525e37a', "aria-live": "polite", class: "carousel__slides", onScroll: this.onScroll, ref: (el) => (this.slidesContainer = el) }, h("slot", { key: '596aa756c3919a1d66d6af891a11d8d45b70cb3a', onSlotchange: this.onSlotChange })))));
     }
     static get is() { return "swirl-carousel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-carousel-slide/swirl-carousel-slide.js

@@ -13,7 +13,7 @@ export class SwirlCarouselSlide {
         const className = classnames("carousel-slide", {
             "carousel-slide--has-min-height": Boolean(this.minHeight),
         });
-        return (h(Host, { key: '8f61c52d294e42d466e3a6cb8d535bb6e3a57bbf', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, h("slot", { key: '5d3fdafb94d95b976272e9d75e6e5dc36a89d1a2' })));
+        return (h(Host, { key: '21e5c0c1a0554506a0e8eeb89093673bf4c55efa', "aria-roledescription": "slide", "aria-label": this.label, class: className, role: "group", style: { flexBasis: this.width, minHeight: this.minHeight }, tabIndex: 0 }, h("slot", { key: '13107eddba0cfd06a83194bb0f5c72020f073683' })));
     }
     static get is() { return "swirl-carousel-slide"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-color-input/swirl-color-input.js

@@ -64,11 +64,11 @@ export class SwirlColorInput {
         const className = classnames("color-input", {
             "color-input--inline": this.inline,
         });
-        return (h(Host, { key: 'a6b1db08b2b1a13ea3bdd7d410b65bedd8b3a0a4' }, h("div", { key: '7bdd6e4d4a50fe73c0415ed6a7b2a8c893ff3113', class: className }, h("input", { key: 'f4db4ff152d13e0ee6f5414d3f5610b201732b54', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "color-input__input", disabled: this.disabled, maxLength: 7, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, spellcheck: "false", type: "text", value: this.value }), h("swirl-popover-trigger", { key: '425b3b1bb4cba6fcd6d989de26f24e9a99fe4e35', swirlPopover: this.pickerId }, h("button", { key: '824daa23d2bbcf3bddb1e46a77e53c850b7c56c7', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
+        return (h(Host, { key: 'f0d620c0d0402c04255df09eafdeab6ce0b271f4' }, h("div", { key: 'f28c97aecd99df2e5bf8eda9dbd913fdc1d76349', class: className }, h("input", { key: 'f286823b38675dc28a41c20d1c89ba09058fe8ba', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "color-input__input", disabled: this.disabled, maxLength: 7, onBlur: this.onBlur, onFocus: this.onFocus, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, spellcheck: "false", type: "text", value: this.value }), h("swirl-popover-trigger", { key: '17348886e3d8283b8f92bde939d8ffe67cdf0371', swirlPopover: this.pickerId }, h("button", { key: '2737a09648c06563631ea7ad24f932fd116d0c16', "aria-label": this.pickerButtonLabel, class: "color-input__preview-button", style: {
                 backgroundColor: this.disabled
                     ? "var(--s-border-subdued)"
                     : this.value,
-            }, type: "button" })), h("swirl-popover", { key: 'f3e100b52a832fc73a8fb0a72ca1411b608bc104', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, h("swirl-box", { key: 'e9d1f8442646ecb2852d48f6a87ab897605a1660', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, h("hex-color-picker", { key: '1cad488c849088dcc4b106bb7448c94a2d0cad50', color: this.value, ref: (el) => (this.picker = el) }))))));
+            }, type: "button" })), h("swirl-popover", { key: 'f0deee906e54a0802914abe66b5b426c759c0d01', animation: "scale-in-y", id: this.pickerId, label: this.pickerLabel, placement: "bottom-end" }, h("swirl-box", { key: 'b4beb61326f80d2a57c8ef533b9a7d291867ca12', centerInline: true, paddingBlockEnd: "8", paddingBlockStart: "8", paddingInlineEnd: "16", paddingInlineStart: "16" }, h("hex-color-picker", { key: '3c412fa3f8dae4128170a25a9906a6ce2bd338a9', color: this.value, ref: (el) => (this.picker = el) }))))));
     }
     static get is() { return "swirl-color-input"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/swirl-console-layout/swirl-console-layout.js

@@ -122,11 +122,11 @@ export class SwirlConsoleLayout {
             "console-layout--sidebar-active": this.sidebarActive,
             "console-layout--empty-app-bar": !Boolean(this.appName) && !this.showHelpButton,
         });
-        return (h(Host, { key: '0eb19236d04c54db5b90ee7651d1b1d4a7650b77' }, h("div", { key: '35781e4a429a3ed3610a970225935717af299f8b', class: className, onClick: this.onClick, onKeyDown: this.onKeyDown }, h("header", { key: '744171c694eb49672c9fd12d8dfd475668ad7c96', "aria-hidden": String(!this.sidebarActive), class: "console-layout__sidebar", ref: (el) => (this.sidebarEl = el) }, h("div", { key: '7192c4a3bb4ace699dbcec0ab9a8ffbb53747e56', class: "console-layout__header" }, h("div", { key: 'b267f54fbb085079e8ee483093a5de3988abc57d', class: "console-layout__logo" }, h("svg", { key: '4a19eec03d3431569a178981e0d87d72dd3d3548', class: "console-layout__logo-mark", fill: "none", height: "26", viewBox: "0 0 16 26", width: "16", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '7125a91e87dd369461cfec31b9f4751e92eeb3ff', d: "M0.624238 14.0705C0.326496 13.5353 0.118077 12.9406 0.0287543 12.3161C-0.0307941 11.662 -0.0010199 11.0375 0.147851 10.4428C0.296722 9.84813 0.594464 9.25343 0.951754 8.77767C1.33882 8.27217 1.78543 7.85588 2.35114 7.55853L14.6181 0.362671C14.9159 0.8979 15.1243 1.4926 15.2136 2.11703C15.3029 2.74147 15.2434 3.3659 15.0945 3.99034C14.9456 4.58504 14.6479 5.17974 14.2906 5.6555C13.9035 6.16099 13.4569 6.57728 12.8912 6.87463L0.624238 14.0705Z", fill: "#145AF5" }), h("path", { key: '28dbea85c6cc083706b118a550f0c4927559646a', d: "M3.69214 21.4743C3.3944 20.9391 3.18598 20.3444 3.09666 19.72C3.00733 19.0956 3.06688 18.4711 3.21575 17.8467C3.36462 17.252 3.66237 16.6573 4.01966 16.1815C4.40672 15.676 4.85333 15.2597 5.41904 14.9624L12.2076 10.9779C12.5053 11.5131 12.7137 12.1078 12.803 12.7323C12.8924 13.3567 12.8328 13.9811 12.6839 14.6056C12.5351 15.2003 12.2373 15.795 11.88 16.2707C11.493 16.7762 11.0464 17.1925 10.4807 17.4899L3.69214 21.4743Z", fill: "#145AF5" }), h("path", { key: '4d2f62470e2346a070047e2fc3d0840bac127a0b', d: "M3.69141 21.4739L7.77047 19.0951C8.39573 20.1953 8.5446 21.5036 8.24686 22.7228C7.91934 23.9419 7.14521 24.9826 6.04357 25.6368L3.69141 21.4739Z", fill: "#80A8F4" }), h("path", { key: '537ca3018e9aebb1f7fa7d8740aaa1b891984e38', d: "M12.2072 10.9785L7.32419 10.1459L0.625 14.0709L5.38887 14.9629L12.2072 10.9785Z", fill: "#80A8F4" })), h("swirl-text", { key: 'f90a92d55105c8c95c0868d214c052950a9ee07e', class: "console-layout__logo-text", weight: "medium" }, this.logoText))), h("nav", { key: '464a016822f48f8da113344637652d17683282c1', "aria-label": this.navigationLabel, class: "console-layout__navigation" }, h("slot", { key: '50c2c1d0193fb7ca1778d5f581340667c255d251', name: "navigation" })), h("div", { key: '944122212602e40616c12fb44870c2064b363ae2', class: "console-layout__user" }, h("slot", { key: '4431a00144a149b62dd8d2885b55f22a7ab68c32', name: "user" }))), h("main", { key: '4faa140f198686c95145b0c9872ba2667ef5ef12', "aria-labelledby": Boolean(this.appName) ? "app-name" : undefined, class: "console-layout__main" }, h("header", { key: '8018aa787cb9a24e0872f2c583ec63282ad645ef', class: "console-layout__app-bar" }, h("span", { key: 'fc3efe0db3a7f6e405acbdf5796cc6d3b04d6315', class: "console-layout__mobile-navigation-button" }, h("swirl-button", { key: '527cc5ac3220dc75f9a596f2ba62802fa66cab8a', swirlAriaExpanded: String(this.sidebarActive), hideLabel: true, icon: this.sidebarActive
+        return (h(Host, { key: '0ae8f75f1b1453107bd9595fc3e6fba0c81924b7' }, h("div", { key: 'c564a56cb9b53636b15776124fc05f5b99898d51', class: className, onClick: this.onClick, onKeyDown: this.onKeyDown }, h("header", { key: '3fb9fd3aa92fef0aef34833e722f168ae378eca7', "aria-hidden": String(!this.sidebarActive), class: "console-layout__sidebar", ref: (el) => (this.sidebarEl = el) }, h("div", { key: '799e19bd775a44ab92fc84f34a433d5a3249f944', class: "console-layout__header" }, h("div", { key: 'a914ffe53baa687057b885bcd2967cfe1ffc3e00', class: "console-layout__logo" }, h("svg", { key: 'a413bb57cee87ed55e125377fbb4fca32c1c90d1', class: "console-layout__logo-mark", fill: "none", height: "26", viewBox: "0 0 16 26", width: "16", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '34fc711d9d779a50056329ad62e308f155b7c8d7', d: "M0.624238 14.0705C0.326496 13.5353 0.118077 12.9406 0.0287543 12.3161C-0.0307941 11.662 -0.0010199 11.0375 0.147851 10.4428C0.296722 9.84813 0.594464 9.25343 0.951754 8.77767C1.33882 8.27217 1.78543 7.85588 2.35114 7.55853L14.6181 0.362671C14.9159 0.8979 15.1243 1.4926 15.2136 2.11703C15.3029 2.74147 15.2434 3.3659 15.0945 3.99034C14.9456 4.58504 14.6479 5.17974 14.2906 5.6555C13.9035 6.16099 13.4569 6.57728 12.8912 6.87463L0.624238 14.0705Z", fill: "#145AF5" }), h("path", { key: '335a0240fa9a27db046eda7a42a4d168ad2b6ba5', d: "M3.69214 21.4743C3.3944 20.9391 3.18598 20.3444 3.09666 19.72C3.00733 19.0956 3.06688 18.4711 3.21575 17.8467C3.36462 17.252 3.66237 16.6573 4.01966 16.1815C4.40672 15.676 4.85333 15.2597 5.41904 14.9624L12.2076 10.9779C12.5053 11.5131 12.7137 12.1078 12.803 12.7323C12.8924 13.3567 12.8328 13.9811 12.6839 14.6056C12.5351 15.2003 12.2373 15.795 11.88 16.2707C11.493 16.7762 11.0464 17.1925 10.4807 17.4899L3.69214 21.4743Z", fill: "#145AF5" }), h("path", { key: '6503f6c4cf76c4c51b7f6445987986412daa8fe2', d: "M3.69141 21.4739L7.77047 19.0951C8.39573 20.1953 8.5446 21.5036 8.24686 22.7228C7.91934 23.9419 7.14521 24.9826 6.04357 25.6368L3.69141 21.4739Z", fill: "#80A8F4" }), h("path", { key: 'aa0cfa1f47d5c7924e7f6687d963c8d4c4f9b00e', d: "M12.2072 10.9785L7.32419 10.1459L0.625 14.0709L5.38887 14.9629L12.2072 10.9785Z", fill: "#80A8F4" })), h("swirl-text", { key: '67b8826fea6c6168449457ed853e747eb39167e6', class: "console-layout__logo-text", weight: "medium" }, this.logoText))), h("nav", { key: 'ceb73cea3d462e12de2063fb6a4738b3f22b6925', "aria-label": this.navigationLabel, class: "console-layout__navigation" }, h("slot", { key: '6b5ef2e19e53704f0c51421e52a63d56693700bf', name: "navigation" })), h("div", { key: '877036f65f6e66029d54efc8a471353629044aff', class: "console-layout__user" }, h("slot", { key: '110525ea4f0d47aed61a572cfa988d58883686ac', name: "user" }))), h("main", { key: 'ef3ab0d75901a1eee091d2893244347ab28beebd', "aria-labelledby": Boolean(this.appName) ? "app-name" : undefined, class: "console-layout__main" }, h("header", { key: '92dede77f656be58c606597751574f448d0a3c13', class: "console-layout__app-bar" }, h("span", { key: '24eea696baae959296f2aef6499a202bbe291da8', class: "console-layout__mobile-navigation-button" }, h("swirl-button", { key: 'dc4a6d5cd66358ffed6e979e8afeb687272b8745', swirlAriaExpanded: String(this.sidebarActive), hideLabel: true, icon: this.sidebarActive
                 ? "<swirl-icon-close></swirl-icon-close>"
                 : "<swirl-icon-menu></swirl-icon-menu>", label: this.sidebarActive
                 ? this.hideNavigationButtonLabel
-                : this.showNavigationButtonLabel, onClick: this.onMobileNavigationToggleClick })), h("div", { key: '31bcc34e76b8e2ecbaf3efe113a2ff7049b1a53e', class: "console-layout__app-name" }, this.appName && (h("swirl-heading", { key: '750381b7ec70425a7273e044dcffe56f5fde531e', as: "h1", headingId: "app-name", level: 4, text: this.appName }))), this.showHelpButton && (h("swirl-button", { key: 'ed27a60536922ab5d4b090f8c16eca13f6229cd5', class: "console-layout__help-button", hideLabel: true, icon: "<swirl-icon-help></swirl-icon-help>", label: this.helpButonLabel, onClick: this.onHelpButtonClick }))), h("section", { key: 'cc460b3569b0374ce66a0f99340ce78757eb4f3d', "aria-labelledby": "heading", class: "console-layout__content", style: contentStyles }, h("header", { key: '96dcaa37ce999b28ab0ee79dd2666be5b767a52d', class: "console-layout__content-header" }, this.showBackButton && (h("swirl-button", { key: '3064b53bb893025d9b06735141d6e8a51e875d62', class: "console-layout__back-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButonLabel, onClick: this.onBackButtonClick })), Boolean(this.heading) && (h("div", { key: '5dfa2758a8c5fd4fc948b4f8ae47771c258c2504', class: "console-layout__heading-container" }, h("swirl-heading", { key: '8e8e424a64d2dba7fe3d7bcc2b3fbf1d5720cce3', as: Boolean(this.appName) ? "h2" : "h1", class: "console-layout__heading", headingId: "heading", level: 1, text: this.heading }), this.subheading && (h("swirl-text", { key: '1a205ffa5656e54694e9a5ebd473deb13e8cda63', class: "console-layout__subheading", color: "subdued" }, this.subheading)))), !Boolean(this.heading) && (h("div", { key: '45cfad7e3a73a24b706bc6de72e5b4538689d547', class: "console-layout__heading-container" }, h("slot", { key: '4bb9af958085eef1d3d0ccf5316a61970e1b868d', name: "heading" }))), h("div", { key: 'bca5a2d4b523ce3f0b67368f706e789fe4f16cf9', class: "console-layout__content-header-tools" }, h("slot", { key: '329f7aa06d88aca384edb588f99211516a0f1732', name: "content-header-tools" }))), h("div", { key: 'ccec77529ef2e372a93c3bc589a05b3ba922e554', class: "console-layout__integration" }, h("slot", { key: 'c481583d21cf05aee6111ee64a5a3980bc218815', name: "content" }))), h("div", { key: '1d958ad52810aba7e587e02e3f40caae9c8b871e', class: "console-layout__overlays" }, h("slot", { key: 'f8397ebf73eaef4c1cf592cc823c2e7ba459295a', name: "overlays" }))))));
+                : this.showNavigationButtonLabel, onClick: this.onMobileNavigationToggleClick })), h("div", { key: '4d377f51a2e18350363a214d199a4935f16a9c16', class: "console-layout__app-name" }, this.appName && (h("swirl-heading", { key: 'fc62ac85402e2ec79958c1c2ba81d3cfc07c52d5', as: "h1", headingId: "app-name", level: 4, text: this.appName }))), this.showHelpButton && (h("swirl-button", { key: '898a87ca39e0fd4786ecd80418c99793cc9e15bb', class: "console-layout__help-button", hideLabel: true, icon: "<swirl-icon-help></swirl-icon-help>", label: this.helpButonLabel, onClick: this.onHelpButtonClick }))), h("section", { key: '8e15f85881e119b76ab1c42422503e7bd98610ca', "aria-labelledby": "heading", class: "console-layout__content", style: contentStyles }, h("header", { key: 'ccf7435dd21a960e090eb72d173020efa36b9124', class: "console-layout__content-header" }, this.showBackButton && (h("swirl-button", { key: 'a58c3ebbb9a664ad9079670785289c0601643131', class: "console-layout__back-button", hideLabel: true, icon: "<swirl-icon-arrow-back></swirl-icon-arrow-back>", label: this.backButonLabel, onClick: this.onBackButtonClick })), Boolean(this.heading) && (h("div", { key: '5b7f51a49cce3f48f302b20db15a0924196580fc', class: "console-layout__heading-container" }, h("swirl-heading", { key: '54105137aafd04bc66d8afd636e6f62a03185721', as: Boolean(this.appName) ? "h2" : "h1", class: "console-layout__heading", headingId: "heading", level: 1, text: this.heading }), this.subheading && (h("swirl-text", { key: '125c91a8511bf13e26352d1696903ac59aeb9ecc', class: "console-layout__subheading", color: "subdued" }, this.subheading)))), !Boolean(this.heading) && (h("div", { key: '01bdf66bbd8110c5ba15c05579c60e3810b9e5ae', class: "console-layout__heading-container" }, h("slot", { key: '7683e7bf782f871455156501d96326c481d73847', name: "heading" }))), h("div", { key: '48d4e6abd947e58218a2a5172b0763d0a901810f', class: "console-layout__content-header-tools" }, h("slot", { key: 'b24eae7b370b1f0e7a0d88728ca60bed8cc10490', name: "content-header-tools" }))), h("div", { key: '5f07afe14c3961b31be303e178b55ab89ffb067a', class: "console-layout__integration" }, h("slot", { key: '78a281174feed87fdd6d7e4058354a172a3d7503', name: "content" }))), h("div", { key: 'dcafe77c3a567421c6767ed25296a996d9be8bd5', class: "console-layout__overlays" }, h("slot", { key: 'b49840f2799837b192233223c0d6cbd2e58291cf', name: "overlays" }))))));
     }
     static get is() { return "swirl-console-layout"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-date-input/swirl-date-input.js

@@ -148,7 +148,7 @@ export class SwirlDateInput {
         const className = classnames("date-input", {
             "date-input--inline": this.inline,
         });
-        return (h(Host, { key: '26b9892a5e3fae38fec3765acd1bf2b0e8a9469e' }, h("div", { key: 'de5e001a177a11dcf26e16fd33b200d540219a7f', class: className }, h("input", { key: '56c7850f8450d515071fc7048734e17613022b8e', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "date-input__input", disabled: this.disabled, readonly: this.readonly, id: this.id, inputmode: "numeric", onClick: this.onClick, onMouseDown: this.onMouseDown, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), h("swirl-popover-trigger", { key: '9d3478ef10479c70618fe42f25081d5f22479ca3', swirlPopover: `popover-${this.id}` }, h("button", { key: '3f127344240be8e6c75711010f23bed98a9184e5', "aria-label": this.datePickerTriggerLabel, class: "date-input__date-picker-button", disabled: this.disabled, type: "button" }, h("swirl-icon-today", { key: '94d6af1ef3352a515daa8ed14200bdcc769090e4', size: this.iconSize })))), !this.disabled && (h("swirl-popover", { key: '8ddd0949962ee343f2f52d45ca97ec7cb73e8bee', animation: "scale-in-y", id: `popover-${this.id}`, label: this.datePickerLabel, placement: "bottom-end", ref: (el) => (this.pickerPopover = el) }, h("swirl-date-picker", { key: '14fd07de748cb88b79dc3318d1160fd58645d439', disableDate: this.datePickerDisableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onValueChange: this.onPickDate, value: dateValue, startDate: dateValue })))));
+        return (h(Host, { key: '296c03693dedf618c9f897027d1f18c37d7570cc' }, h("div", { key: '1cebccc9e07c74ba99250df57ce53385cc7422dd', class: className }, h("input", { key: 'f751cb69404907a1e203396d559db8e7b4591007', "aria-describedby": this.swirlAriaDescribedby, "aria-disabled": this.disabled ? "true" : undefined, "aria-invalid": ariaInvalid, autoFocus: this.autoFocus, class: "date-input__input", disabled: this.disabled, readonly: this.readonly, id: this.id, inputmode: "numeric", onClick: this.onClick, onMouseDown: this.onMouseDown, onFocus: this.onFocus, onBlur: this.onBlur, onInput: this.onInput, placeholder: this.placeholder, ref: (el) => (this.inputEl = el), required: this.required, type: "text", value: displayValue }), h("swirl-popover-trigger", { key: 'dcbd828da70c00ac11ae35c278a793e5225e80f4', swirlPopover: `popover-${this.id}` }, h("button", { key: 'ba359bdb631eb2c327f9660d08e9ee28e4e7db37', "aria-label": this.datePickerTriggerLabel, class: "date-input__date-picker-button", disabled: this.disabled, type: "button" }, h("swirl-icon-today", { key: '144aed4c8e6768e3b3f3e4ea73a1b45688329205', size: this.iconSize })))), !this.disabled && (h("swirl-popover", { key: '76dd883b51dbc595e282019774751455fcd778d9', animation: "scale-in-y", id: `popover-${this.id}`, label: this.datePickerLabel, placement: "bottom-end", ref: (el) => (this.pickerPopover = el) }, h("swirl-date-picker", { key: '80f4b71f88f43b21fb8bd54e3486ad27e485eb37', disableDate: this.datePickerDisableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onValueChange: this.onPickDate, value: dateValue, startDate: dateValue })))));
     }
     static get is() { return "swirl-date-input"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/swirl-date-picker/swirl-date-picker.js

@@ -27,7 +27,7 @@ export class SwirlDatePicker {
         const startDate = this.startDate instanceof Date
             ? getISODateString(this.startDate)
             : undefined;
-        return (h(Host, { key: '60477c7f4c8b070eb05fc2ca95d4c79371cefc7f', onClick: this.onClick }, h("wc-datepicker", { key: '5f29d33b72e91e3704084584eb92ba5cba3fdf31', elementClassName: "date-picker", disableDate: this.disableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onSelectDate: this.onSelectDate, range: this.range, startDate: startDate, value: this.value })));
+        return (h(Host, { key: '0093f697e6cfa16a93f03398dcbe0a7015b59a9d', onClick: this.onClick }, h("wc-datepicker", { key: '92520400d69485b339666e15138ba396a4270bea', elementClassName: "date-picker", disableDate: this.disableDate, firstDayOfWeek: this.firstDayOfWeek, labels: this.labels, locale: this.locale, onSelectDate: this.onSelectDate, range: this.range, startDate: startDate, value: this.value })));
     }
     static get is() { return "swirl-date-picker"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-description-list/swirl-description-list.js

@@ -4,7 +4,7 @@ import { h, Host } from "@stencil/core";
  */
 export class SwirlDescriptionList {
     render() {
-        return (h(Host, { key: 'dfbe1eeee244562cf21081f8afdab228c71e9606' }, h("div", { key: '5dea91c004cbb228d936ad6b0c816df6f882f2a3', class: "description-list", role: "list" }, h("slot", { key: 'a1125b0550e285ca6266209fb9c89937d7eec121' }))));
+        return (h(Host, { key: 'a3087fa2e0e84ac2bc6f4cd5a27a98d945cdff0d' }, h("div", { key: '8dc9916ad4cf9dd8284fc24e96178af3586b6210', class: "description-list", role: "list" }, h("slot", { key: 'dd319d9649ded0a1fb44ffd536586f0b43c6278f' }))));
     }
     static get is() { return "swirl-description-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-description-list-item/swirl-description-list-item.js

@@ -20,7 +20,7 @@ export class SwirlDescriptionListItem {
             "description-list-item--has-additional-content": hasAdditionalContent,
             "description-list-item--has-tools": hasTools,
         });
-        return (h(Host, { key: '046474e3e80fdfc00205ace857b62a72cc1dcb9b', role: "listitem" }, h("div", { key: 'eea995f79fb12f64b80d98533513fa664c24ac85', class: className, part: "description-list-item", role: "group" }, h("div", { key: '68fcb08a0222b1bd3dce0129cf94e4f739df7882', class: "description-list-item__inner" }, h("div", { key: '60f1792fb07463cb2fefdc5e3798abe19ac2ac02', class: "description-list-item__text-container" }, h("div", { key: '04c89bac1a2dc3c48c355864ac093b3f70c63d4b', class: "description-list-item__term", part: "description-list-item__term", role: "term" }, this.term, this.tooltip && (h("span", { key: 'ddcebb1554511ab747499a05466fdee242aecee7', class: "description-list-item__tooltip" }, h("swirl-tooltip", { key: '52f5032fcb2aed1df7171a0e72e0f7258b5a8c62', content: this.tooltip, position: "right" }, h("swirl-icon-info", { key: '01988fe94a11f056ba67703bf1121c51a4450969', size: 16, tabIndex: 0 }))))), h("div", { key: 'd07c805bd0b0b0f1292104edb7d54df0292bd68e', style: { maxWidth: this.maxWidth }, class: "description-list-item__description", role: "definition" }, h("slot", { key: 'd45e175808e96ebfa82c4f8b0ccb370602b5500f' }))), h("div", { key: '533e5b037d8879b08cfd7cb95c549120bb1bd97b', class: "description-list-item__tools" }, h("slot", { key: 'bf30240e82b671bc719b554bfd15e20746b03f06', name: "tools" }))), h("div", { key: 'c992222b8e453b61bfaeb008c21d35f5aea78690', class: "description-list-item__additional-content" }, h("slot", { key: '8e079034dc5228467e9f837999b883b0077fbb53', name: "additional-content" })))));
+        return (h(Host, { key: '86a9819f8575ee077bafc2330d30dbefc4751de9', role: "listitem" }, h("div", { key: '9942a358bcfc63f4945bb271e1d8cd92cd5c2818', class: className, part: "description-list-item", role: "group" }, h("div", { key: '44eac486a8b2beec67c155149d92b92045b54c11', class: "description-list-item__inner" }, h("div", { key: 'f5734b0551dadd683497a7d12eb3db1b87360c34', class: "description-list-item__text-container" }, h("div", { key: '549de9e411868b1d9172bcab2885973ba6a5cbd0', class: "description-list-item__term", part: "description-list-item__term", role: "term" }, this.term, this.tooltip && (h("span", { key: '417a7c7de8b695eb40aa5bcd8e7a2492059590f3', class: "description-list-item__tooltip" }, h("swirl-tooltip", { key: '0ace06c1790d424ec599fa627e72a3acc233bb1b', content: this.tooltip, position: "right" }, h("swirl-icon-info", { key: '568c20c31efbc8bac557018f3263e143ba8be609', size: 16, tabIndex: 0 }))))), h("div", { key: 'cdd182789293f2f40842f76640c7e9a1b12b0655', style: { maxWidth: this.maxWidth }, class: "description-list-item__description", role: "definition" }, h("slot", { key: '875978a53447d99a3c47df8712b9715e980068fa' }))), h("div", { key: 'f1fdcd16180963875c5c0da46ab2c375799a3ad5', class: "description-list-item__tools" }, h("slot", { key: '3abef1527c0a751c1eb4518c9824ce543567fe35', name: "tools" }))), h("div", { key: '185db9ca6d1e5bd613fb4fb376133864f58de13a', class: "description-list-item__additional-content" }, h("slot", { key: '0e7e0497bd74c651963c1505ba6db4ca0aaf7902', name: "additional-content" })))));
     }
     static get is() { return "swirl-description-list-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-emoji/emojis/swirl-emoji-clap.js

@@ -8,7 +8,7 @@ export class SwirlEmojiClap {
     }
     render() {
         const className = classnames("emoji", `emoji--size-${this.size}`);
-        return (h(Fragment, { key: 'e42db4fb9fa2311d179e56fdb5a6bd68bc5952fc' }, this.size === 16 && (h("img", { key: '4fd3c9faeb99124d610ca832013d531706200c37', alt: this.label, class: className, height: "16", src: "emojis/Clap16.png", width: "16" })), this.size === 20 && (h("img", { key: 'f68a6dc5107a7fbfa20f29e109f41468cb324fa2', alt: this.label, class: className, height: "20", src: "emojis/Clap20.png", width: "20" })), this.size === 24 && (h("img", { key: '39960d53b6fc830a8c54606d127811afc5d7fd58', alt: this.label, class: className, height: "24", src: "emojis/Clap24.png", width: "24" })), this.size === 32 && (h("img", { key: 'e62cafc0f4d2e686f1c7e3d8b257ba0de9401967', alt: this.label, class: className, height: "32", src: "emojis/Clap32.png", width: "32" }))));
+        return (h(Fragment, { key: 'bcec502f8afd9496dcb9013ea7e468eb76e80b87' }, this.size === 16 && (h("img", { key: '610fe681a08cff28ca7a0779ca7a8a7b8f8c227f', alt: this.label, class: className, height: "16", src: "emojis/Clap16.png", width: "16" })), this.size === 20 && (h("img", { key: 'bb659a724f4f67887281a8d495b5ecb819086744', alt: this.label, class: className, height: "20", src: "emojis/Clap20.png", width: "20" })), this.size === 24 && (h("img", { key: 'f2295aa1940879557e71f9b3d99d871f7ac2ab60', alt: this.label, class: className, height: "24", src: "emojis/Clap24.png", width: "24" })), this.size === 32 && (h("img", { key: '14949538ce9b84cb9b0973c3b089e7f30445a8f0', alt: this.label, class: className, height: "32", src: "emojis/Clap32.png", width: "32" }))));
     }
     static get is() { return "swirl-emoji-clap"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-emoji/emojis/swirl-emoji-happy.js

@@ -8,7 +8,7 @@ export class SwirlEmojiHappy {
     }
     render() {
         const className = classnames("emoji", `emoji--size-${this.size}`);
-        return (h(Fragment, { key: 'ce4e0422011aafe57034c71bd1647c10c4bc2383' }, this.size === 16 && (h("img", { key: '1e3da507671390c2ef319d37626c49a988c3ac6e', alt: this.label, class: className, height: "16", src: "emojis/Happy16.png", width: "16" })), this.size === 20 && (h("img", { key: 'b5f769b9be4c583d1fb99d263950e9efde2e6f8f', alt: this.label, class: className, height: "20", src: "emojis/Happy20.png", width: "20" })), this.size === 24 && (h("img", { key: '830eb97722bd22d3bbe8c91ea67b119007f306f4', alt: this.label, class: className, height: "24", src: "emojis/Happy24.png", width: "24" })), this.size === 32 && (h("img", { key: 'ba345b48b6a87837bfdbbcff5e33fbab02bfc93b', alt: this.label, class: className, height: "32", src: "emojis/Happy32.png", width: "32" }))));
+        return (h(Fragment, { key: 'bf61031b2354fd68ebdb9b68492a6ebe9245dd75' }, this.size === 16 && (h("img", { key: 'ad7c462fb1cbc4ae7bdb376f9684ebcc64c91656', alt: this.label, class: className, height: "16", src: "emojis/Happy16.png", width: "16" })), this.size === 20 && (h("img", { key: 'e8d8ca87d588895b80cc744c39b4f3923b52d89f', alt: this.label, class: className, height: "20", src: "emojis/Happy20.png", width: "20" })), this.size === 24 && (h("img", { key: '85dab1a3aed8f8b0e45c18ba16e41ce15abd8e79', alt: this.label, class: className, height: "24", src: "emojis/Happy24.png", width: "24" })), this.size === 32 && (h("img", { key: 'aea5a2a2a336d845353c13a3abbfc1f22ea89b2a', alt: this.label, class: className, height: "32", src: "emojis/Happy32.png", width: "32" }))));
     }
     static get is() { return "swirl-emoji-happy"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-emoji/emojis/swirl-emoji-idea.js

@@ -8,7 +8,7 @@ export class SwirlEmojiIdea {
     }
     render() {
         const className = classnames("emoji", `emoji--size-${this.size}`);
-        return (h(Fragment, { key: '05cd2d3621ab09ceeae8045f836d03d8c95eb864' }, this.size === 16 && (h("img", { key: 'ef474446c3da264e58d2ea23f1333dbccbedca73', alt: this.label, class: className, height: "16", src: "emojis/Idea16.png", width: "16" })), this.size === 20 && (h("img", { key: '21d52ddd8d61be7f94a96569d416c506fda789e6', alt: this.label, class: className, height: "20", src: "emojis/Idea20.png", width: "20" })), this.size === 24 && (h("img", { key: 'bff3aea97aabad6851b245a73db95c33411f7e81', alt: this.label, class: className, height: "24", src: "emojis/Idea24.png", width: "24" })), this.size === 32 && (h("img", { key: 'd05b05dea846c9bf511ca4a407fac8983870a9f8', alt: this.label, class: className, height: "32", src: "emojis/Idea32.png", width: "32" }))));
+        return (h(Fragment, { key: '9b1724279d1ed9330455e9e53b83e659a029d1a5' }, this.size === 16 && (h("img", { key: 'e1f4620d781dfdb0a11a38487f43aedfb1305206', alt: this.label, class: className, height: "16", src: "emojis/Idea16.png", width: "16" })), this.size === 20 && (h("img", { key: '15c982d76f630c390bf0c2d5537fa137d9ceaec7', alt: this.label, class: className, height: "20", src: "emojis/Idea20.png", width: "20" })), this.size === 24 && (h("img", { key: '6d77bdbe92d54ab8453b00eb18e3a8c83ee01bfd', alt: this.label, class: className, height: "24", src: "emojis/Idea24.png", width: "24" })), this.size === 32 && (h("img", { key: '64482481062d545d660557efd9c1ab3164e99ff9', alt: this.label, class: className, height: "32", src: "emojis/Idea32.png", width: "32" }))));
     }
     static get is() { return "swirl-emoji-idea"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-emoji/emojis/swirl-emoji-love.js

@@ -8,7 +8,7 @@ export class SwirlEmojiLove {
     }
     render() {
         const className = classnames("emoji", `emoji--size-${this.size}`);
-        return (h(Fragment, { key: 'c52eaa2b1e538d3e0c1fd45ab170b713926ac997' }, this.size === 16 && (h("img", { key: '12eceb0ae6681e20ca0fbdf290829059e23e2849', alt: this.label, class: className, height: "16", src: "emojis/Love16.png", width: "16" })), this.size === 20 && (h("img", { key: '2a05e405053a75818f8c175b5f67f0c2a51dca97', alt: this.label, class: className, height: "20", src: "emojis/Love20.png", width: "20" })), this.size === 24 && (h("img", { key: '78b4a41d5d728e4beb8807c8527ac36f3fb8d4ef', alt: this.label, class: className, height: "24", src: "emojis/Love24.png", width: "24" })), this.size === 32 && (h("img", { key: 'de7453e06e048a6ffa1dd6e129cbfe09539a1119', alt: this.label, class: className, height: "32", src: "emojis/Love32.png", width: "32" }))));
+        return (h(Fragment, { key: 'a86c56fb8380765179fbc57e7e714ba46361bfde' }, this.size === 16 && (h("img", { key: 'be976119212c75951f51381c5e23f9972e6315cb', alt: this.label, class: className, height: "16", src: "emojis/Love16.png", width: "16" })), this.size === 20 && (h("img", { key: '80eb454155db7fdb991d52b0df25b3df1c53d9fa', alt: this.label, class: className, height: "20", src: "emojis/Love20.png", width: "20" })), this.size === 24 && (h("img", { key: 'd316efb54c4439cba229e4f70e31d493e213e41b', alt: this.label, class: className, height: "24", src: "emojis/Love24.png", width: "24" })), this.size === 32 && (h("img", { key: '3ac4dc6bd5982681b3d2032287704e6c8b6a216c', alt: this.label, class: className, height: "32", src: "emojis/Love32.png", width: "32" }))));
     }
     static get is() { return "swirl-emoji-love"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-emoji/emojis/swirl-emoji-sad.js

@@ -8,7 +8,7 @@ export class SwirlEmojiSad {
     }
     render() {
         const className = classnames("emoji", `emoji--size-${this.size}`);
-        return (h(Fragment, { key: '34a27c7f2b27c57477bdd1aef1e421ffe2da1993' }, this.size === 16 && (h("img", { key: 'da8ef3561f59f63440cd36961ea68fd5c83aa3f8', alt: this.label, class: className, height: "16", src: "emojis/Sad16.png", width: "16" })), this.size === 20 && (h("img", { key: '59235682bf90aa00497340e71f5913a89ca210e6', alt: this.label, class: className, height: "20", src: "emojis/Sad20.png", width: "20" })), this.size === 24 && (h("img", { key: '408538ed9f89fa5735ec358999a8e85051ca6e9c', alt: this.label, class: className, height: "24", src: "emojis/Sad24.png", width: "24" })), this.size === 32 && (h("img", { key: '62b0bfb3006105300d44b504bf2dc0aa418fc2bb', alt: this.label, class: className, height: "32", src: "emojis/Sad32.png", width: "32" }))));
+        return (h(Fragment, { key: '9d0eacd9db0d58cc7269e34a5cd80f63baf66fa3' }, this.size === 16 && (h("img", { key: 'd31c43942ec596cb00c74303f2bc16088f93a9c3', alt: this.label, class: className, height: "16", src: "emojis/Sad16.png", width: "16" })), this.size === 20 && (h("img", { key: '8f324fd629244b7dd928f04c4aa48ba689efe951', alt: this.label, class: className, height: "20", src: "emojis/Sad20.png", width: "20" })), this.size === 24 && (h("img", { key: '78a6aca038bb5944fcd6f5033a6be2520c4d6820', alt: this.label, class: className, height: "24", src: "emojis/Sad24.png", width: "24" })), this.size === 32 && (h("img", { key: 'a3e763bcddb38a85e5ecdf5fe2d8eff5c54c08ee', alt: this.label, class: className, height: "32", src: "emojis/Sad32.png", width: "32" }))));
     }
     static get is() { return "swirl-emoji-sad"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-emoji/emojis/swirl-emoji-thumbs-up.js

@@ -8,7 +8,7 @@ export class SwirlEmojiThumbsUp {
     }
     render() {
         const className = classnames("emoji", `emoji--size-${this.size}`);
-        return (h(Fragment, { key: 'df1d5169ef542e12a0dca9bed71f010b59d3ae23' }, this.size === 16 && (h("img", { key: '6355e3c143f14df40d9322bc74cf9cde8fd0fac6', alt: this.label, class: className, height: "16", src: "emojis/ThumbsUp16.png", width: "16" })), this.size === 20 && (h("img", { key: 'd4f1045965aaa11e6a629f6db275de80dcd89e54', alt: this.label, class: className, height: "20", src: "emojis/ThumbsUp20.png", width: "20" })), this.size === 24 && (h("img", { key: '62217e81edbfd4c26ca087e0a833dd9f3c89a874', alt: this.label, class: className, height: "24", src: "emojis/ThumbsUp24.png", width: "24" })), this.size === 32 && (h("img", { key: '36afccaf42a2073d1afa89026db665c34ec971de', alt: this.label, class: className, height: "32", src: "emojis/ThumbsUp32.png", width: "32" }))));
+        return (h(Fragment, { key: 'a6810f4f905d3af572ab0494b5e8d33270981073' }, this.size === 16 && (h("img", { key: 'dd35f229ab1a1df1be7b23bf02eaa9766069b83b', alt: this.label, class: className, height: "16", src: "emojis/ThumbsUp16.png", width: "16" })), this.size === 20 && (h("img", { key: '0adde72d9e66514fd1d8b088b69464e95f3ce126', alt: this.label, class: className, height: "20", src: "emojis/ThumbsUp20.png", width: "20" })), this.size === 24 && (h("img", { key: '35741e09b0057331ee7fb844b0c80815fd811b8d', alt: this.label, class: className, height: "24", src: "emojis/ThumbsUp24.png", width: "24" })), this.size === 32 && (h("img", { key: 'f2ed2d95f15409673910b4ed56f24fd4c97e7fd9', alt: this.label, class: className, height: "32", src: "emojis/ThumbsUp32.png", width: "32" }))));
     }
     static get is() { return "swirl-emoji-thumbs-up"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-emoji/swirl-emoji.js

@@ -7,7 +7,7 @@ export class SwirlEmoji {
     }
     render() {
         const Tag = `swirl-emoji-${this.name}`;
-        return (h(Host, { key: '6a90c47f7fac16749701fc7565f68c1342b6ab94' }, h(Tag, { key: '0f2bab071f09b8ede064fc4c87bc4fcbca233372', label: this.label, size: this.size })));
+        return (h(Host, { key: 'b1eabfadcc13db1e9ac7860fd9eada649676c954' }, h(Tag, { key: 'e58263c674090a0650ce8d63f4a36501a701c8d8', label: this.label, size: this.size })));
     }
     static get is() { return "swirl-emoji"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-empty-state/swirl-empty-state.js

@@ -17,7 +17,7 @@ export class SwirlEmptyState {
             "empty-state--has-controls": hasControls,
             "empty-state--has-slotted-illustration": hasSlottedIllustration,
         });
-        return (h(Host, { key: 'a0d70dc213a678eda5d05f45689b2fc4b3ef79e2' }, h("div", { key: '44fa906829f09913cc82b248f4a448a8237c4aa8', class: className }, this.illustration && !hasSlottedIllustration && (h("img", { key: 'd237ad9abdde16dbd1f17679e14add428e1b0a1a', alt: "", class: "empty-state__illustration", src: this.illustration })), h("div", { key: '2f2de9f4e52914bdef003a0eedd4f8341d3d07cf', class: "empty-state__slotted-illustration" }, h("slot", { key: 'b558d0eb8e17191c3db69112b94c8136cebf2de9', name: "illustration" })), h("div", { key: '990b6cb4126983bfe626f63051e1795dbe837024', class: "empty-state__body" }, h("swirl-stack", { key: '6cbd0524e0405222e8abd858adb3784ad43433e1', align: "stretch", spacing: "8" }, this.heading && (h("swirl-heading", { key: 'a8adbbdb32817f49f21388bb3179204375106cc3', align: "center", as: "p", level: 4, text: this.heading })), h("div", { key: '91e61734540d630c694b6e2ccd955eaadf52c43f', class: "empty-state__content" }, h("swirl-text", { key: 'f2d057bc75c306d4c5ac8f0cb36d5a1d639ed83a', align: "center", color: "subdued" }, h("slot", { key: '9928d7b7f10f951b4f2544c15c15a8cc2a2ad283' })))), h("div", { key: 'ca118d3d46669cb7697075841c1ceb0380d07c0d', class: "empty-state__controls" }, h("slot", { key: 'de5e87f0bb8dfe6b5c39e39ed882b901e37e9f4b', name: "controls" }))))));
+        return (h(Host, { key: '54b579115aeba928aba14cfa789f81eadf19621e' }, h("div", { key: 'bb0d6bac2319179d9b43ab5469070381c4712946', class: className }, this.illustration && !hasSlottedIllustration && (h("img", { key: '733fadb95e8458568c9ddee523007a9371ca8a84', alt: "", class: "empty-state__illustration", src: this.illustration })), h("div", { key: '5b610e75de57a6707c3364e98daa6753b225951f', class: "empty-state__slotted-illustration" }, h("slot", { key: '275f7e216aaef0ae125e3a14ec59eda421edd9cd', name: "illustration" })), h("div", { key: '7e74bb0f0ed09837a5c5e6ed0436500db01b2665', class: "empty-state__body" }, h("swirl-stack", { key: '41693a74c9c846ca6dc9ed442a4ac0a713e363e2', align: "stretch", spacing: "8" }, this.heading && (h("swirl-heading", { key: '6b0d9fcf395ab3f60eef3e720560b0798a54e6c6', align: "center", as: "p", level: 4, text: this.heading })), h("div", { key: 'b0fc78406d23677dc98af4693fd12cd6c660f9d4', class: "empty-state__content" }, h("swirl-text", { key: 'aa9758dac037121b31f74dab447f5bba1fcce722', align: "center", color: "subdued" }, h("slot", { key: '667812460bcb12a6b9f36f6108e06c0f697100ef' })))), h("div", { key: '0955fc5e757fd56dec7a373525c49437ce433169', class: "empty-state__controls" }, h("slot", { key: 'b7fd277568939ab5bac06987945a15a2a1f2e125', name: "controls" }))))));
     }
     static get is() { return "swirl-empty-state"; }
     static get encapsulation() { return "shadow"; }