@duetds/components 9.2.10 → 9.3.1

package/hydrate/index.js

@@ -3986,12 +3986,12 @@ class DuetBadge {
      */
     render() {
         const backgroundClass = `background-${this.background}`;
-        return (hAsync(Host, { key: 'f6c7cba47b61653771f763bf926f6e42f043a51a', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '953adfad1705f38f74fef7490b449f51dc3c8372', class: {
+        return (hAsync(Host, { key: 'f936e15399ba35544b5a4c6cd0bb4f4d90550fbb', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '16300926ee1cd86e4cc9d77e0121adb7d5b6d560', class: {
                 "duet-badge": true,
                 [this.variation]: true,
                 [backgroundClass]: true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("slot", { key: '4129c1565dbec8d0269a41e5c5cf0ce71b315be4' }))));
+            } }, hAsync("slot", { key: 'eeca9f8ce7df4c184c9d63bad0fc6e7253713f0b' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBadgeStyle0; }
@@ -4181,14 +4181,14 @@ class DuetBreadcrumb {
      */
     render() {
         var _a;
-        return (hAsync(Host, { key: 'd563a73d4bfb9f69e7680da922d0b2689565ad1c', role: "listitem" }, hAsync("div", { key: '10fc5b8b4a2c25d70156271a11e3a233e3171b5b', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: 'bfb363e4ddc22dee217eb2caafddfc2195b211af', class: "duet-breadrumbs-arrow", size: "auto", icon: actionArrowRightSmall.svg, margin: "none", color: "currentColor" })), hAsync("a", { key: '87a994e8838d6b2271066aba7bf9960b5d328393', class: {
+        return (hAsync(Host, { key: '5507d8811565f6ba44aa8ac7cdcfd80af38b17be', role: "listitem" }, hAsync("div", { key: 'f81a05e3ff108ac5a6951c7f43fd918e9b72348c', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: '2b55ec337f3592b5a5bab62730e88792a9b031fc', class: "duet-breadrumbs-arrow", size: "auto", icon: actionArrowRightSmall.svg, margin: "none", color: "currentColor" })), hAsync("a", { key: '2d355db059be9572e3bee4af2976d52e3cb8b032', class: {
                 "duet-breadcrumb": true,
                 "duet-theme-turva": this.theme === "turva",
             }, href: this.href ? this.href : undefined, "aria-label": `${!this.href ? `${getLocaleString(this.currentCrumb)} ` : ""}${(_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.element.innerHTML}`, role: "link" }, this.icon !== "arrow-right-small-icon" &&
             this.icon && [
-            hAsync("duet-icon", { key: '3866247a6992476b2559aced40a034a0cc76c437', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
-            this.hasSlottedContent && hAsync("duet-spacer", { key: 'aadee41608241f0903e843ac3e54a7985a947206', size: "x-small", direction: "horizontal" }),
-        ], hAsync("slot", { key: 'dc5cfef7de5a83c0bd04f32204d042400819129f' })))));
+            hAsync("duet-icon", { key: '0d905f6b5a31c16ed0710b929692deab65a012df', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
+            this.hasSlottedContent && hAsync("duet-spacer", { key: '149a01e2cc3fcf4278eb88881a600ed588231dfb', size: "x-small", direction: "horizontal" }),
+        ], hAsync("slot", { key: 'c9100d96b29f13b0827855cf280a2f2d8adbe956' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBreadcrumbStyle0; }
@@ -4249,11 +4249,11 @@ class DuetBreadcrumbs {
      */
     render() {
         const color = getColorByName(this.color);
-        return (hAsync(Host, { key: '2ff5911d23c100d3643be758c450037f7e9a188b' }, hAsync("nav", { key: '73bf3c3a13dfbca9d8a627b3833e392a689fdb16', "aria-label": this.breadcrumbsAriaLabel, class: {
+        return (hAsync(Host, { key: '8a426eb6c98df0cadaac3a0f8dc1847c10a545ac' }, hAsync("nav", { key: 'c8d054052dcafa0f839a909b2b71be421efff769', "aria-label": this.breadcrumbsAriaLabel, class: {
                 "duet-breadcrumbs": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.variation]: true,
-            } }, hAsync("div", { key: 'eab81ecd243618026326688741ff0eacf6eb1bf0', class: "container" }, hAsync("div", { key: '8c7f57f32ec5f458fe10497450995fbcc5feadca', role: "list", class: "list", style: { color } }, hAsync("slot", { key: '8f89e08a64377083ee60c92599459324439c0f8b' })), hAsync("div", { key: '27bc05b04c9b6f613bb95c6bd1576c2486fa30cf', class: "bottom-border bottom-border--container" })), hAsync("div", { key: '437f2b1c77d0a03503c002ce637c79748eba62ea', class: "bottom-border bottom-border--nav" }))));
+            } }, hAsync("div", { key: 'fb3c49caf848585c11b4a08839325cda03712f01', class: "container" }, hAsync("div", { key: '204c53bf2469034d50929394b53c9022bf257592', role: "list", class: "list", style: { color } }, hAsync("slot", { key: '5f125ef249b0ca6ddf2172771c8417c38bc12569' })), hAsync("div", { key: '4edea42420783c03219e14926c83be9a96211b89', class: "bottom-border bottom-border--container" })), hAsync("div", { key: 'ca4a0c58ba1428fafe0f2bb3a4a2a66f2aae9ab4', class: "bottom-border bottom-border--nav" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBreadcrumbsStyle0; }
@@ -4610,11 +4610,11 @@ class DuetCallout {
     <path d="M6.6591 0.557547L9.2031 2.33355C7.0911 5.21355 6.1311 7.18155 5.8431 8.90955C7.4751 9.34155 8.7231 10.5415 8.7231 12.6535C8.7231 15.2935 6.9471 16.9255 4.6431 16.9255C2.0511 16.9255 0.227096 15.1975 0.227096 12.2695C0.227096 8.28555 2.3871 4.34955 6.6591 0.557547ZM17.9871 8.95755C19.6191 9.34155 20.8671 10.5415 20.8671 12.6535C20.8671 15.2935 19.1391 16.9255 16.8351 16.9255C14.2431 16.9255 12.4191 15.1975 12.4191 12.2695C12.4191 8.28555 14.5791 4.34955 18.8511 0.557547L21.3951 2.33355C19.2351 5.21355 18.3231 7.18155 17.9871 8.95755Z"/>
     </svg>
     `;
-        return (hAsync(Host, { key: 'e5a47020ada7c007c90d23a7f9c796c2f6b2457e' }, hAsync("div", { key: '136d467b3ef4aa8f442ee7047cc124990fa61bb8', class: {
+        return (hAsync(Host, { key: '72ff6ae8998a3e9508ade4f9d8c77d60ac7499e3' }, hAsync("div", { key: '2f79c17aff1548964939b00d2cf6f15b7fcf0940', class: {
                 "duet-callout": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
-            } }, hAsync("figure", { key: '493242d5535a0c9792bea659848083a341788177', class: "container" }, hAsync("duet-icon", { key: '8b8205d4eee5b38576a9c1d7d38b2fbb440bda73', class: "callout-icon", shape: "brand-rotated", background: "primary-lighter", "background-opacity": "0.75", "background-rotation": this.theme === "turva" ? "0" : "7", color: "secondary", icon: icon, size: "auto", margin: "none", theme: this.theme }), hAsync("blockquote", { key: 'fbde831b7ff9d98ff97bdab185dd20e69f2a199c' }, hAsync("slot", { key: 'b08a535e736f7f7b4a9e9bf0c0f87cbd4feb0b9b' })), this.hasAuthorSlot && (hAsync("figcaption", { key: '4e10df600d75e995d0be670382e9f02eb2b2216c', class: "author" }, hAsync("span", { key: 'b8c898cee551b4b54df90d4cc13a2f8a43747722' }, "\u2014 "), hAsync("slot", { key: 'c0b4ad3dc00ff79d592e0283d31230700d6d9715', name: "author" })))))));
+            } }, hAsync("figure", { key: '76bb9de5af1b8897ad134fbac7b6c559d17dbd6b', class: "container" }, hAsync("duet-icon", { key: '8e4eea34ba80a963dbd5a795301fb082e7e7e9b2', class: "callout-icon", shape: "brand-rotated", background: "primary-lighter", "background-opacity": "0.75", "background-rotation": this.theme === "turva" ? "0" : "7", color: "secondary", icon: icon, size: "auto", margin: "none", theme: this.theme }), hAsync("blockquote", { key: '1356b0a45346c05d6b4580b1e9ea13287ed7b5fc' }, hAsync("slot", { key: '60e849845ab365cf7cddb34b43f4939620ba9a0d' })), this.hasAuthorSlot && (hAsync("figcaption", { key: '0e91ea489fcc96f1844b816755b406650ec19ebb', class: "author" }, hAsync("span", { key: 'd54420792e6b9deeb72076e2628d62c170440520' }, "\u2014 "), hAsync("slot", { key: 'c91de5e850bb38807363fc0491689e90e8f8b71a', name: "author" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetCalloutStyle0; }
@@ -4977,11 +4977,11 @@ class DuetCheckmark {
         inheritGlobalTheme(this);
     }
     render() {
-        return (hAsync(Host, { key: 'c27233d217d6300b031461ab116340e1c584066c', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: '19290a374763929d9ddf126e675956ff3aaed52e', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: 'faac346948b9a766a35bb35ad9865fca24efaba0', class: {
+        return (hAsync(Host, { key: '67101b52a09890cf734e9d0595e4350a4663b054', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: '84bb0da3c2fbc1c656b9e58cf82793c9331c4515', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: '4a002ef944ff1f7ba5098696377c3d329e4a2cb8', class: {
                 "duet-checkmark-container": true,
                 center: this.center,
                 "duet-checkmark-radio": this.type === "radio",
-            } }, this.checked && hAsync("div", { key: '4d79344b9b2bf72c06fa51d0134c4ae0255d6a59', class: "duet-checkmark" })))));
+            } }, this.checked && hAsync("div", { key: 'c84aa3c64106bdc10cc6dbcef72202d6f7865e57', class: "duet-checkmark" })))));
     }
     static get style() { return DuetCheckmarkStyle0; }
     static get cmpMeta() { return {
@@ -7288,10 +7288,10 @@ class DuetContactCard {
     render() {
         const isTurva = this.theme === "turva";
         const theme = isTurva ? "turva" : "default";
-        return (hAsync(Host, { key: '710493f629c7d9cac46f490f0dee228f7242a95c', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '6ebe03954a2fa70044934971a113f2799d883a61', class: {
+        return (hAsync(Host, { key: '71daad66c023075159b00d6dc104eab79c4b160d', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'acf3ea2fa7c3cdd7e0363a19a18a60d74d393a6c', class: {
                 "duet-contact-card": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, role: "group", "aria-label": this.name }, this.image ? hAsync("img", { class: "image", src: this.image, alt: this.name }) : hAsync("div", null), hAsync("div", { key: '38bd574fe717f2d7b57c74cde6d5ac57f148b23c' }, this.name && (hAsync("duet-heading", { key: '72ef2682da855b8cb86c2537843b864121b1529b', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: 'b657102818b5864f82ddc9de07ff4c910024e46f', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: '310a665ff9dad389ea89c74bcda6b5b637513eca', class: "email" }, hAsync("duet-icon", { key: '0d15be99d190d285cead78ef5a1356ce88802e21', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '67e957450d29245d930ca9b8366cdc421c95b5a0', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: '3c7f8dbef0143be61c6da4e5c5aaf50036a5a795', class: "phone" }, hAsync("duet-icon", { key: '107635e97ef8980ce1f9d91cc7c0a20132967d50', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '30993d3b47125ecd85527fd664596deb5b1e6c55', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: '08e0710a040f7775d7a8b2c61b5e803212b1a344', class: "call-to-action" }, hAsync("duet-button", { key: '33b3f9f83c8b98df670211fa786bc91e1daeb33f', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: '6bd3ab22e2e630bc6de6fd7f841f2b0fd658cc95' }), hAsync("slot", { key: 'ddcf2048393c89dbc94c29254ee703829cdc08a2' }))));
+            }, role: "group", "aria-label": this.name }, this.image ? hAsync("img", { class: "image", src: this.image, alt: this.name }) : hAsync("div", null), hAsync("div", { key: '196c215165b051901fe5d4f2052da20c5ca455f2' }, this.name && (hAsync("duet-heading", { key: '0007ee7244e68c15517bb124c7b78f9d4e6c6dd3', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: '3f59b617f8c2f6b37d6c82ce48faac52e06f7cb2', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: 'fb3b0b7fac964d9e8c8362392645f0c8c1bc87df', class: "email" }, hAsync("duet-icon", { key: '893fabcc55e9b009d431952357e1fede755e61fb', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '7677f46f07ff869d2056aa234934991adcda3eff', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: 'c06e9f451420ef3e92664dd46e8ed78dd2bd5f74', class: "phone" }, hAsync("duet-icon", { key: 'ebc081064f01efb5e3ea31fc8d8782bd22bbcef0', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '5eef45c250e181259b3452eb21d6ef619db8aa9a', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: 'd5cec8afd4d4288052f14f20204f0b934663e4b4', class: "call-to-action" }, hAsync("duet-button", { key: '946e16a6a6648d433e59cb91ff1742c7804b84dc', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: '34a2419381529d6a2800016e5b899b92ca196674' }), hAsync("slot", { key: '33b9196a872c10dd4bfd5533cb6663b06aeb2692' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetContactCardStyle0; }
@@ -8320,20 +8320,20 @@ class DuetFieldset {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '4eb384f65662406ceb5dac5d3afa3123b53d559f', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: '1b74d77a9bee7a63d9667dcc2f7bbe1894e18857', "aria-labelledby": this.labelId, "aria-describedby": this.error ? this.errorId : null,
+        return (hAsync(Host, { key: '0458c4e50d24da4af3af8113caa38616adc77760', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: '22fb700f4f1d215ef9d4606fbb43c69557d12798', "aria-labelledby": this.labelId, "aria-describedby": this.error ? this.errorId : null,
             // NVDA and VoiceOver do not yet support aria-errormessage
             // once they do, we can remove errors from the aria-describedby
             // aria-errormessage={this.error ? this.errorId : null}
             class: {
                 "duet-fieldset": true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("legend", { key: 'bc8894df307f0f7895ca65a8833f00de91c6d902', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: 'd4e9c87bccf8f2848af9caacac7b04a6eeaac99f' }, this.label), this.caption && hAsync("span", { key: '0e3b310bcff0a568df84daccd3c87a2032a1951f' }, this.caption)), hAsync("div", { key: '3e4a21c9412a2aa7c8e7b3af233ff78db59de3f3', class: {
+            } }, hAsync("legend", { key: 'e765ac7a4130bfb53598e8338c717049998d6c5d', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: '186f844695e29b7a9473c1bd8288ba1b6f703e06' }, this.label), this.caption && hAsync("span", { key: '6f427b409fe6e0867a43dac1df4d7ebf713f7276' }, this.caption)), hAsync("div", { key: '5de6480a2da4fad61741586dea079cf527331cf3', class: {
                 "duet-legend-wrapper": true,
                 "duet-legend-has-caption": !!this.caption,
                 "duet-legend-has-tooltip": this.hasTooltip,
                 "duet-legend-hidden": this.labelHidden,
                 "duet-legend-compact": this.compactLabel,
-            } }, hAsync("div", { key: '2d56b17a53ac005d77452fa00e066dd9cd60d03c', class: "duet-fieldset-label" }, hAsync("span", { key: '1653d740645fba60cf74ab251adc37c29292e68e', "aria-hidden": "true" }, this.label), hAsync("slot", { key: '963c6394ba6b4be1a8ee6b8e89101ec96bf96fa0', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: '2d7809730f5df2d775397ffaddd1c433bf920cae', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: 'd8c54c2135dfd07adf048ddc6e6408b23e263a1f', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: '4bccca3aa117b4fd2756065bbaadb3313e29976b' }), hAsync("span", { key: '4be6ce9f08b7f9264378bfa2ca59c253a84e00ed', class: "duet-fieldset-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '9f9394081a9ce027ac98aed5af00f4f7c960cf96' }, this.error)))));
+            } }, hAsync("div", { key: '2737a9a315e1ca8718f7a27d18c494226a7f1ff3', class: "duet-fieldset-label" }, hAsync("span", { key: '659b075a7859fd6dc81bb37654cc4ad7c26afaf0', "aria-hidden": "true" }, this.label), hAsync("slot", { key: '6a1a329c16e4700c8bd13495208a50f3cd9f3caf', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: 'ace3d407eb37d5bdf1e138d3f83ade490557d2d9', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: '3512ec5c46a20001a2cacdc2d5ab666c56bd41ae', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: '974c3c4d2c83f771727d0fa4e5a570b8afa356b2' }), hAsync("span", { key: 'c51b519da01660363f7f05108a2ffb6c0df0df43', class: "duet-fieldset-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '7393b6770d0b0033df71fc98b44ca2e2e24b1577' }, this.error)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetFieldsetStyle0; }
@@ -9968,11 +9968,11 @@ class DuetIcon {
             : {};
         const iconStyles = Object.assign({}, iconRotationStyles);
         const shapeStyle = this.shape === "brand-rotated" ? "duet-icon-shape-brand" : `duet-icon-shape-${this.shape}`;
-        return (hAsync(Host, { key: '395c9d34b58629802851652543d0351555440771', class: {
+        return (hAsync(Host, { key: '4285b685fba78ac61f4d1c44a046ef443d660f40', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-icon-has-outline": !!this.outline,
                 "duet-icon-has-background": !!this.background,
-            } }, hAsync("span", { key: '98e755e1955298019ae340e039416ca5ed04fa6c', "aria-hidden": "true", style: styles, class: {
+            } }, hAsync("span", { key: '6faea3bc218085a73ff1bdb5415b0d88eebc428b', "aria-hidden": "true", style: styles, class: {
                 "duet-icon": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
@@ -9981,7 +9981,7 @@ class DuetIcon {
                 [shapeStyle]: true,
                 rotated: this.shape === "brand-rotated" && this.theme !== "turva",
                 "duet-icon-not-responsive": !this.responsive,
-            } }, hAsync("span", { key: '1a5f2ff89504ee78d476800edc4cb9aeeb6927ae', "aria-hidden": "true", class: { "duet-icon-svg": true, rotated: this.shape === "brand-rotated" && this.theme !== "turva" }, "data-name": this.name, innerHTML: this.svgContent, style: iconStyles }))));
+            } }, hAsync("span", { key: 'a27e478af2767dd7de7215108413bce96e6e9d80', "aria-hidden": "true", class: { "duet-icon-svg": true, rotated: this.shape === "brand-rotated" && this.theme !== "turva" }, "data-name": this.name, innerHTML: this.svgContent, style: iconStyles }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -10789,10 +10789,10 @@ class DuetLink {
     render() {
         const Tag = !this.url ? "button" : "a";
         const isButton = Tag === "button";
-        return (hAsync(Host, { key: '7bc66b5a0d8eda65d73916cf05f7d630dd14618f', class: {
+        return (hAsync(Host, { key: '6bcdceb6f32843e5474b9a1d00f9afef631afc5b', class: {
                 [`duet-link-${this.variation}`]: true,
                 "duet-m-0": this.margin === "none",
-            } }, hAsync(Tag, { key: '5d8bb1467f4ccc765cf0badec8f7df7b870fa337', href: this.url, class: {
+            } }, hAsync(Tag, { key: '8e65e4745097d5253535f228d9a2d61f9961cceb', href: this.url, class: {
                 "duet-link": true,
                 "duet-link-is-external": this.external,
                 "duet-link-is-download": !!this.download,
@@ -10964,14 +10964,14 @@ class DuetListItem {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'a7bcf9dc0ad8d27c83c7c94369d277906e23cc30', class: {
+        return (hAsync(Host, { key: '4d92cde8114cd83fd9d52008a16ce57a934eeb4f', class: {
                 "duet-no-stacking": !this.responsive,
                 "duet-list-item-breakpoint-x-small": this.breakpoint === "x-small",
                 "duet-list-item-breakpoint-small": this.breakpoint === "small",
                 "duet-list-item-breakpoint-medium": this.breakpoint === "medium",
                 "duet-list-item-breakpoint-large": this.breakpoint === "large",
                 "duet-list-item-breakpoint-x-large": this.breakpoint === "x-large",
-            } }, hAsync("dt", { key: '504987050e1628eafd91243247e7242148e1371b' }, hAsync("slot", { key: '94fab56825730065ad5ff075922807ac03e9981a', name: "label" })), hAsync("dd", { key: 'a3b2444a7764edfea66a0e6d63b3ac2f7666ce7c' }, hAsync("slot", { key: '72c2d152465c9278622df1b5b8e947f714977a30', name: "value" }))));
+            } }, hAsync("dt", { key: '58c9679805f2a50dbf3c847157d0a1799feaeeed' }, hAsync("slot", { key: '2f167529b2c16e01e0430267dfe564ad8d9aed6c', name: "label" })), hAsync("dd", { key: '11b92167d9b42d5e5d97b1e056ecc08a25aa1f6e' }, hAsync("slot", { key: '7bb89dc78c1a571df7d27a285435d7c596d3d6f8', name: "value" }))));
     }
     static get style() { return DuetListItemStyle0; }
     static get cmpMeta() { return {
@@ -11316,10 +11316,10 @@ class DuetMenuBarButton {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'ffc0fed54b5acda7a76211091c8c502a8c888937', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: '10bd0d58fcd801865270e6c4ad8afdd11b239ca8', ref: button => (this.nativeButton = button), class: {
+        return (hAsync(Host, { key: '82464805ea51559084ea355862b4f31c8f7e54b4', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: 'f0fa86fc2049ffc2c50d1373f983bfda5016f0dd', ref: button => (this.nativeButton = button), class: {
                 "duet-menu-bar-button": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (hAsync("duet-icon", { key: '0351584d8f7f2a8341daf1423e8f199af10ab67f', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '804d1535f44a67308422421bd17efd7c22dd5717' }))));
+            }, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (hAsync("duet-icon", { key: 'cf6e2dbf37f362d520925c642768d962d4215ad7', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '20d6d69e5e34eb70dc3dd61dcaf100c51862ac02' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarButtonStyle0; }
@@ -11402,17 +11402,17 @@ class DuetMenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'a98baab0fb21943f681bd83c2040bdb1f5d5e464', role: "listitem" }, hAsync("div", { key: '79f52e00b692d398484940f70bd44de78ee5a2a7', class: {
+        return (hAsync(Host, { key: '14604da439d8f76ce91c6ee608491a1e35dbb6cf', role: "listitem" }, hAsync("div", { key: '894acf67c028837682296e787b78815f20536fe8', class: {
                 "duet-menu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
                 [`duet-menu-bar-dropdown--slot-${this.getVariant()}`]: true,
-            } }, hAsync("button", { key: 'fb48e17e2995b4f5e057583339d0fc0149b43375', ref: element => (this.button = element), "aria-label": this.accessibleLabel, "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
+            } }, hAsync("button", { key: '27975670c14a7f50d462c16c311d92e1b7f015e8', ref: element => (this.button = element), "aria-label": this.accessibleLabel, "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
                 active: this.open,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '5a91dcf8a6a2e2289b9b63680233bfa6dc4e0529', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '4ddf5b0d1fd321a4fa02a73122bd28f88f47f527', class: "label" }, hAsync("slot", { key: 'd79067be6dacc22b8b9e9515d4bb019721b6a2c8', name: "label" }), hAsync("duet-icon", { key: '24396bac267909220e577ed663f8d34468919858', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '514af91b0f0396842a5ede32137ff76a9e31bf40', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'da16731cb49afdd761eba05ed7ccd4c022eb5be7', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'a86e2f65da4100756c193ff0a63b0787ae0c458d', class: "label" }, hAsync("slot", { key: 'd8e977ae62ec554a0c41c2e92bfe724a33a36af9', name: "label" }), hAsync("duet-icon", { key: 'd1fd9a923165aeb594c076448f16ca20369f92a9', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'cb6c675efba2ccf218e275d5ba0a9e22b9338706', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'ecd8ef50dbbf9206540a5cb908a8b37e0e60f14a' })))));
+            } }, hAsync("slot", { key: 'f27720a15f413ff6193f40f99c760378c13901e3' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarDropdownStyle0; }
@@ -11472,11 +11472,11 @@ class DuetMenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'dff3e65bfa27e226d174dbf7fdb57c067bcb24f2' }, hAsync("a", { key: 'c90358c20ce27776461c970e68048427cc2503c8', class: {
+        return (hAsync(Host, { key: '8d112f638049058d29ae3ba9ab00d6acbb52f857' }, hAsync("a", { key: '39954a1d2940510a100fc6d20302767612d0bfd0', class: {
                 "duet-menu-bar-dropdown-link": true,
                 [`duet-menu-bar-dropdown-link--slot-${this.getVariant()}`]: true,
                 "duet-theme-turva": this.theme === "turva",
-            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '52930cb9d1151120fa0191844d65f06a8f5f6319', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: '616f450950804fb9a72a010436eb1d7ec4ad02c2' }))));
+            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '488d03db430f04af7c2c6a13f31ae5932a57e40e', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: 'b42533bc5fd7ccc2557d1cb2b2ad7dc8bed68b30' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarDropdownLinkStyle0; }
@@ -11540,11 +11540,11 @@ class DuetMenuBarItem {
      */
     render() {
         const TagName = this.url ? "a" : "button";
-        return (hAsync(Host, { key: '46e23a090bd69731fad23bb7d815fe07949961f1', role: "listitem" }, hAsync(TagName, { key: 'fd2f0cd2b271a5030924b17a318d91ef5f375b26', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
+        return (hAsync(Host, { key: '564cec69e1e6e84d349582f746e7a4398980d788', role: "listitem" }, hAsync(TagName, { key: '3c025a87721de91b523330f2f609064e0e0f973f', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
                 "duet-menu-bar-item": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: 'c5f65e90e67f40726dbd1ad1fcecc275b792fcea', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: 'b9846826ebc0c12f36548a00d1e4156507136f91' }), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: '4d20597bf6e7a17b841c08f429ca64820a01198a', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: 'c615dc0da6804efce3f5e038f578314ce7963a05', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '0944adf559c68a55cbedb75bc8a4d038197dc4fe' }), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: '81b6caf00069e39948f9c1f69370144367bbaf12', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!this.external,
@@ -11599,11 +11599,11 @@ class DuetMenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'efb7d0aed76d4f7da05e21e41d92c63465308df6', role: "listitem" }, hAsync("a", { key: 'ed248ea08e7b2be2dafa2617b9b18935ff6aa583', class: {
+        return (hAsync(Host, { key: '2af75611d72cb2981e7bdd6be6ee1a309eb689b0', role: "listitem" }, hAsync("a", { key: 'a7966c48fbbf6c673c284e22f66b43103033e055', class: {
                 "duet-menu-bar-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: 'cb0bb182c2620d4dd5d0484731f8f7ecca86d7bc', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '686e67b70d05cadb8fa67ed044524dce04e841ff' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '4ff70f1ae3cd9ba219b5ac63e814d3c5ba315f6a', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: 'b1b533c32b451c5c43c7f61101e7b9a6496dd53a' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarLinkStyle0; }
@@ -12237,7 +12237,7 @@ class DuetNav {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '97cff27b21fb239339ebc9dc8bc5c267e20ed1f9' }, hAsync("div", { key: '33276844fc09bd3a555ab9e033db7d5c2640da5c', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: '1f135950c0220a03209aa273bcba83c4477f804a' }), hAsync("slot", { key: '09ac4ab46b3ad110b30ec38907906fe5f16526db', name: "mobile" }), hAsync("slot", { key: '995bc3f699e56d23b8a59df9a84e9a525c970cb3', name: "desktop" }))));
+        return (hAsync(Host, { key: 'fa5b68a21eb6da088274ac9711f26be43b177a86' }, hAsync("div", { key: '2a2d15123cd0e5606ff69d0e2869ab8c13a8a4e4', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: 'cab0fb1889cdf519843b69fccd84095985368366' }), hAsync("slot", { key: '0d2b271a9c2a3ba33ae477d0721a6db43bcbbafc', name: "mobile" }), hAsync("slot", { key: '1f9cb2e419b3033949f8d6fa62a89de558da2da1', name: "desktop" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetNavStyle0; }
@@ -12296,11 +12296,11 @@ class DuetNotification {
         this.linkElement.focus(options);
     }
     render() {
-        return (hAsync("div", { key: '95f620022395e56f383b054bdd44e43eef780659', role: "listitem", class: {
+        return (hAsync("div", { key: 'b2c27c02bb299100ebac95d66cf5537af6894d95', role: "listitem", class: {
                 "duet-notification": true,
                 "duet-notification-highlight": this.highlight,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("a", { key: 'c2b26563af673ed607eda71ac73618a97df4182d', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, hAsync("div", { key: '3a4d58c959a73f4eb54b7b1f2341b6cf47b3111d', class: "duet-notification-container" }, hAsync("div", { key: 'a98286e2d2c067a14faa839ab3dec3d29ff29014', class: "duet-notification-badge-container" }, this.highlight && (hAsync("div", { key: 'fdd7359a0ca2bec377cc7312f1005bb351dc9f81', class: "duet-notification-badge" }, hAsync("duet-visually-hidden", { key: '4974d054afafb18ff69c464d722ee606c02a73fc' }, this.accessibleLabelUnread, ":")))), hAsync("div", { key: '5ce2f9c01226ba63cb3d23f1b878d8384040e92b', class: "duet-notification-content" }, hAsync("slot", { key: 'f99affc9adf412fd40861d10bccd092bfb08f2e9' })), hAsync("div", { key: 'de4db79428641035052ede5c208377823828bcab', class: "duet-notification-date" }, this.date)))));
+            } }, hAsync("a", { key: '984f604d97dfab43781d8e9c4118323f7e3a293c', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, hAsync("div", { key: 'bd80fdaaaa0c09c0e4d7410e8f5504bb7ff24a9e', class: "duet-notification-container" }, hAsync("div", { key: '0b5f665c730bfb41a949c3df042e51751893419a', class: "duet-notification-badge-container" }, this.highlight && (hAsync("div", { key: 'f56d08f232e53a33efd0b604c52656a8f13c99f6', class: "duet-notification-badge" }, hAsync("duet-visually-hidden", { key: 'ef12bed363576791957c9d318fedb9d417199711' }, this.accessibleLabelUnread, ":")))), hAsync("div", { key: 'a0477d9f15ffd3c2f3b70f38ccaf5eceb477b598', class: "duet-notification-content" }, hAsync("slot", { key: '5a607f88b483e286514cc8f5aba85d16ada6c4a7' })), hAsync("div", { key: 'c89051db7b8318c889d3a6c4bb06555c3786b128', class: "duet-notification-date" }, this.date)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetNotificationStyle0; }
@@ -12958,12 +12958,12 @@ class DuetPageHeading {
      */
     render() {
         const layout = this.layout === "narrow" ? "narrow" : this.layout === "fluid" ? "fluid" : "auto";
-        return (hAsync("div", { key: '2a170e4c6fc33fdba313ded3c3f01a78c9ac0866', class: {
+        return (hAsync("div", { key: '803431131648461b8eb0eb01d9e4944e0684d72b', class: {
                 "duet-page-heading": true,
                 "duet-theme-turva": this.theme === "turva",
                 "has-icon": !!this.icon,
                 [layout]: true,
-            } }, hAsync("div", { key: '4b02d9d0134c3cb06bba6bdbd1b20f9d2d26e56a', class: "background" }, this.theme === "turva" && hAsync("div", { key: 'ba779c516b2646ea7b062bd893a5928a91770b51', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: '975ea6aff24cd955e428eb5c92312984dc034d56', class: "brand-shape" }), this.theme !== "turva" && hAsync("div", { key: 'cc7486a21275418c5bb85daef2f87a8272b94aa7', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: '47ea901848ac5c4e50bc3c961d9bfa6f904d6d37', class: "brand-shaped-icon" }, hAsync("duet-icon", { key: '370ac1f81a9d150ca01159b00a60cd8a730aef5f', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: '0b151e3015924091b9e9a35145e23754234641ef', class: "heading" }, hAsync("slot", { key: '89c063ef8fceed0f4c75255f29dcd7200f394976', name: "heading" }), this.progressCurrentStep && this.progressTotalSteps && (hAsync("div", { key: 'ee3688b0e6d3145fbf47501fc353caa398898e5f' }, hAsync("duet-spacer", { key: '0b86d382eee4c4287419fe1c660970f943c32cba', size: "large" }), hAsync("div", { key: 'e0010cce92077310161c55fd134b022eb8f7e035', role: "presentation" }, this.progressIndicator()))))));
+            } }, hAsync("div", { key: '3d0b067e5771f19183bfe546410cd75b90383bda', class: "background" }, this.theme === "turva" && hAsync("div", { key: '0eaf0689b220fd9a664c852c0e8c62dbcd9c93d1', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: 'fb9b5eba13698c957ea9df1bd949aad772f836b0', class: "brand-shape" }), this.theme !== "turva" && hAsync("div", { key: 'eec14617a162263bb9e3952092a85ec31acbcf40', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: 'e28b74c519355e8441e7b88155fe13b5bb22cee2', class: "brand-shaped-icon" }, hAsync("duet-icon", { key: '165c0b3ecfaba195b12de65eb88a72e3028eaee6', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: 'de9f9e024423c7ef4366eb9e0086623a970347e0', class: "heading" }, hAsync("slot", { key: '069af676aa6367b93193b0c9558c1ea8a1f74f47', name: "heading" }), this.progressCurrentStep && this.progressTotalSteps && (hAsync("div", { key: '478b9498b2997e730451e857f0508793d3fc877f' }, hAsync("duet-spacer", { key: 'e22d45a8cb8905c729b0e03f81ccd7263ea80893', size: "large" }), hAsync("div", { key: '0f3dbfb349c731ae7f6928b813bfc49ac35b3aa0', role: "presentation" }, this.progressIndicator()))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPageHeadingStyle0; }
@@ -15328,12 +15328,12 @@ class DuetPromoCard {
             backgroundColor: backgroundColor ? backgroundColor : "none",
         };
         const TagName = this.url ? "a" : "div";
-        return (hAsync(Host, { key: 'c1a1de7dff739a9682d326b8d95ebc1a6b654116', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: 'ca9a98e6b0fd507a266e7df4ea2c9f633c025e94', class: {
+        return (hAsync(Host, { key: 'f83619ce28610acafbc66c1d8392f8c452051c67', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: '8f5ff8b80126c9189aeb1ab0be3d96e242194f8a', class: {
                 "duet-promo-card": true,
                 "duet-theme-turva": this.theme === "turva",
                 "no-bg-color": !this.backgroundColor,
                 "duet-promo-card-link": !!this.url,
-            }, style: bannerStyles }, hAsync(TagName, { key: 'ecd0f55f11b5ab945cb5f8731bfcdf0f9896329f', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { key: '5e172fe31a4f2f5f2a1a332fa8d8b5a1cbf3d01e', class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { key: '0dd4c9c41fea8db65956d2c844fb78a97ab279ef', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: '2d89e751682632487cfcefcdce063886070711a1', class: "pre-heading" }, hAsync("slot", { key: '0e4a51c40d95dd0080de19cd45bf70e117f4a131', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: '72a74b257a084c3ddf7e7285da10875c21db8790', class: "heading" }, hAsync("duet-heading", { key: 'b34a76dad87e9726296d775f3145b2c7b640bee4', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, hAsync("span", { key: '3fd56ffd4b2600856059091709f347f689e8a017' }, hAsync("slot", { key: 'ce33481480a296bc9884ed1de8b77e31232b0f23', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: 'a3c2f1b7a9bc92599183ce1ea8aabebd0849b30b', class: "description" }, hAsync("duet-paragraph", { key: '2e90a512af33afbf6635faa626ff038d3beb2034', theme: this.theme, margin: "none", color: this.textColor }, hAsync("span", { key: '0d774578043b823e14e314169fdcde5d4a4f002d' }, hAsync("slot", { key: '2da893d28fe769d4d5b9bc46104be41223eb96d8', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: 'b20a53961de0cf3392ab726634262978ecb3a6f1', class: "action" }, hAsync("slot", { key: '1221939ab0a8061182f7b648c104ad75ae6f36b4', name: "action" }))))))));
+            }, style: bannerStyles }, hAsync(TagName, { key: '0008fcd8728643f6b15f1d26545c09fdef9caf9b', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { key: '3f059c57eddc0062c1a64a0c24d9c3d37662d030', class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { key: '87fdc0add050a058c55ad6b17c3317c078fce453', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: '21c7ee0d339ec3326172f97fc1e8163d6bfce4e0', class: "pre-heading" }, hAsync("slot", { key: '6704480172514877730a1f71ef0b340b15f9abb1', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: 'e46822a4208488ff40a45205585127183cf5504c', class: "heading" }, hAsync("duet-heading", { key: 'a1f3cfdbe8a21fa11934a97966055f06c6c3165c', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, hAsync("span", { key: 'd9d5a0fbd035137c65b26eaaef8d53856a9fd54f' }, hAsync("slot", { key: '6e47d85c740fb9524d99c8abc7c0ba5b36743d50', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: 'c017d68455e4c071e9b6897096f688dcbe18c639', class: "description" }, hAsync("duet-paragraph", { key: 'd1ec5a43ab5839892ae94b3b63728d455961bee9', theme: this.theme, margin: "none", color: this.textColor }, hAsync("span", { key: '15aeea47848cb9c0ba17d99359e321b96d00a485' }, hAsync("slot", { key: '3aa7cb4344044cc7b2bf73aaafe60eb23bfb5f66', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: '9125fab50390a9c9f220f8f3c54f241ba3ee5c09', class: "action" }, hAsync("slot", { key: 'c56834545acbb95eee257f0ed422f50e80af67c8', name: "action" }))))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPromoCardStyle0; }
@@ -15972,7 +15972,7 @@ class DuetRangeStepper {
     }; }
 }
 
-const duetScrollableCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent}:host{position:relative !important}:host .duet-scrollable-items{position:relative;display:flex}:host .duet-scrollable-items .duet-scrollable-fade-overlay{position:absolute;bottom:0;z-index:250;display:block;width:10px;height:100%;pointer-events:none;transition:transform 300ms ease}:host .duet-scrollable-items .duet-scrollable-fade-overlay--hidden{display:none}:host .duet-scrollable-items:not(.buttons) .duet-scrollable-fade-overlay{}:host .duet-scrollable-items:not(.buttons) .duet-scrollable-fade-overlay.left{left:calc(0px - 10px);background-image:linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items:not(.buttons) .duet-scrollable-fade-overlay.right{right:calc(0px - 10px);background-image:linear-gradient(to left, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items.buttons .duet-scrollable-fade-overlay.left{left:calc(40px - 10px);background-image:linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items.buttons .duet-scrollable-fade-overlay.right{right:calc(40px - 10px);background-image:linear-gradient(to left, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items.buttons .duet-scrollable-button-container{position:relative;flex:0 0 auto;flex-basis:40px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--occluded{flex-basis:0;flex-shrink:1;width:0;padding:10px 0;overflow:hidden;visibility:hidden}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button{position:absolute;display:flex;flex:0 0 auto;flex-basis:40px;align-items:center;height:100%;cursor:pointer;transition:transform 300ms ease}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button:active duet-icon{transition:transform 300ms ease;transform:scale(0.8)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--left{left:0;padding:10px 10px 10px 0}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--right{right:0;padding:10px 0 10px 10px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--top{align-items:flex-start}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--bottom{align-items:flex-end}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button[hidden]{display:none !important}:host .duet-scrollable-items .duet-scrollable-list{display:flex;flex-wrap:nowrap;gap:20px;padding-right:10px;padding-left:10px;margin:0 -10px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scroll-snap-type:x mandatory;scroll-behavior:smooth;scroll-margin:0 20px;-ms-overflow-style:-ms-autohiding-scrollbar;-webkit-overflow-scrolling:touch;}:host .duet-scrollable-items .duet-scrollable-list:not(.buttons){white-space:normal}:host .duet-scrollable-items .duet-scrollable-list::-webkit-scrollbar{display:none}:host .duet-scrollable-items .duet-scrollable-list.collapsed{flex-wrap:wrap}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--xx-small{padding-top:4px;padding-bottom:4px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--x-small{padding-top:8px;padding-bottom:8px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--small{padding-top:12px;padding-bottom:12px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--medium{padding-top:16px;padding-bottom:16px}:host .duet-scrollable-items.center{justify-content:center}:host .duet-scrollable-items.center .duet-scrollable-list.collapsed{justify-content:center}.collapse{width:100%;text-align:center}.collapse.hide{visibility:hidden}::slotted(*){flex-shrink:0;margin-left:0;-webkit-transition:-webkit-transform 0.2s ease-in-out;transition:-webkit-transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;scroll-snap-align:center}";
+const duetScrollableCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent}:host{position:relative !important}:host .duet-scrollable-items{position:relative;display:flex}:host .duet-scrollable-items .duet-scrollable-fade-overlay{position:absolute;bottom:0;z-index:250;display:block;width:10px;height:100%;pointer-events:none;transition:transform 300ms ease}:host .duet-scrollable-items .duet-scrollable-fade-overlay--hidden{display:none}:host .duet-scrollable-items:not(.buttons) .duet-scrollable-fade-overlay{}:host .duet-scrollable-items:not(.buttons) .duet-scrollable-fade-overlay.left{left:calc(0px - 10px);background-image:linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items:not(.buttons) .duet-scrollable-fade-overlay.right{right:calc(0px - 10px);background-image:linear-gradient(to left, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items.buttons .duet-scrollable-fade-overlay.left{left:calc(40px - 10px);background-image:linear-gradient(to right, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items.buttons .duet-scrollable-fade-overlay.right{right:calc(40px - 10px);background-image:linear-gradient(to left, rgb(255, 255, 255), rgba(255, 255, 255, 0))}:host .duet-scrollable-items.buttons .duet-scrollable-button-container{position:relative;flex:0 0 auto;flex-basis:40px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--occluded{flex-basis:0;flex-shrink:1;width:0;padding:10px 0;overflow:hidden;visibility:hidden}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--absolute{position:absolute;top:0;z-index:202;width:auto;height:100%;padding:0 16px;background-color:rgb(255, 255, 255)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--absolute.left{left:-10px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container--absolute.right{right:-10px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button{position:absolute;display:flex;flex:0 0 auto;flex-basis:40px;align-items:center;height:100%;cursor:pointer;transition:transform 300ms ease}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button:active duet-icon{transition:transform 300ms ease;transform:scale(0.8)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--left{left:0;padding:10px 10px 10px 0}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--right{right:0;padding:10px 0 10px 10px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--top{align-items:flex-start}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--bottom{align-items:flex-end}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute{padding:0 7px;border:1px solid rgb(212, 223, 229)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute.duet-scrollable-button--left{border-radius:8px 0 0 8px}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute.duet-scrollable-button--right{border-radius:0 8px 8px 0}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute:hover{border-color:rgb(0, 119, 179);border-width:2px;}.duet-theme-turva :host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button--absolute:hover{border-color:rgb(113, 118, 132)}:host .duet-scrollable-items.buttons .duet-scrollable-button-container .duet-scrollable-button[hidden]{display:none !important}:host .duet-scrollable-items.duet-theme-turva .duet-scrollable-button-container .duet-scrollable-button--absolute:hover{border-color:rgb(113, 118, 132)}:host .duet-scrollable-items .duet-scrollable-list{display:flex;flex-wrap:nowrap;padding-right:10px;padding-left:10px;margin:0 -10px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scroll-snap-type:x mandatory;scroll-behavior:smooth;scroll-margin:0 20px;-ms-overflow-style:-ms-autohiding-scrollbar;-webkit-overflow-scrolling:touch;}:host .duet-scrollable-items .duet-scrollable-list:not(.buttons){white-space:normal}:host .duet-scrollable-items .duet-scrollable-list::-webkit-scrollbar{display:none}:host .duet-scrollable-items .duet-scrollable-list.collapsed{flex-wrap:wrap}:host .duet-scrollable-items .duet-scrollable-list.gap-none{gap:0}:host .duet-scrollable-items .duet-scrollable-list.gap-large{gap:20px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--xx-small{padding-top:4px;padding-bottom:4px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--x-small{padding-top:8px;padding-bottom:8px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--small{padding-top:12px;padding-bottom:12px}:host .duet-scrollable-items .duet-scrollable-list.duet-overflow-padding--medium{padding-top:16px;padding-bottom:16px}:host .duet-scrollable-items.center{justify-content:center}:host .duet-scrollable-items.center .duet-scrollable-list.collapsed{justify-content:center}.collapse{width:100%;text-align:center}.collapse.hide{visibility:hidden}::slotted(*){flex-shrink:0;margin-left:0;-webkit-transition:-webkit-transform 0.2s ease-in-out;transition:-webkit-transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out;transition:transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;scroll-snap-align:center}";
 var DuetScrollableStyle0 = duetScrollableCss;
 
 /**
@@ -16008,8 +16008,10 @@ class DuetScrollable {
         this.collapsed = false;
         this.buttons = true;
         this.buttonAlignment = "center";
+        this.buttonPosition = "relative";
         this.center = false;
         this.padding = "none";
+        this.gap = "large";
         this.selected = 0;
     }
     watchPropHandler(newValue) {
@@ -16177,8 +16179,10 @@ class DuetScrollable {
                 "duet-scrollable-button-container": true,
                 [`${direction}`]: true,
                 "duet-scrollable-button-container--occluded": !this.needsScrolling,
-            } }, hAsync("span", { part: `${this.identifier}-button-${direction}`, "aria-hidden": "true", class: {
+                [`duet-scrollable-button-container--${this.buttonPosition}`]: true,
+            }, hidden: !this.buttons || (this.buttonPosition === "absolute" && scrollPaneLocation) }, hAsync("span", { part: `${this.identifier}-button-${direction}`, "aria-hidden": "true", class: {
                 "duet-scrollable-button": true,
+                [`duet-scrollable-button--${this.buttonPosition}`]: true,
                 [`duet-scrollable-button--${this.buttonAlignment}`]: true,
                 [`duet-scrollable-button--${direction}`]: true,
             }, onClick: () => {
@@ -16186,28 +16190,31 @@ class DuetScrollable {
                 if (document.activeElement) {
                     document.activeElement.blur();
                 }
-            }, hidden: !this.buttons || scrollPaneLocation }, hAsync("duet-icon", { color: scrollPaneLocation ? arrowColorDisabled : arrowColor, name: direction === "left" ? "action-arrow-left" : "action-arrow-right", size: "small", margin: "none" }))));
+            }, hidden: !this.buttons || scrollPaneLocation }, hAsync("duet-icon", { color: scrollPaneLocation ? arrowColorDisabled : arrowColor, name: direction === "left" ? "action-arrow-left" : "action-arrow-right", size: this.buttonPosition === "absolute" ? "x-small" : "small", margin: "none" }))));
     }
     /**
      * render() function
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'ba1e4f4c2221fec32507a3ba66829f2f34dcb225', class: {
+        return (hAsync(Host, { key: 'b504fd4028c66cb3f252f2457231201e8637e39d', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
-            } }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: '5d9131e9e7be00a46d1f919d04127586cc9a6d91', class: {
+            } }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: 'a0c7fefc5d30e27c1fae3999c2966a3fcad784ac', class: {
                 collapse: true,
                 hide: !this.needsScrolling && !this.collapsed,
-            } }, hAsync("duet-button", { key: 'af675db06e61bd24d608ba0395ca54bd8feac172', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: '686ee5f4804f2a3ffd059778eee189633615bf37', name: "collapse-button-label" })))), hAsync("div", { key: '074caf18d31c3b9a019cebf7ca2e8ac6b7ca61e4', class: {
+            } }, hAsync("duet-button", { key: '84516dfa33b911b6d44b4ebc4a6bdb50bb453ac5', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: 'fb5655a9fd34b75aad1058661758f82348a4a095', name: "collapse-button-label" })))), hAsync("div", { key: 'd1e2cb7e141339d16c3b751ac6038be0a0249756', class: {
                 "duet-scrollable-items": true,
                 buttons: this.buttons,
                 center: this.center,
-            } }, this.buttons && this.renderButton("left"), this.renderFadeOverlay("left"), hAsync("div", { key: '64cd0312d4a7b8db126efb7c153519d8c99f61a5', class: {
+                "duet-theme-turva": this.theme === "turva",
+            } }, this.buttons && this.renderButton("left"), this.buttonPosition !== "absolute" && this.renderFadeOverlay("left"), hAsync("div", { key: '88ca7b1fee44baad88a375c3ce3c6771950676da', class: {
                 "duet-scrollable-list": true,
+                [`duet-scrollable-list--${this.buttonPosition}`]: true,
+                [`gap-${this.gap}`]: true,
                 collapsed: this.collapsed,
                 [`duet-overflow-padding--${this.padding}`]: this.padding !== "none",
-            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: '380081180cef409cb8b9e6cd4e572e0699678137' })), this.renderFadeOverlay("right"), this.buttons && this.renderButton("right"))));
+            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: '7897d6cc44537da418aab9644667129fdecef8b5' })), this.buttonPosition !== "absolute" && this.renderFadeOverlay("right"), this.buttons && this.renderButton("right"))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -16223,8 +16230,10 @@ class DuetScrollable {
             "collapsed": [1540],
             "buttons": [4],
             "buttonAlignment": [1, "button-alignment"],
-            "center": [4],
+            "buttonPosition": [1, "button-position"],
+            "center": [516],
             "padding": [1],
+            "gap": [1],
             "selected": [1026],
             "scrollPaneAtStart": [32],
             "needsScrolling": [32],
@@ -16233,7 +16242,7 @@ class DuetScrollable {
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["collapsed", "collapsed"]]
+        "$attrsToReflect$": [["collapsed", "collapsed"], ["center", "center"]]
     }; }
 }
 
@@ -16252,13 +16261,13 @@ class DuetSectionLayout {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '5a0fe7bda2f99a571bb9a91389d22bb429b92176', class: {
+        return (hAsync(Host, { key: '880268957ee754272edd7e40e176726a591b2adb', class: {
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, hAsync("div", { key: 'fa8ce66fb4314c7b613db9d9c8a41a6184998e6f', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'eec70679e3914498d52cf5fabc0b6f107afcb263', class: {
+            } }, hAsync("div", { key: '5e2b1ae22d53f082ba7e458fed1d1b83db828aa6', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '10978c202d2ad0170dbe560f21b6ba7fb1e05bab', class: {
                 "duet-layout": true,
                 [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, hAsync("section", { key: 'a6816d9b522355e91cd3e226d5501b50b27ca0cc', class: "duet-main" }, hAsync("slot", { key: 'be71578ddc8566d81734e0e036416767b0c42899' }))))));
+            } }, hAsync("section", { key: '153963d27cd28795bdc91750aeb4e6cc5a02f208', class: "duet-main" }, hAsync("slot", { key: 'fe61fac6c0e7a60b7d922c06151ab5da69c082da' }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSectionLayoutStyle0; }
@@ -16501,9 +16510,9 @@ class DuetShapedImage {
         const style = {
             "--rotation": `${this.rotation}deg`,
         };
-        return (hAsync(Host, { key: 'cb4154853051eec78a10658344407c1653d737b3', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '5cab0035d46b9e020cf7e4a18105a999646ad437', class: {
+        return (hAsync(Host, { key: 'cd0b0f6d908af8e5c1788f66c005af3d54ec8686', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: 'ab56ab6af75d0a182f5a02ead485ffc9f4205ea4', class: {
                 "shaped-image": true,
-            }, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: '8c2d2bb60ac9042377402dea4453e4ec17885aac', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: '765b32769035c6746c0412be9fe3b70bf8c75039', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
+            }, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: '7933b45865574df0185d2ee4913cba4744215d87', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: '5ad7e042965e34bc68d5e6f277a4f222590e83cc', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
     }
     static get style() { return DuetShapedImageStyle0; }
     static get cmpMeta() { return {
@@ -16898,8 +16907,12 @@ class DuetSlideout {
         };
         this.isSafariBrowser = /^((?!chrome|android).)*safari/i.test(navigator === null || navigator === void 0 ? void 0 : navigator.userAgent);
         this.hasStickyHeaderSlot = false;
-        this.setOpenButton = (element) => {
+        this.setOpenButton = (element, addClickListener = false) => {
+            if (this.openButton) {
+                this.openButton.removeEventListener("click", this.openButtonEventListener);
+            }
             if (!element) {
+                this.openButton = undefined;
                 return;
             }
             try {
@@ -16907,6 +16920,9 @@ class DuetSlideout {
                 button.accessiblePopup = "true";
                 button.accessibleExpanded = false;
                 this.openButton = button;
+                if (addClickListener) {
+                    this.openButton.addEventListener("click", this.openButtonEventListener);
+                }
             }
             catch (_e) { }
         };
@@ -16951,17 +16967,11 @@ class DuetSlideout {
         return this._opener;
     }
     set opener(value) {
-        if (this.opener === value) {
-            return;
-        }
-        if (typeof value === "string") {
-            this.setOpenButton(document.getElementById(value));
-            if (this.openButton) {
-                this.openButton.addEventListener("click", this.openButtonEventListener);
-            }
-        }
-        else {
-            this.setOpenButton(value);
+        const isString = typeof value === "string";
+        const element = isString ? document.getElementById(value) : value;
+        if (this.openButton !== element) {
+            this._opener = value;
+            this.setOpenButton(element, isString);
         }
     }
     /**
@@ -16994,9 +17004,7 @@ class DuetSlideout {
         if (this.mutationObserver) {
             this.mutationObserver.disconnect();
         }
-        if (this.openButton) {
-            this.openButton.removeEventListener("click", this.openButtonEventListener);
-        }
+        this.setOpenButton(undefined);
         this.setStickHeaderStyleMutations(true);
     }
     handleOpenChange(newValue, oldValue) {
@@ -17103,16 +17111,16 @@ class DuetSlideout {
         };
         const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
         const exitTranslation = getLocaleString(this.exitLangObject);
-        return (hAsync(Host, { key: '14fdba7fda5928417732464bfb4fd9b16f7b2064' }, hAsync("div", { key: 'ad888076253b6aadf02beac7fd057ac3fb4fdf3d', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && hAsync("duet-overlay", { key: '402885b296bd543ddbe8cf83908e90a181b9da10', visible: this.open, "display-device": "large", zIndex: "600" }), hAsync("div", { key: 'e93a803cbfbe0be22ec7fd6f70c890bf1b652532', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
+        return (hAsync(Host, { key: '6e5e82df416b1ecb00cff9f68a29958da62a20be' }, hAsync("div", { key: '6159dec7235283ca300ef58f479f6ffbf776a812', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && hAsync("duet-overlay", { key: '07e23e529d9fce358179aa7f5043ba60cc56709e', visible: this.open, "display-device": "large", zIndex: "600" }), hAsync("div", { key: '892d3a0b4d482032bcb690764a6e00b82a3795c3', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
                 dialog: true,
                 hidden: !this.open,
                 modal: this.modal,
-            }, style: styles }, hAsync(FocusGuard, { key: '0e6e26357b438fb966c72cf164a4c39ce8b235bd', moveFocusTo: this.closeButton }), hAsync("div", { key: 'c65959274e1c3191495c03d01adb69c76d23e3e4', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: 'd03362b067baf916076e9992e63933b309e84e44', class: "top" }, hAsync("button", { key: '893421c3ed8c0224031b2db5c2db1f1eb7f1791a', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
+            }, style: styles }, hAsync(FocusGuard, { key: '69f48564aca2c2bcfb4162c4c68dc81253590a09', moveFocusTo: this.closeButton }), hAsync("div", { key: '20f6e5982ba1b1912490953fc6d942a2689ba368', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '1da38aeb57837d9e32cc5e1441e1b585fa94ffa7', class: "top" }, hAsync("button", { key: '99058f882152f721b179848e56b8730ac22505a7', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
                 "slideout-close": true,
                 active: this.open,
-            }, onClick: this.onClick, inert: this.openPanel }, hAsync("duet-icon", { key: '354bcaf0344522712c12904991ade60e97924b88', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: 'a55711bc7b1ad408dc4720372cedc676a303fe84', class: "sticky-header" }, hAsync("slot", { key: '15ef13899e66f98dd681b8105528d8f55fd2f2a2', name: "sticky-header" }))), hAsync("div", { key: '698ce98219d2c6d387e92b96a71967bc632dee00', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
+            }, onClick: this.onClick, inert: this.openPanel }, hAsync("duet-icon", { key: '46a02404e3c835245738669ce08b0f58bf5ff59b', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: 'cc749c84e33bab659bbbdf87f05b3a886ee18880', class: "sticky-header" }, hAsync("slot", { key: 'f4ae41432a781d3e542fe7c4b7cf30d24cadc325', name: "sticky-header" }))), hAsync("div", { key: 'a8fb4902e1118fe7ebce133d5f07425c38c42ee0', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
                 items: true,
-            } }, hAsync("slot", { key: '75862e49d89cdd2e20ecaa574b1c76da95f3c1c6' })), hAsync(FocusGuard, { key: 'e74750f4e595532c2fb7185a40f57efa7e032122', moveFocusTo: this.closeButton })))));
+            } }, hAsync("slot", { key: '0316c27c324fbd1a18cb10793b6d07eb7d90cdd2' })), hAsync(FocusGuard, { key: 'b1f0f1f05d2d5e2db735ad8f96d51acc83c90b82', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -17179,7 +17187,7 @@ class DuetSlideoutLang {
      */
     render() {
         const langTranslation = getLocaleString(this.chooseLangObject);
-        return (hAsync(Host, { key: 'a3f0902bcc3942cfdd9bd39d753bfcfeeebf8bd4' }, hAsync("div", { key: 'e4b2d5245b065602e7b74bab03d2ad9a6390d5ab', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: '10f383d1179787ca4dda410b10ac2785bcbbcc36', name: "navigation-language", margin: "none", color: "secondary" }), hAsync("slot", { key: '3a3f899dd72eb996f48ac588474810a95fa6fc19' }))));
+        return (hAsync(Host, { key: '7fdf56886b7eef7853a2390545e83b43e1aea17b' }, hAsync("div", { key: '95c15df38395b09803b5a48382950a07d5d8a6b1', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: '5500047f8d4ae1a3d118abd0e0e850211212cc4a', name: "navigation-language", margin: "none", color: "secondary" }), hAsync("slot", { key: '906ac6c0864cf946423ed34875c4c122e0784113' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutLangStyle0; }
@@ -17223,12 +17231,12 @@ class DuetSlideoutLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '756d30871c5f34ca3520a5bdecf5269c6a0b4afb' }, hAsync("a", { key: '16dfc8d2bcae2379ab25ce353eda255e79d6ad6b', class: {
+        return (hAsync(Host, { key: 'aa07296629d813134f481a3e1ebfb6d31951bc48' }, hAsync("a", { key: '56ae85701570dfa3ae4cae8f15fb395f9199776a', class: {
                 "duet-slideout-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [this.size]: true,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '6551aa92fee9498b1fc2b4ebb18a89ff1c72e607', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), hAsync("div", { key: 'f841f0d234ffca0d1dbaaae18e9de9f1de02de55', class: "label" }, hAsync("span", { key: '452f28fecf67c0da43ea807dd572d1db83e10ae6' }, hAsync("slot", { key: '896258d4f5fbcc5efa21d49cd867e0578302dbef' }), hAsync("slot", { key: '6de4aa964201a5ffe68d7f894a499289db302527', name: "description" })), this.caret && (hAsync("duet-icon", { key: '3b7c9337d8d76eb9bcc71fe7277e84599692bce4', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '4872989601ff5a2c3ff458b53345292f358956a9', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), hAsync("div", { key: '71fe6a89063381d1ec5d4a8d6960954660374bc0', class: "label" }, hAsync("span", { key: 'b9e2aca6c05cc945917f87d74b3f4c611814e8cb' }, hAsync("slot", { key: 'b917c1d51c62a2ab229c396f7afb3468c0b240e6' }), hAsync("slot", { key: '775dbc1e31d128b448b72e876f0f53609358c709', name: "description" })), this.caret && (hAsync("duet-icon", { key: '47c65d4e0cc5745e120730849beb97dcee30cb74', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutLinkStyle0; }
@@ -17388,23 +17396,23 @@ class DuetSlideoutPanel {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (hAsync(Host, { key: '10b414a1d813be3e7f5ef8070b2c1d984c25ac44' }, hAsync("div", { key: '50ee38592ea290018fefaf87e3c8625579636ed9', class: {
+        return (hAsync(Host, { key: '4f6b906ea71b580ba0caff7862d79e685515e872' }, hAsync("div", { key: '5b9938129529e0abdbf3d61ca38814fef9cf5cf4', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, hAsync("button", { key: '4222c80ec11e0f6acb4eeaebf216968e42537c70', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, hAsync("button", { key: 'bd4e836d9da0174031251e74c5d34db39f3f17c1', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 link: true,
                 active: this.active,
-            }, onClick: this.onClick, inert: this.open }, this.icon && (hAsync("div", { key: 'ef87af453a36ae15d81ed98b882798092522610c', class: "duet-slideout-icon" }, hAsync("duet-icon", { key: '540a8e1f36285104c675438d0a053ce5a8aeaa38', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && hAsync("div", { key: 'a90b2189e9b0fe8325b12db27faa55955a5aaa0b', class: "duet-slideout-badge" }))), hAsync("span", { key: '9f266762f46f74d6c627098e57315df106bf9dfe', class: "label" }, hAsync("span", { key: '60a41c1094f9ba9b51cd6e29666af8f601b8a8d2', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: '4160b184173ed8e9e3e93cee11cb8b797911c350', name: "label" })), hAsync("duet-icon", { key: '1572389c79f37ff516d2462ec7dfc9e6e740c6c8', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: 'fc738196e7f3d69ca2cc01db8fcbf5a7be3c39f1', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && (hAsync("div", { key: '5a365effdcebd66bbc8d75eeb39e1ee0191beeb4', class: "duet-slideout-icon" }, hAsync("duet-icon", { key: '29aba3ddbefd3d672a5363f7aab60c3991774dba', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && hAsync("div", { key: '077cac4c7174dc6447fc47119aa490452761c496', class: "duet-slideout-badge" }))), hAsync("span", { key: '0e93520908b67a9e847ca2ab7423981677333d2c', class: "label" }, hAsync("span", { key: '39442d5e839c85757a0432fe11f969e578071a63', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: '8d98e276788faa2763ba3fc54465330ee20b8ef7', name: "label" })), hAsync("duet-icon", { key: 'af4c4882cb21ce8308f00cb0092eabb3c5504ca9', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: '71e6a873aebc6b069ed3b662f60e2836e88c0768', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, hAsync(FocusGuard, { key: '00a3795728a3374280aaa5f2b6b97f67bac388c6', moveFocusTo: this.closeButton }), hAsync("div", { key: '84e8cf7f05aedd1fd6df3f08cd06b66abbd1ef17', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: 'a462d45d835fe35e6ce1e64e9527aeae033c192f', class: "top" }, hAsync("button", { key: '5b4eb5d8985437d6701987273dbe10d55185c0cf', ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-label": `${backTranslation}`, type: "button", class: {
+            }, style: styles }, hAsync(FocusGuard, { key: 'e569bb2925b05d5efb54f7b989866db66e7ffb18', moveFocusTo: this.closeButton }), hAsync("div", { key: 'aa65fd87af6069abde6bc75704d81908bd029711', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '575ac5a4587e6da02b5e2e25b0e20bb33682b146', class: "top" }, hAsync("button", { key: '4295a54970f66eafff8c3e4387601de695f42be4', ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-label": `${backTranslation}`, type: "button", class: {
                 back: true,
-            }, onClick: this.onClick }, hAsync("duet-icon", { key: 'b17a49853ca91e459db693d0c1dcbe861f9ee663', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: '033f64eb9236b0a1cc28214b0393f3c7e62d62f2' }, this.label.innerHTML), hAsync("button", { key: '005c6e62887ae4effd15bc19266a4b72d45f11bc', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: '0934dfbccb73be3827e684b1414f2a76c080b0fb', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '984c15369f3cd4a09dfd02efe5aa65effb2f453c', class: "sticky-header" }, hAsync("slot", { key: '28aea810fee655e0039f9412a5a0e979d4e0991e', name: "sticky-header" }))), hAsync("div", { key: 'd0fed891a8cd1320d5edd35d4461d1df9f1bec7d', tabindex: "-1", role: "menu",
+            }, onClick: this.onClick }, hAsync("duet-icon", { key: 'c3f91ef9423ba10b7ac4d2629c5fb64cd5e08bd2', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: '52032aa97cc19a95f91552a930cd889fe1b62b4d' }, this.label.innerHTML), hAsync("button", { key: 'b379d71da45ca0bd9fb9a314e3b9840309aec919', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: 'ffc2b05a5a751e180b6d8a214cfb1f35fc5a5870', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: 'f92511246cc63b6e8a66d5c3ea0ad967666a340c', class: "sticky-header" }, hAsync("slot", { key: 'bf6a0326ae3c93476614fe52837cfac964e4d46e', name: "sticky-header" }))), hAsync("div", { key: 'e95ca842f9bd2a732f74659b40f17c6afda7929f', tabindex: "-1", role: "menu",
             //TODO: slideout menu fades out, needs to be instant
             id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, hAsync("slot", { key: '859c0b8b029620561483192901482f2d7ac69fd8' })), hAsync(FocusGuard, { key: '5676e24c74f3223c83eaa6cf67d05cc93c8ea339', moveFocusTo: this.closeButton })))));
+            } }, hAsync("slot", { key: 'b37c65c7a43d6bcac92a2a183f4edf85883cbecf' })), hAsync(FocusGuard, { key: '1e6c58673a5953e5a75571909130bdebdc5a6de2', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -17474,16 +17482,16 @@ class DuetSlideoutPanelDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '79b5b5d923940bc3b0ab0515ccab7d498b327d5e' }, hAsync("div", { key: 'b66ac749e1950d6c70c1c465479604cd91c03cfd', class: {
+        return (hAsync(Host, { key: '15a51ee1392b5cfaf0faf892381a354e9c2ad7a8' }, hAsync("div", { key: '7a65752a7969698e0a6b9994dcc4c0d3eea60ede', class: {
                 "duet-slideout-panel-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, hAsync("button", { key: '7155b74267a0786267237b0170e30a4c20d8d180', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, hAsync("button", { key: '35ce652834bb7c5dfbf2b6211cfbfd2130c2e588', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 active: this.active,
-            }, onClick: this.onClick }, this.icon && hAsync("duet-icon", { key: '014c5790e8eb52f02d10ecf398271b233b88f7b0', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: 'be3875ea25d4f094220b3599aa15bf7e014e81bd', class: "label" }, hAsync("slot", { key: '36b0112f4b2aa6ed192c19da3397beca24b8b29c', name: "label" }), hAsync("duet-icon", { key: '2d4c1df9d41e97d1c7bb031252d31baa865a587c', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: 'a9729a27afa76ccee3c7d3b14e7d48dab1dcb7a3', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, this.icon && hAsync("duet-icon", { key: '963ee3c6c6d7ecc6c94a08afe16d3f5f9dafaa66', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: 'd4e56a5ba15d2d6cbe9dc2cd005b09d538fff5a1', class: "label" }, hAsync("slot", { key: '0264c8d9575e402e1bb0042a5d4603d7da816156', name: "label" }), hAsync("duet-icon", { key: 'd406ceffdb866733a623fd3000f88eed53984cef', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: '28cf7810dd58248178981e491e918138cf3d2d58', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '63761e3a8bbea310fbc531dd63eae808be5cf3e4' })))));
+            } }, hAsync("slot", { key: '9c02645c7b1732774cfe05087e819acf382733e0' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutPanelDropdownStyle0; }
@@ -17950,19 +17958,19 @@ class DuetSubmenuBar {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'e1887ce1a641c6c58a54f0cc22d6548b71274312' }, hAsync("nav", { key: '324f9788c4c5f0f07b6a6462e6333b9021c24b8d', class: {
+        return (hAsync(Host, { key: '5a56d3033586978e79fc650f948ee3e654c74288' }, hAsync("nav", { key: 'f95152df380577251c94868a2b1a03b493482a77', class: {
                 "duet-submenu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 hidden: this.hidden,
-            }, "aria-label": this.accessibleLabel }, this.hasItems && (hAsync("button", { key: '5f4aab6f8d310a840b9428d100990a279bd88344', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
+            }, "aria-label": this.accessibleLabel }, this.hasItems && (hAsync("button", { key: '5cfc4bfc97b1c462e6a504735808925e66d42018', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
                 active: this.open,
-            }, onClick: this.onClick }, hAsync("span", { key: '80740c4fe31825abf62d11762f8c11bcab49b3c1', class: "label" }, hAsync("slot", { key: 'b59a92e6417e6c0da5dfce940b386cd026fa4f26', name: "label" }), hAsync("duet-icon", { key: '370f031d4cd186535f3f62f5952461914364ca8a', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: 'a482eaf5d9705512b952c67ef7e038fcce800c5a', class: {
+            }, onClick: this.onClick }, hAsync("span", { key: 'aaf7e9216f796c05bcd44131869c241ed6791dea', class: "label" }, hAsync("slot", { key: 'd98b04e45e3be67aac0d0ffdceb13f214ad24052', name: "label" }), hAsync("duet-icon", { key: 'd680597442edb82e4fbc8615a818684cbbc19488', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: '3caf8786684e484dff8b20fbb4c273f33bfc7cbf', class: {
                 "menu-container": true,
                 hidden: !this.open,
-            }, role: "presentation" }, hAsync("div", { key: '8e71057de372c6ec2c2c9b00a754e9dddbe5ff14', role: this.mobile ? "menu" : null, id: "menu", "aria-labelledby": this.mobile ? "button" : null, "aria-expanded": this.mobile ? (this.open ? "true" : "false") : null, class: {
+            }, role: "presentation" }, hAsync("div", { key: '8b582ed198b49ed593b8dce4ab7ca5f1c7824d29', role: this.mobile ? "menu" : null, id: "menu", "aria-labelledby": this.mobile ? "button" : null, "aria-expanded": this.mobile ? (this.open ? "true" : "false") : null, class: {
                 items: true,
                 hidden: !this.open,
-            }, ref: element => (this.itemsContainer = element) }, hAsync("div", { key: '6b216f3309c1da5a171a3fa39b31fcad805d76f4', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: 'f4c31cc6c1c32d56d50a0d2e664ebf727255a025' }), hAsync("div", { key: '0a170fb9952aefa7fa6150514497fdef9caf8cea', class: "list-padding" }))), hAsync("duet-overlay", { key: 'd513c9c698863e334c70587b7d905023d48d2f46', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
+            }, ref: element => (this.itemsContainer = element) }, hAsync("div", { key: 'e34b873658de23e4164810509a93ce533f6eb094', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: '8f46f67375fad075efc56a28794c4706d85da4e1' }), hAsync("div", { key: 'af6a6337b995853fbc04e8f50d7248c1d0878e4e', class: "list-padding" }))), hAsync("duet-overlay", { key: 'ec26b0420f1eb4a93fa019cc24d22d3f160e7788', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -18083,18 +18091,18 @@ class DuetSubmenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '82d9bb10d3b975fb643a1ff0735369158fc0267d', role: "listitem" }, hAsync("div", { key: '04220a59fb49f405a8e072c61dd7f629275844a9', class: {
+        return (hAsync(Host, { key: '27c7987ace491bb1c392d343e7fb77964a8e01e6', role: "listitem" }, hAsync("div", { key: 'c81d2ea06dd9d7be974b8ce0afb38aec268083f2', class: {
                 "duet-submenu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 open: this.open,
                 active: this.active,
-            } }, hAsync("button", { key: 'e3b117a883729e81e5b044b700638798005758a7', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, hAsync("button", { key: 'e5aa57571f004c86e1da8f35b31be84f85c9b795', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 open: this.open,
                 active: this.active,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '4f6aa1cd847b01bb6149300dd095bc2d90f0f8ee', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'e4e0fe843ffb97eb94ac1940b3daabbfdebaed09', class: "label" }, hAsync("span", { key: '7527471d9064055386d235ff8a576a66b93e9246', class: "label-text" }, hAsync("slot", { key: '13887aced4d286f3a79ffd7f125f124801d436a8', name: "label" })), hAsync("duet-icon", { key: 'aa48764d6c7ee181d825621d1b565a92d0ac1a58', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'b03feb7412459e67e233d5c1dcf6f6263e574898', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '28d03b6fd216ea81b1510b5c0af41df61b69610e', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '388a6679345cd44d696d41dc027ec479ae0db473', class: "label" }, hAsync("span", { key: '88e6ce4a33c009e72e1258d35f1eddabbacc3654', class: "label-text" }, hAsync("slot", { key: '246e8f4033aa438782153691904e29a76450734c', name: "label" })), hAsync("duet-icon", { key: '932079ae3e397891f203e7e876afbc83bb1258de', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '2353d72ac49a26b83fe262e30dd443819169bc1d', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'a1ad4d341602b1f922d38f24c8183be203867abb' })))));
+            } }, hAsync("slot", { key: 'c21a441648636df186c7440b2c12f248712aecae' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarDropdownStyle0; }
@@ -18146,12 +18154,12 @@ class DuetSubmenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '06b062162cb366accf11fd8844dc842cb4086e11' }, hAsync("a", { key: 'aeba09894b5f6a4aec3c462fef6f62966fd3849f', class: {
+        return (hAsync(Host, { key: '60141679d4da6a7724aa40a2445f9453b89493f1' }, hAsync("a", { key: '7bcc708536db8a5bae64318ea75be58e8814a9ee', class: {
                 "duet-submenu-bar-dropdown-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 highlight: this.highlight,
                 active: this.active,
-            }, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '72463c8f6d29475ed51097a63b8c627e35454570', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: '457b5b54be2bdbb03e665ed5549ac06b45e0a591', class: "label-container" }, hAsync("span", { key: '0fe3839576cb252a5f928774b0808bf85913d6fe', class: "label" }, hAsync("slot", { key: '4ca119e9809d2122107fbade53b8f0d21f499f99' })), this.caret && hAsync("duet-icon", { key: '98119ea79cc812daa6857fa4286c97f0ffd6d4ca', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: 'c4cbb062c343bb3bf6b15d771de4618f1d75b531', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
+            }, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '3154b1713b8ee0ecb9dde907cc87b59193051c67', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: 'b7e0771fb6af597db0aeab77c26b6f10ad5fd37f', class: "label-container" }, hAsync("span", { key: 'a2356f448e5634bc9a3e0151cb71adf812cc4135', class: "label" }, hAsync("slot", { key: '01ede3bc095dbb8c37a7d0d7506b59b844f005d2' })), this.caret && hAsync("duet-icon", { key: '57d6d0dee133a2a16ea63ee8dfe6707beb4a5231', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: '1601244392f22c8232aba7daa7a473b711b695d4', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarDropdownLinkStyle0; }
@@ -18225,7 +18233,7 @@ class DuetSubmenuBarItem {
     render() {
         const TagName = this.url ? "a" : "button";
         const role = this.url ? "link" : "button";
-        return (hAsync(Host, { key: 'b31ed9815a70a51dcd572ca7d1485930c2440939', role: "listitem" }, hAsync(TagName, { key: '9ee1cc13ac91783544600e501b1fab1eb70997d6', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '4deab5b50ec0e4066872c2744cb8e65d0a0e7287', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '46be26631ba05fed851d7fb9c74cf11d6ce925a8', class: "label" }, hAsync("span", { key: '3bb375080720c6d70901eb425d85bcc3829454ee', class: "label-text" }, hAsync("slot", { key: 'fd3e9665db1ff76e1435288cefffba0c9e75273b' })), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: 'a3f85c5afc2a5234e3aad56f7262030ef3ad509e', class: {
+        return (hAsync(Host, { key: '422b60d03cfc581066bf2a651c455d9ef443b176', role: "listitem" }, hAsync(TagName, { key: '50b6aeb9f94871750adabb74239ea642f0667bc8', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '383cc30c4a1255e7f644a4f8274b238c06e59d34', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '4a8d38ffde015d48649c9bfd6167c69e3b964146', class: "label" }, hAsync("span", { key: '713811bc3a97ccaccaceda79f199c53ae9fa33f5', class: "label-text" }, hAsync("slot", { key: '140d7d6c6bce716719347aa37b031c17ae3fb6d2' })), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: '692f1e1e6582473a9c738f878be4a9dd58ce2d13', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!this.external,
@@ -18286,7 +18294,7 @@ class DuetSubmenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '0a4400868d61377b3ce3df2c080a0aa42ad53a8b', role: "listitem" }, hAsync("a", { key: '005d137af08a1c049d12707de80a41968e29b6fe', class: { "duet-submenu-bar-link": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.href, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false" }, this.icon && (hAsync("duet-icon", { key: '3d900e1209d6e99e2361348c9fda2b0e562987b4', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: '99b597aeb8dbe29036e8e006160c86884f5e3387', class: "label" }, hAsync("slot", { key: '8c81d3eb726c6e5fd647e351f1fdeb7eab64d109' })))));
+        return (hAsync(Host, { key: '9e08c272ab8cc2dd9aafbdc95544134a516910fc', role: "listitem" }, hAsync("a", { key: '8db55a81215eb0842ea3f90d224cffb3edf37ddb', class: { "duet-submenu-bar-link": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.href, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false" }, this.icon && (hAsync("duet-icon", { key: 'd9189db67ff4c5a2b9d80c6ec4939f6628481bac', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: 'bad512b87073b3f25cb22f9b72dee43d1a76b28c', class: "label" }, hAsync("slot", { key: '3afcf14180bccbbacf368d368673d863a9fdfc61' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarLinkStyle0; }
@@ -18426,7 +18434,7 @@ class DuetTab {
     }; }
 }
 
-const duetTabGroupCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;display:block;width:100%}.duet-tab-group-tabs{margin-bottom:28px !important;display:block;width:100%;max-width:100%;padding-top:2px;list-style:none}.duet-tab-group-tabs.duet-m-0{margin:0 !important}.duet-tab-group-tabs.duet-tab-group-collapses.duet-tab-group-hidden{display:none}@media (min-width: 36em){.duet-tab-group-tabs.duet-tab-group-collapses.duet-tab-group-hidden{display:block}}.duet-tab-variation-plain .duet-tab-group-tabs{border-bottom:1px solid rgb(212, 223, 229)}.duet-theme-turva.duet-tab-variation-plain .duet-tab-group-tabs{border-bottom-color:rgb(222, 224, 228)}.duet-tab-variation-checked .duet-tab-group-tabs{display:flex;gap:4px;padding-right:12px;padding-left:12px;overflow-x:scroll;-ms-overflow-style:none;scrollbar-width:none;}.duet-tab-variation-checked .duet-tab-group-tabs::-webkit-scrollbar{display:none}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-group-tabs{gap:8px;padding-right:16px;padding-left:16px;overflow:visible}}.duet-tab-plain-scrolling .duet-tab-group-tabs{display:flex;overflow-x:scroll;scroll-behavior:smooth;-ms-overflow-style:none;scrollbar-width:none;}.duet-tab-plain-scrolling .duet-tab-group-tabs::-webkit-scrollbar{display:none}@media (min-width: 36em){.duet-tab-plain-scrolling .duet-tab-group-tabs{display:block;overflow:auto}}@media (min-width: 36em){duet-select{display:none !important}}.duet-tab-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:block;width:100%;padding:20px;margin-top:-2px;overflow:visible;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600;line-height:1.1;color:rgb(8, 42, 77);text-align:left;text-decoration:none;cursor:pointer;background:rgb(255, 255, 255);border:2px solid rgb(212, 223, 229);border-radius:0;transition:150ms ease}.duet-tab-button.duet-p-0{padding:0 !important}.duet-tab-button.duet-m-0{margin:0 !important}.duet-tab-button.duet-notification-mark-warning::after{position:absolute;top:6px;right:6px;display:inline-block;width:6px;height:6px;content:\"\";border-radius:50%;background:rgb(247, 178, 40);box-shadow:0 0 0 1px #dea024}.duet-tab-variation-plain .duet-tab-button.duet-notification-mark-warning::after{top:calc(50% - 0.5rem - 6px);right:-6px}.duet-tab-button.duet-notification-mark-danger::after{position:absolute;top:6px;right:6px;display:inline-block;width:6px;height:6px;content:\"\";border-radius:50%;background:rgb(214, 28, 82);box-shadow:0 0 0 1px #c1194a}.duet-tab-variation-plain .duet-tab-button.duet-notification-mark-danger::after{top:calc(50% - 0.5rem - 6px);right:-6px}.duet-theme-turva .duet-tab-button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58);border-color:rgb(222, 224, 228)}.duet-theme-turva .duet-tab-button.duet-notification-mark-warning::after{position:absolute;top:6px;right:6px;display:inline-block;width:6px;height:6px;content:\"\";border-radius:50%;background:rgb(247, 178, 40);box-shadow:0 0 0 1px #dea024}.duet-tab-variation-plain .duet-theme-turva .duet-tab-button.duet-notification-mark-warning::after{top:calc(50% - 0.5rem - 6px);right:-6px}.duet-theme-turva .duet-tab-button.duet-notification-mark-danger::after{position:absolute;top:6px;right:6px;display:inline-block;width:6px;height:6px;content:\"\";border-radius:50%;background:rgb(214, 28, 82);box-shadow:0 0 0 1px #c1194a}.duet-tab-variation-plain .duet-theme-turva .duet-tab-button.duet-notification-mark-danger::after{top:calc(50% - 0.5rem - 6px);right:-6px}.duet-tab-button.duet-p-0{padding:0 !important}@media (min-width: 36em){.duet-tab-button{display:inline-block;width:auto;margin-left:-2px;border-right:2px solid rgb(212, 223, 229);border-radius:0}}.duet-tab-button:hover{z-index:200;border-color:rgb(127, 150, 165)}.duet-theme-turva .duet-tab-button:hover{border-color:rgb(143, 147, 158)}.duet-tab-button:active{opacity:0.75;transition:none}.duet-tab-button.selected{z-index:201;color:rgb(255, 255, 255);background:rgb(8, 42, 77);border-color:rgb(8, 42, 77);outline:0;box-shadow:none !important}.duet-theme-turva .duet-tab-button.selected{color:rgb(255, 255, 255);background-color:rgb(23, 28, 58);border-color:rgb(23, 28, 58)}.duet-tab-button:focus{z-index:200;outline:0}:host(.user-is-tabbing) .duet-tab-button:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}:host(.user-is-tabbing) .duet-theme-turva .duet-tab-button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tab-button:first-child{border-top-left-radius:4px;border-top-right-radius:4px}@media (min-width: 36em){.duet-tab-button:first-child{border-top-right-radius:0;border-bottom-left-radius:4px}}.duet-tab-button:last-child{border-bottom-right-radius:4px;border-bottom-left-radius:4px}@media (min-width: 36em){.duet-tab-button:last-child{border-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px}}.duet-tab-variation-plain .duet-tab-button{display:inline-block;width:auto;padding-right:0;padding-left:0;margin-left:0;border:0;border-radius:0;transition:none}.duet-tab-variation-plain .duet-tab-button+.duet-tab-button{margin-left:36px}.duet-tab-variation-plain .duet-tab-button.selected{color:rgb(0, 119, 179);background:rgb(255, 255, 255);border-bottom:3px solid rgb(0, 119, 179)}.duet-theme-turva.duet-tab-variation-plain .duet-tab-button.selected{color:rgb(198, 12, 48);border-bottom-color:rgb(198, 12, 48)}.duet-tab-variation-checked .duet-tab-button{position:relative;display:inline-block;flex-basis:0;flex-grow:1;width:200px;min-width:200px;padding:8px 4px;border-color:rgb(181, 198, 208);border-bottom-color:rgb(0, 119, 179);border-radius:4px 4px 0 0;transition:none}.duet-theme-turva.duet-tab-variation-checked .duet-tab-button{border-color:rgb(181, 198, 208);border-bottom-color:rgb(113, 118, 132)}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button{min-width:0;padding:16px}}.duet-tab-variation-checked .duet-tab-button.stackable-tab{min-width:0}.duet-tab-variation-checked .duet-tab-button:first-child{margin-left:auto}.duet-tab-variation-checked .duet-tab-button:last-child{margin-right:auto}.duet-tab-variation-checked .duet-tab-button:active{opacity:1;transition:none}.duet-tab-variation-checked .duet-tab-button.selected{color:rgb(0, 119, 179);background:linear-gradient(180deg, rgb(240, 247, 250) 0%, rgb(255, 255, 255) 100%);border-color:rgb(0, 119, 179);border-bottom-color:#fff}.duet-theme-turva.duet-tab-variation-checked .duet-tab-button.selected{color:rgb(23, 28, 58);background:linear-gradient(180deg, rgb(245, 247, 250) 0%, rgb(255, 255, 255) 100%);border-color:rgb(113, 118, 132);border-bottom-color:#fff}.duet-tab-variation-checked .duet-tab-button .checked-tab-content{display:flex;flex-direction:row;justify-content:space-between}.duet-tab-variation-checked .duet-tab-button .checked-tab-content.stackable-checked-tab-content{flex-direction:column;height:100%}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button .checked-tab-content.stackable-checked-tab-content{flex-direction:row}}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description{display:flex;flex-direction:column;overflow:hidden;overflow-wrap:break-word}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description.stackable-description{text-align:center}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description.stackable-description{text-align:left}}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption{margin-top:4px;font-size:0.875rem;font-weight:400;color:rgb(98, 121, 138)}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption{font-size:1rem;text-align:left}}.duet-theme-turva.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption{color:rgb(113, 118, 132)}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption.selected{color:rgb(0, 119, 179)}.duet-theme-turva.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption.selected{color:rgb(113, 118, 132)}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .stackable-checkmark{order:-1;margin-top:8px;margin-bottom:8px}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button .checked-tab-content .stackable-checkmark{order:1}}.duet-tab-group-content{position:relative;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(8, 42, 77);text-align:left}.duet-tab-group-content:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}.duet-theme-turva .duet-tab-group-content:focus,.duet-tab-group-content:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tab-group-content.checked-group-content{padding:28px 0 28px 0}.duet-tab-group-content.checked-group-content::after{position:absolute;top:-2px;left:0;width:100%;height:2px;content:\" \";background-color:rgb(0, 119, 179)}.duet-theme-turva .duet-tab-group-content{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-theme-turva .duet-tab-group-content.checked-group-content::after{background-color:rgb(113, 118, 132)}";
+const duetTabGroupCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;display:block;width:100%}.duet-tab-group-tabs{margin-bottom:28px !important;display:block;width:100%;max-width:100%;padding-top:2px;list-style:none}.duet-tab-group-tabs.duet-m-0{margin:0 !important}.duet-tab-variation-plain .duet-tab-group-tabs{border-bottom:1px solid rgb(212, 223, 229)}.duet-theme-turva.duet-tab-variation-plain .duet-tab-group-tabs{border-bottom-color:rgb(222, 224, 228)}.duet-tab-variation-checked .duet-tab-group-tabs{display:flex;gap:4px;padding-top:0;padding-right:12px;padding-left:12px;overflow-x:scroll;-ms-overflow-style:none;scrollbar-width:none;}.duet-tab-variation-checked .duet-tab-group-tabs::-webkit-scrollbar{display:none}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-group-tabs{gap:8px;padding-right:16px;padding-left:16px;overflow:visible}}.duet-tab-plain-scrolling .duet-tab-group-tabs{display:flex;overflow-x:scroll;scroll-behavior:smooth;-ms-overflow-style:none;scrollbar-width:none;}.duet-tab-plain-scrolling .duet-tab-group-tabs::-webkit-scrollbar{display:none}@media (min-width: 36em){.duet-tab-plain-scrolling .duet-tab-group-tabs{display:block;overflow:auto}}@media (min-width: 36em){duet-select{display:none !important}}.duet-tab-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:inline-block;width:auto;padding:20px;margin-left:-2px;overflow:visible;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600;line-height:1.1;text-align:left;text-decoration:none;cursor:pointer;border-right:2px solid rgb(212, 223, 229);border-radius:0;transition:150ms ease}.duet-tab-button.duet-p-0{padding:0 !important}.duet-tab-button.duet-m-0{margin:0 !important}.duet-tab-button.duet-notification-mark-warning::after{position:absolute;top:6px;right:6px;display:inline-block;width:6px;height:6px;content:\"\";border-radius:50%;background:rgb(247, 178, 40);box-shadow:0 0 0 1px #dea024}.duet-tab-variation-plain .duet-tab-button.duet-notification-mark-warning::after{top:calc(50% - 0.5rem - 6px);right:-6px}.duet-tab-button.duet-notification-mark-danger::after{position:absolute;top:6px;right:6px;display:inline-block;width:6px;height:6px;content:\"\";border-radius:50%;background:rgb(214, 28, 82);box-shadow:0 0 0 1px #c1194a}.duet-tab-variation-plain .duet-tab-button.duet-notification-mark-danger::after{top:calc(50% - 0.5rem - 6px);right:-6px}.duet-theme-turva .duet-tab-button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-theme-turva .duet-tab-button.duet-notification-mark-warning::after{position:absolute;top:6px;right:6px;display:inline-block;width:6px;height:6px;content:\"\";border-radius:50%;background:rgb(247, 178, 40);box-shadow:0 0 0 1px #dea024}.duet-tab-variation-plain .duet-theme-turva .duet-tab-button.duet-notification-mark-warning::after{top:calc(50% - 0.5rem - 6px);right:-6px}.duet-theme-turva .duet-tab-button.duet-notification-mark-danger::after{position:absolute;top:6px;right:6px;display:inline-block;width:6px;height:6px;content:\"\";border-radius:50%;background:rgb(214, 28, 82);box-shadow:0 0 0 1px #c1194a}.duet-tab-variation-plain .duet-theme-turva .duet-tab-button.duet-notification-mark-danger::after{top:calc(50% - 0.5rem - 6px);right:-6px}.duet-tab-button.duet-p-0{padding:0 !important}.duet-tab-button:hover{z-index:200;border-color:rgb(127, 150, 165)}.duet-theme-turva .duet-tab-button:hover{border-color:rgb(143, 147, 158)}.duet-tab-button:active{opacity:0.75;transition:none}.duet-tab-button.selected{z-index:201;color:rgb(0, 119, 179);background:rgb(255, 255, 255);border-bottom:3px solid rgb(0, 119, 179);outline:0;box-shadow:none !important}.duet-theme-turva .duet-tab-button.selected{color:rgb(198, 12, 48);border-color:rgb(222, 224, 228);border-bottom-color:rgb(198, 12, 48)}.duet-tab-button:focus{z-index:200;outline:0}:host(.user-is-tabbing) .duet-tab-button:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}:host(.user-is-tabbing) .duet-theme-turva .duet-tab-button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tab-variation-default .duet-tab-button{padding:15px 28px 17px 28px;overflow:hidden;color:rgb(81, 105, 123);background:rgb(245, 248, 250);border:1px solid rgb(212, 223, 229)}.duet-tab-variation-default .duet-tab-button.selected{color:rgb(8, 42, 77);background:rgb(255, 255, 255)}.duet-tab-variation-default .duet-tab-button.selected::after{position:absolute;right:-1px;bottom:0;z-index:300;display:block;width:calc(100% + 2px);height:2px;content:\"\";background-color:rgb(0, 119, 179)}.duet-tab-variation-default .duet-tab-button:not(.selected){box-shadow:0 3px 2px -1px rgba(0, 41, 77, 0.1) inset, 0 0 0 rgb(212, 223, 229)}.duet-tab-variation-default .duet-tab-button:hover:not(.selected){color:rgb(45, 64, 81);background:rgb(228, 236, 239)}.duet-tab-variation-default .duet-tab-button:first-child{border-radius:8px 0 0 8px}.duet-tab-variation-default .duet-tab-button:last-child{border-radius:0 8px 8px 0}.duet-theme-turva.duet-tab-variation-default .duet-tab-button{color:rgb(98, 104, 122)}.duet-theme-turva.duet-tab-variation-default .duet-tab-button.selected{color:rgb(51, 5, 20);background:rgb(255, 255, 255)}.duet-theme-turva.duet-tab-variation-default .duet-tab-button.selected::after{background-color:rgb(198, 12, 48)}.duet-theme-turva.duet-tab-variation-default .duet-tab-button:not(.selected){box-shadow:0 3px 2px -1px rgba(23, 28, 58, 0.1) inset, 0 0 0 rgb(222, 224, 228)}.duet-theme-turva.duet-tab-variation-default .duet-tab-button:hover:not(.selected){color:rgb(45, 52, 79);background:rgb(234, 235, 239)}.duet-tab-variation-plain .duet-tab-button{display:inline-block;width:auto;padding-right:0;padding-left:0;margin-left:0;border-width:0;border-radius:0;transition:none}.duet-tab-variation-plain .duet-tab-button.selected{border-bottom:2px solid rgb(0, 119, 179)}.duet-tab-variation-plain .duet-tab-button+.duet-tab-button{margin-left:36px}.duet-theme-turva.duet-tab-variation-plain .duet-tab-button.selected{border-bottom:2px solid rgb(198, 12, 48)}.duet-tab-variation-checked .duet-tab-button{position:relative;display:inline-block;flex-basis:0;flex-grow:1;width:200px;min-width:200px;padding:8px 4px;border-color:rgb(181, 198, 208);border-top:2px solid rgb(181, 198, 208);border-bottom-color:rgb(0, 119, 179);border-left:2px solid rgb(181, 198, 208);border-radius:4px 4px 0 0;transition:none}.duet-theme-turva.duet-tab-variation-checked .duet-tab-button{border-color:rgb(181, 198, 208);border-bottom-color:rgb(113, 118, 132)}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button{min-width:0;padding:16px}}.duet-tab-variation-checked .duet-tab-button.stackable-tab{min-width:0}.duet-tab-variation-checked .duet-tab-button:first-child{margin-left:auto}.duet-tab-variation-checked .duet-tab-button:last-child{margin-right:auto}.duet-tab-variation-checked .duet-tab-button:active{opacity:1;transition:none}.duet-tab-variation-checked .duet-tab-button.selected{color:rgb(0, 119, 179);background:linear-gradient(180deg, rgb(240, 247, 250) 0%, rgb(255, 255, 255) 100%);border-color:rgb(0, 119, 179);border-bottom-color:#fff}.duet-theme-turva.duet-tab-variation-checked .duet-tab-button.selected{color:rgb(23, 28, 58);background:linear-gradient(180deg, rgb(245, 247, 250) 0%, rgb(255, 255, 255) 100%);border-color:rgb(113, 118, 132);border-bottom-color:#fff}.duet-tab-variation-checked .duet-tab-button .checked-tab-content{display:flex;flex-direction:row;justify-content:space-between}.duet-tab-variation-checked .duet-tab-button .checked-tab-content.stackable-checked-tab-content{flex-direction:column;height:100%}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button .checked-tab-content.stackable-checked-tab-content{flex-direction:row}}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description{display:flex;flex-direction:column;overflow:hidden;overflow-wrap:break-word}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description.stackable-description{text-align:center}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description.stackable-description{text-align:left}}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption{margin-top:4px;font-size:0.875rem;font-weight:400;color:rgb(98, 121, 138)}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption{font-size:1rem;text-align:left}}.duet-theme-turva.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption{color:rgb(113, 118, 132)}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption.selected{color:rgb(0, 119, 179)}.duet-theme-turva.duet-tab-variation-checked .duet-tab-button .checked-tab-content .checked-tab-description .tab-caption.selected{color:rgb(113, 118, 132)}.duet-tab-variation-checked .duet-tab-button .checked-tab-content .stackable-checkmark{order:-1;margin-top:8px;margin-bottom:8px}@media (min-width: 36em){.duet-tab-variation-checked .duet-tab-button .checked-tab-content .stackable-checkmark{order:1}}.duet-tab-group-content{position:relative;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(8, 42, 77);text-align:left}.duet-tab-group-content:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}.duet-theme-turva .duet-tab-group-content:focus,.duet-tab-group-content:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tab-group-content.checked-group-content{padding:28px 0 28px 0}.duet-tab-group-content.checked-group-content::after{position:absolute;top:-2px;left:0;width:100%;height:2px;content:\" \";background-color:rgb(0, 119, 179)}.duet-theme-turva .duet-tab-group-content{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-theme-turva .duet-tab-group-content.checked-group-content::after{background-color:rgb(113, 118, 132)}";
 var DuetTabGroupStyle0 = duetTabGroupCss;
 
 /**
@@ -18476,35 +18484,18 @@ class DuetTabGroup {
             }
         };
         this.scrollToActive = () => {
-            if (this.variation === "checked" || this.variation === "plain-scrolling") {
-                setTimeout(() => {
-                    const active = this.tabsContainer.querySelector(".selected");
-                    if (active) {
-                        active.scrollIntoView({ behavior: "smooth", inline: "center", block: "nearest" });
-                    }
-                }, 50);
-            }
-        };
-        this.renderTab = () => {
-            const renderedTabs = this.tabs.map((element, index) => {
-                return (hAsync("button", { role: "tab", id: this.getButtonId(index), "aria-selected": element.selected ? "true" : "false", "aria-description": this.getAccessibleDescription(index), tabindex: element.selected ? "0" : "-1", part: `${this.identifier}-button ${element.selected ? `${this.identifier}-button--selected` : ""}`, type: "button", class: {
-                        "duet-p-0": this.padding === "none",
-                        "duet-tab-button": true,
-                        "stackable-tab": this.variation === "checked" && this.tabs.length <= 3,
-                        selected: element.selected,
-                        [`duet-notification-mark-${element.notificationMark}`]: !!element.notificationMark,
-                    }, onClick: () => this.onTabSelect(index), onKeyDown: ev => this.handleKeyDown(ev) }, this.variation === "checked" ? (hAsync("div", { class: { "checked-tab-content": true, "stackable-checked-tab-content": this.tabs.length <= 3 } }, hAsync("div", { class: { "checked-tab-description": true, "stackable-description": this.tabs.length <= 3 } }, hAsync("p", null, element.label), hAsync("p", { class: { "tab-caption": true, selected: element.selected } }, element.caption)), hAsync("div", { class: { "stackable-checkmark": this.tabs.length <= 3 } }, hAsync("duet-checkmark", { theme: this.theme, checked: element.selected, type: "radio", "presentation-only": true, center: true })))) : (element.label)));
-            });
-            if (this.scrolls) {
-                return (hAsync("duet-scrollable", { selected: this.selected, identifier: this.identifier }, renderedTabs));
-            }
-            return renderedTabs;
+            setTimeout(() => {
+                const active = this.tabsContainer.querySelector(".selected");
+                if (active) {
+                    active.scrollIntoView({ behavior: "smooth", inline: "center", block: "nearest" });
+                }
+            }, 50);
         };
         this.tabs = [];
         this.selected = undefined;
         this.theme = "";
-        this.scrolls = false;
-        this.collapses = true;
+        this.scrolls = true;
+        this.collapses = false;
         this.accessibleLabel = undefined;
         this.variation = "default";
         this.language = getLanguage();
@@ -18623,34 +18614,44 @@ class DuetTabGroup {
         }
         return;
     }
+    /**
+     * To support text-align: center;
+     */
+    isCentered() {
+        return window && window.getComputedStyle(this.element).textAlign == "center";
+    }
     /**
      * render() function
      * Always the last one in the class.
      */
     render() {
+        // TODO: get rid of plain-scrolling class, as we always scroll
         const variationClass = this.variation === "plain-scrolling" ? "duet-tab-variation-plain" : `duet-tab-variation-${this.variation}`;
         const isSwipeScrollable = this.variation === "checked" || this.variation === "plain-scrolling";
-        return (hAsync("div", { key: 'bc316787b3b80f823ed8faaba277e003e68bb5a2', class: {
+        const buttons = this.tabs.map((element, index) => (hAsync("button", { role: "tab", id: this.getButtonId(index), "aria-selected": element.selected ? "true" : "false", "aria-description": this.getAccessibleDescription(index), tabindex: element.selected ? "0" : "-1", part: `${this.identifier}-button ${element.selected ? `${this.identifier}-button--selected` : ""}`, type: "button", class: {
+                "duet-p-0": this.padding === "none",
+                "duet-tab-button": true,
+                "stackable-tab": this.variation === "checked" && this.tabs.length <= 3,
+                selected: element.selected,
+                [`duet-notification-mark-${element.notificationMark}`]: !!element.notificationMark,
+            }, onClick: () => this.onTabSelect(index), onKeyDown: ev => this.handleKeyDown(ev) }, this.variation === "checked" ? (hAsync("div", { class: { "checked-tab-content": true, "stackable-checked-tab-content": this.tabs.length <= 3 } }, hAsync("div", { class: { "checked-tab-description": true, "stackable-description": this.tabs.length <= 3 } }, hAsync("p", null, element.label), hAsync("p", { class: { "tab-caption": true, selected: element.selected } }, element.caption)), hAsync("div", { class: { "stackable-checkmark": this.tabs.length <= 3 } }, hAsync("duet-checkmark", { theme: this.theme, checked: element.selected, type: "radio", "presentation-only": true, center: true })))) : (element.label))));
+        return (hAsync("div", { key: 'd44a264bf004343e9f82164c4901341d85dd77dc', class: {
                 "duet-tab-group": true,
                 "duet-theme-turva": this.theme === "turva",
                 [variationClass]: true,
                 "duet-tab-plain-scrolling": this.variation === "plain-scrolling",
-                "duet-tab-group-scrolls": this.scrolls,
-                "duet-tab-group-collapses": this.collapses,
-            }, "aria-label": this.accessibleLabel }, !isSwipeScrollable && this.tabs.length > 3 && this.collapses && (hAsync("duet-select", { key: '64c5ec06e21fbde15b29281d5e89273c2d15dcdc', value: this.selected.toString(), expand: true, label: this.label, labelHidden: this.labelHidden, theme: this.theme, onDuetChange: event => this.onTabSelect(Number(event.detail.value)), items: this.tabs.map((tab, index) => {
-                return { label: tab.label, value: index.toString() };
-            }) })), hAsync("div", { key: '1c8d3bbb5202408ce2bdabf98aeef15a64413506', role: "tablist", class: {
+                "duet-tab-group-scrolls": true,
+            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: 'b96d7b205e288a166ab6a3be7eec9b4606270ad1', role: "tablist", class: {
                 "duet-m-0": this.margin === "none" || this.variation === "checked",
                 "duet-tab-group-tabs": true,
                 "duet-tab-group-hidden": this.tabs.length > 3 && !isSwipeScrollable,
-                "duet-tab-group-collapses": this.collapses,
             }, ref: el => {
                 this.tabsContainer = el;
-            } }, this.renderTab()), hAsync("div", { key: 'ecae4e65fe249bb084917967e40682b80eed1a9f', class: {
+            } }, this.variation === "checked" ? (buttons) : (hAsync("duet-scrollable", { selected: this.selected, identifier: this.identifier, gap: this.variation === "default" ? "none" : "large", buttonPosition: this.variation === "default" ? "absolute" : "relative", center: this.isCentered() ? this.isCentered() : this.element.style.textAlign == "center" }, buttons))), hAsync("div", { key: 'df29ecb045edeb7954209cbaf9ee5433e69a3881', class: {
                 "duet-tab-group-content": true,
                 "duet-m-0": this.margin === "none",
                 "checked-group-content": this.variation === "checked",
-            } }, hAsync("slot", { key: 'ab023437cb483fb6b9f0a60e7dd83970d98119f8' }))));
+            } }, hAsync("slot", { key: 'f917ae4a86513650ae87f9c7f1093bdaba852712' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTabGroupStyle0; }
@@ -18754,7 +18755,7 @@ class DuetTable {
         }
     }
     render() {
-        return (hAsync(Host, { key: 'd456405a2d68a4f177b88081425e960ba63045b9', class: {
+        return (hAsync(Host, { key: 'e378254253a226b9edcee4bd3a64283ad15673b2', class: {
                 [`duet-table-${this.variation}`]: true,
                 "duet-table-flattened": !this.matchesBreakpoint,
                 // sticky only valid when in regular table layout
@@ -18763,7 +18764,7 @@ class DuetTable {
                 "duet-m-0": this.margin === "none",
                 "duet-theme-turva": this.theme === "turva",
                 "duet-table-hide-head-visually": this.hideHeadVisually,
-            } }, hAsync("slot", { key: '4f00b379d883a78ed082245fb9b6b8096e52ab94' })));
+            } }, hAsync("slot", { key: 'b338423743800018d8f1b19ae20ca8c0a4bd5c36' })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -19145,11 +19146,11 @@ class DuetToolbar {
             : this.variation === "secondary"
                 ? "secondary"
                 : "default";
-        return (hAsync(Host, { key: '6d24828591c3158d2af27f07f9b997134340bb9e' }, hAsync("nav", { key: 'fbe3dfb501f41f8c6bf45e7da45eb923e40beac8', class: {
+        return (hAsync(Host, { key: '73a1a1a48a93a92a6f133b3e314538594905f0b3' }, hAsync("nav", { key: '1d5c122d89e33742f392eade29e07fba67a0c94d', class: {
                 "duet-toolbar": true,
                 "duet-theme-turva": this.theme === "turva",
                 [variation]: true,
-            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: '76ca97610a6ad32d06d5e7fe9f78e274a7044a96', class: "container" }, hAsync("div", { key: '99c04b28a2a1c18a0dc5061820c39edefe90a95e', class: "list", role: "list" }, hAsync("slot", { key: 'f4ca909e6d3cb08f39968f09060eb270342038b9', name: "left" })), hAsync("div", { key: '2eabe1f9ed72f8bf59e7f3dff1ad6c07c04c2fa3', class: "list", role: "list" }, hAsync("slot", { key: '7fed13ccb4a463c7fa55a72c90fd94f08057064d', name: "right" }))))));
+            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: '009d685a22843ea975f1390f30c0e0f0d2b86cdc', class: "container" }, hAsync("div", { key: '38d682f6662b41dec2fd29e6a6ef58beff217d5f', class: "list", role: "list" }, hAsync("slot", { key: '490ffd492b38a3a3f61a7b0d5022edc90ca60cbd', name: "left" })), hAsync("div", { key: 'cd6a3ec4a6f8fcd6a88575893a58e4cc98d62728', class: "list", role: "list" }, hAsync("slot", { key: '2a02055c44765e717c1cba43c7c41d82f6ef6ea2', name: "right" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarStyle0; }
@@ -19217,18 +19218,18 @@ class DuetToolbarDropdown {
             itemsAlign = this.element.parentElement.getAttribute("slot") === "left" ? "right" : "left";
         }
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (hAsync(Host, { key: '25b52f5f9d6dd23c6fc82c1ba514284087c88170', role: "listitem" }, hAsync("div", { key: '2547a078631c1588f7ad3c95adccfc525ffb63b1', class: {
+        return (hAsync(Host, { key: 'dae4918c82360d9da61fa1d20762123860af33d3', role: "listitem" }, hAsync("div", { key: '8f3edc8779f3fee050c5c725510a8536c8a255d0', class: {
                 "duet-toolbar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 [itemsAlign]: true,
                 [variation]: true,
-            } }, hAsync("button", { key: 'e1d93883c560598b35ac8be798475095c7f1a631', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, id: "button", type: "button", class: {
+            } }, hAsync("button", { key: 'cd6b86c7556c3763f0b892e9dea91147727a7277', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, id: "button", type: "button", class: {
                 active: this.active,
                 open: this.open,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'ab5f1a464057077698ffb25e919df7fdaaab4639', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: 'b3d7603015f2fae719a254ec60b8a2e43107edd8', class: "label" }, hAsync("slot", { key: 'f6676d4bd0c1f092627b1ce1bbcbfdd6499c8447', name: "label" }), hAsync("duet-icon", { key: 'b84679735414c634310004d5c9b4dbceaaedb6ed', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '5718a6a649198a601507dd916feee0f356f9786c', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'b4764264253075f8605b024099dc7c3a3dadb834', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: 'af3de973879ed184c4260dc2e73796a055b68793', class: "label" }, hAsync("slot", { key: '04d1eddf51a06bbf1577e26c247d7f4cf8a7f186', name: "label" }), hAsync("duet-icon", { key: '1a71a8f3df871d0b776f0c8774388ff9361c60fe', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '0efef11353d0f91d685e5515e4c1f29ec5ad6173', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'c0d3e846d10e190162c97c680c4b0ecec3eceb33' })))));
+            } }, hAsync("slot", { key: 'ce8f9025a95a337ba2035d68060a644bc621bb8a' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarDropdownStyle0; }
@@ -19281,11 +19282,11 @@ class DuetToolbarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'e3efb6b70c66d5e89b942e11630bd1f3ca09da23' }, hAsync("a", { key: '82b9283918f64f724ff10590e14e6267b4d228a5', class: {
+        return (hAsync(Host, { key: '42a33532d4dd0b3e6e4bf2869dd22a781748ef15' }, hAsync("a", { key: 'a6012ec3add1d4cd1e4e02b13928f743cfddd43a', class: {
                 "duet-toolbar-dropdown-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.href, lang: this.targetLanguage, hreflang: this.targetLanguage, role: "link menuitem", "aria-label": this.accessibleLabel, "aria-current": this.active ? "true" : "false", onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '566a78b23fde16d94550884b68c34cc0174de0dc', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: '2c87685e3a77848c8571c42f5dc4f8e57f566dfd', class: "label" }, hAsync("slot", { key: '69dca8568d3358138faa101900b558daf8709b4f' })), this.active && (hAsync("duet-icon", { key: 'a646b68f9de5deba152c5c57d1f35ac9d8d65db0', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
+            }, href: this.href, lang: this.targetLanguage, hreflang: this.targetLanguage, role: "link menuitem", "aria-label": this.accessibleLabel, "aria-current": this.active ? "true" : "false", onKeyUp: e => this.handleEscape(e) }, this.icon && hAsync("duet-icon", { key: '37a8b94728da8a7e0567053295df19e0b0b76896', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: '030a9c1d1143302973f2588aa426a949df0ed3c8', class: "label" }, hAsync("slot", { key: '23aaf52fc62cf20248e88138fcc4fd780dbba8d0' })), this.active && (hAsync("duet-icon", { key: '23ed4c8db968d6f3ed6a25a0591bb157e93f5135', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarDropdownLinkStyle0; }
@@ -19360,17 +19361,17 @@ class DuetToolbarItem {
             : this.variation === "secondary"
                 ? "secondary"
                 : "default";
-        return (hAsync(Host, { key: '2ef7297d5c2f9b09536b757fe0b747caa6b2840c', role: "listitem" }, hAsync(TagName, { key: '8b1a44bc3d37cad54e429b1523fbe404c97f5f03', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
+        return (hAsync(Host, { key: 'e0782009ac1abad8319168aa9e8b682bc15ead67', role: "listitem" }, hAsync(TagName, { key: '51cc267333667a6890a860864253ca7f9b0b6ef7', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
                 "duet-toolbar-item": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [variation]: true,
-            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("div", { key: '44269de51ebbfc87725a86ba4a84d75ecfba3b4e', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '5111f0d067e0964fdef11617baf9958ec40d6576', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" }), this.badge && hAsync("div", { key: 'a92775b051d1c5c9eecc67b05c77a28cd64de8d5', class: "duet-toolbar-badge" }))), hAsync("slot", { key: 'a7ddc45472cc0f2ddae38a069f87a9d675e8f1ff' }), (this.trailingIcon || (this.url && this.external)) && (hAsync("div", { key: '162e333175a2afce39599db1495b4a2db75405b8', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: 'edbc553ef82f801d17f4e62c798031da2500157d', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("div", { key: 'f1d7d394586be43d8e9713a4d2ab713c32a8cc2b', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '1c7f6a96fb5f8ecdd8cbb724e153509f29601e25', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" }), this.badge && hAsync("div", { key: '4bc879287df60720eae32b88bf0f1dd855d11ecc', class: "duet-toolbar-badge" }))), hAsync("slot", { key: 'aaaa897c0f2d1e094c797100b622e921e4762434' }), (this.trailingIcon || (this.url && this.external)) && (hAsync("div", { key: '8d4bcd35f65ec3899d3c568f978426521b9a30a8', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: 'a20bef22ae5d20b2717cf5df267495eb32bd08eb', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!(this.url && this.external),
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
-            }, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? actionNewWindowSmall.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && hAsync("div", { key: '9a1318e69e40d5d55677154d482ba08b9fc2e72e', class: "duet-toolbar-badge" }))))));
+            }, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? actionNewWindowSmall.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && hAsync("div", { key: 'd2f473835ff5183bd96a8e1c775b5fe866cad355', class: "duet-toolbar-badge" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarItemStyle0; }
@@ -19424,12 +19425,12 @@ class DuetToolbarLink {
      */
     render() {
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (hAsync(Host, { key: 'f8e4c9503e468b1d2912a6c633f8eebc7118176b', role: "listitem" }, hAsync("a", { key: '9319a32f6d0731c1f473dbffd23b9f21c2d5103f', class: {
+        return (hAsync(Host, { key: 'c0474aff0b8baba6eb146018d612c23236d18cf8', role: "listitem" }, hAsync("a", { key: '59afb14e71531de7cd605e7afaa754ad5dd9d4bd', class: {
                 "duet-toolbar-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [variation]: true,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: 'bca12006695c45a33577fe1821081f3c07a0bb53', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '3bfc36ea53b227990d0ab7a26ae2ea0b9caa13c7' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '6403402c9fa39bcd5c64c008393114ae37acb748', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: 'a507f84b3eabc3954eab980e01407b5de2e6a09f' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarLinkStyle0; }
@@ -19686,12 +19687,12 @@ class DuetTooltipButton {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'a93b648a97705995e9c16ed407d6a85edd146a1e' }, hAsync("button", { key: '3908a9b2c7e7424835a9b52345bf37f9cf72b9fb', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
+        return (hAsync(Host, { key: '9e42fe5ece18df279fc2f1238b81ed751fcba6e3' }, hAsync("button", { key: '46f7d00f60e8a681f745e888c9dd4eebaae7cdf1', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
                 "duet-tooltip-button": true,
                 "duet-tooltip-button-has-label": !!this.label,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-button-negative": this.negative,
-            } }, hAsync("svg", { key: '864c8fa62979a5f154fba4bdb917e294981bf69d', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '541766a3747147b8584825d78fb255907e8a118d', d: "m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z" }), hAsync("circle", { key: 'f7a83bdf5e8532f9696c2877ab76aa6b13fd6fd2', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: '52f85b09a3d9f99fdb775549b7936bab53e00686', d: "m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z" })), this.label ? (hAsync("span", { class: "duet-tooltip-label" }, this.label)) : (hAsync("duet-visually-hidden", null, this.accessibleLabel)))));
+            } }, hAsync("svg", { key: 'fc76763237d9e982e4674d8bb638372e67949119', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '0fb1cf0c4d93b0cabd1330a217a84ef6af2c0851', d: "m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z" }), hAsync("circle", { key: '521e808bdf960d1aafd66f16c46aa0d59708f5eb', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: '8292f492ecb67f52b30c7794ca3e7593621e90e4', d: "m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z" })), this.label ? (hAsync("span", { class: "duet-tooltip-label" }, this.label)) : (hAsync("duet-visually-hidden", null, this.accessibleLabel)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTooltipButtonStyle0; }
@@ -19759,11 +19760,11 @@ class DuetTooltipPopup {
         this.contentEl.focus();
     }
     render() {
-        return (hAsync(Host, { key: 'a79306700e7d7aee441cc03ad36320a104b7089d' }, hAsync("div", { key: '97992b1ebaf1998d33984716a013e69d5ba1d2d6', class: {
+        return (hAsync(Host, { key: 'b9e5af9b7d4981703d14528d730b3f98f1a43077' }, hAsync("div", { key: 'f87b14cc5a9c1e1f2814419de54dcf780ed9d4ca', class: {
                 "duet-tooltip": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-active": this.active === true,
-            } }, hAsync(FocusGuard, { key: '45e71382f2b78cf134a3bc5c66523b17b9645df7', moveFocusTo: this.buttonEl }), hAsync("div", { key: '4972fbadbaa78dcc0a89a26f084703d2f5af7722', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, hAsync("slot", { key: 'cd6485f243b063d2c155c995e5c025d94b63a339' })), hAsync("div", { key: '9a7ee974d7bb598cb64fff09e36c15560fe5eaf6', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: 'ed588d4767c18b62132ee7869ddd0daa1c128b5c', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: 'c8bc5eda535b9f4990a1a4ea1d643802f81b0d28', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: '6ac9b3e52c00914617f310f38ce5ec6ba2a43a82', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: '280130951a6dc65a419d913c246fbbda69605e38' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: 'f23c9116b56c9451e2c82eef602c057f3b38835c', moveFocusTo: this.contentEl }))));
+            } }, hAsync(FocusGuard, { key: '8821eb6b5943579e592de43d82ab88408d017a66', moveFocusTo: this.buttonEl }), hAsync("div", { key: '63237a369131153304c032842cf18b78e6131cf8', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, hAsync("slot", { key: '5d0b8cad1c781f6714472deb831930f0655ffb7d' })), hAsync("div", { key: 'bdca178c2801a3b4f4920e60c12271b3c1839413', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: '60ff34f09aa3de7daa8886f657813e852b98c165', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: '1b644babda9746b7af48a62c562276b37f4ce39d', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: 'eb2963986920179ea780b74cab029766f2a5fc19', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: 'c06b20ac17e644dd17aaba2176acb500ed430205' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: '80cc95b8f7a39e8792736397fff46a6988e6d9c8', moveFocusTo: this.contentEl }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTooltipPopupStyle0; }
@@ -19871,14 +19872,14 @@ class DuetTray {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: 'e80fe0fea16e56fab163357063b7e4872396a5ec', class: {
+        return (hAsync("div", { key: '727088b9a85be66d826cd9381de5f8d123861cd5', class: {
                 "duet-tray": true,
                 "duet-tray-is-active": this.active,
                 "duet-tray-is-hidden": this.hiddenState,
                 "duet-tray-is-responsive": this.responsive,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tray-is-expandable": this.hasAdditionalContent,
-            } }, hAsync("div", { key: '262559150a618ae013cc1585a11f5c4dfa5b81ad', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: '2ad15f10fb23db0693d3a39d6c30f5b8f0eff769' })), this.hasAdditionalContent && (hAsync(Fragment, { key: '61ac87d6890bf410e73f5fddbf7e2f348ae2fb12' }, hAsync("button", { key: '7ae889dcf9db8311adffc4f88e75d9280c23752c', "aria-expanded": this.expanded ? "true" : "false", "aria-controls": this.expandableId, onClick: ev => this.toggleExpandable(ev), class: { "duet-tray-button": true, "duet-tray-is-expanded": this.expanded } }, hAsync("duet-icon", { key: 'a514192731466d4e27aca7dc6b350aa3f8782616', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: 'b93df79ffc46a2e60b7568b393c5643997e9d0ae' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: 'd611d0e82cd9fa7fdcbbe203986f2a82bd44e02f', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: '30fe3c388378678752f99d6cb9548d7ec7c42c4d', class: "duet-tray-expandable-content" }, hAsync("slot", { key: 'e25622cbef097b9ac74de3a8264a7556f4be7722', name: "additional" })))))));
+            } }, hAsync("div", { key: 'd47f6cd20617c0c772a16f52f7fd1d0b6539afb6', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: 'c51d083b38c433b1013f39e0a3090796ae5b0388' })), this.hasAdditionalContent && (hAsync(Fragment, { key: '1268398435755fff9fa43abc2c5ffd748aa2ab41' }, hAsync("button", { key: '02822a01f20f55a95978e7a396624a18b86a663b', "aria-expanded": this.expanded ? "true" : "false", "aria-controls": this.expandableId, onClick: ev => this.toggleExpandable(ev), class: { "duet-tray-button": true, "duet-tray-is-expanded": this.expanded } }, hAsync("duet-icon", { key: 'de0f600be8f32c6603d65d8a40fe5ffe25bf65f0', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: '6d9aaf8a8630048c66ef52d6fd45f9122067f4e2' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: 'd3c9fd10adf089cc50f9187529a38c605b341b2d', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: '59bcb373997df5fccc7431f42a3b097f00fa3ba9', class: "duet-tray-expandable-content" }, hAsync("slot", { key: '111104943aa5e4dc6a6a025bd20f07e06b6f7972', name: "additional" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTrayStyle0; }
@@ -20994,10 +20995,10 @@ class DuetUpload {
             this.externalUploadButton.accessibleLabel = `${this.externalUploadButton.innerText}. ${caption}`;
         }
         // @ts-ignore
-        return (hAsync(Host, { key: '44b4a9f8f0e99182d1db74ed7e2fb3237d90ed71', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: '2231a57d1b606059e90c7406f24258d4b844cbe0', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: 'bb0e091ee3d4c96715018d1fc836d6cd5f938c75', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: 'd988bc2f8b6a4efc418a65b3ee575095b97ae06a', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: 'b274a3b81132a5119c47bd365bbdd77f08280c17', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: '5a2377d31360af5cbdae90130677853613899ec5', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: '6fe002a8a312e6e067321c07e0b50ed786fd8dc3', invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && hAsync("slot", { key: '730c164e68660c49ce18f8fec5d8f184a640bcd9', name: "filefooter" }), hAsync("slot", { key: '303c2be9f728196dc157cd29a39a926ca9951a88', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: 'd0e088aa37d8b789b3dc4efa9e070c74746877d0', margin: "none", size: "small" }, hAsync("div", { key: 'e3ab58aaacb792a297bcc56154073c9289dd1c32', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: '5a6d988ce4deff649f20207813758e023eb3d817', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: '86a890e223fb900e2420ea45564f8c4c484ddc8a' }, hAsync("duet-spacer", { key: 'fdf03610301bb1368fb28db909a35e10320df054', size: "large" }), hAsync("duet-button", { key: 'be03dc2d96b961dc22d63bf0bf4e1128e4c813d4', id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel || `${this.buttonLabel}. ${caption}`, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel))), (this.fileMaxReached ||
+        return (hAsync(Host, { key: '34dabb707733d49a37d7665b2ce21dac3cb69b99', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: '53da3e1d39ae3d0a72ea1e836ed84a7ed5505745', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: '50da1a23f5016f0666627e8455e072cfa5b96ca7', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: '6895fe8edf7ed8eec62bb4f141222ec699cbb00f', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: '01b14bc9aef86e1044a9d4ebf56017068b10df4b', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: '2c3b18a000bfeb370a6fc83a23fa5b534cd09b43', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: '3b143bdded7b1feddd54867d6d4b2ed4e2d915cf', invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && hAsync("slot", { key: '85599b8ce8e5b05c80c5c3e5276356c7324bdef3', name: "filefooter" }), hAsync("slot", { key: '425f33860900e6110a625c5c4c7da8bcc1313053', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: '881d401f134a7e3c412cd1f01bed6117f96bbc19', margin: "none", size: "small" }, hAsync("div", { key: '5e498fd2880ec86684cf3da9690b139ad05fd97f', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: 'a05a45a3f7efc7d767db95eeb75a5da261b08edb', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: '0d0ff9d5fad94af744e9632125af447fd7144fd0' }, hAsync("duet-spacer", { key: 'fed503af8f9301defa2f2d8f29385e28fa1a8716', size: "large" }), hAsync("duet-button", { key: '7a4f79bf0df839531c714f39202900a25d339612', id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel || `${this.buttonLabel}. ${caption}`, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel))), (this.fileMaxReached ||
             this.bytesMaxReached ||
             this.filesToUploadExceedsLimit ||
-            this.filesToUploadTotalSizeIsAboveMax) && (hAsync(Fragment, { key: '86937ba57803f4ca6379dcab097cf0d08d0962d7' }, hAsync("duet-spacer", { key: '64e72354abfe4dad9e6c1d430e89900b38c50dec', size: "medium" }), hAsync("duet-alert", { key: '02be9578a9bf4afdcda8ff3a9d280525a39e430c', part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes), this.filesToUploadExceedsLimit && getI18nError("duet-upload-302", this.errorCodes), this.filesToUploadTotalSizeIsAboveMax && getI18nError("duet-upload-203", this.errorCodes)))), hAsync("duet-visually-hidden", { key: '619dec515fc6147867da776c79f883d54a2ba9d3', "aria-hidden": "true" }, hAsync("input", { key: '8e13ce6903fa6218b0e56035416dcddd154317a2', ref: input => {
+            this.filesToUploadTotalSizeIsAboveMax) && (hAsync(Fragment, { key: 'e649c65801873ad2a2bfa16b63b6f83249f0212b' }, hAsync("duet-spacer", { key: 'da7ebf591d35cf11d0ecbb52246bf3e84feb711d', size: "medium" }), hAsync("duet-alert", { key: 'e8fdb5af79535f54f65dcf0bebb0ffe5865dc699', part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes), this.filesToUploadExceedsLimit && getI18nError("duet-upload-302", this.errorCodes), this.filesToUploadTotalSizeIsAboveMax && getI18nError("duet-upload-203", this.errorCodes)))), hAsync("duet-visually-hidden", { key: '145eb761bd1a288de31527f8cfd1006deb6c2f4d', "aria-hidden": "true" }, hAsync("input", { key: '38490151c6483827901990610b2a17ced63c27f6', ref: input => {
                 this.nativeInput = input;
             }, accept: !this.limitSelection ? undefined : `${this.allowedMimetypes},${this.allowedExtensions}`, onBlur: this.onBlur, onFocus: this.onFocus, onChange: e => this.onChange(e), type: "file", class: {
                 "duet-upload": true,
@@ -21318,7 +21319,7 @@ class DuetUploadAriaStatus {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '611ad37755190220c43a39fdcbfda6d808a0e285', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: '4a2d84541cdf2e03c057210066ef4f53a3ef6b00' }, this.statusMessage)));
+        return (hAsync(Host, { key: 'b39f90588bbf94f860b3a3353f8cc7748d74df25', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: 'b61dbf75e645b8f17ae6a72bc9304d068d3218f2' }, this.statusMessage)));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -21497,9 +21498,9 @@ class DuetUploadItem {
         const { uid, meta, item } = this.data;
         const Badges = meta && meta.badges ? (hAsync("span", null, meta.badges.map(badgeText => (hAsync("duet-badge", { color: "primary" }, badgeText))))) : undefined;
         const actionDescription = `${meta && meta.badges ? meta.badges.join(",") : ""} ${item.name}`;
-        return (hAsync("div", { key: '3bd049f474c0e5ae36c863e12c83f420338f2120', class: {
+        return (hAsync("div", { key: '179fe6956ec8b8b935e73a289c0191de154768b4', class: {
                 "upload-item-row": true,
-            } }, this.showCategory && (hAsync("div", { key: 'cabbda342b80dc26a8742b8c68f6f3ae836a78e5', class: "item-categories" }, hAsync("duet-heading", { key: '9d9f798db399bf1c277b1a1b2699c15a8f8aff7d', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: 'e01fab2744f4cafdadb2defd3fd3da9262cdad68', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: 'e9f12029fc48fa148169a7e962fa42c4a4acd05c', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: '61536d97451f6b2be7a7cf2c616860d9f31fb174', class: "item-actions" }, this.actions.map(actionItem => {
+            } }, this.showCategory && (hAsync("div", { key: 'b98fbb8879abe956b787710bd8988a535aece789', class: "item-categories" }, hAsync("duet-heading", { key: '39b4c46eda25dc1f5017f7b3ae4770437b91edc1', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: '05f123dc1a55f5938d0a008337f16b262412f431', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: '0825080f168d051916cd4f278dd0f7be3e713a17', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: '991a499e99a6df39b0f7895bdd3019acaa751c3a', class: "item-actions" }, this.actions.map(actionItem => {
             return (hAsync("duet-action-button", { actionMeta: Object.assign({}, meta || {}), actionId: uid || null, actionName: actionItem.name, theme: this.theme, iconName: actionItem.icon, iconColor: actionItem.color, iconSize: actionItem.size, background: actionItem.background, "accessible-label": `${actionDescription} ${getLocaleString(actionItem.label)} `, accessibleTitle: this.getActionButtonTitle(actionItem), ref: button => (this.actionButton = button) }));
         }))));
     }
@@ -21540,7 +21541,7 @@ class DuetVisuallyHidden {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'c7a016ccb63b67077c691951394fd67771f4609e', class: "duet-visually-hidden" }, hAsync("slot", { key: 'c5daeaed36d95139adc5a1f68fe01123d5f301ae' })));
+        return (hAsync(Host, { key: 'a26d430acd67a8e002cbb5d4e10fc83664ea2fc9', class: "duet-visually-hidden" }, hAsync("slot", { key: '2a9832f540a371230bc15e334e7351ef06539a6c' })));
     }
     get element() { return getElement(this); }
     static get style() { return DuetVisuallyHiddenStyle0; }