@duetds/components 6.9.0 → 6.9.2

package/lib/esm/duet-choice_2.entry.js

@@ -1,11 +1,11 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-9d169c3d.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-13f57135.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 import { D as DuetStringsExternalDefaults } from './common-strings-97e04e4b.js';
 import { c as createID } from './create-id-981107da.js';
-import { F as FocusGuard } from './focus-utils-123e9cba.js';
+import { F as FocusGuard } from './focus-utils-6a919f2a.js';
 import { i as isKeyboardClick, h as isQuestionKey, f as isEscapeKey } from './keyboard-utils-d237bd5a.js';
 import { g as getLanguage, a as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-6be16ff0.js';
 import { f as findCheckedOption, w as watchForOptions } from './watch-options-dd55bce8.js';

package/lib/esm/duet-collapsible.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-9d169c3d.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-13f57135.js';
 import { a as actionArrowDownSmall } from './action-arrow-down-small-82273dc8.js';
 import { f as font_size_medium, t as tokens } from './tokens-0963dc8b.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';

package/lib/esm/duet-combobox.entry.js

@@ -1,11 +1,11 @@
 /*!
  * Built with Duet Design System
  */
-import { h, F as Fragment, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-9d169c3d.js';
+import { h, F as Fragment, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-13f57135.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 import { d as debounce } from './js-utils-fa98b8cd.js';
 import { j as isEnterKey, f as isEscapeKey, o as isTabKey, b as isArrowUpKey, c as isArrowDownKey } from './keyboard-utils-d237bd5a.js';
-import { a as getLocaleString, g as getLanguage } from './language-utils-6be16ff0.js';
+import { g as getLanguage, a as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-6be16ff0.js';
 import { p as parsePossibleJSON } from './string-utils-5954f458.js';
 
 const SelectSingle = ({ item, search = "", selected }) => {
@@ -54,6 +54,7 @@ const DuetCombobox = class {
     this.listOpen = false;
     this.selectedItems = new Set();
     this.activeItem = undefined;
+    this.language = getLanguage();
     this.accessibleLabelDefaults = {
       en: {
         heading: "Select:",
@@ -84,6 +85,12 @@ const DuetCombobox = class {
   activeItemHandler(state) {
     this.input.accessibleActiveDescendant = this.listOpen && (state || state === 0) ? `active_item` : "";
   }
+  watchLanguageStateHandler(newValue, oldValue) {
+    if (newValue !== oldValue &&
+      this.accessibleLabels === getLocaleString(parsePossibleJSON(this.accessibleLabelDefaults), oldValue)) {
+      this.accessibleLabels = getLocaleString(parsePossibleJSON(this.accessibleLabelDefaults), newValue);
+    }
+  }
   handleDocumentClick(e) {
     //we want to remove all user text if they have NOT selected from the dropdown
     const path = e.composedPath();
@@ -119,6 +126,7 @@ const DuetCombobox = class {
       }
     });
     this.element.addEventListener("keydown", this.handleInputKeyDownEvent.bind(this));
+    connectLanguageChangeObserver(this);
     //add correct aria attributes to the input element
     this.input.accessibleAutocomplete = "list";
     this.input.accessibleControls = "duet-combobox-list-element";
@@ -131,6 +139,7 @@ const DuetCombobox = class {
       e.stopPropagation();
     });
     this.resizeObserver.disconnect();
+    disconnectLanguageChangeObserver(this);
   }
   componentDidLoad() {
     // observe resize events to dynamically adjust size of dropdown area
@@ -362,7 +371,8 @@ const DuetCombobox = class {
   }
   get element() { return getElement(this); }
   static get watchers() { return {
-    "activeItem": ["activeItemHandler"]
+    "activeItem": ["activeItemHandler"],
+    "language": ["watchLanguageStateHandler"]
   }; }
 };
 DuetCombobox.style = duetComboboxCss;

package/lib/esm/duet-contact-card.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-9d169c3d.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-13f57135.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 import { g as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-6be16ff0.js';
 import './string-utils-5954f458.js';

package/lib/esm/duet-cookie-consent.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-9d169c3d.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-13f57135.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 
 const duetCookieConsentCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:fixed;right:0;bottom:0;left:0;z-index:950;display:block;width:100%;box-shadow:0 2px 20px 0 rgba(0, 0, 0, 0.2)}@media (min-width: 48em){:host{right:28px;bottom:28px;left:auto;width:25rem}}:host(:focus){outline:0}:host(.user-is-tabbing:focus){border-radius:4px;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179)}:host(.user-is-tabbing.duet-theme-turva:focus){box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58)}.duet-cookie-consent{padding:20px;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;color:rgb(255, 255, 255) !important;background-color:rgba(0, 21, 39, 0.9)}@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none){.duet-cookie-consent{background:rgba(0, 21, 39, 0.8);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.duet-cookie-consent.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";background-color:rgba(12, 14, 29, 0.9)}@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none){.duet-cookie-consent.duet-theme-turva{background:rgba(12, 14, 29, 0.8)}}@media (min-width: 48em){.duet-cookie-consent{padding:20px;border-radius:4px}}.duet-cookie-consent-content{display:flex;align-items:center;max-width:1110px;margin:0 auto}.duet-cookie-consent-content .expand{flex:1}::slotted(a){font-weight:600;color:rgb(255, 255, 255) !important;text-decoration:underline;white-space:nowrap}::slotted(a[target=_blank]){padding-right:16px;background:url(\"data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjZmZmIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEwLjUgMmExLjUgMS41IDAgMDEuMTQgM0gzLjc1Yy0uMzggMC0uNy4yOC0uNzQuNjVsLS4wMS4xdjE0LjVjMCAuMzguMjguNy42NS43NGwuMS4wMWgxNC41Yy4zOCAwIC43LS4yOC43NC0uNjVsLjAxLS4xdi02Ljg5YTEuNSAxLjUgMCAwMTMgMHY2Ljg5QTMuNzUgMy43NSAwIDAxMTguMjUgMjRIMy43NUEzLjc1IDMuNzUgMCAwMTAgMjAuMjVWNS43NUEzLjc1IDMuNzUgMCAwMTMuNzUgMnptMTItMmMuNzggMCAxLjQyLjYgMS41IDEuMzZWNy41YTEuNSAxLjUgMCAwMS0zIC4xNFY1LjEybC01LjQ0IDUuNDRhMS41IDEuNSAwIDAxLTIuMjItMmwuMS0uMTJMMTguODggM0gxNi41QTEuNSAxLjUgMCAwMTE1IDEuNjRWMS41YzAtLjc4LjYtMS40MiAxLjM2LTEuNWguMTR6Ii8+PC9zdmc+\") no-repeat right 50%;background-size:12px 10px}::slotted(a:focus){outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px rgb(0, 119, 179)}.duet-theme-turva ::slotted(a:focus){outline:0;box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px rgb(23, 28, 58)}";

package/lib/esm/duet-date-picker.entry.js

@@ -1,10 +1,10 @@
 /*!
  * Built with Duet Design System
  */
-import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-9d169c3d.js';
+import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-13f57135.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 import { c as createID } from './create-id-981107da.js';
-import { F as FocusGuard } from './focus-utils-123e9cba.js';
+import { F as FocusGuard } from './focus-utils-6a919f2a.js';
 import { g as getLanguage, a as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-6be16ff0.js';
 import './string-utils-5954f458.js';
 

package/lib/esm/duet-divider_2.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, g as getElement, H as Host } from './index-9d169c3d.js';
+import { r as registerInstance, h, g as getElement, H as Host } from './index-13f57135.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 import { g as getColorByName } from './token-utils-6e0e2653.js';
 import './tokens.module-5601adc9.js';

package/lib/esm/duet-editable-table_3.entry.js

@@ -1,11 +1,11 @@
 /*!
  * Built with Duet Design System
  */
-import { h, r as registerInstance, c as createEvent, H as Host, g as getElement, F as Fragment } from './index-9d169c3d.js';
+import { h, r as registerInstance, c as createEvent, H as Host, g as getElement, F as Fragment } from './index-13f57135.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 import { f as fieldSorter, d as debounce } from './js-utils-fa98b8cd.js';
 import { i as isKeyboardClick } from './keyboard-utils-d237bd5a.js';
-import { a as getLocaleString, s as sanitizeString } from './language-utils-6be16ff0.js';
+import { g as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, a as getLocaleString, s as sanitizeString } from './language-utils-6be16ff0.js';
 import { p as sizeNavigation, s as sizeHeader } from './tokens.module-5601adc9.js';
 import { b as breakpointTokensUpTo, a as breakpointToToken } from './token-utils-6e0e2653.js';
 import { c as createID } from './create-id-981107da.js';
@@ -61,6 +61,7 @@ const DuetEditableTable = class {
         this.toggleColumn(column, e);
       }
     };
+    this.language = getLanguage();
     this.margin = "auto";
     this.variation = "striped";
     this.sticky = false;
@@ -83,6 +84,12 @@ const DuetEditableTable = class {
     this.hasHeadSlotFirst = !!this.element.querySelector("[slot='thead-first']");
     this.hasHeadSlotLast = !!this.element.querySelector("[slot='thead-last']");
   }
+  connectedCallback() {
+    connectLanguageChangeObserver(this);
+  }
+  disconnectedCallback() {
+    disconnectLanguageChangeObserver(this);
+  }
   createLabel(column) {
     const { sort_order, direction, index, label } = column;
     const i18nLabel = getLocaleString(label);
@@ -101,7 +108,7 @@ const DuetEditableTable = class {
       }
       return "action-subtract-small";
     };
-    return (h("span", { class: "duet-table-label", "data-index": index }, h("duet-button", { size: "small", icon: getButtonIcon(), "icon-size": "medium-small", "accessible-label": getLocaleString(this.sortableDefaultLabel), variation: "plain", margin: "none", "icon-right": true, onClick: event => this.toggleColumn(column, event), onKeyDown: event => this.handleKeyDown(column, event) }, i18nLabel)));
+    return (h("span", { class: "duet-table-label", "data-index": index }, h("duet-button", { size: "small", icon: getButtonIcon(), "icon-size": "medium-small", "accessible-label": this.sortableDefaultLabel[this.language], variation: "plain", margin: "none", "icon-right": true, onClick: event => this.toggleColumn(column, event), onKeyDown: event => this.handleKeyDown(column, event) }, i18nLabel)));
   }
   getSortedColumns() {
     //create a new array from sort instead of mutating original
@@ -130,7 +137,7 @@ const DuetEditableTable = class {
         const label = this.createLabel(column);
         return label !== "" ? h("th", { scope: "col" }, label) : h("td", null);
       }
-    }), this.actions && (h("th", { scope: "col", class: "duet-table-action-header-heading" }, this.actions && h("duet-visually-hidden", null, getLocaleString(this.actionColumnLabel))))));
+    }), this.actions && (h("th", { scope: "col", class: "duet-table-action-header-heading" }, this.actions && h("duet-visually-hidden", null, this.actionColumnLabel[this.language])))));
   }
   renderActions(rowItem, index) {
     // escape early
@@ -194,6 +201,7 @@ const DuetTable = class {
       this.matchesBreakpoint = breakpointTokensUpTo.includes(this.breakpoint) ? !mq.matches : mq.matches;
     };
     this.matchesBreakpoint = true;
+    this.language = getLanguage();
     this.theme = undefined;
     this.margin = "auto";
     this.variation = "striped";
@@ -202,6 +210,11 @@ const DuetTable = class {
     this.breakpoint = "small";
     this.hideHeadVisually = false;
   }
+  watchLanguageStateHandler(newValue, oldValue) {
+    if (newValue !== oldValue) {
+      setTimeout(() => this.copyHeadingsToCells(), 50);
+    }
+  }
   connectedCallback() {
     const token = this.breakpoint === "none" || this.breakpoint === "none-scrollable" ? "all" : breakpointToToken[this.breakpoint];
     this.mq = matchMedia(token);
@@ -230,6 +243,7 @@ const DuetTable = class {
     // that way we avoid dealing with any initial changes
     // and only get genuine mutations as rows are added/removed
     this.observer ? this.observer.takeRecords() : null;
+    connectLanguageChangeObserver(this);
   }
   disconnectedCallback() {
     this.observer.disconnect();
@@ -237,6 +251,7 @@ const DuetTable = class {
     this.mq.removeListener(this.handleMediaQueryChange);
     this.mq = null;
     this.matchesBreakpoint = true;
+    disconnectLanguageChangeObserver(this);
   }
   /**
    * Local methods.
@@ -266,6 +281,9 @@ const DuetTable = class {
       } }, h("slot", null)));
   }
   get element() { return getElement(this); }
+  static get watchers() { return {
+    "language": ["watchLanguageStateHandler"]
+  }; }
 };
 DuetTable.style = duetTableCss;
 
@@ -449,7 +467,6 @@ const UploadItem = ({ data, showLinks, type, actions, errorCodes, theme, label,
             h("duet-icon", { margin: "none", size: "x-small", name: "messaging-attachment" }),
             h("duet-spacer", { size: "xx-small", direction: "horizontal" }),
             name),
-          h("br", null),
           h("duet-progress", { progress: Math.ceil(progress), "aria-hidden": true })));
       case "pending":
         return (h("span", { class: "duet-upload-item-name" },
@@ -481,9 +498,7 @@ const UploadItem = ({ data, showLinks, type, actions, errorCodes, theme, label,
     "(",
     formatBytes(size),
     ")"));
-  const Badges = meta && meta.badges ? (h("span", null,
-    h("duet-spacer", { size: "xx-small" }),
-    meta.badges.map(badgeText => (h("duet-badge", { color: "primary" }, badgeText))))) : undefined;
+  const Badges = meta && meta.badges ? (h("span", null, meta.badges.map(badgeText => (h("duet-badge", { color: "primary" }, badgeText))))) : undefined;
   const actionDescription = `${meta && meta.badges ? meta.badges.join(",") : ""} ${name}`;
   return (h("div", { class: {
       "upload-item-row": true,
@@ -491,7 +506,7 @@ const UploadItem = ({ data, showLinks, type, actions, errorCodes, theme, label,
     showCategory && (h("div", { class: "item-categories" },
       h("duet-heading", { class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(categoryLabel)),
       Badges)),
-    h("div", { class: { "item-label": true, "no-category": !showCategory } },
+    h("div", { class: { "item-name": true, "no-category": !showCategory } },
       !!label && (h("duet-heading", { class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(label))),
       getFileNameLine()),
     h("div", { class: "item-actions" }, actions.map(actionItem => {
@@ -501,8 +516,8 @@ const UploadItem = ({ data, showLinks, type, actions, errorCodes, theme, label,
 
 const UploadItemHeader = ({ label, categoryLabel }) => {
   return (h("div", { class: "items-header" },
-    categoryLabel && (h("duet-heading", { class: "category-header", border: "solid", color: "gray-darker", level: "h3", "visual-level": "h6", weight: "semibold" }, getLocaleString(categoryLabel))),
-    h("duet-heading", { class: { "filename-header": true, "no-category": !categoryLabel }, border: "solid", color: "gray-darker", level: "h3", "visual-level": "h6", weight: "semibold" }, getLocaleString(label))));
+    categoryLabel && (h("duet-heading", { class: "category-header", border: "solid", color: "gray-darker", level: "h3", "visual-level": "h6", weight: "semibold", margin: "none" }, getLocaleString(categoryLabel))),
+    h("duet-heading", { class: { "filename-header": true, "no-category": !categoryLabel }, border: "solid", color: "gray-darker", level: "h3", "visual-level": "h6", weight: "semibold", margin: "none" }, getLocaleString(label))));
 };
 
 const validateFileExtension = (name, allowedExtensions) => {
@@ -628,7 +643,7 @@ const makeXhrRequest = ({ payload, options, onFailure, onSuccess, onProgress })
   return xhr;
 };
 
-const duetUploadCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}::slotted([slot=header]){margin-bottom:16px}::slotted([slot=fileheader]){margin:16px 0 0 0}::slotted([slot=filefooter]){margin-top:16px}.duet-upload{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.duet-upload-item-size{font-size:0.75rem;font-weight:400}.duet-upload-filelist{margin-bottom:25px}.duet-upload-filelist-empty{display:flex;align-items:center;justify-content:center;width:100%;height:75px;margin:0 auto;font-size:1rem;font-weight:400;background-color:rgb(245, 248, 250)}.duet-upload-filelist-empty-label{font-size:1rem;font-weight:400}.duet-upload-editable-table-header-hidden{display:none}.duet-upload-editable-table tbody .duet-upload-editable-table-data{padding:0 !important;border:0}.duet-upload-editable-table duet-editable-table tfoot,.duet-upload-editable-table duet-editable-table thead{display:none}.duet-upload-editable-table duet-editable-table .duet-editable-table-content{padding-right:0 !important;padding-left:0 !important}.duet-upload-editable-table duet-editable-table duet-table .duet-table-action-row td{padding:1rem 0 !important}.duet-upload-editable-table duet-editable-table duet-table .duet-table-action-row td:last-child{padding-right:0 !important}.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress,.duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending{position:relative}.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress duet-progress,.duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending duet-progress{position:absolute;bottom:0;width:100%}.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress duet-action-button::part(button),.duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending duet-action-button::part(button){border:0}duet-paragraph::part(duet-paragraph){word-break:break-word}duet-editable-table tfoot{display:none}.upload-bottom-caption{margin-top:8px;margin-bottom:8px}.items-header{display:none;flex-direction:row}@media (min-width: 36em){.items-header{display:flex}}.items-header:not(:last-child),.items-header:not(:first-child){margin-top:12px}.items-header .category-header{width:35%}.items-header .filename-header{width:65%}.items-header .filename-header.no-category{width:100%}.upload-item-row{display:flex;flex-direction:column;gap:10px;align-content:center;align-items:center;padding:16px 0 16px 0;border-bottom:1px solid rgb(225, 227, 230)}@media (min-width: 36em){.upload-item-row{flex-direction:row}}.upload-item-row .item-categories{width:100%;margin-bottom:8px}@media (min-width: 36em){.upload-item-row .item-categories{width:35%}}.upload-item-row .item-label{width:100%;margin-bottom:8px;text-align:left}@media (min-width: 36em){.upload-item-row .item-label{width:50%}.upload-item-row .item-label.no-category{width:85%}}.upload-item-row .item-categories .heading,.upload-item-row .item-label .heading{display:block}@media (min-width: 36em){.upload-item-row .item-categories .heading,.upload-item-row .item-label .heading{display:none}}.upload-item-row .item-actions{width:100%;text-align:left}@media (min-width: 36em){.upload-item-row .item-actions{width:15%;text-align:right}}.upload-item-row .duet-upload-item-name duet-icon{position:relative;top:4px}";
+const duetUploadCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}::slotted([slot=header]){margin-bottom:16px}::slotted([slot=fileheader]){margin:16px 0 0 0}::slotted([slot=filefooter]){margin-top:16px}::slotted([slot=uploadfooter]){margin-top:20px}.duet-upload{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.duet-upload-item-size{font-size:0.75rem;font-weight:400}.duet-upload-filelist{margin-bottom:25px}.duet-upload-filelist-empty{display:flex;align-items:center;justify-content:center;width:100%;height:75px;margin:0 auto;font-size:1rem;font-weight:400;background-color:rgb(245, 248, 250)}.duet-upload-filelist-empty-label{font-size:1rem;font-weight:400}.duet-upload-editable-table-header-hidden{display:none}.duet-upload-editable-table tbody .duet-upload-editable-table-data{padding:0 !important;border:0}.duet-upload-editable-table duet-editable-table tfoot,.duet-upload-editable-table duet-editable-table thead{display:none}.duet-upload-editable-table duet-editable-table .duet-editable-table-content{padding-right:0 !important;padding-left:0 !important}.duet-upload-editable-table duet-editable-table duet-table .duet-table-action-row td{padding:1rem 0 !important}.duet-upload-editable-table duet-editable-table duet-table .duet-table-action-row td:last-child{padding-right:0 !important}.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress,.duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending{position:relative}.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress duet-progress,.duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending duet-progress{position:absolute;bottom:0;width:100%}.duet-upload-editable-table duet-editable-table .duet-editable-table-row-inprogress duet-action-button::part(button),.duet-upload-editable-table duet-editable-table .duet-editable-table-row-pending duet-action-button::part(button){border:0}duet-paragraph::part(duet-paragraph){word-break:break-word}duet-editable-table tfoot{display:none}.upload-bottom-caption{margin-top:12px;margin-bottom:28px}.items-header{display:none;flex-direction:row;margin-bottom:0}@media (min-width: 36em){.items-header{display:flex}}.items-header:not(:last-child),.items-header:not(:first-child){margin-top:12px}.items-header .category-header{width:35%}.items-header .filename-header{width:65%}.items-header .filename-header.no-category{width:100%}.upload-item-row{display:flex;flex-direction:column;gap:16px;align-content:center;align-items:center;padding:16px 0 16px 0;border-bottom:1px solid rgb(225, 227, 230)}@media (min-width: 36em){.upload-item-row{flex-direction:row;gap:10px}}.upload-item-row .item-categories{width:100%}@media (min-width: 36em){.upload-item-row .item-categories{width:35%}}.upload-item-row .item-name{position:relative;bottom:2px;width:100%;text-align:left}@media (min-width: 36em){.upload-item-row .item-name{width:50%}.upload-item-row .item-name.no-category{width:85%}}.upload-item-row .item-categories .heading,.upload-item-row .item-name .heading{display:block}@media (min-width: 36em){.upload-item-row .item-categories .heading,.upload-item-row .item-name .heading{display:none}}.upload-item-row .item-actions{width:100%;margin-left:-8px;text-align:left}@media (min-width: 36em){.upload-item-row .item-actions{width:15%;padding-top:0;margin-left:auto;text-align:right}}.upload-item-row .duet-upload-item-name duet-icon{position:relative;top:4px}.upload-item-row .duet-upload-item-name duet-progress{display:block;margin-top:16px}";
 
 const DuetUpload = class {
   constructor(hostRef) {
@@ -1314,7 +1329,7 @@ const DuetUpload = class {
       this.externalUploadButton.ariaLabel = caption;
     }
     // @ts-ignore
-    return (h(Host, { class: { "duet-m-0": this.margin === "none" } }, h("duet-fieldset", { "label-hidden": this.hideHeader, label: this.label, caption: !this.captionOnBottom ? caption : undefined }, h("slot", { name: "header" }), !this.files.size && (h("duet-empty-state", { id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, h("duet-paragraph", { margin: "none" }, this.fileListEmpty))), !!this.files.size && h("slot", { name: "fileheader" }), !!this.files.size && (h("duet-upload-aria-status", { invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && h("slot", { name: "filefooter" }), h("slot", { name: "uploadfooter" }), this.captionOnBottom && (h("duet-caption", { size: "small" }, h("div", { class: "upload-bottom-caption" }, caption))), h("slot", { name: "afterfooter" }), h("duet-spacer", { size: "large" }), !this.hideButton && (h("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", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel)), h("duet-spacer", { size: "medium" }), (this.fileMaxReached || this.bytesMaxReached) && (h("duet-alert", { part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes))), h("duet-spacer", { size: "medium" }), h("duet-visually-hidden", { "aria-hidden": "true" }, h("input", { ref: input => {
+    return (h(Host, { class: { "duet-m-0": this.margin === "none" } }, h("duet-fieldset", { "label-hidden": this.hideHeader, label: this.label, caption: !this.captionOnBottom ? caption : undefined }, h("slot", { name: "header" }), !this.files.size && (h("duet-empty-state", { id: this.labelId, part: this.identifier ? `${this.identifier}-empty-state` : "duet-upload-empty-state", icon: "messaging-attachment" }, h("duet-paragraph", { margin: "none" }, this.fileListEmpty))), !!this.files.size && h("slot", { name: "fileheader" }), !!this.files.size && (h("duet-upload-aria-status", { invalid: this.getFilesAsArray().invalid.length, valid: this.getFilesAsArray().valid.length, inprogress: this.filesInProgress.size, total: this.files.size, statusMessageLabel: this.internalStatusMessageLabel })), !!this.files.size && this.renderUploadedItems(), !!this.files.size && h("slot", { name: "filefooter" }), h("slot", { name: "uploadfooter" }), this.captionOnBottom && (h("duet-caption", { margin: "none", size: "small" }, h("div", { class: "upload-bottom-caption" }, caption))), h("slot", { name: "afterfooter" }), !this.hideButton && (h(Fragment, null, h("duet-spacer", { size: "large" }), h("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", part: this.identifier ? `${this.identifier}-button-upload` : "duet-upload-button-upload" }, this.buttonLabel))), (this.fileMaxReached || this.bytesMaxReached) && (h(Fragment, null, h("duet-spacer", { size: "medium" }), h("duet-alert", { part: this.identifier ? `${this.identifier}-error-notification` : "duet-upload-error-notification" }, this.fileMaxReached && getI18nError("duet-upload-301", this.errorCodes), this.bytesMaxReached && getI18nError("duet-upload-202", this.errorCodes)))), h("duet-visually-hidden", { "aria-hidden": "true" }, h("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,

package/lib/esm/duet-empty-state.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host } from './index-9d169c3d.js';
+import { r as registerInstance, h, H as Host } from './index-13f57135.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 
 const duetEmptyStateCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%;height:100%}.duet-empty-state{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;width:100%;height:100%;padding:48px;color:rgb(0, 41, 77);text-align:center;background:rgb(245, 248, 250);border-radius:4px}.duet-empty-state.duet-theme-turva{color:rgb(23, 28, 58);background:rgb(245, 245, 247)}";

package/lib/esm/duet-fieldset.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-9d169c3d.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-13f57135.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 import { c as createID } from './create-id-981107da.js';
 
@@ -35,7 +35,11 @@ const DuetFieldset = class {
    * Always the last one in the class.
    */
   render() {
-    return (h(Host, { class: { "duet-m-0": this.margin === "none" } }, h("fieldset", { "aria-labelledby": `${this.errorId} ${this.labelId}`, "aria-errormessage": this.error ? this.errorId : null, class: {
+    return (h(Host, { class: { "duet-m-0": this.margin === "none" } }, h("fieldset", { "aria-labelledby": this.labelId, "aria-describedby": this.error ? this.errorId : null,
+      // NVDA and VoiceOver do not yet support aria-errormessage
+      // once they do, we can remove errors from the aria-describedby
+      // aria-errormessage={this.error ? this.errorId : null}
+      class: {
         "duet-fieldset": true,
         "duet-theme-turva": this.theme === "turva",
       } }, h("legend", { id: this.labelId }, h("span", null, this.label), this.caption && h("span", null, this.caption)), h("div", { class: {

package/lib/esm/duet-footer.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent$1, h, F as Fragment, g as getElement } from './index-9d169c3d.js';
+import { r as registerInstance, c as createEvent$1, h, F as Fragment, g as getElement } from './index-13f57135.js';
 import { a as actionArrowRight } from './action-arrow-right-f7d56681.js';
 import { a as actionNewWindowSmall } from './action-new-window-small-1945be91.js';
 import { D as DuetStringsExternalDefaults } from './common-strings-97e04e4b.js';

package/lib/esm/duet-grid_2.entry.js

@@ -1,12 +1,12 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, g as getElement, H as Host } from './index-9d169c3d.js';
+import { r as registerInstance, h, g as getElement, H as Host } from './index-13f57135.js';
 import { m as media_query_large, a as media_query_medium, b as media_query_small } from './tokens-0963dc8b.js';
 import { w as watchForOptions, a as watchForElement } from './watch-options-dd55bce8.js';
 import { i as inheritGlobalTheme } from './themeable-component-cb76be7c.js';
 
-const duetGridCss = ".sc-duet-grid-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:flex !important;flex-direction:column !important;align-items:flex-start !important;justify-content:flex-start !important;width:100%;max-width:100%;height:auto}.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:row !important}@media (max-width: 22.5em){.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:column !important}}@media (min-width: 36em){.duet-grid-breakpoint-small.sc-duet-grid-h{flex-direction:row !important}}@media (min-width: 48em){.duet-grid-breakpoint-medium.sc-duet-grid-h{flex-direction:row !important}}@media (min-width: 62em){.duet-grid-breakpoint-large.sc-duet-grid-h{flex-direction:row !important}}@media (min-width: 64.0625em){.duet-grid-breakpoint-x-large.sc-duet-grid-h{flex-direction:row !important}}.duet-grid-wrap.sc-duet-grid-h{flex-wrap:wrap !important}.duet-no-stacking.sc-duet-grid-h{flex-direction:row !important}.duet-grid-direction-vertical.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:column !important}@media (max-width: 35.9375em){.duet-grid-direction-vertical.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-small.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 36em){.duet-grid-direction-vertical.duet-grid-breakpoint-small.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-medium.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 48em){.duet-grid-direction-vertical.duet-grid-breakpoint-medium.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-large.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 62em){.duet-grid-direction-vertical.duet-grid-breakpoint-large.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-x-large.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 64.0625em){.duet-grid-direction-vertical.duet-grid-breakpoint-x-large.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-align-top.duet-no-stacking.sc-duet-grid-h{align-items:flex-start !important}.duet-grid-align-bottom.duet-no-stacking.sc-duet-grid-h{align-items:flex-end !important}.duet-grid-align-center.duet-no-stacking.sc-duet-grid-h{align-items:center !important}.duet-grid-align-stretch.duet-no-stacking.sc-duet-grid-h{align-items:stretch !important}.duet-grid-align-baseline.duet-no-stacking.sc-duet-grid-h{align-items:baseline !important}.duet-grid-align-top.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:flex-start !important}.duet-grid-align-bottom.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:flex-end !important}.duet-grid-align-center.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:center !important}.duet-grid-align-stretch.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:stretch !important}.duet-grid-align-baseline.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:baseline !important}@media (min-width: 36em){.duet-grid-align-top.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 36em){.duet-grid-align-bottom.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 36em){.duet-grid-align-center.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:center !important}}@media (min-width: 36em){.duet-grid-align-stretch.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 36em){.duet-grid-align-baseline.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:baseline !important}}@media (min-width: 48em){.duet-grid-align-top.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 48em){.duet-grid-align-bottom.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 48em){.duet-grid-align-center.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:center !important}}@media (min-width: 48em){.duet-grid-align-stretch.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 48em){.duet-grid-align-baseline.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:baseline !important}}@media (min-width: 62em){.duet-grid-align-top.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 62em){.duet-grid-align-bottom.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 62em){.duet-grid-align-center.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:center !important}}@media (min-width: 62em){.duet-grid-align-stretch.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 62em){.duet-grid-align-baseline.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:baseline !important}}@media (min-width: 64.0625em){.duet-grid-align-top.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 64.0625em){.duet-grid-align-bottom.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 64.0625em){.duet-grid-align-center.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:center !important}}@media (min-width: 64.0625em){.duet-grid-align-stretch.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 64.0625em){.duet-grid-align-baseline.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:baseline !important}}.duet-grid-distribution-left.sc-duet-grid-h{justify-content:flex-start !important}.duet-grid-distribution-right.sc-duet-grid-h{justify-content:flex-end !important}.duet-grid-distribution-center.sc-duet-grid-h{justify-content:center !important}.duet-grid-distribution-between.sc-duet-grid-h{justify-content:space-between !important}.duet-grid-distribution-around.sc-duet-grid-h{justify-content:space-around !important}.duet-grid-distribution-evenly.sc-duet-grid-h{justify-content:space-evenly !important}@media (max-width: 35.9375em){.duet-grid-mobile-left.sc-duet-grid-h{align-items:flex-start !important;justify-content:flex-start !important;text-align:left !important}}@media (max-width: 35.9375em){.duet-grid-mobile-center.sc-duet-grid-h{align-items:center !important;justify-content:center !important;text-align:center !important}.duet-grid-mobile-center.sc-duet-grid-h *.sc-duet-grid{text-align:center !important}}@media (max-width: 35.9375em){.duet-grid-mobile-right.sc-duet-grid-h{align-items:flex-end !important;justify-content:flex-end !important;text-align:right !important}.duet-grid-mobile-right.sc-duet-grid-h *.sc-duet-grid{text-align:right !important}}";
+const duetGridCss = ".sc-duet-grid-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:flex !important;flex-direction:column !important;align-items:flex-start !important;justify-content:flex-start !important;width:100%;max-width:100%;height:auto}.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:row !important}.duet-grid-breakpoint-x-small.duet-grid-row-reverse.sc-duet-grid-h{flex-direction:row-reverse !important}@media (max-width: 22.5em){.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:column !important}}@media (min-width: 36em){.duet-grid-breakpoint-small.sc-duet-grid-h{flex-direction:row !important}.duet-grid-breakpoint-small.duet-grid-row-reverse.sc-duet-grid-h{flex-direction:row-reverse !important}}@media (min-width: 48em){.duet-grid-breakpoint-medium.sc-duet-grid-h{flex-direction:row !important}.duet-grid-breakpoint-medium.duet-grid-row-reverse.sc-duet-grid-h{flex-direction:row-reverse !important}}@media (min-width: 62em){.duet-grid-breakpoint-large.sc-duet-grid-h{flex-direction:row !important}.duet-grid-breakpoint-large.duet-grid-row-reverse.sc-duet-grid-h{flex-direction:row-reverse !important}}@media (min-width: 64.0625em){.duet-grid-breakpoint-x-large.sc-duet-grid-h{flex-direction:row !important}.duet-grid-breakpoint-x-large.duet-grid-row-reverse.sc-duet-grid-h{flex-direction:row-reverse !important}}.duet-grid-wrap.sc-duet-grid-h{flex-wrap:wrap !important}.duet-no-stacking.sc-duet-grid-h{flex-direction:row !important}.duet-no-stacking.duet-grid-row-reverse.sc-duet-grid-h{flex-direction:row-reverse !important}.duet-grid-direction-vertical.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:column !important}@media (max-width: 35.9375em){.duet-grid-direction-vertical.duet-grid-breakpoint-x-small.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-small.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 36em){.duet-grid-direction-vertical.duet-grid-breakpoint-small.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-medium.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 48em){.duet-grid-direction-vertical.duet-grid-breakpoint-medium.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-large.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 62em){.duet-grid-direction-vertical.duet-grid-breakpoint-large.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-direction-vertical.duet-grid-breakpoint-x-large.sc-duet-grid-h{flex-direction:column !important}@media (min-width: 64.0625em){.duet-grid-direction-vertical.duet-grid-breakpoint-x-large.sc-duet-grid-h{flex-direction:column !important}}.duet-grid-align-top.duet-no-stacking.sc-duet-grid-h{align-items:flex-start !important}.duet-grid-align-bottom.duet-no-stacking.sc-duet-grid-h{align-items:flex-end !important}.duet-grid-align-center.duet-no-stacking.sc-duet-grid-h{align-items:center !important}.duet-grid-align-stretch.duet-no-stacking.sc-duet-grid-h{align-items:stretch !important}.duet-grid-align-baseline.duet-no-stacking.sc-duet-grid-h{align-items:baseline !important}.duet-grid-align-top.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:flex-start !important}.duet-grid-align-bottom.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:flex-end !important}.duet-grid-align-center.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:center !important}.duet-grid-align-stretch.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:stretch !important}.duet-grid-align-baseline.duet-grid-breakpoint-x-small.sc-duet-grid-h{align-items:baseline !important}@media (min-width: 36em){.duet-grid-align-top.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 36em){.duet-grid-align-bottom.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 36em){.duet-grid-align-center.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:center !important}}@media (min-width: 36em){.duet-grid-align-stretch.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 36em){.duet-grid-align-baseline.duet-grid-breakpoint-small.sc-duet-grid-h{align-items:baseline !important}}@media (min-width: 48em){.duet-grid-align-top.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 48em){.duet-grid-align-bottom.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 48em){.duet-grid-align-center.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:center !important}}@media (min-width: 48em){.duet-grid-align-stretch.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 48em){.duet-grid-align-baseline.duet-grid-breakpoint-medium.sc-duet-grid-h{align-items:baseline !important}}@media (min-width: 62em){.duet-grid-align-top.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 62em){.duet-grid-align-bottom.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 62em){.duet-grid-align-center.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:center !important}}@media (min-width: 62em){.duet-grid-align-stretch.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 62em){.duet-grid-align-baseline.duet-grid-breakpoint-large.sc-duet-grid-h{align-items:baseline !important}}@media (min-width: 64.0625em){.duet-grid-align-top.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:flex-start !important}}@media (min-width: 64.0625em){.duet-grid-align-bottom.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:flex-end !important}}@media (min-width: 64.0625em){.duet-grid-align-center.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:center !important}}@media (min-width: 64.0625em){.duet-grid-align-stretch.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:stretch !important}}@media (min-width: 64.0625em){.duet-grid-align-baseline.duet-grid-breakpoint-x-large.sc-duet-grid-h{align-items:baseline !important}}.duet-grid-distribution-left.sc-duet-grid-h{justify-content:flex-start !important}.duet-grid-distribution-right.sc-duet-grid-h{justify-content:flex-end !important}.duet-grid-distribution-center.sc-duet-grid-h{justify-content:center !important}.duet-grid-distribution-between.sc-duet-grid-h{justify-content:space-between !important}.duet-grid-distribution-around.sc-duet-grid-h{justify-content:space-around !important}.duet-grid-distribution-evenly.sc-duet-grid-h{justify-content:space-evenly !important}@media (max-width: 35.9375em){.duet-grid-mobile-left.sc-duet-grid-h{align-items:flex-start !important;justify-content:flex-start !important;text-align:left !important}}@media (max-width: 35.9375em){.duet-grid-mobile-center.sc-duet-grid-h{align-items:center !important;justify-content:center !important;text-align:center !important}.duet-grid-mobile-center.sc-duet-grid-h *.sc-duet-grid{text-align:center !important}}@media (max-width: 35.9375em){.duet-grid-mobile-right.sc-duet-grid-h{align-items:flex-end !important;justify-content:flex-end !important;text-align:right !important}.duet-grid-mobile-right.sc-duet-grid-h *.sc-duet-grid{text-align:right !important}}";
 
 function isGridItem(element) {
   return element.tagName.toLowerCase() === "duet-grid-item";
@@ -23,6 +23,7 @@ const DuetGrid = class {
     this.responsive = false;
     this.breakpoint = "small";
     this.direction = "horizontal";
+    this.rowReverse = false;
     this.alignment = "top";
     this.distribution = "default";
     this.mobile = "";
@@ -145,6 +146,7 @@ const DuetGrid = class {
         "duet-grid-breakpoint-medium": this.breakpoint === "medium",
         "duet-grid-breakpoint-large": this.breakpoint === "large",
         "duet-grid-breakpoint-x-large": this.breakpoint === "x-large",
+        "duet-grid-row-reverse": this.rowReverse,
       } }));
   }
   get element() { return getElement(this); }

package/lib/esm/duet-header_2.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { h, r as registerInstance, c as createEvent$1, B as Build, H as Host, F as Fragment, g as getElement } from './index-9d169c3d.js';
+import { h, r as registerInstance, c as createEvent$1, B as Build, H as Host, F as Fragment, g as getElement } from './index-13f57135.js';
 import { f as formSearch } from './form-search-ea8e19ae.js';
 import { m as media_query_large } from './tokens-0963dc8b.js';
 import { d as disableBodyScroll, e as enableBodyScroll } from './bodyScrollLock.es6-61b5e9a4.js';
@@ -303,6 +303,17 @@ const DuetHeader = class {
     this.contactItems = undefined;
     this.languageItems = undefined;
   }
+  watchLanguageStateHandler(newValue, oldValue) {
+    if (newValue !== oldValue && this.accessibleLabel === this.accessibleLabelDefaults[oldValue]) {
+      this.accessibleLabel = getLocaleString(this.accessibleLabelDefaults, newValue);
+    }
+    if (newValue !== oldValue && this.accessibleI18nLabels === this.accessibleI18nLabelsDefaults[oldValue]) {
+      this.accessibleI18nLabels = getLocaleString(this.accessibleI18nLabelsDefaults, newValue);
+    }
+    if (newValue !== oldValue && this.accessibleLabelExternal === this.accessibleLabelExternalDefaults[oldValue]) {
+      this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults, newValue);
+    }
+  }
   /**
    * Component lifecycle events.
    */
@@ -319,6 +330,7 @@ const DuetHeader = class {
         this.boundMqlFunctions[i] = bound;
       }
     }
+    connectLanguageChangeObserver(this);
   }
   disconnectedCallback() {
     if (this.navigationEl) {
@@ -331,6 +343,7 @@ const DuetHeader = class {
       }
     }
     this.boundMqlFunctions = [];
+    disconnectLanguageChangeObserver(this);
   }
   /**
    * Component event handling.
@@ -567,6 +580,7 @@ const DuetHeader = class {
   }
   get element() { return getElement(this); }
   static get watchers() { return {
+    "language": ["watchLanguageStateHandler"],
     "user": ["refresh"],
     "items": ["refresh"],
     "session": ["refresh"],