@getflip/swirl-components 0.403.0 → 0.405.0

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

@@ -172,24 +172,24 @@ export class SwirlShellLayout {
             "shell-layout--mobile-navigation-active": this.mobileNavigationActive,
             "shell-layout--navigation-collapsed": mainNavCollapsed,
         });
-        return (h(Host, { key: 'ac0578479f30601b4688d075825dd8ced90b1db9' }, h("div", { key: 'ab0d178f91b637ee206dba90513e272342ee0a1d', class: className }, h("header", { key: 'dafaff26074b663a0deb51852b770527e0658db1', class: "shell-layout__header", "data-tauri-drag-region": "true" }, h("button", { key: '8a0279d36c6d7ceee1106e78ab86b9aadbd0a1d2', class: "shell-layout__skip-link", onClick: this.skipLinkClick.emit, type: "button" }, this.skipLinkLabel), h("div", { key: '006dd289f6d498e8c71b2e4e7710e4f4b5b4041f', class: "shell-layout__header-left" }, h("swirl-tooltip", { key: '26f1372a20ea2f9478a178eb3ae879d410bf579c', content: this.navigationCollapsed
+        return (h(Host, { key: 'ba71850ab25187477de0fd280333491e17aa507e' }, h("div", { key: '1783f51de5c40b6b58a8c351c12259dcf360eb8b', class: className }, h("header", { key: '60e343ccfcab61ac22310c7cb49a27cf545d5bd2', class: "shell-layout__header", "data-tauri-drag-region": "true" }, h("button", { key: 'add3019d8df87297e691ceadd0e9a608207a4c02', class: "shell-layout__skip-link", onClick: this.skipLinkClick.emit, type: "button" }, this.skipLinkLabel), h("div", { key: '8aeeebda57bcf6b99806896d3e77a29c577ef64b', class: "shell-layout__header-left" }, h("swirl-tooltip", { key: '8c76fce6027707fc32c50d2628a82954fc9b948c', content: this.navigationCollapsed
                 ? this.expandNavigationButtonLabel
-                : this.collapseNavigationButtonLabel, delay: 100, position: "right" }, h("button", { key: '2fec7ce6950380825e56032cff633bd062b60fad', class: "shell-layout__header-tool", onClick: this.onNavigationToggleClick, type: "button" }, this.navigationCollapsed ? (h("swirl-icon-dock-left-expand", { size: 20 })) : (h("swirl-icon-dock-left-collapse", { size: 20 })), h("swirl-visually-hidden", { key: '32918f06901b10833bd0714d9df4ad11f85e674f' }, this.navigationCollapsed
+                : this.collapseNavigationButtonLabel, delay: 100, position: "right" }, h("button", { key: 'ac3db57bb52dd17e08e429e6a322c854367bcc63', class: "shell-layout__header-tool", onClick: this.onNavigationToggleClick, type: "button" }, this.navigationCollapsed ? (h("swirl-icon-dock-left-expand", { size: 20 })) : (h("swirl-icon-dock-left-collapse", { size: 20 })), h("swirl-visually-hidden", { key: '74a9b9f0f625c3cf1ecd4d54d6da9e7820e4fe79' }, this.navigationCollapsed
             ? this.expandNavigationButtonLabel
-            : this.collapseNavigationButtonLabel))), h("a", { key: '82634878be0c0cc9223fb3b94cbc25bf63adf005', class: "shell-layout__header-tool", href: "javascript:history.back()" }, h("swirl-icon-arrow-back", { key: '76e10e8a85d9c133a6c418e16e2aae46d6d735d9', size: 20 }), h("swirl-visually-hidden", { key: '9456a122d1264fa793548957eaace4d2b159fff2' }, this.browserBackButtonLabel)), h("a", { key: '80f911686ced6bd0335899a39868795e03c3908c', class: "shell-layout__header-tool", href: "javascript:history.forward()" }, h("swirl-icon-arrow-forward", { key: 'a11e0d5f22e9015185047d4bd3bd1d6d1bcb0b46', size: 20 }), h("swirl-visually-hidden", { key: 'be0558e4d6138576139296953f329f095fcec031' }, this.browserForwardButtonLabel)), h("slot", { key: '452127f3d2a0d91c58c2b9396be90dff9e8b2522', name: "left-header-tools" })), h("div", { key: '7b837e13bca9e7efe2af2673e569d5347bfe809d', class: "shell-layout__logo" }, h("slot", { key: '8782475ecf38ec1cbff3c4c62546b2f31ce4c429', name: "logo" })), h("div", { key: '7078a0d447369173495eae8aea9b2bcaed4d380a', class: "shell-layout__header-right" }, h("slot", { key: '4de25df2ffceda31c0ea36373dd816e3ec6956d5', name: "right-header-tools" }), h("slot", { key: '82c2cc3b4e5791d6ddabaa59c8a1e3c88b6032b9', name: "avatar" }))), h("div", { key: '99c7a6e5062767eeae9bca0a76b9dbb93673182f', class: "shell-layout__mobile-nav-backdrop", onClick: this.onNavigationClick }), h("nav", { key: '4b26bd504364711d75421041e1fd7a4416cb83ed', "aria-labelledby": "main-navigation-label", class: "shell-layout__nav", onClick: this.onNavigationClick, ref: (el) => (this.navElement = el) }, h("div", { key: '104f827b6569c1a7831716e2e65499f6aab17243', class: "shell-layout__mobile-header" }, h("slot", { key: 'f4100ec98a0bc08032000ea3d6cbd9c000c898e8', name: "mobile-logo" }), h("div", { key: '63acb9e4b06d42dd0902f38f22e06467a5e17d5c', class: "shell-layout__mobile-header-tools" }, h("slot", { key: '700de4947f2db176bd6ae6fb5bce2379a9eb5741', name: "mobile-header-tools" }), h("button", { key: '7934d57b6874b25e366bb8b5abe3a83cb377f175', class: "shell-layout__header-tool", type: "button" }, h("swirl-icon-double-arrow-left", { key: '8428aabadd299408985a155a2a910d4c15c4e300', size: 20 }), h("swirl-visually-hidden", { key: '433ec6a7dc91436839ab566bb0c95345cbc8a276' }, this.hideMobileNavigationButtonLabel)))), h("div", { key: 'd55acd62b1eb74c0d247c039cea246ee993c9d07', class: "shell-layout__nav-body" }, h("swirl-visually-hidden", { key: '0130fcc3e3bca07c9a3ed1a16bdb0a1638a1cb60' }, h("span", { key: 'e6e41496731456b66eedd8150c44393d4f88c6ad', id: "main-navigation-label" }, this.navigationLabel)), h("slot", { key: 'eb753f9fe3c8c36a00824e86f148ddf1a0881525', name: "nav", onSlotchange: this.collectNavItems }), h("div", { key: '9b6f92d616f09c385bce52e198f9a247156adcb6', class: "shell-layout__secondary-nav" }, h("swirl-separator", { key: '7cb6852515a15b58f83510e18373668153a72c46', color: "strong", spacing: "16" }), this.enableSecondaryNavGridLayout && (h("swirl-box", { key: 'c7106cedee7f295b67d857b4d3189b7224af9e27', paddingBlockEnd: "16" }, h("swirl-stack", { key: '9f99eaeb8db2bea6ad41eabcee49cee8ff4833ec', justify: mainNavCollapsed ? "center" : "space-between", orientation: "horizontal" }, h("swirl-button", { key: 'f37a504b3489f29c671ac7cb3e1282238533ba89', hideLabel: mainNavCollapsed, icon: this.secondaryNavCollapsed
+            : this.collapseNavigationButtonLabel))), h("a", { key: '3e79631fa44f47145c3d04904fd82d8c1123a5de', class: "shell-layout__header-tool", href: "javascript:history.back()" }, h("swirl-icon-arrow-back", { key: '2344d7fb3dd96d2324cc722201994441d9681554', size: 20 }), h("swirl-visually-hidden", { key: '57f42760e017b7564aef0a09c2cce29623bbb238' }, this.browserBackButtonLabel)), h("a", { key: '8d82f609f9d21ba4aabdc6f6984ef865ca13482f', class: "shell-layout__header-tool", href: "javascript:history.forward()" }, h("swirl-icon-arrow-forward", { key: '877244452295b3bc41f51393bc56660287e5f394', size: 20 }), h("swirl-visually-hidden", { key: '55053998bd6f93f168b13de4d91b8771f380db21' }, this.browserForwardButtonLabel)), h("slot", { key: 'b51a7edc15aa6fb8b86474d0f7a94f0da4b9dc66', name: "left-header-tools" })), h("div", { key: 'e3be12dfb40ad48280f5ce919cbbb03126a9b136', class: "shell-layout__logo" }, h("slot", { key: 'd6292d958c06e33b25f5b848ef1f305560b346a6', name: "logo" })), h("div", { key: '432770ab91b3fb0d6512632ca7272cc02220f93f', class: "shell-layout__header-right" }, h("slot", { key: 'ffe6e81aacc341b6617ead1191b5172779f0e6bb', name: "right-header-tools" }), h("slot", { key: '45aa7fa1d83cbc7cd25a3479247d62ba14d39839', name: "avatar" }))), h("div", { key: 'c11e952da53499494f794e1439519862580c28cf', class: "shell-layout__mobile-nav-backdrop", onClick: this.onNavigationClick }), h("nav", { key: 'e718116e58c0c9b9875d16f7b340f7b10284c407', "aria-labelledby": "main-navigation-label", class: "shell-layout__nav", onClick: this.onNavigationClick, ref: (el) => (this.navElement = el) }, h("div", { key: '9461acc9b41bebd9ab0d5a8cf2535babb18e3ec0', class: "shell-layout__mobile-header" }, h("slot", { key: 'bd90c25a4f27085037853fd96df9c04167d31413', name: "mobile-logo" }), h("div", { key: 'affad63e0ae66b9810479ff1472101bc71b1b745', class: "shell-layout__mobile-header-tools" }, h("slot", { key: '4cac99bc568ff6d345c3d8c8921cadd38e054294', name: "mobile-header-tools" }), h("button", { key: 'b6e53b7a8e5b0be7c4bc81626fced0a0b22ac807', class: "shell-layout__header-tool", type: "button" }, h("swirl-icon-double-arrow-left", { key: '52fe0309bc2ff3c988c406dcbd34ea505e602ef3', size: 20 }), h("swirl-visually-hidden", { key: '7425e4993d3c11609673d5444f197b4cce23b0b0' }, this.hideMobileNavigationButtonLabel)))), h("div", { key: '76e3108a837e780f5ba7c115d9ab9c654cee2583', class: "shell-layout__nav-body" }, h("swirl-visually-hidden", { key: '93a613134cf84890462f030007f8712f67e896ce' }, h("span", { key: '8abd0fe2b0b7dab953ff12fb4d6b23129ffee71e', id: "main-navigation-label" }, this.navigationLabel)), h("slot", { key: '493535666ed3af1401c90142654362abb4783a05', name: "nav", onSlotchange: this.collectNavItems }), h("div", { key: '70799718bc984b00f421f3dcbee1e46d131fd439', class: "shell-layout__secondary-nav" }, h("swirl-separator", { key: '0a956f25ae179002f308aa8a0e1278b18fbbd26e', color: "strong", spacing: "16" }), this.enableSecondaryNavGridLayout && (h("swirl-box", { key: 'ed807b244604feb205503ca6951240c556f2ff99', paddingBlockEnd: "16" }, h("swirl-stack", { key: '90d40a649043b463531d6614e0ba4dfd6d675006', justify: mainNavCollapsed ? "center" : "space-between", orientation: "horizontal" }, h("swirl-button", { key: 'dfdbd0a375bf32cf06fde7eee4cf9a64640d78ca', hideLabel: mainNavCollapsed, icon: this.secondaryNavCollapsed
                 ? "<swirl-icon-expand-more></swirl-icon-expand-more>"
                 : "<swirl-icon-expand-less></swirl-icon-expand-less>", label: this.secondaryNavCollapsed
                 ? this.secondaryNavExpandLabel
-                : this.secondaryNavCollapseLabel, onClick: this.toggleSecondaryNavCollapse, variant: "plain" }), !mainNavCollapsed && !this.secondaryNavCollapsed && (h("swirl-button", { key: '3cbbbf36a145b829d569741cb111c17d091ec59b', icon: this.secondaryNavView === "grid"
+                : this.secondaryNavCollapseLabel, onClick: this.toggleSecondaryNavCollapse, variant: "plain" }), !mainNavCollapsed && !this.secondaryNavCollapsed && (h("swirl-button", { key: '55467b2ec7f96372bedaba657b068bf2b044bd4d', icon: this.secondaryNavView === "grid"
                 ? "<swirl-icon-menu></swirl-icon-menu>"
                 : "<swirl-icon-hamburger-menu></swirl-icon-hamburger-menu>", iconPosition: "end", label: this.secondaryNavView === "grid"
                 ? this.gridNavLayoutToggleLabel
-                : this.listNavLayoutToggleLabel, onClick: this.toggleSecondaryNavView, variant: "plain" }))))), h("div", { key: '2faa5b97f118fd0256f7495bcfb4e9112e624413', class: {
+                : this.listNavLayoutToggleLabel, onClick: this.toggleSecondaryNavView, variant: "plain" }))))), h("div", { key: '38f99681433035f63b2fcc9185d7e6b1888f4bb4', class: {
                 [`shell-layout__secondary-nav-items--${this.secondaryNavGridLayoutVariant}`]: true,
                 "shell-layout__secondary-nav-items": true,
                 "shell-layout__secondary-nav-items--grid-view": this.enableSecondaryNavGridLayout &&
                     this.secondaryNavView === "grid",
-            } }, h("slot", { key: '065e4ad317213553492f510d3188273713ea1268', name: "secondary-nav", onSlotchange: this.collectNavItems }))))), h("main", { key: '5426b223b821da51b47cd24a046578b51d5b649b', class: "shell-layout__main", id: "main-content" }, h("slot", { key: 'a035652618a59e03f9f59904f06574c34dc9b473' })))));
+            } }, h("slot", { key: '8d49eb0021897e49b9271c5ead87cc67befe0fdc', name: "secondary-nav", onSlotchange: this.collectNavItems }))))), h("main", { key: '5e3c5fcff583838c418f4a6989b7e10b63831a4f', class: "shell-layout__main", id: "main-content" }, h("slot", { key: '688823dcc10d0b29c9a08e014ad8769b8ac22f61' })))));
     }
     static get is() { return "swirl-shell-layout"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/swirl-shell-navigation-item/swirl-shell-navigation-item.js

@@ -61,9 +61,9 @@ export class SwirlShellNavigationItem {
         const tooltipContent = this.description
             ? `${this.label} ${this.description}`
             : this.label;
-        return (h(Host, { key: '5f8337a6e328f4b70794c5df34bea4ce004cdbfc' }, h("swirl-tooltip", { key: 'de803be5c5e466daed55cf67c6127f897425e10d', active: this.hideLabel, content: tooltipContent, delay: 100, position: "right", positioning: "fixed" }, h(Tag, { key: '56b42a124385745a2048c1fac11abd75c5f5ea47', class: tagClassNames, href: this.href, target: this.target, type: isLink ? undefined : "button", title: !this.hideLabel ? this.label : undefined }, h("span", { key: 'fe342b65d7beef54084c3fecd2f448bf2cf8e5c8', class: "shell-navigation-item__icon" }, h("slot", { key: '9c1b2a2476fc0235e3241ed57b458a97809ad50a', name: "icon" })), !this.hideLabel ? (this.variant !== "default" ? (h("span", { class: labelClassNames }, this.label)) : (h("div", { class: "shell-navigation-item__text-wrapper" }, h("span", { class: labelClassNames }, this.label), this.description && (h("span", { class: "shell-navigation-item__description" }, this.description))))) : (h("swirl-visually-hidden", null, h("span", { class: labelClassNames }, this.label))), hasBadge && (h("span", { key: '89bb559959dae885912f6af1311c22755cd14af2', class: "shell-navigation-item__badge-wrapper" }, h("swirl-badge", { key: 'b9015202651b5c205849113fcc0e8ce783d18412', "aria-label": this.badgeLabel, class: classnames("shell-navigation-item__badge", {
+        return (h(Host, { key: '449f8152f3e43b5286253b3cad88b97e7e7511fa' }, h("swirl-tooltip", { key: 'c38fd294886949488ebb68e44243dedf4b9353cb', active: this.hideLabel, content: tooltipContent, delay: 100, position: "right", positioning: "fixed" }, h(Tag, { key: 'b109c272afaa8d81406c77f9a383eb0265ba0abe', class: tagClassNames, href: this.href, target: this.target, type: isLink ? undefined : "button", title: !this.hideLabel ? this.label : undefined }, h("span", { key: 'e798c1c7fd44a3f60969649f377dc569ef790d14', class: "shell-navigation-item__icon" }, h("slot", { key: '74253d57363c4ab083e1df01bcc8ff3a39dc875b', name: "icon" })), !this.hideLabel ? (this.variant !== "default" ? (h("span", { class: labelClassNames }, this.label)) : (h("div", { class: "shell-navigation-item__text-wrapper" }, h("span", { class: labelClassNames }, this.label), this.description && (h("span", { class: "shell-navigation-item__description" }, this.description))))) : (h("swirl-visually-hidden", null, h("span", { class: labelClassNames }, this.label))), hasBadge && (h("span", { key: '314a39b2198bc28f55ee94a14eec540ac465924a', class: "shell-navigation-item__badge-wrapper" }, h("swirl-badge", { key: '67e82dd1cf4e5097fb8572aefba5c6c43808a0f7', "aria-label": this.badgeLabel, class: classnames("shell-navigation-item__badge", {
                 "shell-navigation-item__badge--dot": this.badgeLabel === "",
-            }), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: '9e05640b202bd785e50ae6741804b64c3e1e276a', class: "shell-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "s", variant: "strong" })), showIsNewBadge && (h("swirl-badge", { key: '30aa107e83bc07394bd7de154109097d0ccf51c4', class: "shell-navigation-item__is-new-badge", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "xs", variant: "dot" }))))));
+            }), label: this.badgeLabel, size: "xs", variant: this.badgeLabel === "" ? "dot" : "default" }))), showIsNewTag && (h("swirl-tag", { key: 'e4c5c0f2efa1237f658c3a0378046e5c16188228', class: "shell-navigation-item__is-new-tag", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "s", variant: "strong" })), showIsNewBadge && (h("swirl-badge", { key: '21aac8cdecddb54b7c654d119c5a07eeadf5d216', class: "shell-navigation-item__is-new-badge", intent: "info", label: this.markAsNewLabel.toLocaleUpperCase(), size: "xs", variant: "dot" }))))));
     }
     static get is() { return "swirl-shell-navigation-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-skeleton-box/swirl-skeleton-box.js

@@ -7,11 +7,11 @@ export class SwirlSkeletonBox {
     }
     render() {
         const className = classnames("skeleton-box", `skeleton-box--border-radius-${this.borderRadius}`, { "skeleton-box--static": !this.animated });
-        return (h(Host, { key: 'bb34fc3713e671110d805817d3d0172e3d6c5c99', style: {
+        return (h(Host, { key: '0766d24e9c6dd8b47f0cde12acc961798539a663', style: {
                 width: !Boolean(this.width) && !Boolean(this.aspectRatio)
                     ? "100%"
                     : undefined,
-            } }, h("div", { key: '900721eb305211d13df2f1fda067cedd3b5a71b0', class: className, style: {
+            } }, h("div", { key: '78ef731b5c403dfe74d3034ac8bcef63e0bac16c', class: className, style: {
                 aspectRatio: this.aspectRatio,
                 borderRadius: this.borderRadius !== "pill" && this.borderRadius !== "none"
                     ? `var(--s-border-radius-${this.borderRadius})`

package/dist/collection/components/swirl-skeleton-text/swirl-skeleton-text.js

@@ -9,7 +9,7 @@ export class SwirlSkeletonText {
     render() {
         const className = classnames("skeleton-text", `skeleton-text--size-${this.size}`, { "skeleton-text--static": !this.animated });
         const lineClassName = classnames("skeleton-text__line", `skeleton-text__line--size-${this.size}`);
-        return (h(Host, { key: '15af8647515182ea368d068bb7f0cf655aed132a' }, h("div", { key: '1395f293e7bfb5b49c3165e1548d7309f28f26fb', class: className, part: className }, new Array(this.lines).fill(undefined).map((_, index) => (h("div", { class: lineClassName, key: index, part: lineClassName }))))));
+        return (h(Host, { key: '77301b4779d053d7485e3fc056093c8aca75d56c' }, h("div", { key: 'd48fb445adb540f5fcc2a3c0fcfe64c263ef2be9', class: className, part: className }, new Array(this.lines).fill(undefined).map((_, index) => (h("div", { class: lineClassName, key: index, part: lineClassName }))))));
     }
     static get is() { return "swirl-skeleton-text"; }
     static get encapsulation() { return "shadow"; }

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

@@ -6,7 +6,7 @@ export class SwirlSpinner {
     }
     render() {
         const className = classnames("spinner", `spinner--size-${this.size}`);
-        return (h(Host, { key: '211c2c245c55dddf576fb82e4e90d0371d41f2da' }, h("span", { key: 'ac73ddf409f60b61cb5fb915c6af162400f09091', class: className, role: Boolean(this.label) ? "status" : undefined }, h("svg", { key: '4567a56f98143aabe43f03d702077e0de3fb0a39', "aria-hidden": "true", class: "spinner__indicator", focusable: "false", viewBox: "0 0 50 50" }, h("circle", { key: 'f0a71d94e05eac141e9e42f9cf67b7feee313b69', class: "spinner__background", cx: "25", cy: "25", r: "20", fill: "none", "stroke-width": "4" }), h("circle", { key: '94ab44a72ca4b2160605e373a9530138a2b97896', class: "spinner__circle", cx: "25", cy: "25", r: "20", fill: "none", "stroke-width": "4" })), this.label && (h("swirl-visually-hidden", { key: 'd47917ca16502f3e9f0052e2efcb81de07e60364' }, h("span", { key: '756ce67c30da2ec76b79055215e7be22ae55a6b0', class: "spinner__label" }, this.label))))));
+        return (h(Host, { key: '2f761771a7f8ce7e6a101e112e0ca13b28d3a395' }, h("span", { key: '6fab35299e5384a5ea83dab47f4e6cbfc5ed8334', class: className, role: Boolean(this.label) ? "status" : undefined }, h("svg", { key: '8d7450bf5fedf307a9372a28aeb61ce5d164daf6', "aria-hidden": "true", class: "spinner__indicator", focusable: "false", viewBox: "0 0 50 50" }, h("circle", { key: '80b2296b1b60e70d5b771406101d9d5e95cfdd7a', class: "spinner__background", cx: "25", cy: "25", r: "20", fill: "none", "stroke-width": "4" }), h("circle", { key: 'ec3742637ae8514bbada169901575892ffd5e50f', class: "spinner__circle", cx: "25", cy: "25", r: "20", fill: "none", "stroke-width": "4" })), this.label && (h("swirl-visually-hidden", { key: 'acc70969490493433e58b543b8e4db8e75e795bf' }, h("span", { key: 'a8fd095d46463f8c08fb52ac9d70ec8f670973f9', class: "spinner__label" }, this.label))))));
     }
     static get is() { return "swirl-spinner"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-status-indicator/swirl-status-indicator.js

@@ -3,7 +3,7 @@ import classnames from "classnames";
 export class SwirlStatusIndicator {
     render() {
         const className = classnames("status-indicator", `status-indicator--intent-${this.intent}`);
-        return (h(Host, { key: '6f12aba79d45fda09d51ff87b5c2ed75bcf6bd92' }, h("div", { key: '9b6871b52ccb46dbee1de179d613acda8ed7f785', class: className }, h("span", { key: 'a8f389aabfca9e54fa8ddb4fa227433d6c6009db', class: "status-indicator__dot" }), h("span", { key: '16ce45812c9d173aec95eb7362f62d325d6e7168', class: "status-indicator__label" }, this.label))));
+        return (h(Host, { key: '62f371ab1f733071a33215f1b2d618f352932906' }, h("div", { key: 'de36fa200de899dfa926b58506ebfe498095d65b', class: className }, h("span", { key: '70097360cd5d8f107768409986891c0e4759c768', class: "status-indicator__dot" }), h("span", { key: 'bb9a68874c9ea67161d73291315974c449688723', class: "status-indicator__label" }, this.label))));
     }
     static get is() { return "swirl-status-indicator"; }
     static get encapsulation() { return "shadow"; }

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

@@ -26,9 +26,9 @@ export class SwirlSwitch {
             "switch--disabled": this.disabled,
             "switch--hide-content": this.hideLabel && (!this.description || this.hideDescription),
         });
-        return (h(Host, { key: 'b568afb5a74f2485a192fe2859454df59d00c80c' }, h("label", { key: '5e8b7dfb40e4d3928e5c025e150304844da5cd5b', class: className, htmlFor: this.inputId }, h("span", { key: '9c1c674be9a9165bcc4719870fc47cb83b4d0d43', class: "switch__control" }, h("swirl-visually-hidden", { key: 'de28385d875f2cdeb2fdbac6b7de99167720097b' }, h("input", { key: 'e4a134228c82fb527a3ef32484c71e381f2bf2e4', "aria-checked": ariaCheckedLabel, "aria-label": !this.hideLabel && this.swirlAriaLabel
+        return (h(Host, { key: '50b3357b11531b7b54760da2a757c5d20c2456a7' }, h("label", { key: '2fb84e079c1e250042827d4b727ede8fb1d8dfbf', class: className, htmlFor: this.inputId }, h("span", { key: '272a48201fab35cdf5e9e5e2048369a864403b34', class: "switch__control" }, h("swirl-visually-hidden", { key: '66e44c3a9b42cd634cf87e399b37436c9c250fa6' }, h("input", { key: 'ae147b742a03936b5cb7e3337a9ad8ace135b6f7', "aria-checked": ariaCheckedLabel, "aria-label": !this.hideLabel && this.swirlAriaLabel
                 ? this.swirlAriaLabel
-                : undefined, checked: on, class: "switch__input", disabled: this.disabled, id: this.inputId, name: this.inputName, onChange: this.onChange, ref: (el) => (this.inputEl = el), role: "switch", type: "checkbox", value: this.value })), h("span", { key: 'afadd831fce8dbd26a1fc62cce54c749a97d6f66', "aria-hidden": "true", class: "switch__thumb" })), h("swirl-stack", { key: 'bdadf2bfe6a17418e2990de80c67077ee33d4366', class: "switch__content" }, this.label && !this.hideLabel && (h("span", { key: 'c34de32004d9f3650f77e623a4784e06f2d2b239', class: "switch__label" }, this.label)), this.hideLabel && (h("swirl-visually-hidden", { key: '62ed80c15fe349fe5bd2b6f78a46b6fd0b2a067e' }, this.swirlAriaLabel || this.label)), this.description && !this.hideDescription && (h("span", { key: '946f53434f3b24f676b5830d8b0248fd01a15ac1', class: "switch__description" }, this.description)), this.description && this.hideDescription && (h("swirl-visually-hidden", { key: '2d8824fa6057a9b414c9fa593a32524b899063ac' }, this.description))))));
+                : undefined, checked: on, class: "switch__input", disabled: this.disabled, id: this.inputId, name: this.inputName, onChange: this.onChange, ref: (el) => (this.inputEl = el), role: "switch", type: "checkbox", value: this.value })), h("span", { key: '0e8bc773fa78d82f17e84b43d59d804246879619', "aria-hidden": "true", class: "switch__thumb" })), h("swirl-stack", { key: 'd9bec995417f915c3219ed3ff4d4eaa10d23f4b9', class: "switch__content" }, this.label && !this.hideLabel && (h("span", { key: 'bcb1123bdf250a15454fbed0cc0fcd3b484887bd', class: "switch__label" }, this.label)), this.hideLabel && (h("swirl-visually-hidden", { key: 'd8e3e5bc029e05b8f73500ab70d3fb73b1420b6a' }, this.swirlAriaLabel || this.label)), this.description && !this.hideDescription && (h("span", { key: 'a46ecfe95969643500e26224f8b021985f461fa9', class: "switch__description" }, this.description)), this.description && this.hideDescription && (h("swirl-visually-hidden", { key: '71c99b5f29ab55c5c9a48e4ae1e009e326a39729' }, this.description))))));
     }
     static get is() { return "swirl-switch"; }
     static get encapsulation() { return "scoped"; }

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

@@ -6,7 +6,7 @@ export class SwirlTab {
     }
     render() {
         const className = classnames("tab", { "tab--active": this.active });
-        return (h(Host, { key: '3e858f89f81b918c9f9a00c2ca891f68ca31fe2e', "aria-labelledby": `tab-${this.tabId}`, id: this.tabId, role: "tabpanel", tabIndex: this.active ? 0 : -1, class: className, style: { padding: `var(--s-space-${this.padding})` } }, h("slot", { key: '9253c411cecb72a4414188c5fb9f0dd148b0fa1e' })));
+        return (h(Host, { key: '4dcaa666ac2c76ef69a3db108fec8d9261f0c2c9', "aria-labelledby": `tab-${this.tabId}`, id: this.tabId, role: "tabpanel", tabIndex: this.active ? 0 : -1, class: className, style: { padding: `var(--s-space-${this.padding})` } }, h("slot", { key: 'd4be897cca0b201d4b72b400f6a7433ccf86921c' })));
     }
     static get is() { return "swirl-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-tab-bar/swirl-tab-bar.js

@@ -54,7 +54,7 @@ export class SwirlTabBar {
                 ? `var(--s-space-${this.paddingBlockStart})`
                 : undefined,
         };
-        return (h(Host, { key: 'c9eb4387117f55dc8e15ececb03abc782bd60c47' }, h("div", { key: '198f1ae4656ed77baab425a2a73d39657deb5c0a', "aria-label": this.label, class: className, onKeyDown: this.onKeyDown, role: this.disableTabSemantics ? undefined : "tablist", style: styles }, this.tabs.map((tab) => {
+        return (h(Host, { key: '281aeb39ec1dad585e2d528867b95eae025954d4' }, h("div", { key: '0563370c98c70a77e0fb2b763fa1314e71f629e9', "aria-label": this.label, class: className, onKeyDown: this.onKeyDown, role: this.disableTabSemantics ? undefined : "tablist", style: styles }, this.tabs.map((tab) => {
             const className = classnames("tab-bar__tab", {
                 "tab-bar__tab--active": tab.active,
                 "tab-bar__tab--variant-pill": this.variant === "pill",

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

@@ -495,7 +495,7 @@ export class SwirlTable {
             "table--show-empty-state": this.empty && !this.loading,
             "table--keyboard-move": this.movingViaKeyboard,
         });
-        return (h(Host, { key: 'd6e97afc02cef1d41b7ccad1650e32401f11677c' }, h("div", { key: 'dceaad27e0de2689fcfd99034019290db6bb9268', class: className }, this.enableDragDrop && (h("swirl-visually-hidden", { key: '37210fe0906c51f0959fc0981d7dc987c4789130' }, h("span", { key: 'bc57d02beffba02d11c35fabccd4bb98cef4fdab', "aria-live": "assertive" }, this.liveRegionText))), h("div", { key: '56fc0100044dd3b5be2391e9c310539f9bff754b', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, h("div", { key: '4705a68fa3b449b8eba6a6d1690367256e39b50d', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: 'db585347a547e1cb60a3331af74dd48dab33d353' }, h("div", { key: '5dd792ea27b892f0c7516d01618810db27a3f4d9', id: "caption" }, this.caption))), h("div", { key: '556330fc41ac660bea1f2e84f66ecb4fe6d81c2a', role: "rowgroup" }, h("div", { key: '3d6f50ca0de0c734f4605ebfe476cd444c79df2f', class: "table__header", ref: (el) => (this.headerEl = el), role: "row" }, h("slot", { key: 'fd5fe14b2542b8f1e5c1f605c97c3e2341c7e3c8', name: "columns" }))), h("div", { key: 'cf0f7f822bb98205307f0a6168c759d576794b25', class: "table__body", ref: (el) => (this.bodyEl = el) }, h("slot", { key: 'e4af4d1789d91f7bbf451948e233c9a60e3b6e7d', name: "rows" }), h("div", { key: '6c874d5d8a0a0129f88e53efee609e449921907f', class: "table__empty-row", role: "row" }, h("div", { key: '0abe2cd4dca811db2b29ca3bfd44796ef50343db', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("slot", { key: '2aa3ae37600618fb280d7fb53ecf716049d2938b', name: "empty" }), !hasEmptyStateSlotAssignment && (h("swirl-text", { key: 'c87ad9ce612ffef6966087b4de170a0aec62601b', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
+        return (h(Host, { key: '58cb39e970718c947af8fb05e49327f69ce52406' }, h("div", { key: 'ccc4d4c35f16a0250bca6473848ec928a20d69f1', class: className }, this.enableDragDrop && (h("swirl-visually-hidden", { key: '984ee69c68a1f7ede7c68d11e08ab87677c75d8c' }, h("span", { key: '7a27389724c8c0d877c79af23589b637e44d5669', "aria-live": "assertive" }, this.liveRegionText))), h("div", { key: 'd17f542eac55c6da592fc2ab12d838e30ef318e6', class: "table__container", onFocusin: this.onFocus, onFocusout: this.onBlur, onKeyDown: this.onKeyDown, onScroll: this.onScroll, ref: (el) => (this.container = el), tabIndex: -1 }, h("div", { key: 'dd983c262ce853828b3040c9f97c510c769662e3', "aria-describedby": Boolean(this.caption) ? "caption" : undefined, "aria-label": this.label, role: "table", class: "table__table" }, this.caption && (h("swirl-visually-hidden", { key: '031594755193d7ca2e0f8624afd79ec38ac0dec7' }, h("div", { key: '7b76523681ef767eb7a5805cc45da2259d6b9ce5', id: "caption" }, this.caption))), h("div", { key: 'ac6f9ffa3703cbadb12b7384e8f897c5af9d0bc1', role: "rowgroup" }, h("div", { key: '5263be7e317340491ee5890a1a2e5d25fcba06d5', class: "table__header", ref: (el) => (this.headerEl = el), role: "row" }, h("slot", { key: '3171ffdd4027b3f32d2d2b110f55209c8bdc5e7e', name: "columns" }))), h("div", { key: '32c054e3e9f63439efb8f9cf9633f5b628a789e0', class: "table__body", ref: (el) => (this.bodyEl = el) }, h("slot", { key: '2f5b748c60f91dbe4df98d0f18b367f8292100d0', name: "rows" }), h("div", { key: 'b51e7e34b4d4e1c4044f9480a0a115393064d221', class: "table__empty-row", role: "row" }, h("div", { key: '1cb8061bef8a30965ea023b31dd0fcfac0276f26', "aria-colspan": this.getColumns().length, class: "table__empty-row-cell", role: "cell" }, h("slot", { key: 'e512da95e312bb19dca9b36e0092a0001810eda7', name: "empty" }), !hasEmptyStateSlotAssignment && (h("swirl-text", { key: 'ab17ca80ff8a609d5eaa4addee7d3358791bc11d', align: "center", size: "sm" }, this.emptyStateLabel))))))))));
     }
     static get is() { return "swirl-table"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/swirl-table-column/swirl-table-column.js

@@ -17,7 +17,7 @@ export class SwirlTableColumn {
             maxWidth: this.maxWidth || "",
             minWidth: this.minWidth || "",
         };
-        return (h(Host, { key: '34c7db09a98d06ef106047f668114d5f90777f55', "aria-sort": this.sort, class: "table-column", role: "columnheader", style: styles }, h("span", { key: '9d4c0fc6b935e10dbf43383a7cff2a79e09067b1' }, h("slot", { key: '6fc894a4d9aa228e10f019fa65dc4f8b645e43b3' })), this.sortable && (h("span", { key: '393474d787bc2e3e467b7aaa655246e87ebfe3e7', class: "table-column__sort-indicator" }, this.sort === "ascending" && (h("swirl-icon-arrow-upward", { key: '3f90d7008105c0965492d9f9831a9479942e1ef0', "aria-hidden": "true", size: 20 })), this.sort === "descending" && (h("swirl-icon-arrow-downward", { key: '83b3d0a6c05951e6f2d34a79e9780eb4be3587f5', "aria-hidden": "true", size: 20 })), !Boolean(this.sort) && " "))));
+        return (h(Host, { key: '7b44381a58a3166a253085ad49e9dfd2c789a6cb', "aria-sort": this.sort, class: "table-column", role: "columnheader", style: styles }, h("span", { key: 'bbd36f836c804b7705a4734146d75b0947c60d0e' }, h("slot", { key: '31bd5ea3ad4241e3220982b3b6b09177b1797815' })), this.sortable && (h("span", { key: 'f1412c8cfee58866f449cb188a2def485af9066d', class: "table-column__sort-indicator" }, this.sort === "ascending" && (h("swirl-icon-arrow-upward", { key: 'bb54544c676dcfb0f13f93354d6438a635fa028d', "aria-hidden": "true", size: 20 })), this.sort === "descending" && (h("swirl-icon-arrow-downward", { key: 'cfb63e3e1edc6c6d99da43eed402b467f3ca7770', "aria-hidden": "true", size: 20 })), !Boolean(this.sort) && " "))));
     }
     static get is() { return "swirl-table-column"; }
     static get encapsulation() { return "shadow"; }

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

@@ -32,7 +32,7 @@ export class SwirlTag {
     }
     render() {
         const className = classnames("tag", `tag--icon-position-${this.iconPosition}`, `tag--intent-${this.intent}`, `tag--size-${this.size}`, `tag--variant-${this.variant}`, { "tag--hide-label": this.hideLabel });
-        return (h(Host, { key: '1333123b648e954bf91e00e1c91b420b2a26e9f4' }, h("span", { key: '475ea72614b02e8b0284c8702cb4e0d7c82cee16', class: className, part: "tag" }, this.icon && (h("span", { key: '33e5ce8e5f8b3380f984ab4dea418ceaa3c83b4c', class: "tag__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !this.hideLabel ? (h("span", { class: "tag__label" }, this.label)) : (h("swirl-visually-hidden", null, this.label)), this.removable && (h("button", { key: 'c8c0928c9c85186b2f0516308f91252eea48c3ac', "aria-label": this.removalButtonLabel, class: "tag__removal-button", onClick: this.onRemove, tabIndex: this.el.ariaHidden === "true" ? -1 : undefined, type: "button" }, h("swirl-icon-close", { key: '7d504c7ee2f91fdbb5929138339297d54b2f2f7d', size: 16 }))))));
+        return (h(Host, { key: 'a3ade00e730b9c5a0bf70ce18555894162efcdb9' }, h("span", { key: '9adecf537f7923514ec8eca45badc8560a1448b8', class: className, part: "tag" }, this.icon && (h("span", { key: '0adc214659f1680182981e70724fcbc1782f01d0', class: "tag__icon", innerHTML: this.icon, ref: (el) => (this.iconEl = el) })), !this.hideLabel ? (h("span", { class: "tag__label" }, this.label)) : (h("swirl-visually-hidden", null, this.label)), this.removable && (h("button", { key: 'e1981afdf9819c222ca92f08fdf57cdd7e4f3f26', "aria-label": this.removalButtonLabel, class: "tag__removal-button", onClick: this.onRemove, tabIndex: this.el.ariaHidden === "true" ? -1 : undefined, type: "button" }, h("swirl-icon-close", { key: '6b06d0db7dcd182742f5399cd20d2d7532b9ff0c', size: 16 }))))));
     }
     static get is() { return "swirl-tag"; }
     static get encapsulation() { return "shadow"; }

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

@@ -51,7 +51,7 @@ export class SwirlText {
         const styles = {
             whiteSpace: truncate ? "nowrap" : this.whiteSpace,
         };
-        return (h(Host, { key: '2705ae22ced61f2ded22a95f4bb516b4d236ee05' }, h(Tag, { key: 'ba3ac9ebab4d8161c1131f6c66d7f49d498d94bb', class: className, ref: (el) => (this.textEl = el), style: styles }, h("slot", { key: '77bf55627b6746378d987d3eb3baef90d1d617ac' }))));
+        return (h(Host, { key: '56f7218ef3a537fec98997d1b14ca35c2c479676' }, h(Tag, { key: 'b921b87fd42122292d4db0368a5aba72e0975f7a', class: className, ref: (el) => (this.textEl = el), style: styles }, h("slot", { key: '7e8f3315ebe21dc4e598c375d300143a519b697e' }))));
     }
     static get is() { return "swirl-text"; }
     static get encapsulation() { return "scoped"; }

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

@@ -22,7 +22,7 @@ export class SwirlThumbnail {
             "thumbnail--interactive": this.interactive,
             "thumbnail--has-progress": this.progress !== undefined,
         });
-        return (h(Host, { key: 'b163c406924eb786fdf7df91bf95e698684cacb2' }, h("span", { key: '51be2f399ab16a35a38dbe88a526d34f9a93d930', class: className, role: "group" }, h(ImageWrapper, { key: 'cc315b5cab5bf4f582e5a8de1362505c9fda7e11', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, h("img", { key: '954d3f7a428e48d74d032c70caeadcde9e919877', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: '3de6fa2511300dd7e85eb03de9e040286be7eb8a', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: '2f360551e24ef67337b267dc05c9637c9f3f6ae4', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: 'da5dc58dc2efed85f5fda9c8242bd0d7dd12d920', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: '6376028fe00406fdb759b4f6ee7c940489e9cf39' }, h("swirl-button", { key: 'c2d515dd83f22099d9a508dbef1851f0b59ac3c4', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: '4a0085069c63f86b2975ad8181bc4022bf8231a1' }, h("swirl-button", { key: 'b3a9820e11e04d848de1ab3709d3eac797578039', hideLabel: true, icon: "<swirl-icon-delete></swirl-icon-delete>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (h("span", { key: 'ec1a5801b9d9b3395582e088d8efeb274f57eb3a', class: "thumbnail__timestamp" }, this.timestamp)))));
+        return (h(Host, { key: '3545b248fde36b1d127a0630cec3cecd45084d81' }, h("span", { key: 'a658cb627ad7f6e66e4d96d28431eb86e46a04d7', class: className, role: "group" }, h(ImageWrapper, { key: '006319ae923bb315143d18ae485f21d6b82dcb82', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, h("img", { key: 'b10d7bb5ac401faedaebb13ff63efed486f6577c', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: '0136b7032f9b20f1ab7239ec571b1f634705b183', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: 'a50e4f6e2e0eb6f1f41c2f846fa1883a904d1671', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: '2477bb687307e2167dc4005e46fd56ee393497e3', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: 'ebb5fb96bebb157f06a742515d9e98eeea1e6571' }, h("swirl-button", { key: 'c335bd576fb8664fd4d45ab3ae9b0f97ce99a130', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: '3df296ec9f310309d17e53b4868d3f844ef9fcf1' }, h("swirl-button", { key: 'b34c70f969d794844d14a5031f96497dd58e88d8', hideLabel: true, icon: "<swirl-icon-delete></swirl-icon-delete>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (h("span", { key: 'c65d48def8ed423dc9b48a32612684a86defcd99', class: "thumbnail__timestamp" }, this.timestamp)))));
     }
     static get is() { return "swirl-thumbnail"; }
     static get encapsulation() { return "shadow"; }

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

@@ -46,7 +46,7 @@ export class SwirlToast {
     }
     render() {
         const className = classnames("toast", `toast--intent-${this.intent}`);
-        return (h(Host, { key: 'f778aa4a83f4893f6624012188ee9ebfe4a87148' }, h("div", { key: 'dec52e1f31ca5ad7562182a0b20591f80674cf64', class: className }, this.icon && (h("span", { key: '44ed9836656e5b18f5a29087c4b9d415099cda1a', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), h("span", { key: '8bb09803cd503a78578fb1c4c3abce515610512f', class: "toast__content", innerHTML: this.content, part: "toast__content" }, h("slot", { key: 'ba1d1bf7473be575e81b09328a192a392344d5a1' })), h("button", { key: 'c4d88190073f45eb39821de9e6e885023b502d37', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (h("swirl-icon-close", { key: '22024931b84d915424afbef059ed7a06b5b3a19e', ref: (el) => (this.dismissIconEl = el) }))))));
+        return (h(Host, { key: '7fea68476343a3a1036bcf9f7594a6e1a79cff8d' }, h("div", { key: 'fbffb818800e9a1a09d152b304247d2d4f142011', class: className }, this.icon && (h("span", { key: '3dd08af863ab3e470b04382280e48898b1855df5', class: "toast__icon", innerHTML: this.icon, part: "toast__icon", ref: (el) => (this.iconEl = el) })), h("span", { key: 'cb7f747663e9abac62571814a39d4295e33cba5c', class: "toast__content", innerHTML: this.content, part: "toast__content" }, h("slot", { key: 'fe656f4eb9dc33af885d7b41f8a1b846bc1e5649' })), h("button", { key: '974e2f354db147b74fd5e88e4fb17a8b611f1fa9', "aria-label": this.dismissLabel || this.accessibleDismissLabel, class: "toast__dismiss-button", onClick: this.onDismiss, type: "button" }, this.dismissLabel, !Boolean(this.dismissLabel) && (h("swirl-icon-close", { key: '26d3e2c61a864953c15e1ca071a00cb33bdc412b', ref: (el) => (this.dismissIconEl = el) }))))));
     }
     static get is() { return "swirl-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-toast-provider/swirl-toast-provider.js

@@ -41,7 +41,7 @@ export class SwirlToastProvider {
         return newToastWithId;
     }
     render() {
-        return (h(Host, { key: '2e948fa77162113c396c00c7f9703483c400233c', role: "status" }, h("swirl-stack", { key: 'ca43ed3612eef77ea064d9ed4e00f880ff818e44', spacing: "12" }, this.toasts.map((toast) => {
+        return (h(Host, { key: 'ed46f2145bfb6a36b7d7e66206f92aa048b0b0ff', role: "status" }, h("swirl-stack", { key: 'd3302dba7a8f2cd47b77adacb1d6ee51d32b4b85', spacing: "12" }, this.toasts.map((toast) => {
             const props = { ...toast, content: undefined };
             return (h("swirl-toast", { key: toast.toastId, onDismiss: this.onDismiss, ...props }, toast.content));
         }))));

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

@@ -55,7 +55,7 @@ export class SwirlToggleGroup {
         const className = classnames("toggle-group", `toggle-group--variant-${this.variant}`, {
             "toggle-group--elevated": this.elevated,
         });
-        return (h("swirl-stack", { key: 'f23f280ccd329a6dce85e0936854ad641c7f02be', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, h("slot", { key: 'fe678b3ba4ba727ff851295f338331c1fd9bd327', onSlotchange: this.onSlotChange })));
+        return (h("swirl-stack", { key: '53d1ed77435d8b176d2ecd9f17a91d7ce898089c', class: className, "aria-label": this.swirlAriaLabel, spacing: "4", orientation: "horizontal", align: "center", role: "group" }, h("slot", { key: '86d94274de5474cd95c7a8e9bc00470a769f0338', onSlotchange: this.onSlotChange })));
     }
     static get is() { return "swirl-toggle-group"; }
     static get encapsulation() { return "shadow"; }

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

@@ -65,7 +65,7 @@ export class SwirlToolbar {
         });
     }
     render() {
-        return (h(Host, { key: '6839d6b80aec0dd93bcdbf05d6ee1eb3cad5ae94' }, h("swirl-stack", { key: '9f40313da2656080f7ebe0d04958afa922f0c6e6', align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: true }, h("slot", { key: '1b4462914f0e66be04c26d711e060cf1cdbf7c10' }))));
+        return (h(Host, { key: '68b45bf033f288bfcc91816113e4a9dc1ef3969f' }, h("swirl-stack", { key: '5e47332dbd0f692c105a8271b381b474e87e6a79', align: "center", "aria-label": this.label, "aria-orientation": this.orientation, role: "toolbar", onKeyDown: this.onKeyDown, orientation: this.orientation, spacing: "8", wrap: true }, h("slot", { key: 'fcd391ebc21c6b829394c28b2968c5007f3be389' }))));
     }
     static get is() { return "swirl-toolbar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/swirl-tooltip/swirl-tooltip.css

@@ -88,10 +88,9 @@
   background-color: var(--s-surface-neutral-default);
 }
 
-.tooltip--promo .tooltip__bubble,
-.tooltip--promo .tooltip__arrow {
-  background-color: var(--s-surface-info-default);
-}
+.tooltip--intent-info .tooltip__bubble, .tooltip--intent-info .tooltip__arrow {
+    background-color: var(--s-surface-info-default);
+  }
 
 @keyframes tooltip-fade-in {
   from {

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

@@ -6,18 +6,23 @@ export class SwirlTooltip {
     constructor() {
         this.active = true;
         this.delay = 200;
+        this.intent = "default";
         this.position = "top";
         this.positioning = "absolute";
-        /**
-         * If set to true, tooltip will be initially visible.
-         * It will only be dismissible via a click and will not reappear.
-         * Tooltip will have a blue background color.
-         */
-        this.isPromo = false;
+        this.trigger = ["focus", "hover"];
         this.visible = false;
-        this.isPromoShown = false;
         this.onKeydown = (event) => {
-            if (event.code === "Escape" && !this.isPromo) {
+            if (event.code === "Escape") {
+                this.hide();
+            }
+        };
+        this.onFocusIn = () => {
+            if (this.trigger.includes("focus")) {
+                this.show();
+            }
+        };
+        this.onFocusOut = () => {
+            if (this.trigger.includes("focus")) {
                 this.hide();
             }
         };
@@ -38,20 +43,6 @@ export class SwirlTooltip {
                 top: Boolean(arrowY) ? arrowY + "px" : undefined,
             };
         };
-        this.show = () => {
-            if (!this.active || (this.isPromo && this.isPromoShown)) {
-                return;
-            }
-            this.visible = true;
-            requestAnimationFrame(() => {
-                const referenceElement = this.el.children[0];
-                if (!Boolean(referenceElement)) {
-                    return;
-                }
-                this.reposition();
-                this.disableAutoUpdate = autoUpdate(referenceElement, this.popperEl, this.reposition.bind(this));
-            });
-        };
         this.showWithDelay = () => {
             if (!this.active) {
                 return;
@@ -64,14 +55,6 @@ export class SwirlTooltip {
                 this.show();
             }, this.delay);
         };
-        this.hide = () => {
-            if (Boolean(this.showTimeout)) {
-                clearTimeout(this.showTimeout);
-                this.showTimeout = undefined;
-            }
-            this.visible = false;
-            this.disableAutoUpdate?.();
-        };
         this.updateOptions = () => {
             const margin = getPixelsFromRemToken("--s-space-12");
             const shiftPaddingY = getPixelsFromRemToken("--s-space-8");
@@ -98,10 +81,12 @@ export class SwirlTooltip {
         this.updateOptions();
     }
     onMouseEnter() {
-        this.showWithDelay();
+        if (this.trigger.includes("hover")) {
+            this.showWithDelay();
+        }
     }
     onMouseLeave() {
-        if (!this.isPromo) {
+        if (this.trigger.includes("hover")) {
             this.hide();
         }
     }
@@ -122,18 +107,35 @@ export class SwirlTooltip {
     }
     componentDidLoad() {
         this.updateOptions();
-        if (this.isPromo) {
-            this.show();
-            this.isPromoShown = true;
+    }
+    async show() {
+        if (!this.active) {
+            return;
         }
+        this.visible = true;
+        requestAnimationFrame(() => {
+            const referenceElement = this.el.children[0];
+            if (!Boolean(referenceElement)) {
+                return;
+            }
+            this.reposition();
+            this.disableAutoUpdate = autoUpdate(referenceElement, this.popperEl, this.reposition.bind(this));
+        });
+    }
+    async hide() {
+        if (Boolean(this.showTimeout)) {
+            clearTimeout(this.showTimeout);
+            this.showTimeout = undefined;
+        }
+        this.visible = false;
+        this.disableAutoUpdate?.();
     }
     render() {
-        const className = classnames("tooltip", `tooltip--actual-placement-${this.actualPosition?.placement}`, {
+        const className = classnames("tooltip", `tooltip--actual-placement-${this.actualPosition?.placement}`, `tooltip--intent-${this.intent}`, {
             "tooltip--active": this.active,
             "tooltip--visible": this.visible,
-            "tooltip--promo": this.isPromo,
         });
-        return (h(Host, { key: 'eb98693ca0f89f2d87d77345a7a40094ad2127b0', onKeydown: this.onKeydown }, h("span", { key: 'a9136430b03542b564d5ac0e7a607c15626ebf7b', class: className }, h("span", { key: 'fb3360a98a1dbbc2882dd476ce1bece24262e5a4', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: !this.isPromo && this.hide, onClick: this.hide, onFocusin: this.show }, h("slot", { key: '66284a39104223a52ef2c7c4b7eae3989e427c14' })), h("span", { key: '83a41911fdd3b4b71613758de21a9a82b77ee32b', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
+        return (h(Host, { key: 'e418f075955973796c17ba8994cfb63284b99d13', onKeydown: this.onKeydown }, h("span", { key: '410ac8bc16773617287b73b4676682b4e887eeb3', class: className }, h("span", { key: 'e111062966a91142006124131819095cd3e41e69', class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.onFocusOut, onClick: this.hide, onFocusin: this.onFocusIn }, h("slot", { key: 'fc43ad1b5a655a0512157a6cc6c9877c592caa1c' })), h("span", { key: '360545df93f2ea5b655166769d1a3d95c8dca299', class: "tooltip__popper", ref: (el) => (this.popperEl = el), style: {
                 top: Boolean(this.actualPosition)
                     ? `${this.actualPosition?.y}px`
                     : "",
@@ -141,7 +143,7 @@ export class SwirlTooltip {
                     ? `${this.actualPosition?.x}px`
                     : "",
                 position: this.positioning,
-            } }, this.visible && (h("span", { key: '9b1d1f18199fd58c71151f18230a8d9372ea6dcf', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, h("span", { key: 'e9e0c0d96cd1fdb70c43b9f45aa9e5f8c04056ac', class: "tooltip__content", innerHTML: this.content }))), h("span", { key: '15abfa4fee4eec0ceed79bada17ddea2fcb5a189', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
+            } }, this.visible && (h("span", { key: 'b4af0145c86950a1a863f73d63f77000bd98f95a', class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, h("span", { key: '84a35eb842594411f9deac1c47b04034bdd64362', class: "tooltip__content", innerHTML: this.content }))), h("span", { key: 'c6796dee53c0fd6d1fbc2a39d6495f91360671fc', class: "tooltip__arrow", ref: (el) => (this.arrowElement = el), style: {
                 ...this.arrowStyles,
                 visibility: this.visible ? "visible" : "hidden",
             } })))));
@@ -219,6 +221,32 @@ export class SwirlTooltip {
                 "reflect": false,
                 "defaultValue": "200"
             },
+            "intent": {
+                "type": "string",
+                "attribute": "intent",
+                "mutable": false,
+                "complexType": {
+                    "original": "SwirlTooltipIntent",
+                    "resolved": "\"default\" | \"info\"",
+                    "references": {
+                        "SwirlTooltipIntent": {
+                            "location": "local",
+                            "path": "/home/runner/work/swirl/swirl/packages/swirl-components/src/components/swirl-tooltip/swirl-tooltip.tsx",
+                            "id": "src/components/swirl-tooltip/swirl-tooltip.tsx::SwirlTooltipIntent"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "\"default\""
+            },
             "position": {
                 "type": "string",
                 "attribute": "position",
@@ -271,25 +299,30 @@ export class SwirlTooltip {
                 "reflect": false,
                 "defaultValue": "\"absolute\""
             },
-            "isPromo": {
-                "type": "boolean",
-                "attribute": "is-promo",
+            "trigger": {
+                "type": "unknown",
+                "attribute": "trigger",
                 "mutable": false,
                 "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
+                    "original": "SwirlTooltipTrigger[]",
+                    "resolved": "SwirlTooltipTrigger[]",
+                    "references": {
+                        "SwirlTooltipTrigger": {
+                            "location": "local",
+                            "path": "/home/runner/work/swirl/swirl/packages/swirl-components/src/components/swirl-tooltip/swirl-tooltip.tsx",
+                            "id": "src/components/swirl-tooltip/swirl-tooltip.tsx::SwirlTooltipTrigger"
+                        }
+                    }
                 },
                 "required": false,
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "If set to true, tooltip will be initially visible.\nIt will only be dismissible via a click and will not reappear.\nTooltip will have a blue background color."
+                    "text": ""
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "defaultValue": "false"
+                "defaultValue": "[\"focus\", \"hover\"]"
             }
         };
     }
@@ -297,8 +330,49 @@ export class SwirlTooltip {
         return {
             "actualPosition": {},
             "arrowStyles": {},
-            "visible": {},
-            "isPromoShown": {}
+            "visible": {}
+        };
+    }
+    static get methods() {
+        return {
+            "show": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "HTMLElement": {
+                            "location": "global",
+                            "id": "global::HTMLElement"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            },
+            "hide": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            }
         };
     }
     static get elementRef() { return "el"; }