@duetds/components 4.30.1 → 4.31.0

package/hydrate/index.js

@@ -4701,7 +4701,7 @@ function hydrateFactory($stencilWindow, $stencilHydrateOpts, $stencilHydrateResu
 
 
 const NAMESPACE = 'duet';
-const BUILD = /* duet */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, cssVarShim: false, devTools: false, disconnectedCallback: true, dynamicImportShim: false, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: true, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, safari10: false, scoped: true, scriptDataOpts: false, shadowDelegatesFocus: true, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
+const BUILD = /* duet */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: false, cssAnnotations: true, cssVarShim: false, devTools: false, disconnectedCallback: true, dynamicImportShim: false, element: false, event: true, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: true, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: true, hydrateServerSide: true, hydratedAttribute: false, hydratedClass: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, safari10: false, scoped: true, scriptDataOpts: false, shadowDelegatesFocus: true, shadowDom: true, shadowDomShim: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
 
 const TAB_KEY = 9;
 var appGlobalScript = () => {
@@ -5170,8 +5170,7 @@ const createElm = (e, t, o, n) => {
  const n = createTime("scheduleUpdate", e.$cmpMeta$.$tagName$), s = e.$lazyInstance$ ;
  let l;
  return t ? ((e.$flags$ |= 256, e.$queuedListeners$ && (e.$queuedListeners$.map((([e, t]) => safeCall(s, e, t))), 
- e.$queuedListeners$ = null)), (l = safeCall(s, "componentWillLoad"))) : (BUILD.cmpWillUpdate ), (l = then(l, (() => safeCall(s, "componentWillRender")))), 
- n(), then(l, (() => updateComponent(e, s, t)));
+ e.$queuedListeners$ = null)), (l = safeCall(s, "componentWillLoad"))) : (BUILD.cmpWillUpdate ), n(), then(l, (() => updateComponent(e, s, t)));
 }, updateComponent = async (e, t, o) => {
  const n = e.$hostElement$, s = createTime("update", e.$cmpMeta$.$tagName$), l = n["s-rc"];
  o && attachStyles(e);
@@ -5538,6 +5537,51 @@ const cmpModules = new Map, getModule = e => {
  isTesting: !1
 }, styles = new Map;
 
+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",
@@ -5552,13 +5596,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;
   }
@@ -5572,7 +5616,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"
@@ -5590,21 +5634,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()];
   }
 };
 
@@ -5632,6 +5689,7 @@ class DuetAlert {
     /**
      * 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",
@@ -5714,7 +5772,7 @@ class DuetAlert {
     "$tagName$": "duet-alert",
     "$members$": {
       "theme": [1025],
-      "accessibleLabelDefaults": [16],
+      "accessibleLabelDefaults": [1, "accessible-label-default"],
       "accessibleLabel": [1, "accessible-label"],
       "announcements": [4],
       "icon": [1],
@@ -5732,7 +5790,7 @@ class DuetAlert {
   }; }
 }
 
-const duetBadgeCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-badge,*.sc-duet-badge::after,*.sc-duet-badge::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-badge-h{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*/.sc-duet-badge-h:last-child,.sc-duet-badge-h:last-of-type{margin-right:0 !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-badge-h{margin:0 !important}/*!@.duet-badge*/.duet-badge.sc-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*/.duet-badge.duet-p-0.sc-duet-badge{padding:0 !important}/*!@.duet-badge.duet-m-0*/.duet-badge.duet-m-0.sc-duet-badge{margin:0 !important}/*!@.duet-badge.duet-theme-turva*/.duet-badge.duet-theme-turva.sc-duet-badge{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*/.duet-badge.warning.sc-duet-badge{background:#fef3df}/*!@.duet-badge.warning.duet-theme-turva*/.duet-badge.warning.duet-theme-turva.sc-duet-badge{background:#fef1db}/*!@.duet-badge.danger*/.duet-badge.danger.sc-duet-badge{background:#fce9ef}/*!@.duet-badge.danger.duet-theme-turva*/.duet-badge.danger.duet-theme-turva.sc-duet-badge{background:#fceae7}/*!@.duet-badge.success*/.duet-badge.success.sc-duet-badge{background:#e6f3ef}/*!@.duet-badge.success.duet-theme-turva*/.duet-badge.success.duet-theme-turva.sc-duet-badge{background:#e6f3ed}";
+const duetBadgeCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-badge,*.sc-duet-badge::after,*.sc-duet-badge::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-badge-h{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*/.sc-duet-badge-h:last-child,.sc-duet-badge-h:last-of-type{margin-right:0 !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-badge-h{margin:0 !important}/*!@.duet-badge*/.duet-badge.sc-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*/.duet-badge.duet-p-0.sc-duet-badge{padding:0 !important}/*!@.duet-badge.duet-m-0*/.duet-badge.duet-m-0.sc-duet-badge{margin:0 !important}/*!@.duet-badge.duet-theme-turva*/.duet-badge.duet-theme-turva.sc-duet-badge{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*/.duet-badge.warning.sc-duet-badge{background:#fef3df}/*!@.duet-badge.warning.duet-theme-turva*/.duet-badge.warning.duet-theme-turva.sc-duet-badge{background:#fef1db}/*!@.duet-badge.danger*/.duet-badge.danger.sc-duet-badge{background:#fce9ef}/*!@.duet-badge.danger.duet-theme-turva*/.duet-badge.danger.duet-theme-turva.sc-duet-badge{background:#fceae7}/*!@.duet-badge.success*/.duet-badge.success.sc-duet-badge{background:#e6f3ef}/*!@.duet-badge.success.duet-theme-turva*/.duet-badge.success.duet-theme-turva.sc-duet-badge{background:#e6f3ed}";
 
 class DuetBadge {
   constructor(hostRef) {
@@ -6179,7 +6237,7 @@ class DuetButton {
      * 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.
@@ -6365,7 +6423,7 @@ class DuetButton {
       "submit": [516],
       "external": [4],
       "language": [1],
-      "accessibleLabelExternalDefaults": [16],
+      "accessibleLabelExternalDefaults": [1, "accessible-label-external-default"],
       "accessibleLabelExternal": [1, "accessible-label-external"],
       "icon": [1],
       "color": [1],
@@ -6459,46 +6517,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 = "/*!@*,\n*::after,\n*::before*/*.sc-duet-card,*.sc-duet-card::after,*.sc-duet-card::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-card-h{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)*/.duet-card-info.sc-duet-card-h{margin-bottom:16px !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-card-h{margin:0 !important}/*!@.duet-card*/.duet-card.sc-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*/.duet-card.duet-p-0.sc-duet-card{padding:0 !important}/*!@.duet-card.duet-m-0*/.duet-card.duet-m-0.sc-duet-card{margin:0 !important}/*!@.duet-card:focus*/.duet-card.sc-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*/.duet-theme-turva.sc-duet-card .duet-card.sc-duet-card:focus,.duet-card.sc-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*/.duet-card.sc-duet-card{padding:28px !important}}/*!@.duet-card.duet-theme-turva*/.duet-card.duet-theme-turva.sc-duet-card{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*/.duet-card.x-small.sc-duet-card{padding:20px !important}}@media (min-width: 36em){/*!@.duet-card.medium*/.duet-card.medium.sc-duet-card{padding:28px !important}}@media (min-width: 48em){/*!@.duet-card.medium*/.duet-card.medium.sc-duet-card{padding:36px !important}}@media (min-width: 36em){/*!@.duet-card.large*/.duet-card.large.sc-duet-card{padding:36px !important}}@media (min-width: 48em){/*!@.duet-card.large*/.duet-card.large.sc-duet-card{padding:48px !important}}@media (min-width: 36em){/*!@.duet-card.x-large*/.duet-card.x-large.sc-duet-card{padding:48px !important}}@media (min-width: 48em){/*!@.duet-card.x-large*/.duet-card.x-large.sc-duet-card{padding:72px !important}}/*!@.duet-card.duet-card-collapsed*/.duet-card.duet-card-collapsed.sc-duet-card{padding-bottom:0 !important}@media (min-width: 36em){/*!@.duet-card.duet-card-collapsed*/.duet-card.duet-card-collapsed.sc-duet-card{padding-bottom:0 !important}}/*!@.duet-card.info*/.duet-card.info.sc-duet-card{background:rgba(0, 80, 128, 0.04) !important;box-shadow:none}/*!@.duet-card.info.duet-theme-turva*/.duet-card.info.duet-theme-turva.sc-duet-card{background:rgba(23, 28, 58, 0.035) !important}/*!@.duet-card.plain*/.duet-card.plain.sc-duet-card{box-shadow:none}/*!@.duet-card.plain:not(.duet-card-has-bg)*/.duet-card.plain.sc-duet-card:not(.duet-card-has-bg){background:transparent !important}/*!@.duet-card-heading-grid*/.duet-card-heading-grid.sc-duet-card{display:flex;align-items:center}/*!@.duet-card-heading-grid .expand*/.duet-card-heading-grid.sc-duet-card .expand.sc-duet-card{flex:1}/*!@.duet-card-heading-text*/.duet-card-heading-text.sc-duet-card{overflow:hidden;text-overflow:ellipsis}/*!@.duet-card-secondary-heading*/.duet-card-secondary-heading.sc-duet-card{font-size:1rem;font-weight:600}/*!@.duet-card-heading*/.duet-card-heading.sc-duet-card{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*/.duet-card-heading.sc-duet-card{padding:15px 28px 16px !important;margin:-28px -28px 20px}}/*!@.duet-card-heading[role=button]*/.duet-card-heading[role=button].sc-duet-card{-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*/.duet-card-heading[role=button].sc-duet-card:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-card-heading[role=button]:focus*/.user-is-tabbing.sc-duet-card-h .duet-card-heading[role=button].sc-duet-card: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*/.user-is-tabbing.sc-duet-card-h .duet-theme-turva.sc-duet-card .duet-card-heading[role=button].sc-duet-card:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-card-collapsed .duet-card-heading*/.duet-card-collapsed.sc-duet-card .duet-card-heading.sc-duet-card{margin-bottom:0 !important;border-bottom:0 !important}/*!@.duet-theme-turva .duet-card-heading*/.duet-theme-turva.sc-duet-card .duet-card-heading.sc-duet-card{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*/.x-small.sc-duet-card .duet-card-heading.sc-duet-card{padding:10px 20px 11px !important;margin:-20px -20px 20px}}@media (min-width: 48em){/*!@.x-small .duet-card-heading*/.x-small.sc-duet-card .duet-card-heading.sc-duet-card{padding:10px 20px 11px !important;margin:-20px -20px 20px}}/*!@.medium .duet-card-heading*/.medium.sc-duet-card .duet-card-heading.sc-duet-card{margin:-20px -20px 20px}@media (min-width: 36em){/*!@.medium .duet-card-heading*/.medium.sc-duet-card .duet-card-heading.sc-duet-card{padding:15px 28px 16px !important;margin:-28px -28px 20px}}@media (min-width: 48em){/*!@.medium .duet-card-heading*/.medium.sc-duet-card .duet-card-heading.sc-duet-card{padding:19px 36px 20px !important;margin:-36px -36px 28px}}/*!@.large .duet-card-heading*/.large.sc-duet-card .duet-card-heading.sc-duet-card{margin:-20px -20px 20px}@media (min-width: 36em){/*!@.large .duet-card-heading*/.large.sc-duet-card .duet-card-heading.sc-duet-card{padding:19px 36px 20px !important;margin:-36px -36px 28px}}@media (min-width: 48em){/*!@.large .duet-card-heading*/.large.sc-duet-card .duet-card-heading.sc-duet-card{padding:26px 48px 27px !important;margin:-48px -48px 36px}}/*!@.x-large .duet-card-heading*/.x-large.sc-duet-card .duet-card-heading.sc-duet-card{margin:-20px -20px 20px}@media (min-width: 36em){/*!@.x-large .duet-card-heading*/.x-large.sc-duet-card .duet-card-heading.sc-duet-card{padding:26px 48px 27px !important;margin:-48px -48px 36px}}@media (min-width: 48em){/*!@.x-large .duet-card-heading*/.x-large.sc-duet-card .duet-card-heading.sc-duet-card{padding:39px 72px 40px !important;margin:-72px -72px 48px}}/*!@.none .duet-card-heading*/.none.sc-duet-card .duet-card-heading.sc-duet-card{padding:0 0 20px !important;margin:0 0 20px}/*!@.duet-card-footer*/.duet-card-footer.sc-duet-card{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*/.duet-theme-turva.sc-duet-card .duet-card-footer.sc-duet-card{background:#f5f5f7}@media (min-width: 36em){/*!@.duet-card-footer*/.duet-card-footer.sc-duet-card{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){/*!@.duet-card-footer*/.duet-card-footer.sc-duet-card{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 36em){/*!@.x-small .duet-card-footer*/.x-small.sc-duet-card .duet-card-footer.sc-duet-card{padding:15px 28px 16px !important;padding-left:20px !important;margin:20px -20px -20px}}@media (min-width: 36em){/*!@.medium .duet-card-footer*/.medium.sc-duet-card .duet-card-footer.sc-duet-card{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){/*!@.medium .duet-card-footer*/.medium.sc-duet-card .duet-card-footer.sc-duet-card{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 36em){/*!@.large .duet-card-footer*/.large.sc-duet-card .duet-card-footer.sc-duet-card{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 48em){/*!@.large .duet-card-footer*/.large.sc-duet-card .duet-card-footer.sc-duet-card{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 36em){/*!@.x-large .duet-card-footer*/.x-large.sc-duet-card .duet-card-footer.sc-duet-card{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 48em){/*!@.x-large .duet-card-footer*/.x-large.sc-duet-card .duet-card-footer.sc-duet-card{padding:39px 72px 40px !important;margin:48px -72px -72px}}/*!@.none .duet-card-footer*/.none.sc-duet-card .duet-card-footer.sc-duet-card{padding:12px 0 !important;margin:20px 0 0}/*!@.duet-card-content*/.duet-card-content.sc-duet-card{width:100%}/*!@.duet-card-collapsed .duet-card-content*/.duet-card-collapsed.sc-duet-card .duet-card-content.sc-duet-card{display:none}/*!@.duet-card-caret*/.duet-card-caret.sc-duet-card{transition:300ms ease}/*!@[aria-expanded=false] .duet-card-caret*/[aria-expanded=false].sc-duet-card .duet-card-caret.sc-duet-card{transform:rotate(-180deg)}/*!@.duet-card-image-mask*/.duet-card-image-mask.sc-duet-card{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*/.small.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 36em){/*!@.medium .duet-card-image-mask*/.medium.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 48em){/*!@.medium .duet-card-image-mask*/.medium.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 72px);margin:-36px 0 28px -36px}}@media (min-width: 36em){/*!@.large .duet-card-image-mask*/.large.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 72px);margin:-36px 0 36px -36px}}@media (min-width: 48em){/*!@.large .duet-card-image-mask*/.large.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 36em){/*!@.x-large .duet-card-image-mask*/.x-large.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 48em){/*!@.x-large .duet-card-image-mask*/.x-large.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 144px);margin:-72px 0 36px -72px}}/*!@.none .duet-card-image-mask*/.none.sc-duet-card .duet-card-image-mask.sc-duet-card{width:100%;margin:0 0 20px}/*!@.duet-card-image*/.duet-card-image.sc-duet-card{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*/a.duet-card.sc-duet-card{transition:box-shadow 300ms ease, background-position 300ms ease}/*!@a.duet-card:hover*/a.duet-card.sc-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*/a.duet-card.sc-duet-card:hover .duet-card-image.sc-duet-card{transform:scale(1.024)}/*!@.duet-theme-turva a.duet-card:hover*/.duet-theme-turva.sc-duet-card a.duet-card.sc-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*/a.duet-card.sc-duet-card:active{transition:none;transform:translateY(1px)}";
+const duetCardCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-card,*.sc-duet-card::after,*.sc-duet-card::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-card-h{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)*/.duet-card-info.sc-duet-card-h{margin-bottom:16px !important}/*!@:host(.duet-m-0)*/.duet-m-0.sc-duet-card-h{margin:0 !important}/*!@.duet-card*/.duet-card.sc-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*/.duet-card.duet-p-0.sc-duet-card{padding:0 !important}/*!@.duet-card.duet-m-0*/.duet-card.duet-m-0.sc-duet-card{margin:0 !important}/*!@.duet-card:focus*/.duet-card.sc-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*/.duet-theme-turva.sc-duet-card .duet-card.sc-duet-card:focus,.duet-card.sc-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*/.duet-card.sc-duet-card{padding:28px !important}}/*!@.duet-card.duet-theme-turva*/.duet-card.duet-theme-turva.sc-duet-card{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*/.duet-card.x-small.sc-duet-card{padding:20px !important}}@media (min-width: 36em){/*!@.duet-card.medium*/.duet-card.medium.sc-duet-card{padding:28px !important}}@media (min-width: 48em){/*!@.duet-card.medium*/.duet-card.medium.sc-duet-card{padding:36px !important}}@media (min-width: 36em){/*!@.duet-card.large*/.duet-card.large.sc-duet-card{padding:36px !important}}@media (min-width: 48em){/*!@.duet-card.large*/.duet-card.large.sc-duet-card{padding:48px !important}}@media (min-width: 36em){/*!@.duet-card.x-large*/.duet-card.x-large.sc-duet-card{padding:48px !important}}@media (min-width: 48em){/*!@.duet-card.x-large*/.duet-card.x-large.sc-duet-card{padding:72px !important}}/*!@.duet-card.duet-card-collapsed*/.duet-card.duet-card-collapsed.sc-duet-card{padding-bottom:0 !important}@media (min-width: 36em){/*!@.duet-card.duet-card-collapsed*/.duet-card.duet-card-collapsed.sc-duet-card{padding-bottom:0 !important}}/*!@.duet-card.info*/.duet-card.info.sc-duet-card{background:rgba(0, 80, 128, 0.04) !important;box-shadow:none}/*!@.duet-card.info.duet-theme-turva*/.duet-card.info.duet-theme-turva.sc-duet-card{background:rgba(23, 28, 58, 0.035) !important}/*!@.duet-card.plain*/.duet-card.plain.sc-duet-card{box-shadow:none}/*!@.duet-card.plain:not(.duet-card-has-bg)*/.duet-card.plain.sc-duet-card:not(.duet-card-has-bg){background:transparent !important}/*!@.duet-card-heading-grid*/.duet-card-heading-grid.sc-duet-card{display:flex;flex-direction:row}/*!@.duet-card-icon*/.duet-card-icon.sc-duet-card{align-self:center}/*!@.duet-card-heading-text*/.duet-card-heading-text.sc-duet-card{flex:1;word-break:break-word}/*!@.duet-card-secondary-heading*/.duet-card-secondary-heading.sc-duet-card{font-size:1rem;font-weight:600;word-break:break-word}/*!@.duet-card-heading*/.duet-card-heading.sc-duet-card{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*/.duet-card-heading.sc-duet-card{padding:15px 28px 16px !important;margin:-28px -28px 20px}}/*!@.duet-card-heading[role=button]*/.duet-card-heading[role=button].sc-duet-card{-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*/.duet-card-heading[role=button].sc-duet-card:focus{outline:0}/*!@:host(.user-is-tabbing) .duet-card-heading[role=button]:focus*/.user-is-tabbing.sc-duet-card-h .duet-card-heading[role=button].sc-duet-card: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*/.user-is-tabbing.sc-duet-card-h .duet-theme-turva.sc-duet-card .duet-card-heading[role=button].sc-duet-card:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}/*!@.duet-card-collapsed .duet-card-heading*/.duet-card-collapsed.sc-duet-card .duet-card-heading.sc-duet-card{margin-bottom:0 !important;border-bottom:0 !important}/*!@.duet-theme-turva .duet-card-heading*/.duet-theme-turva.sc-duet-card .duet-card-heading.sc-duet-card{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*/.x-small.sc-duet-card .duet-card-heading.sc-duet-card{padding:10px 20px 11px !important;margin:-20px -20px 20px}}@media (min-width: 48em){/*!@.x-small .duet-card-heading*/.x-small.sc-duet-card .duet-card-heading.sc-duet-card{padding:10px 20px 11px !important;margin:-20px -20px 20px}}/*!@.medium .duet-card-heading*/.medium.sc-duet-card .duet-card-heading.sc-duet-card{margin:-20px -20px 20px}@media (min-width: 36em){/*!@.medium .duet-card-heading*/.medium.sc-duet-card .duet-card-heading.sc-duet-card{padding:15px 28px 16px !important;margin:-28px -28px 20px}}@media (min-width: 48em){/*!@.medium .duet-card-heading*/.medium.sc-duet-card .duet-card-heading.sc-duet-card{padding:19px 36px 20px !important;margin:-36px -36px 28px}}/*!@.large .duet-card-heading*/.large.sc-duet-card .duet-card-heading.sc-duet-card{margin:-20px -20px 20px}@media (min-width: 36em){/*!@.large .duet-card-heading*/.large.sc-duet-card .duet-card-heading.sc-duet-card{padding:19px 36px 20px !important;margin:-36px -36px 28px}}@media (min-width: 48em){/*!@.large .duet-card-heading*/.large.sc-duet-card .duet-card-heading.sc-duet-card{padding:26px 48px 27px !important;margin:-48px -48px 36px}}/*!@.x-large .duet-card-heading*/.x-large.sc-duet-card .duet-card-heading.sc-duet-card{margin:-20px -20px 20px}@media (min-width: 36em){/*!@.x-large .duet-card-heading*/.x-large.sc-duet-card .duet-card-heading.sc-duet-card{padding:26px 48px 27px !important;margin:-48px -48px 36px}}@media (min-width: 48em){/*!@.x-large .duet-card-heading*/.x-large.sc-duet-card .duet-card-heading.sc-duet-card{padding:39px 72px 40px !important;margin:-72px -72px 48px}}/*!@.none .duet-card-heading*/.none.sc-duet-card .duet-card-heading.sc-duet-card{padding:0 0 20px !important;margin:0 0 20px}/*!@.duet-card-footer*/.duet-card-footer.sc-duet-card{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*/.duet-theme-turva.sc-duet-card .duet-card-footer.sc-duet-card{background:#f5f5f7}@media (min-width: 36em){/*!@.duet-card-footer*/.duet-card-footer.sc-duet-card{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){/*!@.duet-card-footer*/.duet-card-footer.sc-duet-card{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 36em){/*!@.x-small .duet-card-footer*/.x-small.sc-duet-card .duet-card-footer.sc-duet-card{padding:15px 28px 16px !important;padding-left:20px !important;margin:20px -20px -20px}}@media (min-width: 36em){/*!@.medium .duet-card-footer*/.medium.sc-duet-card .duet-card-footer.sc-duet-card{padding:15px 28px 16px !important;margin:20px -28px -28px}}@media (min-width: 48em){/*!@.medium .duet-card-footer*/.medium.sc-duet-card .duet-card-footer.sc-duet-card{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 36em){/*!@.large .duet-card-footer*/.large.sc-duet-card .duet-card-footer.sc-duet-card{padding:19px 36px 20px !important;margin:28px -36px -36px}}@media (min-width: 48em){/*!@.large .duet-card-footer*/.large.sc-duet-card .duet-card-footer.sc-duet-card{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 36em){/*!@.x-large .duet-card-footer*/.x-large.sc-duet-card .duet-card-footer.sc-duet-card{padding:26px 48px 27px !important;margin:36px -48px -48px}}@media (min-width: 48em){/*!@.x-large .duet-card-footer*/.x-large.sc-duet-card .duet-card-footer.sc-duet-card{padding:39px 72px 40px !important;margin:48px -72px -72px}}/*!@.none .duet-card-footer*/.none.sc-duet-card .duet-card-footer.sc-duet-card{padding:12px 0 !important;margin:20px 0 0}/*!@.duet-card-content*/.duet-card-content.sc-duet-card{width:100%}/*!@.duet-card-collapsed .duet-card-content*/.duet-card-collapsed.sc-duet-card .duet-card-content.sc-duet-card{display:none}/*!@.duet-card-caret*/.duet-card-caret.sc-duet-card{position:relative;top:6px;align-self:flex-start;transition:300ms ease}/*!@[aria-expanded=false] .duet-card-caret*/[aria-expanded=false].sc-duet-card .duet-card-caret.sc-duet-card{transform:rotate(-180deg)}/*!@.duet-card-image-mask*/.duet-card-image-mask.sc-duet-card{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*/.small.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 36em){/*!@.medium .duet-card-image-mask*/.medium.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 56px);margin:-28px 0 28px -28px}}@media (min-width: 48em){/*!@.medium .duet-card-image-mask*/.medium.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 72px);margin:-36px 0 28px -36px}}@media (min-width: 36em){/*!@.large .duet-card-image-mask*/.large.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 72px);margin:-36px 0 36px -36px}}@media (min-width: 48em){/*!@.large .duet-card-image-mask*/.large.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 36em){/*!@.x-large .duet-card-image-mask*/.x-large.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 96px);margin:-48px 0 36px -48px}}@media (min-width: 48em){/*!@.x-large .duet-card-image-mask*/.x-large.sc-duet-card .duet-card-image-mask.sc-duet-card{width:calc(100% + 144px);margin:-72px 0 36px -72px}}/*!@.none .duet-card-image-mask*/.none.sc-duet-card .duet-card-image-mask.sc-duet-card{width:100%;margin:0 0 20px}/*!@.duet-card-image*/.duet-card-image.sc-duet-card{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*/a.duet-card.sc-duet-card{transition:box-shadow 300ms ease, background-position 300ms ease}/*!@a.duet-card:hover*/a.duet-card.sc-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*/a.duet-card.sc-duet-card:hover .duet-card-image.sc-duet-card{transform:scale(1.024)}/*!@.duet-theme-turva a.duet-card:hover*/.duet-theme-turva.sc-duet-card a.duet-card.sc-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*/a.duet-card.sc-duet-card:active{transition:none;transform:translateY(1px)}";
 
 /**
  * @slot unnamed default slot - The component’s primary content. All child nodes that do not have a slot attribute defined are inserted into this primary slot.
@@ -6583,7 +6602,7 @@ class DuetCard {
     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",
@@ -6594,7 +6613,7 @@ class DuetCard {
         onKeyDown: this.handleKeyDown,
       }
       : {};
-    return (hAsync(HeadingTag, Object.assign({ class: "duet-card-heading" }, headingProps), hAsync("div", { class: "duet-card-heading-grid" }, this.icon && (hAsync(Fragment, null, hAsync("duet-icon", { class: "duet-card-icon", name: this.icon, size: "medium", margin: "none", color: "currentColor" }), hAsync("duet-spacer", { direction: "horizontal", size: "small" }))), hAsync("div", { class: "expand duet-card-heading-text" }, this.heading), this.secondaryHeading && (hAsync(Fragment, null, hAsync("duet-spacer", { direction: "horizontal", size: "small" }), hAsync("div", { class: "duet-card-secondary-heading" }, this.secondaryHeading))), this.collapsible && (hAsync(Fragment, null, hAsync("duet-spacer", { direction: "horizontal", size: "small" }), hAsync("duet-icon", { class: "duet-card-caret", icon: actionArrowUp.svg, size: "small", margin: "none", color: "currentColor" }))))));
+    return (hAsync(HeadingTag, Object.assign({ class: "duet-card-heading" }, headingProps), hAsync("div", { class: "duet-card-heading-grid" }, this.icon && (hAsync(Fragment, null, hAsync("duet-icon", { class: "duet-card-icon", name: this.icon, size: "medium", margin: "none", color: "currentColor" }), hAsync("duet-spacer", { direction: "horizontal", size: "small" }))), hAsync("div", { class: "duet-card-heading-text" }, this.heading), this.collapsible && (hAsync(Fragment, null, hAsync("duet-spacer", { direction: "horizontal", size: "small" }), hAsync("duet-icon", { class: "duet-card-caret", icon: actionArrowUp.svg, size: "small", margin: "none", color: "currentColor" })))), this.secondaryHeading && hAsync("div", { class: "duet-card-secondary-heading" }, this.secondaryHeading)));
   }
   /**
    * Sets focus on the specified `duet-card`. Use this method instead of the global
@@ -7057,7 +7076,7 @@ class DuetChoice {
     "$members$": {
       "theme": [1025],
       "label": [1],
-      "accessibleLabelInfoButtonDefaults": [16],
+      "accessibleLabelInfoButtonDefaults": [1, "accessible-label-info-default"],
       "accessibleLabelInfoButton": [1, "accessible-label-info-button"],
       "accessibleActiveDescendant": [1, "accessible-active-descendant"],
       "accessibleControls": [1, "accessible-controls"],
@@ -7121,7 +7140,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}";
 
 class DuetChoiceGroup {
   constructor(hostRef) {
@@ -7856,7 +7875,7 @@ class DuetCollapsible {
    * 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 (hAsync(Host, { class: { "duet-m-0": this.margin === "none" } }, hAsync(HeadingTagName, { class: {
         "duet-collapsible-heading": true,
         "duet-theme-turva": this.theme === "turva",
@@ -8333,7 +8352,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}";
 
 class DuetDatePicker {
   constructor(hostRef) {
@@ -8374,11 +8393,27 @@ class DuetDatePicker {
      * 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)
@@ -8389,13 +8424,6 @@ class DuetDatePicker {
      * 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.
      */
@@ -8740,10 +8768,11 @@ class DuetDatePicker {
       "label": [1],
       "caption": [1],
       "margin": [1],
+      "language": [1],
+      "placeholderDefaults": [1, "placeholder-default"],
       "placeholder": [1],
       "echoPlaceholder": [1540, "echo-placeholder"],
       "disabled": [516],
-      "language": [1],
       "error": [1],
       "labelHidden": [4, "label-hidden"],
       "role": [1],
@@ -9004,7 +9033,7 @@ class DuetFooter {
      * 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.
      */
@@ -9079,7 +9108,7 @@ class DuetFooter {
       "logoHref": [1, "logo-href"],
       "language": [1025],
       "items": [8],
-      "accessibleLabelExternalDefaults": [16],
+      "accessibleLabelExternalDefaults": [1, "accessible-label-external-default"],
       "accessibleLabelExternal": [1, "accessible-label-external"],
       "menu": [8],
       "processedItems": [32],
@@ -9518,10 +9547,26 @@ class DuetHeader {
      */
     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ä",
@@ -9558,7 +9603,7 @@ class DuetHeader {
       },
     }
      */
-    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
@@ -9574,7 +9619,7 @@ class DuetHeader {
      * 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",
@@ -9588,7 +9633,7 @@ class DuetHeader {
       en: "Menu",
     }
      */
-    this.accessibleLabel = getLocaleString(this.accessibleLabelDefault);
+    this.accessibleLabel = getLocaleString(this.accessibleLabelDefaults);
     /**
      * URL that the logo link points to.
      */
@@ -9871,11 +9916,11 @@ class DuetHeader {
     "$members$": {
       "theme": [1025],
       "language": [1025],
-      "accessibleI18nLabelsDefault": [16],
+      "accessibleI18nLabelsDefaults": [1, "accessible-labels-default"],
       "accessibleI18nLabels": [16],
-      "accessibleLabelExternalDefaults": [16],
+      "accessibleLabelExternalDefaults": [1, "accessible-label-external-default"],
       "accessibleLabelExternal": [1, "accessible-label-external"],
-      "accessibleLabelDefault": [16],
+      "accessibleLabelDefaults": [1, "accessible-label-default"],
       "accessibleLabel": [1, "accessible-label"],
       "user": [8],
       "logoHref": [1, "logo-href"],
@@ -9906,7 +9951,7 @@ class DuetHeader {
   }; }
 }
 
-const duetHeadingCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-heading,*.sc-duet-heading::after,*.sc-duet-heading::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-heading-h{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*/.duet-heading.sc-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*/.duet-heading.sc-duet-heading{margin-bottom:20px !important}}/*!@.duet-heading.duet-theme-turva*/.duet-heading.duet-theme-turva.sc-duet-heading{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*/.duet-heading.duet-heading-border.sc-duet-heading{padding-bottom:20px;border-bottom:1px solid #e1e3e6}/*!@.duet-heading.duet-heading-hyphenate*/.duet-heading.duet-heading-hyphenate.sc-duet-heading{-webkit-hyphens:auto;hyphens:auto}/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:9.4vw}/*!@.duet-heading.h0.duet-p-0*/.duet-heading.h0.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h0.duet-m-0*/.duet-heading.h0.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 31.914893617rem){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:3rem}}@media (min-width: 47.8723404255rem){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:4.5rem}}@media (max-width: 22.5em){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:2.25rem}}/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:7vw}/*!@.duet-heading.h1.duet-p-0*/.duet-heading.h1.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h1.duet-m-0*/.duet-heading.h1.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 32.1428571429rem){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:2.25rem}}@media (min-width: 42.8571428571rem){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:3rem}}@media (max-width: 22.5em){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:1.5rem}}/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:5.8vw}/*!@.duet-heading.h2.duet-p-0*/.duet-heading.h2.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h2.duet-m-0*/.duet-heading.h2.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 25.8620689655rem){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:1.5rem}}@media (min-width: 38.7931034483rem){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:2.25rem}}@media (max-width: 22.5em){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:1.375rem}}/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{margin-bottom:12px !important;font-size:4.2vw}/*!@.duet-heading.h3.duet-p-0*/.duet-heading.h3.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h3.duet-m-0*/.duet-heading.h3.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 29.7619047619rem){/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{font-size:1.25rem}}@media (min-width: 35.7142857143rem){/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{font-size:1.5rem}}/*!@.duet-heading.h3.duet-theme-turva*/.duet-heading.h3.duet-theme-turva.sc-duet-heading{font-style:normal}/*!@.duet-heading.h3.duet-heading-border*/.duet-heading.h3.duet-heading-border.sc-duet-heading{padding-bottom:20px}/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{margin-bottom:8px !important;font-size:4vw;letter-spacing:0}/*!@.duet-heading.h4.duet-p-0*/.duet-heading.h4.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h4.duet-m-0*/.duet-heading.h4.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 27.5rem){/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{font-size:1.1rem}}@media (min-width: 31.25rem){/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{font-size:1.25rem}}/*!@.duet-heading.h4.duet-theme-turva*/.duet-heading.h4.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h4.duet-heading-border*/.duet-heading.h4.duet-heading-border.sc-duet-heading{padding-bottom:20px}/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{margin-bottom:8px !important;font-size:4vw;font-weight:600;letter-spacing:0}/*!@.duet-heading.h5.duet-p-0*/.duet-heading.h5.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h5.duet-m-0*/.duet-heading.h5.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 27.5rem){/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{font-size:1.1rem}}@media (min-width: 28.4090909091rem){/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{font-size:1.1363636364rem}}/*!@.duet-heading.h5.duet-theme-turva*/.duet-heading.h5.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h5.duet-heading-border*/.duet-heading.h5.duet-heading-border.sc-duet-heading{padding-bottom:16px}/*!@.duet-heading.h6*/.duet-heading.h6.sc-duet-heading{margin-bottom:8px !important;font-size:1rem;font-weight:600;letter-spacing:0}/*!@.duet-heading.h6.duet-p-0*/.duet-heading.h6.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h6.duet-m-0*/.duet-heading.h6.duet-m-0.sc-duet-heading{margin:0 !important}/*!@.duet-heading.h6.duet-theme-turva*/.duet-heading.h6.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h6.duet-heading-border*/.duet-heading.h6.duet-heading-border.sc-duet-heading{padding-bottom:16px}/*!@.duet-heading.duet-semibold, .duet-heading.duet-theme-turva.duet-semibold*/.duet-heading.duet-semibold.sc-duet-heading,.duet-heading.duet-theme-turva.duet-semibold.sc-duet-heading{font-style:normal !important;font-weight:600 !important}";
+const duetHeadingCss = "/*!@*,\n*::after,\n*::before*/*.sc-duet-heading,*.sc-duet-heading::after,*.sc-duet-heading::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-heading-h{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*/.duet-heading.sc-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*/.duet-heading.sc-duet-heading{margin-bottom:20px !important}}/*!@.duet-heading.duet-theme-turva*/.duet-heading.duet-theme-turva.sc-duet-heading{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*/.duet-heading.duet-heading-border.sc-duet-heading{padding-bottom:20px;border-bottom:1px solid #e1e3e6}/*!@.duet-heading.duet-heading-hyphenate*/.duet-heading.duet-heading-hyphenate.sc-duet-heading{-webkit-hyphens:auto;hyphens:auto}/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:9.4vw}/*!@.duet-heading.h0.duet-p-0*/.duet-heading.h0.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h0.duet-m-0*/.duet-heading.h0.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 31.914893617rem){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:3rem}}@media (min-width: 47.8723404255rem){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:4.5rem}}@media (max-width: 22.5em){/*!@.duet-heading.h0*/.duet-heading.h0.sc-duet-heading{font-size:2.25rem}}/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:7vw}/*!@.duet-heading.h1.duet-p-0*/.duet-heading.h1.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h1.duet-m-0*/.duet-heading.h1.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 32.1428571429rem){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:2.25rem}}@media (min-width: 42.8571428571rem){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:3rem}}@media (max-width: 22.5em){/*!@.duet-heading.h1*/.duet-heading.h1.sc-duet-heading{font-size:1.5rem}}/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:5.8vw}/*!@.duet-heading.h2.duet-p-0*/.duet-heading.h2.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h2.duet-m-0*/.duet-heading.h2.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 25.8620689655rem){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:1.5rem}}@media (min-width: 38.7931034483rem){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:2.25rem}}@media (max-width: 22.5em){/*!@.duet-heading.h2*/.duet-heading.h2.sc-duet-heading{font-size:1.375rem}}/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{margin-bottom:12px !important;font-size:4.2vw}/*!@.duet-heading.h3.duet-p-0*/.duet-heading.h3.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h3.duet-m-0*/.duet-heading.h3.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 29.7619047619rem){/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{font-size:1.25rem}}@media (min-width: 35.7142857143rem){/*!@.duet-heading.h3*/.duet-heading.h3.sc-duet-heading{font-size:1.5rem}}/*!@.duet-heading.h3.duet-theme-turva*/.duet-heading.h3.duet-theme-turva.sc-duet-heading{font-style:normal}/*!@.duet-heading.h3.duet-heading-border*/.duet-heading.h3.duet-heading-border.sc-duet-heading{padding-bottom:20px}/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{margin-bottom:8px !important;font-size:4vw;letter-spacing:0}/*!@.duet-heading.h4.duet-p-0*/.duet-heading.h4.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h4.duet-m-0*/.duet-heading.h4.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 27.5rem){/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{font-size:1.1rem}}@media (min-width: 31.25rem){/*!@.duet-heading.h4*/.duet-heading.h4.sc-duet-heading{font-size:1.25rem}}/*!@.duet-heading.h4.duet-theme-turva*/.duet-heading.h4.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h4.duet-heading-border*/.duet-heading.h4.duet-heading-border.sc-duet-heading{padding-bottom:20px}/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{margin-bottom:8px !important;font-size:4vw;font-weight:600;letter-spacing:0}/*!@.duet-heading.h5.duet-p-0*/.duet-heading.h5.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h5.duet-m-0*/.duet-heading.h5.duet-m-0.sc-duet-heading{margin:0 !important}@media (max-width: 27.5rem){/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{font-size:1.1rem}}@media (min-width: 28.4090909091rem){/*!@.duet-heading.h5*/.duet-heading.h5.sc-duet-heading{font-size:1.1363636364rem}}/*!@.duet-heading.h5.duet-theme-turva*/.duet-heading.h5.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h5.duet-heading-border*/.duet-heading.h5.duet-heading-border.sc-duet-heading{padding-bottom:16px}/*!@.duet-heading.h6*/.duet-heading.h6.sc-duet-heading{margin-bottom:8px !important;font-size:1rem;font-weight:600;letter-spacing:0}/*!@.duet-heading.h6.duet-p-0*/.duet-heading.h6.duet-p-0.sc-duet-heading{padding:0 !important}/*!@.duet-heading.h6.duet-m-0*/.duet-heading.h6.duet-m-0.sc-duet-heading{margin:0 !important}/*!@.duet-heading.h6.duet-theme-turva*/.duet-heading.h6.duet-theme-turva.sc-duet-heading{font-style:normal;font-weight:700}/*!@.duet-heading.h6.duet-heading-border*/.duet-heading.h6.duet-heading-border.sc-duet-heading{padding-bottom:16px}/*!@.duet-heading.duet-semibold, .duet-heading.duet-theme-turva.duet-semibold*/.duet-heading.duet-semibold.sc-duet-heading,.duet-heading.duet-theme-turva.duet-semibold.sc-duet-heading{font-style:normal !important;font-weight:600 !important}";
 
 class DuetHeading {
   constructor(hostRef) {
@@ -9953,7 +9998,7 @@ class DuetHeading {
    * 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 (hAsync(TagName, { class: {
         "duet-heading": true,
@@ -10059,15 +10104,15 @@ class DuetHero {
      */
     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.
      */
@@ -10211,7 +10256,7 @@ class DuetHero {
       "categoryIconColor": [1, "category-icon-color"],
       "buttonLabel": [1, "button-label"],
       "language": [1025],
-      "accessibleLabelExternalDefaults": [16],
+      "accessibleLabelExternalDefaults": [1, "accessible-label-external-default"],
       "accessibleLabelExternal": [1, "accessible-label-external"],
       "buttonUrl": [1, "button-url"],
       "buttonId": [1, "button-id"],
@@ -10660,7 +10705,7 @@ class DuetInput {
   }; }
 }
 
-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}";
 
 class DuetLabel {
   constructor(hostRef) {
@@ -10826,8 +10871,7 @@ class DuetLink {
      */
     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;
@@ -10835,7 +10879,7 @@ class DuetLink {
      * 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.
      */
@@ -10881,7 +10925,7 @@ class DuetLink {
     "$members$": {
       "accessibleLabel": [1, "accessible-label"],
       "language": [1025],
-      "accessibleLabelExternalDefaults": [16],
+      "accessibleLabelExternalDefaults": [1, "accessible-label-external-default"],
       "accessibleLabelExternal": [1, "accessible-label-external"],
       "identifier": [1],
       "theme": [1025],
@@ -11203,10 +11247,10 @@ class DuetModal {
      */
     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",
@@ -11217,7 +11261,7 @@ class DuetModal {
      * 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.
      */
@@ -11384,7 +11428,7 @@ class DuetModal {
     "$tagName$": "duet-modal",
     "$members$": {
       "language": [1025],
-      "accessibleCloseLabelDefault": [16],
+      "accessibleCloseLabelDefaults": [1, "accessible-close-label-default"],
       "accessibleCloseLabel": [1, "accessible-close-label"],
       "size": [1],
       "gutterSize": [1, "gutter-size"],
@@ -11519,8 +11563,8 @@ class DuetNotificationDrawer {
      */
     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",
@@ -11531,7 +11575,7 @@ class DuetNotificationDrawer {
      * 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.
      */
@@ -11634,7 +11678,7 @@ class DuetNotificationDrawer {
       "icon": [1],
       "label": [1],
       "language": [1],
-      "accessibleLabelNotificationsDefaults": [16],
+      "accessibleLabelNotificationsDefaults": [1, "accessible-label-notification-default"],
       "accessibleLabelNotifications": [1, "accessible-label-notifications"],
       "badge": [4],
       "theme": [1025],
@@ -11705,37 +11749,52 @@ class DuetNumberInput {
      */
     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.
      */
@@ -11753,14 +11812,19 @@ class DuetNumberInput {
      */
     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.
      */
@@ -11998,15 +12062,19 @@ class DuetNumberInput {
       "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],
@@ -13216,14 +13284,19 @@ class DuetTabGroup {
      */
     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.
      */
@@ -13365,6 +13438,7 @@ class DuetTabGroup {
       "theme": [1025],
       "variation": [1],
       "language": [1025],
+      "labelDefaults": [1, "label-default"],
       "label": [1],
       "labelHidden": [4, "label-hidden"],
       "margin": [1],
@@ -13867,25 +13941,35 @@ class DuetTooltip {
      */
     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.
      */
@@ -14058,8 +14142,10 @@ class DuetTooltip {
     "$members$": {
       "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],
@@ -14103,25 +14189,35 @@ class DuetTray {
      */
     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.
      */
@@ -14195,7 +14291,9 @@ class DuetTray {
     "$tagName$": "duet-tray",
     "$members$": {
       "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],
@@ -14210,911 +14308,6 @@ class DuetTray {
   }; }
 }
 
-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 (hAsync("ol", { class: "duet-upload-filelist" },
-    data.valid.length !== 0 && (hAsync("li", null,
-      hAsync("duet-visually-hidden", null, "Files"),
-      hAsync("ul", null, data.valid.length !== 0 &&
-        data.valid.map(e => (hAsync("li", { class: "duet-upload-file" },
-          hAsync("div", { class: "duet-upload-file-container" },
-            hAsync("div", { class: "duet-upload-file-link" }, e.url ? (hAsync("duet-button", { variation: "plain", icon: "messaging-attachment", url: e.url },
-              e.item.name,
-              " (",
-              formatBytes(e.item.size),
-              ")")) : (`${e.item.name} (${formatBytes(e.item.size)})`)),
-            hAsync("ul", { class: "duet-upload-file-actions", role: "menubar", "aria-label": "file actions" },
-              e.progress < 100 && (hAsync("li", { role: "none" },
-                hAsync("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 && (hAsync("li", { role: "none" },
-                hAsync("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 && (hAsync("div", { class: "duet-upload-file-progress" },
-            hAsync("progress", { value: e.progress, max: "100" },
-              hAsync("div", { class: "progress-bar" },
-                hAsync("span", { style: { width: `${e.progress}%;` } },
-                  "Progress: ",
-                  e.progress,
-                  "%"))))))))))),
-    data.invalid.length !== 0 && (hAsync("li", null,
-      hAsync("duet-visually-hidden", null, "Files with Errors"),
-      hAsync("ul", null, data.invalid.map(e => {
-        return (hAsync("li", { class: "duet-upload-file duet-upload-file-errors" },
-          hAsync("div", { class: "duet-upload-file-container" },
-            hAsync("div", { class: "duet-upload-file-link duet-upload-file-link-error" },
-              hAsync("div", null,
-                e.item.name,
-                " (",
-                formatBytes(e.item.size),
-                ")"),
-              hAsync("div", { "data-error-type": e.error.type, "data-error-message": e.error.system_message }, getError(e.error.type))),
-            hAsync("ul", { class: "duet-upload-file-actions", role: "menubar", "aria-label": "file actions" },
-              hAsync("li", { role: "none" },
-                hAsync("duet-button", { role: "menuitem", variation: "destructive", icon: "action-delete", "icon-only": true, "icon-size": "large", margin: "none", onClick: ev => onDelete(e.item.name, ev) }))))));
-      }))))));
-};
-
-var 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 = "/*!@*,\n*::after,\n*::before*/*.sc-duet-upload,*.sc-duet-upload::after,*.sc-duet-upload::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host*/.sc-duet-upload-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}/*!@:host li*/.sc-duet-upload-h li.sc-duet-upload{list-style:none}/*!@.duet-upload*/.duet-upload.sc-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*/.duet-upload.sc-duet-upload li.sc-duet-upload{list-style:none}/*!@.duet-upload-file-errors*/.duet-upload-file-errors.sc-duet-upload{padding:20px 0;color:#de2362}/*!@.duet-upload-filelist*/.duet-upload-filelist.sc-duet-upload{margin-bottom:25px}/*!@.duet-upload-filelist-empty*/.duet-upload-filelist-empty.sc-duet-upload{display:flex;align-items:center;justify-content:center;width:100%;height:75px;margin:0 auto;background-color:#f3f9fc}/*!@.duet-upload-file*/.duet-upload-file.sc-duet-upload{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)*/.duet-upload-file.sc-duet-upload:first-of-type:not(.duet-upload-file-errors){border-top:1px solid #e1e3e6}/*!@.duet-upload-file-container*/.duet-upload-file-container.sc-duet-upload{display:flex;place-items:center;width:100%}/*!@.duet-upload-file-link*/.duet-upload-file-link.sc-duet-upload{display:flex;flex-grow:2;place-items:center}/*!@.duet-upload-file-link-error*/.duet-upload-file-link-error.sc-duet-upload{flex-direction:column;place-items:flex-start}/*!@.duet-upload-file-link duet-button*/.duet-upload-file-link.sc-duet-upload duet-button.sc-duet-upload{position:relative;top:6px}/*!@.duet-upload-file-actions*/.duet-upload-file-actions.sc-duet-upload{display:flex;transform:scale(0.8)}/*!@.duet-upload-file-progress*//*!@.duet-upload-file-progress .progress-bar*/.duet-upload-file-progress.sc-duet-upload .progress-bar.sc-duet-upload{position:relative;display:block;width:100%;height:15px;background-color:#f3f9fc;border-radius:0;box-shadow:none}/*!@.duet-upload-file-progress .progress-bar > span*/.duet-upload-file-progress.sc-duet-upload .progress-bar.sc-duet-upload>span.sc-duet-upload{display:block;text-indent:-9999px;background-color:#0077b3;border-radius:0}/*!@.duet-upload-file-progress progress[value]*/.duet-upload-file-progress.sc-duet-upload progress[value].sc-duet-upload{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*/.duet-upload-file-progress.sc-duet-upload progress[value].sc-duet-upload::-webkit-progress-bar{background-color:#f3f9fc;border-radius:0}/*!@.duet-upload-file-progress progress[value]::-webkit-progress-value*/.duet-upload-file-progress.sc-duet-upload progress[value].sc-duet-upload::-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*/.duet-upload-file-progress.sc-duet-upload progress[value].sc-duet-upload .sc-duet-upload::-moz-progress-bar{background-color:#f3f9fc}";
-
-/**
- * @slot header  - named slot - to place content after description / caption
- * @slot fileheader - named slot - to place content above filelist (only displayed when filelist contains items)
- * @slot filefooter - named slot - to place content below filelist (only displayed when filelist contains items)
- */
-class DuetUpload {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    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 (hAsync(Host, { class: { "duet-m-0": this.margin === "none" } }, hAsync("duet-fieldset", { label: this.label, caption: caption }, hAsync("slot", { name: "header" }), hAsync("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 && hAsync("slot", { name: "fileheader" }), hAsync(DuetUploadFileList, { data: this.getFilesAsArray(), onDelete: this.onDelete, onCancel: this.onCancel, getError: this.getI18nError }, hAsync("li", null, "testing something")), !!this.files.size && hAsync("slot", { name: "filefooter" }), hAsync("duet-spacer", { size: "large" }), hAsync("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), hAsync("duet-spacer", { size: "medium" }), (this.fileMaxReached || this.bytesMaxReached) && (hAsync("duet-alert", null, this.fileMaxReached && this.getI18nError("duet-upload-301"), this.bytesMaxReached && this.getI18nError("duet-upload-202"))), hAsync("duet-spacer", { size: "medium" }), hAsync("duet-visually-hidden", null, hAsync("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 getElement(this); }
-  static get watchers() { return {
-    "valid": ["watchValidHandler"]
-  }; }
-  static get style() { return duetUploadCss; }
-  static get cmpMeta() { return {
-    "$flags$": 9,
-    "$tagName$": "duet-upload",
-    "$members$": {
-      "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],
-      "setFocus": [64],
-      "getFiles": [64]
-    },
-    "$listeners$": undefined,
-    "$lazyBundleId$": "-",
-    "$attrsToReflect$": [["disabled", "disabled"], ["valid", "valid"]]
-  }; }
-}
-
 const duetVisuallyHiddenCss = "/*!@:host*/.sc-duet-visually-hidden-h{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}";
 
 class DuetVisuallyHidden {
@@ -15188,7 +14381,6 @@ registerComponents([
   DuetToggle,
   DuetTooltip,
   DuetTray,
-  DuetUpload,
   DuetVisuallyHidden,
 ]);