npm - @duetds/components - Versions diffs - 10.0.0-alpha.24 → 10.0.0-alpha.25 - Mend

@duetds/components 10.0.0-alpha.24 → 10.0.0-alpha.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (403) hide show

package/hydrate/index.js CHANGED Viewed

@@ -4216,7 +4216,31 @@ var tokens$2 = /*#__PURE__*/Object.freeze({
     zIndexToast: zIndexToast
 });
+const turva2ColorTokens = {
+    "color-turva2-red-600": "#e61740",
+    "color-turva2-red-700": "#b90329",
+    "color-turva2-red-800": "#8c001e",
+    "color-turva2-gray-00": "#f5f6f7",
+    "color-turva2-gray-100": "#d4dde2",
+    "color-turva2-gray-200": "#b2c2cd",
+    "color-turva2-gray-400": "#7891a4",
+    "color-turva2-gray-500": "#5f7a8f",
+    "color-turva2-gray-900": "#172a3b"};
 const allowedThemes = ["turva"];
+const MATCH_CAPITAL_CASE = /[A-Z]/g;
+function isTurva2() {
+    var _a;
+    if (typeof document === "undefined") {
+        return false;
+    }
+    return !!((_a = document.documentElement.attributes.getNamedItem("class")) === null || _a === void 0 ? void 0 : _a.value.includes("duet-theme-turva2"));
+}
+function isCamelCase(str) {
+    const camel = MATCH_CAPITAL_CASE.test(str);
+    const barredString = !str.includes("_") && !str.includes("-") && !str.includes(" ");
+    return camel && barredString;
+}
 function isDashCase(str) {
     const dash = str.includes("-");
     const barredString = str.includes(" ") || str.includes("_");
@@ -4262,18 +4286,61 @@ function addTheme(str, theme) {
     }
     return str;
 }
+/**
+ * Add "-turva" to color names (or "Turva" to camelCase color names)
+ */
+function postfixTheme(name, theme) {
+    if (!name) {
+        return undefined;
+    }
+    if (["", "default"].includes(theme)) {
+        return name;
+    }
+    if ((isDashCase(name) && name.endsWith(`-${theme}`)) || (isCamelCase(name) && name.endsWith(capitalize(theme)))) {
+        return name;
+    }
+    if (tokens$2[`color${camelize(name)}${capitalizeFirstLetter(theme)}`]) {
+        return !isCamelCase(name) ? `${name}-${theme}` : `${name}${capitalize(theme)}`;
+    }
+    return name;
+}
 function getColorByName(name, theme = "") {
     if (!name) {
         return undefined;
     }
-    const defaultColor = convertToColorName(name);
-    const themedColor = convertToColorName(name, theme);
-    // lets just try to get the color first to save some cycles
-    let resolvedToken = tokens$2[themedColor];
-    if (!resolvedToken) {
-        resolvedToken = tokens$2[defaultColor];
+    if ((theme === "turva" || name.endsWith("-turva")) && isTurva2()) {
+        switch (name.replace(/-turva$/, "")) {
+            case "primary-lightest":
+                return turva2ColorTokens["color-turva2-nude-00"];
+            case "primary-lighter":
+                return turva2ColorTokens["color-turva2-nude-50"];
+            case "primary-light":
+                return turva2ColorTokens["color-turva2-nude-200"];
+            case "primary":
+                return turva2ColorTokens["color-turva2-red-600"];
+            case "primary-darker":
+                return turva2ColorTokens["color-turva2-red-700"];
+            case "primary-dark":
+                return turva2ColorTokens["color-turva2-red-800"];
+            case "secondary":
+                return turva2ColorTokens["color-turva2-gray-900"];
+            case "gray-lighter":
+                return turva2ColorTokens["color-turva2-gray-00"];
+            case "gray-light":
+                return turva2ColorTokens["color-turva2-gray-100"];
+            case "gray":
+                return turva2ColorTokens["color-turva2-gray-200"];
+            case "gray-dark":
+                return turva2ColorTokens["color-turva2-gray-400"];
+            case "gray-darker":
+                return turva2ColorTokens["color-turva2-gray-500"];
+            // carry on to old turva colors
+        }
     }
-    return resolvedToken;
+    const defaultColor = convertToColorName(name);
+    const themedColor = theme && convertToColorName(name, theme);
+    // return themed color if it exists
+    return tokens$2[themedColor] || tokens$2[defaultColor];
 }
 function convertToColorName(name = "", theme = "") {
     let colorResolution = name;
@@ -4903,12 +4970,12 @@ class DuetBadge {
      */
     render() {
         const backgroundClass = `background-${this.background}`;
-        return (hAsync(Host, { key: '3095cb737865cb18f99b8a16ef6f93357cb51e13', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '0b542a92e2e25d7999fd6d6642a3f0ee3c2bff3d', class: {
+        return (hAsync(Host, { key: 'da159f6322336c9e29fe1f6fd62a1c856fee0a86', class: { "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '9e9e12f29c7a27a2c15be1e4e7aaffcacc81f053', class: {
                 "duet-badge": true,
                 [this.variation]: true,
                 [backgroundClass]: true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("slot", { key: '384164367bb8240ec2917a7ca295c43cad4600b2' }))));
+            } }, hAsync("slot", { key: '97ed4f103d26ccf534b9eb10168a7855a958b466' }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetBadgeCss; }
@@ -4934,7 +5001,7 @@ const DuetPicture = ({ img, sources }) => {
         hAsync("img", Object.assign({}, img))));
 };
-const duetBannerCss = "*,\n*::after,\n*::before {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n:host {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n  margin-right: 36px !important;\n  margin-bottom: 36px !important;\n  display: flex;\n  justify-content: center;\n  width: auto;\n  container: duet-banner-container;\n  container-type: inline-size;\n}\n:host:last-child, :host:last-of-type {\n  margin-right: 0 !important;\n}\n\n:host(.duet-m-0) {\n  margin: 0 !important;\n}\n\n.duet-banner {\n  display: grid;\n  grid-template-rows: min-content 1fr;\n  width: 100%;\n  height: 100%;\n  font-family: \"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n  font-style: normal;\n  text-align: left;\n  border-radius: 16px;\n}\n.duet-banner.duet-p-0 {\n  padding: 0 !important;\n}\n.duet-banner.duet-m-0 {\n  margin: 0 !important;\n}\n.duet-banner .visual {\n  position: relative;\n  display: none;\n  overflow: hidden;\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 0px) {\n  .duet-banner .visual {\n    /* stylelint-enable */\n    display: block;\n  }\n}\n.duet-banner .visual .image-container {\n  position: relative;\n  aspect-ratio: 2/1;\n  overflow: hidden;\n}\n.duet-banner .visual .image {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n.duet-banner .visual .icon {\n  position: absolute;\n}\n.duet-banner .visual .brand-shape {\n  position: absolute;\n  top: 0;\n  left: 72%;\n  display: none;\n  width: 100%;\n  height: 100%;\n  mask-image: url(\"data:image/svg+xml,%3Csvg%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20344%22%20fill%3D%22none%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.72641e-07%2091.1902C0.000476976%2097.9034%200.626077%20104.726%201.92282%20111.592L42.7493%20327.771C43.8045%20333.358%2045.2667%20338.776%2047.0996%20344H160V0H51.1439C19.7799%2019.1253%200.00268143%2053.4178%202.72641e-07%2091.1749C-9.08807e-08%2091.18%20-9.08875e-08%2091.1851%202.72641e-07%2091.1902Z%22%20fill%3D%22%23E6F2F8%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E\");\n}\n.duet-banner .content {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px 20px 28px;\n}\n.duet-banner .content .description {\n  hyphens: auto;\n}\n.duet-banner .action {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  align-items: flex-start;\n  justify-content: flex-end;\n  padding-top: 16px;\n}\n.duet-banner .visual {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n.duet-banner .visual .image-container {\n  width: 100%;\n  height: auto;\n  border-radius: 0;\n}\n.duet-banner .visual .icon {\n  bottom: 30px;\n  left: 15px;\n}\n.duet-banner.duet-theme-turva {\n  font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n.duet-banner.duet-theme-turva .visual .brand-shape {\n  mask-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 160 344' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_7920_3801)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.58983 142.533C0.751086 155.147 0.0746585 167.857 0.00796847 179.225C0.00263853 179.814 0 180.409 0 181.007C0 194.845 1.41172 210.806 3.58065 223.171C5.6528 234.934 8.58716 246.495 12.5981 257.779C21.2249 282.059 34.0151 304.109 50.8401 323.977C56.7824 330.993 63.0921 337.68 69.8162 344H160V0H65.0733C52.1771 10.7866 41.4339 23.4177 32.7528 37.7978C21.1154 57.0822 14.0367 77.9583 9.75424 99.7913C9.09214 103.157 8.55049 106.545 8.00901 109.933C7.75185 111.542 7.49474 113.15 7.22478 114.756C6.74308 117.618 6.24543 120.479 5.74776 123.34C4.6361 129.729 3.52432 136.12 2.58983 142.533Z' fill='%23F5F5F7'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_7920_3801'%3E%3Crect width='160' height='344' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A\");\n}\n.duet-banner.size-medium, .duet-banner.size-large {\n  /* stylelint-disable */\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-medium .visual, .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-top-right-radius: 0;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-medium .visual .image-container, .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .image, .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .icon, .duet-banner.size-large .visual .icon {\n    top: 36px;\n    left: 168px;\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-medium .content, .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 28px 28px 28px 0;\n  }\n  .duet-banner.size-medium .action, .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n@container duet-banner-container (min-width: 586px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    left: 80%;\n  }\n}\n.duet-banner.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 900px) {\n  .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .icon {\n    top: 40px;\n    bottom: auto;\n    left: 335px;\n  }\n  .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 48px 48px 48px 0;\n  }\n  .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n.duet-banner.no-image {\n  display: flex;\n  justify-content: center;\n  padding: 36px 20px;\n}\n.duet-banner.no-image .visual {\n  display: none;\n}\n.duet-banner.no-image .content {\n  width: 100%;\n  max-width: 720px;\n  padding: 0;\n}\n.duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n    /* stylelint-enable */\n    padding: 48px;\n  }\n}";
+const duetBannerCss = "*,\n*::after,\n*::before {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n}\n\n:host {\n  box-sizing: border-box;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  border: 0;\n  -moz-appearance: none;\n  -webkit-appearance: none;\n  appearance: none;\n  margin-right: 36px !important;\n  margin-bottom: 36px !important;\n  display: flex;\n  justify-content: center;\n  width: auto;\n  container: duet-banner-container;\n  container-type: inline-size;\n}\n:host:last-child, :host:last-of-type {\n  margin-right: 0 !important;\n}\n\n:host(.duet-m-0) {\n  margin: 0 !important;\n}\n\n.duet-banner {\n  display: grid;\n  grid-template-rows: min-content 1fr;\n  width: 100%;\n  height: 100%;\n  font-family: \"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n  font-style: normal;\n  text-align: left;\n  border-radius: 16px;\n}\n.duet-banner.duet-p-0 {\n  padding: 0 !important;\n}\n.duet-banner.duet-m-0 {\n  margin: 0 !important;\n}\n.duet-banner .visual {\n  position: relative;\n  display: none;\n  overflow: hidden;\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 0px) {\n  .duet-banner .visual {\n    /* stylelint-enable */\n    display: block;\n  }\n}\n.duet-banner .visual .image-container {\n  position: relative;\n  aspect-ratio: 2/1;\n  overflow: hidden;\n}\n.duet-banner .visual .image {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n.duet-banner .visual .icon {\n  position: absolute;\n}\n.duet-banner .visual .brand-shape {\n  position: absolute;\n  top: 0;\n  left: 72%;\n  display: none;\n  width: 100%;\n  height: 100%;\n  mask-image: url(\"data:image/svg+xml,%3Csvg%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20160%20344%22%20fill%3D%22none%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M2.72641e-07%2091.1902C0.000476976%2097.9034%200.626077%20104.726%201.92282%20111.592L42.7493%20327.771C43.8045%20333.358%2045.2667%20338.776%2047.0996%20344H160V0H51.1439C19.7799%2019.1253%200.00268143%2053.4178%202.72641e-07%2091.1749C-9.08807e-08%2091.18%20-9.08875e-08%2091.1851%202.72641e-07%2091.1902Z%22%20fill%3D%22%23E6F2F8%22%2F%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Fsvg%3E\");\n  transform: scale(101%);\n}\n.duet-banner .content {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px 20px 28px;\n}\n.duet-banner .content .description {\n  hyphens: auto;\n}\n.duet-banner .action {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  align-items: flex-start;\n  justify-content: flex-end;\n  padding-top: 16px;\n}\n.duet-banner .visual {\n  border-top-left-radius: 16px;\n  border-top-right-radius: 16px;\n}\n.duet-banner .visual .image-container {\n  width: 100%;\n  height: auto;\n  border-radius: 0;\n}\n.duet-banner .visual .icon {\n  bottom: 30px;\n  left: 15px;\n}\n.duet-banner.duet-theme-turva {\n  font-family: \"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";\n}\n.duet-banner.duet-theme-turva .visual .brand-shape {\n  mask-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 160 344' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_7920_3801)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.58983 142.533C0.751086 155.147 0.0746585 167.857 0.00796847 179.225C0.00263853 179.814 0 180.409 0 181.007C0 194.845 1.41172 210.806 3.58065 223.171C5.6528 234.934 8.58716 246.495 12.5981 257.779C21.2249 282.059 34.0151 304.109 50.8401 323.977C56.7824 330.993 63.0921 337.68 69.8162 344H160V0H65.0733C52.1771 10.7866 41.4339 23.4177 32.7528 37.7978C21.1154 57.0822 14.0367 77.9583 9.75424 99.7913C9.09214 103.157 8.55049 106.545 8.00901 109.933C7.75185 111.542 7.49474 113.15 7.22478 114.756C6.74308 117.618 6.24543 120.479 5.74776 123.34C4.6361 129.729 3.52432 136.12 2.58983 142.533Z' fill='%23F5F5F7'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_7920_3801'%3E%3Crect width='160' height='344' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A\");\n}\n.duet-banner.size-medium, .duet-banner.size-large {\n  /* stylelint-disable */\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-medium .visual, .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-top-right-radius: 0;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-medium .visual .image-container, .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .image, .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-medium .visual .icon, .duet-banner.size-large .visual .icon {\n    top: 36px;\n    left: 168px;\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-medium .content, .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 28px 28px 28px 0;\n  }\n  .duet-banner.size-medium .action, .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n@container duet-banner-container (min-width: 586px) {\n  .duet-banner.size-medium, .duet-banner.size-large {\n    /* stylelint-enable */\n  }\n  .duet-banner.size-medium .visual .brand-shape, .duet-banner.size-large .visual .brand-shape {\n    left: 80%;\n  }\n}\n.duet-banner.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 900px) {\n  .duet-banner.size-large {\n    /* stylelint-enable */\n    grid-template-rows: none;\n    grid-template-columns: 50% 50%;\n  }\n  .duet-banner.size-large .visual {\n    border-top-left-radius: 16px;\n    border-bottom-left-radius: 16px;\n  }\n  .duet-banner.size-large .visual .image-container {\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .image {\n    width: 100%;\n    height: 100%;\n  }\n  .duet-banner.size-large .visual .icon {\n    top: 40px;\n    bottom: auto;\n    left: 335px;\n  }\n  .duet-banner.size-large .visual .brand-shape {\n    display: block;\n  }\n  .duet-banner.size-large .content {\n    align-items: flex-start;\n    justify-content: center;\n    padding: 48px 48px 48px 0;\n  }\n  .duet-banner.size-large .action {\n    flex-grow: 0;\n  }\n}\n.duet-banner.no-image {\n  display: flex;\n  justify-content: center;\n  padding: 36px 20px;\n}\n.duet-banner.no-image .visual {\n  display: none;\n}\n.duet-banner.no-image .content {\n  width: 100%;\n  max-width: 720px;\n  padding: 0;\n}\n.duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n  /* stylelint-disable */\n}\n@container duet-banner-container (min-width: 486px) {\n  .duet-banner.no-image.size-medium, .duet-banner.no-image.size-large {\n    /* stylelint-enable */\n    padding: 48px;\n  }\n}";
 /**
  * @slot heading - Slot for heading content. Only span should be used in this slot.
@@ -5050,14 +5117,14 @@ class DuetBanner {
             img: { src: this.image, alt: "", loading: "lazy", class: "image", role: "presentation" },
             sources: parsePossibleJSON(this.sources),
         };
-        return (hAsync(Host, { key: 'd279b27f54fba40d358a850d94118a0caa571737', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: 'fa270dd8231b5b22d2c0157105df3171fd56f450', class: {
+        return (hAsync(Host, { key: '12cea619c3a29693b7bbb7189962468eee715f68', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: 'b4e70162ea52e299c8cc3481961e1354f7a348d0', class: {
                 "duet-banner": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.currentSize]: true,
                 "size-medium": this.size === "medium" || this.size === "large",
                 "size-large": this.size === "large",
                 "no-image": !this.image,
-            }, style: bannerStyles }, hAsync("div", { key: 'c3cbef43ed49f67f5c429692c0d673f65341cbf8', class: "visual" }, hAsync("div", { key: '6e1defb61acf399734e5843f100d17a467acc52c', class: "image-container" }, this.image && hAsync(DuetPicture, Object.assign({ key: '9b8cf3946c557db548bf9e4a63a9f77e1a528eca' }, pictureSource))), 1 > 2, hAsync("div", { key: 'de431601a73be43d79f29e7e4cc4e943ae00e545', style: bannerStyles, class: "brand-shape" })), hAsync("div", { key: '50f7a5fc5f4ade0905bc272e29e7d0c4912c1020', class: "content" }, this.hasHeadingSlot && (hAsync("div", { key: '73cd6a4f3f4022f897df0ce57a2316043f403dba', class: "heading" }, hAsync("duet-heading", { key: '1d7d47b81255653206534bb228d11e8eee154c2c', theme: this.theme, level: this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: this.textColor }, hAsync("span", { key: 'f340c4b1e80fdd5a64ed8d61512879b290662b37' }, hAsync("slot", { key: '2041e9d5b57a5adb5a325e4bf2052cece9d59d83', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: '77bee71dfd8d16749a238336fb0ca182dc6da387', class: "description", style: { color } }, hAsync("slot", { key: 'bc10b7a951bf3ca738bb2214d4f78a2258f373d3', name: "description" }))), this.hasActionSlot && (hAsync("div", { key: 'c842a4bd1a20ff10617c0df53b0491e897de4371', class: "action" }, hAsync("slot", { key: 'a17d57f164e2973eb0bdaa8902b93eaafdc3b96e', name: "action" })))))));
+            }, style: bannerStyles }, hAsync("div", { key: '77b6658e115f6c6ad322e4d81607a842de28ad7f', class: "visual" }, hAsync("div", { key: '1140037769c9615f7fc233d5ef7db5e93e5b1434', class: "image-container" }, this.image && hAsync(DuetPicture, Object.assign({ key: '63b777ee272d5fe8c7df6f6a8bff7b84a44c9dff' }, pictureSource))), 1 > 2, hAsync("div", { key: '5af78573b362552f7bdc061be9bed68373255aae', style: bannerStyles, class: "brand-shape" })), hAsync("div", { key: '99f371a78ff9d7e85cff37c9c5eb2d49f51e7aaa', class: "content" }, this.hasHeadingSlot && (hAsync("div", { key: '8684e9cbd15cd42e8bce73271543ce7fc91b63fc', class: "heading" }, hAsync("duet-heading", { key: '2d3348662100fc98f088ac9dee4a5a38681ce9d7', theme: this.theme, level: this.headingLevel, "visual-level": this.currentSize === "large" ? "h2" : "h3", "fixed-size": true, margin: "none", color: postfixTheme(this.textColor, this.theme) }, hAsync("span", { key: '692332080a527df5d5ed15773ef34efbda983f15' }, hAsync("slot", { key: '8a0a0e72edfcf4c55f66b8565fe90b948e86c4bc', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: 'daba4eb6a51dc590ea3591132b8cddebb5cf9756', class: "description", style: { color } }, hAsync("slot", { key: '5d8e3bc1324a170bf266b89e8815896c470a512a', name: "description" }))), this.hasActionSlot && (hAsync("div", { key: 'c9d0e0f700ef91081cad82c8edb5db69ee38ef56', class: "action" }, hAsync("slot", { key: 'e72dfb579efb7ad822de3f59d3d828fffd3ef015', name: "action" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetBannerCss; }
@@ -5151,14 +5218,14 @@ class DuetBreadcrumb {
      */
     render() {
         var _a;
-        return (hAsync(Host, { key: '684a35b905d71dc9d10dd884aab962d48d089f9c', role: "listitem" }, hAsync("div", { key: 'd90e18cd7ab0963b239239116aa4f1ce2a13cb82', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: '810084be2911ea489f7475538d10c9be7c53977f', class: "duet-breadrumbs-arrow", size: "auto", icon: arrowRightSmallIcon.svg, margin: "none", color: "currentColor" })), hAsync("a", { key: '1a79a625c633de3599cda673945aaa1d3e3489e8', class: {
+        return (hAsync(Host, { key: '1ea751b77b703d6054db7aa48bdeb9ac2a7cf742', role: "listitem" }, hAsync("div", { key: '147ae3c1a0ff6744d0d363ce2162b0acf8083535', class: "container" }, this.icon === "arrow-right-small-icon" && (hAsync("duet-icon", { key: 'd1642e1065ca32cc3b05d2724fbb3a1fae48fe2d', class: "duet-breadrumbs-arrow", size: "auto", icon: arrowRightSmallIcon.svg, margin: "none", color: "currentColor" })), hAsync("a", { key: '43ab506c5a641b44b99b9589eb7afdf7dc12172e', 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: '27e9d39e2e3766a07e8680ef1926c6d46205ec36', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
-            this.hasSlottedContent && hAsync("duet-spacer", { key: 'eccab08849facdca68c84146145b451d9e7a04bf', size: "x-small", direction: "horizontal" }),
-        ], hAsync("slot", { key: 'af12cc0eae54fb0f49c7bbe0ef4cdd52469ce4b7' })))));
+            hAsync("duet-icon", { key: '73e448e620cf4284d620295ee791e8ebf8d8f491', size: this.iconSize, name: this.icon, margin: "none", color: "currentColor" }),
+            this.hasSlottedContent && hAsync("duet-spacer", { key: '9b0715738cc45d50d03a74f3310b654566fa0d59', size: "x-small", direction: "horizontal" }),
+        ], hAsync("slot", { key: '67cd2c6250927322b997b23a199c5ea758e2829e' })))));
     }
     get element() { return getElement(this); }
     static get style() { return duetBreadcrumbCss; }
@@ -5227,11 +5294,11 @@ class DuetBreadcrumbs {
      */
     render() {
         const color = getColorByName(this.color);
-        return (hAsync(Host, { key: '112f666c89f42e44282c9f30dd4fe9f4a2a6d00d' }, hAsync("nav", { key: 'a51ec0c6909fc32d4c983d261ad0d61ec04e875d', "aria-label": this.breadcrumbsAriaLabel, class: {
+        return (hAsync(Host, { key: 'a33196239b9b8f6933f6e8b46df005591cd7234c' }, hAsync("nav", { key: 'e132c17465eefb28d91c1a2a98fb6fa6bf812c92', "aria-label": this.breadcrumbsAriaLabel, class: {
                 "duet-breadcrumbs": true,
                 "duet-theme-turva": this.theme === "turva",
                 [this.variation]: true,
-            } }, hAsync("div", { key: '6d3d699aed0172cc902119f9156c9454dbbdb5eb', class: "container" }, hAsync("div", { key: '51e6beb73135662d0159ea0200dd3e591ac93e6c', role: "list", class: "list", style: { color } }, hAsync("slot", { key: '1a877a3c6d97a1960ec0710e224578b4c271aa24' })), hAsync("div", { key: 'f5b4a55093f5ff07463144bb29ca6194bbeae29f', class: "bottom-border bottom-border--container" })), hAsync("div", { key: '84c9ebdce9ac7fd6b9789be0fb3ce3e858b3eb35', class: "bottom-border bottom-border--nav" }))));
+            } }, hAsync("div", { key: '515e61b4523d016aeaf79f9785f335793f3fd8a7', class: "container" }, hAsync("div", { key: '5cc015e840532c3e5450d2f99ea6dbfe16da9e21', role: "list", class: "list", style: { color } }, hAsync("slot", { key: '712824b51a9798d5df687a5146e7564c32e3b192' })), hAsync("div", { key: '6c669b82b4d9bebfec76cd852e422df64fc378f7', class: "bottom-border bottom-border--container" })), hAsync("div", { key: '04cb09bd7682b668fd9ca24ddd91efea24da9bf6', class: "bottom-border bottom-border--nav" }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetBreadcrumbsCss; }
@@ -5276,7 +5343,7 @@ const DuetStringsListStepOfTotal = {
     sv: "Lista med {total} steg. Du är på steg {current}.",
 };
-const duetButtonCss = "*,*::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:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;font-size:0;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.square){margin-right:12px !important}:host(.square):last-child,:host(.square):last-of-type{margin-right:0 !important}:host(.input-button){z-index:250}:host(.duet-small),:host(.duet-x-small){margin-right:4px !important;margin-bottom:8px !important}:host(.duet-small):last-child,:host(.duet-small):last-of-type,:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host(.duet-small),:host(.duet-x-small){width:auto}}:host(.duet-x-small){margin-right:2px !important}:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}:host(.square.duet-small),:host(.square.duet-x-small){margin-right:8px !important}:host(.square.duet-small):last-child,:host(.square.duet-small):last-of-type,:host(.square.duet-x-small):last-child,:host(.square.duet-x-small):last-of-type{margin-right:0 !important}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(:last-child){margin-right:0 !important}.duet-button-container{position:relative;display:block;width:100%}.duet-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;align-items:center;width:100%;min-width:8rem;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600;line-height:1.1;color:rgb(0, 119, 179) !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:1px;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, outline 300ms ease, padding 300ms ease, box-shadow 300ms ease}.duet-button.duet-p-0{padding:0 !important}.duet-button.duet-m-0{margin:0 !important}.duet-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-button:focus,.duet-button:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-button.duet-button-size-medium{height:50px;padding-right:30px;padding-left:30px;font-size:1rem;border-radius:25px}.duet-theme-turva .duet-button.duet-button-size-medium{padding-right:24px;padding-left:24px;border-radius:12.5px}.duet-button.duet-button-size-medium.square{border-radius:12.5px}.duet-button.duet-button-size-medium.icon-left{padding-left:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-left{padding-left:18px}.duet-button.duet-button-size-medium.icon-right{padding-right:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-right{padding-right:18px}.duet-button.duet-button-size-small{height:40px;padding-right:20px;padding-left:20px;font-size:0.875rem;border-radius:20px}.duet-theme-turva .duet-button.duet-button-size-small{padding-right:18px;padding-left:18px;border-radius:10px}.duet-button.duet-button-size-small.square{border-radius:10px}.duet-button.duet-button-size-small.icon-left{padding-left:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-left{padding-left:14px}.duet-button.duet-button-size-small.icon-right{padding-right:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-right{padding-right:14px}.duet-button.duet-button-size-x-small{height:32px;padding-right:12px;padding-left:12px;font-size:0.75rem;border-radius:8px}.duet-button.duet-button-size-x-small.icon-left{padding-left:10px}.duet-button.duet-button-size-x-small.icon-right{padding-right:10px}.duet-button.plain.duet-p-0{height:auto}.duet-button:not(.input-button-primary,.input-button-secondary,.input-button-embedded){font-variant-numeric:tabular-nums}.duet-button.duet-button-text-center{text-align:center !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only){min-width:48px}.duet-button.duet-button-is-small:not(.duet-button-icon-only).plain{padding-right:0 !important;padding-left:0 !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only).duet-p-0{padding:0 !important}.duet-theme-turva .duet-button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(198, 12, 48) !important}.duet-button .duet-button-contents{position:relative;display:flex;gap:10px;align-items:center;margin:0 auto;pointer-events:none}.duet-button .duet-button-contents.icon-right{flex-direction:row-reverse}.duet-button .duet-button-contents .duet-button-contents-slot{position:relative;top:0}.duet-button.duet-no-wrap{white-space:nowrap}.duet-button svg{width:100%;min-width:100%;fill:currentColor}.duet-button .duet-button-icon{display:flex;align-items:center}.duet-button .duet-button-icon duet-icon{width:16px;height:16px}.duet-button .duet-button-icon.large duet-icon{width:20px;height:20px}.duet-button .duet-button-icon.medium-small duet-icon{width:10px;height:10px}.duet-button .duet-button-icon.small duet-icon{width:7px;height:7px}.duet-button:active:not([disabled]){opacity:0.75;transition:none}.duet-button.default{background:rgb(255, 255, 255);border-color:rgb(181, 198, 208)}.duet-theme-turva .duet-button.default{color:rgb(198, 12, 48) !important;border-color:rgb(222, 224, 228)}.duet-button.default:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.default:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.default.duet-button-negative{background-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.default.duet-button-negative{background-color:rgb(222, 224, 228) !important}.duet-button.default.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.default.duet-button-negative:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.primary,.duet-button.input-button-primary,.duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.primary,.duet-theme-turva .duet-button.input-button-primary,.duet-theme-turva .duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}.duet-button.primary:hover,.duet-button.input-button-primary:hover,.duet-button.input-button-left-primary:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.primary:hover,.duet-theme-turva .duet-button.input-button-primary:hover,.duet-theme-turva .duet-button.input-button-left-primary:hover{background:rgb(126, 2, 35);border-color:rgb(126, 2, 35)}.duet-button.primary:focus,.duet-button.input-button-primary:focus,.duet-button.input-button-left-primary:focus{outline:0;box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(0, 119, 179, 0.75)}.duet-theme-turva .duet-button.primary:focus,.duet-theme-turva .duet-button.input-button-primary:focus,.duet-theme-turva .duet-button.input-button-left-primary:focus{box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(23, 28, 58, 0.75)}.duet-button.secondary,.duet-button.input-button-secondary,.duet-button.input-button-left-secondary,.duet-button.input-button-embedded{color:rgb(8, 42, 77) !important;background:transparent;border-color:rgb(8, 42, 77)}.duet-theme-turva .duet-button.secondary,.duet-theme-turva .duet-button.input-button-secondary,.duet-theme-turva .duet-button.input-button-left-secondary,.duet-theme-turva .duet-button.input-button-embedded{color:rgb(23, 28, 58) !important;border-color:rgb(23, 28, 58)}.duet-button.secondary:hover,.duet-button.input-button-secondary:hover,.duet-button.input-button-left-secondary:hover,.duet-button.input-button-embedded:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.secondary:hover,.duet-theme-turva .duet-button.input-button-secondary:hover,.duet-theme-turva .duet-button.input-button-left-secondary:hover,.duet-theme-turva .duet-button.input-button-embedded:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.secondary.duet-button-negative,.duet-button.input-button-secondary.duet-button-negative,.duet-button.input-button-left-secondary.duet-button-negative,.duet-button.input-button-embedded.duet-button-negative{color:rgb(212, 223, 229) !important;border-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:rgb(222, 224, 228) !important}.duet-button.secondary.duet-button-negative:hover,.duet-button.input-button-secondary.duet-button-negative:hover,.duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.input-button-embedded{width:40px;min-width:40px !important;min-height:40px !important;margin:4px !important;border-width:0 !important;border-radius:4px !important}.duet-button.input-button{height:auto}.duet-button.negative{color:rgb(8, 42, 77) !important;background:rgb(255, 255, 255);border-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.negative{color:rgb(23, 28, 58) !important}.duet-button.negative:hover{color:rgb(255, 255, 255) !important;background:transparent;border-color:rgb(255, 255, 255)}.duet-button.negative:focus{outline:0;box-shadow:0 0 0 1px #00294d, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-theme-turva .duet-button.negative:focus{box-shadow:0 0 0 1px #0077b3, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-button.destructive-primary:hover{background:#ab1642;border-color:#ab1642;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.destructive-primary:hover{background:#ab1642}.duet-button.destructive,.duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive,.duet-theme-turva .duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-button.destructive:hover,.duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-theme-turva .duet-button.destructive:hover,.duet-theme-turva .duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-button.plain{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}.duet-theme-turva .duet-button.plain{color:rgb(198, 12, 48) !important;background:transparent;border-color:transparent}.duet-button.plain.duet-p-0 .duet-button-contents{height:auto}.duet-button.plain[disabled]{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}.duet-theme-turva .duet-button.plain[disabled]{color:transparent !important;cursor:not-allowed;background:transparent !important;border-color:rgb(222, 224, 228) !important}.duet-button.plain:hover{color:rgb(0, 75, 129) !important;background:transparent !important}.duet-theme-turva .duet-button.plain:hover{color:rgb(126, 2, 35) !important}.duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-button.plain.duet-button-negative:hover{color:rgba(255, 255, 255, 0.8) !important}.duet-button.duet-button-icon-only{min-width:48px;min-height:48px;padding:0 !important}.duet-button.duet-button-icon-only .duet-button-contents{position:static}.duet-button.duet-button-icon-only .duet-button-icon.left.large,.duet-button.duet-button-icon-only .duet-button-icon.left.medium,.duet-button.duet-button-icon-only .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded,.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{box-sizing:content-box;min-width:48px;min-height:48px;padding:0 !important;border-width:1px}.duet-button.duet-button.input-button-primary .duet-button-contents,.duet-button.duet-button.input-button-secondary .duet-button-contents,.duet-button.duet-button.input-button-embedded .duet-button-contents,.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.duet-button.input-button-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-secondary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-embedded .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-secondary .duet-button-contents.icon-right{padding:0 16px}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded{border-top-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:0}.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-primary .duet-button-icon.left.small,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.large,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.medium,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-embedded{border-left-width:0}.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{border-top-left-radius:4px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px}.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.square{width:52px;min-width:auto !important;padding:0 !important;font-size:1rem;border-color:rgb(181, 198, 208);border-width:1px}.duet-button.square.duet-button-size-small{width:42px;font-size:0.875rem}.duet-button.square.duet-button-size-x-small{width:34px;font-size:0.875rem}.duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}.duet-theme-turva .duet-button.square{border-color:rgb(222, 224, 228)}.duet-button.square:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.square:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.square .duet-button-contents{gap:0}.duet-button[disabled],.duet-button[disabled]:hover,.duet-button.duet-button-negative[disabled],.duet-button.duet-button-negative[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:rgb(212, 223, 229) !important;border-color:rgb(212, 223, 229) !important;outline-color:rgb(212, 223, 229) !important;box-shadow:none !important}.duet-theme-turva .duet-button[disabled],.duet-theme-turva .duet-button[disabled]:hover,.duet-theme-turva .duet-button.duet-button-negative [disabled],.duet-theme-turva .duet-button.duet-button-negative [disabled]:hover{color:rgb(143, 147, 158) !important;cursor:not-allowed;background:rgb(222, 224, 228) !important;border-color:rgb(222, 224, 228) !important;outline-color:rgb(222, 224, 228) !important}.duet-button-is-loading.primary,.duet-button-is-loading.input-button-primary{color:rgb(255, 255, 255)}.duet-button-is-loading.default{color:rgb(0, 119, 179)}.duet-button-is-loading.default.duet-theme-turva{color:rgb(198, 12, 48)}.duet-button-is-loading .duet-button-contents{visibility:hidden;opacity:0}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default{color:#e61740 !important;border-color:#fbe1d1}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default:hover{border-color:#e61740;outline-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default.duet-button-negative{background-color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default.duet-button-negative:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.primary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-primary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-primary{background:#e61740;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded{color:#172a3b !important;border-color:#172a3b}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.negative{color:#172a3b !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.negative:hover{color:rgb(255, 255, 255) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain{color:#e61740 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain:hover{color:rgba(255, 255, 255, 0.8) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain[disabled]{border-color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square{border-color:#fbe1d1}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square.duet-button-negative{background:#e61740;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square:hover{border-color:#e61740;outline-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button-is-loading.default{color:#e61740}";
+const duetButtonCss = "*,*::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:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;font-size:0;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.square){margin-right:12px !important}:host(.square):last-child,:host(.square):last-of-type{margin-right:0 !important}:host(.input-button){z-index:250}:host(.duet-small),:host(.duet-x-small){margin-right:4px !important;margin-bottom:8px !important}:host(.duet-small):last-child,:host(.duet-small):last-of-type,:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host(.duet-small),:host(.duet-x-small){width:auto}}:host(.duet-x-small){margin-right:2px !important}:host(.duet-x-small):last-child,:host(.duet-x-small):last-of-type{margin-right:0 !important}:host(.square.duet-small),:host(.square.duet-x-small){margin-right:8px !important}:host(.square.duet-small):last-child,:host(.square.duet-small):last-of-type,:host(.square.duet-x-small):last-child,:host(.square.duet-x-small):last-of-type{margin-right:0 !important}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(:last-child){margin-right:0 !important}.duet-button-container{position:relative;display:block;width:100%}.duet-button{-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:flex;align-items:center;width:100%;min-width:8rem;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600;line-height:1.1;color:rgb(0, 119, 179) !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:1px;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, outline 300ms ease, padding 300ms ease, box-shadow 300ms ease}.duet-button.duet-p-0{padding:0 !important}.duet-button.duet-m-0{margin:0 !important}.duet-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-button:focus,.duet-button:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-button.duet-button-size-medium{height:50px;padding-right:30px;padding-left:30px;font-size:1rem;border-radius:25px}.duet-theme-turva .duet-button.duet-button-size-medium{padding-right:24px;padding-left:24px;border-radius:12.5px}.duet-button.duet-button-size-medium.square{border-radius:12.5px}.duet-button.duet-button-size-medium.icon-left{padding-left:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-left{padding-left:18px}.duet-button.duet-button-size-medium.icon-right{padding-right:24px}.duet-theme-turva .duet-button.duet-button-size-medium.icon-right{padding-right:18px}.duet-button.duet-button-size-small{height:40px;padding-right:20px;padding-left:20px;font-size:0.875rem;border-radius:20px}.duet-theme-turva .duet-button.duet-button-size-small{padding-right:18px;padding-left:18px;border-radius:10px}.duet-button.duet-button-size-small.square{border-radius:10px}.duet-button.duet-button-size-small.icon-left{padding-left:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-left{padding-left:14px}.duet-button.duet-button-size-small.icon-right{padding-right:18px}.duet-theme-turva .duet-button.duet-button-size-small.icon-right{padding-right:14px}.duet-button.duet-button-size-x-small{height:32px;padding-right:12px;padding-left:12px;font-size:0.75rem;border-radius:8px}.duet-button.duet-button-size-x-small.icon-left{padding-left:10px}.duet-button.duet-button-size-x-small.icon-right{padding-right:10px}.duet-button.plain.duet-p-0{height:auto}.duet-button:not(.input-button-primary,.input-button-secondary,.input-button-embedded){font-variant-numeric:tabular-nums}.duet-button.duet-button-text-center{text-align:center !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only){min-width:48px}.duet-button.duet-button-is-small:not(.duet-button-icon-only).plain{padding-right:0 !important;padding-left:0 !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only).duet-p-0{padding:0 !important}.duet-theme-turva .duet-button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(198, 12, 48) !important}.duet-button .duet-button-contents{position:relative;display:flex;gap:10px;align-items:center;margin:0 auto;pointer-events:none}.duet-button .duet-button-contents.icon-right{flex-direction:row-reverse}.duet-button .duet-button-contents .duet-button-contents-slot{position:relative;top:0}.duet-button.duet-no-wrap{white-space:nowrap}.duet-button svg{width:100%;min-width:100%;fill:currentColor}.duet-button .duet-button-icon{display:flex;align-items:center}.duet-button .duet-button-icon duet-icon{width:16px;height:16px}.duet-button .duet-button-icon.large duet-icon{width:20px;height:20px}.duet-button .duet-button-icon.medium-small duet-icon{width:10px;height:10px}.duet-button .duet-button-icon.small duet-icon{width:7px;height:7px}.duet-button:active:not([disabled]){opacity:0.75;transition:none}.duet-button.default{background:rgb(255, 255, 255);border-color:rgb(181, 198, 208)}.duet-theme-turva .duet-button.default{color:rgb(198, 12, 48) !important;border-color:rgb(222, 224, 228)}.duet-button.default:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.default:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.default.duet-button-negative{background-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.default.duet-button-negative{background-color:rgb(222, 224, 228) !important}.duet-button.default.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.default.duet-button-negative:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.primary,.duet-button.input-button-primary,.duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.primary,.duet-theme-turva .duet-button.input-button-primary,.duet-theme-turva .duet-button.input-button-left-primary{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}.duet-button.primary:hover,.duet-button.input-button-primary:hover,.duet-button.input-button-left-primary:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.primary:hover,.duet-theme-turva .duet-button.input-button-primary:hover,.duet-theme-turva .duet-button.input-button-left-primary:hover{background:rgb(126, 2, 35);border-color:rgb(126, 2, 35)}.duet-button.primary:focus,.duet-button.input-button-primary:focus,.duet-button.input-button-left-primary:focus{outline:0;box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(0, 119, 179, 0.75)}.duet-theme-turva .duet-button.primary:focus,.duet-theme-turva .duet-button.input-button-primary:focus,.duet-theme-turva .duet-button.input-button-left-primary:focus{box-shadow:0 0 0 1px #fff, 0 0 0 4px rgba(23, 28, 58, 0.75)}.duet-button.secondary,.duet-button.input-button-secondary,.duet-button.input-button-left-secondary,.duet-button.input-button-embedded{color:rgb(8, 42, 77) !important;background:transparent;border-color:rgb(8, 42, 77)}.duet-theme-turva .duet-button.secondary,.duet-theme-turva .duet-button.input-button-secondary,.duet-theme-turva .duet-button.input-button-left-secondary,.duet-theme-turva .duet-button.input-button-embedded{color:rgb(23, 28, 58) !important;border-color:rgb(23, 28, 58)}.duet-button.secondary:hover,.duet-button.input-button-secondary:hover,.duet-button.input-button-left-secondary:hover,.duet-button.input-button-embedded:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.secondary:hover,.duet-theme-turva .duet-button.input-button-secondary:hover,.duet-theme-turva .duet-button.input-button-left-secondary:hover,.duet-theme-turva .duet-button.input-button-embedded:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.secondary.duet-button-negative,.duet-button.input-button-secondary.duet-button-negative,.duet-button.input-button-left-secondary.duet-button-negative,.duet-button.input-button-embedded.duet-button-negative{color:rgb(212, 223, 229) !important;border-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:rgb(222, 224, 228) !important}.duet-button.secondary.duet-button-negative:hover,.duet-button.input-button-secondary.duet-button-negative:hover,.duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(0, 119, 179) !important;border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:rgb(198, 12, 48) !important;border-color:rgb(198, 12, 48)}.duet-button.input-button-embedded{width:40px;min-width:40px !important;min-height:40px !important;margin:4px !important;border-width:0 !important;border-radius:4px !important}.duet-button.input-button{height:auto}.duet-button.negative{color:rgb(8, 42, 77) !important;background:rgb(255, 255, 255);border-color:rgb(255, 255, 255)}.duet-theme-turva .duet-button.negative{color:rgb(23, 28, 58) !important}.duet-button.negative:hover{color:rgb(255, 255, 255) !important;background:transparent;border-color:rgb(255, 255, 255)}.duet-button.negative:focus{outline:0;box-shadow:0 0 0 1px #00294d, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-theme-turva .duet-button.negative:focus{box-shadow:0 0 0 1px #0077b3, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive-primary{color:rgb(255, 255, 255) !important;background:rgb(214, 28, 82);border-color:rgb(214, 28, 82)}.duet-button.destructive-primary:hover{background:#ab1642;border-color:#ab1642;box-shadow:0 4px 20px 0 rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.destructive-primary:hover{background:#ab1642}.duet-button.destructive,.duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-theme-turva .duet-button.destructive,.duet-theme-turva .duet-button.destructive-secondary{color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255);border-color:rgb(214, 28, 82)}.duet-button.destructive:hover,.duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-theme-turva .duet-button.destructive:hover,.duet-theme-turva .duet-button.destructive-secondary:hover{color:rgb(255, 255, 255) !important;background:#ab1642;border-color:#ab1642}.duet-button.plain{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}.duet-theme-turva .duet-button.plain{color:rgb(198, 12, 48) !important;background:transparent;border-color:transparent}.duet-button.plain.duet-p-0 .duet-button-contents{height:auto}.duet-button.plain[disabled],.duet-button.plain[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}.duet-theme-turva .duet-button.plain[disabled],.duet-theme-turva .duet-button.plain[disabled]:hover{color:rgb(113, 118, 132) !important;cursor:not-allowed;background:transparent !important;border-color:rgb(222, 224, 228) !important}.duet-button.plain:hover{color:rgb(0, 75, 129) !important;background:transparent !important}.duet-theme-turva .duet-button.plain:hover{color:rgb(126, 2, 35) !important}.duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}.duet-button.plain.duet-button-negative:hover{color:rgba(255, 255, 255, 0.8) !important}.duet-button.duet-button-icon-only{min-width:48px;min-height:48px;padding:0 !important}.duet-button.duet-button-icon-only .duet-button-contents{position:static}.duet-button.duet-button-icon-only .duet-button-icon.left.large,.duet-button.duet-button-icon-only .duet-button-icon.left.medium,.duet-button.duet-button-icon-only .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded,.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{box-sizing:content-box;min-width:48px;min-height:48px;padding:0 !important;border-width:1px}.duet-button.duet-button.input-button-primary .duet-button-contents,.duet-button.duet-button.input-button-secondary .duet-button-contents,.duet-button.duet-button.input-button-embedded .duet-button-contents,.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.duet-button.input-button-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-secondary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-embedded .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-primary .duet-button-contents.icon-right,.duet-button.duet-button.input-button-left-secondary .duet-button-contents.icon-right{padding:0 16px}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary,.duet-button.duet-button.input-button-embedded{border-top-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:0}.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-primary .duet-button-icon.left.small,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.large,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.medium,.duet-button.duet-button.input-button-embedded .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-embedded{border-left-width:0}.duet-button.duet-button.input-button-left-primary,.duet-button.duet-button.input-button-left-secondary{border-top-left-radius:4px;border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px}.duet-button.duet-button.input-button-left-primary .duet-button-contents,.duet-button.duet-button.input-button-left-secondary .duet-button-contents{position:static}.duet-button.square{width:52px;min-width:auto !important;padding:0 !important;font-size:1rem;border-color:rgb(181, 198, 208);border-width:1px}.duet-button.square.duet-button-size-small{width:42px;font-size:0.875rem}.duet-button.square.duet-button-size-x-small{width:34px;font-size:0.875rem}.duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(0, 119, 179);border-color:rgb(0, 119, 179)}.duet-theme-turva .duet-button.square.duet-button-negative{color:rgb(255, 255, 255) !important;background:rgb(198, 12, 48);border-color:rgb(198, 12, 48)}.duet-theme-turva .duet-button.square{border-color:rgb(222, 224, 228)}.duet-button.square:hover{border-color:rgb(0, 119, 179);outline:2px solid rgb(0, 119, 179);outline-offset:-2px}.duet-theme-turva .duet-button.square:hover{border-color:rgb(198, 12, 48);outline-color:rgb(198, 12, 48)}.duet-button.square .duet-button-contents{gap:0}.duet-button[disabled],.duet-button[disabled]:hover,.duet-button.duet-button-negative[disabled],.duet-button.duet-button-negative[disabled]:hover{color:rgb(98, 121, 138) !important;cursor:not-allowed;background:rgb(212, 223, 229) !important;border-color:rgb(212, 223, 229) !important;outline-color:rgb(212, 223, 229) !important;box-shadow:none !important}.duet-theme-turva .duet-button[disabled],.duet-theme-turva .duet-button[disabled]:hover,.duet-theme-turva .duet-button.duet-button-negative [disabled],.duet-theme-turva .duet-button.duet-button-negative [disabled]:hover{color:rgb(143, 147, 158) !important;cursor:not-allowed;background:rgb(222, 224, 228) !important;border-color:rgb(222, 224, 228) !important;outline-color:rgb(222, 224, 228) !important}.duet-button-is-loading.primary,.duet-button-is-loading.input-button-primary{color:rgb(255, 255, 255)}.duet-button-is-loading.default{color:rgb(0, 119, 179)}.duet-button-is-loading.default.duet-theme-turva{color:rgb(198, 12, 48)}.duet-button-is-loading .duet-button-contents{visibility:hidden;opacity:0}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default{color:#e61740 !important;border-color:#fbe1d1}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default:hover{border-color:#e61740;outline-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default.duet-button-negative{background-color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.default.duet-button-negative:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.primary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-primary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-primary{background:#e61740;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded{color:#172a3b !important;border-color:#172a3b}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative{color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-left-secondary.duet-button-negative:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.input-button-embedded.duet-button-negative:hover{color:#e61740 !important;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.negative{color:#172a3b !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.negative:hover{color:rgb(255, 255, 255) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain{color:#e61740 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain.duet-button-negative{color:rgb(255, 255, 255) !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain:hover{color:#8c001e !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain[disabled],:host(.duet-theme-turva2) .duet-theme-turva .duet-button.plain[disabled]:hover{color:#5f7a8f !important;background:transparent !important;border-color:#fbe1d1 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square{border-color:#fbe1d1}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square.duet-button-negative{background:#e61740;border-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button.square:hover{border-color:#e61740;outline-color:#e61740}:host(.duet-theme-turva2) .duet-theme-turva .duet-button[disabled],:host(.duet-theme-turva2) .duet-theme-turva .duet-button[disabled]:hover,:host(.duet-theme-turva2) .duet-theme-turva .duet-button.duet-button-negative [disabled],:host(.duet-theme-turva2) .duet-theme-turva .duet-button.duet-button-negative [disabled]:hover{color:#7891a4 !important;cursor:not-allowed;background:#d4dde2 !important;border-color:#d4dde2 !important;outline-color:#d4dde2 !important}:host(.duet-theme-turva2) .duet-theme-turva .duet-button-is-loading.default{color:#e61740}";
 class DuetButton {
     constructor(hostRef) {
@@ -5532,12 +5599,12 @@ class DuetButton {
         // enforce consistency for external links
         const icon = isExternalLink ? "action-new-window" : this.icon;
         const iconRight = isExternalLink ? true : this.iconRight;
-        const commonChildren = (hAsync("span", { key: 'dad881c4e315cee7e2fa16020ab44f3b8518ce8b', class: { "duet-button-contents": true, "icon-right": iconRight }, style: { color: getColorByName(this.color) } }, icon && (hAsync("span", { key: '08d196d1bc190ccb57d8f4961a78e1999f69a6f1', "aria-hidden": "true", class: {
+        const commonChildren = (hAsync("span", { key: '4b6618222c037ec329c118f7ad247b9fd514e878', class: { "duet-button-contents": true, "icon-right": iconRight }, style: { color: getColorByName(this.color, this.theme) } }, icon && (hAsync("span", { key: '67492c9b50231879ba232f7c6bcdadcb2d219875', "aria-hidden": "true", class: {
                 "duet-button-icon": true,
                 left: !iconRight,
                 right: iconRight,
                 [this.getButtonIconSize()]: true,
-            } }, hAsync("duet-icon", { key: '24ffeda883152bfe0123a828ed037aa7bdf365aa', size: "auto", margin: "none", name: icon, color: "currentColor" }))), hAsync("span", { key: '60cbc950fc893b105e13e98769341697d3065e87', class: "duet-button-contents-slot" }, hAsync("slot", { key: '236c0748e32a96046fe4bf1c79b6822ebf5c0b9d' }))));
+            } }, hAsync("duet-icon", { key: 'fce0630d78df187c2a7f3946ff3d262c43e5ce95', size: "auto", margin: "none", name: icon, color: "currentColor" }))), hAsync("span", { key: '34d608211bac6921c4aec51f71a9b33e2ac2b7b0', class: "duet-button-contents-slot" }, hAsync("slot", { key: 'b2478d851993c148be6a83a76f9f725469bc9944' }))));
         const size = this.size == "medium" || this.size == "small" || this.size == "x-small" ? this.size : "medium";
         const commonProps = {
             onFocus: this.onFocus,
@@ -5572,7 +5639,7 @@ class DuetButton {
             "aria-details": this.accessibleDetails,
             "aria-description": this.accessibleDescription,
         };
-        return (hAsync(Host, { key: '2f71565d21679c2161cbebaa8b3bfaa7aa4183a0', class: {
+        return (hAsync(Host, { key: 'c70e2d9cbe884c7b6cc3012721f01ce6d54b4555', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-small": this.size === "small",
                 "duet-x-small": this.size === "x-small",
@@ -5580,13 +5647,13 @@ class DuetButton {
                 "duet-expand": this.expand,
                 [this.variation]: true,
                 "input-button": (_b = this.variation) === null || _b === void 0 ? void 0 : _b.startsWith("input-button"),
-            } }, hAsync("span", { key: '2a2d449975f67608f602eaca489e4ff865496ed8', onClick: this.handleClick, class: {
+            } }, hAsync("span", { key: 'c8be7792d2ae572befbfbe921a3ec453c073637d', onClick: this.handleClick, class: {
                 "duet-button-container": true,
                 "duet-button-is-loading": this.loading,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-button-negative": this.negative || this.variation === "negative",
                 [this.variation]: true,
-            } }, this.url ? (hAsync("a", Object.assign({}, commonProps, { href: this.url, target: this.external ? "_blank" : "_self", rel: this.external ? "noopener" : undefined }), commonChildren, this.external && hAsync("duet-visually-hidden", null, ", ", this.accessibleLabelExternal))) : (hAsync("button", Object.assign({}, commonProps, { type: this.getButtonType(), disabled: this.disabled, name: this.name, value: this.value, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, "aria-disabled": this.disabled }), commonChildren, this.loading && hAsync("duet-visually-hidden", null, " ", this.accessibleLabelLoading, " "))), this.loading && hAsync("duet-spinner", { key: 'e27fdd855b9191cdd22c9b74746f3144890d3837', color: "currentColor" })), hAsync("slot", { key: '5f1fec755bfdf56ed261b893fa647308c1e21a7f', name: "proxybutton" })));
+            } }, this.url ? (hAsync("a", Object.assign({}, commonProps, { href: this.url, target: this.external ? "_blank" : "_self", rel: this.external ? "noopener" : undefined }), commonChildren, this.external && hAsync("duet-visually-hidden", null, ", ", this.accessibleLabelExternal))) : (hAsync("button", Object.assign({}, commonProps, { type: this.getButtonType(), disabled: this.disabled, name: this.name, value: this.value, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, "aria-disabled": this.disabled }), commonChildren, this.loading && hAsync("duet-visually-hidden", null, " ", this.accessibleLabelLoading, " "))), this.loading && hAsync("duet-spinner", { key: 'da956cda627d2afc5084ee69629b54ffabcb672b', color: "currentColor" })), hAsync("slot", { key: '0ead01a475d6242c0049a259f9b9c725830d4b80', name: "proxybutton" })));
     }
     get element() { return getElement(this); }
     static get style() { return duetButtonCss; }
@@ -5678,11 +5745,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: '7b43cc9fece7d0d99bf82608e9b6589f3ed8b489' }, hAsync("div", { key: '4c4445772fddecce9a44303683db307de0023e93', class: {
+        return (hAsync(Host, { key: 'c491469b698a73c9a411cf3f660770be81879bd7' }, hAsync("div", { key: '4c7e1af2f3c229e617d04c0aaf1355bce04a2d6d', class: {
                 "duet-callout": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
-            } }, hAsync("figure", { key: 'f41e9f1c7185f653cc0c0934563f3627858b7d1a', class: "container" }, hAsync("duet-icon", { key: '096ced2368e55130723c70f850d3b5fea5779596', 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: 'ff2cab036cc8125ba9a68c8c3647b03335579910' }, hAsync("slot", { key: 'c55b341a7d23dde596da8c047efdbd12ef4d654f' })), this.hasAuthorSlot && (hAsync("figcaption", { key: '3c3b17738471cdec3c2212bd739ff3603805dadf', class: "author" }, hAsync("span", { key: '7a2db6782d7207601063befe44ac0975d7e9a155' }, "\u2014 "), hAsync("slot", { key: '45e20af337cd8917a6b382e99810b719be56a106', name: "author" })))))));
+            } }, hAsync("figure", { key: 'eb03690c450a0d767e18bffdbce24d83e3334e65', class: "container" }, hAsync("duet-icon", { key: '1695f3f5c59f29b3497a9df3269e791bc19095a6', 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: '6297aefa621ef90e3cb100bcfd07c798cf9b378a' }, hAsync("slot", { key: '14186875763fbf1989d9de9cb90706be15de8508' })), this.hasAuthorSlot && (hAsync("figcaption", { key: 'c17e4fe83fb3c067c4c91369ee6d80a2a6abf3a8', class: "author" }, hAsync("span", { key: 'fac4c2303e1ff78e28fd1538ab43d1b19e84610f' }, "\u2014 "), hAsync("slot", { key: '648acac653c20369d7d52a5537c43175cb4dbd5d', name: "author" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetCalloutCss; }
@@ -6162,11 +6229,11 @@ class DuetCheckmark {
         inheritGlobalTheme(this);
     }
     render() {
-        return (hAsync(Host, { key: 'c1a7b6ac64ad31e1f0b758a02c8c47eaab39af2a', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: '14ec22df27a107b2928206d6ae43a7f2ebf6e65c', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: 'ca6409ae1e39334a9bac2dc6d76a3c566a3bb5fd', class: {
+        return (hAsync(Host, { key: '9a2512992413ec797c17d55d2a41908cda0e6307', class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("div", { key: 'f95a151961586c89597dd2d31436deecc0cabf4d', role: this.presentationOnly ? "presentation" : null, class: { checked: this.checked } }, hAsync("div", { key: '42f1b50012a17910a3c1d91bac31bfc370c73abf', class: {
                 "duet-checkmark-container": true,
                 center: this.center,
                 "duet-checkmark-radio": this.type === "radio",
-            } }, this.checked && hAsync("div", { key: '4d54d9054d040beff0af5e51406ca38dc670a775', class: "duet-checkmark" })))));
+            } }, this.checked && hAsync("div", { key: 'ed62491f54edf398da1c22ae672683107b6aa8bc', class: "duet-checkmark" })))));
     }
     static get style() { return duetCheckmarkCss; }
     static get cmpMeta() { return {
@@ -7207,14 +7274,14 @@ class DuetChoiceGroup {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'c699b4df66f0ac662a9c33eb7231a79f0069e352', onDuetChange: this.onSelect, onDuetChoiceReady: this.onChoiceReady, onDuetChoiceRemove: this.onChoiceRemove, class: {
+        return (hAsync(Host, { key: 'd339b389eb4a7e9867dc0646ad760bce3e835714', onDuetChange: this.onSelect, onDuetChoiceReady: this.onChoiceReady, onDuetChoiceRemove: this.onChoiceRemove, class: {
                 horizontal: this.direction === "horizontal",
                 "duet-choice-group-breakpoint-x-small": this.responsive && this.breakpoint === "x-small",
                 "duet-choice-group-breakpoint-small": this.responsive && this.breakpoint === "small",
                 "duet-choice-group-breakpoint-medium": this.responsive && this.breakpoint === "medium",
                 "duet-choice-group-breakpoint-large": this.responsive && this.breakpoint === "large",
                 "duet-choice-group-breakpoint-x-large": this.responsive && this.breakpoint === "x-large",
-            } }, hAsync("duet-fieldset", { key: '0a9a5912428d739275b51fbdb8a9f20976e06921', label: this.label, labelHidden: this.labelHidden, compactLabel: true, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (hAsync("duet-tooltip", { key: '684d19b9020aff9c6b5f11ec396d9373e2a867d7', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: '010185093598a5b96b05756c6747a976164a80fb', name: "tooltip" }), hAsync("div", { key: '0ccba32a863f027d1f5540bdf3c5820091e92339', class: { [this.choiceGroupName]: true, "duet-no-stacking": !this.responsive } }, hAsync("slot", { key: '9324a39a1b862a7043a328f72b12ee7407c01634' })))));
+            } }, hAsync("duet-fieldset", { key: '00a0c17d4dda00d8482933db51e713995820d82d', label: this.label, labelHidden: this.labelHidden, compactLabel: true, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (hAsync("duet-tooltip", { key: '3d4ef32226b7f822175c071479f2e3339fbfdf6b', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: '89e8ef0c51e053463d12ed01ba61b814b28623ec', name: "tooltip" }), hAsync("div", { key: 'a86be50bed561647750f76764f9998567360318d', class: { [this.choiceGroupName]: true, "duet-no-stacking": !this.responsive } }, hAsync("slot", { key: '629c8b4458323f78742eedebe2807010079ccec0' })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -8836,10 +8903,10 @@ class DuetContactCard {
     render() {
         const isTurva = this.theme === "turva";
         const theme = isTurva ? "turva" : "default";
-        return (hAsync(Host, { key: '3272d27bcc10144d216c6d1863ea9cc637a3401b', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '88be6baa9a043ccc67ad98e26d31739f1d7c9945', class: {
+        return (hAsync(Host, { key: 'a08fac4daef7586a885d4556d27260feb027d4fb', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'd70cc29e06be46210e3150661f16bcf19fab27b1', 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: '2e24ce61855b99588153a21aaa99c5dac76c4825' }, this.name && (hAsync("duet-heading", { key: '6422b20608bca5107c55c9d18586066d466c6fa6', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: 'e599cd8245a9baaf9423394e834a85e1a48f16bd', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: '98d53e8ed97c94b29f56043cebd189d2130f95db', class: "email" }, hAsync("duet-icon", { key: '4ba40279d941e793851a38e9488eff00834bfd22', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: 'c05eccbe5c086a75ceeab7dc323ad7eb7c2c94d1', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: '63f8b9f6fe184471111264ec7d57260db9065f37', class: "phone" }, hAsync("duet-icon", { key: '316263ef35741264d50e7787126957fa2239a335', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '82999e5314d5939680b98d89c967828206f6b528', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: 'a411e780af5967096932c4af4ff2a6243e054dc6', class: "call-to-action" }, hAsync("duet-button", { key: 'e9a5d840f63ea79f8e976009f4bea709326bb720', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: 'b8950e2e0f56c3cd06ba040fa76bec66effb5976' }), hAsync("slot", { key: 'acd4890b04569ddce558b8a6fd873e08946df8bb' }))));
+            }, role: "group", "aria-label": this.name }, this.image ? hAsync("img", { class: "image", src: this.image, alt: this.name }) : hAsync("div", null), hAsync("div", { key: '4cde139368ebb252e83638d0634671f2167b14a0' }, this.name && (hAsync("duet-heading", { key: 'c91fe7f5ef066de893cfa2fb4018e9b17e5e66af', class: "name", level: "h3", margin: "none", theme: theme }, this.name)), this.description && (hAsync("duet-paragraph", { key: '9ef8bdab5f11c125115cfa147428327131e6086a', class: "description", margin: "none", theme: theme }, this.description)), this.email && (hAsync("div", { key: 'd07bbb21d8963247655a3b172e26c9f1becc2fd2', class: "email" }, hAsync("duet-icon", { key: 'd25b13911b29302d0eabc8f715e13ff59b473c7f', name: "navigation-message", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '2765a6cbc0fb671c3cb8a37d7ac2fe578f369cfe', url: `mailto:${this.email}`, accessibleLabel: `Email: ${this.email}`, theme: theme }, this.email))), this.phone && (hAsync("div", { key: 'fcbed4d2a82ed0ee1e90665f5e42f10bfdcaf344', class: "phone" }, hAsync("duet-icon", { key: '17233a8a4863c68255e207c23de3667437bd1177', name: "form-tel", size: "x-small", color: "primary-dark", margin: "none", theme: theme }), hAsync("duet-link", { key: '0a49811728ddfd13096701fe9d33c54722554107', url: `tel:${this.phone}`, accessibleLabel: `${this.phoneLabel[this.language]}: ${this.phone}`, theme: theme }, this.phone)))), this.buttonUrl && this.buttonText && (hAsync("div", { key: 'eb199cf8f4f83cb7ebebbfb2e791c78b6424091e', class: "call-to-action" }, hAsync("duet-button", { key: 'c8e0d2d72d5b15a74b0d7fd79a595c6ffddf6f7e', variation: "default", icon: this.buttonIcon, fixed: true, margin: "none", url: this.buttonUrl, theme: theme }, this.buttonText))), hAsync("div", { key: '5e2f0915b883c85ad3bca3f54b62347af8250749' }), hAsync("slot", { key: '388383ea2ca2a756a28d13bdbf521cd85094526a' }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetContactCardCss; }
@@ -10320,20 +10387,20 @@ class DuetFieldset {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'cd6c5c663bfac687b8af1150658e9bc9e2866719', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: '2586b5ed0c097d34267da9945bddab85d36d32de', "aria-labelledby": this.labelId, "aria-describedby": this.error ? this.errorId : null,
+        return (hAsync(Host, { key: 'c761c38f09035452c65fd2a660bc83eb9f0325a7', class: { "duet-m-0": this.margin === "none" } }, hAsync("fieldset", { key: 'c62cd3a0354883251b153612cd9a685059205638', "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: 'b1a3128ea5cbcf5a416562cb0642275587a1e58d', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: '3a4e0978acf8c9a89fd93e121c8a0cf1d6caabe7' }, this.label), this.caption && hAsync("span", { key: '09c1786e15eb127dc6e1aa9c48084ffaaa54a70b' }, this.caption)), hAsync("div", { key: '4b55a73deb44c934699ee6af1ed49f2339f036c8', class: {
+            } }, hAsync("legend", { key: 'a67feca7ba42a9de83e3eacfa41bb9c53de0185d', id: this.labelId }, hAsync(this.labelHeadingLevel, { key: '98598e545d1ac5d30cead1818c2831285e21fd59' }, this.label), this.caption && hAsync("span", { key: '44d72ba880fb2ba4b2e9826389ca0b23a4c09446' }, this.caption)), hAsync("div", { key: 'd6680f823096d1510778845d46bcf10f3070064c', 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: 'b87ddef8f9373fad104a4eee49ff9d7983407314', class: "duet-fieldset-label" }, hAsync("span", { key: '84d18e50d219fe9b4ce6d6d03068260f66bbbb13', "aria-hidden": "true" }, this.label), hAsync("slot", { key: '4aa129b64173a74dbe96683f98d0d7ddfe69c127', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: '6bb867cb3c26d53bd8601729e87c5d32a8682d4a', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: 'e1d4e178c0292dd8f409b45b04f8af30f8dd36e6', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: '094a1cce9f3346ad27331e4e9b33443e7cfc666a' }), hAsync("span", { key: 'fa3b0c5d05e7acf22c9d6ff005164567b8c43f20', class: "duet-fieldset-help duet-fieldset-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: 'a731c1c071f24d69ffd89a16f9759a2f8c48b7bc', class: { "duet-m-0": this.lastItemIsChip } }, this.error)))));
+            } }, hAsync("div", { key: '126ab7bb76240a4da7d9b647955a8a804875e375', class: "duet-fieldset-label" }, hAsync("span", { key: 'ff60e083f1776471163c59d196d5a98e32279456', "aria-hidden": "true" }, this.label), hAsync("slot", { key: '06eb238c6e9921dca17ca43ae38a1de2351af119', onSlotchange: this.checkHasTooltip, name: "tooltip" })), this.caption && (hAsync("div", { key: '5a7a0bcb4167f6ffbf89880060e05f82e032012b', class: "duet-fieldset-caption", "aria-hidden": "true" }, hAsync("duet-caption", { key: '7781c0787fe4ff082d80e9bc2e7ea2280da13d7e', theme: this.theme, margin: "none" }, this.caption)))), hAsync("slot", { key: 'd6227947f219d39ca25e5a3ac582e4459e58d504' }), hAsync("span", { key: 'ecf7f364237951e9bceacf067e854118b5676009', class: "duet-fieldset-help duet-fieldset-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: 'e7a456498d709f36eba051c5ce891f5b9b39c5fb', class: { "duet-m-0": this.lastItemIsChip } }, this.error)))));
     }
     get element() { return getElement(this); }
     static get style() { return duetFieldsetCss; }
@@ -10848,7 +10915,7 @@ class DuetGridItem {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '18d9a9b7229ad1f9a982e7db464174d80fd54010', style: {
+        return (hAsync(Host, { key: '116018aebb0122341885d5c189c49e80651a9c8d', style: {
                 "min-width": this.minWidth,
                 "max-width": this.maxWidth,
             }, class: {
@@ -10865,7 +10932,7 @@ class DuetGridItem {
                 "duet-grid-item-br-medium": this.breakpoint === "medium",
                 "duet-grid-item-br-large": this.breakpoint === "large",
                 "duet-grid-item-br-x-large": this.breakpoint === "x-large",
-            } }, hAsync("slot", { key: '6325019d12132b553bd3e6ee18b544bdb7b316e0' })));
+            } }, hAsync("slot", { key: '8f0abe7f48298866dc52e646b8d08bbeaf4ce234' })));
     }
     static get style() { return duetGridItemCss; }
     static get cmpMeta() { return {
@@ -11708,7 +11775,7 @@ class DuetHeader {
                     "duet-theme-turva": this.theme === "turva",
                     "duet-header-back": true,
                     "duet-header-inactive": true,
-                }, part: "header" }, hAsync("div", { class: "duet-header-top" }, skipToLabel(), hAsync("duet-button", { url: this.processedBack.href, id: this.processedBack.id, theme: this.theme, variation: "plain", color: this.theme === "turva" ? "secondary-turva" : "secondary", icon: "navigation-arrow-left", iconSize: "large", onClick: this.handleBackClick }, this.processedBack.label), logo(), hAsync("slot", { name: "logo-utility" }))))));
+                }, part: "header" }, hAsync("div", { class: "duet-header-top" }, skipToLabel(), hAsync("duet-button", { url: this.processedBack.href, id: this.processedBack.id, theme: this.theme, variation: "plain", color: postfixTheme("secondary", this.theme), icon: "navigation-arrow-left", iconSize: "large", onClick: this.handleBackClick }, this.processedBack.label), logo(), hAsync("slot", { name: "logo-utility" }))))));
         }
         const itemsHaveSubItems = this.processedItems && this.processedItems.some(item => item.items && item.items.length > 0);
         const isSecondLevelActive = this.processedItems &&
@@ -12403,11 +12470,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: '76f73c7dca17d692bbeb97384c1e73d91167da94', class: {
+        return (hAsync(Host, { key: '2f6837b926530cee2afc83a590aa1ccb0dfeca03', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-icon-has-outline": !!this.outline,
                 "duet-icon-has-background": !!this.background,
-            } }, hAsync("span", { key: '9b05a63c459de0c823aad5bb4995737b2991e746', "aria-hidden": "true", style: styles, class: {
+            } }, hAsync("span", { key: '6fa86044b5f3966537f38590bd12b28b698a080b', "aria-hidden": "true", style: styles, class: {
                 "duet-icon": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
@@ -12416,7 +12483,7 @@ class DuetIcon {
                 [shapeStyle]: true,
                 rotated: this.shape === "brand-rotated" && this.theme !== "turva",
                 "duet-icon-not-responsive": !this.responsive,
-            } }, hAsync("span", { key: 'd12bceed54d5f4e6299fe854626e831014851622', "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: '4ba33bca7da0ccbc0f11b1b5693e7912d0a0d45d', "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 {
@@ -13522,12 +13589,13 @@ class DuetLink {
      * Always the last one in the class.
      */
     render() {
-        const Tag = !this.url ? "button" : "a";
+        const Tag = !this.url && this.variation !== "default" ? "button" : "a";
+        const role = !this.url && this.variation === "default" ? "button" : null;
         const isButton = Tag === "button";
-        return (hAsync(Host, { key: 'e3b157ccb9d11b818957ca23817aecb0fa14588e', class: {
+        return (hAsync(Host, { key: 'eae1c61afe3b8413b109313020b9757cfe7f2e42', class: {
                 [`duet-link-${this.variation}`]: true,
                 "duet-m-0": this.margin === "none",
-            } }, hAsync(Tag, { key: '11b086047abdc814b8816e64268128d831fd84c0', href: this.url, class: {
+            } }, hAsync(Tag, { key: '973984aeb4ef7dd331df49218b1552a4955b80c2', href: this.url, class: {
                 "duet-link": true,
                 "duet-link-is-external": this.external,
                 "duet-link-is-download": !!this.download,
@@ -13538,7 +13606,7 @@ class DuetLink {
                 "duet-p-0": this.padding === "none",
                 [this.padding]: true,
                 [this.variation]: true,
-            }, target: this.download || !this.url ? null : this.external ? "_blank" : "_self", download: this.resolvedDownload, "aria-label": this.ariaLabel, "aria-expanded": this.accessibleExpanded != null && isButton ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null && isButton ? this.accessiblePopup.toString() : undefined, id: this.identifier, ref: el => (this.nativeLink = el), part: "duet-link", rel: this.external ? "noopener" : undefined }, this.renderContent())));
+            }, target: this.download || !this.url ? null : this.external ? "_blank" : "_self", download: this.resolvedDownload, "aria-label": this.ariaLabel, "aria-expanded": this.accessibleExpanded != null && isButton ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null && isButton ? this.accessiblePopup.toString() : undefined, id: this.identifier, ref: el => (this.nativeLink = el), part: "duet-link", rel: this.external ? "noopener" : undefined, role: role }, this.renderContent())));
     }
     static get delegatesFocus() { return true; }
     get element() { return getElement(this); }
@@ -13783,7 +13851,7 @@ class DuetListItem {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '2ea81e262bcaf94d3251db09d246c4c647857210', class: {
+        return (hAsync(Host, { key: '47185c0399f547a7d80ac43adf617b617e33e604', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-no-stacking": !this.responsive,
                 "duet-list-item-breakpoint-x-small": this.breakpoint === "x-small",
@@ -13791,7 +13859,7 @@ class DuetListItem {
                 "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: '4d3bfaea430a2d1a06d271b685c1474724d5cf75' }, hAsync("slot", { key: 'dfe274b441d097022049103369ca4b07e22ac567', name: "label" })), hAsync("dd", { key: '67a4902f2ed46357f47d185e12cd10abba4fef60' }, hAsync("slot", { key: '5af5e6f427b8673d4aa282063b98c4f797247693', name: "value" }))));
+            } }, hAsync("dt", { key: '6ae3c144789f6f61efd296b660b88b180a5e0e38' }, hAsync("slot", { key: 'c33e76c13b822b05a938e421d6eb53ef95e403f7', name: "label" })), hAsync("dd", { key: '31bda43d4a91ec3b4a44746a0ddde2f7b91845c2' }, hAsync("slot", { key: 'c1ce54a0b9a7dd7256a7dcf3a32bef70bb063621', name: "value" }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetListItemCss; }
@@ -14189,10 +14257,10 @@ class DuetMenuBarButton {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '10625574045c3473cbd4b14cff1dbb559f011d36', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: '489e6d9c6954ab615a0da03ce8e97a60178a00fa', ref: button => (this.nativeButton = button), class: {
+        return (hAsync(Host, { key: '5e64c2ede59d8e16972663cace2e98dffca3a060', role: "listitem", onfocus: () => this.setFocus() }, hAsync("button", { key: '362525c4f563bd1a5ffad7b8fee029d904fb72c8', 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: 'f1df08b19b5da34664112330d91e5505378531e0', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '4f0974a460336476540a9831203f65bb4c2fe895' }))));
+            }, "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: '439d74e7bdfb1396a7c1e2940c3bcf142c3150b6', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '61a36d95ee1b2962b3f966dc99678c7e00c00692' }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetMenuBarButtonCss; }
@@ -14282,17 +14350,17 @@ class DuetMenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '67715fe3c6453ddeefd413f7663ad2e4241fa938', role: "listitem" }, hAsync("div", { key: '6689572c8887e53a99588bb99302cd10081b7376', class: {
+        return (hAsync(Host, { key: '870e7ba2d40001532dabdb4c9468b73570e1ade7', role: "listitem" }, hAsync("div", { key: '7c60bf682acd9d11e8633f862f07391a706de817', 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: '95cd6a5d291aa18c5ee4a431d7d35f308dd1aab1', 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: 'c0bdf57ef46ae179d3c0d6e7f45bdd7ffe10769b', 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: '9441f84f9cd55041604fa0e9f09c81dba10838f8', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '5e976c5d97cca3bbbea1ef2f198f8cb342a49979', class: "label" }, hAsync("slot", { key: '06af378be8f86d5b9fe3774b490df8fda85634dd', name: "label" }), hAsync("duet-icon", { key: '227e8bfe3123975b543fd75e6a0589c936a0b167', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '4b841a5a6896d802e76c85011f016ed2bf4edb44', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: 'c97e52d72933959ecbd6b9519940427735cdeccc', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'd831c0f2defb108643ac9a11f6be93f4f98a8dbc', class: "label" }, hAsync("slot", { key: 'c396567614cd3badd2b373a1922ea907f75750a8', name: "label" }), hAsync("duet-icon", { key: '4e8adfdf9998028a514fa386275affa9c4fe29be', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '683257ed3f02ee4cde289c0efe48af7f06fa50c5', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'e62a791124ad9eb4f114c3c064f012f9d5cfe3d4' })))));
+            } }, hAsync("slot", { key: '281de42fd56a1c9be76c9b4218d4354032a56834' })))));
     }
     get element() { return getElement(this); }
     static get style() { return duetMenuBarDropdownCss; }
@@ -14359,11 +14427,11 @@ class DuetMenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'a524f636cab58320a3abf6b4b86bc853af3c057b' }, hAsync("a", { key: 'ba3cf50366da3f3b220340c73854d2ac28516c48', class: {
+        return (hAsync(Host, { key: '6d31641d480353ee7f924029a31c94dc1747f1ed' }, hAsync("a", { key: 'ea374446994ad7ea0780b8f4320247c718f08219', 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: 'ade470f849abf31cea7d89306b38bcb80d9152d3', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: '0426caf4880cf11249ee70160896196cbdd2f830' }))));
+            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '486173db589cdbf851d3a5dd9171990af84707bb', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("slot", { key: 'd284cabdff17ad2590e80ed02894fe87425507b0' }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetMenuBarDropdownLinkCss; }
@@ -14449,11 +14517,11 @@ class DuetMenuBarItem {
      */
     render() {
         const TagName = this.url ? "a" : "button";
-        return (hAsync(Host, { key: '3e4ba0fb17318cd3f7f3ce8bd5141632cf70b592', role: "listitem" }, hAsync(TagName, { key: '3b3fe61137bad1ff974adbd75f5eae67d3aeb5fb', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
+        return (hAsync(Host, { key: 'd968cd5ac488d7cc0fea66408de412524dc88b35', role: "listitem" }, hAsync(TagName, { key: '143da0db925d6a45f69a6defcc0d96710d395cbf', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
                 "duet-menu-bar-item": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: 'f60bfc42fc389b0b151783bb92c0c86211260de4', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '3d1c4464f3f6e593137a1f28b4887793360393f1' }), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: '72f5fbd98a81475a7488da4b9584db8b3172fd46', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '22ef7c16eb08f2a24bbd902c1e702103a8319621', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '9560bccb8d749a945592866e33279c9e1686f9af' }), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: 'c152621621d193d9d80cc0984fe36d230a2b7a63', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!this.external,
@@ -14518,11 +14586,11 @@ class DuetMenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '90d2470d7231825e50ed308c571372331ff556e6', role: "listitem" }, hAsync("a", { key: '87729d77e74e49221ad950f2089a9dad55893462', class: {
+        return (hAsync(Host, { key: 'd150209d2395822ac0ba4b0d6372bdc0ba5532fd', role: "listitem" }, hAsync("a", { key: '46070813f893e645146a7ca8ea798fa455df11e9', 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: '1a72a66e3d2e8261f526faf5d0091d52db5d3485', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: '63e4dfc0edd32bb92ff98ad8df15f17fcf3c82fc' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: 'bac5752b20258b49e6b3210f071578154de8d8d8', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), hAsync("slot", { key: 'efec03fcc7a033a4f9df871a4a087d7c9a04a0e8' }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetMenuBarLinkCss; }
@@ -14708,9 +14776,18 @@ class DuetModal {
             enableBodyScroll$1(this.variation === "slide-up" ? this.modalContentEl : this.modalEl);
             this.duetClose.emit();
             this.teleport.removeInertFromSiblings();
-            setTimeout(() => {
-                focusElement(this.focusedElBeforeOpen);
-            }, TRANSITION_MS);
+            if (this.focusElementOnClose !== "") {
+                setTimeout(() => {
+                    let focusEl = this.focusedElBeforeOpen;
+                    if (typeof this.focusElementOnClose === "string") {
+                        focusEl = document.getElementById(this.focusElementOnClose) || focusEl;
+                    }
+                    else {
+                        focusEl = this.focusElementOnClose || focusEl;
+                    }
+                    focusElement(focusEl);
+                }, TRANSITION_MS);
+            }
             if (this.isAndroidDevice) {
                 window.removeEventListener("resize", this.handleAndroidResizeEvents);
             }
@@ -14768,6 +14845,12 @@ class DuetModal {
     async hide() {
         this.open = false;
     }
+    /**
+     * Set focus on the close button of the modal.
+     */
+    async focusCloseButton() {
+        this.buttonEl.setFocus();
+    }
     /**
      * Scolls the top of the modal's content into view
      *
@@ -14829,20 +14912,16 @@ class DuetModal {
      */
     render() {
         var _a, _b;
-        let iconColor = "primary";
-        let closeColor = "secondary";
-        const closingButton = (hAsync("div", { key: '16ecdebdff260207b978a3c14686bb27f99369bc', class: "duet-modal-close" }, hAsync("duet-button", { key: '832185b0eb84406145281ec31a310cba640f42db', ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
-        if (this.theme === "turva") {
-            iconColor = "primary-turva";
-            closeColor = "secondary-turva";
-        }
-        return (hAsync("div", { key: 'ff98af4d04d36b5967954bae9fad52d8a3c92af1', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
+        const iconColor = postfixTheme("primary", this.theme);
+        const closeColor = postfixTheme("secondary", this.theme);
+        const closingButton = (hAsync("div", { key: '39d89598c50f59be771033542b474cc6b7e1df0b', class: "duet-modal-close" }, hAsync("duet-button", { key: 'b5c6f0c486eaa24d4c7747a839288562e63808bf', ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
+        return (hAsync("div", { key: '07de0b18de78d147afa8cdaeadc39c877cd32dca', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
                 "duet-modal-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-modal-active": this.open,
                 "duet-modal-slide-up": this.variation === "slide-up",
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
-            } }, hAsync("duet-overlay", { key: 'f5b45235e96cfe9afc7e698f58758f3889c3fd18', "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { key: '8e01ae356b01d920b2dc99fb9012d0b36e1160c2', ref: modalInner => (this.modalInnerEl = modalInner), class: {
+            } }, hAsync("duet-overlay", { key: '08d67fe06635ffce14ed2151c9b7211740f5366f', "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), hAsync("div", { key: '83d7365182d8a008dbceca7d19d5f110d4e3e39a', ref: modalInner => (this.modalInnerEl = modalInner), class: {
                 "duet-modal-inner": true,
                 [this.size]: true,
                 "duet-modal-slide-up": this.variation === "slide-up",
@@ -14853,18 +14932,22 @@ class DuetModal {
                         this.closeModal(e);
                     }
                 }
-            } }, hAsync("div", { key: '4b67fe5599c29429e2e43d2fa3ec1e4bb2362f5a', ref: modalContentEl => (this.modalContentEl = modalContentEl), class: {
+            } }, hAsync("div", { key: '926f82204442851d8fa4d3b83c49fa1b3e0970f0', ref: modalContentEl => (this.modalContentEl = modalContentEl), "aria-live": this.accessibleAnnounceChanges === "all" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "all" ? "true" : null, class: {
                 "duet-modal": true,
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
                 [this.size]: true,
                 [this.variation]: true,
-            } }, this.gutterSize !== "none" && !this.hasStickyHeader && hAsync("duet-spacer", { key: '1fc3a1a23142493d5a384fcd1dfbc5e0cb471de4' }), this.hasStickyHeader ? (hAsync("div", { class: "duet-modal-sticky-header" }, closingButton, hAsync("slot", { name: "sticky-header" }))) : (closingButton), hAsync("div", { key: '2f216eb1c8db56490a684203edfdb93bcfd736c7', class: {
+            } }, this.gutterSize !== "none" && !this.hasStickyHeader && hAsync("duet-spacer", { key: 'b1b6c5d0fab63540a89c585e09db2044a9944957' }), this.hasStickyHeader ? (hAsync("div", { class: "duet-modal-sticky-header" }, closingButton, hAsync("slot", { name: "sticky-header" }))) : (closingButton), hAsync("div", { key: '55e0891ac4dc8e5eaebd53740ccc2afb4759c45c', class: {
                 "duet-modal-body": true,
                 "duet-modal-gutter-none": this.gutterSize === "none",
                 "duet-modal-gutter-small": this.gutterSize === "small",
                 "duet-modal-gutter-medium": this.gutterSize === "medium",
                 "duet-modal-gutter-large": this.gutterSize === "large",
-            } }, hAsync("div", { key: 'e727afc6bd9c81124f632929b840cc0beaac6537', class: "duet-modal-header" }, hAsync("span", { key: '8a55cf9f79f46df6f7d15961f7d1300cc42fe345', class: "duet-modal-inner-slot-top" }, hAsync("slot", { key: 'c79cbee03e0bce0b44b4d816b5c4d02b05605a10', name: "top" })), this.icon && hAsync("duet-icon", { key: '278d6e8d84de7394267291e0fb294c577e7be718', name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { key: 'fad28910b603089cfd9f3bf4fb1e9dc4df6a4d6a', "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (hAsync("div", { key: '67d1778db551a40565263f39968e8a7f3e3d148d', class: "duet-modal-spinner" }, hAsync("duet-spinner", { key: '71fddb78ad12e0ce90c14a725ac017431bf8864a', size: "large", color: "primary" }))), hAsync("div", { key: 'e0a601e11fa6761658d6f74af02a509b835e6f37', class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el), "aria-live": this.variation === "loader" ? "assertive" : "off" }, hAsync("slot", { key: 'a0ef6dab10ebc813443950cbb369303fd2b305a4' })))))));
+            }, "aria-live": this.accessibleAnnounceChanges === "heading" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "heading" ? "true" : null }, hAsync("div", { key: '1cab42f970d7b12c6684ac63e37324516180d168', class: "duet-modal-header" }, hAsync("span", { key: 'a3e9c69a6eb8ebcc8e0cbb282e14438c20153f7c', class: "duet-modal-inner-slot-top" }, hAsync("slot", { key: 'b719c6a7ae968b6687f259d061ec414326ad9301', name: "top" })), this.icon && hAsync("duet-icon", { key: '378d48739073800b81634af0441e5b82013df9a6', name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (hAsync("duet-heading", { key: '8052f57a3d06363e38bcf748d81e37ec8d9e7928', "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (hAsync("div", { key: 'c98e91827794451431e8f875994446ee09d5bd9f', class: "duet-modal-spinner" }, hAsync("duet-spinner", { key: '08f09524dd18e633063e5a5ac5fced5103610d7d', size: "large", color: postfixTheme("primary", this.theme) }))), hAsync("div", { key: 'b237e8483fd62056b4f99507a78580983b1135a8', "aria-live": this.variation === "loader"
+                ? "assertive"
+                : this.accessibleAnnounceChanges === "body"
+                    ? "polite"
+                    : null, "aria-atomic": this.accessibleAnnounceChanges === "body" ? "true" : null, class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el) }, hAsync("slot", { key: 'f9ed9945e262cbb20ff4c51d1a2e67329eae9a5e' })))))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -14895,9 +14978,12 @@ class DuetModal {
             "color": [1],
             "active": [1540],
             "closeOnBlur": [1028, "close-on-blur"],
+            "focusElementOnClose": [1, "focus-element-on-close"],
+            "accessibleAnnounceChanges": [1, "accessible-announce-changes"],
             "open": [32],
             "show": [64],
             "hide": [64],
+            "focusCloseButton": [64],
             "scrollToTop": [64],
             "addMessage": [64]
         },
@@ -15268,7 +15354,7 @@ class DuetNav {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '67b6010525da471d8f1d39cdd64cf6a9cbdecba5' }, hAsync("div", { key: '7f7d7cb7e76887002c1bd4116e14780261458c07', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: '2667b3a0e765609fcd3b77d621dbc59a335dfe32' }), hAsync("slot", { key: '7fc113b96d80e1677ca7661b7504e41638686690', name: "mobile" }), hAsync("slot", { key: 'b6c714e94df2ffe4c94b1c9e56f512b71d3bcde6', name: "desktop" }))));
+        return (hAsync(Host, { key: 'fff23e9c9f994ed80cebebdf7bb16d05a0b13281' }, hAsync("div", { key: 'bf9f4a0d164a27073a8f3be2fc14e7f14f39e479', class: { container: true, sticky: this.sticky } }, hAsync("slot", { key: '4fa7cc506db4c4b6fa9ff5219ba7b7e56107a8da' }), hAsync("slot", { key: 'e9e8c0e724f76feb3aa320207f5a3ef7a7ab5ac9', name: "mobile" }), hAsync("slot", { key: '49e37c33533e3ba9c733660c0420d85a3a63e80f', name: "desktop" }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetNavCss; }
@@ -15355,11 +15441,11 @@ class DuetNotification {
         this.linkElement.focus(options);
     }
     render() {
-        return (hAsync("div", { key: 'ad950e443ce4d6f4584dc9721d571a80fe8436b2', role: "listitem", class: {
+        return (hAsync("div", { key: '16098cf5ca86dd0bd72d9429d1e78557246f850b', role: "listitem", class: {
                 "duet-notification": true,
                 "duet-notification-highlight": this.highlight,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("a", { key: '95bebd9b5dab41ca48f1cd17dacdd314e2e7b310', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, hAsync("div", { key: '959973ede9244668649f97b4b196c9d49ce3013d', class: "duet-notification-container" }, hAsync("div", { key: '1fec3042cfba91fb3331b2ba854c2d96078ec452', class: "duet-notification-badge-container" }, this.highlight && (hAsync("div", { key: '44c93136aaefeb3d9e1247c9fb390097346b89e4', class: "duet-notification-badge" }, hAsync("duet-visually-hidden", { key: 'dc0f50e9d0dd7d1d8894d834fc8b43d911a5fcaa' }, this.accessibleLabelUnread, ":")))), hAsync("div", { key: 'a41b7b634dafc5ac0c9b518caedbef53a508f6ae', class: "duet-notification-content" }, hAsync("slot", { key: 'cb2850efc2259436c894c2317342212f4a49ef4b' })), hAsync("div", { key: 'd970b769771b3196e29882ba2d8e8587bdad68f7', class: "duet-notification-date" }, this.date)))));
+            } }, hAsync("a", { key: '440018559e85d3ae11cde70edbaa3848cb453995', ref: element => (this.linkElement = element), href: this.url, target: this.external ? "_blank" : "_self" }, hAsync("div", { key: '6b14d618dda184d06f059b1a3acf99e38e5c17f3', class: "duet-notification-container" }, hAsync("div", { key: 'f65f90dc005eb72c52335cc5c8ca39bffdd88c8a', class: "duet-notification-badge-container" }, this.highlight && (hAsync("div", { key: '7e64283158dd4015c8f676f6ee03efe2cefae043', class: "duet-notification-badge" }, hAsync("duet-visually-hidden", { key: 'c306ae4dc490d35c8aff9259ba3fdf182a5f7e00' }, this.accessibleLabelUnread, ":")))), hAsync("div", { key: '444db9cd85d2dab3181834ba371e1d01f2e6b596', class: "duet-notification-content" }, hAsync("slot", { key: 'efebf98a71ddb109a1bf26729ca0365a624e9f18' })), hAsync("div", { key: 'e9dd7f7817e9e5fd06f38c33225d0821db760cd4', class: "duet-notification-date" }, this.date)))));
     }
     get element() { return getElement(this); }
     static get style() { return duetNotificationCss; }
@@ -15677,7 +15763,8 @@ class DuetNumberInput {
             sv: "{current} euro valt",
         };
         /**
-         * Format of message used to announce current amount when switching between amounts.
+         * Format of message used to announce current amount when switching between amounts. Note that the default has "euros"
+         * so if you use another unit is is essential you set this attribute to reflect that unit.
          * The string {current} is replaced with the current amount.
          * @default {fi: "{current} euroa valittuna", en: "{current} euros selected", sv: "{current} valda euro"}
          */
@@ -15895,7 +15982,7 @@ class DuetNumberInput {
             // Set the localized prop value.
             this.value = this.localizeValue(value);
             // Finally also set the visible input value and unit.
-            this.duetInputElement.value = `${this.value} ${this.unit}`;
+            this.duetInputElement.value = `${this.value}${this.getUnitString()}`;
         };
         this.add = (ev) => {
             // If this was called via a html button, prevent the default functionality
@@ -15992,6 +16079,10 @@ class DuetNumberInput {
             this.emitNull(ev);
         }
     }
+    // prefix existing unit with white space or return empty string if no unit
+    getUnitString() {
+        return this.unit ? ` ${this.unit}` : "";
+    }
     formatAnnouncement() {
         const current = !!this.value ? SafeParseFloat(this.value, this.locale) : null;
         if (current == null) {
@@ -16005,13 +16096,13 @@ class DuetNumberInput {
      */
     render() {
         const identifier = this.identifier || this.inputId;
-        const maxlength = `${this.localizeValue(this.max)} ${this.unit}`.length;
+        const maxlength = `${this.localizeValue(this.max)}${this.getUnitString()}`.length;
         const cleanedValue = !!this.value ? SafeParseFloat(this.value, this.locale) : null;
-        return (hAsync(Host, { key: '49a555df21c951b795e625c4799ecb5419fc474e', class: {
+        return (hAsync(Host, { key: 'ff7a3b099b6146f8db869268ecc2609fefa88ca6', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-expand": this.expand,
                 "duet-m-0": this.margin === "none",
-            } }, hAsync("div", { key: '95905465685b005ca2589d1934c237473fac78a7', class: "duet-number-container" }, hAsync("duet-input", { key: '6bac3f4ba516dd43f2681d21fcd530d35c772cb5', ref: input => (this.duetInputElement = input), onDuetChange: event => this.handleChange(event), onDuetFocus: this.handleFocus, onDuetBlur: event => this.handleBlur(event), onKeyDown: event => this.handleKeyDown(event), label: this.label, value: this.value ? `${this.value} ${this.unit}` : "", error: this.error, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": cleanedValue != null ? cleanedValue : "", maxlength: maxlength, name: this.name, component: "number", required: this.required, disabled: this.disabled, role: this.role, labelHidden: this.labelHidden, tooltip: this.tooltip, identifier: identifier, theme: this.theme, margin: "none", expand: true, numericKeyboard: true, autoComplete: "off", type: "text", accessibleActiveDescendant: this.accessibleActiveDescendant, accessibleLabelledBy: this.accessibleLabelledBy, accessibleDescription: this.accessibleDescription, accessibleDetails: this.accessibleDetails, accessibleControls: this.accessibleControls, accessibleOwns: this.accessibleOwns, accessibleDescribedBy: this.accessibleDescribedBy }, hAsync("slot", { key: '52a0896ccb3fd7c716625da4c8de5f2f09622a1c', name: "tooltip" }), hAsync("div", { key: 'af1c978396037b1e1e5d8d0d0e8c25904d519098', class: { "duet-number-buttons": true, "duet-no-label": this.labelHidden } }, hAsync("button", { key: 'b0bc1e76994b2c22b70a259962adac524b1ca5eb', disabled: this.disabled, "aria-disabled": cleanedValue == null || cleanedValue === this.min ? "true" : "false", class: "duet-number-button duet-number-button-subtract", onClick: this.subtract, type: "button" }, hAsync("duet-visually-hidden", { key: 'c6c374074fe1e74907374d89cba0679bf9f5189d' }, this.accessibleSubtract, " ", this.step), hAsync("duet-icon", { key: '135624fed93bbe112fecdd3b46d95aaf5f416b64', icon: subtractIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })), hAsync("button", { key: 'c65086cc05992d5120765da78e2eac86183e5630', disabled: this.disabled, "aria-disabled": cleanedValue === this.max ? "true" : "false", class: "duet-number-button duet-number-button-add", onClick: this.add, type: "button" }, hAsync("duet-visually-hidden", { key: '7f025ffd2816298087614a7d449739631d0ff9c6' }, this.accessibleAdd, " ", this.step), hAsync("duet-icon", { key: 'f232ce3d5c1ad08b350d02b5c65bd21ec7dcf9c5', icon: addIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })))), this.accessibleLiveEnabled && (hAsync("duet-visually-hidden", { key: '03a758593f10d9c55307c3622b8a68b14c720f97', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement())))));
+            } }, hAsync("div", { key: '04d204f9d0dc1bf334606a101b0b4b5e165d36a3', class: "duet-number-container" }, hAsync("duet-input", { key: '464c323e615b8978944cdeec09e0e1a1503391a0', ref: input => (this.duetInputElement = input), onDuetChange: event => this.handleChange(event), onDuetFocus: this.handleFocus, onDuetBlur: event => this.handleBlur(event), onKeyDown: event => this.handleKeyDown(event), label: this.label, value: this.value ? `${this.value}${this.getUnitString()}` : "", error: this.error, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": cleanedValue != null ? cleanedValue : "", maxlength: maxlength, name: this.name, component: "number", required: this.required, disabled: this.disabled, role: this.role, labelHidden: this.labelHidden, tooltip: this.tooltip, identifier: identifier, theme: this.theme, margin: "none", expand: true, numericKeyboard: true, autoComplete: "off", type: "text", accessibleActiveDescendant: this.accessibleActiveDescendant, accessibleLabelledBy: this.accessibleLabelledBy, accessibleDescription: this.accessibleDescription, accessibleDetails: this.accessibleDetails, accessibleControls: this.accessibleControls, accessibleOwns: this.accessibleOwns, accessibleDescribedBy: this.accessibleDescribedBy }, hAsync("slot", { key: '876fa9e487574bd143648c8649105ac9f5972829', name: "tooltip" }), hAsync("div", { key: '60053c4b4c4602d494693804539eff2149fe2a64', class: { "duet-number-buttons": true, "duet-no-label": this.labelHidden } }, hAsync("button", { key: '083dc0860543ddc7e2532620e345ad9d8d163d13', disabled: this.disabled, "aria-disabled": cleanedValue == null || cleanedValue === this.min ? "true" : "false", class: "duet-number-button duet-number-button-subtract", onClick: this.subtract, type: "button" }, hAsync("duet-visually-hidden", { key: '5323ecaf1f86fa97f9267b70bc048dadcca7d34f' }, this.accessibleSubtract, " ", this.step), hAsync("duet-icon", { key: 'd6ab1819fe4c96d6e379570c5a5c4eb41a1a775f', icon: subtractIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })), hAsync("button", { key: '82b9a72bfeba3653c85f853c2e9d295d146b2152', disabled: this.disabled, "aria-disabled": cleanedValue === this.max ? "true" : "false", class: "duet-number-button duet-number-button-add", onClick: this.add, type: "button" }, hAsync("duet-visually-hidden", { key: '697550e4c1f874401d2e17f60c6c4f324fc97bd8' }, this.accessibleAdd, " ", this.step), hAsync("duet-icon", { key: '7947d70d3a48a3ea7e36a46aa79c6abc82d52565', icon: addIcon.svg, size: "small", margin: "none", color: this.theme === "turva" ? "secondary-turva" : "secondary" })))), this.accessibleLiveEnabled && (hAsync("duet-visually-hidden", { key: '0759711664742966c214cb765c179706affc7b2f', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement())))));
     }
     get element() { return getElement(this); }
     static get style() { return duetNumberInputCss; }
@@ -16201,12 +16292,12 @@ class DuetPageHeading {
      */
     render() {
         const layout = this.layout === "narrow" ? "narrow" : this.layout === "fluid" ? "fluid" : "auto";
-        return (hAsync("div", { key: '628273f674969acc5d8a49ea87897fe30a0aa73b', class: {
+        return (hAsync("div", { key: '7580ec6ad47222aa71f87e9b030152fcbc230a6c', class: {
                 "duet-page-heading": true,
                 "duet-theme-turva": this.theme === "turva",
                 "has-icon": !!this.icon,
                 [layout]: true,
-            } }, hAsync("div", { key: 'e92f86a1b315431caa574ff42342c9ebfe944802', class: "background" }, this.theme === "turva" && hAsync("div", { key: '6c2b46cc3961a2c01cf55dd4ee998930e0203138', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: '223d19ded0f680af3a98cc57886344e15ad3e89e', class: "brand-shape" }), this.theme !== "turva" && hAsync("div", { key: '8879e5620c44051f5d913b72228142151aaed976', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: '41eb8c4b1b270b3ec17dd00c9b3ae88305287c8c', class: "brand-shaped-icon" }, hAsync("duet-icon", { key: '00fb325f70fb2730c261ad492e2990d481ac0cc9', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: '23af280baecc0cb0b71382269236fd32d362356c', class: "heading" }, hAsync("slot", { key: '29a66ba008d7e796ba317c115a12756bc0b00f94', name: "heading" }), this.progressCurrentStep && this.progressTotalSteps && (hAsync("div", { key: '6161bb90ecf741d67298184ed058f6857a26726c' }, hAsync("duet-spacer", { key: 'b3bb416d59727ab64ff4b2cd601c1846ad7a64da', size: "large" }), hAsync("div", { key: 'c771ce9dc543006f93a072f2062fbb580064764d', role: "presentation" }, this.progressIndicator()))))));
+            } }, hAsync("div", { key: '41d70adffe75142d1bb229064c284c6b6ce447e7', class: "background" }, this.theme === "turva" && hAsync("div", { key: '44a17513b00dfec52ee689008fec882a083d467f', class: "background-mask" }), this.theme !== "turva" && hAsync("div", { key: 'd9d50fca7431f9d49058030b51b5548e4db8af04', class: "brand-shape" }), this.theme !== "turva" && hAsync("div", { key: '1b93a6948bf23c1bc9bc7dafa64b6df7eea10a91', class: "brand-shape second-shape" }), this.icon && (hAsync("div", { key: '4007f3e9d29cbfd246dc8ae43074ef7ea53fd694', class: "brand-shaped-icon" }, hAsync("duet-icon", { key: 'efe66977b0559e745a17e6da691f8390af017c56', background: "none", name: this.icon, margin: "none", size: "auto", responsive: false })))), hAsync("div", { key: '50070a51cbd61ddcd380063f9635cfb9edbb8b24', class: "heading" }, hAsync("slot", { key: '1ae7e6e3261bb8dd1104bc47b1b87142a5f1cfdd', name: "heading" }), this.progressCurrentStep && this.progressTotalSteps && (hAsync("div", { key: '01bf2c3472defbd1a7fe6c0af2b9cb4cc99185db' }, hAsync("duet-spacer", { key: '723e327a2c3913b0e130d4326a163e326e57eaf4', size: "large" }), hAsync("div", { key: '0bb28f56e6b92b7990467fcca1a16a0893380ce1', role: "presentation" }, this.progressIndicator()))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetPageHeadingCss; }
@@ -16680,6 +16771,67 @@ class DuetPagination {
     }; }
 }
+const duetPanelCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:100%;margin:8px 0 20px 0}@media (min-width: 36em){:host{margin:12px 0 28px 0}}:host .duet-m-0{margin:0 !important}.duet-panel{font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(8, 42, 77);background-color:rgb(255, 255, 255);border:0 solid rgb(212, 223, 229);border-radius:16px}.duet-panel.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);border-color:rgb(222, 224, 228)}.duet-panel.padding-small{padding:16px;border-radius:12px}@media (min-width: 36em){.duet-panel.padding-small{padding:20px}}.duet-panel.padding-medium{padding:20px}@media (min-width: 36em){.duet-panel.padding-medium{padding:28px}}.duet-panel.padding-large{padding:28px}@media (min-width: 36em){.duet-panel.padding-large{padding:36px}}.duet-panel.border{border-width:1px}.duet-panel.secondary{background-color:rgb(245, 248, 250)}.duet-panel.secondary.duet-theme-turva{background-color:rgb(245, 247, 250)}.duet-panel.accent{background-color:rgb(240, 247, 250);border-color:rgb(198, 225, 238)}.duet-panel.accent.duet-theme-turva{background-color:rgb(245, 247, 250);border-color:rgb(199, 202, 207)}.duet-panel.accent.secondary{background-color:rgb(217, 236, 245)}.duet-panel.accent.secondary.duet-theme-turva{background-color:rgb(222, 224, 228)}:host(.duet-theme-turva2) .duet-panel.duet-theme-turva{color:#172a3b;border-color:#d4dde2}:host(.duet-theme-turva2) .duet-panel.duet-theme-turva.secondary{background-color:#f5f6f7}:host(.duet-theme-turva2) .duet-panel.duet-theme-turva.accent{background-color:#fdf7f2;border-color:#f1cab2}:host(.duet-theme-turva2) .duet-panel.duet-theme-turva.accent.secondary{background-color:#fbe1d1}";
+class DuetPanel {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * Theme of the panel.
+         */
+        this.theme = "";
+        /**
+         * Controls the padding of the component. Padding is automatically responsive.
+         */
+        this.padding = "medium";
+        /**
+         * The color variation of the panel. Combination of palette ("default", "accent") and palette variation ("primary",
+         * "secondary"). You can ommit "default" and "primary" - they are the defaults.
+         */
+        this.variation = "";
+        /**
+         * Controls the margin of the component.
+         */
+        this.margin = "auto";
+    }
+    /**
+     * Component lifecycle events.
+     */
+    componentWillLoad() {
+        inheritGlobalTheme(this);
+    }
+    render() {
+        return (hAsync(Host, { key: 'ce2c9ad02ea4b482491120c4564322a7ab1b97c8' }, hAsync("section", { key: '058ae2c34b915888645f0a0fbce8c905f9a99330', "aria-label": this.accessibleLabel, "aria-labelledby": this.accessibleLabelledBy, "aria-describedby": this.accessibleDescribedBy, class: {
+                "duet-panel": true,
+                "duet-theme-turva": this.theme === "turva",
+                [this.variation.split("-")[0]]: true,
+                [this.variation.split("-")[1]]: true,
+                [`padding-${this.padding}`]: true,
+                border: this.border,
+                "duet-m-0": this.margin === "none",
+            } }, hAsync("slot", { key: 'eabfa138724309e78227fb8e48507a2a065c5822' }))));
+    }
+    get element() { return getElement(this); }
+    static get style() { return duetPanelCss; }
+    static get cmpMeta() { return {
+        "$flags$": 265,
+        "$tagName$": "duet-panel",
+        "$members$": {
+            "theme": [1025],
+            "padding": [1],
+            "variation": [1],
+            "margin": [1],
+            "border": [4],
+            "accessibleLabel": [1, "accessible-label"],
+            "accessibleLabelledBy": [1, "accessible-labelled-by"],
+            "accessibleDescribedBy": [1, "accessible-described-by"]
+        },
+        "$listeners$": undefined,
+        "$lazyBundleId$": "-",
+        "$attrsToReflect$": []
+    }; }
+}
 const duetParagraphCss = "*,*::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;display:block;width:100%}.duet-paragraph{margin-bottom:16px !important;display:block;width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-style:normal;font-weight:400;font-variant-numeric:tabular-nums;-webkit-hyphens:auto;hyphens:auto;line-height:1.5;color:rgb(8, 42, 77)}.duet-paragraph.duet-p-0{padding:0 !important}.duet-paragraph.duet-m-0{margin:0 !important}.duet-paragraph.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-paragraph.duet-paragraph-small{font-size:0.875rem}.duet-paragraph.duet-paragraph-semi-bold{font-weight:600}.duet-paragraph.duet-paragraph-bold{font-weight:700}.duet-paragraph.duet-m-0{margin:0 !important}.duet-paragraph.intro{font-size:2.7vw;margin-bottom:28px !important;-webkit-hyphens:inherit;hyphens:inherit}@media (max-width: 37.037037037rem){.duet-paragraph.intro{font-size:1rem}}@media (min-width: 46.2962962963rem){.duet-paragraph.intro{font-size:1.25rem}}.duet-paragraph.intro.duet-m-0{margin:0 !important}::slotted(a){font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-style:normal;font-weight:400;color:rgb(0, 119, 179);text-decoration:underline;transition:300ms ease}::slotted(a).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(198, 12, 48)}::slotted(a):hover{color:rgb(0, 75, 129);text-decoration:none}::slotted(a):hover.duet-theme-turva{color:rgb(126, 2, 35)}::slotted(a):active{opacity:0.75;transition:none}:host(.duet-theme-turva2) .duet-paragraph.duet-theme-turva{color:#172a3b}:host(.duet-theme-turva2) ::slotted(a).duet-theme-turva{color:#e61740}:host(.duet-theme-turva2) ::slotted(a:hover).duet-theme-turva{color:#8c001e}";
 /**
@@ -16729,7 +16881,7 @@ class DuetParagraph {
         const color = getColorByName(this.color);
         // aria-describedby is to fix accessibility issue in Chrome where duet-paragraphs
         // are not announced when placed inside duet-modal
-        return (hAsync(Host, { key: 'c9b003a011aafa9722e534be25dba1ebcae4ee68', "aria-describedby": this.id }, hAsync("p", { key: 'd066baf34e3d60e1e7a83f293ce30f305b460a93', id: this.id, class: {
+        return (hAsync(Host, { key: '844328a8133f4abbbbd2424b38cc14b019fd23d4', "aria-describedby": this.id }, hAsync("p", { key: 'dfd78aa829ee142323997f6bebde60ac47bb98e7', id: this.id, class: {
                 "duet-paragraph": true,
                 "duet-paragraph-small": this.size === "small",
                 "duet-paragraph-semi-bold": this.weight === "semi-bold",
@@ -16737,7 +16889,7 @@ class DuetParagraph {
                 "duet-m-0": this.margin === "none",
                 [this.variation]: true,
                 "duet-theme-turva": this.theme === "turva",
-            }, style: { color }, part: "duet-paragraph" }, hAsync("slot", { key: '540a59c84498378ff0f83bd1bc7fb1ab187e5d5d' }))));
+            }, style: { color }, part: "duet-paragraph" }, hAsync("slot", { key: 'f014b5496f1b791cc2879b09bd12dd85649fb0e3' }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetParagraphCss; }
@@ -20717,11 +20869,11 @@ class DuetPopupMenuItem {
         };
         // Without the role ternary Safari/iPhone wouldn't announce the label for role menuitem.
         // This is a tradeoff and now Safari announces these items as buttons and links with the label.
-        return (hAsync(Host, { key: 'e66206847b5b21c43e70af93e1fc3034d23787e3', role: this.accessibleRole === "menuitem" && this.isSafariBrowser ? null : this.accessibleRole }, hAsync(TagName, { key: '8b56368421c0aad9962c2aa6f097f6aa38759829', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "listitem" ? 0 : -1, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (hAsync("duet-icon", { key: 'be02ad66adf86723fae3a968621989e89fa25e16', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), hAsync("span", { key: 'd7a2749dd04f3acb55d052e2d70df6b988768183', class: "duet-popup-menu-item-label" }, hAsync("slot", { key: '4e8395397defe5adaef38f9c0b415348c95f6425' })), (this.trailingIcon || this.active || (this.url && this.external)) && (hAsync("duet-icon", { key: 'da97a6cf70ab3020b44425846257979492978198', name: this.url && this.external
+        return (hAsync(Host, { key: '8e31b4732e423f363115f217c220217f85a3899a', role: this.accessibleRole === "menuitem" && this.isSafariBrowser ? null : this.accessibleRole }, hAsync(TagName, { key: '4c9a0b3966b5b11b3f8286fdc7bbe83ce93f5df9', ref: element => (this.itemElement = element), tabIndex: this.accessibleRole === "listitem" ? 0 : -1, onFocus: this.onFocus, onBlur: this.onBlur, role: `${TagName === "a" ? "link" : "button"}`, "aria-label": this.accessibleLabel, class: classes, value: this.value, href: this.url, target: this.external ? "_blank" : undefined, rel: this.external ? "noopener" : undefined, lang: TagName === "button" ? undefined : this.targetLanguage, hreflang: TagName === "button" ? undefined : this.targetLanguage }, this.leadingIcon && (hAsync("duet-icon", { key: 'decd1fdc669965de735b9538d8256ea34b7d12b7', name: this.leadingIcon, size: "x-small", color: this.leadingIconColor ? this.leadingIconColor : "currentColor", class: "duet-popup-menu-item-leading", margin: "none" })), hAsync("span", { key: 'bd28f3d116506e2168fc3e5530d086fa0dd0edcd', class: "duet-popup-menu-item-label" }, hAsync("slot", { key: '0aebe6bcf50f8fbbd7d89bbdc0c4f484f67adb6d' })), (this.trailingIcon || this.active || (this.url && this.external)) && (hAsync("duet-icon", { key: '616a80b13b29eb90f003a163bbcded07a551b58c', name: this.url && this.external
                 ? newWindowIcon.title
                 : this.active
                     ? "messaging-checked-small"
-                    : this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && hAsync("span", { key: '92e74664e48deb82e2dae45f62ae89bcff698869', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
+                    : this.trailingIcon, size: (this.url && this.external) || this.active ? "xx-small" : "x-small", color: "currentColor", class: "duet-popup-menu-item-trailing", margin: "none" })), this.trailingText && hAsync("span", { key: '74e587e4cc5c0c431f068bb7974ee8c385cf4259', class: "duet-popup-menu-item-trailing" }, this.trailingText))));
     }
     get element() { return getElement(this); }
     static get style() { return duetPopupMenuItemCss; }
@@ -20913,12 +21065,12 @@ class DuetPromoCard {
             backgroundColor: backgroundColor ? backgroundColor : "none",
         };
         const TagName = this.url ? "a" : "div";
-        return (hAsync(Host, { key: 'af448d11e161105c397211ff014c9383079b42f1', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: '79f3ca4d55f67be99f4f7cd6e0a1ef28d64da3ba', class: {
+        return (hAsync(Host, { key: '427288a23a020a8ba83d29535a990685e56136cd', class: { "duet-m-0": this.margin === "none" } }, hAsync("aside", { key: 'b34e5beb86c428cf1d23c252c9867d8109fa28c9', 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: '6a09c556defa485766025260e084d876fcc072a3', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { key: '9832d77d4f39e634879c2da087a81552a20aaf13', class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { key: 'fe2cec5d0c889557be33ac5d663a2990d56ee57c', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: 'b105405d3236a416549ee74834214461426a5e93', class: "pre-heading" }, hAsync("slot", { key: '50359bf5424f78947cfa9bd1c25f42344822b8f1', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: '8af70521d1e603b5fe0c44029fbfb99a8a8e89c6', class: "heading" }, hAsync("duet-heading", { key: '85e93d6d7b2e7586763646669087933692ebb4d9', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: this.textColor }, hAsync("span", { key: '6c606a3c8cd388df51390dd9221dd70e59705532' }, hAsync("slot", { key: '838966e5712aa10bd977fc15bd1dfe627617b5db', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: '42e9d0d08afea654e4152b83d81096313bb98c55', class: "description" }, hAsync("duet-paragraph", { key: '28008c2195cd3bad659aac6d84b5f10122c74d2d', theme: this.theme, margin: "none", color: this.textColor }, hAsync("span", { key: '52d7a34460dc56568447d7277a53391040a17134' }, hAsync("slot", { key: 'baa534ae9994e67a375871a29474d3aaef8845fc', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: '46096bcff1087436a10c6e604015785d804de8ae', class: "action" }, hAsync("slot", { key: '1202289167a18bac49309d93f03e00737eebf9ff', name: "action" }))))))));
+            }, style: bannerStyles }, hAsync(TagName, { key: '3d17bf1dc1fa3bc580ef7feb08e1d749dafaec34', href: this.url, class: "content-wrapper", ref: element => (this.aOrDivElement = element) }, hAsync("img", { key: 'ba518b8e4449f267ebef440bed06ebb1349d90c5', class: "image", src: this.image, alt: "", role: "presentation" }), hAsync("div", { key: '638d94d31bb60bec7019ed852f70269f73241d7e', class: "content" }, this.hasPreHeadingSlot && (hAsync("div", { key: '08e8bb35ced5d1f6fc9a442c017e96f3294c3341', class: "pre-heading" }, hAsync("slot", { key: '3cc1c6bcaeea2e811bf8984b0574cc7086e997c3', name: "pre-heading" }))), this.hasHeadingSlot && (hAsync("div", { key: 'edfb7d324d0d5f68392b7b4b2386183cad567698', class: "heading" }, hAsync("duet-heading", { key: '57820fcebf0e3c172c232611843679bb47e41e61', theme: this.theme, level: this.headingLevel, "visual-level": "h3", margin: "none", color: postfixTheme(this.textColor, this.theme) }, hAsync("span", { key: 'e2b7014be3e8d44f00a418f76e1f9959a783e9e6' }, hAsync("slot", { key: '094c582e2f0dfc6055563892bfa02dd9d5de4261', name: "heading" }))))), this.hasDescriptionSlot && (hAsync("div", { key: '2af2637554173d2c40ad28bee0e589b6dc92a19c', class: "description" }, hAsync("duet-paragraph", { key: 'f9a47265148a494e1803f5493ab359cfe4abb895', theme: this.theme, margin: "none", color: postfixTheme(this.textColor, this.theme) }, hAsync("span", { key: '42af2e9a0d151bb22d303f453d481bb69891746c' }, hAsync("slot", { key: '3a4173db824f27939a8abc88124a8751d10cbc71', name: "description" }))))), this.hasActionSlot && (hAsync("div", { key: '59a84926d8d346d724980bef00e42a48a44574d1', class: "action" }, hAsync("slot", { key: '52109f0d34365be7e7fe8ec5091ee5ddc5c83bce', name: "action" }))))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetPromoCardCss; }
@@ -21124,16 +21276,16 @@ class DuetRadio {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'adace1958aa84ea8dffa85c53ebed707cd85af71', onClick: this.onClick, class: {
+        return (hAsync(Host, { key: '173f8f9bee06f6f1fce187b223c661a737e724a5', onClick: this.onClick, class: {
                 horizontal: this.groupDirection === "horizontal" && !this.groupResponsive,
                 "horizontal-responsive": this.groupDirection === "horizontal" && this.groupResponsive,
                 "duet-m-0": this.margin === "none",
-            } }, hAsync("div", { key: '7b36666f734105753f05ae5e49e24ad949d47762', class: { "duet-radio-container": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("slot", { key: '1ebfcd6173ef4cd8e9bf552ddaed3ac034aabb3d', name: "input" }), hAsync("label", { key: 'b10d38b18e4897ff7486b9e6f619efb1a1d9dc3e', inert: true, ref: element => (this.labelElement = element), class: {
+            } }, hAsync("div", { key: 'c234b7ed5eb36bcce5c89ebe92b3347245136267', class: { "duet-radio-container": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("slot", { key: '064045eefce1bcd83621abeba85129b345867a9e', name: "input" }), hAsync("label", { key: '28efb57846fef34d8be372c9d9ac351120efa58d', inert: true, ref: element => (this.labelElement = element), class: {
                 "duet-label": true,
                 checked: this.checked,
                 focus: this.focus,
                 disabled: this.disabled || this.groupDisabled,
-            } }, hAsync("div", { key: 'a532c0378340ea61a4992f503458f7a53234b99c', class: "duet-label-content" }, this.hasLabel ? hAsync("slot", { name: "label" }) : this.label)))));
+            } }, hAsync("div", { key: '1f6a2376b2c34c7f5479eac3817b3f3c92b7ca42', class: "duet-label-content" }, this.hasLabel ? hAsync("slot", { name: "label" }) : this.label)))));
     }
     get element() { return getElement(this); }
     static get style() { return duetRadioCss; }
@@ -21328,7 +21480,7 @@ class DuetRadioGroup {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'dabbfa37060cbe66ac24eaf3cbf61a9458568f4f', onDuetChange: this.onSelect, class: { horizontal: this.direction === "horizontal" } }, hAsync("duet-fieldset", { key: 'd3ebc475550eecb8e0efad23bcd44900c319f158', label: this.label, labelHidden: this.labelHidden, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (hAsync("duet-tooltip", { key: 'd3de532b6447a006623932796af8115fea84c78e', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: 'f1f037e60e37c9bc64b2063f09597061c0681ad3', name: "tooltip" }), hAsync("div", { key: 'edca5ba806e3ba78141ac428e6082fc5ee0475cf', class: { "duet-radio-group": true, "duet-no-stacking": !this.responsive } }, hAsync("slot", { key: '683ba284b2dec25ab485fee47db39ecab99c6304' })))));
+        return (hAsync(Host, { key: 'b39897a5768066e81309d63d7f5c75c1c2eecfef', onDuetChange: this.onSelect, class: { horizontal: this.direction === "horizontal" } }, hAsync("duet-fieldset", { key: 'f26a8ac391a951b87e2015bfa3ffcfe63bc3f8c8', label: this.label, labelHidden: this.labelHidden, caption: this.caption, error: this.error, margin: this.margin, theme: this.theme, "accessible-live-error": this.accessibleLiveError }, this.tooltip && (hAsync("duet-tooltip", { key: '2c5bd82fbd17c3c959ee697de49ebc79382b08fd', slot: "tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: 'ac3c4bc22b28dfb4e75d7ee646433f0dc54fd1cf', name: "tooltip" }), hAsync("div", { key: '8eb867559bf7ad38008c675aea68ed32f4b1f78d', class: { "duet-radio-group": true, "duet-no-stacking": !this.responsive } }, hAsync("slot", { key: 'b7c150d9ed7e6643a158032e3d110576358d14e2' })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -21516,13 +21668,13 @@ class DuetRangeSlider {
         const rangeStyles = {
             background: `-webkit-linear-gradient(left,${active} 0%,${active} ${percentage}%,${inactive} ${percentage}%)`,
         };
-        return (hAsync(Host, { key: '635d96d58980051af3fbea46fa89192773c6bf6d', class: { "duet-m-0": this.margin === "none", "duet-expand": this.expand } }, hAsync("div", { key: 'd53d8a40c3e65128e9986a64c7027109063f6b32', class: {
+        return (hAsync(Host, { key: '8ae2f8b801002f2d7f36a1f6f2c5d9de5e52d480', class: { "duet-m-0": this.margin === "none", "duet-expand": this.expand } }, hAsync("div", { key: '3faa6f6b699d012b9d6ff43f0f5255dee1842fe8', class: {
                 "duet-range-container": true,
                 "duet-label-hidden": this.labelHidden,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-ie": isInternetExplorer(),
                 "duet-range-disabled": this.disabled,
-            } }, hAsync(DuetInternalLabel, { key: 'fa54945ba8db3543be607e3999c7f70d3676507d', theme: theme, color: this.labelColor, weight: this.labelWeight, margin: "small", for: identifier }, this.label), hAsync("output", { key: '08989934cd596e774900ae1708c5b787c2822fb2', "aria-hidden": "true", htmlFor: identifier, class: "duet-output" }, this.value.toLocaleString(this.locale), this.unit), hAsync("input", { key: 'aacbb760b5646b721e6ce417d66f9617b41c8d0f', onInput: this.onInput, onChange: this.onChange, ref: input => (this.nativeInput = input), type: "range", min: this.min, max: this.max, step: this.step, value: this.value, style: rangeStyles, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} ${this.unit}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, id: identifier, name: this.name, disabled: this.disabled, required: this.required, class: "duet-range" }))));
+            } }, hAsync(DuetInternalLabel, { key: '330e765a6f42437f0ec80c8fd12f02aa9c8f564d', theme: theme, color: this.labelColor, weight: this.labelWeight, margin: "small", for: identifier }, this.label), hAsync("output", { key: '91a85bd1d5816c694a32882bbe3bce178afe76ba', "aria-hidden": "true", htmlFor: identifier, class: "duet-output" }, this.value.toLocaleString(this.locale), this.unit), hAsync("input", { key: '9ccf4115591954ca7123216d7fda90ca24a3a06d', onInput: this.onInput, onChange: this.onChange, ref: input => (this.nativeInput = input), type: "range", min: this.min, max: this.max, step: this.step, value: this.value, style: rangeStyles, "aria-valuemin": this.min, "aria-valuemax": this.max, "aria-valuenow": this.value, "aria-valuetext": `${this.value} ${this.unit}`, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, id: identifier, name: this.name, disabled: this.disabled, required: this.required, class: "duet-range" }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetRangeSliderCss; }
@@ -21751,10 +21903,10 @@ class DuetRangeStepper {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: '8398641a6b79d5480efcf5fd391ae930c825c085', class: {
+        return (hAsync("div", { key: '1b5b22965b01d2a7ae85b7339ee8645f8349f4b6', class: {
                 "duet-range-stepper": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, hAsync("span", { key: '719ddf8b6ecb2eee73ade2ba046cbba95e8bdb16', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), hAsync("duet-action-button", { key: 'cfad5cb52eb2149e8e2ceff94da6412290d9ec74', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), hAsync("duet-action-button", { key: 'e0d24f7a7e70269f418cf86483aa718a811ed73f', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
+            }, onKeyDown: e => this.onKeyboardDown(e), "aria-controls": this.ariaControls }, hAsync("span", { key: '54b38991bc5f22f1834a911aab5adcb3f5564728', class: "duet-range-step-counter", part: "range-numbers" }, this.generateStepSize()), hAsync("duet-action-button", { key: '1f0e154e3dc32e14ebf7ec696182b11915045b5a', disabled: this.disabled || this.buttonLeftDisabled, class: "duet-range-step-button duet-range-step-minus", onClick: e => this.handleClick(e, -1), id: this.leftBn, "accessible-label": `${this.ariaLabels.previous_increment} ${this.generatePreviousIncrementLabel()}`, ref: el => (this.leftBnRef = el), part: "navigation-arrow", iconName: "action-arrow-left-small", title: "" }), hAsync("duet-action-button", { key: '2531345ee7783cc6b6c2e742abdf6240aea88bb9', disabled: this.disabled || this.buttonRightDisabled, class: "duet-range-step-button duet-range-step-plus", onClick: e => this.handleClick(e, 1), "accessible-label": `${this.ariaLabels.next_increment} ${this.generateNextIncrementLabel()}`, id: this.rightBn, ref: el => (this.rightBnRef = el), part: "navigation-arrow", iconName: "action-arrow-right-small", title: "" })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -22046,18 +22198,18 @@ class DuetScrollable {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '0fb3eb646118def9ab36a337c410f1e7c10567b9', class: {
+        return (hAsync(Host, { key: 'bc8b656d8f78f5f510d489faa85a4d2c4c15b913', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-theme-default": this.theme === "default",
-            } }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: '067b4a9f825795eb05a9dbcf47374f89a9aad811', class: {
+            } }, this.hasCollapseButtonLabelSlot && (hAsync("div", { key: '1964654ce6a29b231c13452ef75a6d7b5448da6e', class: {
                 collapse: true,
                 hide: !this.needsScrolling && !this.collapsed,
-            } }, hAsync("duet-button", { key: '93cce5cf83ec0068723709b27ebec0a3512fcf13', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: 'dfa51544d8e8adab8e671be13e6b04ab74abdd03', name: "collapse-button-label" })))), hAsync("div", { key: '91e4a9fd245f2bb0d1f9dba2d5e0cd2f3f02c6e6', class: {
+            } }, hAsync("duet-button", { key: '338e3a03214db233166699f2ed53f24a401113d8', variation: "plain", margin: "none", "center-text": true, onClick: () => this.collapsedOnClick() }, hAsync("slot", { key: '574284b5aff3e856c4d752e5fea30b66a30b144d', name: "collapse-button-label" })))), hAsync("div", { key: '8c4f8d877a2eb1bea136563524830c43a8a6e4ab', class: {
                 "duet-scrollable-items": true,
                 buttons: this.buttons,
                 center: this.center,
                 "duet-theme-turva": this.theme === "turva",
-            } }, this.buttons && this.renderButton("left"), hAsync("div", { key: 'dd48f5446a1276128998f7399448e8887f715456', class: {
+            } }, this.buttons && this.renderButton("left"), hAsync("div", { key: '8eee588b344791d7e40275b7c5ee8688a55848c7', class: {
                 "duet-scrollable-list": true,
                 [`duet-scrollable-list--${this.buttonPosition}`]: true,
                 [`gap-${this.gap}`]: true,
@@ -22065,7 +22217,7 @@ class DuetScrollable {
                 [`duet-overflow-padding--${this.padding}`]: this.padding !== "none",
                 [`duet-scrollable-list--${this.buttonPosition}`]: this.buttonPosition === "absolute",
                 "duet-scrollable-stretch": this.stretch,
-            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: '4a7c1f7196c3cb9d6e1c63cdc294088dc6f5bd96' })), this.buttons && this.renderButton("right"))));
+            }, onScroll: () => this.updateScrollButtons(), ref: element => (this.scrollPaneElement = element) }, hAsync("slot", { key: '36bce964a756ce2b4ccd6314773baa06227e2530' })), this.buttons && this.renderButton("right"))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -22122,13 +22274,13 @@ class DuetSectionLayout {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '18fd98b7d468b66c761c675cf15b44aed33be6f9', class: {
+        return (hAsync(Host, { key: 'eb1923a8bfba01565e0452347752088c58d9ab08', class: {
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, hAsync("div", { key: 'd3faef8f827ecbf40c397cf4c0f58004eaf25043', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'b0181c49f873c0a0663073ce36c4fb73dce94d01', class: {
+            } }, hAsync("div", { key: '0c04bf013cc9644f09de55e114f3692022374c6f', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'bf2d3164111fad314c90114ce15e2b2488608505', class: {
                 "duet-layout": true,
                 [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, hAsync("section", { key: '1a6ad7a15930a15db6c4fa9ade4f3e050855e9f1', class: "duet-main" }, hAsync("slot", { key: '5937078250ca0abb18d3381278a3fa8da6162780' }))))));
+            } }, hAsync("section", { key: '5c07cbae7cf870868a5c8f897bf6393eb6a7e866', class: "duet-main" }, hAsync("slot", { key: '5dea403267b9102ee9a375aac51c931bd0dde438' }))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetSectionLayoutCss; }
@@ -22344,23 +22496,23 @@ class DuetSelect {
      */
     render() {
         const identifier = this.identifier || this.selectId;
-        return (hAsync(Host, { key: '9d54c9dfad694be3d7e6399d5afc1b1432c1f5dc', onClick: this.onClick, class: {
+        return (hAsync(Host, { key: '3d3bc7d84000806ae8fab973ba04c08a25dc0c2f', onClick: this.onClick, class: {
                 "duet-m-0": this.margin === "none",
                 "duet-expand": this.expand,
                 [`duet-select-variation-${this.variation}`]: true,
-            } }, hAsync("div", { key: 'cacd80da0eaeaef2fd6f0e08caec3a39cd273294', class: {
+            } }, hAsync("div", { key: 'fe0f4b2d68a812713191449693d63fa56513164e', class: {
                 "duet-select-container": true,
                 "duet-label-hidden": this.labelHidden,
                 "duet-theme-turva": this.theme === "turva",
                 [`duet-select-variation-${this.variation}`]: true,
                 "duet-input-top-caption-shown": this.isCaptionVisible,
                 "has-error": !!this.error,
-            } }, hAsync(DuetInternalLabel, { key: 'be880bfbaabc9d88b6b31b921af37f6706f32cd8', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { key: '3100b161cfd533403f8a67c305a03e2dc8ea00c5', direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: '52ab80f0f605fa9711d84f0f26d4325dad7c64cf', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: '4931ec0414f6cd9716904f1c00d00b02d1550813', id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { key: 'fb713046983da9a542a6aa1c3ad6080c3522a820', class: "duet-select-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { key: 'a2b3614b6e03359cecd0167f980c5b48de7cc7b0', id: this.topCaptionPlaceholderId, class: "duet-select-placeholder", size: "small" }, this.placeholder)), hAsync("slot", { key: '50070cedd7b6049e93093cca483a47183c77bae5' }), hAsync("select", { key: '4f53bcd8e5f889ddac92f9815364e1b25521da46', ref: select => (this.nativeSelect = select), disabled: this.disabled, name: this.name, id: identifier, role: this.role, "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, required: this.required }, this.placeholder && (hAsync("option", { key: '999f6c43aec61a8c2df743c70444555ae2304e2d', disabled: true, selected: true, value: "" }, this.placeholder)), !this.processedItems ? (hAsync("option", null, "Virhe valintoja ladattaessa. P\u00E4ivit\u00E4 sivu ja kokeile uusiksi.")) : (this.processedItems.map(item => {
+            } }, hAsync(DuetInternalLabel, { key: 'a44feea69dd179e6c27685de9074cf3fa966b571', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (hAsync("duet-tooltip", { key: '7a3d46b3f60d283ecfa474b05a918fa8c505d1aa', direction: this.tooltipDirection, accessibleInputLabel: this.label }, this.tooltip)), hAsync("slot", { key: '3566d83ece8668e83b0ccde241ed49418ed941e4', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: '709ed39dea050b314217f5de4190535166a82f3c', id: this.topCaptionId, size: "medium" }, this.caption)), hAsync("div", { key: 'cf8a14439328e37ccc1d41c38190c18414b894ea', class: "duet-select-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { key: '1b439a475ac5a6220bbab2d93f827c089a7a5c7b', id: this.topCaptionPlaceholderId, class: "duet-select-placeholder", size: "small" }, this.placeholder)), hAsync("slot", { key: '15182f28fa38955377dc822ab7d8ff61238cb4d8' }), hAsync("select", { key: '99ca572fb0b31f28659712b18accef2b30225d4a', ref: select => (this.nativeSelect = select), disabled: this.disabled, name: this.name, id: identifier, role: this.role, "aria-labelledby": this.labelId, "aria-describedby": this.getDescribedBy(), "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.onChange, required: this.required }, this.placeholder && (hAsync("option", { key: '8e7c047411a37cd3a8a82415566d6f73e71a5533', disabled: true, selected: true, value: "" }, this.placeholder)), !this.processedItems ? (hAsync("option", null, "Virhe valintoja ladattaessa. P\u00E4ivit\u00E4 sivu ja kokeile uusiksi.")) : (this.processedItems.map(item => {
             return isOptionGroup(item) ? this.renderOptionGroup(item) : this.renderOption(item);
-        }))), hAsync("div", { key: '78450970b7a3b2f57640bd8b7eec994076ca1a4c', class: {
+        }))), hAsync("div", { key: '05ac432d89ce773e077f01f7b272484f110f10db', class: {
                 "duet-select": true,
                 [`duet-select-variation-${this.variation}`]: true,
-            }, "aria-hidden": "true" }, hAsync("span", { key: this.value, class: "duet-select-selected-value" }, this.getSelectedItemLabel()), (this.variation === "default" && (hAsync("svg", { key: '8e2392a51be92391a7dd207ebe0ec2325a8cb194', role: "img", class: "duet-select-icon", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '43c899cb0891bf42e3ebb7cebbb6000690d0d93e', d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" })))) || (hAsync("duet-icon", { key: 'da2b9d8166a8b626b546ee41ac6e10e1473c75b5', theme: this.theme, name: "action-arrow-down-small", color: "currentColor", margin: "none", size: this.variation === "compact" ? "xxx-small" : "xx-small" }))), hAsync("span", { key: '01000fd324d80c490a48f74c1ff2abf87db9f179', class: "duet-keep-container-height", role: "presention", "aria-hidden": "true" }, "_")), hAsync("span", { key: '199a372ef44043d9d44121109013dca701942bdd', class: "duet-select-help", id: this.errorId, "aria-live": this.accessibleLiveError, "aria-atomic": "true", "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '2d14eea7bc7db58eacc761e52eb098d52f8cfdef' }, this.error)))));
+            }, "aria-hidden": "true" }, hAsync("span", { key: this.value, class: "duet-select-selected-value" }, this.getSelectedItemLabel()), (this.variation === "default" && (hAsync("svg", { key: '3c6969c19468b5a26e8cc95ec2947442dcebc42a', role: "img", class: "duet-select-icon", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '36c334a0f8ce00a2b0099d3941570f8526d15dbb', d: "m12 18.999c-.4 0-.776-.156-1.059-.438l-10.721-10.72c-.142-.142-.22-.33-.22-.531 0-.2.078-.389.22-.53.142-.142.33-.22.53-.22s.389.078.53.22l10.72 10.719 10.72-10.719c.142-.142.33-.22.53-.22s.389.078.53.22c.142.142.22.33.22.53s-.078.389-.22.53l-10.72 10.72c-.282.283-.659.439-1.06.439z" })))) || (hAsync("duet-icon", { key: 'f0698dcc03bf523766986c548fa5cad2a6b1875c', theme: this.theme, name: "action-arrow-down-small", color: "currentColor", margin: "none", size: this.variation === "compact" ? "xxx-small" : "xx-small" }))), hAsync("span", { key: 'ae2878e5f962708b0a8cdcf15e22c79e9b26f9d5', class: "duet-keep-container-height", role: "presention", "aria-hidden": "true" }, "_")), hAsync("span", { key: '9f818a79660ccb1e79c0b5160541da183d5b371e', class: "duet-select-help duet-select-error", id: this.errorId, "aria-live": this.accessibleLiveError, "aria-atomic": "true", "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '38b9169e9a7418f193b97512f6303a8e90215e06' }, this.error)))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -22440,9 +22592,9 @@ class DuetShapedImage {
         const style = {
             "--rotation": `${this.rotation}deg`,
         };
-        return (hAsync(Host, { key: 'c2cefe890056d433f9b070eaeecb6b327954eae2', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '8f1dffa682bdba8264cc741e3b2b820b6d2a7b83', class: {
+        return (hAsync(Host, { key: 'f1e1775c6baa92468f792435cbd7bf6b9b1bc04b', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, hAsync("span", { key: '9a55361487de0adea55f23a48613607bb366d712', class: {
                 "shaped-image": true,
-            }, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: '3d05a88766196505ee9c66110e24a6cdd2e35806', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: '3cf3510ca5a5dd7eb16d9c531732ebef9e77696b', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
+            }, role: "img", "aria-label": this.accessibleLabel, style: style }, hAsync("span", { key: 'cab98476c89fa5d135797f18601d1cd7f86be610', class: "shaped-image-mask", role: "presentation" }, hAsync("span", { key: '03e422ae06acfbb4e5889d2f48e4eee064426877', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
     }
     static get style() { return duetShapedImageCss; }
     static get cmpMeta() { return {
@@ -22512,10 +22664,10 @@ class DuetShareChart {
         this.itemsTotalValue = this.items.reduce((total, { value }) => total + value, 0);
     }
     render() {
-        return (hAsync(Host, { key: '8ea38d9a00e0a4d24057fd9c0cfbd0d96d24acb7' }, hAsync("div", { key: '9d9d866c172eb265ffe03e63553ba8b8faf6184c', class: "duet-share-chart-horizontal-bar", role: "presentation" }, this.items.map(item => (hAsync("span", { class: "duet-share-chart-share", style: {
+        return (hAsync(Host, { key: 'ecdd674f7aafaac0d6ce2b92ffee521d33f04f54' }, hAsync("div", { key: '162f5b9eab9a30df3861a97264691d3796500286', class: "duet-share-chart-horizontal-bar", role: "presentation" }, this.items.map(item => (hAsync("span", { class: "duet-share-chart-share", style: {
                 width: `${(item.value / this.itemsTotalValue) * 100}%`,
                 backgroundColor: getColorByName(item.color, this.theme),
-            } })))), hAsync("ul", { key: '04fa8bca459b6b359a67dfab612d997e71e8c647', class: "duet-share-chart-item-list" }, this.items.map(item => (hAsync("li", { class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("span", { class: "duet-share-chart-item-color", style: { background: getColorByName(item.color, this.theme) } }), hAsync("span", { class: "duet-share-chart-item-text" }, item.text, ":"), hAsync("span", { class: "duet-share-chart-item-value" }, "\u00A0", formatNumber(item.value), "\u00A0", this.unit), this.unit !== "%" && (hAsync("duet-visually-hidden", null, `${formatNumber((item.value / this.itemsTotalValue) * 100, 0)} %`)))))), hAsync("slot", { key: '50552ff7dd046b39c40e11a7d3cd60b6b28e3e1b' })));
+            } })))), hAsync("ul", { key: 'fbfb17146f550b7812355d34f4a0c44b667f1a58', class: "duet-share-chart-item-list" }, this.items.map(item => (hAsync("li", { class: { "duet-theme-turva": this.theme === "turva" } }, hAsync("span", { class: "duet-share-chart-item-color", style: { background: getColorByName(item.color, this.theme) } }), hAsync("span", { class: "duet-share-chart-item-text" }, item.text, ":"), hAsync("span", { class: "duet-share-chart-item-value" }, "\u00A0", formatNumber(item.value), "\u00A0", this.unit), this.unit !== "%" && (hAsync("duet-visually-hidden", null, `${formatNumber((item.value / this.itemsTotalValue) * 100, 0)} %`)))))), hAsync("slot", { key: '79fc779211d3b265620226647dcbd3508ad3c86c' })));
     }
     get element() { return getElement(this); }
     static get style() { return duetShareChartCss; }
@@ -22542,7 +22694,7 @@ class DuetShareChartItem {
         this.value = 0;
     }
     render() {
-        return (hAsync(Host, { key: '511781694a2e40ce565e0c1769075b8f5d1395e5' }, hAsync("div", { key: '8ea6d35e74f9209ef6a0c12301030c8ca7f1e6a4', hidden: true }, hAsync("slot", { key: '66f07cccba2748aa2c0ee6db3c43d0b6c6a91ed1' }))));
+        return (hAsync(Host, { key: 'd018941bdb98ff2a561661ac4ced29081d0783c5' }, hAsync("div", { key: '3b07a96aa1150f1f51ab3a08344bd656c9d52eef', hidden: true }, hAsync("slot", { key: 'cc7299ead2dbe45e3005a48a8da09bb7eb2fd9e0' }))));
     }
     get element() { return getElement(this); }
     static get cmpMeta() { return {
@@ -22692,12 +22844,12 @@ class DuetShowMore {
      * Always the last one of the class.
      */
     render() {
-        return (hAsync(Host, { key: '42a6b4bfbf4d246e358bc3684a614ecd7f52f1b7' }, hAsync("div", { key: '53daf706313975c82448da4e2cfd7ab8599df822', class: {
+        return (hAsync(Host, { key: 'a43de6a4bae0a8c38852a11a7b384b7f104ec024' }, hAsync("div", { key: '74f8d429039d38ea1151aeab159f34cfed375df6', class: {
                 "duet-show-more": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
                 open: this.open,
-            } }, hAsync("div", { key: '66f968e2eaaabebe12de4e6025113540ecf804c1', ref: ref => (this.contentElement = ref), class: { content: true }, id: this.contentId, tabindex: this.open ? "-1" : "" }, hAsync("div", { key: 'c4edb742ff0d77060b9836cc30f3aed2dccfcc73', class: { "slotted-content": true } }, hAsync("slot", { key: '39a71a36458fcaecb1ac385cd7ca4547a671aaa1' }))), hAsync("duet-button", { key: '0e4a81ed2db4eb7ad0f61fdf9c14f15810ab218f', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.isSafariBrowser ? this.open : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, hAsync("span", { key: '4064b5b817071d4235ab8cfbe696b2839173b758' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
+            } }, hAsync("div", { key: '1e7b359e2ec056100a22d4fcdf12a9afd3432f36', ref: ref => (this.contentElement = ref), class: { content: true }, id: this.contentId, tabindex: this.open ? "-1" : "" }, hAsync("div", { key: 'd56eb046a4f700defffcefd1c279149ab85b68ae', class: { "slotted-content": true } }, hAsync("slot", { key: '4978e6989abb32797fd956d5bb35d1e860b63f71' }))), hAsync("duet-button", { key: 'ba557d00ed023a0b31efcf3480e1b30b326e6799', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.isSafariBrowser ? this.open : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, hAsync("span", { key: '106762507a1b6c28e334d0c383ff481b9a4bf8aa' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
     }
     get element() { return getElement(this); }
     static get style() { return duetShowMoreCss; }
@@ -23224,16 +23376,16 @@ class DuetSlideout {
         };
         const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
         const exitTranslation = getLocaleString(this.exitLangObject);
-        return (hAsync(Host, { key: '609dee4fb7b4cae3f3f0560de3ea6812d1bb092b' }, hAsync("div", { key: 'f061d4c21a65b9225b7723bb2ec1638efaba598b', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && hAsync("duet-overlay", { key: '46fa237ec92876e64c5df2d49a44e3e47d6facdd', visible: this.open, "display-device": "large", zIndex: "600" }), hAsync("div", { key: '603b8b5fadd1bf49307e1108eb0bc4038016043b', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
+        return (hAsync(Host, { key: '80fe71cba1f67117359472cbc3d59ec80910cca2' }, hAsync("div", { key: 'b4611be3d11b74e906804f32fa54f09ef03c9319', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && hAsync("duet-overlay", { key: '72729044a85b3915f914f9b37efc503601681aed', visible: this.open, "display-device": "large", zIndex: "600" }), hAsync("div", { key: 'dd793703df1c6412ba02021f6ee26232180db120', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
                 dialog: true,
                 hidden: !this.open,
                 modal: this.modal,
-            }, style: styles }, hAsync(FocusGuard, { key: 'f94722ac6e55c9317325350d8c37bb521a461c53', moveFocusTo: this.closeButton }), hAsync("div", { key: 'f1f8767bc7c6cf3844b114cd3b908cac380bfcfe', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '40c22f787228d82cf2c0b16b33ed750a37d8d10f', class: "top" }, hAsync("button", { key: 'fdf5bed6a52758d2fc13fbf0a6ecc8cce38eefcb', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
+            }, style: styles }, hAsync(FocusGuard, { key: '7217cb29c43fcab1a4d7a0ab2bc25516d5a3db86', moveFocusTo: this.closeButton }), hAsync("div", { key: 'f660e3d4126342062aeef72abb440bfd8c638b26', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: '05ed9fae1dd41c76c8af9e31ec907cc58f83d3d5', class: "top" }, hAsync("button", { key: '65d0a9c2feb22186f337961c6967021d9dbc97f4', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
                 "slideout-close": true,
                 active: this.open,
-            }, onClick: this.onClick, inert: this.openPanel }, hAsync("duet-icon", { key: '9262c9e66eeaa8e6d0026d4fdca1d1c2a607cc88', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '3aada6f43f49c7474de3a47632088c7f49dfcfe1', class: "sticky-header" }, hAsync("slot", { key: 'd71720ae8c83da6b75930f8bf87fb34c29b7f090', name: "sticky-header" }))), hAsync("div", { key: 'c7296f205661118fc0d8c8b5ede684f42e9f7e82', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
+            }, onClick: this.onClick, inert: this.openPanel }, hAsync("duet-icon", { key: 'db5c0e81b4fdb700e9cd790249abcc7be8ddb93d', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '3056bf2ec202421d6314e9bbec1176990dac8d7d', class: "sticky-header" }, hAsync("slot", { key: 'c9c7e39ec4d453a110ad37ba6e273bcb50cfe8a8', name: "sticky-header" }))), hAsync("div", { key: 'a051d32697cb79fdf3dddcc5c28c5f6e1e11afb3', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
                 items: true,
-            } }, hAsync("slot", { key: '44e81aff2f2a593d8c68075a49779286e3e99ec0' })), hAsync(FocusGuard, { key: 'f9538f7aea09b2e91b4571a94aa6f6847484ecef', moveFocusTo: this.closeButton })))));
+            } }, hAsync("slot", { key: 'b552c7adcb64a48b13ae808a26037b0c6ba34021' })), hAsync(FocusGuard, { key: 'eb6637a6a2c879f6bcab0f798f8f13639d2fdc68', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -23303,7 +23455,7 @@ class DuetSlideoutLang {
      */
     render() {
         const langTranslation = getLocaleString(this.chooseLangObject);
-        return (hAsync(Host, { key: '9ea3449645c4b00c8dff52cb68bfb5976fd065fd' }, hAsync("div", { key: '9170bacd52facb5c29c7498baaf0bbc22a249df3', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: '6d8bda34ee0bca91d53f50e1ad3cb8ed67b41973', name: "navigation-language", margin: "none", color: "secondary" }), hAsync("slot", { key: '6629fa2be22c16d46284cd37dc251d02e64358cf' }))));
+        return (hAsync(Host, { key: '20fb38dbab51fb94d8cb27d0be873d5857809716' }, hAsync("div", { key: 'eac5154fff5df2c8358398a3228909c0cf960b35', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, hAsync("duet-icon", { key: 'c5b9b485d6ab7fcd2172bb951ad88640d1979fee', name: "navigation-language", margin: "none", color: "secondary" }), hAsync("slot", { key: '68cdb507db897fff3e4738ac384fdf504059943e' }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetSlideoutLangCss; }
@@ -23393,12 +23545,12 @@ class DuetSlideoutLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '6c745dee174c1ffc4cf84d17318335a486d10eaa' }, hAsync("a", { key: 'ff3da5f58e47a07fb10218f06afe852093581c03', target: !this.href ? null : this.external ? "_blank" : "_self", class: {
+        return (hAsync(Host, { key: 'b0e234fc3dac2e49ce7e1cb175f1599ab9275530' }, hAsync("a", { key: '3ec02799b58d7b1d44bfc5b0e24bf65720db1c3a', target: !this.href ? null : this.external ? "_blank" : "_self", 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.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (hAsync("duet-icon", { key: '4deca6ab1bd4f8e7522f879e22c697605444f8ef', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), hAsync("div", { key: 'f425ac77231cfbf5bbd039464d358eb7f11b4b62', class: "label" }, hAsync("span", { key: 'fba4ac97eda7bf0e9acd0de41a1025aa931e8de6' }, hAsync("span", { key: '11d0a760f8375869cfc0c95d64a8d455ca68f1a1', class: "label-container" }, hAsync("span", { key: 'e19eebafc42ee0968353876b21eeb54b7161648e', class: "label-content" }, hAsync("slot", { key: '10f8d17611ad9c9edb321afdfa586440dbb53dc5' })), this.external && (hAsync("duet-icon", { key: '2f750a6c9e989428d0fde4aac0a48b211bbe54d7', class: "external-icon", theme: this.theme, name: newWindowIcon.title, margin: "none", size: "auto", color: "currentColor" }))), hAsync("slot", { key: 'f88e82037833cf752296dd8bd9c732746c15e180', name: "description" })), this.caret && (hAsync("duet-icon", { key: '2ac167320adb1702f6e80e71b9926463ebe6ea0c', 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.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (hAsync("duet-icon", { key: 'b9e3b673239c5b9655c01bcec4a2a5abe515bd88', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), hAsync("div", { key: '498acf483827529da2b9f512228ca158edaf8faa', class: "label" }, hAsync("span", { key: 'e6415f10f37d8b957ce06e93b5cbb042634d1672' }, hAsync("span", { key: '53865ac539a3312b509ffb15594e72f9fa4d0f33', class: "label-container" }, hAsync("span", { key: '81cbf04aec6b336558641516b55a554a11751aa7', class: "label-content" }, hAsync("slot", { key: 'f217af73f101e8a8a9ab71f611f759f4c8a8ceef' })), this.external && (hAsync("duet-icon", { key: '0696dda9b2fe219b2a76a0c65855d47cd151bc55', class: "external-icon", theme: this.theme, name: newWindowIcon.title, margin: "none", size: "auto", color: "currentColor" }))), hAsync("slot", { key: '497d712ed9f5155cee76d0c9cca080a89fb26ea2', name: "description" })), this.caret && (hAsync("duet-icon", { key: 'b3057bf91b4062442a5c7823d12c714ca74d86ae', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetSlideoutLinkCss; }
@@ -23580,23 +23732,23 @@ class DuetSlideoutPanel {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (hAsync(Host, { key: '61551430976ed139813afbbc005a9f4003bb0a94' }, hAsync("div", { key: '0d0d89eda55b21e53d5ec9f0cb35a2e1dfb18717', class: {
+        return (hAsync(Host, { key: '942391bf280f263cbbb12ff47d5e19e64677ce59' }, hAsync("div", { key: '5150a8a4f51a6518de50432847b7a4be7f52a8f7', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, hAsync("button", { key: '0e7fe47bd0751b2cb6bd4cda7bff03f4cb991997', 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: '2fa4949a7380687952d41bec65b982162f4b1369', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 link: true,
                 active: this.active,
-            }, onClick: this.onClick, inert: this.open }, this.icon && (hAsync("div", { key: 'cf24b3d307866aff9e4aa27e6cce7b5e073a987b', class: "duet-slideout-icon" }, hAsync("duet-icon", { key: '01b28dff00808c5d5a5aed9ab6c35eabc0ef6d68', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && hAsync("div", { key: '905f8009760a859481c6d33febdd8e74db64df6a', class: "duet-slideout-badge" }))), hAsync("span", { key: 'deda8d3fe7bd882c94a55a6123492e5941d96d75', class: "label" }, hAsync("span", { key: '561077ac5a10187d07a18692df2314eb94ddaac3', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: 'd597b6b5d3952bf03f8242567e50dcd33c289c08', name: "label" })), hAsync("duet-icon", { key: '9e7141fb1fea117840c3e45534cd8a5c43369371', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: 'a2c0486601583c685d0e464db5752823b168e0cb', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && (hAsync("div", { key: '239abf831224e505471d4faa690c4fb9eec39657', class: "duet-slideout-icon" }, hAsync("duet-icon", { key: '91d352ae3154e830d2ea6e07be749a301f959dd7', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && hAsync("div", { key: '048f8d6339aa0fac808cb8539aec7fc39dc69e22', class: "duet-slideout-badge" }))), hAsync("span", { key: '78c8194b03f576175deb05836ee62db4909ff2ae', class: "label" }, hAsync("span", { key: '698881982e56840d20105c0859d433f057d0e8c2', class: { "label-text": true, [this.labelSize]: true } }, hAsync("slot", { key: '52990bf8fd3f928746ee83d5b84570ca6324b2bd', name: "label" })), hAsync("duet-icon", { key: '8b11c870487c41351035fd29a0379ff022f86676', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), hAsync("div", { key: '420fc600c08d2636b7ee91ef2378cd073822ffc7', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, hAsync(FocusGuard, { key: 'd51a504e26a48761aa48bb9f1103fb00cad97341', moveFocusTo: this.closeButton }), hAsync("div", { key: '93ccd2897a884bfecb4d166f7284960fd8fedb8a', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: 'a68809aa80badf43f9cfa1de23460842a4982b66', class: "top" }, hAsync("button", { key: 'ce263a30b67f58480141e401fe20d5bfb4cd2a55', 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: '53c5dd886930895a4b98a215d12c26a1da4e33c0', moveFocusTo: this.closeButton }), hAsync("div", { key: '4be2ad3519e0e43f9bdf7d9db5cfab397f5a2f48', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, hAsync("div", { key: 'e10cd953dccb8a456545bc58e374e53361016759', class: "top" }, hAsync("button", { key: '0fdc986a24b858871aebe4431fc5a02ee73d42bf', 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: 'b972fb4888fef4489d77e46be76b3a1c94881d3b', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: 'd3c663ded8d156b776970cbcb72effc6653eb49d' }, this.label.innerHTML), hAsync("button", { key: '3bbcb1c972af540d27e8280e211597a7117955f3', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: 'c9dffb03a8a312585c44c82d59f99fb7560e91b9', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: '711d24f842b15729187af19d35e1f64d840d08ef', class: "sticky-header" }, hAsync("slot", { key: '0fdd182a420e3fa529fc3f732a5af2a77ee4d5ef', name: "sticky-header" }))), hAsync("div", { key: 'd3fbd36dc5816175032c3ecaf68fb4a55753a65a', tabindex: "-1", role: "menu",
+            }, onClick: this.onClick }, hAsync("duet-icon", { key: '40b07857257d0e150e40cd506c53ee743d1323fa', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), hAsync("span", { key: 'f1c04199ddd3f93c079edea3666879483e003c9e' }, this.label.innerHTML), hAsync("button", { key: 'fe8dafe02a327c652b4815013aeae50ab2ffa40d', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, hAsync("duet-icon", { key: 'aa9cdab26dfe54f286a9586716285b7400d78ea3', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), hAsync("div", { key: 'c046cb5cef75c8932a338db3a4e7056f489c3bd4', class: "sticky-header" }, hAsync("slot", { key: '08fe11beec9d0a01519ca21a00cc11298c17facb', name: "sticky-header" }))), hAsync("div", { key: '34b482569c730fe07ec6b4899f7d8fb0b371190c', tabindex: "-1", role: "menu",
             //TODO: slideout menu fades out, needs to be instant
             id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, hAsync("slot", { key: '1e0a07cabf18cff207520a71272ac1243dbb7bc5' })), hAsync(FocusGuard, { key: '5f38ea7e8026467c1e0a811dea566c7cc094bfad', moveFocusTo: this.closeButton })))));
+            } }, hAsync("slot", { key: '2b87c3b4d7ab96fe8b069d023e7b07f27910cf07' })), hAsync(FocusGuard, { key: '158e38e0df98000f097952a14da74a4195b4515b', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -23677,16 +23829,16 @@ class DuetSlideoutPanelDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'e658b4c8c33e04cd052a13c51653502a7ccc3d3d' }, hAsync("div", { key: 'fc15746899049a9caa6274b59232fb1d9019669f', class: {
+        return (hAsync(Host, { key: 'f96919a68190339dfad3a02b63943bc7c944a1e7' }, hAsync("div", { key: '109f23c80ed885b60278b261eca318bde1ec47eb', class: {
                 "duet-slideout-panel-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, hAsync("button", { key: 'ccbb6057de55f68ccb31f97a80de87c8c4f9d376', 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: 'b40332159750123f2564b18834426c09a7a69bf0', 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: '8b646cec992ae5e5534f7980eca030a398f23281', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: '3c9c765e0d7d568b8a8bdcae22285113b3d42b09', class: "label" }, hAsync("slot", { key: 'b3405c1414d2d03df674b4e76a3afda6c37869a1', name: "label" }), hAsync("duet-icon", { key: 'b83e52c7ba95a808a2de0c6601871f2ce3b94547', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: '82e80bd57086b570e6c5e9a77faac514aad4330d', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, this.icon && hAsync("duet-icon", { key: '885d1ef770aa91efc19169c8084d8fb60f6ae314', name: this.icon, size: "medium", margin: "none", color: "secondary" }), hAsync("span", { key: 'bafa2159d2892a908ed6ce49c13d4d1beaa674c1', class: "label" }, hAsync("slot", { key: '96fa1309813257aeb3acff36894828563331b43d', name: "label" }), hAsync("duet-icon", { key: 'fbad64614399ece9b86750e3851336a523944951', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), hAsync("div", { key: '2869b77624970b590f37909f10ee2a2b9d252a64', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '60d8bc1ae8f3bfb07a7002cd78b21815374c5910' })))));
+            } }, hAsync("slot", { key: 'a76b88dbcbb32ce8c0d96f807da0623a6cb8fc1f' })))));
     }
     get element() { return getElement(this); }
     static get style() { return duetSlideoutPanelDropdownCss; }
@@ -23730,7 +23882,7 @@ class DuetSpacer {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '674e35f9f009457a29e8a3e44d0f5190f5f0367e', class: {
+        return (hAsync(Host, { key: 'f2f4fa377c08b91ba94544d234bc8ab55c8b35b5', class: {
                 "duet-spacer": true,
                 "duet-spacer-xx-small": this.breakpoint === "xx-small",
                 "duet-spacer-x-small": this.breakpoint === "x-small",
@@ -23793,11 +23945,11 @@ class DuetSpinner {
      */
     render() {
         const color = this.color === "currentColor" ? "currentColor" : getColorByName(this.color);
-        return (hAsync(Host, { key: '1e4de3df57809d0616aee4eba0932615753f160a', class: {
+        return (hAsync(Host, { key: '8e4d0ddb4abd8fb9c68b9f3935ca75fb65f63cf3', class: {
                 "duet-custom-color": this.color !== "currentColor" && this.theme !== "turva" && this.theme !== "default",
                 "duet-theme-turva": this.theme === "turva" && this.color !== "currentColor",
                 "duet-theme-default": this.theme === "default" && this.color !== "currentColor",
-            } }, hAsync("div", { key: 'b049994ffa0f8e2ef99f19d5730a9b7c961c7c23', class: {
+            } }, hAsync("div", { key: '4940f908c0ecdb401c361b0ab7dc2720d5c6a1a1', class: {
                 "duet-spinner": true,
                 [this.size]: true,
             }, style: { color }, "aria-label": this.accessibleLabel })));
@@ -23902,10 +24054,10 @@ class DuetStatusIcon {
         }
     }
     render() {
-        return (hAsync(Host, { key: '32909f04556cc08ab2ed508dbdbe7ac377119d5a', class: {
+        return (hAsync(Host, { key: 'd35995f352a518b4933f82071bba491062afa0e6', class: {
                 [`duet-status-icon-${this.getVariation()}`]: true,
                 "duet-strong-bg": this.strong,
-            } }, hAsync("duet-icon", { key: '1a058d91860d5d715a2eec8e69460509309faf37', icon: this.getIcon(), size: this.size, margin: this.margin })));
+            } }, hAsync("duet-icon", { key: '67a2d52e3cc7e6d2685de643130654f8031f643a', icon: this.getIcon(), size: this.size, margin: this.margin })));
     }
     static get cmpMeta() { return {
         "$flags$": 265,
@@ -24026,13 +24178,13 @@ class DuetStep {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: 'aabaaf3753284a1d7523a6fd9d7f067b27dddea6', class: {
+        return (hAsync("div", { key: '3204237f7f65d0f7e40d171da59beae2438d0b73', class: {
                 "duet-step": true,
                 [`is-${this.state}`]: true,
                 "rounded-top": this.roundedTop,
                 "rounded-bottom": this.roundedBottom,
                 "duet-theme-turva": this.theme === "turva",
-            } }, hAsync("div", { key: 'cb59231788afdc7a49bee7049c26bcdb4f1cefdd', class: "duet-step-heading", id: this.buttonId, role: this.state !== "current" ? "button" : "region", "aria-current": this.state === "current" ? "step" : undefined, tabindex: this.state !== "current" ? "0" : undefined, "aria-disabled": this.isClickDisabled().toString(), "aria-expanded": (this.state === "current").toString(), "aria-controls": this.contentId, "aria-selected": (this.state === "current").toString(), onClick: this.handleClick, onKeyDown: this.handleKeyDown, ref: element => (this.buttonElement = element) }, hAsync("div", { key: '3d942cb5fb3493fc0ca7767ab71889b728571bdd', "aria-hidden": "true" }, hAsync("div", { key: '143939ce81911bc480e6edaf7f0203cf8697115c', class: "duet-step-counter" }, this.renderStepCounter())), hAsync("duet-spacer", { key: '3b7f53b8257ce2d0a6a72ddf44f24262be50bb51', direction: "horizontal", size: "large", breakpoint: "small" }), hAsync("duet-spacer", { key: '2da8c1bbcbbc926d81daafc3dd68e1622588c8f2', direction: "horizontal", size: "medium", breakpoint: "x-small" }), hAsync("div", { key: 'fe5986a3319a111b3a990128c8d9aaf39bda546a' }, hAsync("duet-heading", { key: '200d0ae39df8b39fc952f3de234627bf5fb7eb2f', theme: this.theme, level: this.headingLevel, visualLevel: "h4", color: this.headingColor(), margin: "none" }, this.heading)), hAsync("duet-spacer", { key: 'cc775a86bddaf0b0a27b7a6412859733af2c0b3b', direction: "horizontal", size: "large" }), hAsync("div", { key: '6d97eb5590370f1a323f27852a21e815eb17dd1e', class: "duet-step-heading-slot" }, hAsync("slot", { key: '6b19e4da0e1101c54548b72e47df376a2224ac99', name: "heading-content" }))), hAsync("div", { key: '24ab81369e7c138d76d28ca432b45a4d1c61078c', class: "duet-step-content-wrapper" }, hAsync("div", { key: '18cc21aa85dca19bd79f846aeb4636d0d6a4ff97', class: "duet-step-content", role: "region", "aria-labelledby": this.buttonId, id: this.contentId }, hAsync("slot", { key: '9820d59f4feca0e319e4a2947538bf476bd8a35a' })))));
+            } }, hAsync("div", { key: '144dc2c4f67e3ab88437ba11dbe665d8d938e998', class: "duet-step-heading", id: this.buttonId, role: this.state !== "current" ? "button" : "region", "aria-current": this.state === "current" ? "step" : undefined, tabindex: this.state !== "current" ? "0" : undefined, "aria-disabled": this.isClickDisabled().toString(), "aria-expanded": (this.state === "current").toString(), "aria-controls": this.contentId, "aria-selected": (this.state === "current").toString(), onClick: this.handleClick, onKeyDown: this.handleKeyDown, ref: element => (this.buttonElement = element) }, hAsync("div", { key: '3a16cbf1b403adb015eafda7d8768e17eae7fb40', "aria-hidden": "true" }, hAsync("div", { key: '8ee2d9f18fcef2d1cdb2ad43cf8a41c5615b4765', class: "duet-step-counter" }, this.renderStepCounter())), hAsync("duet-spacer", { key: '0dd226292f09ae93ba5ca9bde08511982771fe15', direction: "horizontal", size: "large", breakpoint: "small" }), hAsync("duet-spacer", { key: 'd2fea319dfc6db59b1aaba216a913c3a8e9e81e8', direction: "horizontal", size: "medium", breakpoint: "x-small" }), hAsync("div", { key: '7c3dee5bf9df62db35cbe5896551062c482d8b3e' }, hAsync("duet-heading", { key: '27d4325d36f4f0621af0bf633fe3de821822d4bc', theme: this.theme, level: this.headingLevel, visualLevel: "h4", color: this.headingColor(), margin: "none" }, this.heading)), hAsync("duet-spacer", { key: 'f0e367883df25339d1882ebe17ff56c3555d4cd1', direction: "horizontal", size: "large" }), hAsync("div", { key: 'f4313eed84ca3fe24272ce59a59b711169c4c0a8', class: "duet-step-heading-slot" }, hAsync("slot", { key: 'a06a67c70d672288b7ef3f76149561fe5200ed99', name: "heading-content" }))), hAsync("div", { key: '62b81bf1127a74bd5fb1cec4b0aa1e9c706d2038', class: "duet-step-content-wrapper" }, hAsync("div", { key: 'c46f37355b38f10b1dc182108cae7f444025246d', class: "duet-step-content", role: "region", "aria-labelledby": this.buttonId, id: this.contentId }, hAsync("slot", { key: 'f08a916f605a7227add9fdb0bd4f6ede0719ec02' })))));
     }
     get element() { return getElement(this); }
     static get style() { return duetStepCss; }
@@ -24179,7 +24331,7 @@ class DuetStepper {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'ec5ca5e9408a00384cf24330b299b6cc06bf5ede', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '2d0b2bf059b5adf1b073f17b5d0df0be16689660', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("duet-visually-hidden", { key: 'ef57bc497a409d7e6f6591d987eb8f249c9f2e1f', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), hAsync("slot", { key: '1cfe6851e7b1d2c24e72e7eb21e6838d9cdd13c3' }))));
+        return (hAsync(Host, { key: 'f135a9f1ddcc6eaa86acdcdc9d11def0ec489b81', class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'd68ff41042b6582c21d555e3131054278e9eaf1f', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, hAsync("duet-visually-hidden", { key: '21d8af2f8896f0e5f893f041a2f3010ada1e74c9', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), hAsync("slot", { key: 'efe281a3ddce9364e69c5131e7e59e3a9c2bb9d5' }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -24333,19 +24485,19 @@ class DuetSubmenuBar {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '5c18e6f61099dd56fe8881164f345f4e890c3ba8' }, hAsync("nav", { key: 'c9598dc340f590e7fe74c8bd337a3b4a44181b56', class: {
+        return (hAsync(Host, { key: '3e7b02904bbbba59c39e6ab92da7f5c57725da8b' }, hAsync("nav", { key: '2dc04f3533701d9c21afd7c15756f27ecb58441f', class: {
                 "duet-submenu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 hidden: this.hidden,
-            }, "aria-label": this.accessibleLabel }, this.hasItems && (hAsync("button", { key: '817b519993919dd462e68eeb34118b7c5c2da178', 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: '839b1d9944d8c6c3bfaf329a682d91657066ec2f', 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: '0bebb8664ca385d92be22af8bc2c584296e83c9a', class: "label" }, hAsync("slot", { key: '54e66b0e7e63d0a64b31658ee4dd4f9b3a71893c', name: "label" }), hAsync("duet-icon", { key: '5b41cf474c8290316ab32e949f09f45efba7da20', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: '3f771d607c6addebffb232f2b0c74e7cb352c838', class: {
+            }, onClick: this.onClick }, hAsync("span", { key: '67a6c63dc412388b52a2de220127dea5bef408e9', class: "label" }, hAsync("slot", { key: 'f7c3882a3339a2cfdf581b63d4aee13867b5d67b', name: "label" }), hAsync("duet-icon", { key: 'e0f1cd34ad6ae56df39fcdf39683cb7dfacc6aec', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), hAsync("div", { key: '368b77169fb80a8486623763734cedecb40b33a8', class: {
                 "menu-container": true,
                 hidden: !this.open,
-            }, role: "presentation" }, hAsync("div", { key: 'd96ff9575dceec428343b75334eebd0337eaf398', 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: '25476a3938ac4a4cde6a36aeb5c992e61cd016b3', 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: '7533b1798677bb3cdcd4f2cd61fc8de0ebe2d12e', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: 'fb8a67fe97664fca24c969ba2b059ecd6af0b24a' }), hAsync("div", { key: 'ed3c80f64fe1dcf338f6474b80a33493886da07d', class: "list-padding" }))), hAsync("duet-overlay", { key: '15d20bca846bdd41d391ef2a6ec24641c07987a0', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
+            }, ref: element => (this.itemsContainer = element) }, hAsync("div", { key: '78a0b5dcbad16181839842b362fc2aa4233933e0', class: "list", role: this.mobile ? "presentation" : "list" }, hAsync("slot", { key: '88ed711a6f222bfa266148da84789eaecfa433d4' }), hAsync("div", { key: 'bccca592f7f6986a27e8b90b410f09c28d7d5667', class: "list-padding" }))), hAsync("duet-overlay", { key: '3ba23120b948aeb6f066d21d86b58e3b6fa91669', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -24477,18 +24629,18 @@ class DuetSubmenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '652543259e31b7a19807a8d6810ba6d0f5236986', role: "listitem" }, hAsync("div", { key: '2538c90061f6e18614db48e259a6e824223aac6e', class: {
+        return (hAsync(Host, { key: '0cb9c03f321c7ff444123e06bee1017a69786c76', role: "listitem" }, hAsync("div", { key: '7a69b5c2e3d9f7f6737931fd98d0626ecb23dcb5', class: {
                 "duet-submenu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 open: this.open,
                 active: this.active,
-            } }, hAsync("button", { key: 'e957754f94c7eb471a717c8c1982ab75c9c2a7d0', 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: 'cb47f2b220eccb921a6fb2b6d9372cab734dcf9f', 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: '362425074c3914c6a79b216dc35f598e90fcd263', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: '4188c97491e17f9076d76f83b406b7fe328f6fa8', class: "label" }, hAsync("span", { key: 'fd1f65d1fc3a622683f91272012245743cc6bfc0', class: "label-text" }, hAsync("slot", { key: 'ef9bd1386e925dd1aad55f628ae14d430317f156', name: "label" })), hAsync("duet-icon", { key: 'e26be5b6923b4654e5a1b1dc69790f3afb5f1a77', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: 'e86eac292c5448b613016a10977f6f6499893b03', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '0777f325a3186cfb4a20c0d71fa3bbcc0ee752b5', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'db5cabb7d09304cd2bd9eba231ed5c3d0453131b', class: "label" }, hAsync("span", { key: '33760c3388e525ca78442660bcba3712bb1a0b91', class: "label-text" }, hAsync("slot", { key: '557457c4d150285a804a861755393b2ead85eb29', name: "label" })), hAsync("duet-icon", { key: '0632a6cb7801c25f3ddec7c36744ed1def3d2d42', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '22f16e71f250d490bf1fca22119b5422ea519021', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: 'b6fe3f2206cb9862de55a0c33f346bceeab6ddfe' })))));
+            } }, hAsync("slot", { key: '63e09b29477fe83753399f2934115780169deb5c' })))));
     }
     get element() { return getElement(this); }
     static get style() { return duetSubmenuBarDropdownCss; }
@@ -24557,12 +24709,12 @@ class DuetSubmenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'ef0f1811114384e71db5b17f57822a4b6e3f026e' }, hAsync("a", { key: 'a45f2b4a589fc38a6578cefd26d73c60eb0f47cd', class: {
+        return (hAsync(Host, { key: '634468684f5ca0645aca55e4755a6f778d4aeaf1' }, hAsync("a", { key: 'df84408330d4e171054f96de10b761d9c6435800', 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: '7e2b78b528e601f5761d1a6b815e2453aef67857', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: '0d0963f46c02806088142c383d7a469b8928a560', class: "label-container" }, hAsync("span", { key: '8409d8d5e431cee3220ca54b358fc019a0604d2f', class: "label" }, hAsync("slot", { key: '034a99ca11cbb83e257cca2e0076d1478f591106' })), this.caret && hAsync("duet-icon", { key: '9ac5a6dafdf39b39a88fe3b35b99d8f0eaf43c09', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: '0a7b0addbef96f1309db9077d549b5cd0b3c5d44', 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: '70f8d741e10aaf9e6492e47b3bf2ffe2d488b0dc', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), hAsync("span", { key: '9ec616e8c8b512f0731e90441bf1d20b485f503a', class: "label-container" }, hAsync("span", { key: '41825ec964adb07f1d6262d995de497b5bf597c8', class: "label" }, hAsync("slot", { key: '16e2e05e0662ee3cbb59ee5ceb371b57b2b3ddcd' })), this.caret && hAsync("duet-icon", { key: '97aa221937f2099cd478aad6745d8b1fc93fdb22', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (hAsync("duet-icon", { key: '1b281ba9300b07c9b8e15688b7383e27195b1ce2', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
     static get style() { return duetSubmenuBarDropdownLinkCss; }
@@ -24658,7 +24810,7 @@ class DuetSubmenuBarItem {
     render() {
         const TagName = this.url ? "a" : "button";
         const role = this.url ? "link" : "button";
-        return (hAsync(Host, { key: '9273b9b8d2b00abd034156bf4c70b9945db11c75', role: "listitem" }, hAsync(TagName, { key: '3e1d3f9ae8eafda68f106273f0c5e74842c60ab3', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '48ad0e603669bad5976e46609f729c92034445ab', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'c4aed9f2f36f74a99199a48175323b986a259f1e', class: "label" }, hAsync("span", { key: 'f754166cd285c4a56c59d58c9166c81c70b3066c', class: "label-text" }, hAsync("slot", { key: '3f98eb2611e5c053c87aeb07db7ea9a97779269a' })), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: '7085fcef269d439470eeb19bd724a1acb2b3138e', class: {
+        return (hAsync(Host, { key: 'bc1b76eff2619e0f79a21c0d8bef3efb622a4f75', role: "listitem" }, hAsync(TagName, { key: 'ecb396d50b5964ca911a4bcc01dfbbd2235554f0', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("duet-icon", { key: '64e157f0aad997e6f8f20c8f61be5a9f6cb1ba7d', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), hAsync("div", { key: 'd51db5d687d360dc8d82c704407c35d2b7878193', class: "label" }, hAsync("span", { key: '067121784839bea1c72167d2b8bcb6869620b69a', class: "label-text" }, hAsync("slot", { key: 'd080c716b2c29ad39aa4e377d298d2fc340162b6' })), (this.trailingIcon || this.external) && (hAsync("duet-icon", { key: 'd749eeeb21d1491c418db9469b2b7bde9ddf1014', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!this.external,
@@ -24730,7 +24882,7 @@ class DuetSubmenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: '68474da6c67cb159cac22f5325a46b241fd55b94', role: "listitem" }, hAsync("a", { key: 'a324a7cf0112385dd2ef1c40de4746b8b4d4b926', 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: '14213b6bb176c42ddfc1c24838ab9148b1bf9f67', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: 'a199aa0ad1aab49b4aa8c1568ab7da76169f26e4', class: "label" }, hAsync("slot", { key: 'b509d166b4756b8fdd52aad407d66990976d01cf' })))));
+        return (hAsync(Host, { key: '1690f55f331c933f9fb468a34dacd7ca59b4a6ec', role: "listitem" }, hAsync("a", { key: 'bef17a08ede70f41666795b66295bde08809e350', 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: 'b7cbc5a4b7747f3b151eded40adaa568a58abb56', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), hAsync("span", { key: '7351aeba73af6d8f8606662ee3bc100dc4f8c513', class: "label" }, hAsync("slot", { key: 'c56efc7a7ac3d5afeea81444f1c7ec0db3a6ce68' })))));
     }
     get element() { return getElement(this); }
     static get style() { return duetSubmenuBarLinkCss; }
@@ -24853,7 +25005,7 @@ class DuetTab {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: '31d1c06d4e3c898fe3cde14ceb7f4ea74db20a35', ref: element => {
+        return (hAsync("div", { key: '6903bcdb8e3fa5178b6238ccdcf4f028a85a1cf2', ref: element => {
                 if (!this.contentId) {
                     this.tabpanelElement = element;
                 }
@@ -24862,7 +25014,7 @@ class DuetTab {
                 "duet-tab": true,
                 selected: this.selected,
                 "has-content-id": !!this.contentId,
-            }, "aria-description": this.accessibleDescription, "aria-labelledby": this.accessibleLabelledBy, tabindex: "-1" }, hAsync("slot", { key: 'ae00a38320b796e166452a6e73ada02bb32c3e48' })));
+            }, "aria-description": this.accessibleDescription, "aria-labelledby": this.accessibleLabelledBy, tabindex: "-1" }, hAsync("slot", { key: '6629dc6968129353f9daa96cc26a4c9f23dc384d' })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -25168,13 +25320,13 @@ class DuetTabGroup {
                 [`duet-notification-mark-${element.notificationMark}`]: !!element.notificationMark,
                 [largeBreakpoint]: ["default", "plain", "plain-scrolling"].includes(this.variation) ? true : false,
             }, onClick: () => this.onTabSelect(index), onKeyDown: ev => this.handleKeyDown(ev) }, this.variation === "checked" ? (hAsync("div", { class: { "checked-tab-content": true, "stackable-checked-tab-content": this.tabs.length <= 3 } }, hAsync("div", { class: { "checked-tab-description": true, "stackable-description": this.tabs.length <= 3 } }, hAsync("p", null, element.label), hAsync("p", { class: { "tab-caption": true, selected: element.selected } }, element.caption)), hAsync("div", { class: { "stackable-checkmark": this.tabs.length <= 3 } }, hAsync("duet-checkmark", { theme: this.theme, checked: element.selected, type: "radio", "presentation-only": true, center: true })))) : (element.label))));
-        return (hAsync("div", { key: '09a66d5e7b686bdd15eb41d6eb8bcb7a5497f3da', class: {
+        return (hAsync("div", { key: 'd96e791cdd488611f7d63128408d9347a290728e', class: {
                 "duet-tab-group": true,
                 "duet-theme-turva": this.theme === "turva",
                 [variationClass]: true,
                 "duet-tab-plain-scrolling": this.variation === "plain-scrolling",
                 "duet-tab-group-scrolls": true,
-            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: '2ea69f0925c8df2c6aeff1038a3a47964a4e8493', role: "tablist", class: {
+            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: 'b65cc9f6446fa3d2f6847a2ace6d9abdfd04b337', role: "tablist", class: {
                 "duet-m-0": this.margin === "none" || this.variation === "checked",
                 "duet-tab-group-tabs": true,
                 "duet-tab-group-hidden": this.tabs.length > 3 && !isSwipeScrollable,
@@ -25185,11 +25337,11 @@ class DuetTabGroup {
             } }, this.variation === "checked" ? (buttons) : (hAsync("div", { class: {
                 "duet-tab-group-scrollable-wrapper": true,
                 "duet-tab-group-fill-space-wrapper": this.fillSpace && this.variation === "default",
-            } }, this.fillSpace && !this.stretch && this.variation === "default" && (hAsync("div", { class: "duet-scrollable-stretch-overlay" }, hAsync("div", { class: "background" }), hAsync("div", { class: "border" }))), hAsync("duet-scrollable", { selected: this.selected, identifier: this.identifier, gap: ["default", "plain", "plain-scrolling"].includes(this.variation) ? "none" : "large", buttonPosition: this.variation === "default" ? "absolute" : "relative", center: this.isCentered() ? this.isCentered() : this.element.style.textAlign == "center", theme: this.theme, stretch: this.stretch }, buttons)))), hAsync("div", { key: '2f52fcd531e3672ee0ad508612b0b007ebfd9216', class: {
+            } }, this.fillSpace && !this.stretch && this.variation === "default" && (hAsync("div", { class: "duet-scrollable-stretch-overlay" }, hAsync("div", { class: "background" }), hAsync("div", { class: "border" }))), hAsync("duet-scrollable", { selected: this.selected, identifier: this.identifier, gap: ["default", "plain", "plain-scrolling"].includes(this.variation) ? "none" : "large", buttonPosition: this.variation === "default" ? "absolute" : "relative", center: this.isCentered() ? this.isCentered() : this.element.style.textAlign == "center", theme: this.theme, stretch: this.stretch }, buttons)))), hAsync("div", { key: '91e042386356d5c7c7584ee8b93d1b65df78e41b', class: {
                 "duet-tab-group-content": true,
                 "duet-m-0": this.margin === "none",
                 "checked-group-content": this.variation === "checked",
-            } }, hAsync("slot", { key: '5ac5065579d505e2364613192cc0d88cf69b28bf' }))));
+            } }, hAsync("slot", { key: 'a3cfe437f448fcaa8baf7c801814da9bf1eb744f' }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetTabGroupCss; }
@@ -25882,7 +26034,7 @@ class DuetTable {
         }
     }
     render() {
-        return (hAsync(Host, { key: 'f09bf787a7f03e0a090150db43e6dc6161e20cea', class: {
+        return (hAsync(Host, { key: '67be51f9c66e5e52789ede10d31aaa34da556e3b', class: {
                 [`duet-table-${this.variation}`]: true,
                 "duet-table-flattened": !this.matchesBreakpoint,
                 // sticky only valid when in regular table layout
@@ -25891,7 +26043,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: 'f451049eeedc4d2c51d6c974f4b6a221d96fb55c' })));
+            } }, hAsync("slot", { key: 'f20fd89d6078307f21e60a3c772e0719e78a94f7' })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -26145,17 +26297,17 @@ class DuetTextarea {
      */
     render() {
         const identifier = this.identifier || this.textareaId;
-        return (hAsync(Host, { key: '7300750a864cbadc91a4bf3a7ab7d04450780427', class: {
+        return (hAsync(Host, { key: 'f5f89ec4deb6832fb80b077eca0401ceae4f8bf8', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-has-counter": this.counter && !this.error,
                 "duet-expand": this.expand,
-            } }, hAsync("div", { key: '11152c72abbdf7761bdf1eff48b05ea47e5cf0b1', class: {
+            } }, hAsync("div", { key: '36131b2417d7eed326112df08c9736814bc90b8d', 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(DuetInternalLabel, { key: '341a0f4d4ec5c5bf84c514f6bdc38f4ccc9548dd', 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: 'b08b7af4e807526f403a40c8887cd15a5edd8cab', direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), hAsync("slot", { key: '1ab0eb95abcf55eb154449d113a5c70c27f6ebf3', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: 'a69d491c8ee0f43b5689df13cb0a1412f77edabd', id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), hAsync("div", { key: '4f1bd9dbca5d69b508179470d1bd5562c661e0d8', class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { key: 'bf68cac7d9974c793345a1654f376ec81c6193a3', id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), hAsync("textarea", { key: '17eb3015fbc945d255d76a109220758424ee2d71', 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: 'e4126ef678a63d32dc279d72428e3491c51242c8', alignment: "stretch" }, hAsync("duet-grid-item", { key: '7ce0d99ade2805d01726100eeb2516586ffd4726', margin: "none", fill: true }, hAsync("div", { key: 'a5048cbc807d2077f3841dee73f68da64482aa05', class: "duet-textarea-help duet-textarea-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '539f796779b6d2d9458373c7b0f3fa2f8c32d917' }, this.error))), hAsync("duet-grid-item", { key: '5ee0d0aa71cc0f800b72bb27f2a42c8173124b13', margin: "none", class: "duet-character-count-caption" }, this.counter && (hAsync(CharacterCount, { key: 'ae74a603668cff212ecbed513f7d158060cb38e9', theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (hAsync("duet-visually-hidden", { key: '44c5437f6487f02e856ecd6d0483fdab0650b9a4', class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
+            } }, hAsync(DuetInternalLabel, { key: '0120ce299715ef884c1cc2f1e42373e5bcb0e7a7', 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: '1b729cb1128299e33c70671aa55d5125ffcdc18a', direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), hAsync("slot", { key: '9072f184bc0244ec5fb2a2fe6719696028bb7d0b', name: "tooltip" }), this.caption && (hAsync("duet-caption", { key: '848706df1a73ce054a2b06f7c6e5510a21ff4a11', id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), hAsync("div", { key: '11ede29273d13f5ecb0ce24264096f387ec78c84', class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (hAsync("duet-caption", { key: '07ac46dc00428b32d11b7d5e3e5a1b3c4f2aad05', id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), hAsync("textarea", { key: '936fdccf8c2ad06a96579c790f044db2f5d9b17d', 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: '5b42e4e2f4f76d45c40aa36caec99eaaa242586a', alignment: "stretch" }, hAsync("duet-grid-item", { key: '59fd223682e940aeefdf807a2cdfd724a503b8e5', margin: "none", fill: true }, hAsync("div", { key: '01d99f1d11d978925155a9d4856920780df240bf', class: "duet-textarea-help duet-textarea-error", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && hAsync("span", { key: '5da5cc08fb85900d797232142167ce3be0f1cbb0' }, this.error))), hAsync("duet-grid-item", { key: '5124866d99a9a381afcb045edf709ae6df2f342b', margin: "none", class: "duet-character-count-caption" }, this.counter && (hAsync(CharacterCount, { key: 'eed9f6583984587452c6f0825dcfa801295f4c74', theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (hAsync("duet-visually-hidden", { key: '3dd2f6aee58742d3ad84b9f213ee26a1d17c04ba', class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
                 this.hiddenCounterLabel = el;
             } })))));
     }
@@ -26311,12 +26463,12 @@ class DuetToggle {
      */
     render() {
         const identifier = this.identifier || this.toggleId;
-        return (hAsync(Host, { key: '2093a760b60b31d12293248e71400f35f8d61d41', onClick: this.disabled ? undefined : this.onClick, class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: '9df498b9eaa9afc656efbe057170c8ff9a5fbc8c', class: {
+        return (hAsync(Host, { key: '1dd080e2157b99e6fa5b08148203be1318d2b842', onClick: this.disabled ? undefined : this.onClick, class: { "duet-m-0": this.margin === "none" } }, hAsync("div", { key: 'c75404887077682a10ab2c936730230b67fbfd60', class: {
                 "duet-toggle": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-side-label": this.labelPosition !== "top",
                 "duet-reverse-label": this.labelPosition === "right",
-            } }, hAsync(DuetInternalLabel, { key: '2de3e1957b169bd62655f09a896e1dc97ae320e6', theme: this.theme, color: this.labelColor, weight: this.labelWeight, for: identifier, margin: this.labelPosition === "top" ? "auto" : "none" }, this.label), hAsync("label", { key: '2bccb4e68b9b16233b058a3164846f68f30e89aa', class: "duet-switch" }, hAsync("input", { key: 'e50e0c876b32fc0e1295808715df252c9380cf27', type: "checkbox", value: this.value, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, id: identifier, role: this.role, name: this.name, checked: this.checked, required: this.required, disabled: this.disabled, ref: input => (this.nativeInput = input) }), hAsync("div", { key: '1effe3927aab889725ea51afaf2312e30262fc88', class: "duet-slider" })))));
+            } }, hAsync(DuetInternalLabel, { key: '729c25fde1456d487e6f469fb8fb9fb1f45a5bb9', theme: this.theme, color: this.labelColor, weight: this.labelWeight, for: identifier, margin: this.labelPosition === "top" ? "auto" : "none" }, this.label), hAsync("label", { key: '7a551eb3640c2ff849c18fa6d257cb8787e056e1', class: "duet-switch" }, hAsync("input", { key: '30c8f85f4938c0ee3b258d02446ce24c03664897', type: "checkbox", value: this.value, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, id: identifier, role: this.role, name: this.name, checked: this.checked, required: this.required, disabled: this.disabled, ref: input => (this.nativeInput = input) }), hAsync("div", { key: 'fe4a68e81538ba476056ee0aa98c50b7fbccbe98', class: "duet-slider" })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -26391,11 +26543,11 @@ class DuetToolbar {
             : this.variation === "secondary"
                 ? "secondary"
                 : "default";
-        return (hAsync(Host, { key: '08d97da22707379b6749ccac39cb2af709ba2358' }, hAsync("nav", { key: '2d65a3079fbad651cd8583b52d601bf24771dfcb', class: {
+        return (hAsync(Host, { key: 'd09fa625eaa0a62a319e2ce34e24dfd33007b353' }, hAsync("nav", { key: 'e0cefc23438745c64618d52fb2a7a842f65a8087', class: {
                 "duet-toolbar": true,
                 "duet-theme-turva": this.theme === "turva",
                 [variation]: true,
-            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: 'd6aa1f9190f6111b7468eaabbb6499f6d306a02d', class: "container" }, hAsync("div", { key: '9679d394d88960f13f1957df24cf2af2c57f0932', class: "list", role: "list" }, hAsync("slot", { key: '83d46b0c5eea3316b75ab78aec0f53e624e91a77', name: "left" })), hAsync("div", { key: '4c53db4a75a81e9c8ee8a5aa76585cb9ea113a60', class: "list", role: "list" }, hAsync("slot", { key: '5e00f1e0fdee3cd2dbc60806a769424690e31081', name: "right" }))))));
+            }, "aria-label": this.accessibleLabel }, hAsync("div", { key: '0f9047f89f861b03b53c9f7b24c975af3a846f0e', class: "container" }, hAsync("div", { key: '3476fceb8e8be124a473f4c959763c1da9aa27a5', class: "list", role: "list" }, hAsync("slot", { key: 'a18d367ca5aa63a9dfc969e3b6951bb63e45d1e9', name: "left" })), hAsync("div", { key: '6cc9f7958b933bc2ccd91b9d4711c0b4a446b469', class: "list", role: "list" }, hAsync("slot", { key: 'c850cff27a2b664300cc468c5bc255cb030db51c', name: "right" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetToolbarCss; }
@@ -26476,18 +26628,18 @@ class DuetToolbarDropdown {
             itemsAlign = this.element.parentElement.getAttribute("slot") === "left" ? "right" : "left";
         }
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (hAsync(Host, { key: '39c1289c2c1a080a501b139a4862a36d6ee04dfc', role: "listitem" }, hAsync("div", { key: '20445cfed0e28ada2172a9d89ca1b6ac98d26f30', class: {
+        return (hAsync(Host, { key: 'fa64118228a1c141fa9456b15e614613ed5ec29a', role: "listitem" }, hAsync("div", { key: 'cbb037e5087481045cd3563c550d870e882cbd87', class: {
                 "duet-toolbar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 [itemsAlign]: true,
                 [variation]: true,
-            } }, hAsync("button", { key: '7c490c965c678dadc7cdb92a6333b1ad4cf9c942', 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: '7f6abecc182ebcbc6f1942de14c523846750119f', 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: '83b913caee9f4cba1586a9125743fc22fb1d66cc', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: 'd0e9c90771ac841afb4943b8560eeb9467ff6a14', class: "label" }, hAsync("slot", { key: '851da1fe3173b1c7500cf7f3b3c0abf2265f2a06', name: "label" }), hAsync("duet-icon", { key: 'a364c0cd06daa71aa34ad1752c42f030240237fb', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '1122bfaa127a37c495c231f1419214d356939103', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (hAsync("duet-icon", { key: '35525346c9e8c24119fafa21f73438e99c74e17d', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), hAsync("span", { key: 'df334ca08fccecb1daaaf2e84b3a4c1fc355e3d5', class: "label" }, hAsync("slot", { key: '4ff5128d48d41cf7dae8bd1a6fc59b134621fc02', name: "label" }), hAsync("duet-icon", { key: '5292898bab697b524543d9a6285ba7a1d88f01d2', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), hAsync("div", { key: '980dde4c37021bfff8c9f0d82efe3b647807f2c6', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, hAsync("slot", { key: '668e154b19b4e44b45c2dfc2dd70a7cd386eb8b2' })))));
+            } }, hAsync("slot", { key: 'de67c7723de372d3250c9933a1572f329b32314c' })))));
     }
     get element() { return getElement(this); }
     static get style() { return duetToolbarDropdownCss; }
@@ -26553,11 +26705,11 @@ class DuetToolbarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'b6b0276c18bb21d1bfe0c88258010d143d559c21' }, hAsync("a", { key: 'ad6461c3419c4cd8b16b64ba906848ca050cea51', class: {
+        return (hAsync(Host, { key: '2bf85e25fb52ce14c4379309850230fa5763014f' }, hAsync("a", { key: '6ae67ccccb29c4daac6b2b107a2b6c1ff9b1d554', 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: '95e0be9746f101bb646c60514e3a1f1f3190c38f', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: 'e4699dc773d36708ec9ad24fcf2441031cc2b7fd', class: "label" }, hAsync("slot", { key: '67d87e78838d2c1f07b2d2d850132ab1e2e9daff' })), this.active && (hAsync("duet-icon", { key: '78af16cb5da1eac3c17072277c1c42c3f3d78ce9', 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: 'ffde6abcd4d9e925623445cacf0c5996c4b35a20', name: this.icon, size: "x-small", margin: "none" }), hAsync("span", { key: '24d31392d95a52029a75119c3f835e4915d214c7', class: "label" }, hAsync("slot", { key: '920ba82ac8e9c23acff11015c9ba336cc4a699e0' })), this.active && (hAsync("duet-icon", { key: '2b6f96f89947c64504220ce22f347aaaac32d7b1', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
     static get style() { return duetToolbarDropdownLinkCss; }
@@ -26660,17 +26812,17 @@ class DuetToolbarItem {
             : this.variation === "secondary"
                 ? "secondary"
                 : "default";
-        return (hAsync(Host, { key: '64c6d59d858d9a367de1e9d2888609dc99af0bed', role: "listitem" }, hAsync(TagName, { key: '6a4ba040913ea2730aa20a4391f6d5cdd0b02121', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
+        return (hAsync(Host, { key: '162cf805e05ccc2afbe436132c6eea801ade6d91', role: "listitem" }, hAsync(TagName, { key: '56ade7a57f34340591df7e1b040a8478de805ae1', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
                 "duet-toolbar-item": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [variation]: true,
-            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("div", { key: 'adf46745db5ff738dc6fc84e2c2d6012a31e1a75', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '2ff8285855845e9fd2c83679326418d794924738', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" }), this.badge && hAsync("div", { key: '7416e778240ef89b8084d45b4d980c352ca2307a', class: "duet-toolbar-badge" }))), hAsync("slot", { key: '81ad250808b48b9959bed95b755c6586a383e394' }), (this.trailingIcon || (this.url && this.external)) && (hAsync("div", { key: '00d8495878984b986cff410786834b6053679017', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '2998a4370ade9d5a8e47e6b9cd5fc0b7bc791362', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (hAsync("div", { key: '5ad00f6ebd929f86345eff8d567dca3c47e6b724', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: '7d876e02c1fa8c0702f497487fdc63fa28c9f19c', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" }), this.badge && hAsync("div", { key: 'c23c6b7e24652198ee4bfa23b83dbbd769238ef8', class: "duet-toolbar-badge" }))), hAsync("slot", { key: 'e8e49955cbcee9ef19d74bb6a2bbe315504dd54e' }), (this.trailingIcon || (this.url && this.external)) && (hAsync("div", { key: '89abb2ae15dad5cc0775ffe3e432be5e35f20751', class: "duet-toolbar-icon" }, hAsync("duet-icon", { key: 'dcd41089541238143d30e109bdc28c6b03c20cbb', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!(this.url && this.external),
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
-            }, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? newWindowIcon.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && hAsync("div", { key: 'b11a71d59e3829f02ce84d82a038fe299958dac9', class: "duet-toolbar-badge" }))))));
+            }, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? newWindowIcon.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && hAsync("div", { key: '0cfca44b60f68a885d83b230411954dc5fc42b5e', class: "duet-toolbar-badge" }))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetToolbarItemCss; }
@@ -26737,12 +26889,12 @@ class DuetToolbarLink {
      */
     render() {
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (hAsync(Host, { key: '527a9f5ac48f5c2fcb31f39fe44ddaaea0a03307', role: "listitem" }, hAsync("a", { key: '07c174dedae6a03e865c17297004f630eddc4b83', class: {
+        return (hAsync(Host, { key: '3892831234a833b4a247d3de3f9a66c30135e5a2', role: "listitem" }, hAsync("a", { key: '7f8a8e206d7775ed92ab5936304cc4c4aea4147a', 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: '44290c9a074a5f3a3937e77679988a1e1c79b8bd', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: '130d6d433324b5a8977c8858c6876785cd759335' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (hAsync("duet-icon", { key: '8c58a04f9ee135ee12d4b32aee1c43d5b0e9f18b', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), hAsync("slot", { key: 'c6a1605ebb2b6d099a87e430792730aceeb9230a' }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetToolbarLinkCss; }
@@ -27064,13 +27216,13 @@ class DuetTooltipButton {
      * Always the last one in the class.
      */
     render() {
-        const visuallyHidden = hAsync("duet-visually-hidden", { key: 'ca106bddf825b34794a4501e0524c08a5f51c004' }, this.accessibleLabel);
-        return (hAsync(Host, { key: 'e51d106da5da08f757140ee8d8bb553cb8068ad0' }, hAsync("button", { key: '39d6d544869f4f16266da85c945bb6b16352c4cc', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
+        const visuallyHidden = hAsync("duet-visually-hidden", { key: '70a82f2c22f0f4f4550e15b1e7ec8c526e3c122e' }, this.accessibleLabel);
+        return (hAsync(Host, { key: '19556e89ed879d642f95db9e14dfe6350af14858' }, hAsync("button", { key: '2b2fab3108b3575da91c00ad81a763d776476b28', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
                 "duet-tooltip-button": true,
                 "duet-tooltip-button-has-label": !!this.label,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-button-negative": this.negative,
-            } }, hAsync("svg", { key: '171062cb01a49fca11be5c779a976626ea252ab7', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '06fcd87af8e4748f282822df669153ed480ca76e', 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: '7c876aad503ad68f5745ee28a785de62c08f21fa', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: 'e63ba148a4082e179dc32a232cff6529f2afa5e6', 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, visuallyHidden)) : (visuallyHidden))));
+            } }, hAsync("svg", { key: 'b665bf9fc4f777eed4e4e152c394adce11fc4f4e', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, hAsync("path", { key: '2f25f9fefa3c82c6f182507c79d3a9cf904fa009', 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: '2b0bea40ebef849a5faf6958f2d6da457180eaa1', cx: "11.625", cy: "7.125", r: "1.125" }), hAsync("path", { key: '44744f79a997b131473388d0e02347277d04c42e', 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, visuallyHidden)) : (visuallyHidden))));
     }
     get element() { return getElement(this); }
     static get style() { return duetTooltipButtonCss; }
@@ -27135,11 +27287,11 @@ class DuetTooltipPopup {
         this.contentEl.focus();
     }
     render() {
-        return (hAsync(Host, { key: '2899e860feadd6d31e257dd8f67a765b2dd103de' }, hAsync("div", { key: 'e2ad1d1db943c91b633c40cb76fd1a8c62afc4f7', class: {
+        return (hAsync(Host, { key: 'cf44855d08d69141e629987f9ba2fdccdcdc21d7' }, hAsync("div", { key: 'bf7580b8ecdf58b6c93c3c21cbb362234cc699b4', class: {
                 "duet-tooltip": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-active": this.active === true,
-            } }, hAsync(FocusGuard, { key: 'a638d291e9a3347c63e8717fe923b10c33b0844e', moveFocusTo: this.buttonEl }), hAsync("div", { key: '0eaab033773324479dd1e39842022beb57ea0722', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: -1, id: this.tooltipId }, hAsync("slot", { key: '89344c3b60eb73c65a766e9d997b46b86f25a33e' })), hAsync("div", { key: '6b1ffe4455528169bafe06cbdca8da2594b4ee23', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: '526889c3662f088271636b8c9fd2406b3df73e32', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: '2541026316c4d6e1c8cc01c9ed7b6c14cec5a46f', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: 'cd144f2f0f78be9a84b101349aa429a28b2d2593', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: 'd391959976c40cfd26bf2e2f1dca6ced9851c921' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: 'ebbbb2f752d245c4953851e422b641add964e99b', moveFocusTo: this.contentEl }))));
+            } }, hAsync(FocusGuard, { key: '6f5a516e23035e8e0b9c2951ef4a10243b564d17', moveFocusTo: this.buttonEl }), hAsync("div", { key: 'c41a0c3b305e6b7a2378ef026e62cf2317dafbae', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: -1, id: this.tooltipId }, hAsync("slot", { key: '52b6fdbfbdcbcc8862deef3747e757c264d3ab48' })), hAsync("div", { key: '0d4dfae3f19140c33f0f3fb3d809fb4040709482', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, hAsync("div", { key: '7d6908f726db2eccbc469cd001f90eda504f2a81', class: { "arrow-container": true, [this.placement]: true } })), hAsync("button", { key: '781903abe2564af32ae934ac36932d472c0f931a', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, hAsync("duet-icon", { key: '093d2ef20e77164379ca8fbd684c8df2a3b1b2a6', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), hAsync("duet-visually-hidden", { key: '75dd3160901c07c32af93259975321284e62bc90' }, this.accessibleCloseLabel)), hAsync(FocusGuard, { key: '9f838f645eff92ea829befb3acb4816d160179f3', moveFocusTo: this.contentEl }))));
     }
     get element() { return getElement(this); }
     static get style() { return duetTooltipPopupCss; }
@@ -27288,14 +27440,14 @@ class DuetTray {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync("div", { key: 'd5ec6c18ad014ddd13019b9c8fcb8ca226c68e42', class: {
+        return (hAsync("div", { key: '4feb3ea8d6067ec6d82c6eaf9225fe6728bd4acc', 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: 'ce175640e511a0c3f296d1639fef3952c88781de', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: 'c0277022e4e85149018516b0d44126cb2af05abc' })), this.hasAdditionalContent && (hAsync(Fragment, { key: 'e631d00e9a9e0853c0787cf28bf849533440ee31' }, hAsync("button", { key: '2790af455c1435ca517c34eda7ba5d12268c3951', "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: 'deb414a7f3307046ec454317e8912aaaf98201f2', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: 'dd64f532c66429931fd8b7316acb93e55eb10d2c' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: '8c4251fdb0f0ff12f9eb09018988f864efdbc57d', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: '247c210c97a547d944d6816f32a180102bbc33cd', class: "duet-tray-expandable-content" }, hAsync("slot", { key: '74ca2eed38f55e91384710d6ebc2e4f536b23b3c', name: "additional" })))))));
+            } }, hAsync("div", { key: 'c51904bcc9f3d0297da08c32952be7ea690bafc8', class: "duet-tray-default-content", role: "status" }, hAsync("slot", { key: '52e8b11bdf354f65b34fb1d6d2facbf636a01758' })), this.hasAdditionalContent && (hAsync(Fragment, { key: '86e6560df02094fcc7b7df9146c34c47923d89eb' }, hAsync("button", { key: '000c5472ff2f7f1a0ffe6e796817a51fcaecd856', "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: '02489a52896b40ce4916a3b6dfcdd40d36212251', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), hAsync("duet-visually-hidden", { key: '866528d950899fe557f6023f8f9ca79e9545fd15' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), hAsync("div", { key: 'c3400e3dda10617ffd45395e46247ef88a2157a8', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, hAsync("div", { key: 'f2176a2e171dfae93254cba98d31e13855c3b0e5', class: "duet-tray-expandable-content" }, hAsync("slot", { key: '21d7e1276815c885a9832fcdb87ffbd96fe8a03c', name: "additional" })))))));
     }
     get element() { return getElement(this); }
     static get style() { return duetTrayCss; }
@@ -28610,10 +28762,10 @@ class DuetUpload {
             this.externalUploadButton.accessibleLabel = `${this.externalUploadButton.innerText}. ${caption}`;
         }
         // @ts-ignore
-        return (hAsync(Host, { key: '084a0fc2bdde1a2941f8c744c78d87f20b491681', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: 'ba680ad033e9d3bbba97a6326831706cd0ec00e1', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: '4b4e6594c6e5d19db6547b0e91080af0b8c1ef7a', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: 'ac8cf5b831c07604bc78432dad2b402e0ba54399', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: '8ae08f17cf6280d6e91e4fe3912768a36f4fb702', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: '269c0959dbe07e7400f06c40272029108a311ee6', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: '5ad7161fa88215b73cea4edf6f8c4a66eda241bd', 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: '9bcae363685725a71813fbf84439ba87041cb064', name: "filefooter" }), hAsync("slot", { key: '85a1662f1a503993f785c445dc96e473aa088664', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: '192dc7c2ec57694930ad33a367d28926eb952dda', margin: "none", size: "small" }, hAsync("div", { key: 'e5b95619ec2b80356a52cb8b68a85df64b1a905e', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: 'd2abfe6f0e1589b89929dc3e3198099b22d0bd43', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: 'd86816588b150cd6d581b4046ec7252c94088236' }, hAsync("duet-spacer", { key: 'b785196b527a28f0bc907b9457589615ae09cd64', size: "large" }), hAsync("duet-button", { key: '05289972d06138915a81648060702dc37d41d4e2', 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: '778bd75c9be94d65bb9722e49f919ebe96d0232d', class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { key: '86cb01a83aaa8b07b30a0dea14df211cba69f3ab', "label-heading-level": this.headerHeadingLevel, "label-hidden": this.hideHeader, label: this.label }, hAsync("slot", { key: '4bde3430f3d36cb1220fc12bbb801eafe70c4e91', name: "header" }), !this.files.size && (hAsync("duet-empty-state", { key: '3427abd455392d8063bd85a3396a831efc5f099e', id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, hAsync("duet-paragraph", { key: '5c46fc6e79ad3427d705d237cbb7cbc271179c3f', margin: "none" }, this.fileListEmpty))), !!this.files.size && hAsync("slot", { key: 'bd7345b68ba7339c2163a07055bcd0195be06974', name: "fileheader" }), !!this.files.size && (hAsync("duet-upload-aria-status", { key: '3d4316e1a725d9c76b077d6f7af8f7e555070aa3', 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: '37e2422249ea697845dc47e1e793feef29927186', name: "filefooter" }), hAsync("slot", { key: '0056e0dd3847319978358fee188d82398c06c9a1', name: "uploadfooter" }), this.captionOnBottom && (hAsync("duet-caption", { key: '962a0485219f6a4a0d983d362860aa9caaecdd9c', margin: "none", size: "small" }, hAsync("div", { key: 'c0e53f5f8e508406eb2b79bc3aca2e6d9c91ac42', class: "upload-bottom-caption" }, caption))), hAsync("slot", { key: '7476632f57f0516caff8967a08d7c011c4859c21', name: "afterfooter" }), !this.hideButton && (hAsync(Fragment, { key: '3f7e814dd7256beee8db3e8393b837be7da1f8a8' }, hAsync("duet-spacer", { key: '8ef3e7422cfa406c721cdc843ad2625c64dd4f7b', size: "large" }), hAsync("duet-button", { key: 'b3af8fa02fea6339f92b3e5fe46b4259392357fa', 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: '856d59a346ff18608610f391196b0c9b451262f4' }, hAsync("duet-spacer", { key: '6cc9e2be4be1c50a7d15f00524d206a77ee47657', size: "medium" }), hAsync("duet-alert", { key: 'ca56a2bc49443a4d330ef5d6c2ebee9f5166b54d', 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: '1e24539b6ac3ff88d3d36bf0503c2dba768f1559', "aria-hidden": "true" }, hAsync("input", { key: '455bea761a5c5d990b22fe1e87081f5b5fbd66f2', ref: input => {
+            this.filesToUploadTotalSizeIsAboveMax) && (hAsync(Fragment, { key: '51436c684d7830dac19f0cfac75b85b85945aaa9' }, hAsync("duet-spacer", { key: '5d32c83854ace51e13433bd001d936d61ffd2a3c', size: "medium" }), hAsync("duet-alert", { key: '97960577cf5e708740f6b68d6a7e242b696e7378', 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: 'd1063962b250be5515cf9e98738b0b2ddb437d80', "aria-hidden": "true" }, hAsync("input", { key: 'b7e46fbc27706de8c6159467c471c81834663b65', 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,
@@ -28955,7 +29107,7 @@ class DuetUploadAriaStatus {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'fa31b3d79feba2c657b461cf62d5391b09d59c3c', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: 'b2198ea8a27870a5a2fa351a7588774ff9d287b1' }, this.statusMessage)));
+        return (hAsync(Host, { key: '2084d67e27f201170cb0915e97235481a8f42ff6', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, hAsync("duet-visually-hidden", { key: 'f774f8926c1f2500866e4b50781cf83a1263b0c2' }, this.statusMessage)));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -29135,9 +29287,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: '0f541bd5eab133034ce730ccd2393e4a32fa0f04', class: {
+        return (hAsync("div", { key: 'd5e5d2db3667a4f6011411a27fef2f9b45108f8e', class: {
                 "upload-item-row": true,
-            } }, this.showCategory && (hAsync("div", { key: '1453c4a57897f79ff16c394e364a49bec0564c01', class: "item-categories" }, hAsync("duet-heading", { key: '70abc60205d0a1762ab1bb0e280dffa8e6cc6771', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: '4fbfc73b03cea70267c423440d34ab1a356fb14a', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: '76e07f77e629200029052bbb394a40602f7b8ce0', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: '97be35ab3df99a8ad62fb85e605fc39f378c8e0c', class: "item-actions" }, this.actions.map(actionItem => {
+            } }, this.showCategory && (hAsync("div", { key: '1ab11fe55d884a902497e0e3af8126f4b007af5f', class: "item-categories" }, hAsync("duet-heading", { key: 'f035ab2fdb44c04d6e2d8747caee034db92325bc', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), hAsync("div", { key: 'e9eebcc83bcaac3a8eeb8fd441f6663cd43be213', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (hAsync("duet-heading", { key: '4e18a21c1e78c6af26e4728635930b83de247593', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), hAsync("div", { key: '3b1ee538c1f5e43ff3cd35f99bcb2a565e5e68e2', 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) }));
         }))));
     }
@@ -29177,7 +29329,7 @@ class DuetVisuallyHidden {
      * Always the last one in the class.
      */
     render() {
-        return (hAsync(Host, { key: 'effee6c13cd71f7c0015171b5a0fe6cd92ca9368', class: "duet-visually-hidden" }, hAsync("slot", { key: 'f1f5ed8ac886b181b184ef4bc796524ac03386ad' })));
+        return (hAsync(Host, { key: '2ac2536c5fb762954d328da1080105d92292c8b4', class: "duet-visually-hidden" }, hAsync("slot", { key: '4f58c2bdca5f9d629586174be225448f22662155' })));
     }
     get element() { return getElement(this); }
     static get style() { return duetVisuallyHiddenCss; }
@@ -29245,6 +29397,7 @@ registerComponents([
   DuetOverlay,
   DuetPageHeading,
   DuetPagination,
+  DuetPanel,
   DuetParagraph,
   DuetPhoneInput,
   DuetPopupMenu,