@duetds/components 9.1.1 → 9.1.2

package/hydrate/index.js

@@ -1262,7 +1262,7 @@ var updateElementScopeIds = (element, parent, iterateChildNodes = false) => {
   if (element && parent && element.nodeType === 1 /* ElementNode */) {
     const scopeIds = new Set(findScopeIds(parent).filter(Boolean));
     if (scopeIds.size) {
-      (_a = element.classList) == null ? void 0 : _a.add(...element["s-scs"] = Array.from(scopeIds));
+      (_a = element.classList) == null ? void 0 : _a.add(...element["s-scs"] = [...scopeIds]);
       if (element["s-ol"] || iterateChildNodes) {
         for (const childNode of Array.from(element.childNodes)) {
           updateElementScopeIds(childNode, element, true);
@@ -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: 'a98ddf68ce6e0d104c642e48a2d5d6d5660498f4', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: 'aa121dca4645858c43d9d81bc29ec710723a026f', class: {
                 "duet-badge": true,
                 [this.variation]: true,
                 [backgroundClass]: true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("slot", { key: 'cd8684571510bef387f5da513d38e8203dccd104' }))));
+            } }, hAsync("slot", { key: '9baaff220b3bfaca21de1951ecc81fa1dde17c03' }))));
     }
     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: '469447515096cfa85132eb550ed925b796a87b6b', role: "listitem" }, hAsync("div", { key: '0b264055e49b6603b803bea06f4450e937b1a424', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: '0a175a06d4230eeace901b741ba9a08f2947a3ba', class: "duet-breadrumbs-arrow", size: "auto", icon: actionArrowRightSmall.svg, margin: "none", color: "currentColor" })), hAsync("a", { key: '501dd186b46c158775b992863689014d4b520927', 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: 'a7993d28976f091a7f8291378990dea66413be57', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
+            this.hasSlottedContent && hAsync("duet-spacer", { key: '966433c4f0ec2c663dfeff67b8b70ae913d6a5e8', size: "x-small", direction: "horizontal" }),
+        ], hAsync("slot", { key: 'b98f199af76f8596bb8d06af9dc277c89ed03870' })))));
     }
     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: '8a9b4d9db25877fedbb9bbbc6a7f3c70ddc972f8' }, hAsync("nav", { key: 'c66a5b2ab26e65aea1d4cb624c5fd5e57b165d0e', "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: '23194ac8d39fcc089a5f16689fdf31f6f5bbd630', class: "container" }, hAsync("div", { key: '924ce340d38e919201c361c402b5b2ee7d25f6d2', role: "list", class: "list", style: { color } }, hAsync("slot", { key: '0fbdd33ff72667c2cd845f407a85719349a70eab' })), hAsync("div", { key: '11493cfc88623feebae218352c8f9530a3c2456c', class: "bottom-border bottom-border--container" })), hAsync("div", { key: 'd5f962874148aab37813f688ba5ff77bddb30533', 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: 'f15d0650bf33e9ca7f1ce28065ff46f9ec08066d' }, hAsync("div", { key: 'ee7e16c113b6a5229be9cbe4e6f52972b0403a4d', 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: 'b1209eb4a81b1c71e016f311cb8143e8358fb70f', class: "container" }, hAsync("duet-icon", { key: 'ca683a906622a8c8225b07176b1ee19df3dcbe6d', 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: 'e9198af97b7db83a4c6fbe60f65ed1122cb9b398' }, hAsync("slot", { key: '378ba5f182620048730e714c00d4433d9bd684ff' })), this.hasAuthorSlot && (hAsync("figcaption", { key: 'b170bece235f975d0a0139d5c0bdc0571c782146', class: "author" }, hAsync("span", { key: '7917d19b5a7d199798346250719da6618b31107c' }, "\u2014 "), hAsync("slot", { key: 'be8a7f6bfee1c152a8cc79978d0163d299fe52d8', 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: 'a365402604e0200c435b64dfcacbcd5cb642844e', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: 'cf11461aef561948a5533f4e80564656374ebdcb', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: 'dcfe8bd19c06e1b259bbc03e18ca468f1dc5ba00', 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: '7c6b1f9fd55e641a7f91171e622ce1f8725d116d', class: "duet-checkmark" })))));
     }
     static get style() { return DuetCheckmarkStyle0; }
     static get cmpMeta() { return {
@@ -6960,10 +6960,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: 'c532807993d52b8f0054daa3af2c7f80e61fa810', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'bdd79055f3abe795b0ea44a9d7fdf7b08c656b60', 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: 'f8d9f6d95737f5c485222a502b9d2502ede2a1cb' }, this.name && (hAsync("duet-heading", { key: '10f87bf9b703fc0a609424b9d29130331b6151d8', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: '9681851717e78eda1148c1117abddb24b4c12aff', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: '6bf8e40774ac3672d0e74b1e251e8c48e70762fb', class: "email" }, hAsync("duet-icon", { key: '2065dcdc7368544f350baf4635052d8c52c4b79d', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '552d329f8d98ab48633a920b6ca39737a7fc1f75', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: '8670d1b4a2672a8921f4e4a49291873094261b7b', class: "phone" }, hAsync("duet-icon", { key: '3428663c19aeab970654ad2ddc5e9e33a0a41259', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: 'f314ea75ea7d635b4fc128716dcc0aee5ff7b254', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: 'e2345368c3ba15cd74835e2aa61923038b3a205f', class: "call-to-action" }, hAsync("duet-button", { key: '921f29a51d7a163a2246b451c3cae550cee443d9', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: '9d98b0a893846972eac2a2285ad39e6f09a52fde' }), hAsync("slot", { key: 'cf3781665288e173c754529dce701b834631c3a1' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetContactCardStyle0; }
@@ -7260,6 +7260,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 +7289,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 +7383,7 @@ class DuetDatePicker {
         this.open = false;
         this.focusedDay = new Date();
         this.inputValue = "";
+        this.internalValidityError = "";
         this.theme = "";
         this.expand = false;
         this.name = "";
@@ -7395,10 +7418,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 +7639,7 @@ class DuetDatePicker {
             "open": [32],
             "focusedDay": [32],
             "inputValue": [32],
+            "internalValidityError": [32],
             "setFocus": [64],
             "show": [64],
             "hide": [64]
@@ -7936,20 +7969,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: '4da3e5f66820460f1ef0493f60f630c76d818473', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: 'ed739d61e287215e42e4506b4c71595540bc361d', "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: '2bad3be10867df4d945fd05b0dc208107ed6a792', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: 'd6cc673f67359ddd2ee7e5edd740de0c465e1ac8' }, this.label), this.caption && hAsync("span", { key: '1831049370a39c6d8ac1e63cad3f56516ffa2073' }, this.caption)), hAsync("div", { key: '58aeac7ddfee203189ab2e9f9d796b370de6ab89', 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: '5572f59933addae60637f304ffb1dc900313375e', class: "duet-fieldset-label" }, hAsync("span", { key: '35c227c6950d0d5f2717a967d3d660022ef91915', "aria-hidden": "true" }, this.label), hAsync("slot", { key: '1e0b4cff03a36a0e101e972b36d5bbfeef399e7f', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: '139fb6fddaace73d9ef5e0d6c3c07b5281641f65', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: '4603eb768b61f4b6b342c5b08549dd708bcc2c1b', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: '6e0732f202a8228c0b5c10d2dfe54f072e829837' }), hAsync("span", { key: '90b501fd275d5bdd63a500c2478e0831b48f2fbe', class: "duet-fieldset-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '55be98cfad770433b98a20fa045e1bcb15433441' }, this.error)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetFieldsetStyle0; }
@@ -9576,11 +9609,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: '31c5135f5c8950e7289e947331edfc1f27086274', 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: '5cf6bd4d1d466181ee1e7277a043b1c0bb0d46ef', "aria-hidden": "true", style: styles, class: {
                 "duet-icon": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
@@ -9589,7 +9622,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: '3742ad60c14b0f10d67cc2ca1c22b1446ffc6725', "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 +10139,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{position:relative;padding:0 16px;margin:48px auto 36px}@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)}}";
 var DuetLayoutStyle0 = duetLayoutCss;
 
 /**
@@ -10321,10 +10354,10 @@ class DuetLink {
     render() {
         const Tag = !this.url ? "button" : "a";
         const isButton = Tag === "button";
-        return (hAsync(Host, { key: '38d90e4467279d94a029c7ce5fdaf9fa3590d5ae', class: {
+        return (hAsync(Host, { key: '75eb01922ce99815e41ce9ad2debcd3a7adf0289', class: {
                 [`duet-link-${this.variation}`]: true,
                 "duet-m-0": this.margin === "none",
-            } }, hAsync(Tag, { key: '5b1b7b691a3d66382b593a07fd47b3072fcd12fb', href: this.url, class: {
+            } }, hAsync(Tag, { key: '939df1d20c0a1e9beca877828c2e5aea3b6d6279', href: this.url, class: {
                 "duet-link": true,
                 "duet-link-is-external": this.external,
                 "duet-link-is-download": !!this.download,
@@ -10497,14 +10530,14 @@ class DuetListItem {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '5ca1067fca4b44ef1a3b57b52e775407879ab750', class: {
+        return (hAsync(Host, { key: '51727fd3a93ff7c60c621ac1d7e7cc81f968c64c', 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: 'efa1422d25f7b0b30977b274edd33c65ffbb098a' }, hAsync("slot", { key: '985fb259b41d4167c1b30101a8774672b3f04366', name: "label" })), hAsync("dd", { key: 'b2708677ba4d4b9695f44dea7249243db286552d' }, hAsync("slot", { key: 'fe82ff7e6aa8ba8862700260087dcc1e4cd9a5ed', name: "value" }))));
     }
     static get style() { return DuetListItemStyle0; }
     static get cmpMeta() { return {
@@ -10838,10 +10871,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: '010c3762832e9c231e6a5854d41fb1c7f4fa28c5', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: '6619916a523cc1fec742686d79f04ad770cc4fd9', 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: 'b0d060dca6c2cdca71babf45905f4ef7e4329c57', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '938d21747a7753f9bbfc91e10d39ff0b716fec43' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarButtonStyle0; }
@@ -10924,17 +10957,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: '0b4e584af1d151a1e50ec8d9e4b573ceaaccf359', role: "listitem" }, hAsync("div", { key: 'cdd13fd6b2c823bba5df313ba88c5b7d06db4ffb', 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: '5674f60fef98e6e184f2fcccc764deef331caa12', 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: '2579445ac0540e1c097ad5af4197743ec84cb1c8', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '3f1783c651ff0c6d9350e4f69d38a029279c9aab', class: "label" }, hAsync("slot", { key: '321d0f11ab687b2324cfdd4320a48cc343ead7bb', name: "label" }), hAsync("duet-icon", { key: 'f3f61be24eec78ead6378f1810ec73f2ec8926e0', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'cb3e00c6342991645136a04cdc2a8075df1cb25a', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'da2e4f2687f3aa80426a260df734e79cdb69c48a' })))));
+            } }, hAsync("slot", { key: '8c626d701bb71d84458580a3c17a50ea34c894ed' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarDropdownStyle0; }
@@ -10994,11 +11027,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: '338a7ca1c696467944414aaf0ecdf7628803dc2b' }, hAsync("a", { key: '1160b7ac731c82021899fa8d7c49b9f47517b942', 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: 'c82028bea753c8ef4199c146e8d30882284bfb81', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: 'fb472a9792cb0bcd581fac7ec95c08b5591034d1' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarDropdownLinkStyle0; }
@@ -11050,11 +11083,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: '8e7241649b951194c60825a37fe5510977544e0c', role: "listitem" }, hAsync(TagName, { key: '5b09cb58b5161434694f4aed6d07d0c4e1b1cd55', 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: '09390cfac47f512732ef0e06d619dbbeeaf78e85', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: 'c40f41f6be5fa7273bcb2c74dc7eabbf99b8497d' }), this.trailingIcon && (hAsync("duet-icon", { key: 'f5df545b4fab627ee14271992a8372992a78268d', class: {
                 "trailing-icon": true,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
@@ -11105,11 +11138,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: '0bd31ec6a4067c93d4aba6cc9f4944071a7941e8', role: "listitem" }, hAsync("a", { key: 'b3457c0d37c58608940f7c4393bf527fd64a3bff', 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: '2c208b3c951b892fb2370804517d0f0ade12c747', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '8153a5aa5771e0337219a845d80e5c5733152594' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetMenuBarLinkStyle0; }
@@ -11743,7 +11776,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: '925ca1d521d5335df3d278e2f48d2193cc55cc25' }, hAsync("div", { key: '8fecbad03cf107aedec51281333d468522529c12', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: 'b9f0bd0baee561747192ab5ed2ec1430a55e69eb' }), hAsync("slot", { key: '61b7f4ee44f4527b53ba42cd24f149bbdb2d0d33', name: "mobile" }), hAsync("slot", { key: 'bbacd508275e4ba6290f8dd66f0a657d5e647156', name: "desktop" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetNavStyle0; }
@@ -11802,11 +11835,11 @@ class DuetNotification {
         this.linkElement.focus(options);
     }
     render() {
-        return (hAsync("div", { key: '96c5142b088c958a661411f3995f673e2ccc621e', role: "listitem", class: {
+        return (hAsync("div", { key: '7c7b69217ccc0410e4d2a3b33b241e0657a502d3', 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: 'cdf2aa9efddcb0471a0a967feb2534a3c37a93c4', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, hAsync("div", { key: '668b15b89a94d14dc95f763e71db811832aa8df9', class: "duet-notification-container" }, hAsync("div", { key: 'ed6d05d93c06e30bd35b5d0c8e00ea310b6d20a1', class: "duet-notification-badge-container" }, this.highlight && (hAsync("div", { key: '28834605820009251e38ab8fc51f6cb91161ada6', class: "duet-notification-badge" }, hAsync("duet-visually-hidden", { key: '613ae447d1252abb249ab19e2f08196f86c1a55c' }, this.accessibleLabelUnread, ":")))), hAsync("div", { key: 'dece54d84ef9cb9306bff4932a0373d14fc67bf0', class: "duet-notification-content" }, hAsync("slot", { key: '43d66402c4b87e0bc492e56178fd59b57fb2410e' })), hAsync("div", { key: '04a0d2f31316d13ea68ee2b6de3d26f128c63113', class: "duet-notification-date" }, this.date)))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetNotificationStyle0; }
@@ -12447,12 +12480,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: '29388dc76adf582ffc0c740e5aa5de47acd172d8', 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: '4e801223af0de7ca3a5769be9bc301780456c355', class: "background" }, this.theme === "turva" && hAsync("div", { key: '50806ffa6f4c5bb7fabce5e9e905666f892e4918', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: '0e8a41703460f97a1450564687d16ba5efabcb77', class: "brand-shape" }), this.theme !== "turva" && hAsync("div", { key: '8ffbcc8fb0c4aa7b3caa062053cd880375ae12fb', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: '8014cb4af987c4cc71a0443bdafdca54f9536be5', class: "brand-shaped-icon" }, hAsync("duet-icon", { key: '829eaf116a734165393a70782266df6d0ab85484', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: '23c3d146c237f9929b71fe2c22f36b77b6afab6f', class: "heading" }, hAsync("slot", { key: '325ae5ac88d1a6e66fd3bad80b101703bbf69175', name: "heading" }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPageHeadingStyle0; }
@@ -14752,12 +14785,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: '15e241ca4500fba19ae5c931200d929f7c26feab', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: '762dec6d01cff5f5850f16176f306ac1cbf2f4d2', 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: '76e2710c25b70b7310756f47d072e762e88bc247', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { key: '699f6cf997f4a59c46fe2ede3a6b4ae74cab3ab6', class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { key: 'bfa918f0068b2aec0496cfd9a681b8ff89ddbc4f', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: '4a5504dac64db3f856e37425b2af6bc88c82cf2c', class: "pre-heading" }, hAsync("slot", { key: 'f83e1dd97784f9544dcf8bc638d91da52e1552f5', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: '5588c3bf5dfb560a7b778a6bd644b67853b7d52f', class: "heading" }, hAsync("duet-heading", { key: 'f5940bc4f214466b485a1836683e1aeead0e87c7', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, hAsync("span", { key: '23f5ffc9111c2a40cacbb9b7c5b6bda3dd142b23' }, hAsync("slot", { key: '2b5c24d08332aa20d04287b5694e9bc03b183481', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: 'e076b2091a72aa687e188f96e26260d92a7c348e', class: "description" }, hAsync("duet-paragraph", { key: 'bbf71a9b26b3e84c028b53680c024fd3dd644761', theme: this.theme, margin: "none", color: this.textColor }, hAsync("span", { key: '73f2a19b25f92101b65d3c2a81becdb2d03c13ff' }, hAsync("slot", { key: 'a7da789756ddc98fec9cdc3dcd988a7d9b8ddcc4', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: '02e40e9d53bb5d954455a63340af25b95e5c2e03', class: "action" }, hAsync("slot", { key: '5db34d5353f04f26a5934c35f8a21dfbb7d753ed', name: "action" }))))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetPromoCardStyle0; }
@@ -15596,21 +15629,21 @@ class DuetScrollable {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '3b54a0e0a539b3669e6b960b63d4db530828a6d3', class: {
+        return (hAsync(Host, { key: 'e45f073935f1dc5ed9c7a7cfe10bf0c5f10bc02b', 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: '59991362841374b6289f057ed20af29deddd9a5c', 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: '0364196174423e4e415838c766406ad5cee801f4', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: '26fc22d06a9f9309531f2eb95f33197c24b461aa', name: "collapse-button-label" })))), hAsync("div", { key: '0675d0c8473a5da30b830dc02a16dab57e24c717', 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: 'e173cea4d9d7885e100240341d74bf154a7e92a9', 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: '11baceae175809b6f60d8c16ef5a33bd72db7793' })), this.renderFadeOverlay("right"), this.buttons && this.renderButton("right"))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -15640,7 +15673,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{position:relative;padding:0 16px;margin:48px auto 36px}@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}}";
 var DuetSectionLayoutStyle0 = duetSectionLayoutCss;
 
 class DuetSectionLayout {
@@ -15655,14 +15688,14 @@ class DuetSectionLayout {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '0513022fd72635b7a29f28bd2d4c499efab5924f', class: {
+        return (hAsync(Host, { key: '6ba318c87d1857d74fcd7668a442061cb3582e40', class: {
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, hAsync("div", { key: 'f63b99c09e8b7d188e7dee578d6ed7f6f9b3a274', class: {
+            } }, hAsync("div", { key: 'a21b547f2d8b9b38db4208e86f6d462a643e8fb3', 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: '542b565867aec7ff0736c6847e3e1760375daf5c', class: "duet-main" }, hAsync("slot", { key: 'bf878319707f25d3305e61ce8a3d9b4061b18d4f' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSectionLayoutStyle0; }
@@ -15905,9 +15938,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: 'a8c6768d6fd86592319c1ad2e5223a59a2be138f', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '18ecd687fd2a3d951a8910cca4a90aa73d239243', 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: 'ede5d048662220a9ef915ff561823aef9f14f0e4', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: 'abb799417eb975033305e86b49a7c94d2e295465', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
     }
     static get style() { return DuetShapedImageStyle0; }
     static get cmpMeta() { return {
@@ -16542,7 +16575,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: 'b832cca7ed377a76ec8d9143183c7372e350d638' }, hAsync("div", { key: 'efc13c835605f4db9b0aa5834b2228fb89978acc', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: 'a4e0267ea4b034d2efd5829caf0e63e320a84f75', name: "navigation-language", margin: "none", color: "secondary" }), hAsync("slot", { key: '9aeec3a4b303eba1e710eb507f9de2a6ad0b6cb3' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutLangStyle0; }
@@ -16586,12 +16619,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: 'a28cb226d2a99a20bb467c357756e2c18cbb89e9' }, hAsync("a", { key: 'a0ff0473ac78ec679ca5aeb7812e93730340225e', 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: '5f15da3846d0e66ee2fba545d3007455ba5d569a', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), hAsync("div", { key: '12f98f82b672d208352a8655682af03b203f1f40', class: "label" }, hAsync("span", { key: '9c91eb6ede7be21f17ed1587e1ff5051bd670ab3' }, hAsync("slot", { key: '29819c368acb2787ac703e21675a98d243c07285' }), hAsync("slot", { key: '80397b73456e7963d4c276ca69cd07c9d85f814f', name: "description" })), this.caret && (hAsync("duet-icon", { key: '55ce9fab82642277d1246130397dc0c5c7248ed6', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutLinkStyle0; }
@@ -16750,21 +16783,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: 'a5c1eec78534ae8db8761d48b76978ca2ded8e35' }, hAsync("div", { key: 'aa93bb12f4f97f9bbef331eb7cea1e931e65b7cc', 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: '5990bb80c52d510fce212b4cc8fad608739f8d42', 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: 'ea71530dd8a823272b2ea36de72dd21199dd445a', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: '575f875b4d6f064432a97287d9e684cdf9b20669', class: "label" }, hAsync("span", { key: 'bebaf60d3c1fd76a4ec6dccc9323a1bbb9566694', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: '5e6ac4f9f3bc0010630a09bf81994e04222501b1', name: "label" })), hAsync("duet-icon", { key: 'e076639dc902c33f9f0c42e53b3b2b752a9157f9', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: 'bf5b0f13572d5d9b9545df036812d02bce2620a1', 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: '541fecb5051d8b6806c5aa7b50326b1f46eeefe9', moveFocusTo: this.closeButton }), hAsync("div", { key: 'db0146241dce60a5cfc5bd3322639b513a015311', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '905caaacb647cf1c9dc9af4c03b69476653d1138', class: "top" }, hAsync("button", { key: '8ae12cbb18bcf43399b1ea04b24b07d70910edc7', 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: '003116e8f89c352b9df846a570d1e422fac49a57', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: '5005dc1a683188c01552fae3476249deda621e0f' }, this.label.innerHTML), hAsync("button", { key: 'bd452a3c82b967e03c8a0e3d02af9e1c3798597d', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: '8ee0d03ef0e79382c30379f32d2d9a1a8d75402d', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: 'c3cef830db93ac7895786faa7b9a5d5d54c6e35e', class: "sticky-header" }, hAsync("slot", { key: '198f7584ed3a2694c1669a4378b93ddf7ddfea9d', name: "sticky-header" }))), hAsync("div", { key: '73b1becefc58307429e8cbf003376efda1817526', 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: '86e3442c8f251c91e30b3c9e279a2080106a3d84' })), hAsync(FocusGuard, { key: '4c88ff3bd62b5183cc5647c1874e10964b14b6be', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -16833,16 +16866,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: '4dd2ace190b42dc603842e0a68bede86a0576849' }, hAsync("div", { key: '3bcae1d437eb66927c58c9d6394668f7e89b96c0', 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: '0dc6a0b34fe49504c0a3d50e2d3bc5b46f0edf47', 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: '0210db38d3f9ddcfb8d06635554d6d59a655fdf9', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: '4cd6d589071a450df12bad944193b1cb1ad884ce', class: "label" }, hAsync("slot", { key: '9426c6a0c178440bb061f2beab412bc89aaab672', name: "label" }), hAsync("duet-icon", { key: '1e1c91b9e194bc0e96b46659e469447ea8a189f2', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: '05ac5933fa4af767dd52ac778b7a95a9fdf30a1c', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '8bc5889a6505974a8929651a8abd6b4fd98e5f74' })))));
+            } }, hAsync("slot", { key: '5d9e9507bb4d8ec3ce3dcc4101b9a1ff432af55a' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSlideoutPanelDropdownStyle0; }
@@ -17309,19 +17342,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: '46b42aaf1cf7b5948285be8b8fada1fbb895c29c' }, hAsync("nav", { key: '24fb21f0c3223068128475fee9e711c407c6cc42', 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: 'fdae5917434838629bea146c0fecd71d6eba5a49', 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: '741ee52c89789d6f29807af0318e7ad3ce387ea2', class: "label" }, hAsync("slot", { key: 'cc032638072e4bf611fa6f90f4e87a06d6d62011', name: "label" }), hAsync("duet-icon", { key: 'e5d275e6378ca608e4770cf01548db63c53fc921', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: '4b3528bc077697f379eee779e85cbd8a0ddb407e', 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: '22d201c917df952f74c4ce0f28786cfca78c6e5c', 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: 'c602c78831309546c9e825b1b7b77fc92dc3f0fa', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: '0a329fa6a2e485a50588f108544dfe414480a3b6' }), hAsync("div", { key: 'cbe81c72e9210a0384d82a5a827a54edf890f020', class: "list-padding" }))), hAsync("duet-overlay", { key: 'e802c1912aa5dc34d0dbf0e265190fc7ba27a1d3', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -17442,18 +17475,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: '361b820b8f227befb95bc64b87c761c2d0396a4f', role: "listitem" }, hAsync("div", { key: '53210cb90b3d5e714d1d8e30cca928b9ca22e416', 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: '2df474dfe088be14b042114456474c876f4b61a0', 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: '89d102ebae36a02c887f3824fffaa4271590d92a', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '31866b710f3df48bfb0aa0dcff165e617e8cc327', class: "label" }, hAsync("span", { key: '193d3e662d773b7ce3bc8e67265469fb254d8f1f', class: "label-text" }, hAsync("slot", { key: 'a1c2a3a7d385a99ad697244ea8ff303bc9f62d34', name: "label" })), hAsync("duet-icon", { key: '7190348fc2dd0ea59e407be5b60de9476a349594', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'c0cad51034312dcdb9ff9ca435f9091ae9ecfc55', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '9648718ea62884b361f4cf695b8bc08fcaf42434' })))));
+            } }, hAsync("slot", { key: 'e53f34efca52841432dd37b703f1ffdaa68eb940' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarDropdownStyle0; }
@@ -17505,12 +17538,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: '64c7a859f5b865bc0308445b9d0156156837fe49' }, hAsync("a", { key: 'c44943bce8c5a15f3ede97c010eff57f7f7941c7', 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: '83939de1b509ebcfc60714398b51dcaf374d6b30', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: 'ce3588496af8ffac960897c667027edd97ae5e65', class: "label-container" }, hAsync("span", { key: '752537ca0a31718f20089bb9804ba19b20c0c443', class: "label" }, hAsync("slot", { key: '16331721c331936cb46311d02038526b00b7bcac' })), this.caret && hAsync("duet-icon", { key: 'ac8613eceb672049fc7d6c05c51e2216d93b61df', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: 'f18ca26aca59468eac301dd11a1f13a0c77aaa31', 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 +17605,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: '0e1724544b134f6de86d56dd739a9635f337e717', role: "listitem" }, hAsync(TagName, { key: '6f04e57ea3e9bf27a1967283e2375a281d675529', 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: 'e1b98f949d70182538731d1d7f07bd961fd79836', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'af220f398f6bdc969c4de91c5bdf03cb814631f0', class: "label" }, hAsync("span", { key: '6b376bcca90ac606bd44f4dc04026d8eda710004', class: "label-text" }, hAsync("slot", { key: 'cec40ee0c2ca47ee02e3b0ede33d41d8a0e6d797' })), this.trailingIcon && (hAsync("duet-icon", { key: '243fd913a9c6d73489e2d1bcfa60566fa72bfcf6', class: {
                 "trailing-icon": true,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
@@ -17629,7 +17662,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: 'ab3dd8345454b3f0c20458f6302dffaaee6cc002', role: "listitem" }, hAsync("a", { key: 'bcc31509ceddcef3f2c3c58e29c5b108eb8b432f', 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: 'f5d87725bdb14e435d6d4b04ef0c84b1de5d1a3e', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: 'f24d079552fa8ce924d8dd3125afe01bbd331ab5', class: "label" }, hAsync("slot", { key: '669772430086a3f897f68ab40b5703a75e631f3a' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetSubmenuBarLinkStyle0; }
@@ -18102,7 +18135,7 @@ class DuetTable {
         }
     }
     render() {
-        return (hAsync(Host, { key: 'ae58f00a875348e1bfe6a6c15baa15ec447ceb56', class: {
+        return (hAsync(Host, { key: '0ba86b55e9fd8e291fc94aad48b312107970d243', class: {
                 [`duet-table-${this.variation}`]: true,
                 "duet-table-flattened": !this.matchesBreakpoint,
                 // sticky only valid when in regular table layout
@@ -18111,7 +18144,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: '886e2b664a351ba71a333ee8c256ed02465b0114' })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -18138,9 +18171,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 +18334,20 @@ class DuetTextarea {
      * Always the last one in the class.
      */
     render() {
-        {
-            return;
-        }
+        const identifier = this.identifier || this.textareaId;
+        return (hAsync(Host, { key: '95fd5e5a71db0cbdbdb4e4f51c031eb38e98eb20', class: {
+                "duet-m-0": this.margin === "none",
+                "duet-has-counter": this.counter && !this.error,
+                "duet-expand": this.expand,
+            } }, hAsync("div", { key: '417ef9e56fbc4667adfcddd29e709b86b3c29496', 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: 'c970faa68895f7c718c3461ff56b36ba51ca2b39', 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: 'e819a4b2a028a99b64c2065f4c9f6029600d2acb', direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), hAsync("slot", { key: '3ec4fdbb3f16f533c56b73d7f9c435345f4ce0ce', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: 'ac0b106adb6889cb8eb4878fb26f4e8e2dda7188', id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), hAsync("div", { key: '7214df64bab9dce0d99d3ff2a96ff2e010d2fb83', class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { key: 'ff3814fd43da859de1cf2269bf6e2b55cc34fd9c', id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), hAsync("textarea", { key: '56f4f30b7d7ee1407aefe788835ada1305f7bcf9', 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: '622cfa8317fe37f645b1180c6ad35f59b8351fa4', alignment: "stretch" }, hAsync("duet-grid-item", { key: '9a1ef5419a5f72b2d23986eef1681b547067c5f4', margin: "none", fill: true }, hAsync("div", { key: 'd7e0dcd97261a2ee0744b19efb5c6f78ab6b2a9f', class: "duet-textarea-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: 'e1673fe8bdc7e4560a701074a103b0ef8f6fd5f8' }, this.error))), hAsync("duet-grid-item", { key: '8be9f6e9ca8afbe0734c4a366d4a7c43fdc01cdb', margin: "none", class: "duet-character-count-caption" }, this.counter && (hAsync(CharacterCount, { key: '853baf2df8a6816d1af92476a4af383e5d656ea2', theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (hAsync("duet-visually-hidden", { key: '9f13bfdda388bd779ebad2bcbd33058f3242f79c', class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
+                this.hiddenCounterLabel = el;
+            } })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -18302,7 +18355,7 @@ class DuetTextarea {
     }; }
     static get style() { return DuetTextareaStyle0; }
     static get cmpMeta() { return {
-        "$flags$": 6,
+        "$flags$": 9,
         "$tagName$": "duet-textarea",
         "$members$": {
             "margin": [1],
@@ -18461,7 +18514,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 +18539,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: 'eefe1ccb55e157002c987d984645204ef1180dbe' }, hAsync("nav", { key: '62efd79c042a659c4bbee9f62a61d22218c4e79b', 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: '45c6853e0ddbbd7d4e108dcd1a953cb3ec56f0e8', class: "container" }, hAsync("div", { key: 'a842d519cb078cba8b4aca675ff55d3b2320e303', class: "list", role: "list" }, hAsync("slot", { key: '7d034eb78a40ca22aeb9a6450d0fb70d418d03d9', name: "left" })), hAsync("div", { key: '94a6e0def0e7d556721247f576605dc2fa0ccf1f', class: "list", role: "list" }, hAsync("slot", { key: '3c7c48e9959fa7fc27577c89723f72d022c0a663', name: "right" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarStyle0; }
@@ -18559,18 +18618,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: 'c896db9b3ac2a4d10e400e67b7f31b6ecacb3737', role: "listitem" }, hAsync("div", { key: '7f55d5535230767d71071a62c58f6754e8cafc1f', 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: 'ce96d8220ea871a3ab72bf615107174f6c0802e8', 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: '11582ddf116e08da6aa3ba54ccc2db6e4a395abb', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: '74d8a298238f17ab10bc16d0073aeb0104699047', class: "label" }, hAsync("slot", { key: '8df1bb703f76b2ef0460055c037bcfc4e842d10b', name: "label" }), hAsync("duet-icon", { key: 'acfa3f2f7862089008f8d8b2eba95bb6dfef3aa0', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '718e2a52bf0c3579a1094991f83f2b9fd6e8491c', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '1e6a4a1d661c39acf3c7a66fbf3c3532b897df6b' })))));
+            } }, hAsync("slot", { key: 'ececcbe7ad87bdc55995ce8db36d464f47fefbf9' })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarDropdownStyle0; }
@@ -18623,11 +18682,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: 'd363a198149fd9a4c08eb181eaa1056d18c0898a' }, hAsync("a", { key: '99aad91124922259990a94a28be6e94622eea6c5', 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: '8eb9410146ab81b0cf902afb892e67f693a10be3', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: '780d2b204def16a761608214698d0486905e7c3f', class: "label" }, hAsync("slot", { key: 'bd1aba77300442cf2d08d04221e8b7a44c93d168' })), this.active && (hAsync("duet-icon", { key: '26f6d4384f221713f8dc3b58945a77cecd2b746d', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarDropdownLinkStyle0; }
@@ -18648,7 +18707,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 +18741,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: 'be0a9608c45623e976d79e193f6f4255fad2812d', role: "listitem" }, hAsync(TagName, { key: 'baeb9d0e203b2fc97983530d798121d4df7e9b7b', 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: 'c77109ca570f1c6da5e3aef5a71a3c708d8962e9', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: 'e020d036269f7847cbd20c879c4d2267f312f6e3' }), this.trailingIcon && (hAsync("duet-icon", { key: '00d90da73a2063c9990fd93f4aa0c613a7d0f52f', 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 +18806,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: '258aa71d94e0e3959eef224ab891ceb4db3886ad', role: "listitem" }, hAsync("a", { key: 'e3557495157f9c6212582f47cf027f1f8389d7e9', 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: '28195a63fb2020c70155284152086fa6fd4be0a1', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '85fdc84a09716bf992dbb7325b9677ed74fec706' }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetToolbarLinkStyle0; }
@@ -19000,11 +19065,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: '4be97c3001005d18be45efe72c3b80bab321580f' }, hAsync("button", { key: '610f35f05d9c3caac636aa3d32dfda78df0a41be', 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: 'c8c4071751aaed98f301674b9dd26d5e1ed67033', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: 'beb7762d011e678668b723c8c362ad6fe09a7e71', 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: '2e18209c0945b8bbed7132d7c58e6987d195f936', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: '0d2299a6de3f42d32be3268c9efeca24fea9f7b4', 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 +19136,11 @@ class DuetTooltipPopup {
         this.contentEl.focus();
     }
     render() {
-        return (hAsync(Host, { key: '0505ed0cbdfc2184bce129841b824d49f8001687' }, hAsync("div", { key: 'fb29acd88d0b6f76e85fa8f86323c689e76a92bc', class: {
+        return (hAsync(Host, { key: '5937d404a3288b6afe2b9c8e1d47147e96eef933' }, hAsync("div", { key: 'bc2694a70963dabcaddce627d1abfe51dc36ebac', 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: '461ee4e709c80fae34d04f2bba0fd60e6305f594', moveFocusTo: this.buttonEl }), hAsync("div", { key: '47e8f609387722060e93fc37558a219c2bad2ed6', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, hAsync("slot", { key: '64350c3d73d2560711890254d8be979f07c27f1b' })), hAsync("div", { key: '0544215577fd0b4e6be97eadcbad8f58114ffb38', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: '1076a224b4a4f9d455271245e7bd879689a96bf4', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: 'bf275bd1c1597e42ab29ce57338a37e8ff534bfc', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: 'e06529abd6465f5e65f57f85ba2392c1df82d59f', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: '43cabf152e52e237b886642e66a30875973fac6f' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: '47ef9a81ce996efe8d52d06f36799c5a4f3b26cc', moveFocusTo: this.contentEl }))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTooltipPopupStyle0; }
@@ -19183,14 +19248,14 @@ class DuetTray {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: 'ae9c60e60a3726b586a877b713a636af350cdda8', class: {
+        return (hAsync("div", { key: '422e3ef16e6442e5e64ddeb7cf159aba8480bb0c', 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: '2a123be4ba03f0ca7097365d9d28501f3e55dfb1', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: '170a493490fc917470b22039d4d9205c4925ad48' })), this.hasAdditionalContent && (hAsync(Fragment, { key: '398d11e06e1f271c565170e15ecb307741e1d9c5' }, hAsync("button", { key: 'ee94b64530befedfd2d8388fd4ad18d49f32e1f3', "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: 'af7c543c625487955c4c06b3904ace9e0042bcc1', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: '4800b309084526993db20f4e98b9ecd45e6831d0' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: '7cd6e21a5665066901ea37827c47e5569bc9ff5e', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: 'a8912419d82f6acb7eb4e8c4de5a3b083ab059cb', class: "duet-tray-expandable-content" }, hAsync("slot", { key: '9de06515af6bd91e8b82b45e7dfec1ead9b8092d', name: "additional" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return DuetTrayStyle0; }
@@ -20306,10 +20371,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: '1fffd7c0a260c23f1c330eb08b9fdfc30f37a9a1', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: 'e197c24d5a1632aaaac794a4e1d77907966e03a0', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: '4b8f19faef9a6ddf6985f4a6d74fa53f5b495c41', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: 'c85f948d069554ecd23262b6aafa29a2ea9fccc3', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: 'ba5bc112450715996ddc1eecc729285319f9297b', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: 'b76d9a2f51f0bd1439acd7cb30a238cead9ffe1f', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: '568e8e06757a0e08e14716e69861e3f233cbf2c4', 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: '534c6bd31b64a7e3352b4ab57d9c2d74f8b585b5', name: "filefooter" }), hAsync("slot", { key: '53d1caf7a4725aae80ed9734db2a9ca76888128d', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: 'dbf302852c9f56952e4c510a73884f6aa57c63bb', margin: "none", size: "small" }, hAsync("div", { key: '5c042c4a5ec8ba2338e5f59f41829a0bf09def86', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: '3a882d40064790a16af1f6b503da0dc281df31db', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: '7d15d7e6e7fff5286c4b39506ab45d4afb1a46b0' }, hAsync("duet-spacer", { key: '9c10df439e588302c1d9141cd74e06b55a13aacc', size: "large" }), hAsync("duet-button", { key: '32abaa4a27ad8ff0833fec5df3eb84c91a53571b', 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: '714dc5703ac4d5e3238fca2691c2608f40a8c381' }, hAsync("duet-spacer", { key: '532a4bee3077d383db9ef6f7968593e09c1cf503', size: "medium" }), hAsync("duet-alert", { key: 'd233e8abac003d1e9cea525b7ec2868fe5365cd8', 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: 'd7291fd3058c60bc3799b54c936ae85135c9f855', "aria-hidden": "true" }, hAsync("input", { key: '8b8cf4a76f5da959a5ab9b15bf6c6fa0fd8b594d', 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 +20695,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: '86d09688da162133dae76983bbfc285abf03ec4b', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: '22fb5bc7a884e3d9b63f68b6720cdf9550418082' }, this.statusMessage)));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -20809,9 +20874,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: 'fb59de9f051f5c07b1725da1567d02e2263b9b23', 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: '2992abb219ae6b03030e64abdf45a6f20af9bfcb', class: "item-categories" }, hAsync("duet-heading", { key: 'c51d5ed86bab23762341d97ec487eaca59d55bc7', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: 'edecc00f4e1983952dedd91843caf0f33ccb27b4', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: '0d4193a3f169ab02c5231348d42611519c5fcd36', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: 'c252b1fa3e6c563dde5bb737d033189554b5f291', 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 +20917,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: '1a63587b9972cddb552468bea28f8146b8d302df', class: "duet-visually-hidden" }, hAsync("slot", { key: 'a3e8c6847caa94f67d82569bc769a6397ccc8c56' })));
     }
     get element() { return getElement(this); }
     static get style() { return DuetVisuallyHiddenStyle0; }