@duetds/components 9.1.1 → 9.2.0

package/hydrate/index.js

@@ -3743,12 +3743,12 @@ class DuetBadge {
      */
     render() {
         const backgroundClass = `background-${this.background}`;
-        return (hAsync(Host, { key: 'f1d2c0d7ae41c9b8776ef282d7071ef27a84717f', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '3e4d65377d2627cd3e71d68f772de3ccd024ed0f', class: {
+        return (hAsync(Host, { key: '9961997225b2be95620a2bb6cd925a38ca781319', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '7f60092c2cbd3243ae62c54ffd64714b967feb4c', class: {
                 "duet-badge": true,
                 [this.variation]: true,
                 [backgroundClass]: true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("slot", { key: 'cd8684571510bef387f5da513d38e8203dccd104' }))));
+            } }, hAsync("slot", { key: 'bfe777ba2975bdc4fe654dbbe7fcadd9c74a4de9' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBadgeStyle0; }
@@ -3938,14 +3938,14 @@ class DuetBreadcrumb {
      */
     render() {
         var _a;
-        return (hAsync(Host, { key: '18c37fc7d84fbfe09c1eb285e16388ec70e9a307', role: "listitem" }, hAsync("div", { key: 'efc47db8c7eb8f922c361ac9399196a7af3be21d', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: '108f30568f7f84babd579658721f1c0448288ebc', class: "duet-breadrumbs-arrow", size: "auto", icon: actionArrowRightSmall.svg, margin: "none", color: "currentColor" })), hAsync("a", { key: 'b03774c0f0d44955355121d6e235882edda6838c', class: {
+        return (hAsync(Host, { key: '896f47e7da60d222d4069e1dbc464df5d2860a5e', role: "listitem" }, hAsync("div", { key: '542c2f9e39019092a4b8710dce3d91204d8e7ea6', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: 'f02c8e0e89966baaaa60ce01e0d60327f43df4a7', class: "duet-breadrumbs-arrow", size: "auto", icon: actionArrowRightSmall.svg, margin: "none", color: "currentColor" })), hAsync("a", { key: 'def35f8a0cd68ed2bcb029b516fdcd3988bc612c', 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: '085844d9dce555398be1e6889151600d54eb65f7', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
-            this.hasSlottedContent && hAsync("duet-spacer", { key: '0746ad63079cbce6f54f7be5b2679a786d711ee0', size: "x-small", direction: "horizontal" }),
-        ], hAsync("slot", { key: 'd0f45ff3fa075427e14b90ef6eb06ebc1c03ddc7' })))));
+            hAsync("duet-icon", { key: '9315b8b7b1c4515db35b986214df2a5fe712e90d', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
+            this.hasSlottedContent && hAsync("duet-spacer", { key: 'a1e4e13b0624db398595819130a944e37e67f729', size: "x-small", direction: "horizontal" }),
+        ], hAsync("slot", { key: '7017579590087fda79cb5ec5621d06c0a83b1134' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBreadcrumbStyle0; }
@@ -4006,11 +4006,11 @@ class DuetBreadcrumbs {
      */
     render() {
         const color = getColorByName(this.color);
-        return (hAsync(Host, { key: '4d20f1547e8f5acfe24d4fdd0796467ff5d04a14' }, hAsync("nav", { key: '65d6e31df9eb90f7e27b6855ba4e650541aa9eb0', "aria-label": this.breadcrumbsAriaLabel, class: {
+        return (hAsync(Host, { key: '8efa7a115e6f54542e88d47bcd82dd45f22dfa5a' }, hAsync("nav", { key: 'e33a8eeb307ff1ce61375ac5d7b7d06516ef9748', "aria-label": this.breadcrumbsAriaLabel, class: {
                 "duet-breadcrumbs": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.variation]: true,
-            } }, hAsync("div", { key: 'e4956646791760eb37fc77028654e75792a256e2', class: "container" }, hAsync("div", { key: '9dc16ff656071b0a10317a1b03c92d7b7dd92605', role: "list", class: "list", style: { color } }, hAsync("slot", { key: 'ac9ef52d9eeb061225106b00ee60d7ca2b50dbd2' })), hAsync("div", { key: '747853c441c9c296c4e03aafbe6483dfa31fb7c4', class: "bottom-border bottom-border--container" })), hAsync("div", { key: 'fc9a3ab33eb29633aff8623257c81c49185b9e90', class: "bottom-border bottom-border--nav" }))));
+            } }, hAsync("div", { key: 'b316b4613355477852547aeca63cf3ebc2aebd18', class: "container" }, hAsync("div", { key: '80bbfecc44dc1ffcd17c34b63fb1023c387267a7', role: "list", class: "list", style: { color } }, hAsync("slot", { key: '774275bab13a098e5d095e108a2081ce7a0e7350' })), hAsync("div", { key: '7db4bba62ed327f314745e0960c6e550ac865582', class: "bottom-border bottom-border--container" })), hAsync("div", { key: 'b8c2c068f97243f47efbdb0eb808a784932bc795', class: "bottom-border bottom-border--nav" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetBreadcrumbsStyle0; }
@@ -4353,11 +4353,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: '534b9127054974a33efcc47a7d689a1e957195a7' }, hAsync("div", { key: 'a3eb6e2b17742b28bbf72d99bb824616fdf197ee', class: {
+        return (hAsync(Host, { key: '7d5a168da918f73ac6199624717b0722ae637b5f' }, hAsync("div", { key: '6901480796257cefd5276a5ca6eb2194030970bf', class: {
                 "duet-callout": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
-            } }, hAsync("figure", { key: 'ddb010bf709a04037d03a9e0864f6a91b061490a', class: "container" }, hAsync("duet-icon", { key: 'b520dbf68afa65865b562c053a06ae7907056260', 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: '6c2f2ec722f53f2bebce2d455147b4decad9d243' }, hAsync("slot", { key: '59ce6c30c39155fec448114fd25752585d95c87d' })), this.hasAuthorSlot && (hAsync("figcaption", { key: 'b6599f6f3bff3b855dae865e6b03fc977d161137', class: "author" }, hAsync("span", { key: '57a9fcc581eb85f634819905d57cb52e865ea4a3' }, "\u2014 "), hAsync("slot", { key: '3338c10206046d6a0410c95e69d353e1ce52dd79', name: "author" })))))));
+            } }, hAsync("figure", { key: 'ceddfb8142f1dca7af00139f28b776cd1e0b3ba3', class: "container" }, hAsync("duet-icon", { key: '85e94a538b36121aaac3d755ee7bddad98312c24', 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: '46bc56966d4eface501dfc1a57715f6d2600e27f' }, hAsync("slot", { key: '1974940d51ac7946d1f139fb3c444b0915c6ea75' })), this.hasAuthorSlot && (hAsync("figcaption", { key: '7173e7c7927111e0d9f1b13def6a08c487ebfff0', class: "author" }, hAsync("span", { key: 'dedb46a4fff0eedd8f95275e608378c8fc021cea' }, "\u2014 "), hAsync("slot", { key: 'fb955af2c57c5d113dc34d9d292ad5bf835ddb99', name: "author" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetCalloutStyle0; }
@@ -4718,11 +4718,11 @@ class DuetCheckmark {
         inheritGlobalTheme(this);
     }
     render() {
-        return (hAsync(Host, { key: '692074bb8ff3765800f6d41465a3597312f4da79', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: '345bc0d43dfd9e43ef63fc8154a3f5cf663a284a', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: '9a3d25fabd343baa33ed2bc6477117dabe38445d', class: {
+        return (hAsync(Host, { key: '694951f0c8763ee7206e40f195d801b161cb970d', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: '81371523be24dcc91313d7933103e74bbab2bda3', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: '30578b86f60822622e625e5baf2356f550c33a6d', class: {
                 "duet-checkmark-container": true,
                 center: this.center,
                 "duet-checkmark-radio": this.type === "radio",
-            } }, this.checked && hAsync("div", { key: '0b214dedac8059c30b3cd59abd0623dda52d53bc', class: "duet-checkmark" })))));
+            } }, this.checked && hAsync("div", { key: 'd5b3c5f15bffdea7d89a80621c1aa4e96ae7ee0f', class: "duet-checkmark" })))));
     }
     static get style() { return DuetCheckmarkStyle0; }
     static get cmpMeta() { return {
@@ -6396,7 +6396,7 @@ class DuetCollapsible {
     }; }
 }
 
-const duetComboboxCss = ".sc-duet-combobox-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:inline-block;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\";color:rgb(0, 41, 77)}.sc-duet-combobox-h a.sc-duet-combobox{color:rgb(0, 41, 77);transition:none}.duet-theme-turva.sc-duet-combobox-h{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.sc-duet-combobox-h a.sc-duet-combobox{color:rgb(23, 28, 58)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.sc-duet-combobox .option-tags.sc-duet-combobox{color:rgb(116, 116, 117)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.selected.sc-duet-combobox{background:rgb(244, 207, 214)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover{color:rgb(255, 255, 255);background:rgb(198, 12, 48)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox .option-tags.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus .option-tags.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover .option-tags.sc-duet-combobox{color:rgb(255, 255, 255)}.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox a.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus a.sc-duet-combobox,.duet-theme-turva.sc-duet-combobox-h .duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover a.sc-duet-combobox{color:rgb(255, 255, 255)}.duet-combobox-list.sc-duet-combobox{position:absolute;top:calc(100% - 12px);z-index:700;margin:8px 0 0;visibility:hidden;background:rgb(255, 255, 255);border-radius:0 4px;box-shadow:0 2px 10px 0 rgba(0, 41, 77, 0.1);opacity:0;transition:transform 300ms ease, opacity 300ms ease, visibility 300ms ease;transform:scale(0.96) translateZ(0) translateY(-20px);transform-origin:top right}.duet-combobox-list.open.sc-duet-combobox{visibility:visible;opacity:1;transition-property:transform, opacity;transform:scale(1.0001) translateZ(0) translateY(0)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox{max-height:200px;padding:0.75rem 0;margin:0;overflow-y:scroll;font-weight:600;list-style:none;cursor:pointer;scroll-behavior:smooth}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox{padding:4px 0}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:not(.selected){padding-left:16px}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:not(.selected) .highlight.sc-duet-combobox{text-decoration:underline}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.option.sc-duet-combobox .option-tags.sc-duet-combobox{float:right;padding-right:0.875rem;font-weight:400;color:rgb(144, 149, 153)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.selected.sc-duet-combobox{padding-left:0;background:rgb(205, 229, 241)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.selected.option.sc-duet-combobox .option-icon.sc-duet-combobox{padding:0 8px 0 8px}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.selected.option.sc-duet-combobox .option-tags.sc-duet-combobox{color:rgb(144, 149, 153)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover{color:rgb(255, 255, 255);background:rgb(0, 119, 179)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox .option-tags.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus .option-tags.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover .option-tags.sc-duet-combobox{color:rgb(255, 255, 255)}.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.active.sc-duet-combobox a.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:focus a.sc-duet-combobox,.duet-combobox-list.sc-duet-combobox .duet-combobox-listbox.sc-duet-combobox .list-item.sc-duet-combobox:hover a.sc-duet-combobox{color:rgb(255, 255, 255)}";
+const duetComboboxCss = ".sc-duet-combobox-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:inline-block;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\";color:rgb(0, 41, 77)}.sc-duet-combobox-h a.sc-duet-combobox{color:rgb(0, 41, 77);transition:none}.duet-theme-turva.sc-duet-combobox-h{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.sc-duet-combobox-h a.sc-duet-combobox{color:rgb(23, 28, 58)}.combobox-menu-container.sc-duet-combobox{width:var(--popup-width);max-height:200px}";
 var DuetComboboxStyle0 = duetComboboxCss;
 
 class DuetCombobox {
@@ -6405,14 +6405,16 @@ class DuetCombobox {
         this.duetChange = createEvent$2(this, "duetChange", 3);
         var _a, _b;
         this.listBoxId = createID("duet-combobox-list-element");
+        this.inputId = createID("duet-combobox-input-id");
+        this.activeDescendantId = createID("duet-combobox-active-descendant");
         this.isAndroidDevice = ((_b = (_a = navigator === null || navigator === void 0 ? void 0 : navigator.userAgent) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === null || _b === void 0 ? void 0 : _b.indexOf("android")) > -1 || null;
         this.resizeObserver = new ResizeObserver(debounce(entries => {
-            var _a, _b;
+            var _a, _b, _c;
             // otherwise, something is wrong, expecting 1 element only
             if ((entries === null || entries === void 0 ? void 0 : entries.length) === 1) {
                 const currentWidth = (_b = (_a = entries[0]) === null || _a === void 0 ? void 0 : _a.target) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().width;
-                this.listContainer.style.width = `${currentWidth + 1}px`;
-                // this.listElement.style.width = `${currentWidth + 1}px`
+                const popupMenuPadding = parseInt((_c = getComputedStyle(this.listContainer.shadowRoot.querySelector(".duet-popup-menu-list"))) === null || _c === void 0 ? void 0 : _c.padding);
+                this.listContainer.style.setProperty("--popup-width", `${currentWidth - 2 * popupMenuPadding}px`);
             }
         }, 100));
         this.onInputChange = async (e) => {
@@ -6437,6 +6439,9 @@ class DuetCombobox {
             if (!this.force && !this.multiple && this.selectedItems.size > 0 && newValue !== this.getSelectedItemLabel()) {
                 this.selectedItems.clear();
             }
+            if (!this.force && !this.multiple && newValue === "") {
+                this.value = undefined;
+            }
             this.listOpen = String(newValue).length >= this.minCharacters && ((_a = this.getFilteredItems()) === null || _a === void 0 ? void 0 : _a.length) > 0;
         };
         this.onKeyDown = (e) => {
@@ -6467,6 +6472,9 @@ class DuetCombobox {
                 return;
             }
             if (isEscapeKey(e) || isTabKey(e)) {
+                if (this.listOpen) {
+                    e.preventDefault();
+                }
                 this.updateInputText(true);
                 this.activeItem = undefined;
                 this.listOpen = false;
@@ -6499,7 +6507,7 @@ class DuetCombobox {
                 }
                 // this should be set to undefined on everything BUT up/down arrow according to the aria 1.1 specs
                 // https://www.w3.org/TR/wai-aria-practices-1.1/#combobox
-                this.input.accessibleActiveDescendant = "active_item";
+                this.input.accessibleActiveDescendant = this.activeDescendantId;
                 this.activeItem = nextActiveItem;
                 this.scrollToActive();
             }
@@ -6540,8 +6548,16 @@ class DuetCombobox {
         this.openListOnClick = false;
         this.filterType = "startsWith";
     }
+    popupMenuOpenHandler() {
+        if (this.listOpen) {
+            this.listContainer.show();
+        }
+        else {
+            this.listContainer.hide();
+        }
+    }
     activeItemHandler(state) {
-        this.input.accessibleActiveDescendant = this.listOpen && (state || state === 0) ? `active_item` : "";
+        this.input.accessibleActiveDescendant = this.listOpen && (state || state === 0) ? this.activeDescendantId : "";
     }
     handleDocumentClick(e) {
         //we want to remove all user text if they have NOT selected from the dropdown
@@ -6681,6 +6697,7 @@ class DuetCombobox {
         this.value = this.processedItems.filter(item => this.selectedItems.has(item.id)).map(item => item.value);
         this.input.value = "";
         this.updateChips();
+        this.input.setFocus();
     }
     /**
      * Add item with id to the selectedItems set. Used only when multiple is true.
@@ -6715,6 +6732,8 @@ class DuetCombobox {
         if (this.selectedItems.has(id)) {
             this.selectedItems.delete(id);
             this.value = undefined;
+            this.input.value = "";
+            await this.input.setFocus();
         }
         else {
             this.selectedItems.clear();
@@ -6722,7 +6741,7 @@ class DuetCombobox {
             this.value = this.processedItems.find(item => item.id === id).value;
         }
         if (emitEvent) {
-            this.emitChangeEvent(id);
+            this.emitChangeEvent(this.value && id);
         }
         await this.updateInputText();
     }
@@ -6786,6 +6805,7 @@ class DuetCombobox {
             this.input.value = ""; // set value to empty so that cursor position follows accordingly
             this.input.value = await this.getSelectedItemLabel();
             this.input.scrollLeft = this.input.scrollWidth;
+            await this.input.setFocus();
         }
     }
     // Event handlers
@@ -6805,7 +6825,7 @@ class DuetCombobox {
     }
     //function that scrolls to the li element with the class "active"
     scrollToActive() {
-        const activeElement = this.listElement.querySelector(".active");
+        const activeElement = document.getElementById(`${this.activeDescendantId}`); // this is undefined on 1st keydown, make it be valid to fix the issue
         if (activeElement) {
             activeElement.scrollIntoView({
                 behavior: "smooth",
@@ -6879,10 +6899,10 @@ class DuetCombobox {
     }
     get element() { return getElement(this); }
     static get watchers() { return {
+        "listOpen": ["popupMenuOpenHandler", "processListOpenChange"],
         "activeItem": ["activeItemHandler"],
         "items": ["processItems"],
-        "value": ["processValue"],
-        "listOpen": ["processListOpenChange"]
+        "value": ["processValue"]
     }; }
     static get style() { return DuetComboboxStyle0; }
     static get cmpMeta() { return {
@@ -6898,7 +6918,7 @@ class DuetCombobox {
             "multiple": [4],
             "items": [1032],
             "formatter": [16],
-            "value": [1537],
+            "value": [1025],
             "minCharacters": [2, "min-characters"],
             "openListOnClick": [4, "open-list-on-click"],
             "filterType": [1, "filter-type"],
@@ -6911,7 +6931,7 @@ class DuetCombobox {
         },
         "$listeners$": [[4, "click", "handleDocumentClick"]],
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["value", "value"]]
+        "$attrsToReflect$": []
     }; }
 }
 
@@ -6960,10 +6980,10 @@ class DuetContactCard {
     render() {
         const isTurva = this.theme === "turva";
         const theme = isTurva ? "turva" : "default";
-        return (hAsync(Host, { key: '4a436cc9bd108107bc501a7643b2e93f5ac78e5c', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '47581ca62eb607cec4b8d1d37fcf5f18c2678a34', class: {
+        return (hAsync(Host, { key: '74f85ad21c040a5a98dee8c360b9958be3109855', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'd11d8de783ddd26e09d9e96923dc781f569e93f9', 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: '2146916a772d049a0a2c338e573c436cc799369c' }, this.name && (hAsync("duet-heading", { key: '1883776b3095e2f5aa9c173a96e7822d1c938f0e', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: '92b78c88c8e2d892719502f7d2505ed7449da8d3', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: '833f2c34ebcdce0e5233f80d6d01a5d9db13aadc', class: "email" }, hAsync("duet-icon", { key: '41310926f4b326de7de44f4a7346905386f80254', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '9ce96e8d1f5f73496c3b8e3d3c7d99e2de741c3e', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: '7b184f7a81d165ad37c66a6075d3b1698de6264c', class: "phone" }, hAsync("duet-icon", { key: 'b973fbdcdd02bea91e9adce6b2d94b7122f730fc', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '4ba2b90db91a2217590ce7bc5f70846dc87e9856', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: 'a292f1045430c6eeac2ec61eae9722c6ffe41f4b', class: "call-to-action" }, hAsync("duet-button", { key: '103fa46548191a207bcfa65a32e426b62c3c4e4a', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: 'b02b1c4afca5fb77e9fd389b64f1f853433bc52f' }), hAsync("slot", { key: '02bae65fb19132f6a49d7dc156e660e042385fc3' }))));
+            }, role: "group", "aria-label": this.name }, this.image ? hAsync("img", { class: "image", src: this.image, alt: this.name }) : hAsync("div", null), hAsync("div", { key: '7e934c796778de29e95e94bebec6937048b78566' }, this.name && (hAsync("duet-heading", { key: '26031bfeb5a46a69ebba836bd1cc714b077bb121', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: '8768df03c1a5dfb04cdf1eda46da5a327bbf3324', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: '92235e6bd3a7012a478cfd8100e4f5701f9ea950', class: "email" }, hAsync("duet-icon", { key: '3fe17e7cc18b9f724be2627dcb4e0adf667aaf5b', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: 'cc356db4a9b7f198504873d3e335cd6f83d7c70c', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: 'b9e6b3cc84f4aa81599ff5b7cd626f3e5f03ab33', class: "phone" }, hAsync("duet-icon", { key: '3223b182ee564f36ec8994536981eb6bc9fba82d', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '2396ee622e62c5a5be8dde2ecc9edecbb823cc9a', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: 'b5d4135434a9627822c9569ae9945bc5c3c2441a', class: "call-to-action" }, hAsync("duet-button", { key: '7ebaddbe3b97f9916fada3f248c343eb7bd6bdde', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: '12212314eff53718f85f30af84592ee6447b6b7b' }), hAsync("slot", { key: 'd1d55182364ac381b7f4ce0bcdecc6c0643739bc' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetContactCardStyle0; }
@@ -7260,6 +7280,23 @@ class DuetDatePicker {
         this.initialTouchX = null;
         this.initialTouchY = null;
         this.focusTarget = null;
+        this.dateErrorMessages = {
+            badInput: {
+                en: "Wrong date format",
+                fi: "Väärä päivämäärämuoto",
+                sv: "Fel datumformat",
+            },
+            rangeUnderflow: {
+                en: "Date too early",
+                fi: "Päivämäärä liian aikainen",
+                sv: "Datum för tidigt",
+            },
+            rangeOverflow: {
+                en: "Date too late",
+                fi: "Päivämäärä liian aikainen",
+                sv: "Datum för sent",
+            },
+        };
         this.enableActiveFocus = () => {
             this.focusTarget = "day-button";
         };
@@ -7272,6 +7309,11 @@ class DuetDatePicker {
         };
         this.handleBlur = (event) => {
             event.stopPropagation();
+            if (!this.validity.valid) {
+                this.value = null;
+                const errorKey = Object.entries(this.validity).find(entry => !!entry[1])[0];
+                this.internalValidityError = getLocaleString(this.dateErrorMessages[errorKey]);
+            }
             this.duetBlur.emit({
                 component: "duet-date-picker",
             });
@@ -7361,6 +7403,7 @@ class DuetDatePicker {
         this.open = false;
         this.focusedDay = new Date();
         this.inputValue = "";
+        this.internalValidityError = "";
         this.theme = "";
         this.expand = false;
         this.name = "";
@@ -7395,10 +7438,19 @@ class DuetDatePicker {
         this.validity = undefined;
         this.accessibleLiveError = "polite";
     }
-    updateValidity() {
+    updateValidity(newValue, _oldValue, propName) {
+        if (propName === "value" && newValue === null) {
+            return;
+        }
         this.determineValidity(parseISODate(this.value));
+        if (this.validity.valid) {
+            this.internalValidityError = "";
+        }
     }
     updateInternalValue() {
+        if (this.value === null) {
+            return;
+        }
         const parsedValue = parseISODate(this.value);
         const parsedInputValue = parseDate(this.inputValue);
         // an invalid or empty value should clear the input
@@ -7607,6 +7659,7 @@ class DuetDatePicker {
             "open": [32],
             "focusedDay": [32],
             "inputValue": [32],
+            "internalValidityError": [32],
             "setFocus": [64],
             "show": [64],
             "hide": [64]
@@ -7936,20 +7989,20 @@ class DuetFieldset {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '796efaecbe6ebd2dd9ca28bd48a7c0ca625171fe', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: '637226c8d070993fade17dc1cb44e8db6c070d43', "aria-labelledby": this.labelId, "aria-describedby": this.error ? this.errorId : null,
+        return (hAsync(Host, { key: 'f1f3d444a12a63dc805ed39d5df2127e5bb1a6b0', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: 'ee4f9a2ecd2929ec5c3a8ef1451d576455fdeb3c', "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: 'a49cbefbe852732e4b2b4326acd0a462d90106a6', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: 'f5f1518e027266a0e2d584fa1a6b4376f5db78e7' }, this.label), this.caption && hAsync("span", { key: 'cb39f09028e0dd245b2df28580493b6de584ed3c' }, this.caption)), hAsync("div", { key: '06d122ad9ce4c683b3eabfba9fb75db65a098eb1', class: {
+            } }, hAsync("legend", { key: 'f28701a95d80391e51b4da87c959632b5a8d1ffb', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: '00174cf4da53b36e02cbb1baa6e7f394e4837013' }, this.label), this.caption && hAsync("span", { key: 'c9cd441e8bca0154ef1813ddfbde9dfaf340c5aa' }, this.caption)), hAsync("div", { key: '50f3f035319e6d60aef074d6469e4a61577fc15b', 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: '8f82b4f9980bf6681e5fee90a4b781e65e23f2b0', class: "duet-fieldset-label" }, hAsync("span", { key: 'eae1f845e20acf1b968997393e62ad8ccd3b0cc8', "aria-hidden": "true" }, this.label), hAsync("slot", { key: '7148e9ad377dce9d87116e9ece609df2173f3331', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: '948abdedb43e0de5a965d4f03d21dbb7c138b55c', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: '94a4ac15cefd5f8dc70f52ba257b448f9ca3c74a', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: '287a9d3649d0d24ae4bca3aa44009947ea3758fe' }), hAsync("span", { key: '2b4acb42a4e06002428b01c170a5a003dfe3654b', class: "duet-fieldset-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '93e6611df1d44a5a657e69ac71402366aa7d82cd' }, this.error)))));
+            } }, hAsync("div", { key: '3295a828e865f3a098633a3dc6ef7a3be348aa26', class: "duet-fieldset-label" }, hAsync("span", { key: '72f62a24e4815ff4a9807c030c32b6dedef0d667', "aria-hidden": "true" }, this.label), hAsync("slot", { key: '890f95bd218c8b0bbdfc1a408c1449fa2b56afbb', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: '8dc56ad89eb4bac4a5e4563f45200a8d2993dc47', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: '2321bfb5f6e91b96fbdf2514e697e9de2265b22d', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: '27c31b44f71cdf4b5a4a7902c4df395f175f2e8e' }), hAsync("span", { key: '31d68af77217b877f00493b906a41a03eb67672c', class: "duet-fieldset-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '131471978f9b59dad56ad633dd52609578c66c62' }, this.error)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetFieldsetStyle0; }
@@ -9576,11 +9629,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: '036bd71920292b0eb364007a8d38b01a01e07ce3', class: {
+        return (hAsync(Host, { key: 'e2a6207edfe7af905325a3fe412f97a529c93ed8', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-icon-has-outline": !!this.outline,
                 "duet-icon-has-background": !!this.background,
-            } }, hAsync("span", { key: '2959987408354e2be6c726b2d66087479c0651f0', "aria-hidden": "true", style: styles, class: {
+            } }, hAsync("span", { key: '0bd4b9de6c7c4fb0a2663fc16d742e9e0223aa5d', "aria-hidden": "true", style: styles, class: {
                 "duet-icon": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
@@ -9589,7 +9642,7 @@ class DuetIcon {
                 [shapeStyle]: true,
                 rotated: this.shape === "brand-rotated" && this.theme !== "turva",
                 "duet-icon-not-responsive": !this.responsive,
-            } }, hAsync("span", { key: 'e75af917059142d7f015109e7224fba0cc2e18b3', "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: 'dca93a95c7f578585dcd6030f7d2bbdf50766ed5', "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 {
@@ -10106,7 +10159,7 @@ function isInternetExplorer() {
     return "documentMode" in document || /Edge/.test(ua);
 }
 
-const duetLayoutCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}::slotted([slot=page-heading]){width:calc(100% + 32px);margin:0 -16px 0 -16px}@media (min-width: 36em){::slotted([slot=page-heading]){width:calc(100% + 56px);margin:0 -28px 0 -28px}}@media (min-width: 62em){::slotted([slot=page-heading]){width:calc(100% + 112px);margin:0 -56px 0 -56px}}:host(.center) ::slotted([slot=page-heading]){width:calc(100% + 32px);margin:0 -16px 0 -16px}@media (min-width: 36em){:host(.center) ::slotted([slot=page-heading]){width:calc(100% + 96px);margin:0 -48px 0 -48px}}@media (min-width: 48em){:host(.center) ::slotted([slot=page-heading]){width:calc(100% + 144px);margin:0 -72px 0 -72px}}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;flex:1 0 auto;width:100%}:host(.duet-middle){display:flex}:host(.duet-middle) .duet-layout{padding:36px 28px !important}@media (min-width: 36em){:host(.duet-middle) .duet-layout{padding:48px 36px !important}}@media (min-width: 62em){:host(.duet-middle) .duet-layout{padding:56px !important}}:host(.duet-middle) .heading-wrapper{padding:0 !important}:host(.duet-ie){height:100%}:host(.duet-middle.duet-ie){height:auto}.duet-layout{position:relative;padding:0 16px;margin:48px auto 36px;overflow-x:clip}@media (max-width: 20.5em){.duet-layout.padding-xxx-small{padding:0}}@media (max-width: 22.5em){.duet-layout.padding-xx-small{padding:0}}@media (max-width: 35.9375em){.duet-layout.padding-x-small{padding:0}}@media (min-width: 36em){.duet-layout.padding-small{padding:0}}@media (min-width: 48em){.duet-layout.padding-medium{padding:0}}@media (min-width: 62em){.duet-layout.padding-large{padding:0}}@media (min-width: 64.0625em){.duet-layout.padding-x-large{padding:0}}@media (min-width: 76.25em){.duet-layout.padding-xx-large{padding:0}}@media (min-width: 106.25em){.duet-layout.padding-xxx-large{padding:0}}@media (min-width: 36em){.duet-layout{margin-top:72px}}.duet-layout.duet-layout-has-top{margin-top:0}.duet-layout.duet-m-0{margin-top:0 !important;margin-bottom:0 !important}.duet-layout.duet-center{display:flex;align-items:center;justify-content:center;width:100%;max-width:888px}@media (min-width: 36em){.duet-layout.duet-center{padding:0 48px}}@media (min-width: 48em){.duet-layout.duet-center{padding:0 72px}}@media (min-width: 62em){.duet-layout.duet-center{width:100%}}@media (min-width: 36em){.duet-layout{padding:0 28px}}@media (min-width: 62em){.duet-layout{display:flex;flex-direction:row;padding:0 56px;margin-bottom:48px}}@media (min-width: 76.25em){.duet-layout{max-width:1110px;padding:0}}.duet-main,.duet-sidebar,.duet-layout-top,.duet-layout-bottom{display:block;width:100%}.duet-layout-top{position:relative;display:block;width:100%;margin:72px auto 0}.duet-layout-top.duet-m-0{margin-top:0 !important;margin-bottom:0 !important}.duet-layout-top .duet-layout-top-wrapper{padding:0 20px;margin:0 auto}@media (min-width: 36em){.duet-layout-top .duet-layout-top-wrapper{padding:0 28px}}@media (min-width: 62em){.duet-layout-top .duet-layout-top-wrapper{padding:0 56px}}@media (min-width: 76.25em){.duet-layout-top .duet-layout-top-wrapper{max-width:1110px;padding:0}}.duet-center .duet-layout-top-wrapper{max-width:888px}@media (min-width: 36em){.duet-center .duet-layout-top-wrapper{padding:0 48px}}@media (min-width: 48em){.duet-center .duet-layout-top-wrapper{padding:0 72px}}@media (min-width: 62em){.duet-main{min-width:600px;margin:0 auto}.has-sidebar .duet-main{max-width:734px;margin-right:20px}}@media (min-width: 62em){.duet-sidebar{min-width:256px;max-width:356px}}@media (min-width: 62em){.duet-sidebar-container{width:auto;max-width:356px}}@media (min-width: 62em){.duet-sidebar-container.has-tabs{margin-top:89px}}@media (min-width: 62em){.duet-sidebar-container.sticky{position:sticky}.duet-sidebar-container.sticky.with-links{top:calc(3rem + 20px)}.duet-sidebar-container.sticky.without-links{top:calc(4rem + 20px)}}";
+const duetLayoutCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}::slotted([slot=page-heading]){width:calc(100% + 32px);margin:0 -16px 0 -16px}@media (min-width: 36em){::slotted([slot=page-heading]){width:calc(100% + 56px);margin:0 -28px 0 -28px}}@media (min-width: 62em){::slotted([slot=page-heading]){width:calc(100% + 112px);margin:0 -56px 0 -56px}}:host(.center) ::slotted([slot=page-heading]){width:calc(100% + 32px);margin:0 -16px 0 -16px}@media (min-width: 36em){:host(.center) ::slotted([slot=page-heading]){width:calc(100% + 96px);margin:0 -48px 0 -48px}}@media (min-width: 48em){:host(.center) ::slotted([slot=page-heading]){width:calc(100% + 144px);margin:0 -72px 0 -72px}}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;flex:1 0 auto;width:100%}:host(.duet-middle){display:flex}:host(.duet-middle) .duet-layout{padding:36px 28px !important}@media (min-width: 36em){:host(.duet-middle) .duet-layout{padding:48px 36px !important}}@media (min-width: 62em){:host(.duet-middle) .duet-layout{padding:56px !important}}:host(.duet-middle) .heading-wrapper{padding:0 !important}:host(.duet-ie){height:100%}:host(.duet-middle.duet-ie){height:auto}.duet-layout-wrapper{display:block;margin:48px 0 36px;overflow-x:clip}@media (min-width: 36em){.duet-layout-wrapper{margin-top:72px}}@media (min-width: 62em){.duet-layout-wrapper{margin-bottom:48px}}.duet-layout-wrapper.duet-m-0{margin-top:0 !important;margin-bottom:0 !important}.duet-layout-wrapper>*{width:100%}.duet-layout{position:relative;padding:0 16px;margin:0 auto}@media (max-width: 20.5em){.duet-layout.padding-xxx-small{padding:0}}@media (max-width: 22.5em){.duet-layout.padding-xx-small{padding:0}}@media (max-width: 35.9375em){.duet-layout.padding-x-small{padding:0}}@media (min-width: 36em){.duet-layout.padding-small{padding:0}}@media (min-width: 48em){.duet-layout.padding-medium{padding:0}}@media (min-width: 62em){.duet-layout.padding-large{padding:0}}@media (min-width: 64.0625em){.duet-layout.padding-x-large{padding:0}}@media (min-width: 76.25em){.duet-layout.padding-xx-large{padding:0}}@media (min-width: 106.25em){.duet-layout.padding-xxx-large{padding:0}}.duet-layout.duet-center{display:flex;align-items:center;justify-content:center;width:100%;max-width:888px}@media (min-width: 36em){.duet-layout.duet-center{padding:0 48px}}@media (min-width: 48em){.duet-layout.duet-center{padding:0 72px}}@media (min-width: 62em){.duet-layout.duet-center{width:100%}}@media (min-width: 36em){.duet-layout{padding:0 28px}}@media (min-width: 62em){.duet-layout{display:flex;flex-direction:row;padding:0 56px}}@media (min-width: 76.25em){.duet-layout{max-width:1110px;padding:0}}.duet-main,.duet-sidebar,.duet-layout-top,.duet-layout-bottom{display:block;width:100%}.duet-layout-top{position:relative;display:block;width:100%}.duet-layout-top .duet-layout-top-wrapper{padding:0 20px;margin:0 auto}@media (min-width: 36em){.duet-layout-top .duet-layout-top-wrapper{padding:0 28px}}@media (min-width: 62em){.duet-layout-top .duet-layout-top-wrapper{padding:0 56px}}@media (min-width: 76.25em){.duet-layout-top .duet-layout-top-wrapper{max-width:1110px;padding:0}}.duet-center .duet-layout-top-wrapper{max-width:888px}@media (min-width: 36em){.duet-center .duet-layout-top-wrapper{padding:0 48px}}@media (min-width: 48em){.duet-center .duet-layout-top-wrapper{padding:0 72px}}@media (min-width: 62em){.duet-main{min-width:600px;margin:0 auto}.has-sidebar .duet-main{max-width:734px;margin-right:20px}}@media (min-width: 62em){.duet-sidebar{min-width:256px;max-width:356px}}@media (min-width: 62em){.duet-sidebar-container{width:auto;max-width:356px}}@media (min-width: 62em){.duet-sidebar-container.has-tabs{margin-top:89px}}@media (min-width: 62em){.duet-sidebar-container.sticky{position:sticky}.duet-sidebar-container.sticky.with-links{top:calc(3rem + 20px)}.duet-sidebar-container.sticky.without-links{top:calc(4rem + 20px)}}";
 var DuetLayoutStyle0 = duetLayoutCss;
 
 /**
@@ -10153,23 +10206,20 @@ class DuetLayout {
                 center: this.center,
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, this.hasTop && (hAsync("div", { key: '97f256b275cea1d8303d3c2b2fafcbc83ab17227', class: {
+            } }, hAsync("div", { key: '0db8d45f16f7bec516c0b831393cb05f962bfdb8', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, this.hasTop && (hAsync("div", { key: 'b65a92ce153b41318cb757b3457dfc470c11c4c6', class: {
                 "duet-layout-top": true,
-                "duet-m-0": this.margin === "none",
                 "duet-center": this.center,
-            } }, hAsync("div", { key: 'e08dfb887503e2db0e2d315bce69c4243ca0a368', class: "duet-layout-top-wrapper" }, hAsync("slot", { key: 'a0a214dab158a6228b6d8e69a4ae77b51dc3da68', name: "top" })))), hAsync("div", { key: '37a6738ab3a9695408026c8d83bbc1dbeb17490e', class: {
+            } }, hAsync("div", { key: '777fc5b75ff85428b7234d94739f7471f5dc8011', class: "duet-layout-top-wrapper" }, hAsync("slot", { key: '513fa6d80b00980efc02c454889726f24b3af6a9', name: "top" })))), hAsync("div", { key: '8d24cdd9f0a38cadf71cf74df0f44c547a9fb4f3', class: {
                 "duet-layout": true,
-                "duet-layout-has-top": this.hasTop,
                 "has-sidebar": this.hasSidebar,
-                "duet-m-0": this.margin === "none",
                 "duet-center": this.center,
                 [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, hAsync("main", { key: '9250e251d618850e3ca2a16c7e15f0d921b1cc0f', class: "duet-main" }, this.hasPageHeading && hAsync("slot", { key: '6bd2301fc4f57c18bab92ce7278ec037f38971d4', name: "page-heading" }), hAsync("slot", { key: 'd37514f4cc602e46ecbc78e87647076c9e550c94', name: "main" })), this.hasSidebar && (hAsync("aside", { key: '6ad7bd59e98bfe3123a1cccce343fb0f158387e0', class: "duet-sidebar" }, hAsync("div", { key: '6476ae186902b93bac02f5512c33ca2419202d8a', class: {
+            } }, hAsync("main", { key: 'e98b4d6704819e6a07f5ccc7b29227d6623e2bc2', class: "duet-main" }, this.hasPageHeading && hAsync("slot", { key: '642f458827bfce2732c708d5cff00b382180a202', name: "page-heading" }), hAsync("slot", { key: '929847b72cf01ed5be66b9fdc6e0e204281d0eab', name: "main" })), this.hasSidebar && (hAsync("aside", { key: '9cf127c89c37b47642d7d3234476c16d5c38fd11', class: "duet-sidebar" }, hAsync("div", { key: '043863761695cf57b596ab6759e99ae32e09f432', class: {
                 "duet-sidebar-container": true,
                 "has-tabs": this.tabs,
                 sticky: this.sticky,
                 [this.stickyDistance]: this.sticky,
-            } }, hAsync("slot", { key: '4406fe27dbd20dd18448aa76800be82b3333c306', name: "sidebar" })))))));
+            } }, hAsync("slot", { key: '772f164951137306ec8289a095a829fd2fc0a87b', name: "sidebar" }))))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetLayoutStyle0; }
@@ -10321,10 +10371,10 @@ class DuetLink {
     render() {
         const Tag = !this.url ? "button" : "a";
         const isButton = Tag === "button";
-        return (hAsync(Host, { key: '38d90e4467279d94a029c7ce5fdaf9fa3590d5ae', class: {
+        return (hAsync(Host, { key: 'd41fb8c7164bbecec224e9e2fa972eb7b1a293d6', class: {
                 [`duet-link-${this.variation}`]: true,
                 "duet-m-0": this.margin === "none",
-            } }, hAsync(Tag, { key: '5b1b7b691a3d66382b593a07fd47b3072fcd12fb', href: this.url, class: {
+            } }, hAsync(Tag, { key: 'e6918074f43470311a133ff2141b23ec25e927a0', href: this.url, class: {
                 "duet-link": true,
                 "duet-link-is-external": this.external,
                 "duet-link-is-download": !!this.download,
@@ -10447,7 +10497,7 @@ class DuetList {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("dl", { key: '1fe1ac541aeae071f5684e90937cee1a4be689d6', class: { "duet-list-component": true, "duet-m-0": this.margin === "none" } }, hAsync("slot", { key: '166ca55ff1ca8e804357bf991b84ede3eac45d13' })));
+        return (hAsync("dl", { key: 'be789bab546df8b0ac070d09a5f5c47f5f428afe', class: { "duet-list-component": true, "duet-m-0": this.margin === "none" } }, hAsync("slot", { key: '645ee0c7c623eeed042e25ac2ea7aab51ef1a2bc' })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -10497,14 +10547,14 @@ class DuetListItem {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '5ca1067fca4b44ef1a3b57b52e775407879ab750', class: {
+        return (hAsync(Host, { key: '8d0b6c3347c4a27c4860fab966fe6bc260b67a86', 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: 'c8141e0af55f96c0dae8fbb8a50e74be470dc6bd' }, hAsync("slot", { key: '583b9d7f5109da8f0185abcf07ca45d6d30944dc', name: "label" })), hAsync("dd", { key: 'bfcb5056ec7fbb9412084e3eb95b610f168d7559' }, hAsync("slot", { key: '3b844ecbbf9dbb82e2b4d9ac44cad328104865da', name: "value" }))));
+            } }, hAsync("dt", { key: '2240e7c58ae5f995ae07f4ef72d1196e2098a01c' }, hAsync("slot", { key: '0bd7d924731a9f4cbe0583160ea8c36ef97cc810', name: "label" })), hAsync("dd", { key: 'c4c449fcf008b4d2b068fd36f0d3a982b43a3aac' }, hAsync("slot", { key: 'a655dde8debcffe6b0569772902072ede9790cab', name: "value" }))));
     }
     static get style() { return DuetListItemStyle0; }
     static get cmpMeta() { return {
@@ -10597,7 +10647,7 @@ class DuetLogo {
      */
     render() {
         const TagName = this.href ? "a" : "div";
-        return (hAsync(Host, { key: '5d084305a0696301d4a6821758e0689a4c7cb24b', class: { "duet-m-0": this.margin === "none" } }, hAsync(TagName, { key: 'bd7ff8798ac2294e92714074abc3a40ac09f84a3', href: this.href, ref: link => (this.nativeLink = link), "aria-label": this.accessibleLabel, class: {
+        return (hAsync(Host, { key: 'cd53d85f163bc76250be1e5514b00bf6769e7f54', class: { "duet-m-0": this.margin === "none" } }, hAsync(TagName, { key: '8ec59c6823257e298b0e298a7d6eda2c40725d83', href: this.href, ref: link => (this.nativeLink = link), "aria-label": this.accessibleLabel, class: {
                 "duet-logo": true,
                 [this.size]: true,
                 "duet-theme-turva": this.theme === "turva",
@@ -10627,7 +10677,7 @@ class DuetLogo {
     }; }
 }
 
-const duetMenuBarCss = "*,*::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;position:relative;width:100%}.duet-menu-bar{position:relative;top:0;z-index:2;display:flex;align-items:center;justify-content:center;background:rgb(255, 255, 255);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07);transition:top 0.3s}.duet-menu-bar.hidden{top:-200px}.duet-menu-bar.bottom{z-index:1}@media (min-width: 62em){.duet-menu-bar{box-shadow:0 3px 6px 0 rgba(0, 41, 77, 0.1)}}.duet-menu-bar .top{display:none}.duet-menu-bar .bottom{display:none}.duet-menu-bar.horizontal-nav{position:relative}.duet-menu-bar.horizontal-nav .top{position:absolute;top:0;left:3.5%;display:block;width:93%;height:1px;background:rgb(245, 248, 250)}.duet-menu-bar.horizontal-nav .bottom{position:absolute;bottom:0;left:0;display:block;width:100%;height:1px;background:rgb(225, 227, 230)}.duet-menu-bar.horizontal-nav .more-left{position:absolute;top:0;left:-1px;z-index:1;width:56px;height:49px;background:linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0) 100%)}@media (min-width: 62em){.duet-menu-bar.horizontal-nav .more-left{display:none}}.duet-menu-bar.horizontal-nav .more-right{position:absolute;top:0;right:-1px;z-index:1;width:56px;height:49px;background:linear-gradient(270deg, #fff 0%, rgba(255, 255, 255, 0) 100%)}@media (min-width: 62em){.duet-menu-bar.horizontal-nav .more-right{display:none}}@media (pointer: fine){.duet-menu-bar.horizontal-nav{display:none}}@media (pointer: fine) and ((min-width: 62em)){.duet-menu-bar.horizontal-nav{display:flex}}.duet-menu-bar .container{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1440px;height:100%;height:3.25rem;padding:0 8px 0 20px;overflow-x:auto;scrollbar-width:none}.duet-menu-bar .container::-webkit-scrollbar{width:0;height:0}@media (min-width: 62em){.duet-menu-bar .container{height:5rem;padding:0 28px;overflow-x:visible}}.duet-menu-bar .container .list{height:100%;list-style-type:none}.duet-menu-bar .container ::slotted(*){height:100%}.duet-menu-bar .container>*{display:flex;align-items:center;justify-content:center;height:100%}.duet-menu-bar .container>:first-child{flex-basis:0;flex-grow:1;justify-content:flex-start}.duet-menu-bar .container>:last-child{flex-basis:0;flex-grow:1;justify-content:flex-end}.duet-menu-bar .container ::slotted(*){display:flex;align-items:center;justify-content:center;height:100%}.duet-menu-bar.duet-theme-turva{background:rgb(255, 255, 255);box-shadow:0 2px 6px 0 rgba(23, 28, 58, 0.07)}@media (min-width: 62em){.duet-menu-bar.duet-theme-turva{box-shadow:0 3px 6px 0 rgba(23, 28, 58, 0.1)}}.center{font-size:1rem;font-weight:600;line-height:1.25;color:rgb(0, 41, 77)}.duet-theme-turva .center{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)}.right{font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(0, 77, 128)}.duet-theme-turva .right{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)}";
+const duetMenuBarCss = "*,*::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;position:relative;width:100%}.duet-menu-bar{position:relative;top:0;z-index:2;display:flex;align-items:center;justify-content:center;background:rgb(255, 255, 255);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07);transition:top 0.3s}.duet-menu-bar.hidden{top:-200px}.duet-menu-bar.bottom{z-index:1}@media (min-width: 62em){.duet-menu-bar{box-shadow:0 3px 6px 0 rgba(0, 41, 77, 0.1)}}.duet-menu-bar .top{display:none}.duet-menu-bar .bottom{display:none}.duet-menu-bar.horizontal-nav{position:relative}.duet-menu-bar.horizontal-nav .top{position:absolute;top:0;left:3.5%;display:block;width:93%;height:1px;background:rgb(245, 248, 250)}.duet-menu-bar.horizontal-nav .bottom{position:absolute;bottom:0;left:0;display:block;width:100%;height:1px;background:rgb(225, 227, 230)}.duet-menu-bar.horizontal-nav .more-left{position:absolute;top:0;left:-1px;z-index:1;width:56px;height:49px;pointer-events:none;background:linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0) 100%)}@media (min-width: 62em){.duet-menu-bar.horizontal-nav .more-left{display:none}}.duet-menu-bar.horizontal-nav .more-right{position:absolute;top:0;right:-1px;z-index:1;width:56px;height:49px;pointer-events:none;background:linear-gradient(270deg, #fff 0%, rgba(255, 255, 255, 0) 100%)}@media (min-width: 62em){.duet-menu-bar.horizontal-nav .more-right{display:none}}@media (pointer: fine){.duet-menu-bar.horizontal-nav{display:none}}@media (pointer: fine) and ((min-width: 62em)){.duet-menu-bar.horizontal-nav{display:flex}}.duet-menu-bar .container{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1440px;height:100%;height:3.25rem;padding:0 8px 0 20px;overflow-x:auto;scrollbar-width:none}.duet-menu-bar .container::-webkit-scrollbar{width:0;height:0}@media (min-width: 62em){.duet-menu-bar .container{height:5rem;padding:0 28px;overflow-x:visible}}.duet-menu-bar .container .list{height:100%;list-style-type:none}.duet-menu-bar .container ::slotted(*){height:100%}.duet-menu-bar .container>*{display:flex;align-items:center;justify-content:center;height:100%}.duet-menu-bar .container>:first-child{flex-basis:0;flex-grow:1;justify-content:flex-start}.duet-menu-bar .container>:last-child{flex-basis:0;flex-grow:1;justify-content:flex-end}.duet-menu-bar .container ::slotted(*){display:flex;align-items:center;justify-content:center;height:100%}.duet-menu-bar.duet-theme-turva{background:rgb(255, 255, 255);box-shadow:0 2px 6px 0 rgba(23, 28, 58, 0.07)}@media (min-width: 62em){.duet-menu-bar.duet-theme-turva{box-shadow:0 3px 6px 0 rgba(23, 28, 58, 0.1)}}.center{font-size:1rem;font-weight:600;line-height:1.25;color:rgb(0, 41, 77)}.duet-theme-turva .center{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)}.right{font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(0, 77, 128)}.duet-theme-turva .right{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)}";
 var DuetMenuBarStyle0 = duetMenuBarCss;
 
 /**
@@ -10766,13 +10816,13 @@ class DuetMenuBar {
     render() {
         const slideoutAvailable = document.querySelectorAll("duet-slideout").length > 0;
         const isUsedAsAdditionalHorizontalNav = slideoutAvailable && !this.logo;
-        return (hAsync(Host, { key: '6772191fb52ef833296d4591848722cdd716fd8a' }, hAsync("nav", { key: 'bbfd138c4487382bf33cd2a27a11abae07c1cd84', class: {
+        return (hAsync(Host, { key: '9a82d643e803955587245cdeab312b2e3cc0daf1' }, hAsync("nav", { key: '8c7c326745b8bc593357acbd1fd629b827f3d6fa', class: {
                 "duet-menu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 "horizontal-nav": isUsedAsAdditionalHorizontalNav,
                 hidden: this.hidden && this.hideOnScroll,
                 bottom: this.onBottom,
-            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: '0e76aa9cf8e2088809c32ffb889ea7bd0e65f328', class: "top" }), hAsync("div", { key: '3e0e929ab2dabd44122c86b3d89690084d49ee8c', class: { container: true }, ref: el => (this.container = el), onScroll: () => this.scrollbarCheck() }, this.logo && (hAsync("div", { key: 'daf3d473577d75062dbbdd2f4d277aecffddb806' }, hAsync("duet-logo", { key: 'e560ec5ffbd0ab8c03a2284c6f5c24be44304595', size: this.logoSize, margin: "none", theme: this.theme, href: this.logoHref, accessibleLabel: this.logoLinkAccessibleLabel, onClick: this.handleLogoClick, language: this.language }))), hAsync("div", { key: 'f90de1dde38ffad772fd1db9ef1949bd69651a17', class: "list center", role: "list" }, hAsync("div", { key: 'e21ef580e08ebefe3ff5a23da0a6df2d2714c2b0', class: "more-left", hidden: !this.leftMoreVisible, role: "presentation" }), hAsync("slot", { key: 'fbfd2e2f6a9d69d0e5f0843d30f723beadde4c1b', name: "center" }), hAsync("div", { key: '6d232d47954eb7590982353aa05a869353cd5103', class: "more-right", hidden: !this.rightMoreVisible, role: "presentation" })), hAsync("div", { key: '14d79bc82134dd5449172dadccdd94e39508e3ce', class: "list right", role: "list" }, hAsync("slot", { key: '383cc225f16923f7538daf24ef5f5592ace15ece', name: "right" }))), hAsync("div", { key: '5042a82358354e9a77e5f7d022d47bf46e9c6250', class: "bottom" }))));
+            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: 'e24739d56af15972f61b6ab77023cc406065ca18', class: "top" }), hAsync("div", { key: '7417f19867c76f8892ba6afb4186f0f1ac63fe30', class: { container: true }, ref: el => (this.container = el), onScroll: () => this.scrollbarCheck() }, this.logo && (hAsync("div", { key: 'bb310c770913b93feaa0fa0eb6b7ddb4999a5768' }, hAsync("duet-logo", { key: '98d0d4582de1eae55df9525d27894c879905c9db', size: this.logoSize, margin: "none", theme: this.theme, href: this.logoHref, accessibleLabel: this.logoLinkAccessibleLabel, onClick: this.handleLogoClick, language: this.language }))), hAsync("div", { key: 'de2176bb51370d7555b957aaae4ba39f4edac589', class: "list center", role: "list" }, hAsync("div", { key: '754756436eefdf6c3573c140bf82efadfd52230b', class: "more-left", hidden: !this.leftMoreVisible, role: "presentation" }), hAsync("slot", { key: '1b9d20d9511d4e256bf43032f7ca6e8410e92ff8', name: "center" }), hAsync("div", { key: 'b286c85435057052db5a16825e200f19a3362a45', class: "more-right", hidden: !this.rightMoreVisible, role: "presentation" })), hAsync("div", { key: '9f8c33c495e38d6e4097c09c241021f4dfac2e7c', class: "list right", role: "list" }, hAsync("slot", { key: '60044dd369d475608a15825dc4f4ab37002bb7c4', name: "right" }))), hAsync("div", { key: 'd2867a4033941a35a3c5aab6f513654c6d7ae46b', class: "bottom" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarStyle0; }
@@ -10838,10 +10888,10 @@ class DuetMenuBarButton {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '9206620e16533fa13b7b84f47b8543a70a7b2410', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: 'e172b1d487ac1b425e26b56485f03b6ee2453110', ref: button => (this.nativeButton = button), class: {
+        return (hAsync(Host, { key: 'b75681de13f1b56aba468bbeaf6c91cff06f04c8', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: '8e420bc9b912c9086a8c2a8f630ca6adf00975cd', 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: '46afda060d34d192871f0601c64c188236389aed', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '61ead72d9ec280bc7a757582c62d7028ce400d22' }))));
+            }, "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: 'd9d2925556a2dbc47b47bf619153776cc22748a3', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '84fc4d829c7c9265000de9c26f9b3eaaa49a0ee2' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarButtonStyle0; }
@@ -10924,17 +10974,17 @@ class DuetMenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'b7505ee892ea3ee2d0e0f37e3638b7d2b783712a', role: "listitem" }, hAsync("div", { key: '751e646811727d6f6a24a416df10f1c543940879', class: {
+        return (hAsync(Host, { key: '159a72c1a2553cb3e60dc3dc0c65b26dbdb5f127', role: "listitem" }, hAsync("div", { key: 'f785855ea709c8c72a24bb21358f0c1d88f64ea9', 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: 'fef18c42d08e89e0db82ca29c0aacf1cb9ff5326', 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: '5bd18b653e56b118010f0d4666499248536c8191', 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: '76888e1deea9cbb8e7bb3bdf5336669e2ae413e5', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'd6d0c4bd9426aa41b4ba68b222669c922943150b', class: "label" }, hAsync("slot", { key: '6478ad4df0cc0f954ef1a2ea8c4d7d6379e3ee83', name: "label" }), hAsync("duet-icon", { key: '4118eec0a8f4d17b22aeab5efb9e7af3d9c6d096', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'd7026456d474f327320675a3174ec3eb1caf706d', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'ee1a6c98ef2fa2fd6cd8163bb0100679898343a1', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'c2580c2db45875b7aa575780a374d3f4e0d160bc', class: "label" }, hAsync("slot", { key: 'ccb43b624e73ef5787ebd4be857b6c8062542ace', name: "label" }), hAsync("duet-icon", { key: 'a22ff13f9b06f00a83bc8bdcba71e283b6d209b8', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'ef1d06be5ca34c8f4b08abca38c2a8cad73a462e', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'da2e4f2687f3aa80426a260df734e79cdb69c48a' })))));
+            } }, hAsync("slot", { key: 'd433708b350f67749fd32d1db41a0e0f24f2a664' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarDropdownStyle0; }
@@ -10994,11 +11044,11 @@ class DuetMenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'e3310b8dfef57c95572f69574ab3f2844f0a8fd2' }, hAsync("a", { key: '0bc7dc99b57576902aa56cf53e0f0a092d7d1606', class: {
+        return (hAsync(Host, { key: 'd465ea161313c153d8d4d829f94fc48567a9f16b' }, hAsync("a", { key: '77aba96c14938f35bdc65b30a39a1c4798513b8c', 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: '0434d95f76ea5e61047da18bac14f7261626a161', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: '8b32a81bdf0bd30bb14486a8593e31f1cd86632e' }))));
+            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '760f86354100f4dc150606892788094ab5e393ab', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: 'd7e78f0c2a70ad6eb71c0929fe4254c48dbd0b2c' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarDropdownLinkStyle0; }
@@ -11050,11 +11100,11 @@ class DuetMenuBarItem {
      */
     render() {
         const TagName = this.url ? "a" : "button";
-        return (hAsync(Host, { key: 'd2a4ae5947cf7b820de11d1c92be082aefa72e3f', role: "listitem" }, hAsync(TagName, { key: 'bb5eef2f76aed3e48357bc4cc399794df49ca320', ref: element => (this.itemElement = element), class: {
+        return (hAsync(Host, { key: '61c0988644daa9a5cbd52db81fe2b158347d691c', role: "listitem" }, hAsync(TagName, { key: 'dc943150a89fbd84b002cfc41e5158403aa24dc9', 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.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: 'f0a8e147fe0b4e6beb3e9c0e68d73d17d8903179', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '290f322579d4af32f271ae21d86be07e4938dced' }), this.trailingIcon && (hAsync("duet-icon", { key: 'a34778af006706400452949461d96ab1dece7608', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '575cc29397b227cbcf0299c53cb7f2aa5ab535b3', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '53dbb1f8f6348906f6cf5a58b3e4f9670b0294fa' }), this.trailingIcon && (hAsync("duet-icon", { key: '7ee1c4e3032e1fe1f9a27a5b03cf4457a797534c', class: {
                 "trailing-icon": true,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
@@ -11105,11 +11155,11 @@ class DuetMenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '570640efc7db1d51c8ec33f775b2b13ffd8fd909', role: "listitem" }, hAsync("a", { key: '62ed2f6bf339d40211f56ff0e78ab61aa71a6c9a', class: {
+        return (hAsync(Host, { key: 'fcc0c89c9c6e809e8b2bb0a264146d81e8c93c6e', role: "listitem" }, hAsync("a", { key: '1d290fada8ee026de4e189c9f937a2aca26467c8', 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: '45e66a513cff3cda4b8f4ab51fc0d404391265a1', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '144d7755346f5dc042b2ad7836a3020d954b6648' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '4cdeef2295998ece7f565164f12ce598a6eaecad', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: 'f55132877b4b03b3861054f8165e9ae78b3e17df' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarLinkStyle0; }
@@ -11360,18 +11410,18 @@ class DuetModal {
         var _a, _b;
         let iconColor = "primary";
         let closeColor = "secondary";
-        const closingButton = (hAsync("div", { key: '1dbe12d292a5d852cc15d465a9a66f5965af9430', class: "duet-modal-close" }, hAsync("duet-button", { key: '468e6a8ffbaebd63b3b4a8ee7af2a56adc95ca33', ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
+        const closingButton = (hAsync("div", { key: '1da278102e1c18bced35701804e9217102015179', class: "duet-modal-close" }, hAsync("duet-button", { key: '8a90526b27671c22fc55532ddcb94fd3c1e32606', ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
         if (this.theme === "turva") {
             iconColor = "primary-turva";
             closeColor = "secondary-turva";
         }
-        return (hAsync("div", { key: '71d788e920473696ea1178fd1f4d531332c0278d', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
+        return (hAsync("div", { key: '58c17910a720462e06df9bc4b987c2e889c89d8f', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
                 "duet-modal-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-modal-active": this.open,
                 "duet-modal-slide-up": this.variation === "slide-up",
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
-            } }, hAsync("duet-overlay", { key: 'dc0d466574cf07bd5b2442a969e2309d1f4c3b84', "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { key: '9412b5b6e861150f01c81fbd495a1deca1576301', ref: modalInner => (this.modalInnerEl = modalInner), class: {
+            } }, hAsync("duet-overlay", { key: '914408c9f5bd3059edf6197e12bb51827be71395', "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { key: 'cee4a64292d3212c0913fca099acdd6da119a300', ref: modalInner => (this.modalInnerEl = modalInner), class: {
                 "duet-modal-inner": true,
                 [this.size]: true,
                 "duet-modal-slide-up": this.variation === "slide-up",
@@ -11382,18 +11432,18 @@ class DuetModal {
                         this.closeModal(e);
                     }
                 }
-            } }, hAsync("div", { key: 'cd7f79907611d3f5d06c95b9288d3d078e12c825', ref: modalContentEl => (this.modalContentEl = modalContentEl), class: {
+            } }, hAsync("div", { key: '10aadd51aa5a43d7158b2ba901e72dec73dff0c1', ref: modalContentEl => (this.modalContentEl = modalContentEl), class: {
                 "duet-modal": true,
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
                 [this.size]: true,
                 [this.variation]: true,
-            } }, this.gutterSize !== "none" && !this.hasStickyHeader && hAsync("duet-spacer", { key: '7836985c408c6f18fc389f3965a4b41d6eb59b3d' }), this.hasStickyHeader ? (hAsync("div", { class: "duet-modal-sticky-header" }, closingButton, hAsync("slot", { name: "sticky-header" }))) : (closingButton), hAsync("div", { key: '9d54f33d50e94607e2ef8517670f723e6602b628', class: {
+            } }, this.gutterSize !== "none" && !this.hasStickyHeader && hAsync("duet-spacer", { key: 'fb858b05b255dc1928c79212ac0460dfc0bc2fb7' }), this.hasStickyHeader ? (hAsync("div", { class: "duet-modal-sticky-header" }, closingButton, hAsync("slot", { name: "sticky-header" }))) : (closingButton), hAsync("div", { key: 'e30440c57234f2f47213b1443939bc334f6984d2', class: {
                 "duet-modal-body": true,
                 "duet-modal-gutter-none": this.gutterSize === "none",
                 "duet-modal-gutter-small": this.gutterSize === "small",
                 "duet-modal-gutter-medium": this.gutterSize === "medium",
                 "duet-modal-gutter-large": this.gutterSize === "large",
-            } }, hAsync("div", { key: 'ad9468551b2c57c08c2a4a0e412de18472d59795', class: "duet-modal-header" }, hAsync("span", { key: '9c6269ee1ca066e75d630a033692daa3d7e45e2c', class: "duet-modal-inner-slot-top" }, hAsync("slot", { key: '59df4f56690160cbf5540000a4df88079d934cdb', name: "top" })), this.icon && hAsync("duet-icon", { key: '686b798b952df7dbc87a678bc20a46d2856bd047', name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { key: 'd54b10219d4a823f7d60ace3ee304e920578ed19', "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (hAsync("div", { key: '86418e12b9d65d5812eb3ced0f08a9d1cd9d3427', class: "duet-modal-spinner" }, hAsync("duet-spinner", { key: '3aeda44a3313984a91ec59d3f9455408aa4b7fe7', size: "large", color: "primary" }))), hAsync("div", { key: 'f130a5ad99bade63e75eb33a6e52d65d5e2267c0', class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, hAsync("slot", { key: '38d1e37735093ca54cefb2c0fcea95bcf5031e7d' })))))));
+            } }, hAsync("div", { key: 'c905a56349275111b507b046c34db4d99befff51', class: "duet-modal-header" }, hAsync("span", { key: '481ee67583a42d430318be206b08d3976eb9bb4e', class: "duet-modal-inner-slot-top" }, hAsync("slot", { key: '55f8c5bb8575960783ea74eb7ea882aaad8bddea', name: "top" })), this.icon && hAsync("duet-icon", { key: 'c488922a98c16bf38e06085f1e9a673b12cf9b82', name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { key: 'b850658878de554dfc27a4978e34bfced4432e00', "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (hAsync("div", { key: '4355986a4863d9f0d8359b95def6411f65d5c314', class: "duet-modal-spinner" }, hAsync("duet-spinner", { key: 'cf8f38d7b53c41cca414993f4a16d709c197f95e', size: "large", color: "primary" }))), hAsync("div", { key: '08c10e61fe189fb99f218eac37ace4084141b94f', class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, hAsync("slot", { key: 'f7c981e29d90accd5e7313a3f26de39788225287' })))))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -11658,23 +11708,23 @@ class DuetMultiselect {
      */
     render() {
         var _a;
-        return (hAsync(Host, { key: '2a90b452b9d7391f8b3b51c9e7d38879625f2c22', class: {
+        return (hAsync(Host, { key: 'd88436c71fa360266440b8574bb2d35536cc65bd', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-expand": this.expand,
-            } }, hAsync("div", { key: '72352a45a7c3aa35c57dad3cd9f49cbc1326bcbb', class: {
+            } }, hAsync("div", { key: '212b648e8147fb2e58294009eb8aef03556f8684', class: {
                 "duet-multiselect-container": true,
                 "duet-label-hidden": this.labelHidden,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-input-top-caption-shown": this.isCaptionVisible,
                 "has-error": !!this.error,
-            }, onKeyDown: (e) => this.onMultiselectKeyDown(e) }, hAsync("duet-label", { key: '4865ef539aac5a0d6dbfc9c828b4f718f16b4391', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: this.identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { key: 'f8b0a426fc97ca162e773e13940881a35eb9d786', class: "duet-multiselect-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: '81aeb3000ae7199a964aea1ac388c38e84a4fb2b', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: '625d9d084517db0c1189934efce03ba06de02db3', id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { key: '21c2b0c5bf3d9b3689c248a719cef7ec3b537ee2', class: "duet-multiselect-wrapper" }, hAsync("button", { key: '63a1a064c7929f8237a49c3eb2bccce0cdca39be', id: this.identifier, ref: el => (this.multiselectElement = el), class: { "duet-multiselect": true, "duet-multiselect-active": this.checkboxesVisible }, tabindex: "0", onClick: () => this.toggleCheckboxes(), onFocus: e => this.onFocus(e), onBlur: e => this.onBlur(e), role: "combobox", "aria-expanded": this.checkboxesVisible ? "true" : "false", "aria-haspopup": "listbox", "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-owns": `${this.identifier}-checkboxes`, onKeyDown: (e) => this.onMultiselectInputKeyDown(e), disabled: this.disabled }, hAsync("span", { key: '57ceb2f7ae33662df4e807763d5cde9a3b22a542', role: "textbox", "aria-readonly": "true", "aria-multiline": "false", "aria-autocomplete": "none", "aria-controls": `${this.identifier}-checkboxes`, "aria-label": this.placeholderLabel[this.language], class: "duet-multiselect-label" }, this.placeholder), this.value && this.value.length > 0 && (hAsync("span", { key: '125251bf4995ecba0a021b518cd19a841adbb9fd', class: "duet-multiselect-badge" }, this.value.length, hAsync("duet-visually-hidden", { key: '37be16e7841d44731819861a5b51e0d9314f991d' }, this.selectedLangObject[this.language], ", ", this.value.map(item => item.label).join(", ")))), hAsync("svg", { key: 'de57fafe4aed5e3b87bec5d33bac362720272941', class: { "duet-multiselect-icon": true, "duet-multiselect-icon--rotate": this.checkboxesVisible }, fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: 'f00fa8753e52fefe18caa53e09b5fadf6de5ce9d', d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" }))), hAsync("div", { key: '17515783075704f82fdae08d8df693cb024f7722', id: `${this.identifier}-checkboxes`, role: "listbox", class: {
+            }, onKeyDown: (e) => this.onMultiselectKeyDown(e) }, hAsync("duet-label", { key: '9d4bec69691f6adc615c9366e86abf5f59fc39a6', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: this.identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { key: '3ba3a824ae8535ecafbfc73d0477da38e8146867', class: "duet-multiselect-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: 'c8fccccab9473eeb7d81b2b947b6732f6fe31111', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: '7ccb8a12ae76b75762161f444d3a058be2d35b84', id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { key: '1c61620d8dfeec8fdc4448028951b9a1a4a9968e', class: "duet-multiselect-wrapper" }, hAsync("button", { key: '3f2902a54d79a81144128cae9b62641ce234802a', id: this.identifier, ref: el => (this.multiselectElement = el), class: { "duet-multiselect": true, "duet-multiselect-active": this.checkboxesVisible }, tabindex: "0", onClick: () => this.toggleCheckboxes(), onFocus: e => this.onFocus(e), onBlur: e => this.onBlur(e), role: "combobox", "aria-expanded": this.checkboxesVisible ? "true" : "false", "aria-haspopup": "listbox", "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-owns": `${this.identifier}-checkboxes`, onKeyDown: (e) => this.onMultiselectInputKeyDown(e), disabled: this.disabled }, hAsync("span", { key: '04aec38aa6af20357b28bee3373c830bd34c0580', role: "textbox", "aria-readonly": "true", "aria-multiline": "false", "aria-autocomplete": "none", "aria-controls": `${this.identifier}-checkboxes`, "aria-label": this.placeholderLabel[this.language], class: "duet-multiselect-label" }, this.placeholder), this.value && this.value.length > 0 && (hAsync("span", { key: '3dfe64b81ce62342b83ec4ea44bc1a1ec7544355', class: "duet-multiselect-badge" }, this.value.length, hAsync("duet-visually-hidden", { key: '1dbd858425faeae0a323b3313913feec214549cd' }, this.selectedLangObject[this.language], ", ", this.value.map(item => item.label).join(", ")))), hAsync("svg", { key: '40b599d5cfa8362c2edeb63aa59c9be3cecf3e80', class: { "duet-multiselect-icon": true, "duet-multiselect-icon--rotate": this.checkboxesVisible }, fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '6c28e4b2bb0c486a8698fa0615fff12df29e157a', d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" }))), hAsync("div", { key: '6ea881d05fcbdeb899a1eb41b84f8b9653446eb4', id: `${this.identifier}-checkboxes`, role: "listbox", class: {
                 "duet-multiselect-checkboxes": true,
                 "duet-multiselect-checkboxes-active": this.checkboxesVisible,
-            }, "aria-activedescendant": this.activeDescendant, "aria-multiselectable": "true" }, ((_a = this.processedItems) === null || _a === void 0 ? void 0 : _a.length) && this.allControls && (hAsync("div", { key: 'f5c329ddb8ce083aae2aae7f9c9b1837c8b1054c', class: "duet-multiselect-all-control-buttons" }, hAsync("button", { key: '7a0f040a8209539d9dfe60b443470b35cb86066f', class: "duet-multiselect-select-all", onClick: this.handleSelectAllClick, id: this.getOptionIdentifier(-2), onKeyDown: (e) => this.onCheckboxKeyDown(e, -2) }, this.selectAllLabel[this.language]), hAsync("button", { key: 'd2586f52f22ec20c3dca4006497e53252e8cc3c4', class: "duet-multiselect-clear-all", onClick: this.handleClearAllClick, id: this.getOptionIdentifier(-1), onKeyDown: (e) => this.onCheckboxKeyDown(e, -1) }, this.clearAllLabel[this.language]))), this.processedItems &&
+            }, "aria-activedescendant": this.activeDescendant, "aria-multiselectable": "true" }, ((_a = this.processedItems) === null || _a === void 0 ? void 0 : _a.length) && this.allControls && (hAsync("div", { key: '63392964c348477e8b375b96084d4c4cbbf2143a', class: "duet-multiselect-all-control-buttons" }, hAsync("button", { key: 'b7e0f951cd805058fc5ba9376ada31d42dcceb8e', class: "duet-multiselect-select-all", onClick: this.handleSelectAllClick, id: this.getOptionIdentifier(-2), onKeyDown: (e) => this.onCheckboxKeyDown(e, -2) }, this.selectAllLabel[this.language]), hAsync("button", { key: 'a8d826e0afeaf86fbcaa2289f41ffeca9cd04b43', class: "duet-multiselect-clear-all", onClick: this.handleClearAllClick, id: this.getOptionIdentifier(-1), onKeyDown: (e) => this.onCheckboxKeyDown(e, -1) }, this.clearAllLabel[this.language]))), this.processedItems &&
             this.processedGroups.map(group => (hAsync("fieldset", null, group.label && hAsync("legend", null, group.label), group.items.map((item, key) => {
                 var _a, _b;
                 return (hAsync("duet-checkbox", { identifier: this.getOptionIdentifier(key), role: "option", label: item.label, value: item.value, key: item.value, checked: (_a = this.value) === null || _a === void 0 ? void 0 : _a.includes(item), "accessible-selected": ((_b = this.value) === null || _b === void 0 ? void 0 : _b.includes(item)) ? "true" : undefined, disabled: !this.checkboxesVisible || item.disabled, onDuetChange: e => this.toggleCheckbox(e, item), onKeyDown: (e) => this.onCheckboxKeyDown(e, key), theme: this.theme }));
-            })))))), hAsync("span", { key: 'b2c2c04e9e985c1c1215b7d9eb144d202644a293', class: "duet-multiselect-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '9a58aa5c2bc42cc6d7c69b2fa5f616fbddae4703' }, this.error)))));
+            })))))), hAsync("span", { key: '78597a6d044e0186dcb06a22bdb897884e24739e', class: "duet-multiselect-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '6b33900eb2e81a104b8370a520aaf378d18155cf' }, this.error)))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -11743,7 +11793,7 @@ class DuetNav {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'a92a1ddaae09ce96b5e5d11f75b90e890e405494' }, hAsync("div", { key: '5ff997d4da49fc082af18866b7e19ded4d64566c', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: 'e18cbf0c99d69c3457eda1ff7f291161f10547d4' }), hAsync("slot", { key: '70b3b0456c5e4e3307b12ad9a44f87c4861b98a5', name: "mobile" }), hAsync("slot", { key: '2ad5781a32b89b6857505c0bb6bfba2c95422dbe', name: "desktop" }))));
+        return (hAsync(Host, { key: '478d3e1e1531078b464aae5753629362fc516832' }, hAsync("div", { key: 'be95c4c6556145aaa36f8191183fdf8f42e1f67c', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: '1fbc5c81afb252eee8adaf26e7e77108de0995bb' }), hAsync("slot", { key: 'ef5b3ef2e502f1990980ff8d3b4cc487703a76ca', name: "mobile" }), hAsync("slot", { key: 'b50d92d4f5a7f166f66178bf4cf7b03c6aa48692', name: "desktop" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetNavStyle0; }
@@ -11802,11 +11852,11 @@ class DuetNotification {
         this.linkElement.focus(options);
     }
     render() {
-        return (hAsync("div", { key: '96c5142b088c958a661411f3995f673e2ccc621e', role: "listitem", class: {
+        return (hAsync("div", { key: '422e04582691291269942900a1279c343aef0fd6', role: "listitem", class: {
                 "duet-notification": true,
                 "duet-notification-highlight": this.highlight,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("a", { key: 'd6f5d0be1b541438401decc771bc08a479bd8c2a', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, hAsync("div", { key: 'f307a1aa045d07340852369a172d693e6f43cb7d', class: "duet-notification-container" }, hAsync("div", { key: 'a06f1c5ee9ab33826b104403a91b1ed2697f14ce', class: "duet-notification-badge-container" }, this.highlight && (hAsync("div", { key: 'b701ca3d7ab5b4156f79462881fea1c385ad781f', class: "duet-notification-badge" }, hAsync("duet-visually-hidden", { key: 'd6b2303c79e50024cdeb903950c459f20cf312cd' }, this.accessibleLabelUnread, ":")))), hAsync("div", { key: 'aebc83aece0fc83be95be876ad19edbce1fd7b70', class: "duet-notification-content" }, hAsync("slot", { key: 'f26fa683fe898a8e53777d22757a2abef19d8b73' })), hAsync("div", { key: '41600a1ef9c5ad18732f5f1de14a2904b8591fe2', class: "duet-notification-date" }, this.date)))));
+            } }, hAsync("a", { key: 'ca0b58b6e37c962ed94b50f7ec8984b2213f1156', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, hAsync("div", { key: 'dc7f017341005cc24213cdd7bc205e379b8887eb', class: "duet-notification-container" }, hAsync("div", { key: 'a6b105d9df9c08ab0b3080bf80d65c695fe6acd8', class: "duet-notification-badge-container" }, this.highlight && (hAsync("div", { key: '9a65564d31555396c437147ff3f69811c358ff8a', class: "duet-notification-badge" }, hAsync("duet-visually-hidden", { key: 'b37d3a8df717072e9a8b1df03966f7f3874f5b57' }, this.accessibleLabelUnread, ":")))), hAsync("div", { key: 'efedb3045f0522eb5350fd987da79b3247470bdf', class: "duet-notification-content" }, hAsync("slot", { key: '8ccf0b0088d6fe2729948d5bca6fd4b35db7b7d1' })), hAsync("div", { key: 'a752d182e944651bf0c5e6531d992a03acb743b0', class: "duet-notification-date" }, this.date)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetNotificationStyle0; }
@@ -11924,10 +11974,10 @@ class DuetNotificationDrawer {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: '9630eb1dc5e08775957ccac9822cb72c129e524b', class: {
+        return (hAsync("div", { key: '181a6a82f04afb895830cf36e265a4f770f05188', class: {
                 "duet-drawer": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, onKeyDown: this.handleKeyDown }, hAsync("button", { key: '8b07b937da50cf3ad1d3dc447fd1ed96402f251d', ref: el => (this.drawerButtonEl = el), type: "button", class: "duet-drawer-toggle", id: "duet-drawer-toggle", "aria-controls": "duet-drawer-content", "aria-expanded": this.isOpen ? "true" : "false", onClick: this.toggleMenu }, this.icon && (hAsync("div", { key: 'c11b7256d445ad06da88c8b4f58eec225c1ae7d9', class: "duet-drawer-icon" }, hAsync("duet-icon", { key: 'dd2f20c37d01b52572bb4928770cb9259b2c6a50', margin: "none", size: "x-small", name: this.icon, color: "currentColor" }), this.badge && hAsync("div", { key: 'd4da99aeb8bf07b4840ac76ce3d0691be3dedcd2', class: "duet-drawer-badge" }))), hAsync("span", { key: '47c6df40631ba9b0410acf27f88c229d97d31ec9', class: "duet-drawer-label" }, this.label), hAsync("div", { key: 'efa2f3f60ae80b313069e37711bbced9d2a850eb', class: "duet-drawer-caret" }, hAsync("duet-icon", { key: '22a85823a808bf6bdff1342476ed39ef53bc18f3', margin: "none", size: "auto", icon: actionArrowDownSmall.svg, color: "currentColor" }))), hAsync("div", { key: '31645dd77653b2a31b175a527b3c392580904813', id: "duet-drawer-content", class: {
+            }, onKeyDown: this.handleKeyDown }, hAsync("button", { key: 'f4276d12063ff62d10998b80cd7621c3ceadc302', ref: el => (this.drawerButtonEl = el), type: "button", class: "duet-drawer-toggle", id: "duet-drawer-toggle", "aria-controls": "duet-drawer-content", "aria-expanded": this.isOpen ? "true" : "false", onClick: this.toggleMenu }, this.icon && (hAsync("div", { key: '0c1a27d913b2ba53d8f6ef2eef3f0d05c251fabc', class: "duet-drawer-icon" }, hAsync("duet-icon", { key: 'c32b7ae6a90f0d32f0d6b46aad6e9ba0fb0bf952', margin: "none", size: "x-small", name: this.icon, color: "currentColor" }), this.badge && hAsync("div", { key: 'e698da96829cac38cfeab0a15734f3be7a679455', class: "duet-drawer-badge" }))), hAsync("span", { key: '2725ba4970bcc2e6213f69c64d25a3dc7d9f005b', class: "duet-drawer-label" }, this.label), hAsync("div", { key: '71ae5369660c95fed7635cb7d5ae25fa5b9dde7a', class: "duet-drawer-caret" }, hAsync("duet-icon", { key: '1ac223f256804f95ff4a35f8fc115999d86fec8c', margin: "none", size: "auto", icon: actionArrowDownSmall.svg, color: "currentColor" }))), hAsync("div", { key: 'aaa99d0c45b1f8218f0f999c9558f374799dc6a5', id: "duet-drawer-content", class: {
                 "duet-drawer-content": true,
                 "duet-drawer-right": this.direction === "right",
                 "duet-drawer-left": this.direction === "left",
@@ -12388,7 +12438,7 @@ class DuetOverlay {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '44cb99c20a2d966204b1450dabe1e8d06d434874', "aria-hidden": "true" }, hAsync("div", { key: '33d2486952c9756eee5e6b42710aca5763d72134', style: { zIndex: this.zIndex }, class: {
+        return (hAsync(Host, { key: 'b97ad015b5683c5bf102b82383615099b3c3c8e5', "aria-hidden": "true" }, hAsync("div", { key: 'c41a21343f6350020a9deb5c1208aed416714531', style: { zIndex: this.zIndex }, class: {
                 "duet-overlay": true,
                 "duet-theme-turva": this.theme === "turva",
                 "keep-stacking-context": this.keepStackingContext,
@@ -12447,12 +12497,12 @@ class DuetPageHeading {
      */
     render() {
         const layout = this.layout === "narrow" ? "narrow" : this.layout === "fluid" ? "fluid" : "auto";
-        return (hAsync("div", { key: '9f8446416ddfb863e8b7675694a941c8a5a08810', class: {
+        return (hAsync("div", { key: '9d96b26d203b8d57c0869d095572ec670ac5118f', class: {
                 "duet-page-heading": true,
                 "duet-theme-turva": this.theme === "turva",
                 "has-icon": !!this.icon,
                 [layout]: true,
-            } }, hAsync("div", { key: 'd2c79bf4b43476d774997990f9ff2eb10bd5c5eb', class: "background" }, this.theme === "turva" && hAsync("div", { key: '5f2cd53a57c83e72eea3cd6c8e05440282de604d', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: '5d076b45bd423d3ac5c829fb75e02310fc2de935', class: "brand-shape" }), this.theme !== "turva" && hAsync("div", { key: '95f49a37ec75c6aeb261291ab21bcbf78c182d51', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: 'd7d88d2a72ea954d7b60a657e04df7af66e47f0f', class: "brand-shaped-icon" }, hAsync("duet-icon", { key: '1b7e9dfb264e9d9442b5b4aa76fc86868586290c', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: 'acca7abdb93a35bea48f112af238f61993dd1b1c', class: "heading" }, hAsync("slot", { key: 'd236024e713e2924eabcd18e18260b348cd4dc53', name: "heading" }))));
+            } }, hAsync("div", { key: 'ccae0c1de7c79e9af8be98af89e5e98624a8cfe3', class: "background" }, this.theme === "turva" && hAsync("div", { key: '3b1579dc4acdc50baf1bec8cc5e9fc82c4380807', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: '987fd998a596513fd8c3c5de61d6d24b6b44b504', class: "brand-shape" }), this.theme !== "turva" && hAsync("div", { key: 'b1ba4eae34659ef4662ad34bbb93fd46139a159c', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: 'dfb95409b76b02cde19eecaaaef50a9c618ffc51', class: "brand-shaped-icon" }, hAsync("duet-icon", { key: 'decdcbde482844fbb493010ff2e7fbd9a26c83a7', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: '0dc922a094e4f7d0e1b68d7e72675ec83ed14e1d', class: "heading" }, hAsync("slot", { key: 'f1922d4f41d344867b4c336faaf1acbf94b3b4d0', name: "heading" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPageHeadingStyle0; }
@@ -12805,32 +12855,32 @@ class DuetPagination {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '238ac01f83f3e796534c0ef17857631a329f6a42', onKeyDown: e => this.onKeyboardDown(e), class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("nav", { key: '2db66f288ef50d588016e131d548b22a77f99dd6', role: "navigation", "aria-labelledby": this.accessibleLabelledBy ? `${this.accessibleLabelledBy} ${this.listId}` : this.listId, "aria-describedby": this.accessibleDescribedBy ? `${this.accessibleDescribedBy} ${this.listId}` : this.listId, "aria-descriptions": this.accessibleDescription, "aria-details": this.accessibleDetails, ref: el => (this.nativeNav = el), "aria-controls": this.ariaControls, class: {
+        return (hAsync(Host, { key: '756ad0511064e85742b3bb271bdd2a468f3f1eb0', onKeyDown: e => this.onKeyboardDown(e), class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("nav", { key: '4d235370cef9fc2b6d9448b2b02a02eefc04b97b', role: "navigation", "aria-labelledby": this.accessibleLabelledBy ? `${this.accessibleLabelledBy} ${this.listId}` : this.listId, "aria-describedby": this.accessibleDescribedBy ? `${this.accessibleDescribedBy} ${this.listId}` : this.listId, "aria-descriptions": this.accessibleDescription, "aria-details": this.accessibleDetails, ref: el => (this.nativeNav = el), "aria-controls": this.ariaControls, class: {
                 "duet-pagination-nav": true,
                 [`duet-pagination-variation-${this.variation}`]: true,
-            } }, this.numbersStore !== "" && (hAsync("div", { key: '4c03feef0a35eaa9ec13e5c3d5103ae1facbd832', "aria-live": "assertive", "aria-relevant": "text", class: "duet-pagination-overlay", "aria-label": `${this.accessibleLabels.jump_to} ${this.numbersStore}`, part: "navigation-overlay" }, hAsync("duet-badge", { key: '6ac1a80080fe006f2c576999b9ef0718c6339a04', theme: this.theme }, "jump to page : ", this.numbersStore))), hAsync("ol", { key: '0ebf21ab341811673ea978e22a085cba7eaaf75c', id: this.listId, class: {
+            } }, this.numbersStore !== "" && (hAsync("div", { key: '4e98bb73d78c7cb713ac1de78d9d5ccbdce1687d', "aria-live": "assertive", "aria-relevant": "text", class: "duet-pagination-overlay", "aria-label": `${this.accessibleLabels.jump_to} ${this.numbersStore}`, part: "navigation-overlay" }, hAsync("duet-badge", { key: '9d16f94604abbcfbbd8b538395e46c024b88c0a2', theme: this.theme }, "jump to page : ", this.numbersStore))), hAsync("ol", { key: '7bbec70a660779cabba7847dd76732e9bfb71f1b', id: this.listId, class: {
                 "duet-pagination": true,
                 "duet-pagination-is-dimmed": this.numbersStore !== "",
-            }, role: "menubar", "aria-label": this.accessibleLabels.pagination_label, "aria-description": this.accessibleLabels.description }, (this.variation === "compact" || this.matchesCompactBreakpoint) && (hAsync("li", { key: '63a2904ccc7d0c008332625069c9083610c471ab', class: {
+            }, role: "menubar", "aria-label": this.accessibleLabels.pagination_label, "aria-description": this.accessibleLabels.description }, (this.variation === "compact" || this.matchesCompactBreakpoint) && (hAsync("li", { key: '974c29ddf4de1b7aca6e24f289be9fbb4177eb56', class: {
                 "duet-pagination-page-button": true,
                 "duet-pagination-button-first": true,
-            }, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: 'fd709f59213de7f819c05b997b84d8ed39ec4566', disabled: (this.internalSectionIndex === 0 && this.current <= 1) || this.disabled, "data-direction": "back", accessibleLabel: this.accessibleLabels.first_page, title: this.accessibleLabels.first_page, onClick: e => this.jumpToStart(e), "icon-name": "action-move-to-first", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[0] : undefined }))), hAsync("li", { key: '7000cadb2b9214ac7e460fc9df1893017243aba5', class: {
+            }, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: 'd8fd5f3a859d470c11c15ae197313cc6c8983fc2', disabled: (this.internalSectionIndex === 0 && this.current <= 1) || this.disabled, "data-direction": "back", accessibleLabel: this.accessibleLabels.first_page, title: this.accessibleLabels.first_page, onClick: e => this.jumpToStart(e), "icon-name": "action-move-to-first", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[0] : undefined }))), hAsync("li", { key: 'c03e92b8f6ba758dd49e881380c964c87f155dcc', class: {
                 "duet-pagination-page-button": true,
                 "duet-pagination-button-first": true,
-            }, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: 'a1fbc90286ef69e26c2050f5dd1e77cfd5f8496d', disabled: !!((this.internalSectionIndex === 0 && this.current <= 1) ||
+            }, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: '71b346d9a35b397951223fb32bdd449441dab0bf', disabled: !!((this.internalSectionIndex === 0 && this.current <= 1) ||
                 (this.current <= 1 && this.processedPageLinks) ||
-                this.disabled), "data-direction": "back", onClick: e => this.onMouseHandler(e, -1), "accessible-label": this.accessibleLabels.previous_page, title: this.accessibleLabels.previous_page, "icon-name": "action-arrow-left-small", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.current - 2] : undefined })), this.internalSectionIndex !== 0 && this.shouldDisplayNavigation() && (hAsync(Fragment, { key: '6c3b28e93bf637ceeb7c58fc743f381ef1db509c' }, hAsync("li", { key: '33f0f34c511b50fd228ea44bf6f4feb408ede264', class: "duet-pagination-item", role: "menuitem", part: "navigation-jump" }, hAsync("duet-button", { key: '746eb995e69baaf75b731923c1827a995fc2cc3a', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-jump-back", "center-text": "true", variation: "plain", color: this.theme !== "turva" ? "secondary" : "secondary-turva", margin: "none", accessibleLabel: this.accessibleLabels.first_page, onClick: e => this.jumpToStart(e), theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[0] : undefined }, hAsync("div", { key: '067f6fb84943bf3f448f0474041ae821871fb8a2', class: "duet-pagination-page-number" }, "1"))), hAsync("li", { key: 'd8a1df197cee21fe581338838587bbdb8800d874', class: "duet-pagination-item", role: "menuitem", part: "navigation-section" }, hAsync("duet-button", { key: '464fc5efe12433ea2ba6d3c287ecb5e2110626d8', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-dots-back", "center-text": "true", color: this.theme !== "turva" ? "secondary" : "secondary-turva", variation: "plain", margin: "none", accessibleLabel: this.accessibleLabels.prev_section.replace("{0}", `${this.visibleItems}`), onClick: e => this.sectionClickHandler(e, -1), theme: this.theme }, hAsync("div", { key: '0c6467cfe44e34a16fcb222040ad894f4733a799', class: "duet-pagination-page-number", "aria-hidden": "true" }, "\u2026"))))), (this.shouldDisplayNavigation() && this.renderPageNumbers()) || this.renderSelect(), (this.internalSectionIndex + 1) * this.visibleItems < this.totalPages &&
-            this.shouldDisplayNavigation() && (hAsync(Fragment, { key: '0bc436817f1dcb0fddc29e58e55b41b0829969ed' }, (this.internalSectionIndex + 1) * this.visibleItems !== this.totalPages - 1 && (hAsync("li", { key: 'acaac82b2aa83002ea653aa9cad50488124405ec', class: "duet-pagination-item", role: "menuitem", part: "navigation-section" }, hAsync("duet-button", { key: '4bb24fe4575b9bd1673a51413d40826be404c6b7', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-dots-forward", "center-text": "true", color: this.theme !== "turva" ? "secondary" : "secondary-turva", variation: "plain", margin: "none", accessibleLabel: this.accessibleLabels.next_section.replace("{0}", `${this.visibleItems}`), onClick: e => this.sectionClickHandler(e, 1), theme: this.theme }, hAsync("div", { key: 'e044660e2a3ece57534cdf03382241a986c319a9', class: "duet-pagination-page-number", "aria-hidden": "true" }, "\u2026")))), hAsync("li", { key: 'ec2abf76d2fec68bf91289013be139ba4348ed0a', class: "duet-pagination-item", role: "menuitem", part: "navigation-jump" }, hAsync("duet-button", { key: '06dec4fc55486effcff9f16fe9118e4e920edd66', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-jump-forward", "center-text": "true", color: this.theme !== "turva" ? "secondary" : "secondary-turva", variation: "plain", margin: "none", accessibleLabel: this.accessibleLabels.last_page, onClick: e => this.jumpToEnd(e), theme: this.theme, url: this.processedPageLinks
+                this.disabled), "data-direction": "back", onClick: e => this.onMouseHandler(e, -1), "accessible-label": this.accessibleLabels.previous_page, title: this.accessibleLabels.previous_page, "icon-name": "action-arrow-left-small", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.current - 2] : undefined })), this.internalSectionIndex !== 0 && this.shouldDisplayNavigation() && (hAsync(Fragment, { key: '142ba228678916f8f9a69de0c8f38430c6db7623' }, hAsync("li", { key: '6e2370fdf3f65c69d30ccee081b6426c12267a11', class: "duet-pagination-item", role: "menuitem", part: "navigation-jump" }, hAsync("duet-button", { key: '887ee7242f007578beb3b1a59702ab619d0a7e5e', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-jump-back", "center-text": "true", variation: "plain", color: this.theme !== "turva" ? "secondary" : "secondary-turva", margin: "none", accessibleLabel: this.accessibleLabels.first_page, onClick: e => this.jumpToStart(e), theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[0] : undefined }, hAsync("div", { key: '0b5d04b555f074972abcc93a70a0d80bdadabcd4', class: "duet-pagination-page-number" }, "1"))), hAsync("li", { key: '3cbe3bbf9ef3406f2a98aa736f692aaf87119857', class: "duet-pagination-item", role: "menuitem", part: "navigation-section" }, hAsync("duet-button", { key: '462643a69aeecc463a23ba22f0bf79ea8c4456c3', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-dots-back", "center-text": "true", color: this.theme !== "turva" ? "secondary" : "secondary-turva", variation: "plain", margin: "none", accessibleLabel: this.accessibleLabels.prev_section.replace("{0}", `${this.visibleItems}`), onClick: e => this.sectionClickHandler(e, -1), theme: this.theme }, hAsync("div", { key: 'fa748ff5b134b6a0a3a4550f0073fbf45baf2337', class: "duet-pagination-page-number", "aria-hidden": "true" }, "\u2026"))))), (this.shouldDisplayNavigation() && this.renderPageNumbers()) || this.renderSelect(), (this.internalSectionIndex + 1) * this.visibleItems < this.totalPages &&
+            this.shouldDisplayNavigation() && (hAsync(Fragment, { key: '0459e62e54d351fa5f22afa7afb3a3a6027df6c1' }, (this.internalSectionIndex + 1) * this.visibleItems !== this.totalPages - 1 && (hAsync("li", { key: 'fb76ad813a83768da7a52230342170198efc321d', class: "duet-pagination-item", role: "menuitem", part: "navigation-section" }, hAsync("duet-button", { key: '14b9164e41b63d0adbbfe5ef29074a46695a44d6', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-dots-forward", "center-text": "true", color: this.theme !== "turva" ? "secondary" : "secondary-turva", variation: "plain", margin: "none", accessibleLabel: this.accessibleLabels.next_section.replace("{0}", `${this.visibleItems}`), onClick: e => this.sectionClickHandler(e, 1), theme: this.theme }, hAsync("div", { key: '551f91a348760b5101e88adc3a3d8a3d692fc804', class: "duet-pagination-page-number", "aria-hidden": "true" }, "\u2026")))), hAsync("li", { key: '454ccc661d104be10d0a3908fa7516e1f627fb57', class: "duet-pagination-item", role: "menuitem", part: "navigation-jump" }, hAsync("duet-button", { key: '01eeca39b9de17e25c39ffec6296c26920b86380', disabled: this.disabled, class: "duet-pagination-link duet-pagination-link-jump-forward", "center-text": "true", color: this.theme !== "turva" ? "secondary" : "secondary-turva", variation: "plain", margin: "none", accessibleLabel: this.accessibleLabels.last_page, onClick: e => this.jumpToEnd(e), theme: this.theme, url: this.processedPageLinks
                 ? this.processedPageLinks[this.processedPageLinks.length - 1]
-                : undefined }, hAsync("div", { key: 'd92331de76576b275c1189fce2634abf12f49eb7', class: "duet-pagination-page-number" }, this.totalPages))))), hAsync("li", { key: 'ba8c5fa8c6a228e7585c1d6bd0a913b92174b7dd', class: {
+                : undefined }, hAsync("div", { key: 'f4c0ca8a738f21233a966611c8ce15d7f776c7d7', class: "duet-pagination-page-number" }, this.totalPages))))), hAsync("li", { key: '3dc850213f9f9c7aac8cabba1901740d6068cdde', class: {
                 "duet-pagination-page-button": true,
                 "duet-pagination-button-last": true,
-            }, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: 'fb7c84dfeda7e02cd891269391b07cefaaa1a4e4', disabled: !!((this.current === this.totalPages &&
+            }, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: 'ddf5b89fac538ccdae84e031bea7a2830f656bc0', disabled: !!((this.current === this.totalPages &&
                 this.internalSectionIndex === Math.ceil(this.totalPages / this.visibleItems) - 1) ||
-                (this.current === this.totalPages && this.processedPageLinks)) || this.disabled, class: "duet-date-dialog-next", "accessible-label": this.accessibleLabels.next_page, title: this.accessibleLabels.next_page, onClick: e => this.onMouseHandler(e, 1), "icon-name": "action-move-to-next", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.current] : undefined })), (this.variation === "compact" || this.matchesCompactBreakpoint) && (hAsync("li", { key: '45f6d91ce4a38bc672c600b11ce700a383154d0b', class: {
+                (this.current === this.totalPages && this.processedPageLinks)) || this.disabled, class: "duet-date-dialog-next", "accessible-label": this.accessibleLabels.next_page, title: this.accessibleLabels.next_page, onClick: e => this.onMouseHandler(e, 1), "icon-name": "action-move-to-next", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.current] : undefined })), (this.variation === "compact" || this.matchesCompactBreakpoint) && (hAsync("li", { key: '78c2482a7d36358e53000e55c19057c2b4585165', class: {
                 "duet-pagination-page-button": true,
                 "duet-pagination-button-last": true,
-            }, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: '0168ec664180f13c8ed94f258cc24277c46daa32', disabled: (this.current === this.totalPages &&
+            }, role: "menuitem", part: "navigation-arrow" }, hAsync("duet-action-button", { key: '330747e12a1e3d8bc0fb74f3945d99c06d8132d0', disabled: (this.current === this.totalPages &&
                 this.internalSectionIndex === Math.ceil(this.totalPages / this.visibleItems) - 1) ||
                 this.disabled, accessibleLabel: this.accessibleLabels.last_page, title: this.accessibleLabels.last_page, onClick: e => this.jumpToEnd(e), "icon-name": "action-move-to-last", theme: this.theme, url: this.processedPageLinks ? this.processedPageLinks[this.totalPages - 1] : undefined })))))));
     }
@@ -12904,7 +12954,7 @@ class DuetParagraph {
         const color = getColorByName(this.color);
         // aria-describedby is to fix accessibility issue in Chrome where duet-paragraphs
         // are not announced when placed inside duet-modal
-        return (hAsync(Host, { key: '15e61ed3ba7f3ce62cf3ecd38fd313875b3b49b4', "aria-describedby": this.id }, hAsync("p", { key: '9f2c19ee2b3fb5693d56e5359ef2d059b1a1349c', id: this.id, class: {
+        return (hAsync(Host, { key: 'e9f8164c6795c950d1f1340cc8a723113f2e231a', "aria-describedby": this.id }, hAsync("p", { key: '87942327cc0a685a6d1435adc090b8c0aa5c54ac', id: this.id, class: {
                 "duet-paragraph": true,
                 "duet-paragraph-small": this.size === "small",
                 "duet-paragraph-semi-bold": this.weight === "semi-bold",
@@ -12912,7 +12962,7 @@ class DuetParagraph {
                 "duet-m-0": this.margin === "none",
                 [this.variation]: true,
                 "duet-theme-turva": this.theme === "turva",
-            }, style: { color }, part: "duet-paragraph" }, hAsync("slot", { key: 'a6e89e000ca0cfbdfc22a2fc3dae50c3e38ff284' }))));
+            }, style: { color }, part: "duet-paragraph" }, hAsync("slot", { key: '858b0de4a678c0320e76f1479d7e9a7202a749ac' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetParagraphStyle0; }
@@ -14292,7 +14342,9 @@ class DuetPopupMenu {
                 const button = element;
                 button.accessiblePopup = "true";
                 button.accessibleExpanded = false;
-                button.setAttribute("trailing-icon", "action-arrow-down-small");
+                if (this.controllerIcon) {
+                    button.setAttribute("trailing-icon", "action-arrow-down-small");
+                }
                 this.openButton = button;
             }
             catch (_e) { }
@@ -14329,6 +14381,7 @@ class DuetPopupMenu {
         this.position = "absolute";
         this.mainAxisOffset = 0;
         this.crossAxisOffset = 0;
+        this.controllerIcon = "action-arrow-down-small";
     }
     /**
      * Component lifecycle events.
@@ -14347,7 +14400,9 @@ class DuetPopupMenu {
     disconnectedCallback() {
         if (this.openButton) {
             this.openButton.removeEventListener("click", this.openButtonEventListener);
-            this.openButton.removeAttribute("trailing-icon");
+            if (this.controllerIcon) {
+                this.openButton.removeAttribute("trailing-icon");
+            }
         }
     }
     /**
@@ -14451,7 +14506,9 @@ class DuetPopupMenu {
             if (this.openButton) {
                 this.openButton.accessibleExpanded = true;
             }
-            this.teleport.makeSiblingsInert();
+            if (this.accessibleRole !== "listbox") {
+                this.teleport.makeSiblingsInert();
+            }
             this.updatePlacement();
             setTimeout(() => {
                 if (this.accessibleRole === "menu") {
@@ -14469,7 +14526,9 @@ class DuetPopupMenu {
                     this.focusOpenButton();
                 }
                 this.duetToggle.emit({ open: this.open, component: "duet-popup-menu" });
-                this.teleport.removeInertFromSiblings();
+                if (this.accessibleRole !== "listbox") {
+                    this.teleport.removeInertFromSiblings();
+                }
             }, 200);
         }
     }
@@ -14491,12 +14550,15 @@ class DuetPopupMenu {
         return -1;
     }
     render() {
-        const positionStyles = {
+        const styles = {
             top: `${this.menuY}px`,
             left: `${this.menuX}px`,
             position: this.position,
+            overflowY: "auto",
         };
-        return (hAsync(Host, { key: 'dbd5d6ba344124704ad5798622aeed8e2f1edb1b' }, hAsync("div", { key: 'a59dd98042f84b7460956b4b94870691f7af399e', ref: element => (this.menuElement = element), style: positionStyles, class: { open: this.open, "duet-popup-menu-list": true, "duet-theme-turva": this.theme === "turva" }, role: this.accessibleRole, "aria-label": this.accessibleLabel }, hAsync("slot", { key: '2a0d9c72cc78e95918685a0b13f9c184d352867e' }))));
+        return (hAsync(Host, { key: '389d4d1b46db081d29a7fa8d57fd65f9c113f7a9' }, hAsync("div", { key: '8d5e47a1dac1f4a7b17aed4aa69afed4cfa44a39', ref: element => {
+                this.menuElement = element;
+            }, style: styles, class: { open: this.open, "duet-popup-menu-list": true, "duet-theme-turva": this.theme === "turva" }, role: this.accessibleRole, "aria-label": this.accessibleLabel }, hAsync("slot", { key: '09fc711a6dc838d9e345a694c5e45c09a01bf4ed' }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -14518,6 +14580,7 @@ class DuetPopupMenu {
             "position": [1025],
             "mainAxisOffset": [2, "main-axis-offset"],
             "crossAxisOffset": [2, "cross-axis-offset"],
+            "controllerIcon": [1, "controller-icon"],
             "open": [32],
             "menuY": [32],
             "menuX": [32],
@@ -14532,7 +14595,7 @@ class DuetPopupMenu {
     }; }
 }
 
-const duetPopupMenuItemCss = "*,*::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;display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start}.duet-popup-menu-item{display:flex;flex-grow:1;gap:12px;align-items:center;height:100%;padding:8px;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(0, 41, 77);text-align:left;text-decoration:none;cursor:pointer}.duet-popup-menu-item:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-popup-menu-item:focus,.duet-popup-menu-item:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-popup-menu-item.duet-theme-turva{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-popup-menu-item.active{background:rgb(243, 249, 252)}.duet-popup-menu-item.active.duet-theme-turva{background:rgb(245, 245, 247)}.duet-popup-menu-item:hover{background:rgb(230, 242, 248)}.duet-popup-menu-item:hover.duet-theme-turva{background:rgb(228, 228, 230)}.duet-popup-menu-item .duet-popup-menu-item-label{flex-grow:1}.duet-popup-menu-item .duet-popup-menu-item-trailing{padding-left:20px}";
+const duetPopupMenuItemCss = "*,*::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;display:flex;flex-direction:row;gap:8px;align-items:center;justify-content:flex-start}.duet-popup-menu-item{display:flex;flex-grow:1;gap:12px;align-items:center;height:100%;padding:8px;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(0, 41, 77);text-align:left;text-decoration:none;cursor:pointer}.duet-popup-menu-item:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-popup-menu-item:focus,.duet-popup-menu-item:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-popup-menu-item.duet-theme-turva{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-popup-menu-item.active{background:rgb(243, 249, 252)}.duet-popup-menu-item.active.duet-theme-turva{background:rgb(245, 245, 247)}.duet-popup-menu-item:hover{background:rgb(230, 242, 248)}.duet-popup-menu-item:hover.duet-theme-turva{background:rgb(228, 228, 230)}.duet-popup-menu-item .duet-popup-menu-item-label{flex-grow:1}.duet-popup-menu-item .duet-popup-menu-item-trailing{padding-left:20px}.active-descendant{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .active-descendant,.active-descendant.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}";
 var DuetPopupMenuItemStyle0 = duetPopupMenuItemCss;
 
 class DuetPopupMenuItem {
@@ -14572,6 +14635,7 @@ class DuetPopupMenuItem {
         this.trailingIcon = undefined;
         this.trailingText = undefined;
         this.active = false;
+        this.activeDescendant = false;
     }
     /**
      * Component lifecycle events.
@@ -14597,8 +14661,9 @@ class DuetPopupMenuItem {
             "duet-popup-menu-item": true,
             active: this.active,
             "duet-theme-turva": this.theme === "turva",
+            "active-descendant": this.activeDescendant,
         };
-        return (hAsync(Host, { key: '35289f7f89fa2e759761d2b5309c1c50903cde81', role: this.accessibleRole }, hAsync(TagName, { key: 'dd0cb6088ab305ed97ff28598ca5424893c71aab', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "menuitem" ? -1 : 0, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (hAsync("duet-icon", { key: 'b877792e8c47959bfa240713f74a510930630cdf', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), hAsync("span", { key: '99d5337b72c8aa36a6ae2962e4112cf0158ea3e2', class: "duet-popup-menu-item-label" }, hAsync("slot", { key: 'ca46da07ce9fdd7e9a080a1f592b213dac6e7ede' })), (this.trailingIcon || this.active) && (hAsync("duet-icon", { key: '22bdf49aaed6e82113dd096de1e8f6c730034c3c', name: this.active ? "messaging-checked-small" : this.trailingIcon, size: this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && hAsync("span", { key: '3ab96002796300ed841354ad491ec77c99be97b5', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
+        return (hAsync(Host, { key: 'e53141f7390844d3bd55d5204d7dac9334248fdc', role: this.accessibleRole }, hAsync(TagName, { key: '73fe7bb5b8cc6fa57b12e0d210edc4ef25dd401b', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "menuitem" || "option" ? -1 : 0, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (hAsync("duet-icon", { key: '3fd892272f52814da4c8f14ea7bec580a160e858', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), hAsync("span", { key: '51b7da7f29ef0f85344e02b1a85aa185bca9b26a', class: "duet-popup-menu-item-label" }, hAsync("slot", { key: '9a72c7fcaeeafe89741760d84c91382b31ab798f' })), (this.trailingIcon || this.active) && (hAsync("duet-icon", { key: '1ddf8f956adbe24208d16c33fe28fde167babcb2', name: this.active ? "messaging-checked-small" : this.trailingIcon, size: this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && hAsync("span", { key: '30aa34505231dbe1a78af9256920294e967a559a', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPopupMenuItemStyle0; }
@@ -14618,6 +14683,7 @@ class DuetPopupMenuItem {
             "trailingIcon": [1, "trailing-icon"],
             "trailingText": [1, "trailing-text"],
             "active": [1028],
+            "activeDescendant": [4, "active-descendant"],
             "focus": [32],
             "setFocus": [64],
             "isFocused": [64]
@@ -14752,12 +14818,12 @@ class DuetPromoCard {
             backgroundColor: backgroundColor ? backgroundColor : "none",
         };
         const TagName = this.url ? "a" : "div";
-        return (hAsync(Host, { key: 'c4abd3dcbfce62f8d79b4948d6877b88035b799d', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: '0a0cb04c17ed4fb89fb540be922681b117385e58', class: {
+        return (hAsync(Host, { key: 'b73cdd4f3dcd554706a13aeaa706543b681529ec', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: '76f17c86f64af2cea4a60ce9882f8e76bc475ab6', 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: '103edb4446ea96b3fafcf007f4dd5426d76a3bf8', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { key: 'cad7f76340247352ca42807969ba24731378fab4', class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { key: 'f388d58abec244fffea258a4a347213c55a110ba', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: 'ee1e4ca580ec8d513309964e6df6baba25ed23d7', class: "pre-heading" }, hAsync("slot", { key: '861cb83e332ce81f0b60f2936f21c08011cd3a2c', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: '728983cfce0b1c8f845a8003d89567a07ed19403', class: "heading" }, hAsync("duet-heading", { key: '9939b4871591c4e9d0beabffc3b6ff7461760103', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, hAsync("span", { key: 'db91646994b5b78998e63025cbdf05555a9ca4ba' }, hAsync("slot", { key: 'c34869098de09a738c6c0c58e9a2c3c0c87d9aae', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: 'e4ffd1e72292e51750c1ce63c43a7c8cb7886258', class: "description" }, hAsync("duet-paragraph", { key: 'b945d624bea9304f8b106d71f87e9bf002603b84', theme: this.theme, margin: "none", color: this.textColor }, hAsync("span", { key: '683854299aa779f9482ecb786f9a51be703076b4' }, hAsync("slot", { key: '517f9561d2283fca8f78441392e2f5ad16b9c4a5', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: 'f7eb0d7f9dd83178e0ca0e05bb9cc7a8b719e102', class: "action" }, hAsync("slot", { key: 'faee8e1a520ff2b41717d43a356dfb0659391506', name: "action" }))))))));
+            }, style: bannerStyles }, hAsync(TagName, { key: 'db345f3d904fc72e3f25618c91ab3f30a0b9e4c7', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { key: 'ac5645fb64cf5872e0735ce3d97939e37fb10f0a', class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { key: 'c82dc662a938ca4849089a048c57caa8efc54531', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: 'cd9ce432bdf6f8ffaa63796a258837e9136e1ea4', class: "pre-heading" }, hAsync("slot", { key: '257b9408b4489f1cc79f503473a8d458a3cb5456', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: '1e93652845c4b65d0ab67a0e05889304064fd7b3', class: "heading" }, hAsync("duet-heading", { key: '9e40a46f24aadcee4d43fc36167ed434c2cc8e79', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, hAsync("span", { key: 'd230dbaecd853de2b4b58be416d720048b6ea43b' }, hAsync("slot", { key: '1f99efac6f9a6ebdf6e72066b50d3fe647dfc3f1', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: 'e61cf4abe59d58e15cefb7f7ff7aa573922154b0', class: "description" }, hAsync("duet-paragraph", { key: '9594eba29974b0176a2fc986df802c8a5afb43f1', theme: this.theme, margin: "none", color: this.textColor }, hAsync("span", { key: 'e800d7bb777802912b16ad4f5c76bb7f9df8c9fe' }, hAsync("slot", { key: '709d27fb9d198c57c8ca8abbbaaedac0790483a8', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: '2a72594c99d4142f7b1f453df4e24ce794833370', class: "action" }, hAsync("slot", { key: '07f8ccc33355d4fc7be72c64fd758363f76f609e', name: "action" }))))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPromoCardStyle0; }
@@ -15364,10 +15430,10 @@ class DuetRangeStepper {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: '445012532d2a6b852f7d08b13eb99611532fe3d3', class: {
+        return (hAsync("div", { key: '43d93bf62ed3c3b091933da841d015662b158e50', class: {
                 "duet-range-stepper": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, hAsync("span", { key: '1f5877f95b12a10e3abf60bd7e27af705738bca6', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), hAsync("duet-action-button", { key: '586bd002d9344e99cf366a49e5d2144ac06e66fe', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), hAsync("duet-action-button", { key: '96fff336833646be477a30c639d8674b27f168d1', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
+            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, hAsync("span", { key: '0eb7fa8f8e1f5853a16c85f8d9670c70d531f13a', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), hAsync("duet-action-button", { key: 'b89f2b93dfe5a510bf6acbdf30ce694ff1ac59dc', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), hAsync("duet-action-button", { key: 'a9d84ec5096ae382828ee82ba75bd558b08d49ea', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -15596,21 +15662,21 @@ class DuetScrollable {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '3b54a0e0a539b3669e6b960b63d4db530828a6d3', class: {
+        return (hAsync(Host, { key: '6a2f3a6f4036a13721ebcfbb3bb25b8643158e56', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
-            } }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: 'c99af39d9c1b2c6ddd640a5517c9aba227b374d0', class: {
+            } }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: '4bb215f5191f36166ecd690b990d98d8b5734924', class: {
                 collapse: true,
                 hide: !this.needsScrolling && !this.collapsed,
-            } }, hAsync("duet-button", { key: '232d85eeb640f814572de158f1a54643a0c4e728', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: 'd1797003948509cbc143a4b0dfea35972007e5ad', name: "collapse-button-label" })))), hAsync("div", { key: '0f5f7e114c90cb2dedeaefc7d14cb2d53f4dab3f', class: {
+            } }, hAsync("duet-button", { key: '5613531c8bf0412aa04c37ae90faa516b16b30ac', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: 'fce3a449acdf28e2a89942dc6a9acc436e457656', name: "collapse-button-label" })))), hAsync("div", { key: '39a8fc136ad07b789f6bfdd6901c1e806744a059', class: {
                 "duet-scrollable-items": true,
                 buttons: this.buttons,
                 center: this.center,
-            } }, this.buttons && this.renderButton("left"), this.renderFadeOverlay("left"), hAsync("div", { key: '1af5b1b3ec4fa3e357540d6660f7f820a8c78a87', class: {
+            } }, this.buttons && this.renderButton("left"), this.renderFadeOverlay("left"), hAsync("div", { key: 'c3929264d3c94505dd43827593f1702671629427', class: {
                 "duet-scrollable-list": true,
                 collapsed: this.collapsed,
                 [`duet-overflow-padding--${this.padding}`]: this.padding !== "none",
-            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: '1865d32a0479ba27dbd8afcdc7e9397f5d649600' })), this.renderFadeOverlay("right"), this.buttons && this.renderButton("right"))));
+            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: '3b0b1fde6ad0500b0bf893c4b4e8ae3ac90c426b' })), this.renderFadeOverlay("right"), this.buttons && this.renderButton("right"))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -15640,7 +15706,7 @@ class DuetScrollable {
     }; }
 }
 
-const duetSectionLayoutCss = "*,*::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;display:block;flex:1 0 auto;width:100%}:host(.duet-middle){display:flex}:host(.duet-middle) .duet-layout{padding:36px 28px !important}@media (min-width: 36em){:host(.duet-middle) .duet-layout{padding:48px 36px !important}}@media (min-width: 62em){:host(.duet-middle) .duet-layout{padding:56px !important}}:host(.duet-ie){height:100%}:host(.duet-middle.duet-ie){height:auto}.duet-layout{position:relative;padding:0 16px;margin:48px auto 36px;overflow-x:clip}@media (max-width: 20.5em){.duet-layout.padding-xxx-small{padding:0}}@media (max-width: 22.5em){.duet-layout.padding-xx-small{padding:0}}@media (max-width: 35.9375em){.duet-layout.padding-x-small{padding:0}}@media (min-width: 36em){.duet-layout.padding-small{padding:0}}@media (min-width: 48em){.duet-layout.padding-medium{padding:0}}@media (min-width: 62em){.duet-layout.padding-large{padding:0}}@media (min-width: 64.0625em){.duet-layout.padding-x-large{padding:0}}@media (min-width: 76.25em){.duet-layout.padding-xx-large{padding:0}}@media (min-width: 106.25em){.duet-layout.padding-xxx-large{padding:0}}@media (min-width: 36em){.duet-layout{margin-top:72px}}.duet-layout.duet-m-0{margin-top:0 !important;margin-bottom:0 !important}@media (min-width: 36em){.duet-layout{padding:0 28px}}@media (min-width: 62em){.duet-layout{display:flex;flex-direction:row;padding:0 56px;margin-bottom:48px}}@media (min-width: 76.25em){.duet-layout{max-width:1110px;padding:0}}.duet-main{display:block;width:100%}@media (min-width: 62em){.duet-main{min-width:600px;margin:0 auto}.has-sidebar .duet-main{max-width:734px;margin-right:20px}}";
+const duetSectionLayoutCss = "*,*::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;display:block;flex:1 0 auto;width:100%}:host(.duet-middle){display:flex}:host(.duet-middle) .duet-layout{padding:36px 28px !important}@media (min-width: 36em){:host(.duet-middle) .duet-layout{padding:48px 36px !important}}@media (min-width: 62em){:host(.duet-middle) .duet-layout{padding:56px !important}}:host(.duet-ie){height:100%}:host(.duet-middle.duet-ie){height:auto}.duet-layout-wrapper{display:block;margin:48px 0 36px;overflow-x:clip}@media (min-width: 36em){.duet-layout-wrapper{margin-top:72px}}@media (min-width: 62em){.duet-layout-wrapper{margin-bottom:48px}}.duet-layout-wrapper.duet-m-0{margin-top:0 !important;margin-bottom:0 !important}.duet-layout-wrapper>*{width:100%}.duet-layout{position:relative;padding:0 16px;margin:0 auto}@media (max-width: 20.5em){.duet-layout.padding-xxx-small{padding:0}}@media (max-width: 22.5em){.duet-layout.padding-xx-small{padding:0}}@media (max-width: 35.9375em){.duet-layout.padding-x-small{padding:0}}@media (min-width: 36em){.duet-layout.padding-small{padding:0}}@media (min-width: 48em){.duet-layout.padding-medium{padding:0}}@media (min-width: 62em){.duet-layout.padding-large{padding:0}}@media (min-width: 64.0625em){.duet-layout.padding-x-large{padding:0}}@media (min-width: 76.25em){.duet-layout.padding-xx-large{padding:0}}@media (min-width: 106.25em){.duet-layout.padding-xxx-large{padding:0}}@media (min-width: 36em){.duet-layout{padding:0 28px}}@media (min-width: 62em){.duet-layout{display:flex;flex-direction:row;padding:0 56px}}@media (min-width: 76.25em){.duet-layout{max-width:1110px;padding:0}}.duet-main{display:block;width:100%}@media (min-width: 62em){.duet-main{min-width:600px;margin:0 auto}}";
 var DuetSectionLayoutStyle0 = duetSectionLayoutCss;
 
 class DuetSectionLayout {
@@ -15655,14 +15721,13 @@ class DuetSectionLayout {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '0513022fd72635b7a29f28bd2d4c499efab5924f', class: {
+        return (hAsync(Host, { key: '3cdda64194aabb0bf4cef5f273b4eb35d956c63a', class: {
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, hAsync("div", { key: 'f63b99c09e8b7d188e7dee578d6ed7f6f9b3a274', class: {
+            } }, hAsync("div", { key: '167f4d34166d423a1ece6a4699ddf139e54f1c9f', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '156a1bfcfb46fecb6c73120927bae1788efd32a1', class: {
                 "duet-layout": true,
-                "duet-m-0": this.margin === "none",
                 [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, hAsync("section", { key: 'fc795216eaedfd65b6e2638a2735c8555b20400a', class: "duet-main" }, hAsync("slot", { key: '852e1dc28d14c80a9127b0ca9004a5cba7098c76' })))));
+            } }, hAsync("section", { key: '4aa12807146fee156f174be8670802f0d79f9974', class: "duet-main" }, hAsync("slot", { key: 'b3fb02f84266a65c67156bef474f9f6f2531623f' }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSectionLayoutStyle0; }
@@ -15905,9 +15970,9 @@ class DuetShapedImage {
         const style = {
             "--rotation": `${this.rotation}deg`,
         };
-        return (hAsync(Host, { key: '9a388c03cd8794d8a5c78322b756eceb14f9f0b7', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: 'd46a7b16b69201e05928ea5515b99c76fccb659e', class: {
+        return (hAsync(Host, { key: '1014997f5cd5d7115313762e6ba18827e1a10f15', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '46afc61323d3dd569cd651a4720693cab08addfc', class: {
                 "shaped-image": true,
-            }, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: '500823451da6d3ccb92c830a281871c73a1c1a6a', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: 'b6a32e8b7ed72ff300b8f6a1b8f0ac9c3fe7507b', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
+            }, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: '3f2dd1fff15551bc6477b2d837d6174777f3497a', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: '77941a17559185e4068b39b3f72cce8d3059de99', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
     }
     static get style() { return DuetShapedImageStyle0; }
     static get cmpMeta() { return {
@@ -16015,12 +16080,12 @@ class DuetShowMore {
      * Always the last one of the class.
      */
     render() {
-        return (hAsync(Host, { key: '3d096f18fbcc4cff02f201f2c065b56feaceb874' }, hAsync("div", { key: '99bd8d06faa921138031f41728d197eccabc8a9b', class: {
+        return (hAsync(Host, { key: 'f2ae77fcd733d57404b733d43ffb049d3503ecd0' }, hAsync("div", { key: 'a0a01d9f4ef3065ced4d4de652969744e6e1e227', class: {
                 "duet-show-more": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
                 open: this.open,
-            } }, hAsync("div", { key: '6dc1a29a0a0fdf48284af668e0a3800a54c7414d', ref: ref => (this.contentElement = ref), class: { content: true }, id: this.contentId, tabindex: this.open ? "0" : "" }, hAsync("div", { key: '98d549c12cab0e82c0da5a93755943c7cdd7e020', class: { "slotted-content": true } }, hAsync("slot", { key: '88d8df19994904032fbd80b186b80df1ad5c04a1' }))), hAsync("duet-button", { key: '2d26e042783015ec2cf5aa6d43b05a64d1cac673', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, this.open ? this.showLessLabel : this.showMoreLabel))));
+            } }, hAsync("div", { key: '8b799e3b59a456e4873357daa72313f0d29bffcf', ref: ref => (this.contentElement = ref), class: { content: true }, id: this.contentId, tabindex: this.open ? "0" : "" }, hAsync("div", { key: 'e5e04fa045ab43f00086e8799f87ab2b57f0a13b', class: { "slotted-content": true } }, hAsync("slot", { key: 'ca94e5187354a6debb373955df2d046a9c9271a4' }))), hAsync("duet-button", { key: 'cb4a2fc05e0e917e157458f31c75efb92b0258c1', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, this.open ? this.showLessLabel : this.showMoreLabel))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetShowMoreStyle0; }
@@ -16469,15 +16534,15 @@ class DuetSlideout {
         };
         const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
         const exitTranslation = getLocaleString(this.exitLangObject);
-        return (hAsync(Host, { key: '88684eeca3c2d0993e9df0926e243a336fdd92a1' }, hAsync("div", { key: 'ca9c8e8e4328049a64f33121bb958db863b6e0b8', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("duet-overlay", { key: '8dc6d03b51c732ac868513ee80c923b3250595ec', onClick: this.bgOnClick, visible: this.open, "display-device": "large", zIndex: "600" }), hAsync("div", { key: '05407d5ce3cd0a99d4e26df046d9f83b4b8e07a9', 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: 'b133285a9f8082e26a3cb91adf9975db7b2d39c3' }, hAsync("div", { key: '66082dd9a38534a3a03518b962a12173dc5e8d51', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("duet-overlay", { key: 'f5aea071c9b0dd8e3478466fac64d74e5a8b137e', onClick: this.bgOnClick, visible: this.open, "display-device": "large", zIndex: "600" }), hAsync("div", { key: '6d41981818265cbe3eb6ab711ee5aefe593cf8d6', 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,
-            }, style: styles }, hAsync(FocusGuard, { key: '8cb01fd8120627bcd639886ae7d6233d9b08e8b6', moveFocusTo: this.closeButton }), hAsync("div", { key: '2370e221ccbc3d408acbbf0ee6a03fad28e443d4', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '69189bd75f4b018e76fba05c6e610ca880741bb0', class: "top" }, hAsync("button", { key: '62ded799dcc6087171e5ea4073f34cc565097f91', 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: 'd469b01ae84bc9f2c064148b7820d7310ad60a49', moveFocusTo: this.closeButton }), hAsync("div", { key: '240e4b1276c42176866343c057ede222be046065', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '18bfdc09a33746c205d0e3ba164a9d7ec18d9901', class: "top" }, hAsync("button", { key: '47311364dd458561055b3f59b7bf391e92fcdab3', 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: 'e1bd07316366d09d49ea42d642d9fa4ac1b20767', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '0d1ec43ab54b2ca16880d552849000e0db14fe78', class: "sticky-header" }, hAsync("slot", { key: 'e86ccd4f468257d18b874be14d654685493f0f02', name: "sticky-header" }))), hAsync("div", { key: '7619e955e5292aa26cc195089516c8c1eefbcc6d', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
+            }, onClick: this.onClick, inert: this.openPanel }, hAsync("duet-icon", { key: 'bf7abca5a1b60e78a0b3c7dce6d0920ee7cc304d', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: 'd9b04adb7db8c6e30c0de28c58003eb4ce9f6e73', class: "sticky-header" }, hAsync("slot", { key: '0e2a3aed3efff80773a2b48ba6977ad435a04d42', name: "sticky-header" }))), hAsync("div", { key: '56905d228e5f503ddda3303575c5e52f349503ea', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
                 items: true,
-            } }, hAsync("slot", { key: '977a423ed91d61da268dbba22fa4920a6b4febce' })), hAsync(FocusGuard, { key: '5b7c2df982e810d0e6ab3093ffce228e0a4c435e', moveFocusTo: this.closeButton })))));
+            } }, hAsync("slot", { key: 'fa8953a31231244b9e5539417dfc32619c3e23f4' })), hAsync(FocusGuard, { key: '2cfc0d16d1eb738dc3bced0653c9486191cc3732', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -16542,7 +16607,7 @@ class DuetSlideoutLang {
      */
     render() {
         const langTranslation = getLocaleString(this.chooseLangObject);
-        return (hAsync(Host, { key: '1ffa97535d84470e1212e2edd8e7c5b9f67c2116' }, hAsync("div", { key: '10d65fcbf9c3000eb34125021d51af4efbf4eba0', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: '737d762ca01b63971b9d61c3e5ca67f8d92cd94c', name: "navigation-language", margin: "none", color: "secondary" }), hAsync("slot", { key: '9964f1c2b7baf17d4aad489c6d508fdd24703e80' }))));
+        return (hAsync(Host, { key: '26940a9efe3228ad051940cfb903980d683cf614' }, hAsync("div", { key: 'a031d990d2bf459e73678e682d1952e7225a67e7', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: '7ff54cdd19c444cb9d8c8a67b5e563df53f13e0b', name: "navigation-language", margin: "none", color: "secondary" }), hAsync("slot", { key: '2c0a83341839a6953c176fd68882dbd05151948a' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutLangStyle0; }
@@ -16586,12 +16651,12 @@ class DuetSlideoutLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '267e75e5afb886c43533da89f39a6937447a5bc1' }, hAsync("a", { key: 'ab6062843ce76d39f9408dee693d37834bb8041b', class: {
+        return (hAsync(Host, { key: '09e56868e9109c72560a96db767efc154bce8e93' }, hAsync("a", { key: '06c5bf4091cd8d28c2ef09783da5ec924a598ae7', 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: 'cf170dcab30ff6147ec97cfea8cf80ae91a07e52', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), hAsync("div", { key: 'e3bfb77a0f8b3661936ab9578d27229be577b3a1', class: "label" }, hAsync("span", { key: '2dbb1c5eab8c0bd7893987effe7f830a74c11579' }, hAsync("slot", { key: '67daf8ce8bed028f853bf5a8999aa0ffc6ae88fd' }), hAsync("slot", { key: 'c62fd4e6ae9d31b1f2391485d77d9e4a0dc09b7f', name: "description" })), this.caret && (hAsync("duet-icon", { key: '822173dad75ff048010488b1c28494bd89152ec5', 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: 'd3649e9fdc0d46d249079e80015d31d0809283e7', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), hAsync("div", { key: '21bc61aa08c8e259bef3845115c1d3def2b9528f', class: "label" }, hAsync("span", { key: '9d3c455f8776388201b9e263a3e8f9cfa4cf8cfd' }, hAsync("slot", { key: '05330b7c102e31a4e543713159048f747fcea958' }), hAsync("slot", { key: 'c63eab53cf753fb61ff69076b213c37f06e77f41', name: "description" })), this.caret && (hAsync("duet-icon", { key: '295ebf34531a451c1888310e6abbf8e97eff723f', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutLinkStyle0; }
@@ -16750,21 +16815,21 @@ class DuetSlideoutPanel {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (hAsync(Host, { key: '805cfaa182eb761f1ce6217e1c62ed5dd007a947' }, hAsync("div", { key: '363f2f3eaf901468c5f15ad7dcba4d3b781cc500', class: {
+        return (hAsync(Host, { key: '70bd33cf81bea6e0e21a3acc777e62f9615c960c' }, hAsync("div", { key: '173d84b1e9630496dfd75f1d1788ceb258aa65dd', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, hAsync("button", { key: '5ec34b3ecd11c56416277f0f4753d6dc1f8efed6', 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: '8af158a56baed0c99a678a13c70679a2e37d4641', 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("duet-icon", { key: '5d6a27c57dc78e388b271f0f2d6eb2cd7821c202', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: 'd64964aca9eea3caa8ae881296e258f08146e487', class: "label" }, hAsync("span", { key: '6b4148f10a5d1b3065758fb5625da769c52f72ec', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: '81eb240dd33e6fb12e4a7cca81de48fdcee2af19', name: "label" })), hAsync("duet-icon", { key: '50cc29a5a19817e58bfcf90efa70b59b2fba9fdd', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: '37829b24562f4b2815f7d4ab2affd231e7850d9e', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && hAsync("duet-icon", { key: 'ef8953eeeb735665fefc41627200a2939df9fc91', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: '1e1ce042634306e70595feab772ea1986020dbe5', class: "label" }, hAsync("span", { key: 'b91e1f83f96194cad5fbccca121036d68667faad', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: '6fe342d4f1cc5128f50bd68287713bf2b743bb1a', name: "label" })), hAsync("duet-icon", { key: '56091986d5dec8dca5ab057fc3bbd59ac5459bd7', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: 'f639893ab35cb5c6362f692cb909e734232dcb6f', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, hAsync(FocusGuard, { key: '866309235d2682686f46604d200cb8fb7789fd78', moveFocusTo: this.closeButton }), hAsync("div", { key: 'bf2bc641f6c8818f917fb40b13f6b7fe5e6f208f', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '67071ec5db130b7f92587562eec7b5ebac45e1bd', class: "top" }, hAsync("button", { key: '33da125c06f6246cd7b6a388ffa332c32b8fd374', 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: '44ead66ea6ff8418096d578f6a822357b186ac4d', moveFocusTo: this.closeButton }), hAsync("div", { key: 'b3de10fc0e5139011798a6f9dc45fda74e66f2a8', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: 'b25a3a1c91eb4daf74a5a43e6a38916b055e3e2b', class: "top" }, hAsync("button", { key: '9c898e5bc439ae96e4fa636f15d1e4c9880791bf', 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: '24b7d7426f408b7aa4043495bbf6647851f7d162', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: 'cd331fba8d0793d7c2b59d96e9796a50d77b4224' }, this.label.innerHTML), hAsync("button", { key: '62fd9e793ff023422c32a9024a74b9befeb1c056', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: 'de1281dc825979a6cb290a8e4faf24e53ed3c49a', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: 'c7e160049359ff2cef0e1713fc416b81461a8e44', class: "sticky-header" }, hAsync("slot", { key: '8d216879c47672cc6479b1aa9ba76c3379d5e0ec', name: "sticky-header" }))), hAsync("div", { key: 'b0bd9025bc1021ff7771105fc79e2c2fe4545ddc', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, hAsync("duet-icon", { key: '647666d32da78fd122547b29b2d6366a74cac38d', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: 'c137000b706a49614251aab9978772f7f032c35b' }, this.label.innerHTML), hAsync("button", { key: 'f96fa6523e3cc9dda0142e2e79598be943ed14df', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: '17e401b299082405fe58d6e2ebe0183e1480b1b4', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: 'e40d94664116f4e4ee26c9c9e85d0d98a807445e', class: "sticky-header" }, hAsync("slot", { key: 'f1d9bc10ab424bcebaf8c7d5ac28937df83fb988', name: "sticky-header" }))), hAsync("div", { key: '027b1f8a337474484867affa518ceb3f95984518', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, hAsync("slot", { key: 'd48e80a480587c2dd49773b14f31ddd56fe790dc' })), hAsync(FocusGuard, { key: '4dd1a90579416304992efa312c3999f7941d1a65', moveFocusTo: this.closeButton })))));
+            } }, hAsync("slot", { key: '8b7aefc4d72e80a1e8b2f5095484d5680a1d96e1' })), hAsync(FocusGuard, { key: '542e145cc71bb24977c5e2a35fedaa2928c0fcd1', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -16833,16 +16898,16 @@ class DuetSlideoutPanelDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'ae396c94bb6581cc91e2757c2c86232728315498' }, hAsync("div", { key: '1fbc63be41621dbe711387dec4c733272b58aae4', class: {
+        return (hAsync(Host, { key: 'fe4d5c5f27f9f4106de41db6681937d60bcb59c4' }, hAsync("div", { key: '284adde9302682c56b971fe73f7705f2fee91eb0', class: {
                 "duet-slideout-panel-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, hAsync("button", { key: 'd3956f08bb9197d68db47cd8ce31b222a825862e', 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: 'ca4402750442dc3cfe434984c80381d1cdfd3b74', 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: '36278cab4355f36e54ff0bc873ebc27e49b146c1', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: '5babf16dbd6ae3686423c4ece8779d69819e79e3', class: "label" }, hAsync("slot", { key: '0d3d0f41eaf979d05c21aba744c26ffd043f9d64', name: "label" }), hAsync("duet-icon", { key: 'd6abff8f46d22a4bbd7f4635f53e82a5a1498db1', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: '6ee1b74a69107abab5c9af91a9bd9fe824741d55', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, this.icon && hAsync("duet-icon", { key: '34c2d5cf9bb779eec11f8852eb8c2bd279028baf', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: '6834d3f1b9b057b877641b1f000065f8a4813250', class: "label" }, hAsync("slot", { key: 'f1856cf9b4ce8ca515babc2163da4ef36482e49e', name: "label" }), hAsync("duet-icon", { key: 'ae906904ed9255d48b47f705ea8653b65c76df90', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: '071dc719524009f86906d4204464cdcd14aaa36c', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '8bc5889a6505974a8929651a8abd6b4fd98e5f74' })))));
+            } }, hAsync("slot", { key: '35141accc2735d157bf80d8c76346585fa47cff1' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutPanelDropdownStyle0; }
@@ -16877,7 +16942,7 @@ class DuetSpacer {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'a1b6a9855c52785dc640ef0687b936220e386943', class: {
+        return (hAsync(Host, { key: 'e3fa9f7e7f3f55ab6819a10d50c42a54a172f3c3', class: {
                 "duet-spacer": true,
                 "duet-spacer-xx-small": this.breakpoint === "xx-small",
                 "duet-spacer-x-small": this.breakpoint === "x-small",
@@ -16928,11 +16993,11 @@ class DuetSpinner {
      */
     render() {
         const color = this.color === "currentColor" ? "currentColor" : getColorByName(this.color);
-        return (hAsync(Host, { key: '6fc0f9fa723de55cc61a5d730b22703c4822e0cd', class: {
+        return (hAsync(Host, { key: 'aeea2098d956a68366b4671b449702d6f28c45a0', class: {
                 "duet-custom-color": this.color !== "currentColor" && this.theme !== "turva" && this.theme !== "default",
                 "duet-theme-turva": this.theme === "turva" && this.color !== "currentColor",
                 "duet-theme-default": this.theme === "default" && this.color !== "currentColor",
-            } }, hAsync("div", { key: '7a00a397a9d0ef913cb644f458cf5d79d1db49d3', class: {
+            } }, hAsync("div", { key: '2073bfea9ac6ef08ff83f350bd0984f0aeda883a', class: {
                 "duet-spinner": true,
                 [this.size]: true,
             }, style: { color }, "aria-label": this.accessibleLabel })));
@@ -17164,7 +17229,7 @@ class DuetStepper {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'd8aa897bf6b424b99b07e4a91b9e8cf7488a7e71', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '26ea48b5571e3fd4c931ce5b257b7fff3dc6dcf9', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("duet-visually-hidden", { key: 'cf606e1120808187c6a670aab837b54b97096af1', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), hAsync("slot", { key: '74b2e7ac6dd883d11763974c1f0f962c1e2b2cb8' }))));
+        return (hAsync(Host, { key: 'f9004c43445eb7a88448511b9d940b66f9de4c70', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '80977e593bd91142216f4485cd05fd00166874d6', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("duet-visually-hidden", { key: '7eb30a7ae2c00676571f99679fac2bf89ef1c180', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), hAsync("slot", { key: '5510415c2d52a2e2a1f06e1ccaa153cc2b50bf2e' }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -17309,19 +17374,19 @@ class DuetSubmenuBar {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'd23feaeb59a6a54db129042cc984d77237de92c4' }, hAsync("nav", { key: 'c1a5e23bf7598285828acc0df6ba04d10777d816', class: {
+        return (hAsync(Host, { key: 'fec25f6c8b5983923f591d756decc5ae3404de5e' }, hAsync("nav", { key: '6f812f5da82df3218d6de29f655d2596ed865a4d', class: {
                 "duet-submenu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 hidden: this.hidden,
-            }, "aria-label": this.accessibleLabel }, this.hasItems && (hAsync("button", { key: '37bef492a5c920f7c63f33cef8496079b25151dd', 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: '5e8ab90a4e09dbd7746b1405d3ea92615a439dd7', 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: '3627d9e5b49dca1946bbcea8b30139afa373da36', class: "label" }, hAsync("slot", { key: 'e129c5ce82224625f3bec58dec0c20085664b4c8', name: "label" }), hAsync("duet-icon", { key: 'acf4f3367afe06a7068b3120bf8f12951b2a8845', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: '882629e17e25bbddaa56c909a298d69d534abe08', class: {
+            }, onClick: this.onClick }, hAsync("span", { key: '1f2ed95c73d93faf4ba71d7984e00488137250d1', class: "label" }, hAsync("slot", { key: '5ca819d2a6f97bb4c9e75f2ea024187f76af67e2', name: "label" }), hAsync("duet-icon", { key: '3b1a4bcac49bec29f344a38e5f743aaeb63f59a0', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: '01e35b212a44a4bb39a8fd5cc5a694b94dcb1ccb', class: {
                 "menu-container": true,
                 hidden: !this.open,
-            }, role: "presentation" }, hAsync("div", { key: 'f06adcfe1330258fdf9395766e0e6a2a44bb1540', 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: '5f94254c66db242ce904ddfd963f6dbe7f4337b6', 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: 'c0b7893f4beafab4ea530f6c7a0723988bd986c8', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: '81800724eb1fdc99ebf058a192746cd64ff5f2f4' }), hAsync("div", { key: '33615812b5ac6e839c6487696a1a3bc31f620744', class: "list-padding" }))), hAsync("duet-overlay", { key: '09b4069d8369250684e4a51c085d0b804f57ad29', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
+            }, ref: element => (this.itemsContainer = element) }, hAsync("div", { key: 'be03e176ea88bf9b83e506a67470747a4f30b9ee', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: '1ba101226680d98cffade2702cbe6f6c40432146' }), hAsync("div", { key: 'c51c2e13e3f5a24edf28dba162ee0602666ca1f9', class: "list-padding" }))), hAsync("duet-overlay", { key: '5b93e09b26a80acce10526710c818c0017d74627', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -17442,18 +17507,18 @@ class DuetSubmenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'ced56417d146eb3149884a6acf9d2f0c2a63441f', role: "listitem" }, hAsync("div", { key: '166bb208b5185668b66feb8dbd14e7afb38bb649', class: {
+        return (hAsync(Host, { key: 'b3ceba0158daeda5a08cdbb24998e6a5621a3703', role: "listitem" }, hAsync("div", { key: '7151474e27716eb431d4e91c40df63183b3a7aa3', class: {
                 "duet-submenu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 open: this.open,
                 active: this.active,
-            } }, hAsync("button", { key: 'de45f25e558d837a8325f7f33a4f30e3c1071902', 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: '5c52390b4c51542e2f964c334678b69bbd579520', 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: '8308454f3cc3c2771afaad1632f2eeb812ad8e84', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'f34879f5749b92e79c2e16ac83261526f958d6a1', class: "label" }, hAsync("span", { key: 'f8be24eef6e5e42e40b1e05fa1a6c391670849a7', class: "label-text" }, hAsync("slot", { key: 'a5e526a73c39672ab1c5cd81f58cb6c362b249eb', name: "label" })), hAsync("duet-icon", { key: '160ce4e95b62545c0432587ee7510bb74607697e', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'eb0c9fbe5a4001f406eaa529a7909f148100e8de', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'b54bb41ddf9a8743c91ca00b851f278ed01be2d3', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '5e48f0afd254dc828b65347ed8b9503a258cf2fa', class: "label" }, hAsync("span", { key: '11e104876c90fb056e2ec497e48a8ab634bcaf90', class: "label-text" }, hAsync("slot", { key: 'a5eba5494cfa87a94cfa0f7a6b9614f5e84127e5', name: "label" })), hAsync("duet-icon", { key: '954b21321b8f10dda0da3e8b049157bd6ac52b49', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'f2cbdcc7f153986c5d76351fb27070eb233cf68c', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '9648718ea62884b361f4cf695b8bc08fcaf42434' })))));
+            } }, hAsync("slot", { key: '4e14b8e2e6c20c4fa8e9e90b34047a6a790ff5e6' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarDropdownStyle0; }
@@ -17505,12 +17570,12 @@ class DuetSubmenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'becb2a65396836f75dd2107bbca7b490a721ec9f' }, hAsync("a", { key: 'd5e322c29ea914b48d57fad90136d18fe17229ac', class: {
+        return (hAsync(Host, { key: 'f80ee91cccb915e476e1f572f9656985c2028978' }, hAsync("a", { key: '8a53200290262940ac11346d9d7526afed459893', 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: '6172f90356d35fba7e533fb632c212b400244666', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: '4612a1f95f7d0d41b37d856ac49f8455fb4bca40', class: "label-container" }, hAsync("span", { key: '44b1a2a55750d0eff61f8057f8730a2ef2167131', class: "label" }, hAsync("slot", { key: '1c1bbf56491ce130a990833ad158ce64dfb55c04' })), this.caret && hAsync("duet-icon", { key: 'b1a63e742eadf1244fcd90b98a9df90f37e87fee', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: '22ae20117fc0318b97289382cfc6727b101058c1', 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: '006a4ba73b60083703dbcc084263b8a721c320d7', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: '9450f9f49041afd67cd79bf8c9b3ea0094cef6ce', class: "label-container" }, hAsync("span", { key: 'f0e0d4882fd97aeb7c33c29e68be8c4ee40302f8', class: "label" }, hAsync("slot", { key: 'a72b1bcc2fcd65022d09fea90b1c7c957e54ffb5' })), this.caret && hAsync("duet-icon", { key: '795f6f318bde5239cf79fa96a4a915e42032e5d1', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: 'd79f93df8837c4e201869a960f8f7a53783b7852', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarDropdownLinkStyle0; }
@@ -17572,7 +17637,7 @@ class DuetSubmenuBarItem {
     render() {
         const TagName = this.url ? "a" : "button";
         const role = this.url ? "link" : "button";
-        return (hAsync(Host, { key: '003b6e77d31a2b55fcfbb5c07708a96e7a687224', role: "listitem" }, hAsync(TagName, { key: '65bb3b4ae0bc56ffa9425e410026685f09f4cff3', 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.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role }, this.leadingIcon && (hAsync("duet-icon", { key: '75babe76dbd89f0a7fe44760ea40c2d318132163', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'f7d6d855c464595ce3ed2e3682b0b469e8d9f0ba', class: "label" }, hAsync("span", { key: '3cfdea86b60ad0e7584374489ae068fabd9b5480', class: "label-text" }, hAsync("slot", { key: '9703e9c022f42456bb4f3237343a256116815731' })), this.trailingIcon && (hAsync("duet-icon", { key: '4da2be3263bfda5b511034edeef0e9308302f7d1', class: {
+        return (hAsync(Host, { key: '235d62294980430d719692b42954af6eacd305e8', role: "listitem" }, hAsync(TagName, { key: 'e847552fc82cf3ea6c8ca1dd11e2dc3fd8593f3e', 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.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role }, this.leadingIcon && (hAsync("duet-icon", { key: '4a084254a6ee575e72d98fc83203e34d24dfdab3', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '480d23a3ddeab5d0359f95e51ea8ce7f4c893aa4', class: "label" }, hAsync("span", { key: '72936339ba118cad5aaccb094d4c727e2bbf5b4f', class: "label-text" }, hAsync("slot", { key: 'a1009b487801d8be2c9a103f8e7ec4cc8c3f48eb' })), this.trailingIcon && (hAsync("duet-icon", { key: '7c92ee5886afdb53c6c750e27b0a86976f87cbbf', class: {
                 "trailing-icon": true,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
@@ -17629,7 +17694,7 @@ class DuetSubmenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'c48d47c5e033d5ca70c1d1c80bac45c29f348341', role: "listitem" }, hAsync("a", { key: '8ed842cbabe3a496e0f5736573a9981a74ce8257', 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: '3a930062f0a0a0f79b178cedaf990f8b74112603', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: '8e9b0e67db2502fdc4616342944576a648002b70', class: "label" }, hAsync("slot", { key: '0c5445ad8aa0dee1c593548e14c91ae7a467d1ee' })))));
+        return (hAsync(Host, { key: '51e5c82b88f45b2a32b9007c1cba3c28bebb0f76', role: "listitem" }, hAsync("a", { key: '777ef8ad98f32b4be821e576e7085b767e2c80ac', 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: 'eb80ccc57229a8a448d32e17695c7f573805f967', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: '3dc063ad2c8b8fb92d1d292205dcf5ea82889b4f', class: "label" }, hAsync("slot", { key: '2274f12f2198558e45a4b79c828c06cf9bb7f1c0' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarLinkStyle0; }
@@ -17978,27 +18043,27 @@ class DuetTabGroup {
     render() {
         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: 'a09d023095d80f1984c13102ed5f85594d0c2e54', class: {
+        return (hAsync("div", { key: 'ebe04fec966d8b545c6efd5b34b43551fc2ad1d3', 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: '6d5a053f2a39b2e5042fa199b50ef6dfcb2e8395', 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) => {
+            }, "aria-label": this.accessibleLabel }, !isSwipeScrollable && this.tabs.length > 3 && this.collapses && (hAsync("duet-select", { key: '2f5a55d27e5e0483129fd2bdc8aa0cc7bb641a8f', 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: 'c314e15b44bfec35a9dce7f0b3343adb2560eb1e', role: "tablist", class: {
+            }) })), hAsync("div", { key: '05b06b0a5fcaa80f09e8d0550e5a9af194d397dc', 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: 'a05213a66ee2ac2103eeb887312551edde85914c', class: {
+            } }, this.renderTab()), hAsync("div", { key: '66d70f586ee16b2b6be97013971fdb0a320d34c0', class: {
                 "duet-tab-group-content": true,
                 "duet-m-0": this.margin === "none",
                 "checked-group-content": this.variation === "checked",
-            } }, hAsync("slot", { key: '4e1231a85f36bf98be1d5ab1054e031dd2b4b814' }))));
+            } }, hAsync("slot", { key: 'c18fde90ff76c6f71fbeae6a2d04a193cb64917f' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTabGroupStyle0; }
@@ -18102,7 +18167,7 @@ class DuetTable {
         }
     }
     render() {
-        return (hAsync(Host, { key: 'ae58f00a875348e1bfe6a6c15baa15ec447ceb56', class: {
+        return (hAsync(Host, { key: 'b3ed604b2b5f0b8e31f7b90abc64693662bfef3d', class: {
                 [`duet-table-${this.variation}`]: true,
                 "duet-table-flattened": !this.matchesBreakpoint,
                 // sticky only valid when in regular table layout
@@ -18111,7 +18176,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: '4bcaeb88b3f25d2bf172207b2d0dc4b0187830e6' })));
+            } }, hAsync("slot", { key: '29df6d3c640fbf3a7fa51b73323c3628246d3095' })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -18138,9 +18203,18 @@ class DuetTable {
     }; }
 }
 
-const duetTextareaCss = "*.sc-duet-textarea,*.sc-duet-textarea::after,*.sc-duet-textarea::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-textarea-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:block;width:100%;max-width:100%;text-align:left}.sc-duet-textarea-h:last-child,.sc-duet-textarea-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-textarea-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-textarea-h{width:100% !important}}.duet-m-0.sc-duet-textarea-h{margin:0 !important}duet-tooltip.sc-duet-textarea,.sc-duet-textarea-s>duet-tooltip{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-textarea,.sc-duet-textarea-s>duet-tooltip{position:relative;top:4px;right:auto}}.duet-textarea-container.sc-duet-textarea{position:relative;width:100%;height:100%}.duet-textarea-container.sc-duet-textarea .duet-input-top-caption.sc-duet-textarea{display:none}.duet-textarea-container.duet-input-top-caption-shown.sc-duet-textarea .duet-input-top-caption.sc-duet-textarea{display:flex !important}.duet-textarea-wrapper.sc-duet-textarea{position:relative}.duet-textarea-placeholder.sc-duet-textarea{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:rgb(255, 255, 255)}.duet-textarea.sc-duet-textarea{padding:15px !important;position:relative;z-index:100;display:block;width:100%;min-width:8rem;min-height:160px;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;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(0, 41, 77);resize:vertical;background:rgb(255, 255, 255);border:1px solid rgb(144, 149, 153);border-radius:4px;transition:150ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea{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(116, 116, 117)}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:rgb(222, 35, 98) !important}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:rgb(224, 42, 13) !important}.duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:rgb(101, 119, 135);opacity:1 !important;transition:color 300ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:rgb(116, 116, 117)}.duet-textarea.sc-duet-textarea:focus::-webkit-input-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus::-webkit-input-placeholder{color:rgb(207, 207, 209)}.duet-textarea.sc-duet-textarea::-moz-placeholder{color:rgb(101, 119, 135);opacity:1 !important}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-moz-placeholder{color:rgb(116, 116, 117)}.duet-textarea.sc-duet-textarea:focus::-moz-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus::-moz-placeholder{color:rgb(207, 207, 209)}.duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:rgb(101, 119, 135)}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:rgb(116, 116, 117)}.duet-textarea.sc-duet-textarea:focus:-ms-input-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus:-ms-input-placeholder{color:rgb(207, 207, 209)}.duet-textarea[disabled].sc-duet-textarea{color:rgb(101, 119, 135) !important;cursor:not-allowed !important;background:rgb(245, 248, 250) !important;border-color:rgb(245, 248, 250) !important}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea{color:rgb(116, 116, 117) !important;background:rgb(245, 245, 247) !important;border-color:rgb(245, 245, 247) !important}.duet-textarea[disabled].sc-duet-textarea::-webkit-input-placeholder{color:rgb(0, 41, 77);opacity:1 !important;transition:color 300ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea::-webkit-input-placeholder{color:rgb(23, 28, 58)}.duet-textarea[disabled].sc-duet-textarea::-moz-placeholder{color:rgb(0, 41, 77);opacity:1 !important}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea::-moz-placeholder{color:rgb(23, 28, 58)}.duet-textarea[disabled].sc-duet-textarea:-ms-input-placeholder{color:rgb(0, 41, 77)}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea:-ms-input-placeholder{color:rgb(23, 28, 58)}.duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #747475}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #e55039}.duet-textarea.sc-duet-textarea:focus{border-color:rgb(0, 119, 179);outline:0;box-shadow:0 0 0 1px #0077b3 !important;transition:none}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{border-color:rgb(23, 28, 58);box-shadow:0 0 0 1px #171c3a !important}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{box-shadow:0 0 0 1px #e55039}.duet-textarea.sc-duet-textarea:not(:focus):not(:hover):invalid{box-shadow:none}.duet-textarea-help.sc-duet-textarea{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:0.875rem;line-height:1.25}.duet-textarea-help.sc-duet-textarea span.sc-duet-textarea{display:block;margin-top:8px}.duet-theme-turva.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{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(116, 116, 117)}.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:rgb(222, 35, 98)}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:rgb(224, 42, 13)}.duet-label-hidden.sc-duet-textarea duet-label.sc-duet-textarea{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-character-count.sc-duet-textarea{display:block;margin:8px 0 0 auto}";
+const duetTextareaCss = "*,*::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;margin-right:16px !important;margin-bottom:12px !important;display:block;width:100%;max-width:100%;text-align:left}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (min-width: 36em){:host{width:calc(50% - 16px - 3px)}:host.duet-expand{width:100% !important}}:host(.duet-m-0){margin:0 !important}duet-tooltip,::slotted(duet-tooltip){position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip,::slotted(duet-tooltip){position:relative;top:4px;right:auto}}.duet-textarea-container{position:relative;width:100%;height:100%}.duet-textarea-container .duet-input-top-caption{display:none}.duet-textarea-container.duet-input-top-caption-shown .duet-input-top-caption{display:flex !important}.duet-textarea-wrapper{position:relative}.duet-textarea-placeholder{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:rgb(255, 255, 255)}.duet-textarea{padding:15px !important;position:relative;z-index:100;display:block;width:100%;min-width:8rem;min-height:160px;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;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(0, 41, 77);resize:vertical;background:rgb(255, 255, 255);border:1px solid rgb(144, 149, 153);border-radius:4px;transition:150ms ease}.duet-theme-turva .duet-textarea{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(116, 116, 117)}.has-error .duet-textarea{border-color:rgb(222, 35, 98) !important}.duet-theme-turva.has-error .duet-textarea{border-color:rgb(224, 42, 13) !important}.duet-textarea::-webkit-input-placeholder{color:rgb(101, 119, 135);opacity:1 !important;transition:color 300ms ease}.duet-theme-turva .duet-textarea::-webkit-input-placeholder{color:rgb(116, 116, 117)}.duet-textarea:focus::-webkit-input-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva .duet-textarea:focus::-webkit-input-placeholder{color:rgb(207, 207, 209)}.duet-textarea::-moz-placeholder{color:rgb(101, 119, 135);opacity:1 !important}.duet-theme-turva .duet-textarea::-moz-placeholder{color:rgb(116, 116, 117)}.duet-textarea:focus::-moz-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva .duet-textarea:focus::-moz-placeholder{color:rgb(207, 207, 209)}.duet-textarea:-ms-input-placeholder{color:rgb(101, 119, 135)}.duet-theme-turva .duet-textarea:-ms-input-placeholder{color:rgb(116, 116, 117)}.duet-textarea:focus:-ms-input-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva .duet-textarea:focus:-ms-input-placeholder{color:rgb(207, 207, 209)}.duet-textarea[disabled]{color:rgb(101, 119, 135) !important;cursor:not-allowed !important;background:rgb(245, 248, 250) !important;border-color:rgb(245, 248, 250) !important}.duet-theme-turva .duet-textarea[disabled]{color:rgb(116, 116, 117) !important;background:rgb(245, 245, 247) !important;border-color:rgb(245, 245, 247) !important}.duet-textarea[disabled]::-webkit-input-placeholder{color:rgb(0, 41, 77);opacity:1 !important;transition:color 300ms ease}.duet-theme-turva .duet-textarea[disabled]::-webkit-input-placeholder{color:rgb(23, 28, 58)}.duet-textarea[disabled]::-moz-placeholder{color:rgb(0, 41, 77);opacity:1 !important}.duet-theme-turva .duet-textarea[disabled]::-moz-placeholder{color:rgb(23, 28, 58)}.duet-textarea[disabled]:-ms-input-placeholder{color:rgb(0, 41, 77)}.duet-theme-turva .duet-textarea[disabled]:-ms-input-placeholder{color:rgb(23, 28, 58)}.duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #909599}.duet-theme-turva .duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #747475}.has-error .duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error .duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #e55039}.duet-textarea:focus{border-color:rgb(0, 119, 179);outline:0;box-shadow:0 0 0 1px #0077b3 !important;transition:none}.duet-theme-turva .duet-textarea:focus{border-color:rgb(23, 28, 58);box-shadow:0 0 0 1px #171c3a !important}.has-error .duet-textarea:focus{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error .duet-textarea:focus{box-shadow:0 0 0 1px #e55039}.duet-textarea:not(:focus):not(:hover):invalid{box-shadow:none}.duet-textarea-help{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:0.875rem;line-height:1.25}.duet-textarea-help span{display:block;margin-top:8px}.duet-theme-turva .duet-textarea-help{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(116, 116, 117)}.has-error .duet-textarea-help{color:rgb(222, 35, 98)}.duet-theme-turva.has-error .duet-textarea-help{color:rgb(224, 42, 13)}.duet-label-hidden duet-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-character-count{display:block;margin:8px 0 0 auto}";
 var DuetTextareaStyle0 = duetTextareaCss;
 
+const CharacterCount = ({ value, maxlength, label, theme }) => {
+    if (maxlength == null) {
+        return;
+    }
+    const length = value.length;
+    const remainder = Math.max(maxlength - length, 0); // ensure we never have negative numbers
+    const isApproachingLimit = remainder / maxlength <= 0.1; // <= 10% chars remaining
+    return (hAsync("div", { class: "duet-character-count" }, hAsync("duet-caption", { margin: "none", theme: theme, size: "small" }, hAsync("duet-visually-hidden", { "aria-live": "polite", "aria-atomic": "true", class: "duet-textarea-counter-remaining" }, isApproachingLimit && `${remainder} ${label}`), hAsync("span", { "aria-hidden": "true" }, length, "/", maxlength))));
+};
 /**
  * @slot tooltip - Use to place a tooltip alongside the label.
  */
@@ -18292,9 +18366,20 @@ class DuetTextarea {
      * Always the last one in the class.
      */
     render() {
-        {
-            return;
-        }
+        const identifier = this.identifier || this.textareaId;
+        return (hAsync(Host, { key: 'c3b31db31b22c40183466910b4762d2476cd3b4b', class: {
+                "duet-m-0": this.margin === "none",
+                "duet-has-counter": this.counter && !this.error,
+                "duet-expand": this.expand,
+            } }, hAsync("div", { key: 'fb7b1f655a8d8519ad38cf110ef4d0aac5e0dbd5', class: {
+                "duet-textarea-container": true,
+                "duet-theme-turva": this.theme === "turva",
+                "duet-label-hidden": this.labelHidden,
+                "duet-input-top-caption-shown": this.isCaptionVisible,
+                "has-error": !!this.error,
+            } }, hAsync("duet-label", { key: 'ca8b81cd836c5b413d7ef2efd8d0e20d88677709', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { key: '509fbb9ca662d38fa8f3d66013459141592c04bd', direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), hAsync("slot", { key: 'e90c6afcf38a563122b32c71d2b8a74c9df980dc', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: '9bb362d665f0cf1898ebf380b4989d3f65f14371', id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), hAsync("div", { key: '601f1bea634594d73b983373107c175a76c1100a', class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { key: 'e9a43999996749d5d172eacfaa42597ba5dbb7fe', id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), hAsync("textarea", { key: '505944e9722ecc367ee4f395132c39b367af7a31', onInput: this.handleInput, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus, ref: input => (this.nativeInput = input), class: { "duet-textarea": true, disabled: this.disabled }, value: this.value, disabled: this.disabled, "aria-labelledby": this.accessibleLabelledBy ? `${this.labelId} ${this.accessibleLabelledBy}` : this.labelId, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getDescribedBy(), "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, placeholder: this.placeholder, spellcheck: "false", required: this.required, minlength: this.minlength, maxlength: this.maxlength, role: this.role, name: this.name, id: identifier })), hAsync("duet-grid", { key: '2a9345c695c8f798c88444446c7fe3a4d6073b3f', alignment: "stretch" }, hAsync("duet-grid-item", { key: '603a4279b24566e2bf0f52bbc6f5106a92f1fccf', margin: "none", fill: true }, hAsync("div", { key: 'c7dc521f37c36b761ed4fc78150efe59c1fb98fb', class: "duet-textarea-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '11f69f46dc6822dc9942f64056310c8eac7a2861' }, this.error))), hAsync("duet-grid-item", { key: 'b7dcc318f6911b52a959c2162980272260419b1d', margin: "none", class: "duet-character-count-caption" }, this.counter && (hAsync(CharacterCount, { key: '590c05e0b251e46af19c479733281a0b8b7a2fa1', theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (hAsync("duet-visually-hidden", { key: 'c279b238edfcc355fb7243bed0afa94b544661e8', class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
+                this.hiddenCounterLabel = el;
+            } })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -18302,7 +18387,7 @@ class DuetTextarea {
     }; }
     static get style() { return DuetTextareaStyle0; }
     static get cmpMeta() { return {
-        "$flags$": 6,
+        "$flags$": 9,
         "$tagName$": "duet-textarea",
         "$members$": {
             "margin": [1],
@@ -18461,7 +18546,7 @@ class DuetToggle {
     }; }
 }
 
-const duetToolbarCss = "*,*::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;position:relative;width:100%}.duet-toolbar{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;background:rgb(255, 255, 255)}.duet-toolbar .container{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1384px;height:36px;margin:0 28px;border-bottom:1px solid rgb(225, 227, 230)}.duet-toolbar .list{display:flex;align-items:center;justify-content:space-between;height:100%;list-style-type:none}.duet-toolbar ::slotted(*){display:flex;align-items:center;justify-content:center;height:100%}.duet-toolbar.negative{background:rgb(0, 119, 179)}.duet-toolbar.negative .container{border-bottom:0}.duet-toolbar.duet-theme-turva{background:rgb(255, 255, 255)}.duet-toolbar.duet-theme-turva .container{border-bottom:1px solid rgb(228, 228, 230)}.duet-toolbar.duet-theme-turva.negative{background:rgb(198, 12, 48)}.duet-toolbar.duet-theme-turva.negative .container{border-bottom:0}";
+const duetToolbarCss = "*,*::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;position:relative;width:100%}.duet-toolbar{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;background:rgb(255, 255, 255)}.duet-toolbar .container{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1384px;height:36px;margin:0 28px;border-bottom:1px solid rgb(225, 227, 230)}.duet-toolbar .list{display:flex;align-items:center;justify-content:space-between;height:100%;list-style-type:none}.duet-toolbar ::slotted(*){display:flex;align-items:center;justify-content:center;height:100%}.duet-toolbar.primary{background:rgb(0, 119, 179)}.duet-toolbar.primary .container{border-bottom:0}.duet-toolbar.secondary{background:rgb(8, 42, 77)}.duet-toolbar.secondary .container{border-bottom:0}.duet-toolbar.duet-theme-turva{background:rgb(255, 255, 255)}.duet-toolbar.duet-theme-turva .container{border-bottom:1px solid rgb(228, 228, 230)}.duet-toolbar.duet-theme-turva.primary{background:rgb(198, 12, 48)}.duet-toolbar.duet-theme-turva.primary .container{border-bottom:0}";
 var DuetToolbarStyle0 = duetToolbarCss;
 
 /**
@@ -18486,12 +18571,18 @@ class DuetToolbar {
      * Always the last one in the class.
      */
     render() {
-        const variation = this.variation === "negative" ? "negative" : "default";
-        return (hAsync(Host, { key: '7600688d2b7f3cf63474d71705af2630a04c9a5a' }, hAsync("nav", { key: '9673ecc614b00413b228099aa0ca4ceec4260f0a', class: {
+        const variation = this.variation === "primary" ||
+            this.variation === "negative" ||
+            (this.theme === "turva" && this.variation === "secondary")
+            ? "primary"
+            : this.variation === "secondary"
+                ? "secondary"
+                : "default";
+        return (hAsync(Host, { key: '6ea0ca6e03a956c5c11e6b6b67802a8344e6f3d8' }, hAsync("nav", { key: '8937fd46b558b273ee838a47b14b9810c074829d', class: {
                 "duet-toolbar": true,
                 "duet-theme-turva": this.theme === "turva",
                 [variation]: true,
-            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: '60381599cb6eaedc773a667047a8893e96f3047b', class: "container" }, hAsync("div", { key: 'c88cbc1def0dac05211916d6e8d9d0e4dd973abd', class: "list", role: "list" }, hAsync("slot", { key: '4baa8024e241ff80607839bcb74a3b37cc00f82e', name: "left" })), hAsync("div", { key: '89e025134ac6b299d17a839b128b1e9d4cebd0db', class: "list", role: "list" }, hAsync("slot", { key: '382e9e3033e9c1034d10d72a8d441b1e249b93b4', name: "right" }))))));
+            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: 'c8aa7075e8ab33484f13a8ef7ac8b2127b30ffe2', class: "container" }, hAsync("div", { key: '76d2daf0e82846945f3510cbc21fc26e8d29936c', class: "list", role: "list" }, hAsync("slot", { key: '12bced2c765270ea94a844b9c68d993e9d43f245', name: "left" })), hAsync("div", { key: 'fed6a6058becea2b85d0131488e212967ee9530f', class: "list", role: "list" }, hAsync("slot", { key: 'e51cf22766660164cbd150a6203d8e55929dd40c', name: "right" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarStyle0; }
@@ -18559,18 +18650,18 @@ class DuetToolbarDropdown {
             itemsAlign = this.element.parentElement.getAttribute("slot") === "left" ? "right" : "left";
         }
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (hAsync(Host, { key: 'a03134ac9fe7d5f02b65f2e2d971ba2ae2917151', role: "listitem" }, hAsync("div", { key: 'cdba6c57b783cf33ebb02779c157841d1f3a7069', class: {
+        return (hAsync(Host, { key: '71c0427eecb0676263c35bff4557210701d27e6f', role: "listitem" }, hAsync("div", { key: 'a5038335629483dcf2d049129ebfed49eae6a457', class: {
                 "duet-toolbar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 [itemsAlign]: true,
                 [variation]: true,
-            } }, hAsync("button", { key: '6e9e598d0b050543edf965afa4a039329225bf30', 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: '5be6ce290e94c6e03c8c49336f4ef50e4283a92a', 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: '994ca2b6041ac20bcf181d0a508d9af0544a49b9', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: '1f5e46c63cc1de968f174d6d86319ee0d934089c', class: "label" }, hAsync("slot", { key: 'e9f8b3231e608fb37d152cced5288b66f4ac4035', name: "label" }), hAsync("duet-icon", { key: '131452437b2bdca148bff41a245be592715af9c0', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '868b963973203d0d10ce080b273d28a569d5d8c2', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'e4e5076e21a084d205cb550946f6a7914911a4e9', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: '4a79cbc7d59d30c5f763050c44c61c03ae502e74', class: "label" }, hAsync("slot", { key: 'adecb2560eba25c9bdb1872fedc29c6b98c4d343', name: "label" }), hAsync("duet-icon", { key: 'ef92b887f19bd4145ae89b3d6ab05be6c3b2fcd0', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '61bb1eff472548331aab26b636fb4606fbc982f7', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '1e6a4a1d661c39acf3c7a66fbf3c3532b897df6b' })))));
+            } }, hAsync("slot", { key: 'bdbb39527038baf411f9f4770cf594bdb3e86378' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarDropdownStyle0; }
@@ -18623,11 +18714,11 @@ class DuetToolbarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '4af2710f36e24283c22b8c18882e2ffbd9087470' }, hAsync("a", { key: '14042423bfb55754bf44164fade567d2cdd05362', class: {
+        return (hAsync(Host, { key: '1c874f9ed81beb0ee19f1675e95dffd0a193e2ce' }, hAsync("a", { key: '8b04559cb61b8c25ecfd1511cc07de5a260f70bf', 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: '045f0d9fb5cc474dcac7444658549fa290ba6243', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: 'b8383c9956ddbe65a5c6f5b94f267f3dc09aa27a', class: "label" }, hAsync("slot", { key: '7ba816b6a70ed2cdcccdb91d166212c5b9f0770d' })), this.active && (hAsync("duet-icon", { key: '0cfcee7e092007e149e6aac61a285f15e9abd39d', 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: 'c58dd6c5edc6a41fe20c73876cbe5637b9d389ba', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: '93d7b57557f9999e2a790a94407e098a3b43350f', class: "label" }, hAsync("slot", { key: '3ef98fd8e64aebc17df819a375c2e38207ccf3aa' })), this.active && (hAsync("duet-icon", { key: 'a77c71f91778c5e70c0c23decc3ea9e23168422d', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarDropdownLinkStyle0; }
@@ -18648,7 +18739,7 @@ class DuetToolbarDropdownLink {
     }; }
 }
 
-const duetToolbarItemCss = "*,*::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;height:100%}.duet-toolbar-item{position:relative;display:flex;gap:8px;align-items:center;justify-content:center;height:100%;padding:0 16px;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:0.875rem;font-weight:400;line-height:1.25;color:rgb(0, 77, 128);text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer}.duet-toolbar-item:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-toolbar-item:focus,.duet-toolbar-item:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-toolbar-item[aria-expanded=true] .trailing-icon.rotate{transform:rotate(180deg)}.duet-toolbar-item.negative{color:rgb(255, 255, 255)}.duet-toolbar-item.negative[aria-expanded=true]{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item.negative duet-icon{color:rgb(205, 229, 241)}.duet-toolbar-item.duet-theme-turva{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-toolbar-item.duet-theme-turva.negative{color:rgb(255, 255, 255)}.duet-toolbar-item.duet-theme-turva.negative[aria-expanded=true]{background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.duet-theme-turva.negative duet-icon{color:rgb(244, 207, 214)}.duet-toolbar-item:hover{color:rgb(0, 41, 77);background:rgb(243, 249, 252)}.duet-toolbar-item:hover.negative{color:rgb(255, 255, 255);background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item:hover.duet-theme-turva{color:rgb(23, 28, 58);background:rgb(245, 245, 247)}.duet-toolbar-item:hover.duet-theme-turva.negative{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.active{color:rgb(0, 41, 77)}.duet-toolbar-item.active.negative{font-weight:600;color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.active.negative::after{display:none}.duet-toolbar-item.active::after{position:absolute;top:auto;bottom:1px;left:0;display:block;width:100%;height:1px;content:\"\";background:rgb(0, 119, 179);transition:300ms ease;transform:translateY(1px)}.duet-toolbar-item.active::after.duet-theme-turva{background:rgb(198, 12, 48)}.duet-toolbar-item.active.duet-theme-turva{color:rgb(23, 28, 58)}.duet-toolbar-item.active.duet-theme-turva::after{background:rgb(198, 12, 48)}.duet-toolbar-item.active.duet-theme-turva.negative{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}";
+const duetToolbarItemCss = "*,*::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;height:100%}.duet-toolbar-item{position:relative;display:flex;gap:8px;align-items:center;justify-content:center;height:100%;padding:0 16px;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:0.875rem;font-weight:400;line-height:1.25;color:rgb(0, 77, 128);text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer}.duet-toolbar-item:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-toolbar-item:focus,.duet-toolbar-item:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-toolbar-item[aria-expanded=true] .trailing-icon.rotate{transform:rotate(180deg)}.duet-toolbar-item.primary,.duet-toolbar-item.secondary{color:rgb(255, 255, 255)}.duet-toolbar-item.primary[aria-expanded=true],.duet-toolbar-item.secondary[aria-expanded=true]{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item.primary duet-icon,.duet-toolbar-item.secondary duet-icon{color:rgb(205, 229, 241)}.duet-toolbar-item.primary[aria-expanded=true]{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item.secondary[aria-expanded=true]{background:rgb(3, 56, 102)}.duet-toolbar-item.duet-theme-turva{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-toolbar-item.duet-theme-turva.primary{color:rgb(255, 255, 255)}.duet-toolbar-item.duet-theme-turva.primary[aria-expanded=true]{background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.duet-theme-turva.primary duet-icon{color:rgb(244, 207, 214)}.duet-toolbar-item:hover{color:rgb(0, 41, 77);background:rgb(243, 249, 252)}.duet-toolbar-item:hover.primary,.duet-toolbar-item:hover.secondary{color:rgb(255, 255, 255)}.duet-toolbar-item:hover.primary{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item:hover.secondary{background:rgb(3, 56, 102)}.duet-toolbar-item:hover.duet-theme-turva{color:rgb(23, 28, 58);background:rgb(245, 245, 247)}.duet-toolbar-item:hover.duet-theme-turva.primary{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.active{color:rgb(0, 41, 77)}.duet-toolbar-item.active.primary,.duet-toolbar-item.active.secondary{font-weight:600;color:rgb(255, 255, 255)}.duet-toolbar-item.active.primary::after,.duet-toolbar-item.active.secondary::after{display:none}.duet-toolbar-item.active.primary{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item.active.secondary{background:rgb(3, 56, 102)}.duet-toolbar-item.active::after{position:absolute;top:auto;bottom:1px;left:0;display:block;width:100%;height:1px;content:\"\";background:rgb(0, 119, 179);transition:300ms ease;transform:translateY(1px)}.duet-toolbar-item.active::after.duet-theme-turva{background:rgb(198, 12, 48)}.duet-toolbar-item.active.duet-theme-turva{color:rgb(23, 28, 58)}.duet-toolbar-item.active.duet-theme-turva::after{background:rgb(198, 12, 48)}.duet-toolbar-item.active.duet-theme-turva.primary{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}";
 var DuetToolbarItemStyle0 = duetToolbarItemCss;
 
 class DuetToolbarItem {
@@ -18682,13 +18773,19 @@ class DuetToolbarItem {
      */
     render() {
         const TagName = this.url ? "a" : "button";
-        const variation = this.variation === "negative" ? "negative" : "white";
-        return (hAsync(Host, { key: '11516108db5173962d464b171bda937ea1ee8a04', role: "listitem" }, hAsync(TagName, { key: 'd96f7785b4b44b47427e42feaf67d421ec87b749', ref: element => (this.itemElement = element), class: {
+        const variation = this.variation === "primary" ||
+            this.variation === "negative" ||
+            (this.theme === "turva" && this.variation === "secondary")
+            ? "primary"
+            : this.variation === "secondary"
+                ? "secondary"
+                : "default";
+        return (hAsync(Host, { key: '908f975e881c8970ba45c0642b3390dfd7589f19', role: "listitem" }, hAsync(TagName, { key: 'b374d84a34a1219cdd56ab4955cf19ba363540bc', 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.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: 'c8626052490a913781ed6584838b02d83155927c', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '5fbfcb6f90f3b361703c90848a164ca181fcc5b1' }), this.trailingIcon && (hAsync("duet-icon", { key: 'eba6c7cb4e69d84bb484a7914b1a4846abadd5b8', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '98e109ae48826ed28f9de9f2318e4498c71ddcaf', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '53104daf6c306c9a09771e266100ded5ac4596fc' }), this.trailingIcon && (hAsync("duet-icon", { key: '5df62f15ed1c718bec00adbfa2be048683446520', class: {
                 "trailing-icon": true,
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
             }, theme: this.theme, name: this.trailingIcon, margin: "none", size: this.trailingIcon === "action-arrow-down-small" ? "xxx-small" : "x-small", color: "currentColor" })))));
@@ -18741,12 +18838,12 @@ class DuetToolbarLink {
      */
     render() {
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (hAsync(Host, { key: '7f5f647cab17b662b98eefc40871e9bbb1ea60ed', role: "listitem" }, hAsync("a", { key: '0e23a4045370b6706ed875e15b6ae161127ad4b9', class: {
+        return (hAsync(Host, { key: '694d29ef22d448dab54882fe7134fbd1ad312807', role: "listitem" }, hAsync("a", { key: '1b15f80ca9ca005e38270486f35d54e24ed9d1d7', 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: '6945770c58a55dd974722d2966e26033f6417c6b', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '00cb434641f8e9399f667b5c2e772fe93e3f087c' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '0c59b1eb514f11e97ae11551086d601eda908397', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '0686a4460ff9e29ed306e60e92312e4d26e9749b' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarLinkStyle0; }
@@ -19000,11 +19097,11 @@ class DuetTooltipButton {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '409d3704a983f806173cea73c03d981054e3c6de' }, hAsync("button", { key: '426df6b2d139b2fc0bebcdafb1e8ab3d1633bd92', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
+        return (hAsync(Host, { key: 'efa80105fab1c39e1494f3bfc1de5296147b2627' }, hAsync("button", { key: 'f9cb29eb9d8de7c648f1352e05646ae6dbbfabfa', 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",
-            } }, hAsync("svg", { key: 'b7b5ed8d8cb3979f81938d3261c7049816e82062', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '6b3d544f0f09ee64b358e6a8e9f1cc7a0dcdd8c9', 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: '1578bebdcebb5186e29c5f026a825616199dd007', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: '7c8e34396e670e46b2640a507e24653fbf3485db', 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: 'e8505f0be91fa2bf49fefbdd415a5f42dc7b5212', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '414c12df66406a3ad2b2980b3ae3df69b6824113', 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: '0faf277a23d1d335b7bc294bfd4716c71e2d8e9d', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: '3493b88ce899857eac5d99a9d7738d49de377308', 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; }
@@ -19071,11 +19168,11 @@ class DuetTooltipPopup {
         this.contentEl.focus();
     }
     render() {
-        return (hAsync(Host, { key: '0505ed0cbdfc2184bce129841b824d49f8001687' }, hAsync("div", { key: 'fb29acd88d0b6f76e85fa8f86323c689e76a92bc', class: {
+        return (hAsync(Host, { key: 'dd9c74d0d1cc665bc19371525c8f0e34bbf3cf8b' }, hAsync("div", { key: '7267d10766b72402661236f995f5a97d46c23c52', class: {
                 "duet-tooltip": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-active": this.active === true,
-            } }, hAsync(FocusGuard, { key: '8c7134490cd4755b81c13f3315253046859c06b8', moveFocusTo: this.buttonEl }), hAsync("div", { key: 'b7029cf387be46aa709fe235e3423a96e9708373', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, hAsync("slot", { key: 'ee542792786783f96d8c642effad47b783d75795' })), hAsync("div", { key: '025ac152bd807712198087beefd28ed6367ba4e9', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: '6a7cf9e5e0e8041bb85296ccba14590e4ae160e5', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: '32c2c7ea24b5fb24aff18e59e3e22068dd7cd275', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: '20f6fcf5664b69ed51d6e181db1b0cc579e4b18f', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: '503b472571ac81e165ae397c126a7596764d8316' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: '3f291c5fcf7128f5f4ed13a0f870018f8f2e66e7', moveFocusTo: this.contentEl }))));
+            } }, hAsync(FocusGuard, { key: 'dce0d22d8078fa456e02a73b91166a822a3a5c14', moveFocusTo: this.buttonEl }), hAsync("div", { key: 'b00e807866589a3b23d8df3bd0544a6d8174736a', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, hAsync("slot", { key: '87e590edcc68e65af17e5dfcc950395b02397b8a' })), hAsync("div", { key: '15c29c70a6d455c3e72a057bf4c39735b3125f0f', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: '24b1ffb0c4e1fc0d13d0767af14bf0489e301384', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: 'e442b3e6601ea6dd4e3c13aaabfac5bdc19f0700', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: '317ce79e24d62bf4fb04818075ac66dded5efe1a', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: 'ab36a28b7e0e72e77e38d0dfe4a4010e34c7f37a' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: '957fd21d8182f67c90212865356b3e8e1f7f2e80', moveFocusTo: this.contentEl }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTooltipPopupStyle0; }
@@ -19183,14 +19280,14 @@ class DuetTray {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: 'ae9c60e60a3726b586a877b713a636af350cdda8', class: {
+        return (hAsync("div", { key: '13bd39115bce0b912b02ba3bea98630e5b59f5a1', 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: '8a8a2962dc7b033e4012197784bd17eb6e02077d', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: '9066cb6a1a302871c8ceb810d5cb8a41d7309735' })), this.hasAdditionalContent && (hAsync(Fragment, { key: '3b030ad2a029e5b2fe98ed81266363631cb33d54' }, hAsync("button", { key: 'ae7c2f4461b852b81a211dda393d0282c677193c', "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: 'ac1a683905579c10d002075527eb35c76e10d63e', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: '5af7e2f5309b52a853a83829030de0d654df2e3d' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: '4dd0e99ace8bd247803f5cec969e73b64d93ea93', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: 'cabe5e2ae0f180ef813e9bb5456054393853e1ef', class: "duet-tray-expandable-content" }, hAsync("slot", { key: '58a36416006744197c5429c39ad7e296acdb0a12', name: "additional" })))))));
+            } }, hAsync("div", { key: '62b6ccc2d61862c864bdb1b1df1335c293df25b6', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: 'f3ceb53ff7070c68575b652e7f319c0e026ab558' })), this.hasAdditionalContent && (hAsync(Fragment, { key: '2e8c7514a2690495709d1df955bcf6cd9ed488c8' }, hAsync("button", { key: 'd801cfaad3368a06de1c66c062926cbb5a20ef6a', "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: '400d87022ceb93037233d751bcf37a1f71c141a5', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: '5b869593b8143e03b6cd70aff5a2cc00d6f74311' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: '60be918ec73ac961785128be2940c1caea1ba62f', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: '2fb56e0a871d2aaeaf3463d37b1b7e1d077adbb7', class: "duet-tray-expandable-content" }, hAsync("slot", { key: '92ed88e9db8b97bbba2b8721dbc9dce86b35a8c9', name: "additional" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTrayStyle0; }
@@ -20306,10 +20403,10 @@ class DuetUpload {
             this.externalUploadButton.accessibleLabel = `${this.externalUploadButton.innerText}. ${caption}`;
         }
         // @ts-ignore
-        return (hAsync(Host, { key: '47088845ecb4eb7b0b6376abfb76fe4853e232ce', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: '9174acaf5e4bb74a2a5e934f9472a8e0f81a00ab', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: '33c273073b711205849af1b8747129df8f5a49aa', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: '72e0b98ecb18243ace50165a56c54d4a5a1e80b6', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: 'f399240107a2d820d694464eb17f1f8f15d416d3', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: '9fd58a29bf405ee57f265ae9203a841d227ad7fa', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: '29e911f2f7c2a58972849fdff257bff29796b155', 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: '77c8c91b540940b1600438ef9ab90405ad74207a', name: "filefooter" }), hAsync("slot", { key: '73fedfcd5c0da1b67641be714862cd53a538f1da', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: 'd3fcc02af5d23c9a5c63711aa7bf2c9007dd3c5c', margin: "none", size: "small" }, hAsync("div", { key: '056115def027445826519a3835ad986b94034a19', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: '441f7001a92cd16da7057dfd3322e69c889634ca', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: 'aeea5d8e263240e60e80626b60278cd69293d086' }, hAsync("duet-spacer", { key: 'a5c3d8ad58100315f810e9eba30b4a7f807e35cd', size: "large" }), hAsync("duet-button", { key: '5bd13f62f6eba606e15bd0906d4a128b2766ec62', 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: '0928fe31d31d2ec7481d2d183030d0ca5d1947ef', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: '2c93b996af34d507e34e023448f0c1e4549a880d', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: '3bb648923cccffaa69e98860d83872f73916163e', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: '234af7db63e4a6a80b7377fa9f10119dceafeea5', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: '0f19455051783737acd9e1bc63e6110769259e03', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: 'da0921ac4e50a44e73754896b764ae09006b3108', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: '628029484dce4779a873ec34178db780b1c2d6c8', 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: '26e663f865b1cbdf0ba90075874e802de9305004', name: "filefooter" }), hAsync("slot", { key: '6b916ac61c96bf8bca9538028970758dd4e4b5b5', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: 'c20ad82bc20844b36bebfa2992b6cac433cccf09', margin: "none", size: "small" }, hAsync("div", { key: '4889907ac986c5f36a946c9f3d04c9a6821e7e4f', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: '995c37faba55c6bc4b08b36aae53fce3a94cfd7d', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: '99f5276b9cef93ba5d427fc0d2074acb97902c39' }, hAsync("duet-spacer", { key: '35fcdf7b38b7378541215a124a08c533d41b5f8b', size: "large" }), hAsync("duet-button", { key: '310afacbfe68294b874e78c69a8a1dc8c5386681', 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: 'fdd3f06419a9c8437ddb1d962351059e93def138' }, hAsync("duet-spacer", { key: 'e2c3381bd500af7106ff5588f94c506c5822ad20', size: "medium" }), hAsync("duet-alert", { key: '0c263312767097ef7a49ccced847b8e152a389bd', 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: '7911b165d5356494f0b0226780bc2661631f0cb0', "aria-hidden": "true" }, hAsync("input", { key: '1731f7a716bc198465165d1e9cda99619e3a691f', ref: input => {
+            this.filesToUploadTotalSizeIsAboveMax) && (hAsync(Fragment, { key: '71f40749e207e7619be153e162dd06f86e594e74' }, hAsync("duet-spacer", { key: 'c1b60f29904f00337d6a5fb5a27c264cda066af3', size: "medium" }), hAsync("duet-alert", { key: 'f531e160c81ff5d39a4d1a7ceb212df79f87f247', 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: 'eaf2283056f5c33fc56a2df78c6e0889c2f5858c', "aria-hidden": "true" }, hAsync("input", { key: '832fa6c617a6316638d9cfffad7c90bc34612deb', 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,
@@ -20630,7 +20727,7 @@ class DuetUploadAriaStatus {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'd864d9d774a1124e36b83d555a8f660ee1ae37f5', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: '4fc569791044395e69a60205f69d9fd423f59e17' }, this.statusMessage)));
+        return (hAsync(Host, { key: '28cd5bb1f92c9b403b91c6abf2cbedb12415069f', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: 'fbc14d38d44e631ace4e2e9c2f6b4b79119c36fd' }, this.statusMessage)));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -20809,9 +20906,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: '4533ec72c2292fab5f0e61d2190d171f70db89cd', class: {
+        return (hAsync("div", { key: '6068d22652581c24a76529c17789f273ef783fe5', class: {
                 "upload-item-row": true,
-            } }, this.showCategory && (hAsync("div", { key: 'dd80cae48395c2b36a5182849099b99dc9c77d87', class: "item-categories" }, hAsync("duet-heading", { key: '2215960ba1fcfd9ae42f801dc6ee518f598de992', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: '5d864dc3005e9ffb3a264dbe31e11772832039eb', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: 'd54592fef74ce524b41811a4f15b8403728f256f', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: '18d338783bd27afaf5aa610e92fa2f930618bdbe', class: "item-actions" }, this.actions.map(actionItem => {
+            } }, this.showCategory && (hAsync("div", { key: 'bcb47afffee8efb622819a52f7ba10463c5e328f', class: "item-categories" }, hAsync("duet-heading", { key: '021af13718fefc9993bcaa88de91dbfb21297339', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: '040671e2048b29b787ac9b479e1c8eb025c8e7d9', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: 'bd2ac730e76d30ada414f82940529f25c5d49227', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: '6a9d59dfa89eb36625d54238b0e2dd1e30853b34', 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) }));
         }))));
     }
@@ -20852,7 +20949,7 @@ class DuetVisuallyHidden {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'b07c17d0129eeb4ce43a2c4719da212c177bfb70', class: "duet-visually-hidden" }, hAsync("slot", { key: '58b55523cd8c6385686fe910d42bc17eff2bfca8' })));
+        return (hAsync(Host, { key: '75782b03708912eba3e0d42dc1d48cc33d81a01a', class: "duet-visually-hidden" }, hAsync("slot", { key: '5e1d99058a2a17144777554316c1b03c22d1b283' })));
     }
     get element() { return getElement(this); }
     static get style() { return DuetVisuallyHiddenStyle0; }