@duetds/components 4.30.1 → 4.31.0

package/lib/custom-elements-bundle/index.js

@@ -1091,9 +1091,6 @@ const dispatchHooks = (hostRef, isInitialLoad) => {
             promise = safeCall(instance, 'componentWillLoad');
         }
     }
-    {
-        promise = then(promise, () => safeCall(instance, 'componentWillRender'));
-    }
     endSchedule();
     return then(promise, () => updateComponent(hostRef, instance, isInitialLoad));
 };
@@ -1644,6 +1641,51 @@ const appGlobalScript = () => {
 
 const globalScripts = appGlobalScript;
 
+function isObject(maybeObj) {
+  return Object.prototype.toString.call(maybeObj) === "[object Object]";
+}
+const parsePossibleJSON = (maybeJSON) => {
+  if (Array.isArray(maybeJSON) || isObject(maybeJSON)) {
+    return maybeJSON;
+  }
+  if (typeof maybeJSON === "string") {
+    try {
+      return JSON.parse(maybeJSON);
+    }
+    catch (e) {
+      console.warn(e);
+    }
+  }
+  // undefined is not a type in JSON,
+  // so we use it here to signal invalid input
+  return undefined;
+};
+/**
+ * Format string, via simplistic sprintf equivalent
+ * @example String.format('{0} is super, but {1} is best! {{0}}', 'Duet', 'Coffee'); -> "Duet is super, but Coffee ist best! {0}"
+ *
+ */
+// @ts-ignore
+if (!String.format) {
+  // @ts-ignore
+  String.format = function (format) {
+    var args = Array.prototype.slice.call(arguments, 1);
+    return format.replace(/\{\{|\}\}|\{(\d+)\}/g, function (curlyBrack, index) {
+      return curlyBrack == "{{" ? "{" : curlyBrack == "}}" ? "}" : args[index];
+    });
+  };
+}
+const MATCH_DISALLOWED_CHARS = /[^a-z0-9áéíóúñüöäå \.,_-]/gim;
+function sanitizeString$1(string) {
+  return string.replace(MATCH_DISALLOWED_CHARS, "").trim();
+}
+const convertHtmlQuotes = string => {
+  if (typeof string === "string") {
+    return string.replace(/"/g, '"').replace(/'/g, '"');
+  }
+  return string;
+};
+
 const localeLookUpTable = {
   fi: "fi-FI",
   en: "en-GB",
@@ -1658,13 +1700,13 @@ const localeMonetarySignifierLookUpTable = {
 };
 const defLanguageArray = ["fi", "en", "sv"];
 const defaultLanguage = "fi";
-const currentLanguage = document.documentElement.lang
-  ? document.documentElement.lang.toLowerCase()
-  : defaultLanguage;
+const getCurrentLanguage = () => {
+  return document.documentElement.lang ? document.documentElement.lang.toLowerCase() : defaultLanguage;
+};
 const isOfTypeLanguage = (keyInput) => {
   return defLanguageArray.includes(keyInput);
 };
-const checkForLanguage = (languageString = currentLanguage) => {
+const checkForLanguage = (languageString = getCurrentLanguage()) => {
   if (isOfTypeLanguage(languageString)) {
     return languageString;
   }
@@ -1678,7 +1720,7 @@ const checkForLanguage = (languageString = currentLanguage) => {
  * @param {string} lang=fi - "fi" | "sv" | "en"
  * @default {string} "fi"
  */
-const getLanguage = (languageString = currentLanguage) => checkForLanguage(languageString);
+const getLanguage = (languageString = getCurrentLanguage()) => checkForLanguage(languageString);
 /**
  * Returns the current language and locale
  * If language is not fi|sv|en it will default to "fi"
@@ -1696,21 +1738,34 @@ const getLocale = (lang) => {
   }
   throw new Error(`Locale for "${lang}" not found`);
 };
+const sanitizeString = (string) => {
+  const argIsString = typeof string === "string";
+  if (argIsString) {
+    try {
+      return JSON.parse(convertHtmlQuotes(string));
+    }
+    catch (e) {
+      console.log("getLocaleString received a string, that didnt parse to json object", string, e);
+    }
+  }
+  return string;
+};
 /**
  * Returns the current string / object from a given translation object
  * If language is not fi|sv|en it will default to "fi"
  * special case where lang can be ALSO be "us" in addition to other types - if user decides to override local language
- * @param {object} langObject - {fi: "finnish", sv: "swedish", en: "english"}
+ * @param {object} langObject - {fi: "finnish", sv: "swedish", en: "english"} | string will get JSON.parsed
  * @param {boolean} languageOverride = false - in case you want to override the actual language set in html tag
  * @default {object} {locale: "fi-FI", money: "€"}
  * @returns {(string|Object)} given example contains {fi:"something"} and langua===fi this will return "something"
  */
 const getLocaleString = (langObject, languageOverride) => {
+  const obj = sanitizeString(langObject);
   if (languageOverride) {
-    return langObject[checkForLanguage(languageOverride)];
+    return obj[checkForLanguage(languageOverride)];
   }
   else {
-    return langObject[getLanguage()];
+    return obj[getLanguage()];
   }
 };
 
@@ -1740,6 +1795,7 @@ let DuetAlert$1 = class extends HTMLElement {
     /**
      * Property to change languageDefaults on the component.
      * normally you would handle these strings on an application level and override @accessibleLabel when needed
+     * @default {fi: "Sulje viesti", sv: "Stäng meddelandet", en: "Close the message"}
      */
     this.accessibleLabelDefaults = {
       fi: "Sulje viesti",
@@ -1819,7 +1875,7 @@ let DuetAlert$1 = class extends HTMLElement {
   static get style() { return duetAlertCss; }
 };
 
-const duetBadgeCss = "*,*::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:4px !important;margin-bottom:2px !important;display:inline-block;width:auto;vertical-align:middle}:host:last-child,:host:last-of-type{margin-right:0 !important}:host(.duet-m-0){margin:0 !important}.duet-badge{width:100%;padding:4.4444444444px 12px 5.4444444444px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.75rem;font-style:normal;font-weight:600;line-height:1.25;color:#00294d;text-align:center;vertical-align:middle;background:#e6f1f7;border-radius:20rem}.duet-badge.duet-p-0{padding:0 !important}.duet-badge.duet-m-0{margin:0 !important}.duet-badge.duet-theme-turva{padding:5.4444444444px 12px 4.4444444444px;font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-weight:700;color:#171c3a;background:#e8e8eb}.duet-badge.warning{background:#fef3df}.duet-badge.warning.duet-theme-turva{background:#fef1db}.duet-badge.danger{background:#fce9ef}.duet-badge.danger.duet-theme-turva{background:#fceae7}.duet-badge.success{background:#e6f3ef}.duet-badge.success.duet-theme-turva{background:#e6f3ed}";
+const duetBadgeCss = "*,*::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:4px !important;margin-bottom:2px !important;display:inline-block;width:auto;vertical-align:middle}:host:last-child,:host:last-of-type{margin-right:0 !important}:host(.duet-m-0){margin:0 !important}.duet-badge{width:100%;padding:4.4444444444px 12px 5.4444444444px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.75rem;font-style:normal;font-weight:600;line-height:1.25;color:#00294d;text-align:center;word-break:break-word;vertical-align:middle;background:#e6f1f7;border-radius:20rem}.duet-badge.duet-p-0{padding:0 !important}.duet-badge.duet-m-0{margin:0 !important}.duet-badge.duet-theme-turva{padding:5.4444444444px 12px 4.4444444444px;font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-weight:700;color:#171c3a;background:#e8e8eb}.duet-badge.warning{background:#fef3df}.duet-badge.warning.duet-theme-turva{background:#fef1db}.duet-badge.danger{background:#fce9ef}.duet-badge.danger.duet-theme-turva{background:#fceae7}.duet-badge.success{background:#e6f3ef}.duet-badge.success.duet-theme-turva{background:#e6f3ed}";
 
 let DuetBadge$1 = class extends HTMLElement {
   constructor() {
@@ -2258,7 +2314,7 @@ let DuetButton$1 = class extends HTMLElement {
      * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
      * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
      */
-    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults, this.language);
+    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults);
     /**
      * Icon to display to the left of the button content.
      * This is ignored/overridden when button is used as an external link.
@@ -2485,46 +2541,7 @@ const isQuestionKey = (e) => e.key === "?";
 const isEnterKey = (e) => e.key === "Enter" || e.keyCode === 13;
 const isKeyboardClick = (e) => isEnterKey(e) || isSpaceKey(e);
 
-function isObject(maybeObj) {
-  return Object.prototype.toString.call(maybeObj) === "[object Object]";
-}
-const parsePossibleJSON = (maybeJSON) => {
-  if (Array.isArray(maybeJSON) || isObject(maybeJSON)) {
-    return maybeJSON;
-  }
-  if (typeof maybeJSON === "string") {
-    try {
-      return JSON.parse(maybeJSON);
-    }
-    catch (e) {
-      console.warn(e);
-    }
-  }
-  // undefined is not a type in JSON,
-  // so we use it here to signal invalid input
-  return undefined;
-};
-/**
- * Format string, via simplistic sprintf equivalent
- * @example String.format('{0} is super, but {1} is best! {{0}}', 'Duet', 'Coffee'); -> "Duet is super, but Coffee ist best! {0}"
- *
- */
-// @ts-ignore
-if (!String.format) {
-  // @ts-ignore
-  String.format = function (format) {
-    var args = Array.prototype.slice.call(arguments, 1);
-    return format.replace(/\{\{|\}\}|\{(\d+)\}/g, function (curlyBrack, index) {
-      return curlyBrack == "{{" ? "{" : curlyBrack == "}}" ? "}" : args[index];
-    });
-  };
-}
-const MATCH_DISALLOWED_CHARS = /[^a-z0-9áéíóúñüöäå \.,_-]/gim;
-function sanitizeString(string) {
-  return string.replace(MATCH_DISALLOWED_CHARS, "").trim();
-}
-
-const duetCardCss = "*,*::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-bottom:20px !important;display:flex;width:100%;vertical-align:top}:host(.duet-card-info){margin-bottom:16px !important}:host(.duet-m-0){margin:0 !important}.duet-card{padding:20px !important;position:relative;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;line-height:1.5;color:#00294d;text-decoration:none;border-radius:4px;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-card.duet-p-0{padding:0 !important}.duet-card.duet-m-0{margin:0 !important}.duet-card:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-card:focus,.duet-card:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 36em){.duet-card{padding:28px !important}}.duet-card.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:#171c3a;box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}@media (min-width: 36em){.duet-card.x-small{padding:20px !important}}@media (min-width: 36em){.duet-card.medium{padding:28px !important}}@media (min-width: 48em){.duet-card.medium{padding:36px !important}}@media (min-width: 36em){.duet-card.large{padding:36px !important}}@media (min-width: 48em){.duet-card.large{padding:48px !important}}@media (min-width: 36em){.duet-card.x-large{padding:48px !important}}@media (min-width: 48em){.duet-card.x-large{padding:72px !important}}.duet-card.duet-card-collapsed{padding-bottom:0 !important}@media (min-width: 36em){.duet-card.duet-card-collapsed{padding-bottom:0 !important}}.duet-card.info{background:rgba(0, 80, 128, 0.04) !important;box-shadow:none}.duet-card.info.duet-theme-turva{background:rgba(23, 28, 58, 0.035) !important}.duet-card.plain{box-shadow:none}.duet-card.plain:not(.duet-card-has-bg){background:transparent !important}.duet-card-heading-grid{display:flex;align-items:center}.duet-card-heading-grid .expand{flex:1}.duet-card-heading-text{overflow:hidden;text-overflow:ellipsis}.duet-card-secondary-heading{font-size:1rem;font-weight:600}.duet-card-heading{position:relative;display:block;padding:16px 20px;margin:-20px -20px 20px;overflow:hidden;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:1.25rem;font-weight:800;color:#00294d;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid #e1e3e6}@media (min-width: 36em){.duet-card-heading{padding:15px 28px 16px !important;margin:-28px -28px 20px}}.duet-card-heading[role=button]{-webkit-user-select:none;user-select:none;cursor:pointer;border-radius:4px;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;appearance:none}.duet-card-heading[role=button]:focus{outline:0}:host(.user-is-tabbing) .duet-card-heading[role=button]:focus{border-radius:4px;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-card-heading[role=button]:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-card-collapsed .duet-card-heading{margin-bottom:0 !important;border-bottom:0 !important}.duet-theme-turva .duet-card-heading{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;border-color:#e4e4e6}@media (min-width: 36em){.x-small .duet-card-heading{padding:10px 20px 11px !important;margin:-20px -20px 20px}}@media (min-width: 48em){.x-small .duet-card-heading{padding:10px 20px 11px !important;margin:-20px -20px 20px}}.medium .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.medium .duet-card-heading{padding:15px 28px 16px !important;margin:-28px -28px 20px}}@media (min-width: 48em){.medium .duet-card-heading{padding:19px 36px 20px !important;margin:-36px -36px 28px}}.large .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.large .duet-card-heading{padding:19px 36px 20px !important;margin:-36px -36px 28px}}@media (min-width: 48em){.large .duet-card-heading{padding:26px 48px 27px !important;margin:-48px -48px 36px}}.x-large .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.x-large .duet-card-heading{padding:26px 48px 27px !important;margin:-48px -48px 36px}}@media (min-width: 48em){.x-large .duet-card-heading{padding:39px 72px 40px !important;margin:-72px -72px 48px}}.none .duet-card-heading{padding:0 0 20px !important;margin:0 0 20px}.duet-card-footer{padding:20px;margin:20px -20px -20px;font-size:0.875rem;line-height:1.25;background:#f5f8fa;border-bottom-right-radius:4px;border-bottom-left-radius:4px}.duet-theme-turva .duet-card-footer{background:#f5f5f7}@media (min-width: 36em){.duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){.duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 36em){.x-small .duet-card-footer{padding:15px 28px 16px !important;padding-left:20px !important;margin:20px -20px -20px}}@media (min-width: 36em){.medium .duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){.medium .duet-card-footer{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 36em){.large .duet-card-footer{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 48em){.large .duet-card-footer{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 36em){.x-large .duet-card-footer{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 48em){.x-large .duet-card-footer{padding:39px 72px 40px !important;margin:48px -72px -72px}}.none .duet-card-footer{padding:12px 0 !important;margin:20px 0 0}.duet-card-content{width:100%}.duet-card-collapsed .duet-card-content{display:none}.duet-card-caret{transition:300ms ease}[aria-expanded=false] .duet-card-caret{transform:rotate(-180deg)}.duet-card-image-mask{position:relative;width:calc(100% + 40px);margin:-20px 0 20px -20px;overflow:hidden;border-top-left-radius:4px;border-top-right-radius:4px}@media (min-width: 36em){.small .duet-card-image-mask{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 36em){.medium .duet-card-image-mask{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 48em){.medium .duet-card-image-mask{width:calc(100% + 72px);margin:-36px 0 28px -36px}}@media (min-width: 36em){.large .duet-card-image-mask{width:calc(100% + 72px);margin:-36px 0 36px -36px}}@media (min-width: 48em){.large .duet-card-image-mask{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 36em){.x-large .duet-card-image-mask{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 48em){.x-large .duet-card-image-mask{width:calc(100% + 144px);margin:-72px 0 36px -72px}}.none .duet-card-image-mask{width:100%;margin:0 0 20px}.duet-card-image{display:block;width:102%;min-width:1px;max-width:102%;height:auto;min-height:1px;margin-left:-1%;transition:transform 300ms ease;transform:scale(1.0001)}a.duet-card{transition:box-shadow 300ms ease, background-position 300ms ease}a.duet-card:hover{box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(0, 41, 77, 0.1)}a.duet-card:hover .duet-card-image{transform:scale(1.024)}.duet-theme-turva a.duet-card:hover{box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(117, 117, 117, 0.15)}a.duet-card:active{transition:none;transform:translateY(1px)}";
+const duetCardCss = "*,*::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-bottom:20px !important;display:flex;width:100%;vertical-align:top}:host(.duet-card-info){margin-bottom:16px !important}:host(.duet-m-0){margin:0 !important}.duet-card{padding:20px !important;position:relative;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;line-height:1.5;color:#00294d;text-decoration:none;border-radius:4px;box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}.duet-card.duet-p-0{padding:0 !important}.duet-card.duet-m-0{margin:0 !important}.duet-card:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-card:focus,.duet-card:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}@media (min-width: 36em){.duet-card{padding:28px !important}}.duet-card.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:#171c3a;box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07)}@media (min-width: 36em){.duet-card.x-small{padding:20px !important}}@media (min-width: 36em){.duet-card.medium{padding:28px !important}}@media (min-width: 48em){.duet-card.medium{padding:36px !important}}@media (min-width: 36em){.duet-card.large{padding:36px !important}}@media (min-width: 48em){.duet-card.large{padding:48px !important}}@media (min-width: 36em){.duet-card.x-large{padding:48px !important}}@media (min-width: 48em){.duet-card.x-large{padding:72px !important}}.duet-card.duet-card-collapsed{padding-bottom:0 !important}@media (min-width: 36em){.duet-card.duet-card-collapsed{padding-bottom:0 !important}}.duet-card.info{background:rgba(0, 80, 128, 0.04) !important;box-shadow:none}.duet-card.info.duet-theme-turva{background:rgba(23, 28, 58, 0.035) !important}.duet-card.plain{box-shadow:none}.duet-card.plain:not(.duet-card-has-bg){background:transparent !important}.duet-card-heading-grid{display:flex;flex-direction:row}.duet-card-icon{align-self:center}.duet-card-heading-text{flex:1;word-break:break-word}.duet-card-secondary-heading{font-size:1rem;font-weight:600;word-break:break-word}.duet-card-heading{position:relative;display:block;padding:16px 20px;margin:-20px -20px 20px;overflow:hidden;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:1.25rem;font-weight:800;color:#00294d;border-bottom:1px solid #e1e3e6}@media (min-width: 36em){.duet-card-heading{padding:15px 28px 16px !important;margin:-28px -28px 20px}}.duet-card-heading[role=button]{-webkit-user-select:none;user-select:none;cursor:pointer;border-radius:4px;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;appearance:none}.duet-card-heading[role=button]:focus{outline:0}:host(.user-is-tabbing) .duet-card-heading[role=button]:focus{border-radius:4px;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva .duet-card-heading[role=button]:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-card-collapsed .duet-card-heading{margin-bottom:0 !important;border-bottom:0 !important}.duet-theme-turva .duet-card-heading{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a;border-color:#e4e4e6}@media (min-width: 36em){.x-small .duet-card-heading{padding:10px 20px 11px !important;margin:-20px -20px 20px}}@media (min-width: 48em){.x-small .duet-card-heading{padding:10px 20px 11px !important;margin:-20px -20px 20px}}.medium .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.medium .duet-card-heading{padding:15px 28px 16px !important;margin:-28px -28px 20px}}@media (min-width: 48em){.medium .duet-card-heading{padding:19px 36px 20px !important;margin:-36px -36px 28px}}.large .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.large .duet-card-heading{padding:19px 36px 20px !important;margin:-36px -36px 28px}}@media (min-width: 48em){.large .duet-card-heading{padding:26px 48px 27px !important;margin:-48px -48px 36px}}.x-large .duet-card-heading{margin:-20px -20px 20px}@media (min-width: 36em){.x-large .duet-card-heading{padding:26px 48px 27px !important;margin:-48px -48px 36px}}@media (min-width: 48em){.x-large .duet-card-heading{padding:39px 72px 40px !important;margin:-72px -72px 48px}}.none .duet-card-heading{padding:0 0 20px !important;margin:0 0 20px}.duet-card-footer{padding:20px;margin:20px -20px -20px;font-size:0.875rem;line-height:1.25;background:#f5f8fa;border-bottom-right-radius:4px;border-bottom-left-radius:4px}.duet-theme-turva .duet-card-footer{background:#f5f5f7}@media (min-width: 36em){.duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){.duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 36em){.x-small .duet-card-footer{padding:15px 28px 16px !important;padding-left:20px !important;margin:20px -20px -20px}}@media (min-width: 36em){.medium .duet-card-footer{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){.medium .duet-card-footer{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 36em){.large .duet-card-footer{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 48em){.large .duet-card-footer{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 36em){.x-large .duet-card-footer{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 48em){.x-large .duet-card-footer{padding:39px 72px 40px !important;margin:48px -72px -72px}}.none .duet-card-footer{padding:12px 0 !important;margin:20px 0 0}.duet-card-content{width:100%}.duet-card-collapsed .duet-card-content{display:none}.duet-card-caret{position:relative;top:6px;align-self:flex-start;transition:300ms ease}[aria-expanded=false] .duet-card-caret{transform:rotate(-180deg)}.duet-card-image-mask{position:relative;width:calc(100% + 40px);margin:-20px 0 20px -20px;overflow:hidden;border-top-left-radius:4px;border-top-right-radius:4px}@media (min-width: 36em){.small .duet-card-image-mask{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 36em){.medium .duet-card-image-mask{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 48em){.medium .duet-card-image-mask{width:calc(100% + 72px);margin:-36px 0 28px -36px}}@media (min-width: 36em){.large .duet-card-image-mask{width:calc(100% + 72px);margin:-36px 0 36px -36px}}@media (min-width: 48em){.large .duet-card-image-mask{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 36em){.x-large .duet-card-image-mask{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 48em){.x-large .duet-card-image-mask{width:calc(100% + 144px);margin:-72px 0 36px -72px}}.none .duet-card-image-mask{width:100%;margin:0 0 20px}.duet-card-image{display:block;width:102%;min-width:1px;max-width:102%;height:auto;min-height:1px;margin-left:-1%;transition:transform 300ms ease;transform:scale(1.0001)}a.duet-card{transition:box-shadow 300ms ease, background-position 300ms ease}a.duet-card:hover{box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(0, 41, 77, 0.1)}a.duet-card:hover .duet-card-image{transform:scale(1.024)}.duet-theme-turva a.duet-card:hover{box-shadow:0 2px 6px 0 rgba(117, 117, 117, 0.13), 0 -1px 0 0 rgba(0, 0, 0, 0.09), -1px 0 0 0 rgba(0, 0, 0, 0.07), 1px 0 0 0 rgba(0, 0, 0, 0.07), 0 1px 0 0 rgba(0, 0, 0, 0.07), 0 2px 10px 0 rgba(117, 117, 117, 0.15)}a.duet-card:active{transition:none;transform:translateY(1px)}";
 
 let DuetCard$1 = class extends HTMLElement {
   constructor() {
@@ -2607,7 +2624,7 @@ let DuetCard$1 = class extends HTMLElement {
     this.hasFooter = !!this.element.querySelector("[slot='footer']");
   }
   renderHeading() {
-    const HeadingTag = sanitizeString(this.headingLevel);
+    const HeadingTag = sanitizeString$1(this.headingLevel);
     const headingProps = this.collapsible
       ? {
         role: "button",
@@ -2618,7 +2635,7 @@ let DuetCard$1 = class extends HTMLElement {
         onKeyDown: this.handleKeyDown,
       }
       : {};
-    return (h$1(HeadingTag, Object.assign({ class: "duet-card-heading" }, headingProps), h$1("div", { class: "duet-card-heading-grid" }, this.icon && (h$1(Fragment, null, h$1("duet-icon", { class: "duet-card-icon", name: this.icon, size: "medium", margin: "none", color: "currentColor" }), h$1("duet-spacer", { direction: "horizontal", size: "small" }))), h$1("div", { class: "expand duet-card-heading-text" }, this.heading), this.secondaryHeading && (h$1(Fragment, null, h$1("duet-spacer", { direction: "horizontal", size: "small" }), h$1("div", { class: "duet-card-secondary-heading" }, this.secondaryHeading))), this.collapsible && (h$1(Fragment, null, h$1("duet-spacer", { direction: "horizontal", size: "small" }), h$1("duet-icon", { class: "duet-card-caret", icon: actionArrowUp.svg, size: "small", margin: "none", color: "currentColor" }))))));
+    return (h$1(HeadingTag, Object.assign({ class: "duet-card-heading" }, headingProps), h$1("div", { class: "duet-card-heading-grid" }, this.icon && (h$1(Fragment, null, h$1("duet-icon", { class: "duet-card-icon", name: this.icon, size: "medium", margin: "none", color: "currentColor" }), h$1("duet-spacer", { direction: "horizontal", size: "small" }))), h$1("div", { class: "duet-card-heading-text" }, this.heading), this.collapsible && (h$1(Fragment, null, h$1("duet-spacer", { direction: "horizontal", size: "small" }), h$1("duet-icon", { class: "duet-card-caret", icon: actionArrowUp.svg, size: "small", margin: "none", color: "currentColor" })))), this.secondaryHeading && h$1("div", { class: "duet-card-secondary-heading" }, this.secondaryHeading)));
   }
   /**
    * Sets focus on the specified `duet-card`. Use this method instead of the global
@@ -3055,7 +3072,7 @@ const findCheckedOption = (el, tagName) => {
   return options.find((o) => o.checked === true);
 };
 
-const duetChoiceGroupCss = "*.sc-duet-choice-group,*.sc-duet-choice-group::after,*.sc-duet-choice-group::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-choice-group-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{display:block}@media (min-width: 48em){.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{display:flex}}.horizontal.sc-duet-choice-group-h .duet-choice-group.duet-no-stacking.sc-duet-choice-group{display:flex}.duet-choice-group.sc-duet-choice-group{position:relative;width:100%;margin-bottom:-12px}";
+const duetChoiceGroupCss = "*.sc-duet-choice-group,*.sc-duet-choice-group::after,*.sc-duet-choice-group::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-choice-group-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{display:block}@media (min-width: 48em){.horizontal.sc-duet-choice-group-h .duet-choice-group.sc-duet-choice-group{display:flex;margin-bottom:0}}.horizontal.sc-duet-choice-group-h .duet-choice-group.duet-no-stacking.sc-duet-choice-group{display:flex}.duet-choice-group.sc-duet-choice-group{position:relative;width:100%;margin-bottom:-12px}";
 
 let DuetChoiceGroup$1 = class extends HTMLElement {
   constructor() {
@@ -3771,7 +3788,7 @@ let DuetCollapsible$1 = class extends HTMLElement {
    * Always the last one in the class.
    */
   render() {
-    const HeadingTagName = this.headingLevel ? sanitizeString(this.headingLevel) : "div";
+    const HeadingTagName = this.headingLevel ? sanitizeString$1(this.headingLevel) : "div";
     return (h$1(Host, { class: { "duet-m-0": this.margin === "none" } }, h$1(HeadingTagName, { class: {
         "duet-collapsible-heading": true,
         "duet-theme-turva": this.theme === "turva",
@@ -4355,7 +4372,7 @@ const DatePickerMonth = ({ selectedDate, focusedDate, labelledById, theme, langu
         } }))))))))));
 };
 
-const duetDatePickerCss = "*.sc-duet-date-picker,*.sc-duet-date-picker::after,*.sc-duet-date-picker::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-date-picker-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;position:relative;display:inline-flex;width:100%;min-width:calc(33.333% - 8px);max-width:100%;text-align:left;vertical-align:bottom}.sc-duet-date-picker-h:last-child,.sc-duet-date-picker-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-date-picker-h{width:calc(50% - 16px - 3px)}}.duet-expand.sc-duet-date-picker-h{width:100% !important}.duet-m-0.sc-duet-date-picker-h{margin:0 !important}.duet-date.sc-duet-date-picker{position:relative;width:100%}.duet-date.sc-duet-date-picker button.sc-duet-date-picker,.duet-date-dialog.sc-duet-date-picker button.sc-duet-date-picker{max-width:initial !important;min-height:initial !important;padding:0 !important;margin:0 !important;transition:initial}.duet-date-button.sc-duet-date-picker{-webkit-user-select:none;user-select:none;position:absolute;top:1px;right:1px;z-index:200;display:flex;align-items:center;justify-content:center;width:48px;height:calc(100% - 2px);color:#00294d;cursor:pointer;background:transparent !important;border-left:1px solid #cfd2d4 !important;border-radius:0 4px 4px 0 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-button.sc-duet-date-picker{color:#171c3a;border-color:#cfcfd1}.duet-date-button.sc-duet-date-picker::before{position:absolute;top:0;left:-6px;width:6px;height:100%;content:\"\";background:linear-gradient(to left, rgba(207, 210, 212, 0.2) 0%, rgba(207, 210, 212, 0.2) 1px, rgba(207, 210, 212, 0.1) 1px, rgba(207, 210, 212, 0) 100%)}.duet-date-button.sc-duet-date-picker:disabled{pointer-events:none;cursor:default;background:#f5f8fa !important;border:0 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-button.sc-duet-date-picker:disabled{background:#f5f5f7 !important}.duet-date-button.sc-duet-date-picker:disabled::before{display:none}.duet-date-button.sc-duet-date-picker:disabled duet-icon.sc-duet-date-picker{opacity:0.4}.duet-date-button.sc-duet-date-picker duet-icon.sc-duet-date-picker{transform:translateY(-1px)}.duet-date-button.sc-duet-date-picker:active duet-icon.sc-duet-date-picker{transform:translateY(0)}.duet-date-button.sc-duet-date-picker:focus{color:#0077b3;border-color:transparent;outline:0;box-shadow:0 0 0 2px #0077b3}.duet-theme-turva.sc-duet-date-picker .duet-date-button.sc-duet-date-picker:focus{color:#171c3a;box-shadow:0 0 0 2px #171c3a}.duet-date-dialog.sc-duet-date-picker{position:absolute;top:100%;left:0;z-index:900;display:flex;width:100%;visibility:hidden;opacity:0;transition:transform 300ms ease, opacity 300ms ease, visibility 300ms ease;transform:scale(0.96) translateZ(0) translateY(-20px);transform-origin:top right}@media (min-width: 36em){.duet-date-dialog.left.sc-duet-date-picker{right:0;left:auto;width:auto}}@media (max-width: 35.9375em){.duet-date-dialog.sc-duet-date-picker{position:fixed;top:0;right:0;bottom:0;background:rgba(0, 41, 77, 0.75);transition:opacity 400ms ease, visibility 400ms ease;transform:translateZ(0);transform-origin:bottom center}.duet-date-dialog.duet-theme-turva.sc-duet-date-picker{background:rgba(23, 28, 58, 0.75)}}.duet-date-dialog.active.sc-duet-date-picker{visibility:visible;opacity:1;transition-property:transform, opacity;transform:scale(1.0001) translateZ(0) translateY(0)}@media (min-width: 36em){.duet-date-dialog.error.sc-duet-date-picker{top:calc(100% - 28px);margin-top:4px}}.duet-date-dialog-wrapper.sc-duet-date-picker{position:relative;z-index:600;width:100%;min-width:290px;max-width:310px;padding:16px 16px 20px;margin-top:8px;margin-left:auto;background:white;border:1px solid #e1e3e6;border-radius:4px;box-shadow:0 4px 10px 0 rgba(0, 41, 77, 0.15);transform:none}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-wrapper.sc-duet-date-picker{border-color:#e4e4e6}@media (max-width: 35.9375em){.duet-date-dialog-wrapper.sc-duet-date-picker{position:absolute;bottom:0;left:0;z-index:900;max-width:none;min-height:25em;padding:0 8% 20px;margin:0;visibility:hidden;border:0;border-radius:0;border-top-left-radius:4px;border-top-right-radius:4px;opacity:0;transition:transform 400ms ease, opacity 400ms ease, visibility 400ms ease;transform:translateZ(0) translateY(100%)}.active.sc-duet-date-picker .duet-date-dialog-wrapper.sc-duet-date-picker{visibility:visible;opacity:1;transition-property:transform, opacity;transform:translateZ(0) translateY(0)}}.duet-date-table.sc-duet-date-picker{width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.25;color:#00294d;text-align:center;border-spacing:0;border-collapse:collapse}.duet-date-table.duet-theme-turva.sc-duet-date-picker{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}.duet-date-table.sc-duet-date-picker th.sc-duet-date-picker{padding-bottom:8px;font-size:0.75rem;font-weight:600;line-height:1.25;text-decoration:none;text-transform:uppercase;letter-spacing:1px}.duet-date-table.sc-duet-date-picker .duet-date-table-cell.sc-duet-date-picker{text-align:center}.duet-date-table-button.sc-duet-date-picker{position:relative;z-index:100;display:inline-block !important;width:36.9230769231px !important;height:36.9230769231px !important;min-height:initial !important;padding:0 !important;margin:0 !important;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.25 !important;color:#00294d !important;text-align:center;vertical-align:initial !important;cursor:pointer;background:transparent !important;border-radius:50% !important;transition:initial !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\" !important;color:#171c3a !important}.duet-date-table-button.sc-duet-date-picker:hover{background:#e6f2f8 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker:hover{background:#f9e6ea !important}.duet-date-table-button.today.sc-duet-date-picker{z-index:200;color:#004d80 !important;background:#f3f9fc !important;box-shadow:0 0 0 1px #0077b3 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.today.sc-duet-date-picker{color:#940925 !important;background:#fcf3f4 !important;box-shadow:0 0 0 1px #c60c30 !important}.duet-date-table-button[aria-pressed=true].sc-duet-date-picker,.duet-date-table-button.sc-duet-date-picker:focus{color:white !important;background:#0077b3 !important;outline:0}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button[aria-pressed=true].sc-duet-date-picker,.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker:focus{color:white !important;background:#c60c30 !important}.duet-date-table-button.sc-duet-date-picker:active{z-index:200;color:white !important;background:#0077b3 !important;box-shadow:0 0 5px #0077b3 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker:active{color:white !important;background:#c60c30 !important;box-shadow:0 0 5px #c60c30 !important}.duet-date-table-button.sc-duet-date-picker:focus{z-index:200;box-shadow:0 0 5px #0077b3 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker:focus{box-shadow:0 0 5px #c60c30 !important}.duet-date-table-button.disabled.sc-duet-date-picker{color:#909599 !important;cursor:default;background:transparent !important;box-shadow:none !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.disabled.sc-duet-date-picker{color:#747475 !important;background:transparent !important;box-shadow:none !important}.duet-date-table-button.outside.sc-duet-date-picker{color:#909599 !important;pointer-events:none;cursor:default;background:#f5f8fa !important;box-shadow:none;opacity:0.75}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.outside.sc-duet-date-picker{color:#747475;background:#f5f5f7;box-shadow:none}.duet-date-dialog-header.sc-duet-date-picker{margin-bottom:16px !important;display:flex;align-items:center;justify-content:space-between;width:100%}.duet-date-dialog-buttons.sc-duet-date-picker{white-space:nowrap}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-height:auto !important;padding:0 !important;margin:0 0 0 8px !important;color:#00294d;cursor:pointer;background:#f5f8fa;border-radius:50%;transition:background-color 300ms ease !important}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker{color:#171c3a;background:#f5f5f7}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker duet-icon.sc-duet-date-picker{display:block}@media (max-width: 35.9375em){.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker{width:40px;height:40px}}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:not(:disabled):hover{background:#e9ecee !important}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:not(:disabled):hover{background:#e9e9eb !important}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:focus{outline:0;box-shadow:0 0 0 2px #0077b3}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:focus{box-shadow:0 0 0 2px #171c3a}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:active:focus{background:#dddfe1;box-shadow:none}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:active:focus{background:#ddddde}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:disabled{color:#909599;cursor:default;background:#f5f8fa;opacity:0.75}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:disabled{color:#747475;background:#f5f5f7}.duet-date-dialog-select.sc-duet-date-picker{position:relative;display:inline-flex;margin-top:4px}.duet-date-dialog-select.sc-duet-date-picker .duet-date-dialog-select-label.sc-duet-date-picker{position:relative;z-index:1;display:flex;align-items:center;width:100%;padding:0 8px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1.25rem;font-weight:600;line-height:1.25;color:#00294d;pointer-events:none;border-radius:4px}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-select.sc-duet-date-picker .duet-date-dialog-select-label.sc-duet-date-picker{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}.duet-date-dialog-select.sc-duet-date-picker span.sc-duet-date-picker{margin-right:4px}.duet-date-dialog-select.sc-duet-date-picker select.sc-duet-date-picker{position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;font-size:1rem;cursor:pointer;opacity:0}.duet-date-dialog-select.sc-duet-date-picker select.sc-duet-date-picker:focus+.duet-date-dialog-select-label.sc-duet-date-picker{box-shadow:0 0 0 2px #0077b3}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-select.sc-duet-date-picker select.sc-duet-date-picker:focus+.duet-date-dialog-select-label.sc-duet-date-picker{box-shadow:0 0 0 2px #171c3a}.duet-date-dialog-mobile-header.sc-duet-date-picker{position:relative;display:flex;align-items:center;justify-content:space-between;width:120%;padding:12px 20px;margin-bottom:20px;margin-left:-10%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid #cfd2d4}@media (min-width: 36em){.duet-date-dialog-mobile-header.sc-duet-date-picker{position:absolute;top:-8px;right:-8px;width:auto;padding:0;margin:0;overflow:visible;border:0}}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-mobile-header.sc-duet-date-picker{border-color:#cfcfd1}.duet-date-dialog-mobile-header.sc-duet-date-picker duet-label.sc-duet-date-picker{display:inline-block;max-width:84%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 36em){.duet-date-dialog-mobile-header.sc-duet-date-picker duet-label.sc-duet-date-picker{display:none}}.duet-date-picker-close.sc-duet-date-picker{display:flex;align-items:center;justify-content:center;width:24px;height:24px !important;padding:0 !important;color:#00294d !important;cursor:pointer;background:#f5f8fa !important;border-radius:50%;-webkit-appearance:none;appearance:none}@media (min-width: 36em){.duet-date-picker-close.sc-duet-date-picker{opacity:0}}.duet-theme-turva.sc-duet-date-picker .duet-date-picker-close.sc-duet-date-picker{background:#f5f5f7 !important}.duet-date-picker-close.sc-duet-date-picker:hover{background:#f5f8fa !important}.duet-theme-turva.sc-duet-date-picker .duet-date-picker-close.sc-duet-date-picker:hover{background:#f5f5f7 !important}.duet-date-picker-close.sc-duet-date-picker:focus{outline:none;box-shadow:0 0 0 2px #0077b3}@media (min-width: 36em){.duet-date-picker-close.sc-duet-date-picker:focus{opacity:1}}.duet-theme-turva.sc-duet-date-picker .duet-date-picker-close.sc-duet-date-picker:focus{box-shadow:0 0 0 2px #171c3a}";
+const duetDatePickerCss = "*.sc-duet-date-picker,*.sc-duet-date-picker::after,*.sc-duet-date-picker::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-date-picker-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;position:relative;display:inline-flex;width:100%;min-width:calc(33.333% - 8px);max-width:100%;text-align:left;vertical-align:top}.sc-duet-date-picker-h:last-child,.sc-duet-date-picker-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-date-picker-h{width:calc(50% - 16px - 3px)}}.duet-expand.sc-duet-date-picker-h{width:100% !important}.duet-m-0.sc-duet-date-picker-h{margin:0 !important}.duet-date.sc-duet-date-picker{position:relative;width:100%}.duet-date.sc-duet-date-picker button.sc-duet-date-picker,.duet-date-dialog.sc-duet-date-picker button.sc-duet-date-picker{max-width:initial !important;min-height:initial !important;padding:0 !important;margin:0 !important;transition:initial}.duet-date-button.sc-duet-date-picker{-webkit-user-select:none;user-select:none;position:absolute;top:1px;right:1px;z-index:200;display:flex;align-items:center;justify-content:center;width:48px;height:calc(100% - 2px);color:#00294d;cursor:pointer;background:transparent !important;border-left:1px solid #cfd2d4 !important;border-radius:0 4px 4px 0 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-button.sc-duet-date-picker{color:#171c3a;border-color:#cfcfd1}.duet-date-button.sc-duet-date-picker::before{position:absolute;top:0;left:-6px;width:6px;height:100%;content:\"\";background:linear-gradient(to left, rgba(207, 210, 212, 0.2) 0%, rgba(207, 210, 212, 0.2) 1px, rgba(207, 210, 212, 0.1) 1px, rgba(207, 210, 212, 0) 100%)}.duet-date-button.sc-duet-date-picker:disabled{pointer-events:none;cursor:default;background:#f5f8fa !important;border:0 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-button.sc-duet-date-picker:disabled{background:#f5f5f7 !important}.duet-date-button.sc-duet-date-picker:disabled::before{display:none}.duet-date-button.sc-duet-date-picker:disabled duet-icon.sc-duet-date-picker{opacity:0.4}.duet-date-button.sc-duet-date-picker duet-icon.sc-duet-date-picker{transform:translateY(-1px)}.duet-date-button.sc-duet-date-picker:active duet-icon.sc-duet-date-picker{transform:translateY(0)}.duet-date-button.sc-duet-date-picker:focus{color:#0077b3;border-color:transparent;outline:0;box-shadow:0 0 0 2px #0077b3}.duet-theme-turva.sc-duet-date-picker .duet-date-button.sc-duet-date-picker:focus{color:#171c3a;box-shadow:0 0 0 2px #171c3a}.duet-date-dialog.sc-duet-date-picker{position:absolute;top:100%;left:0;z-index:900;display:flex;width:100%;visibility:hidden;opacity:0;transition:transform 300ms ease, opacity 300ms ease, visibility 300ms ease;transform:scale(0.96) translateZ(0) translateY(-20px);transform-origin:top right}@media (min-width: 36em){.duet-date-dialog.left.sc-duet-date-picker{right:0;left:auto;width:auto}}@media (max-width: 35.9375em){.duet-date-dialog.sc-duet-date-picker{position:fixed;top:0;right:0;bottom:0;background:rgba(0, 41, 77, 0.75);transition:opacity 400ms ease, visibility 400ms ease;transform:translateZ(0);transform-origin:bottom center}.duet-date-dialog.duet-theme-turva.sc-duet-date-picker{background:rgba(23, 28, 58, 0.75)}}.duet-date-dialog.active.sc-duet-date-picker{visibility:visible;opacity:1;transition-property:transform, opacity;transform:scale(1.0001) translateZ(0) translateY(0)}@media (min-width: 36em){.duet-date-dialog.error.sc-duet-date-picker{top:calc(100% - 28px);margin-top:4px}}.duet-date-dialog-wrapper.sc-duet-date-picker{position:relative;z-index:600;width:100%;min-width:290px;max-width:310px;padding:16px 16px 20px;margin-top:8px;margin-left:auto;background:white;border:1px solid #e1e3e6;border-radius:4px;box-shadow:0 4px 10px 0 rgba(0, 41, 77, 0.15);transform:none}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-wrapper.sc-duet-date-picker{border-color:#e4e4e6}@media (max-width: 35.9375em){.duet-date-dialog-wrapper.sc-duet-date-picker{position:absolute;bottom:0;left:0;z-index:900;max-width:none;min-height:25em;padding:0 8% 20px;margin:0;visibility:hidden;border:0;border-radius:0;border-top-left-radius:4px;border-top-right-radius:4px;opacity:0;transition:transform 400ms ease, opacity 400ms ease, visibility 400ms ease;transform:translateZ(0) translateY(100%)}.active.sc-duet-date-picker .duet-date-dialog-wrapper.sc-duet-date-picker{visibility:visible;opacity:1;transition-property:transform, opacity;transform:translateZ(0) translateY(0)}}.duet-date-table.sc-duet-date-picker{width:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.25;color:#00294d;text-align:center;border-spacing:0;border-collapse:collapse}.duet-date-table.duet-theme-turva.sc-duet-date-picker{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}.duet-date-table.sc-duet-date-picker th.sc-duet-date-picker{padding-bottom:8px;font-size:0.75rem;font-weight:600;line-height:1.25;text-decoration:none;text-transform:uppercase;letter-spacing:1px}.duet-date-table.sc-duet-date-picker .duet-date-table-cell.sc-duet-date-picker{text-align:center}.duet-date-table-button.sc-duet-date-picker{position:relative;z-index:100;display:inline-block !important;width:36.9230769231px !important;height:36.9230769231px !important;min-height:initial !important;padding:0 !important;margin:0 !important;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;font-variant-numeric:tabular-nums;line-height:1.25 !important;color:#00294d !important;text-align:center;vertical-align:initial !important;cursor:pointer;background:transparent !important;border-radius:50% !important;transition:initial !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\" !important;color:#171c3a !important}.duet-date-table-button.sc-duet-date-picker:hover{background:#e6f2f8 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker:hover{background:#f9e6ea !important}.duet-date-table-button.today.sc-duet-date-picker{z-index:200;color:#004d80 !important;background:#f3f9fc !important;box-shadow:0 0 0 1px #0077b3 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.today.sc-duet-date-picker{color:#940925 !important;background:#fcf3f4 !important;box-shadow:0 0 0 1px #c60c30 !important}.duet-date-table-button[aria-pressed=true].sc-duet-date-picker,.duet-date-table-button.sc-duet-date-picker:focus{color:white !important;background:#0077b3 !important;outline:0}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button[aria-pressed=true].sc-duet-date-picker,.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker:focus{color:white !important;background:#c60c30 !important}.duet-date-table-button.sc-duet-date-picker:active{z-index:200;color:white !important;background:#0077b3 !important;box-shadow:0 0 5px #0077b3 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker:active{color:white !important;background:#c60c30 !important;box-shadow:0 0 5px #c60c30 !important}.duet-date-table-button.sc-duet-date-picker:focus{z-index:200;box-shadow:0 0 5px #0077b3 !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.sc-duet-date-picker:focus{box-shadow:0 0 5px #c60c30 !important}.duet-date-table-button.disabled.sc-duet-date-picker{color:#909599 !important;cursor:default;background:transparent !important;box-shadow:none !important}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.disabled.sc-duet-date-picker{color:#747475 !important;background:transparent !important;box-shadow:none !important}.duet-date-table-button.outside.sc-duet-date-picker{color:#909599 !important;pointer-events:none;cursor:default;background:#f5f8fa !important;box-shadow:none;opacity:0.75}.duet-theme-turva.sc-duet-date-picker .duet-date-table-button.outside.sc-duet-date-picker{color:#747475;background:#f5f5f7;box-shadow:none}.duet-date-dialog-header.sc-duet-date-picker{margin-bottom:16px !important;display:flex;align-items:center;justify-content:space-between;width:100%}.duet-date-dialog-buttons.sc-duet-date-picker{white-space:nowrap}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-height:auto !important;padding:0 !important;margin:0 0 0 8px !important;color:#00294d;cursor:pointer;background:#f5f8fa;border-radius:50%;transition:background-color 300ms ease !important}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker{color:#171c3a;background:#f5f5f7}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker duet-icon.sc-duet-date-picker{display:block}@media (max-width: 35.9375em){.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker{width:40px;height:40px}}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:not(:disabled):hover{background:#e9ecee !important}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:not(:disabled):hover{background:#e9e9eb !important}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:focus{outline:0;box-shadow:0 0 0 2px #0077b3}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:focus{box-shadow:0 0 0 2px #171c3a}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:active:focus{background:#dddfe1;box-shadow:none}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:active:focus{background:#ddddde}.duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:disabled{color:#909599;cursor:default;background:#f5f8fa;opacity:0.75}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-buttons.sc-duet-date-picker button.sc-duet-date-picker:disabled{color:#747475;background:#f5f5f7}.duet-date-dialog-select.sc-duet-date-picker{position:relative;display:inline-flex;margin-top:4px}.duet-date-dialog-select.sc-duet-date-picker .duet-date-dialog-select-label.sc-duet-date-picker{position:relative;z-index:1;display:flex;align-items:center;width:100%;padding:0 8px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1.25rem;font-weight:600;line-height:1.25;color:#00294d;pointer-events:none;border-radius:4px}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-select.sc-duet-date-picker .duet-date-dialog-select-label.sc-duet-date-picker{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}.duet-date-dialog-select.sc-duet-date-picker span.sc-duet-date-picker{margin-right:4px}.duet-date-dialog-select.sc-duet-date-picker select.sc-duet-date-picker{position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;font-size:1rem;cursor:pointer;opacity:0}.duet-date-dialog-select.sc-duet-date-picker select.sc-duet-date-picker:focus+.duet-date-dialog-select-label.sc-duet-date-picker{box-shadow:0 0 0 2px #0077b3}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-select.sc-duet-date-picker select.sc-duet-date-picker:focus+.duet-date-dialog-select-label.sc-duet-date-picker{box-shadow:0 0 0 2px #171c3a}.duet-date-dialog-mobile-header.sc-duet-date-picker{position:relative;display:flex;align-items:center;justify-content:space-between;width:120%;padding:12px 20px;margin-bottom:20px;margin-left:-10%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid #cfd2d4}@media (min-width: 36em){.duet-date-dialog-mobile-header.sc-duet-date-picker{position:absolute;top:-8px;right:-8px;width:auto;padding:0;margin:0;overflow:visible;border:0}}.duet-theme-turva.sc-duet-date-picker .duet-date-dialog-mobile-header.sc-duet-date-picker{border-color:#cfcfd1}.duet-date-dialog-mobile-header.sc-duet-date-picker duet-label.sc-duet-date-picker{display:inline-block;max-width:84%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width: 36em){.duet-date-dialog-mobile-header.sc-duet-date-picker duet-label.sc-duet-date-picker{display:none}}.duet-date-picker-close.sc-duet-date-picker{display:flex;align-items:center;justify-content:center;width:24px;height:24px !important;padding:0 !important;color:#00294d !important;cursor:pointer;background:#f5f8fa !important;border-radius:50%;-webkit-appearance:none;appearance:none}@media (min-width: 36em){.duet-date-picker-close.sc-duet-date-picker{opacity:0}}.duet-theme-turva.sc-duet-date-picker .duet-date-picker-close.sc-duet-date-picker{background:#f5f5f7 !important}.duet-date-picker-close.sc-duet-date-picker:hover{background:#f5f8fa !important}.duet-theme-turva.sc-duet-date-picker .duet-date-picker-close.sc-duet-date-picker:hover{background:#f5f5f7 !important}.duet-date-picker-close.sc-duet-date-picker:focus{outline:none;box-shadow:0 0 0 2px #0077b3}@media (min-width: 36em){.duet-date-picker-close.sc-duet-date-picker:focus{opacity:1}}.duet-theme-turva.sc-duet-date-picker .duet-date-picker-close.sc-duet-date-picker:focus{box-shadow:0 0 0 2px #171c3a}";
 
 let DuetDatePicker$1 = class extends HTMLElement {
   constructor() {
@@ -4397,11 +4414,27 @@ let DuetDatePicker$1 = class extends HTMLElement {
      * Controls the margin of the component.
      */
     this.margin = "auto";
+    /**
+     * The currently active language. This setting changes the month/year/day
+     * names and button labels as well as all screen reader labels.
+     * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
+     * @default "fi"
+     */
+    this.language = getLanguage();
+    /**
+     * Placeholder defaults
+     * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
+     */
+    this.placeholderDefaults = {
+      fi: "pp.kk.vvvv",
+      en: "dd.mm.yyyy",
+      sv: "dd.mm.åååå",
+    };
     /**
      * Hint text to display before the user types into the date picker input.
      * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
      */
-    this.placeholder = getLocaleString({ fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" });
+    this.placeholder = getLocaleString(this.placeholderDefaults, this.language);
     /**
      * If form input field has a placeholder text, and user types anything (causing the text to dissapear),
      * settings this to true will "echo" it into the caption slot - this option will be false by default for the next few versions, but will eventually be true by default (scheduled for 4.30.0)
@@ -4412,13 +4445,6 @@ let DuetDatePicker$1 = class extends HTMLElement {
      * interact with the input, and conveys its inactive state to assistive technologies.
      */
     this.disabled = false;
-    /**
-     * The currently active language. This setting changes the month/year/day
-     * names and button labels as well as all screen reader labels.
-     * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing
-     * @default "fi"
-     */
-    this.language = getLanguage();
     /**
      * Display the date picker input in error state along with an error message.
      */
@@ -4951,7 +4977,7 @@ let DuetFooter$1 = class extends HTMLElement {
      * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
      * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
      */
-    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults);
+    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults, this.language);
     /**
      * Component event handling.
      */
@@ -5414,10 +5440,26 @@ let DuetHeader$1 = class extends HTMLElement {
      */
     this.language = getLanguage();
     /**
-     * Property to change accessibleI18nLabels defaults on the component.
-     * normally you would handle these strings on an application level and override @accessibleI18nLabels when needed
+     * Default strings for accessibleI18nLabels
+     * @default {
+      fi: {
+        skipLabel: "Siirry pääsisältöön",
+        changeLanguage: "Vaihda kieltä",
+        activeLanguage: "Suomi valittuna",
+      },
+      sv: {
+        skipLabel: "Hoppa till huvudinnehåll",
+        changeLanguage: "Ändra Språk",
+        activeLanguage: "Svenska valt",
+      },
+      en: {
+        skipLabel: "Skip to main content",
+        changeLanguage: "Change language",
+        activeLanguage: "English selected",
+      },
+    }
      */
-    this.accessibleI18nLabelsDefault = {
+    this.accessibleI18nLabelsDefaults = {
       fi: {
         skipLabel: "Siirry pääsisältöön",
         changeLanguage: "Vaihda kieltä",
@@ -5454,7 +5496,7 @@ let DuetHeader$1 = class extends HTMLElement {
       },
     }
      */
-    this.accessibleI18nLabels = getLocaleString(this.accessibleI18nLabelsDefault, this.language);
+    this.accessibleI18nLabels = getLocaleString(this.accessibleI18nLabelsDefaults);
     /**
      * Property to change accessibleLabelExternal defaults on the component.
      * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
@@ -5470,7 +5512,7 @@ let DuetHeader$1 = class extends HTMLElement {
      * Property to change accessibleLabel defaults on the component.
      * normally you would handle these strings on an application level and override @accessibleLabel when needed
      */
-    this.accessibleLabelDefault = {
+    this.accessibleLabelDefaults = {
       fi: "Valikko",
       sv: "Meny",
       en: "Menu",
@@ -5484,7 +5526,7 @@ let DuetHeader$1 = class extends HTMLElement {
       en: "Menu",
     }
      */
-    this.accessibleLabel = getLocaleString(this.accessibleLabelDefault);
+    this.accessibleLabel = getLocaleString(this.accessibleLabelDefaults);
     /**
      * URL that the logo link points to.
      */
@@ -5763,7 +5805,7 @@ let DuetHeader$1 = class extends HTMLElement {
   static get style() { return duetHeaderCss; }
 };
 
-const duetHeadingCss = "*,*::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-heading{margin-bottom:16px !important;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-style:normal;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.25;color:#00294d;text-decoration:none;letter-spacing:-0.01rem}@media (min-width: 36em){.duet-heading{margin-bottom:20px !important}}.duet-heading.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\";font-style:italic;font-weight:700;color:#171c3a}.duet-heading.duet-heading-border{padding-bottom:20px;border-bottom:1px solid #e1e3e6}.duet-heading.duet-heading-hyphenate{-webkit-hyphens:auto;hyphens:auto}.duet-heading.h0{font-size:9.4vw}.duet-heading.h0.duet-p-0{padding:0 !important}.duet-heading.h0.duet-m-0{margin:0 !important}@media (max-width: 31.914893617rem){.duet-heading.h0{font-size:3rem}}@media (min-width: 47.8723404255rem){.duet-heading.h0{font-size:4.5rem}}@media (max-width: 22.5em){.duet-heading.h0{font-size:2.25rem}}.duet-heading.h1{font-size:7vw}.duet-heading.h1.duet-p-0{padding:0 !important}.duet-heading.h1.duet-m-0{margin:0 !important}@media (max-width: 32.1428571429rem){.duet-heading.h1{font-size:2.25rem}}@media (min-width: 42.8571428571rem){.duet-heading.h1{font-size:3rem}}@media (max-width: 22.5em){.duet-heading.h1{font-size:1.5rem}}.duet-heading.h2{font-size:5.8vw}.duet-heading.h2.duet-p-0{padding:0 !important}.duet-heading.h2.duet-m-0{margin:0 !important}@media (max-width: 25.8620689655rem){.duet-heading.h2{font-size:1.5rem}}@media (min-width: 38.7931034483rem){.duet-heading.h2{font-size:2.25rem}}@media (max-width: 22.5em){.duet-heading.h2{font-size:1.375rem}}.duet-heading.h3{margin-bottom:12px !important;font-size:4.2vw}.duet-heading.h3.duet-p-0{padding:0 !important}.duet-heading.h3.duet-m-0{margin:0 !important}@media (max-width: 29.7619047619rem){.duet-heading.h3{font-size:1.25rem}}@media (min-width: 35.7142857143rem){.duet-heading.h3{font-size:1.5rem}}.duet-heading.h3.duet-theme-turva{font-style:normal}.duet-heading.h3.duet-heading-border{padding-bottom:20px}.duet-heading.h4{margin-bottom:8px !important;font-size:4vw;letter-spacing:0}.duet-heading.h4.duet-p-0{padding:0 !important}.duet-heading.h4.duet-m-0{margin:0 !important}@media (max-width: 27.5rem){.duet-heading.h4{font-size:1.1rem}}@media (min-width: 31.25rem){.duet-heading.h4{font-size:1.25rem}}.duet-heading.h4.duet-theme-turva{font-style:normal;font-weight:700}.duet-heading.h4.duet-heading-border{padding-bottom:20px}.duet-heading.h5{margin-bottom:8px !important;font-size:4vw;font-weight:600;letter-spacing:0}.duet-heading.h5.duet-p-0{padding:0 !important}.duet-heading.h5.duet-m-0{margin:0 !important}@media (max-width: 27.5rem){.duet-heading.h5{font-size:1.1rem}}@media (min-width: 28.4090909091rem){.duet-heading.h5{font-size:1.1363636364rem}}.duet-heading.h5.duet-theme-turva{font-style:normal;font-weight:700}.duet-heading.h5.duet-heading-border{padding-bottom:16px}.duet-heading.h6{margin-bottom:8px !important;font-size:1rem;font-weight:600;letter-spacing:0}.duet-heading.h6.duet-p-0{padding:0 !important}.duet-heading.h6.duet-m-0{margin:0 !important}.duet-heading.h6.duet-theme-turva{font-style:normal;font-weight:700}.duet-heading.h6.duet-heading-border{padding-bottom:16px}.duet-heading.duet-semibold,.duet-heading.duet-theme-turva.duet-semibold{font-style:normal !important;font-weight:600 !important}";
+const duetHeadingCss = "*,*::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-heading{margin-bottom:16px !important;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-style:normal;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.25;color:#00294d;text-decoration:none;letter-spacing:-0.01rem;word-break:break-word}@media (min-width: 36em){.duet-heading{margin-bottom:20px !important}}.duet-heading.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\";font-style:italic;font-weight:700;color:#171c3a}.duet-heading.duet-heading-border{padding-bottom:20px;border-bottom:1px solid #e1e3e6}.duet-heading.duet-heading-hyphenate{-webkit-hyphens:auto;hyphens:auto}.duet-heading.h0{font-size:9.4vw}.duet-heading.h0.duet-p-0{padding:0 !important}.duet-heading.h0.duet-m-0{margin:0 !important}@media (max-width: 31.914893617rem){.duet-heading.h0{font-size:3rem}}@media (min-width: 47.8723404255rem){.duet-heading.h0{font-size:4.5rem}}@media (max-width: 22.5em){.duet-heading.h0{font-size:2.25rem}}.duet-heading.h1{font-size:7vw}.duet-heading.h1.duet-p-0{padding:0 !important}.duet-heading.h1.duet-m-0{margin:0 !important}@media (max-width: 32.1428571429rem){.duet-heading.h1{font-size:2.25rem}}@media (min-width: 42.8571428571rem){.duet-heading.h1{font-size:3rem}}@media (max-width: 22.5em){.duet-heading.h1{font-size:1.5rem}}.duet-heading.h2{font-size:5.8vw}.duet-heading.h2.duet-p-0{padding:0 !important}.duet-heading.h2.duet-m-0{margin:0 !important}@media (max-width: 25.8620689655rem){.duet-heading.h2{font-size:1.5rem}}@media (min-width: 38.7931034483rem){.duet-heading.h2{font-size:2.25rem}}@media (max-width: 22.5em){.duet-heading.h2{font-size:1.375rem}}.duet-heading.h3{margin-bottom:12px !important;font-size:4.2vw}.duet-heading.h3.duet-p-0{padding:0 !important}.duet-heading.h3.duet-m-0{margin:0 !important}@media (max-width: 29.7619047619rem){.duet-heading.h3{font-size:1.25rem}}@media (min-width: 35.7142857143rem){.duet-heading.h3{font-size:1.5rem}}.duet-heading.h3.duet-theme-turva{font-style:normal}.duet-heading.h3.duet-heading-border{padding-bottom:20px}.duet-heading.h4{margin-bottom:8px !important;font-size:4vw;letter-spacing:0}.duet-heading.h4.duet-p-0{padding:0 !important}.duet-heading.h4.duet-m-0{margin:0 !important}@media (max-width: 27.5rem){.duet-heading.h4{font-size:1.1rem}}@media (min-width: 31.25rem){.duet-heading.h4{font-size:1.25rem}}.duet-heading.h4.duet-theme-turva{font-style:normal;font-weight:700}.duet-heading.h4.duet-heading-border{padding-bottom:20px}.duet-heading.h5{margin-bottom:8px !important;font-size:4vw;font-weight:600;letter-spacing:0}.duet-heading.h5.duet-p-0{padding:0 !important}.duet-heading.h5.duet-m-0{margin:0 !important}@media (max-width: 27.5rem){.duet-heading.h5{font-size:1.1rem}}@media (min-width: 28.4090909091rem){.duet-heading.h5{font-size:1.1363636364rem}}.duet-heading.h5.duet-theme-turva{font-style:normal;font-weight:700}.duet-heading.h5.duet-heading-border{padding-bottom:16px}.duet-heading.h6{margin-bottom:8px !important;font-size:1rem;font-weight:600;letter-spacing:0}.duet-heading.h6.duet-p-0{padding:0 !important}.duet-heading.h6.duet-m-0{margin:0 !important}.duet-heading.h6.duet-theme-turva{font-style:normal;font-weight:700}.duet-heading.h6.duet-heading-border{padding-bottom:16px}.duet-heading.duet-semibold,.duet-heading.duet-theme-turva.duet-semibold{font-style:normal !important;font-weight:600 !important}";
 
 let DuetHeading$1 = class extends HTMLElement {
   constructor() {
@@ -5812,7 +5854,7 @@ let DuetHeading$1 = class extends HTMLElement {
    * Always the last one in the class.
    */
   render() {
-    const TagName = sanitizeString(this.level);
+    const TagName = sanitizeString$1(this.level);
     const color = getColorByName(this.color);
     return (h$1(TagName, { class: {
         "duet-heading": true,
@@ -5899,15 +5941,15 @@ let DuetHero$1 = class extends HTMLElement {
      */
     this.language = getLanguage();
     /**
-     * Property to change accessibleLabelExternal defaults on the component.
-     * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
+     * Defaults for accessibleLabelExternal
+     * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
      */
     this.accessibleLabelExternalDefaults = DuetStringsExternalDefaults;
     /**
      * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
      * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
      */
-    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults, this.language);
+    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults);
     /**
      * URL that the button links to.
      */
@@ -6073,9 +6115,9 @@ const isValid = (elm) => {
 };
 const buildIconUrl = (iconName) => {
   // under normal operations the Icons should always be loaded from the CDN
-  const cdnURI = `https://cdn.duetds.com/api/icons/${"2.2.0"}/lib/assets/${iconName}.svg`;
+  const cdnURI = `https://cdn.duetds.com/api/icons/${"2.2.1"}/lib/assets/${iconName}.svg`;
   // however for vizdiffing and local development / testing we need to be able to access the raw images
-  const localURI = `http://localhost:3334/icons/lib/assets/${iconName}.svg`;
+  const localURI = `http://0.0.0.0:3334/icons/lib/assets/${iconName}.svg`;
   const host = window.location.hostname;
   const re = /(localhost|loca\.lt|127\.0\.0\.1|0\.0\.0\.0)/i;
   if (host.match(re)) {
@@ -6487,7 +6529,7 @@ let DuetInput$1 = class extends HTMLElement {
   static get style() { return duetInputCss; }
 };
 
-const duetLabelCss = "*.sc-duet-label,*.sc-duet-label::after,*.sc-duet-label::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-label-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:12px !important;position:relative;z-index:100;display:inline-flex;width:auto;margin-top:8px !important;line-height:1.25;cursor:default}.duet-p-0.sc-duet-label-h{padding:0 !important}.duet-m-0.sc-duet-label-h{margin:0 !important}.duet-m-0.sc-duet-label-h{margin-bottom:0 !important}.duet-small-margin.sc-duet-label-h{margin-top:8px !important;margin-bottom:4px !important}.duet-has-tooltip.sc-duet-label-h{padding-right:48px}@media (min-width: 48em){.duet-has-tooltip.sc-duet-label-h{padding-right:0}}label.sc-duet-label{margin:0;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 !important;line-height:1.25;color:#00294d;text-align:left}label.sc-duet-label span.sc-duet-label{font-size:1rem;font-weight:600 !important}.duet-label-small.sc-duet-label-h label.sc-duet-label{font-size:0.875rem}.duet-label-small.sc-duet-label-h label.sc-duet-label span.sc-duet-label{font-size:0.875rem}.duet-theme-turva.sc-duet-label-h label.sc-duet-label{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}";
+const duetLabelCss = "*.sc-duet-label,*.sc-duet-label::after,*.sc-duet-label::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-label-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-bottom:12px !important;position:relative;z-index:100;display:inline-flex;width:auto;margin-top:8px !important;line-height:1.25;cursor:default}.duet-p-0.sc-duet-label-h{padding:0 !important}.duet-m-0.sc-duet-label-h{margin:0 !important}.duet-m-0.sc-duet-label-h{margin-bottom:0 !important}.duet-small-margin.sc-duet-label-h{margin-top:8px !important;margin-bottom:4px !important}.duet-has-tooltip.sc-duet-label-h{padding-right:48px}@media (min-width: 48em){.duet-has-tooltip.sc-duet-label-h{padding-right:0}}label.sc-duet-label{margin:0;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 !important;line-height:1.25;color:#00294d;text-align:left;word-break:break-word}label.sc-duet-label span.sc-duet-label{font-size:1rem;font-weight:600 !important;word-break:break-word}.duet-label-small.sc-duet-label-h label.sc-duet-label{font-size:0.875rem}.duet-label-small.sc-duet-label-h label.sc-duet-label span.sc-duet-label{font-size:0.875rem}.duet-theme-turva.sc-duet-label-h label.sc-duet-label{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#171c3a}";
 
 let DuetLabel$1 = class extends HTMLElement {
   constructor() {
@@ -6625,8 +6667,7 @@ let DuetLink$1 = class extends HTMLElement {
      */
     this.language = getLanguage();
     /**
-     * Property to change accessibleLabelExternal defaults on the component.
-     * normally you would handle these strings on an application level and override @accessibleLabelExternal when needed
+     * Defaults for accessibleLabelExternal
      * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
      */
     this.accessibleLabelExternalDefaults = DuetStringsExternalDefaults;
@@ -6634,7 +6675,7 @@ let DuetLink$1 = class extends HTMLElement {
      * Adds accessible label for tooltip that is shown in external link (url & external have both been set)
      * @default {fi: "Avautuu uuteen ikkunaan",sv: "Öppnas i nytt fönster",en: "Opens in a new window"}
      */
-    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults, this.language);
+    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults);
     /**
      * Theme of the button.
      */
@@ -6670,7 +6711,7 @@ let DuetLink$1 = class extends HTMLElement {
         "duet-link": true,
         "duet-link-is-external": this.external,
         "duet-theme-turva": this.theme === "turva",
-      }, target: this.external ? "_blank" : "_self", "aria-label": this.accessibleLabel, id: this.identifier, ref: el => (this.nativeLink = el) }, h$1("slot", null), this.external && (h$1(Fragment, null, h$1("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h$1("span", { class: "duet-link-external" }, h$1("duet-icon", { icon: actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))))));
+      }, target: this.external ? "_blank" : "_self", "aria-label": this.accessibleLabel, id: this.identifier, ref: el => (this.nativeLink = el) }, h$1("slot", null), this.external && (h$1(Fragment, null, h$1("duet-visually-hidden", null, this.accessibleLabelExternal), h$1("span", { class: "duet-link-external" }, h$1("duet-icon", { icon: actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))))));
   }
   static get delegatesFocus() { return true; }
   static get style() { return duetLinkCss; }
@@ -6945,10 +6986,10 @@ let DuetModal$1 = class extends HTMLElement {
      */
     this.language = getLanguage();
     /**
-     * Property to change accessibleCloseLabel defaults on the component.
-     * normally you would handle these strings on an application level and override @accessibleCloseLabel when needed
+     * Defaults for accessibleCloseLabel
+     * @default {fi: "Sulje ikkuna", sv: "Stäng fönstret", en: "Close the dialog", }
      */
-    this.accessibleCloseLabelDefault = {
+    this.accessibleCloseLabelDefaults = {
       fi: "Sulje ikkuna",
       sv: "Stäng fönstret",
       en: "Close the dialog",
@@ -6959,7 +7000,7 @@ let DuetModal$1 = class extends HTMLElement {
      * Swedish translation for this property is “Stäng fönstret”.
      * @default {fi: "Sulje ikkuna", sv: "Stäng fönstret", en: "Close the dialog", }
      */
-    this.accessibleCloseLabel = getLocaleString(this.accessibleCloseLabelDefault);
+    this.accessibleCloseLabel = getLocaleString(this.accessibleCloseLabelDefaults, this.language);
     /**
      * Size of the modal window.
      */
@@ -7224,8 +7265,8 @@ let DuetNotificationDrawer$1 = class extends HTMLElement {
      */
     this.language = getLanguage();
     /**
-     * Property to change accessibleLabelNotifications defaults on the component.
-     * normally you would handle these strings on an application level and override @accessibleLabelNotifications when needed
+     * Defaults for accessibleLabelNotifications
+     * @default {en: "No notifications", fi: "Ei ilmoituksia", sv: "Inga notifikationer"}
      */
     this.accessibleLabelNotificationsDefaults = {
       en: "No notifications",
@@ -7236,7 +7277,7 @@ let DuetNotificationDrawer$1 = class extends HTMLElement {
      * Adds accessible label for tooltip that is shown for notifications
      * @default {en: "No notifications", fi: "Ei ilmoituksia", sv: "Inga notifikationer"}
      */
-    this.accessibleLabelNotifications = getLocaleString(this.accessibleLabelNotificationsDefaults, this.language);
+    this.accessibleLabelNotifications = getLocaleString(this.accessibleLabelNotificationsDefaults);
     /**
      * Show a badge that indicates something has changed.
      */
@@ -7389,37 +7430,52 @@ let DuetNumberInput$1 = class extends HTMLElement {
      */
     this.unit = getLocale(this.language).money;
     /**
-     * Format of message used to announce current amount when switching between amounts.
-     * The string {current} is replaced with the current amount.
+     * Defaults for accessibleLive
      * @default {fi: "{current} euroa valittuna", en: "{current} euros selected", sv: "{current} valda euro"}
      */
-    this.accessibleLive = getLocaleString({
+    this.accessibleLiveDefaults = {
       fi: "{current} euroa valittuna",
       en: "{current} euros selected",
       sv: "{current} euro valt",
-    }, this.language);
+    };
+    /**
+     * Format of message used to announce current amount when switching between amounts.
+     * The string {current} is replaced with the current amount.
+     * @default {fi: "{current} euroa valittuna", en: "{current} euros selected", sv: "{current} valda euro"}
+     */
+    this.accessibleLive = getLocaleString(this.accessibleLiveDefaults, this.language);
     /**
      * Disables the aria-live messaging used internally in this component. This could be useful when you want to use custom aria-live messages instead.
      */
     this.accessibleLiveEnabled = true;
     /**
-     * Accessible label for the add button that is read for screen reader users.
+     * Defaults for accessibleAdd
      * @default {fi: "Lisää summaan", en: "Add to the amount", sv: "Lägg till beloppet"}
      */
-    this.accessibleAdd = getLocaleString({
+    this.accessibleAddDefaults = {
       fi: "Lisää summaan",
       en: "Add to the amount",
       sv: "Lägg till beloppet",
-    }, this.language);
+    };
     /**
-     * Accessible label for the subtract button that is read for screen reader users.
+     * Accessible label for the add button that is read for screen reader users.
+     * @default {fi: "Lisää summaan", en: "Add to the amount", sv: "Lägg till beloppet"}
+     */
+    this.accessibleAdd = getLocaleString(this.accessibleAddDefaults, this.language);
+    /**
+     * Defaults for accessibleSubtract
      * @default {fi: "Vähennä summasta", en: "Subtract from the amount", sv: "Dra från beloppet"}
      */
-    this.accessibleSubtract = getLocaleString({
+    this.accessibleSubtractDefaults = {
       fi: "Vähennä summasta",
       en: "Subtract from the amount",
       sv: "Dra från beloppet",
-    }, this.language);
+    };
+    /**
+     * Accessible label for the subtract button that is read for screen reader users.
+     * @default {fi: "Vähennä summasta", en: "Subtract from the amount", sv: "Dra från beloppet"}
+     */
+    this.accessibleSubtract = getLocaleString(this.accessibleSubtractDefaults, this.language);
     /**
      * Theme of the input.
      */
@@ -7437,14 +7493,19 @@ let DuetNumberInput$1 = class extends HTMLElement {
      */
     this.min = 0;
     /**
-     * Label for the number input.
+     * Defaults for Label
      * @default  {fi: "Etiketti", en: "Label", sv: "Märka"}
      */
-    this.label = getLocaleString({
+    this.labelDefaults = {
       fi: "Nimilappu",
       en: "Label",
       sv: "Etikett",
-    }, this.language);
+    };
+    /**
+     * Label for the number input.
+     * @default  {fi: "Etiketti", en: "Label", sv: "Märka"}
+     */
+    this.label = getLocaleString(this.labelDefaults, this.language);
     /**
      * Visually hide the label, but still show it to screen readers.
      */
@@ -8689,14 +8750,19 @@ let DuetTabGroup$1 = class extends HTMLElement {
      */
     this.language = getLanguage();
     /**
-     * Label for the select element which gets shown on mobile.
+     * Defaults for Label
      * @default {fi: "Valitse", en: "Choose", sv: "Välja"}
      */
-    this.label = getLocaleString({
+    this.labelDefaults = {
       fi: "Valitse",
       en: "Choose",
       sv: "Välj",
-    }, this.language);
+    };
+    /**
+     * Label for the select element which gets shown on mobile.
+     * @default {fi: "Valitse", en: "Choose", sv: "Välja"}
+     */
+    this.label = getLocaleString(this.labelDefaults, this.language);
     /**
      * Determines whether the label for the select element shown on mobile is visually hidden.
      */
@@ -9256,25 +9322,35 @@ let DuetTooltip$1 = class extends HTMLElement {
      */
     this.language = getLanguage();
     /**
-     * Adds accessible label for the info icon that is only shown for screen
-     * readers. This property is always required to create an accessible interface!
+     * Default language strings for the accessibleLabel
      * @default {fi: "Näytä lisätietoja", en: "See more information", sv: "Se mer information"}
      */
-    this.accessibleLabel = getLocaleString({
+    this.accessibleLabelDefault = {
       fi: "Näytä lisätietoja",
       en: "Show more information",
       sv: "Visa mer tilläggsuppgifter",
-    }, this.language);
+    };
     /**
-     * Adds accessible label for the close icon that is only shown for screen
-     * readers. This property is always required to create an accessibly interface!
+     * Adds accessible label for the info icon that is only shown for screen
+     * readers. This property is always required to create an accessible interface!
+     * @default {fi: "Näytä lisätietoja", en: "See more information", sv: "Se mer information"}
+     */
+    this.accessibleLabel = getLocaleString(this.accessibleLabelDefault, this.language);
+    /**
+     * Default language strings for the accessibleCloseLabel
      * @default {fi: "Sulje lisätiedot", en: "Close details", sv: "Stäng detaljer"}
      */
-    this.accessibleCloseLabel = getLocaleString({
+    this.accessibleCloseLabelDefault = {
       fi: "Sulje lisätiedot",
       en: "Close details",
       sv: "Stäng tilläggsuppgifter",
-    }, this.language);
+    };
+    /**
+     * Adds accessible label for the close icon that is only shown for screen
+     * readers. This property is always required to create an accessibly interface!
+     * @default {fi: "Sulje lisätiedot", en: "Close details", sv: "Stäng detaljer"}
+     */
+    this.accessibleCloseLabel = getLocaleString(this.accessibleCloseLabelDefault, this.language);
     /**
      * Label of the tooltip. If used, replaces the accessibleLabel option.
      */
@@ -9469,25 +9545,35 @@ let DuetTray$1 = class extends HTMLElement {
      */
     this.language = getLanguage();
     /**
-     * Accessible label that is shown for screen reader users in the expandable
-     * close toggle. Not visible for normal users.
+     * Defaults for accessibleCloseLabel
      * @default {fi: "Sulje", en: "Close", sv: "Stänga"}
      */
-    this.accessibleCloseLabel = getLocaleString({
+    this.accessibleCloseLabelDefaults = {
       fi: "Sulje",
       en: "Close",
       sv: "Stäng",
-    }, this.language);
+    };
     /**
      * Accessible label that is shown for screen reader users in the expandable
-     * open toggle. Not visible for normal users.
+     * close toggle. Not visible for normal users.
+     * @default {fi: "Sulje", en: "Close", sv: "Stänga"}
+     */
+    this.accessibleCloseLabel = getLocaleString(this.accessibleCloseLabelDefaults, this.language);
+    /**
+     * Defaults for accessibleOpenLabel
      * @default {fi: "Avaa", en: "Open", sv: "Öppen"}
      */
-    this.accessibleOpenLabel = getLocaleString({
+    this.accessibleOpenLabelDefaults = {
       fi: "Avaa",
       en: "Open",
       sv: "Öppna",
-    }, this.language);
+    };
+    /**
+     * Accessible label that is shown for screen reader users in the expandable
+     * open toggle. Not visible for normal users.
+     * @default {fi: "Avaa", en: "Open", sv: "Öppen"}
+     */
+    this.accessibleOpenLabel = getLocaleString(this.accessibleOpenLabelDefaults, this.language);
     /**
      * Theme of the info panel.
      */
@@ -9558,861 +9644,6 @@ let DuetTray$1 = class extends HTMLElement {
   static get style() { return duetTrayCss; }
 };
 
-const formatBytes = (bytes, decimals = 2) => {
-  if (bytes === 0) {
-    return "0 Bytes";
-  }
-  const k = 1024;
-  const dm = decimals < 0 ? 0 : decimals;
-  const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
-  const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
-};
-
-const DuetUploadFileList = ({ data, onDelete, onCancel, getError }) => {
-  if (data.invalid.length === 0 && data.valid.length === 0) {
-    return;
-  }
-  return (h("ol", { class: "duet-upload-filelist" },
-    data.valid.length !== 0 && (h("li", null,
-      h("duet-visually-hidden", null, "Files"),
-      h("ul", null, data.valid.length !== 0 &&
-        data.valid.map(e => (h("li", { class: "duet-upload-file" },
-          h("div", { class: "duet-upload-file-container" },
-            h("div", { class: "duet-upload-file-link" }, e.url ? (h("duet-button", { variation: "plain", icon: "messaging-attachment", url: e.url },
-              e.item.name,
-              " (",
-              formatBytes(e.item.size),
-              ")")) : (`${e.item.name} (${formatBytes(e.item.size)})`)),
-            h("ul", { class: "duet-upload-file-actions", role: "menubar", "aria-label": "file actions" },
-              e.progress < 100 && (h("li", { role: "none" },
-                h("duet-button", { role: "menuitem", variation: "plain", icon: "messaging-declined", "icon-only": true, "icon-size": "large", margin: "none", onClick: ev => onCancel(e.item.name, ev) }))),
-              e.progress === 100 && (h("li", { role: "none" },
-                h("duet-button", { role: "menuitem", variation: "destructive", icon: "action-delete", "icon-only": true, "icon-size": "large", margin: "none", onClick: ev => onDelete(e.item.name, ev) }))))),
-          e.progress < 100 && (h("div", { class: "duet-upload-file-progress" },
-            h("progress", { value: e.progress, max: "100" },
-              h("div", { class: "progress-bar" },
-                h("span", { style: { width: `${e.progress}%;` } },
-                  "Progress: ",
-                  e.progress,
-                  "%"))))))))))),
-    data.invalid.length !== 0 && (h("li", null,
-      h("duet-visually-hidden", null, "Files with Errors"),
-      h("ul", null, data.invalid.map(e => {
-        return (h("li", { class: "duet-upload-file duet-upload-file-errors" },
-          h("div", { class: "duet-upload-file-container" },
-            h("div", { class: "duet-upload-file-link duet-upload-file-link-error" },
-              h("div", null,
-                e.item.name,
-                " (",
-                formatBytes(e.item.size),
-                ")"),
-              h("div", { "data-error-type": e.error.type, "data-error-message": e.error.system_message }, getError(e.error.type))),
-            h("ul", { class: "duet-upload-file-actions", role: "menubar", "aria-label": "file actions" },
-              h("li", { role: "none" },
-                h("duet-button", { role: "menuitem", variation: "destructive", icon: "action-delete", "icon-only": true, "icon-size": "large", margin: "none", onClick: ev => onDelete(e.item.name, ev) }))))));
-      }))))));
-};
-
-const errorcodes = [
-	{
-		type: "default",
-		system_message: "unknown error",
-		message: {
-			fi: "",
-			sv: "",
-			en: "An unknown error occured, please try again"
-		}
-	},
-	{
-		type: "400",
-		system_message: "Bad Request: The server could not understand the request due to invalid syntax.",
-		message: {
-			fi: "",
-			sv: "",
-			en: "The server rejected your file"
-		}
-	},
-	{
-		type: "401",
-		system_message: "Not Authenticated: The client must authenticate itself to get the requested response..",
-		message: {
-			fi: "",
-			sv: "",
-			en: "You need to be logged in to upload files"
-		}
-	},
-	{
-		type: "403",
-		system_message: "No Access: The client does not have access rights to the content;",
-		message: {
-			fi: "",
-			sv: "",
-			en: "You do not have the correct access rights to upload files"
-		}
-	},
-	{
-		type: "413",
-		system_message: "Payload too large",
-		message: {
-			fi: "",
-			sv: "",
-			en: "The file was to large for the server to handle"
-		}
-	},
-	{
-		type: "415",
-		system_message: "Unsupported media type",
-		message: {
-			fi: "",
-			sv: "",
-			en: "The server rejected the file because it had the wrong type"
-		}
-	},
-	{
-		type: "429",
-		system_message: "Too many request from same address",
-		message: {
-			fi: "",
-			sv: "",
-			en: "The server has received to many request from you, please try again later"
-		}
-	},
-	{
-		type: "500",
-		system_message: "Internal Server Error",
-		message: {
-			fi: "",
-			sv: "",
-			en: "The server reported an unknown error and the upload failed"
-		}
-	},
-	{
-		type: "duet-upload-100",
-		system_message: "File extension not allowed",
-		message: {
-			fi: "",
-			sv: "",
-			en: "You cannot upload files with that extension"
-		}
-	},
-	{
-		type: "duet-upload-001",
-		system_message: "File transfer failed",
-		message: {
-			fi: "",
-			sv: "",
-			en: "Your connection to the server was interrupted, try again"
-		}
-	},
-	{
-		type: "duet-upload-101",
-		system_message: "File mimetype not allowed",
-		message: {
-			fi: "",
-			sv: "",
-			en: "You cannot upload files of that type"
-		}
-	},
-	{
-		type: "duet-upload-201",
-		system_message: "File is too large",
-		message: {
-			fi: "",
-			sv: "",
-			en: "The file is larger than permitted"
-		}
-	},
-	{
-		type: "duet-upload-202",
-		system_message: "The combined size of all files is too large",
-		message: {
-			fi: "",
-			sv: "",
-			en: "You have reached the maximum combined filesize"
-		}
-	},
-	{
-		type: "duet-upload-301",
-		system_message: "The maximum file limit has been reached",
-		message: {
-			fi: "Liitteiden maksimimäärä saavutettu.",
-			sv: "",
-			en: "Maximum number of attachments reached."
-		}
-	}
-];
-
-const getError = (code) => {
-  let error = {
-    type: undefined,
-    system_message: undefined,
-    message: undefined,
-  };
-  error = errorcodes.filter(errorItem => {
-    return errorItem.type === code;
-  })[0];
-  if (!error) {
-    error = errorcodes.filter(errorItem => {
-      return errorItem.type === "default";
-    })[0];
-  }
-  return error;
-};
-
-const validateFileExtension = (name, allowedExtensions) => {
-  if (!allowedExtensions) {
-    return true;
-  }
-  const ext = name.split(".");
-  const validExtension = allowedExtensions.split(",");
-  const extension = ext[ext.length - 1];
-  return validExtension.includes(extension);
-};
-const validateFileMime = (type, allowedMimetypes) => {
-  if (!allowedMimetypes || !type) {
-    return true;
-  }
-  const validMimeTypes = allowedMimetypes.split(",");
-  let valid = false;
-  validMimeTypes.forEach(mimeType => {
-    const allowedTypes = mimeType.split("/");
-    const fileType = type.split("/");
-    if (allowedTypes[0] === fileType[0] && (allowedTypes[1] === fileType[1] || allowedTypes[1] === "*")) {
-      valid = true;
-    }
-  });
-  return valid;
-};
-const validateFileSize = (size, maxBytes) => {
-  if (!maxBytes || !size) {
-    return true;
-  }
-  return maxBytes >= size;
-};
-const validateFile = (item, validators) => {
-  const { allowedMimetypes, allowedExtensions, maxBytes } = validators;
-  let valid = false;
-  let errorMessage = getError("default");
-  if (item) {
-    const { name, type, size } = item;
-    const mime = validateFileMime(type, allowedMimetypes);
-    const ext = validateFileExtension(name, allowedExtensions);
-    const bytes = validateFileSize(size, maxBytes);
-    if (!mime) {
-      errorMessage = getError("duet-upload-101");
-    }
-    if (!ext) {
-      errorMessage = getError("duet-upload-100");
-    }
-    if (!bytes) {
-      errorMessage = getError("duet-upload-201");
-    }
-    valid = mime && ext && bytes;
-  }
-  else {
-    valid = false;
-  }
-  return {
-    valid,
-    errorMessage: valid ? undefined : getLocaleString(errorMessage.message),
-    errorSystem: valid ? undefined : errorMessage.system_message,
-    errorType: valid ? undefined : errorMessage.type,
-  };
-};
-const validateTotalSizeIsAboveMax = (filelist, maxTotalBytes) => {
-  let total = 0;
-  if (maxTotalBytes) {
-    filelist.forEach(item => {
-      if (item.valid && item.size) {
-        total += item.size;
-      }
-    });
-    if (total < maxTotalBytes) {
-      return true;
-    }
-  }
-  return false;
-};
-const validateTotalAmountIsAboveMax = (filelist, maxFiles) => {
-  let total = 0;
-  if (maxFiles) {
-    filelist.forEach(item => {
-      if (item.valid) {
-        total++;
-      }
-    });
-    if (total > maxFiles) {
-      return true;
-    }
-  }
-  return false;
-};
-
-const makeXhrRequest = (payload, options, onFailure, onSuccess, onProgress) => {
-  const { type, xhr, uri, argument, headers } = Object.assign({
-    type: "POST",
-    argument: null,
-    headers: null,
-  }, options);
-  xhr.open(type, `${uri}${argument || ""}`, true);
-  const { data, name } = payload;
-  // headers must be added after open
-  if (headers) {
-    Object.keys(headers).forEach(key => {
-      xhr.setRequestHeader(key, headers[key]);
-    });
-  }
-  if (type === "POST") {
-    xhr.onreadystatechange = () => {
-      // Call a function when the state changes.
-      if (xhr.readyState === XMLHttpRequest.DONE && xhr.status >= 200 && xhr.status < 300) {
-        // Request finished without errors
-        onSuccess(xhr, name, xhr.status);
-      }
-      if (xhr.readyState === XMLHttpRequest.DONE && xhr.status >= 300 && xhr.status < 999) {
-        // Request finished with errors
-        onFailure(xhr, name, xhr.status);
-      }
-    };
-    onProgress(name);
-  }
-  xhr.send(data);
-  return xhr;
-};
-
-const duetUploadCss = "*,*::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}:host li{list-style:none}.duet-upload{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.duet-upload li{list-style:none}.duet-upload-file-errors{padding:20px 0;color:#de2362}.duet-upload-filelist{margin-bottom:25px}.duet-upload-filelist-empty{display:flex;align-items:center;justify-content:center;width:100%;height:75px;margin:0 auto;background-color:#f3f9fc}.duet-upload-file{display:flex;flex-flow:column;justify-content:center;min-height:50px;border-bottom:1px solid #e1e3e6}.duet-upload-file:first-of-type:not(.duet-upload-file-errors){border-top:1px solid #e1e3e6}.duet-upload-file-container{display:flex;place-items:center;width:100%}.duet-upload-file-link{display:flex;flex-grow:2;place-items:center}.duet-upload-file-link-error{flex-direction:column;place-items:flex-start}.duet-upload-file-link duet-button{position:relative;top:6px}.duet-upload-file-actions{display:flex;transform:scale(0.8)}.duet-upload-file-progress{}.duet-upload-file-progress .progress-bar{position:relative;display:block;width:100%;height:15px;background-color:#f3f9fc;border-radius:0;box-shadow:none}.duet-upload-file-progress .progress-bar>span{display:block;text-indent:-9999px;background-color:#0077b3;border-radius:0}.duet-upload-file-progress progress[value]{display:flex;width:100%;height:15px;color:#0077b3;border:0 none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.duet-upload-file-progress progress[value]::-webkit-progress-bar{background-color:#f3f9fc;border-radius:0}.duet-upload-file-progress progress[value]::-webkit-progress-value{background-color:#0077b3;background-size:35px 20px, 100% 100%, 100% 100%;border-radius:0;-webkit-animation:animate-stripes 5s linear infinite;animation:animate-stripes 5s linear infinite}.duet-upload-file-progress progress[value] ::-moz-progress-bar{background-color:#f3f9fc}";
-
-let DuetUpload$1 = class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    attachShadow(this);
-    this.duetChange = createEvent$2(this, "duetChange", 3);
-    this.duetBlur = createEvent$2(this, "duetBlur", 7);
-    this.duetFocus = createEvent$2(this, "duetFocus", 7);
-    this.duetDone = createEvent$2(this, "duetDone", 3);
-    this.duetState = createEvent$2(this, "duetState", 3);
-    this.duetDelete = createEvent$2(this, "duetDelete", 3);
-    this.duetCancel = createEvent$2(this, "duetCancel", 3);
-    this.duetProgress = createEvent$2(this, "duetProgress", 3);
-    this.duetUpload = createEvent$2(this, "duetUpload", 3);
-    /**
-     * Own Properties
-     */
-    this.buttonId = createID("DuetButton");
-    this.labelId = createID("DuetLabel");
-    this.uploadId = createID("DuetUpload");
-    this.filesInProgress = new Map();
-    this.fileMaxReached = false;
-    this.bytesMaxReached = false;
-    /**
-     * State() variables
-     */
-    this.tick = Date.now();
-    /**
-     * If external is set to true, the upload component will not actually upload the files, but only keep states
-     * it will be up to you to handle the upload and return progress information to the upload-component
-     */
-    this.external = false;
-    /**
-     * Property to change descriptionDefaults defaults on the component.
-     * normally you would handle these strings on an application level and override @label when needed
-     */
-    this.buttonLabelDefaults = {
-      fi: "Lisää liite",
-      sv: "Lägg till en bilaga",
-      en: "Add an attachment",
-    };
-    /**
-     * Label of button
-     * @default { fi: "Lisää liite", sv: "Lägg till en bilaga", en: "Add an attachment" }
-     */
-    this.buttonLabel = getLocaleString(this.buttonLabelDefaults);
-    /**
-     * accessible Label of button
-     */
-    this.accessibleButtonLabel = undefined;
-    /**
-     * Theme of the input.
-     */
-    this.theme = "";
-    /**
-     * Makes the input component disabled. This prevents users from being able to
-     * interact with the upload component, and conveys its inactive state to assistive technologies.
-     */
-    this.disabled = false;
-    /**
-     * Controls the margin of the component.
-     */
-    this.margin = "auto";
-    /**
-     * Set whether the input is required or not. Please note that this is necessary for
-     * accessible inputs when the user is required to fill them. When using this property
-     * you need to also set “novalidate” attribute to your form element to prevent
-     * browser from displaying its own validation errors.
-     */
-    this.required = false;
-    /**
-     * Map of string that contain list of uploaded files.
-     */
-    this.files = new Map();
-    /**
-     * Property to read if filelist contains errors or not
-     */
-    this.valid = !this.required;
-    /**
-     * Property to change labelDefaults defaults on the component.
-     * normally you would handle these strings on an application level and override @label when needed
-     */
-    this.labelDefaults = {
-      fi: "Lisää liite",
-      sv: "Lägg till en bilaga",
-      en: "Add attachments",
-    };
-    /**
-     * Label for the input.
-     * @default { fi: "Lisää liite",sv: "Lägg till en bilaga",en: "Add attachments"}
-     */
-    this.label = getLocaleString(this.labelDefaults);
-    /**
-     * Property to change descriptionDefaults defaults on the component.
-     * normally you would handle these strings on an application level and override @label when needed
-     */
-    this.descriptionDefaults = {
-      fi: "Voit liittää {filetypes}-muotoisia tiedostoja sekä yleisimpiä videotiedostoja. Voit lähettää {maxbytes} verran tiedostoja yhdellä kertaa, ja lisätä enintään {maxfiles} liitettä kerrallaan.",
-      sv: "Du kan bifoga filer i flg. formater {filetypes} samt de vanligaste videofilerna. Du kan ladda upp {maxbytes} filer åt gången och lägga till upp till {maxfiles} bilagor åt gången.",
-      en: "You may attach the following filetypes: {filetypes} - as well as the most common video files. You can upload {maxbytes} of files at a time, and add up to {maxfiles} attachments at a time.",
-    };
-    /**
-     * Description for the upload component.
-     * @default ...
-     */
-    this.description = getLocaleString(this.descriptionDefaults);
-    /**
-     * Defaults for the filelist's empty state.
-     * @default { fi: "Lisää liite",sv: "Lägg till en bilaga",en: "Add attachments"}
-     */
-    this.fileListEmptyDefaults = {
-      fi: "Ei vielä lisättyjä tiedostoja.",
-      sv: "Inga filer har lagts till ännu.",
-      en: "No files added yet.",
-    };
-    /**
-     * Label for the filelist's empty state.
-     * @default { fi: "Ei vielä lisättyjä tiedostoja.",sv: "Inga filer har lagts till ännu.",en: "No files added yet."}
-     */
-    this.fileListEmpty = getLocaleString(this.fileListEmptyDefaults);
-    /**
-     * Display the input in error state along with an error message.
-     */
-    this.error = "";
-    /**
-     * Visually hide the label, but still show it to screen readers.
-     */
-    this.labelHidden = false;
-    /**
-     * if set, allows capture of media from user camera / microphone
-     * The capture attribute value is a string that specifies which camera to use for capture
-     * of image or video data, if the accept attribute indicates that the input should be of
-     * one of those types. A value of user indicates that the user-facing camera and/or
-     * microphone should be used. A value of environment specifies that the outward-facing
-     * camera and/or microphone should be used. If this attribute is missing, the user agent
-     * is free to decide on its own what to do. If the requested facing mode isn't available,
-     * the user agent may fall back to its preferred default mode.
-     */
-    this.capture = undefined;
-    /**
-     * Use maxBytes to specify the maximum size in Bytes of a file that can be uploaded.
-     */
-    this.maxBytes = 200000000;
-    /**
-     * Use maxBytesTotal to specify the maximum size in Bytes of All files combined that can be uploaded.
-     */
-    this.maxBytesTotal = undefined;
-    /**
-     * Use maxFiles to specify the maximum amount of files that can be uploaded
-     */
-    this.maxFiles = 99;
-    /**
-     * A string of commaseperated file type values that are allowed
-     * @example: .pdf,.doc,.docx
-     */
-    this.allowedExtensions = "all";
-    /**
-     * A string of commaseperated mime type values that are allowed
-     * @example: image/*,application/msword,
-     */
-    this.allowedMimetypes = "*";
-    /**
-     * Use multiple to allow the user to select multiple files when uploading
-     */
-    this.multiple = true;
-    /**
-     * Use limitSelection to enforce the value in allowedExtension & allowedMimetypes when selecting files,
-     * by default this is off, setting this to true will limit the users choices to what has been explicitly set
-     */
-    this.limitSelection = false;
-    /**
-     * Private functions
-     */
-    this.kick = () => (this.tick = Date.now()); // will trigger re-render
-    this.genHashName = () => Date.now().toString(36) + Math.random();
-    this.updateValueInMap = (item, key, value, kick = true) => {
-      const fileItem = this.files.get(item);
-      fileItem[key] = value;
-      this.files.set(item, fileItem);
-      if (kick) {
-        this.kick();
-      }
-    };
-    this.updateProgress = (ev, name) => {
-      if (ev.lengthComputable) {
-        const percentComplete = (ev.loaded / ev.total) * 100;
-        this.updateValueInMap(name, "progress", percentComplete);
-        this.onProgress(name, percentComplete, ev);
-      }
-      else {
-        console.log("cant read progress");
-      }
-    };
-    this.trackProgress = (name, remove = false) => {
-      if (remove) {
-        this.filesInProgress.delete(name);
-      }
-      else {
-        this.filesInProgress.set(name, "inprogress");
-      }
-      if (this.filesInProgress.size === 0) {
-        this.onDone();
-      }
-    };
-    this.getFilesAsArray = () => {
-      const filesInQueue = [];
-      const filesInError = [];
-      this.files.forEach(value => {
-        if (value.valid && !value.deleted) {
-          filesInQueue.push(value);
-        }
-        else if (!value.valid && !value.deleted) {
-          filesInError.push(value);
-        }
-      });
-      return { valid: filesInQueue, invalid: filesInError };
-    };
-    this.resetFormFields = () => {
-      /**
-       * You cannot modify a FileList, nor remove single items from it
-       * This completely removes all items in the FileList
-       * We reset the form fields to always be able to re-upload files
-       * and because we handle all uploads and states internally in the component (not relying on native form elements)
-       */
-      this.nativeInput.value = "";
-    };
-    this.getI18nError = (errorCode) => {
-      const errorFromJson = getError(errorCode);
-      const i18String = getLocaleString(errorFromJson.message);
-      if (i18String === "" || !i18String) {
-        return errorFromJson.system_message;
-      }
-      else {
-        return i18String;
-      }
-    };
-    /**
-     * Eventlisteners for the XHR requests
-     */
-    this.transferComplete = name => {
-      this.updateValueInMap(name, "progress", 100, false);
-      this.trackProgress(name, true);
-    };
-    this.transferDone = (xhr, name, status) => {
-      this.updateValueInMap(name, "status", status, false);
-      try {
-        const response = JSON.parse(xhr.response);
-        this.updateValueInMap(name, "url", response.url);
-      }
-      catch (e) {
-        this.updateValueInMap(name, "url", null);
-        console.error("Server did not respond with expected response {url: string}");
-      }
-      return;
-    };
-    this.transferDoneWithFailure = (xhr, name, status) => {
-      try {
-        const { error } = JSON.parse(xhr.response);
-        this.updateValueInMap(name, "error", { message: error.message, type: error.type });
-      }
-      catch (e) {
-        console.error("Server did not respond with expected response error:{message: string, type: int}");
-        this.updateValueInMap(name, "error", { type: status });
-      }
-    };
-    this.transferFailed = name => {
-      this.updateValueInMap(name, "error", getError("duet-upload-001"));
-    };
-    this.transferCanceled = name => {
-      this.files.delete(name);
-      this.validateTotals(name);
-      this.kick();
-    };
-    this.validateTotals = (name) => {
-      const isTotalSizeOverMaxSize = validateTotalSizeIsAboveMax(this.files, this.maxBytesTotal);
-      const isTotalFileAmountAboveMax = validateTotalAmountIsAboveMax(this.files, this.maxFiles);
-      if (isTotalSizeOverMaxSize && name) {
-        this.updateValueInMap(name, "error", getError("duet-upload-202"), false);
-      }
-      if (isTotalFileAmountAboveMax && name) {
-        this.updateValueInMap(name, "error", getError("duet-upload-301"), false);
-      }
-      this.bytesMaxReached = isTotalSizeOverMaxSize;
-      this.fileMaxReached = isTotalFileAmountAboveMax;
-      return {
-        bytesMaxReached: isTotalSizeOverMaxSize,
-        fileMaxReached: isTotalFileAmountAboveMax,
-      };
-    };
-    this.onDelete = (key, ev) => {
-      const deletedItem = this.files.get(key);
-      this.files.delete(key);
-      this.validateTotals();
-      this.kick();
-      if (!this.external) {
-        this.makeXHRDeleteRequest(deletedItem);
-      }
-      this.resetFormFields();
-      this.duetDelete.emit({
-        originalEvent: ev,
-        data: { deletion: deletedItem },
-        component: "duet-upload",
-      });
-    };
-    this.onCancel = (key, ev) => {
-      const cancelledItem = this.files.get(key);
-      this.files.delete(key);
-      if (!this.external) {
-        const { xhr } = cancelledItem;
-        xhr.abort();
-      }
-      else {
-        this.kick();
-      }
-      this.resetFormFields();
-      this.duetCancel.emit({
-        originalEvent: ev,
-        data: { cancelled: cancelledItem },
-        component: "duet-upload",
-      });
-    };
-    this.onUpload = (ev) => {
-      this.duetUpload.emit({
-        originalEvent: ev,
-        component: "duet-upload",
-      });
-    };
-    this.onBlur = (ev) => {
-      this.duetBlur.emit({
-        originalEvent: ev,
-        component: "duet-upload",
-      });
-    };
-    this.onProgress = (key, percentComplete, ev) => {
-      this.duetChange.emit({
-        originalEvent: ev,
-        data: {
-          key,
-          percentComplete,
-        },
-        component: "duet-upload",
-      });
-    };
-    this.onFocus = (ev) => {
-      this.duetFocus.emit({
-        originalEvent: ev,
-        component: "duet-upload",
-      });
-    };
-    this.onDone = () => {
-      this.duetDone.emit({
-        component: "duet-upload",
-        data: { files: this.files },
-      });
-    };
-    this.startUpload = async (ev) => {
-      await this.setFocus();
-      this.nativeInput.click();
-      this.onUpload(ev);
-      ev.stopPropagation();
-      ev.preventDefault();
-    };
-  }
-  watchValidHandler(newValue, oldValue) {
-    if (newValue !== oldValue) {
-      this.kick();
-    }
-  }
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad() {
-    inheritGlobalTheme(this);
-  }
-  componentWillRender() {
-    const { invalid, valid } = this.getFilesAsArray();
-    const oldValid = this.valid;
-    this.valid = invalid.length === 0 && valid.length !== 0;
-    if (this.valid !== oldValid) {
-      this.duetState.emit({
-        originalEvent: undefined,
-        data: { valid: this.valid, from: "componentWillRender" },
-        component: "duet-upload",
-      });
-    }
-  }
-  /**
-   * XHR request utilities
-   */
-  makeXHRPostRequest(data) {
-    const xhr = new XMLHttpRequest();
-    const name = data.get("name");
-    xhr.upload.addEventListener("progress", ev => {
-      this.updateProgress(ev, name);
-    });
-    xhr.upload.addEventListener("load", () => {
-      this.transferComplete(name);
-    });
-    xhr.upload.addEventListener("error", () => {
-      this.transferFailed(name);
-    });
-    xhr.upload.addEventListener("abort", () => {
-      this.transferCanceled(name);
-    });
-    return makeXhrRequest({ data, name }, { type: "POST", uri: this.uri, xhr, argument: null, headers: null }, this.transferDoneWithFailure, this.transferDone, this.trackProgress);
-  }
-  makeXHRDeleteRequest(data) {
-    const { uid, item } = data;
-    const xhr = new XMLHttpRequest();
-    // don't present server issues to user on deletes, just remove them from the visible list
-    return makeXhrRequest({ data: null, name }, {
-      type: "DELETE",
-      xhr,
-      uri: this.uri,
-      arguments: `?key=${uid}&name=${item.name}`,
-      headers: {
-        "x-fileuid": uid,
-        "x-filename": item.name,
-      },
-    }, this.transferDoneWithFailure, this.transferDone, this.trackProgress);
-  }
-  /**
-   * Component event handling.
-   */
-  async onChange(ev) {
-    var _a;
-    const selectedFiles = Array.from((_a = this.nativeInput) === null || _a === void 0 ? void 0 : _a.files);
-    // FileList is a nice array like structure but
-    // to ensure uniqueness of files we use a mapping structure and
-    // key to the name (makes it easier to delete)
-    if (selectedFiles) {
-      for (const item of selectedFiles) {
-        const { valid, errorMessage, errorType, errorSystem } = validateFile(item, {
-          maxBytes: this.maxBytes,
-          allowedExtensions: this.allowedExtensions,
-          allowedMimetypes: this.allowedMimetypes,
-        });
-        const uid = this.genHashName();
-        const fileListItem = {
-          uid,
-          item: item,
-          size: item.size,
-          valid,
-          error: {
-            type: valid ? undefined : errorType,
-            message: valid ? undefined : errorMessage,
-            system_message: valid ? undefined : errorSystem,
-          },
-          progress: 0,
-          deleted: false,
-          xhr: false,
-          url: false,
-        };
-        this.files.set(item.name, fileListItem);
-        // validate that we haven't hit any maxfiles or maxbytes limits before we upload
-        const { bytesMaxReached, fileMaxReached } = this.validateTotals(item.name);
-        if (bytesMaxReached) {
-          // in case one of the global maxes have been reached, invalidate the file
-          this.updateValueInMap(item.name, "valid", false, false);
-        }
-        else if (fileMaxReached) {
-          // in case one of the global maxes have been reached, invalidate the file
-          this.updateValueInMap(item.name, "valid", false, false);
-        }
-        else if (valid && !this.external) {
-          // if all is well AND external file upload handling has not been set, start upload
-          const data = new FormData();
-          data.append("file", item);
-          data.append("uid", uid);
-          data.append("name", item.name);
-          data.append("metadata", JSON.stringify({ uid, url: this.uri, size: item.size }));
-          fileListItem.xhr = await this.makeXHRPostRequest(data);
-        }
-        // kick the stat to force update
-        this.kick();
-      }
-    }
-    // reset the form, so that a user may upload a file again (with the same name)
-    this.resetFormFields();
-    this.duetChange.emit({
-      originalEvent: ev,
-      data: { files: this.files },
-      component: "duet-upload",
-    });
-  }
-  /**
-   * Sets focus on the specified `duet-input`. Use this method instead of the global
-   * `input.focus()`.
-   */
-  async setFocus(options) {
-    if (this.nativeInput) {
-      this.nativeInput.focus(options);
-    }
-    return;
-  }
-  /**
-   * Get list of files, divided in errors and valid sections
-   */
-  async getFiles() {
-    if (!this.files || this.files.size === 0) {
-      return false;
-    }
-    return this.getFilesAsArray();
-  }
-  /**
-   * render() function
-   * Always the last one in the class.
-   */
-  render() {
-    const identifier = this.identifier || this.uploadId;
-    let caption = this.description.replace(/{maxfiles}/g, this.maxFiles.toString());
-    caption = caption.replace(/{maxbytes}/g, `${Math.floor(this.maxBytes / 1024 / 1024)} MB`);
-    caption = caption.replace(/{filetypes}/g, this.allowedExtensions.split(",").join(", "));
-    return (h$1(Host, { class: { "duet-m-0": this.margin === "none" } }, h$1("duet-fieldset", { label: this.label, caption: caption }, h$1("slot", { name: "header" }), h$1("duet-label", { theme: this.theme === "turva" ? "turva" : "default", size: "small", class: {
-        "duet-upload-filelist-empty": !this.files.size,
-        "duet-upload-filelist": true,
-        "duet-upload-filelist-filled": this.files.size,
-      }, id: this.labelId, for: identifier }, !this.files.size && this.fileListEmpty), !!this.files.size && h$1("slot", { name: "fileheader" }), h$1(DuetUploadFileList, { data: this.getFilesAsArray(), onDelete: this.onDelete, onCancel: this.onCancel, getError: this.getI18nError }, h$1("li", null, "testing something")), !!this.files.size && h$1("slot", { name: "filefooter" }), h$1("duet-spacer", { size: "large" }), h$1("duet-button", { id: this.buttonId, onClick: this.startUpload, "accessible-controls": identifier, disabled: this.fileMaxReached, "accessible-label": this.accessibleButtonLabel, "accessible-owns": identifier, size: "small", variation: "secondary", fixed: true, icon: "action-add-circle" }, this.buttonLabel), h$1("duet-spacer", { size: "medium" }), (this.fileMaxReached || this.bytesMaxReached) && (h$1("duet-alert", null, this.fileMaxReached && this.getI18nError("duet-upload-301"), this.bytesMaxReached && this.getI18nError("duet-upload-202"))), h$1("duet-spacer", { size: "medium" }), h$1("duet-visually-hidden", null, h$1("input", { 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,
-      }, disabled: this.disabled, "aria-hidden": "true", required: this.required, name: this.name, id: this.identifier, multiple: this.multiple, capture: "user" })))));
-  }
-  get element() { return this; }
-  static get watchers() { return {
-    "valid": ["watchValidHandler"]
-  }; }
-  static get style() { return duetUploadCss; }
-};
-
 const duetVisuallyHiddenCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:absolute !important;top:0;width:1px !important;height:1px !important;padding:0 !important;overflow:hidden !important;clip:rect(1px, 1px, 1px, 1px) !important;border:0 !important}";
 
 let DuetVisuallyHidden$1 = class extends HTMLElement {
@@ -10432,38 +9663,38 @@ let DuetVisuallyHidden$1 = class extends HTMLElement {
 };
 
 globalScripts();
-const DuetAlert = /*@__PURE__*/proxyCustomElement(DuetAlert$1, [1,"duet-alert",{"theme":[1025],"accessibleLabelDefaults":[16],"accessibleLabel":[1,"accessible-label"],"announcements":[4],"icon":[1],"autoDismiss":[2,"auto-dismiss"],"margin":[1],"padding":[1],"variation":[1],"dismissible":[4],"isDismissed":[32],"timeoutID":[32]}]);
+const DuetAlert = /*@__PURE__*/proxyCustomElement(DuetAlert$1, [1,"duet-alert",{"theme":[1025],"accessibleLabelDefaults":[1,"accessible-label-default"],"accessibleLabel":[1,"accessible-label"],"announcements":[4],"icon":[1],"autoDismiss":[2,"auto-dismiss"],"margin":[1],"padding":[1],"variation":[1],"dismissible":[4],"isDismissed":[32],"timeoutID":[32]}]);
 const DuetBadge = /*@__PURE__*/proxyCustomElement(DuetBadge$1, [1,"duet-badge",{"theme":[1025],"variation":[1],"margin":[1]}]);
-const DuetButton = /*@__PURE__*/proxyCustomElement(DuetButton$1, [1,"duet-button",{"accessibleLabel":[1,"accessible-label"],"accessibleControls":[1,"accessible-controls"],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"accessibleExpanded":[4,"accessible-expanded"],"accessiblePressed":[4,"accessible-pressed"],"loading":[4],"variation":[1],"negative":[4],"theme":[1025],"margin":[1],"padding":[1],"wrapping":[1],"expand":[4],"fixed":[4],"disabled":[516],"name":[1],"value":[1],"identifier":[1],"submit":[516],"external":[4],"language":[1],"accessibleLabelExternalDefaults":[16],"accessibleLabelExternal":[1,"accessible-label-external"],"icon":[1],"color":[1],"iconRight":[4,"icon-right"],"iconSize":[1,"icon-size"],"size":[1],"iconOnly":[4,"icon-only"],"url":[513]}]);
+const DuetButton = /*@__PURE__*/proxyCustomElement(DuetButton$1, [1,"duet-button",{"accessibleLabel":[1,"accessible-label"],"accessibleControls":[1,"accessible-controls"],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"accessibleExpanded":[4,"accessible-expanded"],"accessiblePressed":[4,"accessible-pressed"],"loading":[4],"variation":[1],"negative":[4],"theme":[1025],"margin":[1],"padding":[1],"wrapping":[1],"expand":[4],"fixed":[4],"disabled":[516],"name":[1],"value":[1],"identifier":[1],"submit":[516],"external":[4],"language":[1],"accessibleLabelExternalDefaults":[1,"accessible-label-external-default"],"accessibleLabelExternal":[1,"accessible-label-external"],"icon":[1],"color":[1],"iconRight":[4,"icon-right"],"iconSize":[1,"icon-size"],"size":[1],"iconOnly":[4,"icon-only"],"url":[513]}]);
 const DuetCaption = /*@__PURE__*/proxyCustomElement(DuetCaption$1, [1,"duet-caption",{"theme":[1025],"margin":[1],"selected":[4],"size":[1]}]);
 const DuetCard = /*@__PURE__*/proxyCustomElement(DuetCard$1, [1,"duet-card",{"accessibleLabel":[1,"accessible-label"],"heading":[1],"secondaryHeading":[1,"secondary-heading"],"variation":[1],"collapsible":[4],"open":[1540],"headingLevel":[1,"heading-level"],"icon":[1],"image":[1],"background":[1],"padding":[1],"margin":[1],"theme":[1025],"url":[1]}]);
 const DuetCheckbox = /*@__PURE__*/proxyCustomElement(DuetCheckbox$1, [2,"duet-checkbox",{"accessibleActiveDescendant":[1,"accessible-active-descendant"],"margin":[1],"accessibleControls":[1,"accessible-controls"],"accessibleIndex":[1,"accessible-index"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"required":[4],"theme":[1025],"disabled":[516],"identifier":[1],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"role":[1],"checked":[1540],"value":[1537]}]);
-const DuetChoice = /*@__PURE__*/proxyCustomElement(DuetChoice$1, [6,"duet-choice",{"theme":[1025],"label":[1],"accessibleLabelInfoButtonDefaults":[16],"accessibleLabelInfoButton":[1,"accessible-label-info-button"],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"caption":[1],"value":[1537],"type":[513],"name":[1],"checked":[1540],"collapsible":[4],"margin":[1],"icon":[1],"expand":[4],"padding":[1],"identifier":[1],"groupDirection":[1,"group-direction"],"groupDisabled":[4,"group-disabled"],"groupResponsive":[4,"group-responsive"],"disabled":[516],"required":[4],"isHovering":[32],"isInfoOpen":[32],"isBlurred":[32]},[[2,"blur","handleHostBlur"],[2,"keydown","handleHostKeyDown"],[2,"keyup","handleHostKeyUp"]]]);
+const DuetChoice = /*@__PURE__*/proxyCustomElement(DuetChoice$1, [6,"duet-choice",{"theme":[1025],"label":[1],"accessibleLabelInfoButtonDefaults":[1,"accessible-label-info-default"],"accessibleLabelInfoButton":[1,"accessible-label-info-button"],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"caption":[1],"value":[1537],"type":[513],"name":[1],"checked":[1540],"collapsible":[4],"margin":[1],"icon":[1],"expand":[4],"padding":[1],"identifier":[1],"groupDirection":[1,"group-direction"],"groupDisabled":[4,"group-disabled"],"groupResponsive":[4,"group-responsive"],"disabled":[516],"required":[4],"isHovering":[32],"isInfoOpen":[32],"isBlurred":[32]},[[2,"blur","handleHostBlur"],[2,"keydown","handleHostKeyDown"],[2,"keyup","handleHostKeyUp"]]]);
 const DuetChoiceGroup = /*@__PURE__*/proxyCustomElement(DuetChoiceGroup$1, [6,"duet-choice-group",{"direction":[1],"margin":[1],"theme":[1025],"error":[1],"name":[1],"label":[1],"labelHidden":[4,"label-hidden"],"caption":[1],"tooltip":[1],"tooltipDirection":[1,"tooltip-direction"],"responsive":[4],"value":[1537],"disabled":[4]}]);
 const DuetCollapsible = /*@__PURE__*/proxyCustomElement(DuetCollapsible$1, [1,"duet-collapsible",{"theme":[1025],"heading":[1],"headingWeight":[1,"heading-weight"],"headingSize":[1,"heading-size"],"headingLevel":[1,"heading-level"],"margin":[1],"open":[1540]}]);
 const DuetCookieConsent = /*@__PURE__*/proxyCustomElement(DuetCookieConsent$1, [1,"duet-cookie-consent",{"accessibleLabel":[1,"accessible-label"],"theme":[1025]}]);
-const DuetDatePicker = /*@__PURE__*/proxyCustomElement(DuetDatePicker$1, [2,"duet-date-picker",{"theme":[1025],"expand":[4],"name":[1],"identifier":[1],"label":[1],"caption":[1],"margin":[1],"placeholder":[1],"echoPlaceholder":[1540,"echo-placeholder"],"disabled":[516],"language":[1],"error":[1],"labelHidden":[4,"label-hidden"],"role":[1],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"required":[4],"direction":[1],"tooltip":[1],"tooltipDirection":[1,"tooltip-direction"],"value":[1537],"min":[1],"max":[1],"validity":[1040],"open":[32],"focusedDay":[32],"inputValue":[32]},[[4,"click","handleDocumentClick"]]]);
+const DuetDatePicker = /*@__PURE__*/proxyCustomElement(DuetDatePicker$1, [2,"duet-date-picker",{"theme":[1025],"expand":[4],"name":[1],"identifier":[1],"label":[1],"caption":[1],"margin":[1],"language":[1],"placeholderDefaults":[1,"placeholder-default"],"placeholder":[1],"echoPlaceholder":[1540,"echo-placeholder"],"disabled":[516],"error":[1],"labelHidden":[4,"label-hidden"],"role":[1],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"required":[4],"direction":[1],"tooltip":[1],"tooltipDirection":[1,"tooltip-direction"],"value":[1537],"min":[1],"max":[1],"validity":[1040],"open":[32],"focusedDay":[32],"inputValue":[32]},[[4,"click","handleDocumentClick"]]]);
 const DuetDivider = /*@__PURE__*/proxyCustomElement(DuetDivider$1, [1,"duet-divider",{"theme":[1025],"margin":[1]}]);
 const DuetEmptyState = /*@__PURE__*/proxyCustomElement(DuetEmptyState$1, [1,"duet-empty-state",{"theme":[1025],"icon":[1],"size":[1]}]);
 const DuetFieldset = /*@__PURE__*/proxyCustomElement(DuetFieldset$1, [1,"duet-fieldset",{"theme":[1025],"margin":[1],"caption":[1],"label":[1],"error":[1],"labelHidden":[4,"label-hidden"],"hasTooltip":[32]}]);
-const DuetFooter = /*@__PURE__*/proxyCustomElement(DuetFooter$1, [1,"duet-footer",{"theme":[1025],"variation":[1],"margin":[1],"logoHref":[1,"logo-href"],"language":[1025],"items":[8],"accessibleLabelExternalDefaults":[16],"accessibleLabelExternal":[1,"accessible-label-external"],"menu":[8],"processedItems":[32],"processedMenu":[32]}]);
+const DuetFooter = /*@__PURE__*/proxyCustomElement(DuetFooter$1, [1,"duet-footer",{"theme":[1025],"variation":[1],"margin":[1],"logoHref":[1,"logo-href"],"language":[1025],"items":[8],"accessibleLabelExternalDefaults":[1,"accessible-label-external-default"],"accessibleLabelExternal":[1,"accessible-label-external"],"menu":[8],"processedItems":[32],"processedMenu":[32]}]);
 const DuetGrid = /*@__PURE__*/proxyCustomElement(DuetGrid$1, [2,"duet-grid",{"responsive":[4],"breakpoint":[1],"direction":[1],"alignment":[1],"distribution":[1],"mobile":[1]}]);
 const DuetGridItem = /*@__PURE__*/proxyCustomElement(DuetGridItem$1, [2,"duet-grid-item",{"fill":[4],"maxWidth":[1,"max-width"],"minWidth":[1,"min-width"],"theme":[1025],"margin":[1],"responsive":[4],"breakpoint":[1]}]);
-const DuetHeader = /*@__PURE__*/proxyCustomElement(DuetHeader$1, [1,"duet-header",{"theme":[1025],"language":[1025],"accessibleI18nLabelsDefault":[16],"accessibleI18nLabels":[16],"accessibleLabelExternalDefaults":[16],"accessibleLabelExternal":[1,"accessible-label-external"],"accessibleLabelDefault":[16],"accessibleLabel":[1,"accessible-label"],"user":[8],"logoHref":[1,"logo-href"],"currentHref":[1025,"current-href"],"skipToId":[1,"skip-to-id"],"items":[8],"region":[1],"session":[8],"back":[8],"contact":[1],"contactItems":[8,"contact-items"],"languageItems":[8,"language-items"],"isContactOpen":[32],"isLanguageOpen":[32],"isSlideOutOpen":[32],"processedItems":[32],"processedLanguageItems":[32],"processedContactItems":[32],"processedSession":[32],"processedUser":[32],"processedBack":[32]},[[8,"keyup","handleKeyUp"],[8,"keydown","handleKeyDown"],[4,"focus","handleDocumentClick"],[4,"click","handleDocumentClick"]]]);
+const DuetHeader = /*@__PURE__*/proxyCustomElement(DuetHeader$1, [1,"duet-header",{"theme":[1025],"language":[1025],"accessibleI18nLabelsDefaults":[1,"accessible-labels-default"],"accessibleI18nLabels":[16],"accessibleLabelExternalDefaults":[1,"accessible-label-external-default"],"accessibleLabelExternal":[1,"accessible-label-external"],"accessibleLabelDefaults":[1,"accessible-label-default"],"accessibleLabel":[1,"accessible-label"],"user":[8],"logoHref":[1,"logo-href"],"currentHref":[1025,"current-href"],"skipToId":[1,"skip-to-id"],"items":[8],"region":[1],"session":[8],"back":[8],"contact":[1],"contactItems":[8,"contact-items"],"languageItems":[8,"language-items"],"isContactOpen":[32],"isLanguageOpen":[32],"isSlideOutOpen":[32],"processedItems":[32],"processedLanguageItems":[32],"processedContactItems":[32],"processedSession":[32],"processedUser":[32],"processedBack":[32]},[[8,"keyup","handleKeyUp"],[8,"keydown","handleKeyDown"],[4,"focus","handleDocumentClick"],[4,"click","handleDocumentClick"]]]);
 const DuetHeading = /*@__PURE__*/proxyCustomElement(DuetHeading$1, [1,"duet-heading",{"level":[513],"margin":[1],"visualLevel":[1,"visual-level"],"border":[4],"weight":[1],"color":[1],"theme":[1025],"hyphenate":[4]}]);
-const DuetHero = /*@__PURE__*/proxyCustomElement(DuetHero$1, [1,"duet-hero",{"theme":[1025],"heading":[1],"preHeading":[1,"pre-heading"],"level":[1],"description":[1],"icon":[1],"iconSize":[1,"icon-size"],"iconRight":[4,"icon-right"],"categoryIcon":[1,"category-icon"],"categoryIconColor":[1,"category-icon-color"],"buttonLabel":[1,"button-label"],"language":[1025],"accessibleLabelExternalDefaults":[16],"accessibleLabelExternal":[1,"accessible-label-external"],"buttonUrl":[1,"button-url"],"buttonId":[1,"button-id"],"buttonData":[16],"textCenter":[4,"text-center"],"leftAlign":[4,"left-align"],"image":[1],"variation":[1],"back":[8],"listItems":[8,"list-items"],"actions":[8],"processedListItems":[32],"processedActions":[32],"processedBack":[32]}]);
+const DuetHero = /*@__PURE__*/proxyCustomElement(DuetHero$1, [1,"duet-hero",{"theme":[1025],"heading":[1],"preHeading":[1,"pre-heading"],"level":[1],"description":[1],"icon":[1],"iconSize":[1,"icon-size"],"iconRight":[4,"icon-right"],"categoryIcon":[1,"category-icon"],"categoryIconColor":[1,"category-icon-color"],"buttonLabel":[1,"button-label"],"language":[1025],"accessibleLabelExternalDefaults":[1,"accessible-label-external-default"],"accessibleLabelExternal":[1,"accessible-label-external"],"buttonUrl":[1,"button-url"],"buttonId":[1,"button-id"],"buttonData":[16],"textCenter":[4,"text-center"],"leftAlign":[4,"left-align"],"image":[1],"variation":[1],"back":[8],"listItems":[8,"list-items"],"actions":[8],"processedListItems":[32],"processedActions":[32],"processedBack":[32]}]);
 const DuetIcon = /*@__PURE__*/proxyCustomElement(DuetIcon$1, [1,"duet-icon",{"theme":[1025],"icon":[1],"src":[1],"name":[1],"margin":[1],"responsive":[4],"color":[513],"background":[1],"size":[1],"outline":[1],"svgContent":[32]}]);
 const DuetInput = /*@__PURE__*/proxyCustomElement(DuetInput$1, [6,"duet-input",{"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleAutocomplete":[1,"accessible-autocomplete"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"debounce":[2],"caption":[1],"echoPlaceholder":[4,"echo-placeholder"],"theme":[1025],"expand":[4],"disabled":[516],"identifier":[1],"margin":[1],"required":[4],"type":[1],"label":[1],"error":[1],"labelHidden":[4,"label-hidden"],"numericKeyboard":[4,"numeric-keyboard"],"name":[1],"pattern":[1],"maxlength":[2],"minlength":[2],"placeholder":[1],"component":[1],"role":[1],"icon":[1],"autoComplete":[1,"auto-complete"],"disallowPattern":[1,"disallow-pattern"],"value":[1025],"tooltip":[1],"tooltipDirection":[1,"tooltip-direction"]}]);
 const DuetLabel = /*@__PURE__*/proxyCustomElement(DuetLabel$1, [6,"duet-label",{"theme":[1025],"for":[1],"margin":[1],"size":[1]}]);
 const DuetLayout = /*@__PURE__*/proxyCustomElement(DuetLayout$1, [1,"duet-layout",{"sticky":[4],"margin":[1],"stickyDistance":[1,"sticky-distance"],"center":[4],"tabs":[4],"middle":[4]}]);
-const DuetLink = /*@__PURE__*/proxyCustomElement(DuetLink$1, [17,"duet-link",{"accessibleLabel":[1,"accessible-label"],"language":[1025],"accessibleLabelExternalDefaults":[16],"accessibleLabelExternal":[1,"accessible-label-external"],"identifier":[1],"theme":[1025],"url":[513],"external":[4]}]);
+const DuetLink = /*@__PURE__*/proxyCustomElement(DuetLink$1, [17,"duet-link",{"accessibleLabel":[1,"accessible-label"],"language":[1025],"accessibleLabelExternalDefaults":[1,"accessible-label-external-default"],"accessibleLabelExternal":[1,"accessible-label-external"],"identifier":[1],"theme":[1025],"url":[513],"external":[4]}]);
 const DuetList = /*@__PURE__*/proxyCustomElement(DuetList$1, [1,"duet-list",{"theme":[1025],"margin":[1],"padding":[1],"mobile":[1],"breakpoint":[1],"variation":[1],"labelWidth":[1,"label-width"]}]);
 const DuetListItem = /*@__PURE__*/proxyCustomElement(DuetListItem$1, [1,"duet-list-item"]);
 const DuetLogo = /*@__PURE__*/proxyCustomElement(DuetLogo$1, [1,"duet-logo",{"theme":[1025],"margin":[1],"inverse":[4],"size":[1],"href":[1537],"language":[1537]}]);
-const DuetModal = /*@__PURE__*/proxyCustomElement(DuetModal$1, [1,"duet-modal",{"language":[1025],"accessibleCloseLabelDefault":[16],"accessibleCloseLabel":[1,"accessible-close-label"],"size":[1],"gutterSize":[1,"gutter-size"],"theme":[1025],"heading":[1],"headingLevel":[1,"heading-level"],"icon":[1],"color":[1],"active":[1540],"open":[32]},[[8,"keyup","handleKeyUp"]]]);
+const DuetModal = /*@__PURE__*/proxyCustomElement(DuetModal$1, [1,"duet-modal",{"language":[1025],"accessibleCloseLabelDefaults":[1,"accessible-close-label-default"],"accessibleCloseLabel":[1,"accessible-close-label"],"size":[1],"gutterSize":[1,"gutter-size"],"theme":[1025],"heading":[1],"headingLevel":[1,"heading-level"],"icon":[1],"color":[1],"active":[1540],"open":[32]},[[8,"keyup","handleKeyUp"]]]);
 const DuetNotification = /*@__PURE__*/proxyCustomElement(DuetNotification$1, [1,"duet-notification",{"language":[1],"accessibleLabelUnreadDefaults":[16],"accessibleLabelUnread":[1,"accessible-label-unread"],"url":[1],"date":[1],"highlight":[4],"external":[4],"theme":[1025]}]);
-const DuetNotificationDrawer = /*@__PURE__*/proxyCustomElement(DuetNotificationDrawer$1, [1,"duet-notification-drawer",{"icon":[1],"label":[1],"language":[1],"accessibleLabelNotificationsDefaults":[16],"accessibleLabelNotifications":[1,"accessible-label-notifications"],"badge":[4],"theme":[1025],"direction":[1],"isOpen":[32],"hasNotifications":[32]},[[6,"focus","handleClickFocusOutside"],[6,"click","handleClickFocusOutside"]]]);
-const DuetNumberInput = /*@__PURE__*/proxyCustomElement(DuetNumberInput$1, [2,"duet-number-input",{"language":[1025],"locale":[1],"unit":[1],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"accessibleLive":[1,"accessible-live"],"accessibleLiveEnabled":[4,"accessible-live-enabled"],"accessibleAdd":[1,"accessible-add"],"accessibleSubtract":[1,"accessible-subtract"],"theme":[1025],"margin":[1],"expand":[4],"identifier":[1],"min":[2],"label":[1],"labelHidden":[4,"label-hidden"],"max":[2],"name":[1],"error":[1],"tooltip":[1],"step":[2],"rounding":[4],"role":[1],"disabled":[516],"required":[4],"value":[1025],"focusedValue":[32]}]);
+const DuetNotificationDrawer = /*@__PURE__*/proxyCustomElement(DuetNotificationDrawer$1, [1,"duet-notification-drawer",{"icon":[1],"label":[1],"language":[1],"accessibleLabelNotificationsDefaults":[1,"accessible-label-notification-default"],"accessibleLabelNotifications":[1,"accessible-label-notifications"],"badge":[4],"theme":[1025],"direction":[1],"isOpen":[32],"hasNotifications":[32]},[[6,"focus","handleClickFocusOutside"],[6,"click","handleClickFocusOutside"]]]);
+const DuetNumberInput = /*@__PURE__*/proxyCustomElement(DuetNumberInput$1, [2,"duet-number-input",{"language":[1025],"locale":[1],"unit":[1],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"accessibleLiveDefaults":[1,"accessible-live-default"],"accessibleLive":[1,"accessible-live"],"accessibleLiveEnabled":[4,"accessible-live-enabled"],"accessibleAddDefaults":[1,"accessible-add-default"],"accessibleAdd":[1,"accessible-add"],"accessibleSubtractDefaults":[1,"accessible-subtract-defaults"],"accessibleSubtract":[1,"accessible-subtract"],"theme":[1025],"margin":[1],"expand":[4],"identifier":[1],"min":[2],"labelDefaults":[1,"label-default"],"label":[1],"labelHidden":[4,"label-hidden"],"max":[2],"name":[1],"error":[1],"tooltip":[1],"step":[2],"rounding":[4],"role":[1],"disabled":[516],"required":[4],"value":[1025],"focusedValue":[32]}]);
 const DuetParagraph = /*@__PURE__*/proxyCustomElement(DuetParagraph$1, [1,"duet-paragraph",{"theme":[1025],"margin":[1],"size":[1],"variation":[1],"color":[1]}]);
 const DuetRadio = /*@__PURE__*/proxyCustomElement(DuetRadio$1, [2,"duet-radio",{"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleIndex":[1,"accessible-index"],"margin":[1],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"theme":[1025],"disabled":[516],"required":[4],"blockEvents":[4,"block-events"],"identifier":[1],"label":[1],"name":[1],"role":[1],"groupDisabled":[4,"group-disabled"],"groupDirection":[1,"group-direction"],"groupResponsive":[4,"group-responsive"],"checked":[1540],"value":[1537]}]);
 const DuetRadioGroup = /*@__PURE__*/proxyCustomElement(DuetRadioGroup$1, [6,"duet-radio-group",{"direction":[1],"margin":[1],"theme":[1025],"error":[1],"tooltip":[1],"tooltipDirection":[1,"tooltip-direction"],"name":[1],"label":[1],"labelHidden":[4,"label-hidden"],"caption":[1],"responsive":[4],"value":[1537],"disabled":[4]}]);
@@ -10474,13 +9705,12 @@ const DuetSpinner = /*@__PURE__*/proxyCustomElement(DuetSpinner$1, [1,"duet-spin
 const DuetStep = /*@__PURE__*/proxyCustomElement(DuetStep$1, [6,"duet-step",{"theme":[1025],"heading":[1],"headingLevel":[1,"heading-level"],"stepIndex":[2,"step-index"],"state":[1],"roundedTop":[4,"rounded-top"],"roundedBottom":[4,"rounded-bottom"]}]);
 const DuetStepper = /*@__PURE__*/proxyCustomElement(DuetStepper$1, [1,"duet-stepper",{"theme":[1025],"accessibleLive":[1,"accessible-live"],"margin":[1],"backDisabled":[4,"back-disabled"],"selected":[514]},[[0,"duetStepClick","onDuetStepClick"]]]);
 const DuetTab = /*@__PURE__*/proxyCustomElement(DuetTab$1, [6,"duet-tab",{"label":[513],"selected":[516]}]);
-const DuetTabGroup = /*@__PURE__*/proxyCustomElement(DuetTabGroup$1, [6,"duet-tab-group",{"theme":[1025],"variation":[1],"language":[1025],"label":[1],"labelHidden":[4,"label-hidden"],"margin":[1],"padding":[1],"tabs":[32],"selected":[32]}]);
+const DuetTabGroup = /*@__PURE__*/proxyCustomElement(DuetTabGroup$1, [6,"duet-tab-group",{"theme":[1025],"variation":[1],"language":[1025],"labelDefaults":[1,"label-default"],"label":[1],"labelHidden":[4,"label-hidden"],"margin":[1],"padding":[1],"tabs":[32],"selected":[32]}]);
 const DuetTable = /*@__PURE__*/proxyCustomElement(DuetTable$1, [4,"duet-table",{"theme":[1025],"margin":[1],"variation":[1],"sticky":[4],"stickyDistance":[1,"sticky-distance"],"breakpoint":[1],"matchesBreakpoint":[32]}]);
 const DuetTextarea = /*@__PURE__*/proxyCustomElement(DuetTextarea$1, [2,"duet-textarea",{"margin":[1],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleAutocomplete":[1,"accessible-autocomplete"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"theme":[1025],"expand":[4],"disabled":[516],"identifier":[1],"required":[4],"label":[1],"labelHidden":[4,"label-hidden"],"name":[1],"placeholder":[1],"caption":[1],"echoPlaceholder":[4,"echo-placeholder"],"maxlength":[2],"minlength":[2],"error":[1],"role":[1],"tooltip":[1],"tooltipDirection":[1,"tooltip-direction"],"value":[1025],"disallowPattern":[1,"disallow-pattern"],"counter":[4],"counterLabel":[1,"counter-label"]}]);
 const DuetToggle = /*@__PURE__*/proxyCustomElement(DuetToggle$1, [2,"duet-toggle",{"theme":[1025],"margin":[1],"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"accessibleDescribedBy":[1,"accessible-described-by"],"label":[1],"required":[4],"disabled":[516],"checked":[1540],"value":[1537],"identifier":[1],"name":[1],"role":[1]}]);
-const DuetTooltip = /*@__PURE__*/proxyCustomElement(DuetTooltip$1, [1,"duet-tooltip",{"theme":[1025],"language":[1025],"accessibleLabel":[1,"accessible-label"],"accessibleInputLabel":[1,"accessible-input-label"],"accessibleCloseLabel":[1,"accessible-close-label"],"label":[1],"breakpoint":[1],"direction":[1],"positionVertical":[513,"position-vertical"],"positionHorizontal":[513,"position-horizontal"],"active":[1540],"openDown":[32]},[[9,"scroll","onScroll"],[4,"click","handleDocumentClick"]]]);
-const DuetTray = /*@__PURE__*/proxyCustomElement(DuetTray$1, [1,"duet-tray",{"language":[1025],"accessibleCloseLabel":[1,"accessible-close-label"],"accessibleOpenLabel":[1,"accessible-open-label"],"theme":[1025],"active":[516],"autoHide":[4,"auto-hide"],"responsive":[4],"expanded":[32],"hiddenState":[32]},[[9,"scroll","getFrame"],[16,"click","handleBodyClick"]]]);
-const DuetUpload = /*@__PURE__*/proxyCustomElement(DuetUpload$1, [1,"duet-upload",{"accessibleActiveDescendant":[1,"accessible-active-descendant"],"accessibleDescribedBy":[1,"accessible-described-by"],"accessibleControls":[1,"accessible-controls"],"accessibleOwns":[1,"accessible-owns"],"external":[4],"uri":[1],"caption":[1],"buttonLabelDefaults":[16],"buttonLabel":[1,"button-label"],"accessibleButtonLabel":[1,"accessible-button-label"],"theme":[1025],"disabled":[516],"identifier":[1],"margin":[1],"required":[4],"files":[1040],"valid":[1540],"labelDefaults":[16],"label":[1],"descriptionDefaults":[16],"description":[1],"fileListEmptyDefaults":[16],"fileListEmpty":[1,"file-list-empty"],"error":[1],"labelHidden":[4,"label-hidden"],"name":[1],"capture":[8],"maxBytes":[2,"max-bytes"],"maxBytesTotal":[2,"max-bytes-total"],"maxFiles":[2,"max-files"],"allowedExtensions":[1,"allowed-extensions"],"allowedMimetypes":[1,"allowed-mimetypes"],"multiple":[4],"limitSelection":[4,"limit-selection"],"value":[1025],"tick":[32]}]);
+const DuetTooltip = /*@__PURE__*/proxyCustomElement(DuetTooltip$1, [1,"duet-tooltip",{"theme":[1025],"language":[1025],"accessibleLabelDefault":[1,"accessible-label-default"],"accessibleLabel":[1,"accessible-label"],"accessibleInputLabel":[1,"accessible-input-label"],"accessibleCloseLabelDefault":[1,"accessible-close-label-default"],"accessibleCloseLabel":[1,"accessible-close-label"],"label":[1],"breakpoint":[1],"direction":[1],"positionVertical":[513,"position-vertical"],"positionHorizontal":[513,"position-horizontal"],"active":[1540],"openDown":[32]},[[9,"scroll","onScroll"],[4,"click","handleDocumentClick"]]]);
+const DuetTray = /*@__PURE__*/proxyCustomElement(DuetTray$1, [1,"duet-tray",{"language":[1025],"accessibleCloseLabelDefaults":[1,"accessible-close-label-default"],"accessibleCloseLabel":[1,"accessible-close-label"],"accessibleOpenLabelDefaults":[1,"accessible-open-label-default"],"accessibleOpenLabel":[1,"accessible-open-label"],"theme":[1025],"active":[516],"autoHide":[4,"auto-hide"],"responsive":[4],"expanded":[32],"hiddenState":[32]},[[9,"scroll","getFrame"],[16,"click","handleBodyClick"]]]);
 const DuetVisuallyHidden = /*@__PURE__*/proxyCustomElement(DuetVisuallyHidden$1, [1,"duet-visually-hidden"]);
 const defineCustomElements = (opts) => {
   if (typeof customElements !== 'undefined') {
@@ -10533,7 +9763,6 @@ const defineCustomElements = (opts) => {
   DuetToggle,
   DuetTooltip,
   DuetTray,
-  DuetUpload,
   DuetVisuallyHidden
     ].forEach(cmp => {
       if (!customElements.get(cmp.is)) {
@@ -10936,4 +10165,4 @@ const shadowCss = /*#__PURE__*/Object.freeze({
   scopeCss: scopeCss
 });
 
-export { DuetAlert, DuetBadge, DuetButton, DuetCaption, DuetCard, DuetCheckbox, DuetChoice, DuetChoiceGroup, DuetCollapsible, DuetCookieConsent, DuetDatePicker, DuetDivider, DuetEmptyState, DuetFieldset, DuetFooter, DuetGrid, DuetGridItem, DuetHeader, DuetHeading, DuetHero, DuetIcon, DuetInput, DuetLabel, DuetLayout, DuetLink, DuetList, DuetListItem, DuetLogo, DuetModal, DuetNotification, DuetNotificationDrawer, DuetNumberInput, DuetParagraph, DuetRadio, DuetRadioGroup, DuetRangeSlider, DuetSelect, DuetSpacer, DuetSpinner, DuetStep, DuetStepper, DuetTab, DuetTabGroup, DuetTable, DuetTextarea, DuetToggle, DuetTooltip, DuetTray, DuetUpload, DuetVisuallyHidden, defineCustomElements, setAssetPath, setPlatformOptions };
+export { DuetAlert, DuetBadge, DuetButton, DuetCaption, DuetCard, DuetCheckbox, DuetChoice, DuetChoiceGroup, DuetCollapsible, DuetCookieConsent, DuetDatePicker, DuetDivider, DuetEmptyState, DuetFieldset, DuetFooter, DuetGrid, DuetGridItem, DuetHeader, DuetHeading, DuetHero, DuetIcon, DuetInput, DuetLabel, DuetLayout, DuetLink, DuetList, DuetListItem, DuetLogo, DuetModal, DuetNotification, DuetNotificationDrawer, DuetNumberInput, DuetParagraph, DuetRadio, DuetRadioGroup, DuetRangeSlider, DuetSelect, DuetSpacer, DuetSpinner, DuetStep, DuetStepper, DuetTab, DuetTabGroup, DuetTable, DuetTextarea, DuetToggle, DuetTooltip, DuetTray, DuetVisuallyHidden, defineCustomElements, setAssetPath, setPlatformOptions };