@duetds/components 10.0.0-alpha.26 → 10.0.0-alpha.28

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

@@ -1,17 +1,17 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BPFqbaxm.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BfHFKBVa.js';
 import { g as getDefaultExportFromCjs } from './_commonjsHelpers-DvwKrUS6.js';
 import { s as searchIcon } from './form-search-CevX33LA.js';
-import { i as inheritGlobalTheme } from './themeable-component-Csv1RXxf.js';
-import { D as DuetInternalLabel } from './label-BGqhM4kx.js';
+import { i as inheritGlobalTheme } from './themeable-component-D9rAA2iK.js';
+import { D as DuetInternalLabel } from './label-BewTofiP.js';
 import { c as createID } from './create-id-Cfr_DJqU.js';
 import { c as cleanValue, r as resetCursor } from './input-utils-CLDy7YaM.js';
 import { a as isEscapeKey, c as isEnterKey, o as isBackspaceKey, d as isArrowLeftKey, f as isArrowRightKey } from './keyboard-utils-Db8rvjPI.js';
-import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './language-utils-CNMTW_pZ.js';
-import { c as checkNamedSlotElement, p as proxyInputToSlot } from './slot-utils-BABbKvvc.js';
-import { g as getColorByName } from './token-utils-BGFYWQ6j.js';
+import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './language-utils-BvGD3xAJ.js';
+import { c as checkNamedSlotElement, p as proxyInputToSlot } from './slot-utils-QOcACBKy.js';
+import { g as getColorByName } from './token-utils-C-c-tsXV.js';
 import './string-utils-C6E9F6QT.js';
 import './tokens.module-Z0D6Gy9e.js';
 
@@ -550,7 +550,7 @@ const DuetInput = class {
             this.type !== "password" &&
             this.type !== "time" &&
             this.variation !== "button";
-        return (h(Host, { key: 'b937912982c9ab26076a7a8ef6d92d86721f1e52', class: { "duet-expand": this.expand, "duet-m-0": this.margin === "none" }, onKeyUp: e => this.keyHandler(e) }, this.type === "time" && (h("duet-visually-hidden", { key: 'f2c5263ad8bdc5420c0a57bb0de0257172dce64a', "aria-live": "polite", "aria-atomic": "true" }, selectedTime ? `${this.timeAnnouncement[this.language]} ${selectedTime.toLocaleTimeString()}` : "")), h("div", { key: 'fc9419ac20d284a2d74922a41f66e6457ce2f68d', class: {
+        return (h(Host, { key: 'a510fa25a1bfafc15b45ec3ae52673542c9431f8', class: { "duet-expand": this.expand, "duet-m-0": this.margin === "none" }, onKeyUp: e => this.keyHandler(e) }, this.type === "time" && (h("duet-visually-hidden", { key: 'de872f33e40e697f2bfbbd44cf50baa6119d7cf1', "aria-live": "polite", "aria-atomic": "true" }, selectedTime ? `${this.timeAnnouncement[this.language]} ${selectedTime.toLocaleTimeString()}` : "")), h("div", { key: 'c90de920afdad7d205699cea7d5f4fdd1572a87b', class: {
                 "duet-input-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 [`duet-input-variation-${this.variation}`]: true,
@@ -564,7 +564,7 @@ const DuetInput = class {
                 "has-clear": this.clear,
                 "has-focus": this.isFocused,
                 disabled: this.disabled,
-            } }, h("div", { key: '42a3f546f411b3179ed4224d0c1847be2cb4bd17', class: "duet-input-label-container" }, h(DuetInternalLabel, { key: '50f07e14449aa88f4f8f67b5c21fb23c435b318c', theme: this.theme === "turva" ? "turva" : "default", margin: this.isCaptionVisible ? "small" : "auto", color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (h("duet-tooltip", { key: '9161fff80a689ae4fa7fa7bc4532fef2b48cf8c7', class: "duet-input-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), h("slot", { key: '17c98bf119774ef6606bac7117cb0826215fcfda', name: "tooltip" })), this.caption && (h("duet-caption", { key: 'df3c5e4b0ca4830cec0e0ace48520847688f79bc', id: this.topCaptionId, size: "medium" }, this.caption)), h("div", { key: '9cc334f9c6d565a5ad325c9218c6a2e24a04444b', class: "duet-input-relative" }, this.placeholder && this.echoPlaceholder && (this.value || this.type === "time") && (h("duet-caption", { key: '3d24e72417e5f1d4b744a37e9847f7e0dd5e387e', id: this.topCaptionPlaceholderId, class: "duet-input-placeholder", margin: "none", size: "small" }, this.placeholder)), this.chips && (h("duet-visually-hidden", { key: '3d28cc9d073f283b5f58524a9cb274b61808aaeb', id: this.chipCountId }, ", ", `${this.getAllChips().length} ${getLocaleString(this.chipsSelectedDesriptionLabel)}`, ",")), this.variation === "button-left" && h("slot", { key: 'a153bedd03fe832c4dbfc1911c3469872ef45425', name: "button-left" }), h("input", Object.assign({ key: '6ef60b5b5ec7b53ec70114bf9cd75c354fe81c36', ref: input => (this.nativeInput = input), onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, type: this.getInputType(), class: {
+            } }, h("div", { key: '25af0df12601480977d1073be0dac1f37edce26e', class: "duet-input-label-container" }, h(DuetInternalLabel, { key: '8472acbdb1f02f3177acb1cc359b684359577c97', theme: this.theme === "turva" ? "turva" : "default", margin: this.isCaptionVisible ? "small" : "auto", color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (h("duet-tooltip", { key: '6ae13a9809afd8abea403d05594d0ac605043f13', class: "duet-input-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), h("slot", { key: '456f3ee403878a23c7141e9b063c8d8e04e95be2', name: "tooltip" })), this.caption && (h("duet-caption", { key: 'c4c6f0174d210348bbbab129508fc99917243f2c', id: this.topCaptionId, size: "medium" }, this.caption)), h("div", { key: 'ba63a0017715fab0c39fca2a948c9bfbfdad1f31', class: "duet-input-relative" }, this.placeholder && this.echoPlaceholder && (this.value || this.type === "time") && (h("duet-caption", { key: 'eaad95087d69b5b4a8e72b43ddb184bf8b941087', id: this.topCaptionPlaceholderId, class: "duet-input-placeholder", margin: "none", size: "small" }, this.placeholder)), this.chips && (h("duet-visually-hidden", { key: '2013c4ffb1127068ced232f02ef8885f3e8f614e', id: this.chipCountId }, ", ", `${this.getAllChips().length} ${getLocaleString(this.chipsSelectedDesriptionLabel)}`, ",")), this.variation === "button-left" && h("slot", { key: '5fbfb4ca2fd57a0ae853d4ec2512c79fa85aefd0', name: "button-left" }), h("input", Object.assign({ key: '060cab78180db35d613d8e8944ae17fc61dcb7c8', ref: input => (this.nativeInput = input), onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, type: this.getInputType(), class: {
                 "duet-input": true,
                 disabled: this.disabled,
                 "is-number": this.component === "number",
@@ -572,17 +572,17 @@ const DuetInput = class {
                 "after-chip": this.getAllChips().length > 0,
                 "align-right": this.inputAlign === "right",
                 [`input-padding-${this.inputPadding}`]: true,
-            }, value: this.value, disabled: this.disabled, "aria-invalid": this.error ? "true" : "false", "aria-labelledby": this.accessibleLabelledBy ? `${this.labelId} ${this.accessibleLabelledBy}` : this.labelId, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-expanded": this.accessibleExpanded, "aria-haspopup": this.accessibleHasPopup, "aria-owns": this.accessibleOwns, "aria-describedby": this.getAriaDescribedBy(), placeholder: this.placeholder, spellcheck: "false", minlength: this.minlength, maxlength: this.maxlength, autocomplete: this.type === "password" ? "off" : this.autoComplete, required: this.required, role: this.role, name: this.name, id: identifier }, inputProps)), !this.value && hasInputIcon && (h("div", { key: '2febfb7a160144de44956c244f4a9b68bd8019c5', class: "duet-input-icon" }, h("duet-icon", { key: 'bfec761a97f3aaa0a686027b295f1004635db337', margin: "none", size: "small", icon: icons[this.type].svg, color: "currentColor" }))), this.clear && this.value && (h("div", { key: '0f04d8c0153cd96923d3ec222eefe5ee936900dd', class: {
+            }, value: this.value, disabled: this.disabled, "aria-invalid": this.error ? "true" : "false", "aria-labelledby": this.accessibleLabelledBy ? `${this.labelId} ${this.accessibleLabelledBy}` : this.labelId, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-expanded": this.accessibleExpanded, "aria-haspopup": this.accessibleHasPopup, "aria-owns": this.accessibleOwns, "aria-describedby": this.getAriaDescribedBy(), placeholder: this.placeholder, spellcheck: "false", minlength: this.minlength, maxlength: this.maxlength, autocomplete: this.type === "password" ? "off" : this.autoComplete, required: this.required, role: this.role, name: this.name, id: identifier }, inputProps)), !this.value && hasInputIcon && (h("div", { key: '2ef57d881263ad7285afe3bd58ed9de8913131ca', class: "duet-input-icon" }, h("duet-icon", { key: '0424cb373c27e808b8ed1e1f44ca28b077af2f43', margin: "none", size: "small", icon: icons[this.type].svg, color: "currentColor" }))), this.clear && this.value && (h("div", { key: '2ba7ed30cf2409845b231bbc21cb1a7b9e001196', class: {
                 "duet-input-clear-icon": true,
                 "duet-input-clear-icon-single": !hasInputIcon,
                 "duet-input-clear-icon-double": !!this.icon,
                 "duet-input-clear-icon-button": this.variation === "button",
                 [`input-padding-${this.inputPadding}`]: true,
-            } }, h("button", { key: '3dc787b6e8470795c202b2b9e027c9193e731b9e', onClick: this.handleClearClick, id: this.clearId, "aria-label": this.clearLabel[this.language], "aria-keyshortcuts": "Escape" }, h("duet-icon", { key: 'f29c35083e8541aeabbf3130b73dcbbe35ed20a9', margin: "none", size: "medium", name: "action-clear-input", color: "currentColor" })))), this.icon && this.variation !== "button" && (h("div", { key: '59e4fe1f64ca4f11d2cf39d7b33f086a838e2e60', class: "duet-input-icon" }, h("duet-icon", { key: 'e304b595a8594e38c63662e7bd47e7fdf9f06fc3', margin: "none", size: "small", name: this.icon, color: "currentColor" }))), this.variation === "button" && h("slot", { key: '660d57f251986c4e712299152cd0fa1afa8a67c7', name: "button" }), this.variation === "revealable" && (h("duet-button", { key: '4b8d5a513f6513246217b18ea75bf0b44df3bbe9', ref: button => (this.togglePasswordRevealedButton = button), onBlur: this.onBlur, onFocus: this.onFocus, onClick: this.togglePasswordRevealed, icon: this.isPasswordRevealed ? "action-hide" : "action-show", accessibleLabel: this.isPasswordRevealed
+            } }, h("button", { key: '7be0f3cce53d669a7cb2553ea0c720a0a8f234fb', onClick: this.handleClearClick, id: this.clearId, "aria-label": this.clearLabel[this.language], "aria-keyshortcuts": "Escape" }, h("duet-icon", { key: 'd51041231a488756076772109503dcb42a47cef9', margin: "none", size: "medium", name: "action-clear-input", color: "currentColor" })))), this.icon && this.variation !== "button" && (h("div", { key: '34624c33d8582374f0deddee30d4cc3968fa38db', class: "duet-input-icon" }, h("duet-icon", { key: 'f1fde9b9334ea64219f70363ec2bf40aa9e57d6f', margin: "none", size: "small", name: this.icon, color: "currentColor" }))), this.variation === "button" && h("slot", { key: '5f490c321a2ac47676a4aff02e30f0871b640dc2', name: "button" }), this.variation === "revealable" && (h("duet-button", { key: 'd8c8a40544d07411b453bfa332c9741851bf6226', ref: button => (this.togglePasswordRevealedButton = button), onBlur: this.onBlur, onFocus: this.onFocus, onClick: this.togglePasswordRevealed, icon: this.isPasswordRevealed ? "action-hide" : "action-show", accessibleLabel: this.isPasswordRevealed
                 ? this.hidePasswordLabel[this.language]
-                : this.showPasswordLabel[this.language], margin: "none", variation: "input-button-embedded", fixed: true, iconOnly: true })), this.variation === "revealable" && this.isPasswordRevealed !== undefined && (h("duet-visually-hidden", { key: 'c16a59469b63b6d623cb0119dbcf49bed4269d37' }, h("span", { key: '60d86ffe14dc83c8f27a364c691014084a612d90', "aria-live": "polite" }, this.isPasswordRevealed
+                : this.showPasswordLabel[this.language], margin: "none", variation: "input-button-embedded", fixed: true, iconOnly: true })), this.variation === "revealable" && this.isPasswordRevealed !== undefined && (h("duet-visually-hidden", { key: '6c96533d140ef424e33a3a67961042c3d3838161' }, h("span", { key: '6ab1b5959e16b393688eaa068d772b0a600badaf', "aria-live": "polite" }, this.isPasswordRevealed
             ? this.passwordShownAriaAnnouncement[this.language]
-            : this.passwordHiddenAriaAnnouncement[this.language]))), h("slot", { key: '700c7f3d746185f743b90f8c14e7cdbfe290d9b8' })), h("span", { key: 'b2ed0a75c22c458ab4008c83f1ad03e63cf143ac', class: "duet-input-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", { key: 'aa9820e4fe4939f57bf2b50670693fc82ef925ce', class: "duet-input-error" }, this.error)))));
+            : this.passwordHiddenAriaAnnouncement[this.language]))), h("slot", { key: '5546955121bfe120490c3b22825c1035c096dd6c' })), h("span", { key: '79328cf71b7ba877431ed97a0ec98cadc31efa56', class: "duet-input-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", { key: 'f483bcaa8219c1636b5f0b83ee1ee33bd49ec1d5', class: "duet-input-error" }, this.error)))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {

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

@@ -1,9 +1,9 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-BPFqbaxm.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-BfHFKBVa.js';
 import { i as isInternetExplorer } from './is-internet-explorer-DxESMgwA.js';
-import { c as checkNamedSlotElement } from './slot-utils-BABbKvvc.js';
+import { c as checkNamedSlotElement } from './slot-utils-QOcACBKy.js';
 
 const duetLayoutCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}::slotted([slot=page-heading]){width:calc(100% + 32px);margin:0 -16px 0 -16px}@media (min-width: 36em){::slotted([slot=page-heading]){width:calc(100% + 56px);margin:0 -28px 0 -28px}}@media (min-width: 62em){::slotted([slot=page-heading]){width:calc(100% + 112px);margin:0 -56px 0 -56px}}:host(.center) ::slotted([slot=page-heading]){width:calc(100% + 32px);margin:0 -16px 0 -16px}@media (min-width: 36em){:host(.center) ::slotted([slot=page-heading]){width:calc(100% + 96px);margin:0 -48px 0 -48px}}@media (min-width: 48em){:host(.center) ::slotted([slot=page-heading]){width:calc(100% + 144px);margin:0 -72px 0 -72px}}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;flex:1 0 auto;width:100%}:host(.duet-middle) .duet-layout{padding:36px 28px !important}@media (min-width: 36em){:host(.duet-middle) .duet-layout{padding:48px 36px !important}}@media (min-width: 62em){:host(.duet-middle) .duet-layout{padding:56px !important}}:host(.duet-middle) .heading-wrapper{padding:0 !important}:host(.duet-ie){height:100%}:host(.duet-middle.duet-ie){height:auto}.duet-layout-wrapper{display:block;margin:48px 0 36px;overflow-x:clip}@media (min-width: 36em){.duet-layout-wrapper{margin-top:72px}}@media (min-width: 62em){.duet-layout-wrapper{margin-bottom:48px}}.duet-layout-wrapper.duet-m-0{margin-top:0 !important;margin-bottom:0 !important}.duet-layout-wrapper>*{width:100%}.duet-layout{position:relative;padding:0 16px;margin:0 auto}@media (max-width: 20.5em){.duet-layout.padding-xxx-small{padding:0}}@media (max-width: 22.5em){.duet-layout.padding-xx-small{padding:0}}@media (max-width: 35.9375em){.duet-layout.padding-x-small{padding:0}}@media (min-width: 36em){.duet-layout.padding-small{padding:0}}@media (min-width: 48em){.duet-layout.padding-medium{padding:0}}@media (min-width: 62em){.duet-layout.padding-large{padding:0}}@media (min-width: 64.0625em){.duet-layout.padding-x-large{padding:0}}@media (min-width: 76.25em){.duet-layout.padding-xx-large{padding:0}}@media (min-width: 106.25em){.duet-layout.padding-xxx-large{padding:0}}.duet-layout.duet-center{display:flex;align-items:center;justify-content:center;width:100%;max-width:888px}@media (min-width: 36em){.duet-layout.duet-center{padding:0 48px}}@media (min-width: 48em){.duet-layout.duet-center{padding:0 72px}}@media (min-width: 62em){.duet-layout.duet-center{width:100%}}@media (min-width: 36em){.duet-layout{padding:0 28px}}@media (min-width: 62em){.duet-layout{display:flex;flex-direction:row;padding:0 56px}}@media (min-width: 76.25em){.duet-layout{max-width:1110px;padding:0}}.duet-main,.duet-sidebar,.duet-layout-top,.duet-layout-bottom{display:block;width:100%}.duet-layout-top{position:relative;display:block;width:100%}.duet-layout-top .duet-layout-top-wrapper{padding:0 20px;margin:0 auto}@media (min-width: 36em){.duet-layout-top .duet-layout-top-wrapper{padding:0 28px}}@media (min-width: 62em){.duet-layout-top .duet-layout-top-wrapper{padding:0 56px}}@media (min-width: 76.25em){.duet-layout-top .duet-layout-top-wrapper{max-width:1110px;padding:0}}.duet-center .duet-layout-top-wrapper{max-width:888px}@media (min-width: 36em){.duet-center .duet-layout-top-wrapper{padding:0 48px}}@media (min-width: 48em){.duet-center .duet-layout-top-wrapper{padding:0 72px}}@media (min-width: 62em){.duet-main{min-width:600px;margin:0 auto}.has-sidebar .duet-main{max-width:734px;margin-right:20px}}@media (min-width: 62em){.duet-sidebar{min-width:256px;max-width:356px}}@media (min-width: 62em){.duet-sidebar-container{width:auto;max-width:356px}}@media (min-width: 62em){.duet-sidebar-container.has-tabs{margin-top:89px}}@media (min-width: 62em){.duet-sidebar-container.sticky{position:sticky}.duet-sidebar-container.sticky.with-links{top:calc(3rem + 20px)}.duet-sidebar-container.sticky.without-links{top:calc(4rem + 20px)}}";
 
@@ -64,24 +64,24 @@ const DuetLayout = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '53712da1e22dc258d30906570bf1271624379ed8', class: {
+        return (h(Host, { key: 'a2e2da10366f6be7ac33297fd517b70cccd91d3a', class: {
                 center: this.center,
                 "duet-middle": this.middle,
                 "duet-ie": isInternetExplorer(),
-            } }, h("div", { key: '80dc2f3b86a02c22c7aebd8802bd332154c4a273', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, this.hasTop && (h("div", { key: '9f3f4c713d5b921ad78480072e3dcea4d4867d04', class: {
+            } }, h("div", { key: '963134d9ac0866556e457fb1559789b3fdc04ac9', class: { "duet-layout-wrapper": true, "duet-m-0": this.margin === "none" } }, this.hasTop && (h("div", { key: '2af6f591e1f2af28de75b5ad014d2465a227d6e8', class: {
                 "duet-layout-top": true,
                 "duet-center": this.center,
-            } }, h("div", { key: '7cd44f76b96b5e2bd6033cc044f08e75a10760ed', class: "duet-layout-top-wrapper" }, h("slot", { key: '7743f1fe659f31925b27a85a970e934506b935e7', name: "top" })))), h("div", { key: '637a68f8376e073f146c63f2c866b6f52722577e', class: {
+            } }, h("div", { key: 'ada1feb7bcfd4aa2ad32163e551eb617ce6a3e0e', class: "duet-layout-top-wrapper" }, h("slot", { key: 'c902eb9bd68adf934510fcd036e73ca221cc25a2', name: "top" })))), h("div", { key: '10a599002b1cd07f67085bfc6712ec55d70f9c6c', class: {
                 "duet-layout": true,
                 "has-sidebar": this.hasSidebar,
                 "duet-center": this.center,
                 [`padding-${this.paddingBreakpoint}`]: !!this.paddingBreakpoint,
-            } }, h("main", { key: 'f6b2682dfb675be08976b23a485cf1a7ad76de0c', class: "duet-main" }, this.hasPageHeading && h("slot", { key: '9ec618959d54d768b880f95e05df0e5aaf76de75', name: "page-heading" }), h("slot", { key: 'b3c960b48d55fb863854fc34e126b1a143b3d194', name: "main" })), this.hasSidebar && (h("aside", { key: '68671aab139ba365d60284909e489a78bd7438d3', class: "duet-sidebar" }, h("div", { key: '60a53e1fa61ccec8fa2b85f20b475c52e016b963', class: {
+            } }, h("main", { key: 'f1aa73887189771b2bd8fcfb91f1abbe85d91f32', class: "duet-main" }, this.hasPageHeading && h("slot", { key: '972898b8f80d486dac54d3f02f746ea6453afde0', name: "page-heading" }), h("slot", { key: '916d907b26b5fc5c8cbc3b8e6c7bffbf044b2a09', name: "main" })), this.hasSidebar && (h("aside", { key: 'b153227de7fd9cd22c5101ca3b55e5f6c538cea2', class: "duet-sidebar" }, h("div", { key: '3de02670c41fff15245d73a5d6a1989ba1342a1c', class: {
                 "duet-sidebar-container": true,
                 "has-tabs": this.tabs,
                 sticky: this.sticky,
                 [this.stickyDistance]: this.sticky,
-            } }, h("slot", { key: 'a6131a1af98bb5cf2c6c808b15cea9e6996143f3', name: "sidebar" }))))))));
+            } }, h("slot", { key: '70a65e789aeea0b965ca02ef0876070c6fa337ff', name: "sidebar" }))))))));
     }
     get element() { return getElement(this); }
 };

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

@@ -1,8 +1,8 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, g as getElement, H as Host } from './index-BPFqbaxm.js';
-import { i as inheritGlobalTheme } from './themeable-component-Csv1RXxf.js';
+import { r as registerInstance, h, g as getElement, H as Host } from './index-BfHFKBVa.js';
+import { i as inheritGlobalTheme } from './themeable-component-D9rAA2iK.js';
 import { w as watchForOptions } from './watch-options-BmMFVM-y.js';
 
 const duetListCss = "*,*::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%}.duet-list-component{margin-bottom:16px !important;width:100%}.duet-list-component.duet-p-0{padding:0 !important}.duet-list-component.duet-m-0{margin:0 !important}";
@@ -105,7 +105,7 @@ const DuetList = class {
      * Always the last one in the class.
      */
     render() {
-        return (h("dl", { key: '82930dea1fe1193f295b5888ed5f06a85693faaa', class: { "duet-list-component": true, "duet-m-0": this.margin === "none" } }, h("slot", { key: '44602efe41782f5dc0221b0fe2dd2ac6dc905ae3' })));
+        return (h("dl", { key: '42205f6f2133cfb3816496e3403c3c7f14a529c5', class: { "duet-list-component": true, "duet-m-0": this.margin === "none" } }, h("slot", { key: 'e143fa86e59cc12e24f1e695f92dfc2466e8b0c5' })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -150,7 +150,7 @@ const DuetListItem = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '0df6b5f89eb34332c32bd3bf9354a5cf423b3d1e', class: {
+        return (h(Host, { key: 'e4cd01b6b0c03f3d82beba7c85400711e49f6582', class: {
                 "duet-theme-turva": this.theme === "turva",
                 "duet-no-stacking": !this.responsive,
                 "duet-list-item-breakpoint-x-small": this.breakpoint === "x-small",
@@ -158,7 +158,7 @@ const DuetListItem = class {
                 "duet-list-item-breakpoint-medium": this.breakpoint === "medium",
                 "duet-list-item-breakpoint-large": this.breakpoint === "large",
                 "duet-list-item-breakpoint-x-large": this.breakpoint === "x-large",
-            } }, h("dt", { key: '1093e4160d5a1d7f4ad2bbe831158c532ec3aae9' }, h("slot", { key: '51da7a9bc0ab09bb11e9f4fa2bc291c3975cb07b', name: "label" })), h("dd", { key: '511df663ae77a9e1340c759b183620fee82b9a7b' }, h("slot", { key: 'c0a4e7f4af09aada7bba7d10ab99dce0dd1696af', name: "value" }))));
+            } }, h("dt", { key: '9644bd50dfb2d6b45bd136bedcb6968f9a2675ba' }, h("slot", { key: 'db3550984b29dd4dad07eb4ab7d047652e83ac22', name: "label" })), h("dd", { key: '1e01b0449b667d1de8e9ba3ed9593725c5ce8353' }, h("slot", { key: 'c0662c72ff8ba3c2a13041b741b15ee1f9b0f544', name: "value" }))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-menu-bar-button.entry.js

@@ -1,8 +1,8 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-BPFqbaxm.js';
-import { i as inheritGlobalTheme } from './themeable-component-Csv1RXxf.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-BfHFKBVa.js';
+import { i as inheritGlobalTheme } from './themeable-component-D9rAA2iK.js';
 
 const duetMenuBarButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;height:100%}.duet-menu-bar-button{position:relative;display:flex;gap:8px;align-items:center;justify-content:center;height:100%;padding:0 12px;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:inherit;color:inherit;text-align:center;text-decoration:none;cursor:pointer}.duet-menu-bar-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-menu-bar-button:focus,.duet-menu-bar-button:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-menu-bar-button .menu-bar-button-icon{width:20px;height:20px}@media (min-width: 62em){.duet-menu-bar-button .menu-bar-button-icon{width:16px;height:16px}}.duet-menu-bar-button.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\"}@media (min-width: 62em){.duet-menu-bar-button{padding:0 16px}}@media (min-width: 76.25em){.duet-menu-bar-button{padding:0 28px}}@media (min-width: 62em){.duet-menu-bar-button:hover{color:rgb(0, 119, 179)}.duet-menu-bar-button:hover.duet-theme-turva{color:rgb(198, 12, 48)}}@media (min-width: 62em){:host(.duet-theme-turva2) .duet-menu-bar-button.duet-theme-turva:hover{color:#e61740}}";
 
@@ -53,10 +53,10 @@ const DuetMenuBarButton = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'f8b90af733c03cffd048506e78eae259272b9cde', role: "listitem", onfocus: () => this.setFocus() }, h("button", { key: '310a9cdac5ac6da14ed391fac9177810d57a9e01', ref: button => (this.nativeButton = button), class: {
+        return (h(Host, { key: '0e1e537a15d9a7b7d94a2ce24a71281b4757b1d5', role: "listitem", onfocus: () => this.setFocus() }, h("button", { key: 'c7ab5d711a28d54af476fdf133e8f92bce25f020', ref: button => (this.nativeButton = button), class: {
                 "duet-menu-bar-button": true,
                 "duet-theme-turva": this.theme === "turva",
-            }, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (h("duet-icon", { key: '2baeadf942f5f6f577316a5c24d2053307b64c33', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: '7d9dfd6a1552d18c7a5f735a87554e3f5d3ecf74' }))));
+            }, "aria-controls": this.accessibleControls, "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.icon && (h("duet-icon", { key: '922a6e2fa015b52aac218ce9e803c75a57465310', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: 'd85350f1fb803be4e524803b0bea4acc62f569fb' }))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-menu-bar-dropdown-link.entry.js

@@ -1,8 +1,8 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-BPFqbaxm.js';
-import { i as inheritGlobalTheme } from './themeable-component-Csv1RXxf.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-BfHFKBVa.js';
+import { i as inheritGlobalTheme } from './themeable-component-D9rAA2iK.js';
 import { a as isEscapeKey } from './keyboard-utils-Db8rvjPI.js';
 
 const duetMenuBarDropdownLinkCss = "*,*::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;width:100%;height:100%}.duet-menu-bar-dropdown-link{display:flex;flex-direction:row;gap:12px;align-items:center;justify-content:flex-start;height:100%;padding:0.5rem 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:1rem;font-weight:400;line-height:1.5;color:rgb(8, 42, 77);text-align:left;text-decoration:none}.duet-menu-bar-dropdown-link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-menu-bar-dropdown-link:focus,.duet-menu-bar-dropdown-link:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-menu-bar-dropdown-link.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-menu-bar-dropdown-link:hover{background:rgb(228, 241, 247)}.duet-menu-bar-dropdown-link:hover.duet-theme-turva{background:rgb(222, 224, 228)}:host(.duet-theme-turva2) .duet-menu-bar-dropdown-link.duet-theme-turva{color:#172a3b}:host(.duet-theme-turva2) .duet-menu-bar-dropdown-link.duet-theme-turva:hover{background:#fbebe1}";
@@ -52,11 +52,11 @@ const DuetMenuBarDropdownLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '3255461b870d6e7985daaaabd358db008926df23' }, h("a", { key: '1ff26c26e3029f63b5a2052676137c2e6f3cb70d', class: {
+        return (h(Host, { key: '4f66b37f78e3221d96cc0189a2a8592e6b6f8fc6' }, h("a", { key: 'd6ad6af753be198a1601d09e82478a0e1d9ee172', class: {
                 "duet-menu-bar-dropdown-link": true,
                 [`duet-menu-bar-dropdown-link--slot-${this.getVariant()}`]: true,
                 "duet-theme-turva": this.theme === "turva",
-            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '0b009531dc2f921fd0557d417f16974a2a0225e2', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), h("slot", { key: '1cace4ae4f0967a87b621717569fbfca8d504cb6' }))));
+            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '4834a4159934c0525ed9e7b7d6ac28132ba2cf03', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), h("slot", { key: 'e3f4ac467c7e84ec2c9f0d8ac7f36800a299540f' }))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-menu-bar-dropdown.entry.js

@@ -1,8 +1,8 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-BPFqbaxm.js';
-import { i as inheritGlobalTheme } from './themeable-component-Csv1RXxf.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-BfHFKBVa.js';
+import { i as inheritGlobalTheme } from './themeable-component-D9rAA2iK.js';
 import { a as isEscapeKey } from './keyboard-utils-Db8rvjPI.js';
 
 const duetMenuBarDropdownCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;height:100%}@media (min-width: 62em){:host(:last-child) .duet-menu-bar-dropdown button{padding:0 16px 0 16px}}@media (min-width: 76.25em){:host(:last-child) .duet-menu-bar-dropdown button{padding:0 16px 0 28px}}.duet-menu-bar-dropdown{position:relative;height:100%}.duet-menu-bar-dropdown button{position:relative;display:flex;gap:8px;align-items:center;justify-content:center;height:100%;padding:0 12px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(0, 75, 129);text-align:center;text-decoration:none;cursor:pointer}@media (min-width: 62em){.duet-menu-bar-dropdown button{padding:0 16px}}@media (min-width: 76.25em){.duet-menu-bar-dropdown button{padding:0 28px}}.duet-menu-bar-dropdown button:hover{color:rgb(0, 119, 179)}.duet-menu-bar-dropdown button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-menu-bar-dropdown button .label{display:flex;gap:0.5rem;align-items:center;justify-content:center}.duet-menu-bar-dropdown button.active{color:rgb(0, 119, 179)}.duet-menu-bar-dropdown button.active .caret{transform:rotate(180deg)}.duet-theme-turva .duet-menu-bar-dropdown button.active{color:rgb(198, 12, 48)}.duet-menu-bar-dropdown button.active::after{position:absolute;top:auto;bottom:2px;left:0;display:block;width:100%;height:2px;content:\"\";background:rgb(0, 119, 179);transition:300ms ease;transform:translateY(2px)}.duet-theme-turva .duet-menu-bar-dropdown button.active::after{background:rgb(198, 12, 48)}.duet-menu-bar-dropdown .menu-bar-dropdown-icon{width:20px;height:20px}@media (min-width: 62em){.duet-menu-bar-dropdown .menu-bar-dropdown-icon{width:16px;height:16px}}.duet-menu-bar-dropdown .items{position:absolute;top:70%;right:0%;left:auto;z-index:600;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:225px;padding:8px;color:rgb(8, 42, 77);background:rgb(255, 255, 255);border-radius:8px;box-shadow:0 0 0 1px rgba(0, 0, 0, 0.07), 0 4px 10px 0 rgba(0, 41, 77, 0.15)}.duet-menu-bar-dropdown .items.hidden{display:none}.duet-menu-bar-dropdown.duet-theme-turva button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-menu-bar-dropdown.duet-theme-turva button:hover{color:rgb(198, 12, 48)}.duet-menu-bar-dropdown.duet-theme-turva button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-menu-bar-dropdown.duet-theme-turva button.active{color:rgb(198, 12, 48)}.duet-menu-bar-dropdown.duet-theme-turva button.active::after{background:rgb(198, 12, 48)}.duet-menu-bar-dropdown.duet-theme-turva .items{background:rgb(255, 255, 255)}:host(.duet-theme-turva2) .duet-menu-bar-dropdown.duet-theme-turva button{color:#172a3b}:host(.duet-theme-turva2) .duet-menu-bar-dropdown.duet-theme-turva button:hover{color:#e61740}:host(.duet-theme-turva2) .duet-menu-bar-dropdown.duet-theme-turva button.active{color:#e61740}:host(.duet-theme-turva2) .duet-menu-bar-dropdown.duet-theme-turva button.active::after{background:#e61740}";
@@ -66,17 +66,17 @@ const DuetMenuBarDropdown = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '5d1851929ee7081f01cea9c55edeee771dc42be3', role: "listitem" }, h("div", { key: 'e54d3af80bbca5e24f4c5ab831b0797c605c45ca', class: {
+        return (h(Host, { key: '549451747b5d958dcac03314e5571631ddb5681c', role: "listitem" }, h("div", { key: '91c7c1f71d878251370fd14fbe8a5f7e53a4d8bd', class: {
                 "duet-menu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
                 [`duet-menu-bar-dropdown--slot-${this.getVariant()}`]: true,
-            } }, h("button", { key: 'cf2bcb77b1a0841f83a21077142e178b066484f0', ref: element => (this.button = element), "aria-label": this.accessibleLabel, "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
+            } }, h("button", { key: 'a1bc6d43c28b9070c8f351111312cf436b02b3a2', ref: element => (this.button = element), "aria-label": this.accessibleLabel, "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
                 active: this.open,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: 'a39f3f0341a93ffe8c5974c8900f42f45c262b4d', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: '2333c31f1a6dbb2f90712614d6861cd565e24c99', class: "label" }, h("slot", { key: '55556372f68d0fed856a6fbf49280f4803781e81', name: "label" }), h("duet-icon", { key: '770ff3a4aeb359e88e05cb6f8739e5a9c51109eb', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: 'ca0f2366604f3b92dbdbb2684229f7edd4992ef0', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: '612895f551ed8c5045b2a5946b3528948fb34468', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: '92d067edbc9fd30ed9113f20153943cfe99030fa', class: "label" }, h("slot", { key: '2dc4b402f56b0e45f4590a563bdbff368bf9e761', name: "label" }), h("duet-icon", { key: '97c55f40d40e52c267bdc2f0edf127c8868b91d2', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: '625909f147e2f0d3ac7d74197d787621afd5ad5e', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: 'b9f25b138f37a033bb6bd753f67765bb08a8aff6' })))));
+            } }, h("slot", { key: '927e1629164029ae374bf2a0828246865e682f21' })))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-menu-bar-item.entry.js

@@ -1,14 +1,14 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-BPFqbaxm.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-BfHFKBVa.js';
 import { n as newWindowIcon } from './action-new-window-small-EH8_HdAm.js';
 import { a as DuetStringsExternalDefaults } from './common-strings-BWvtXbhA.js';
-import { i as inheritGlobalTheme } from './themeable-component-Csv1RXxf.js';
-import { g as getAccessibleLinkLabel } from './a11y-utils-C6cn5C3e.js';
-import { g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-CNMTW_pZ.js';
+import { i as inheritGlobalTheme } from './themeable-component-D9rAA2iK.js';
+import { g as getAccessibleLinkLabel } from './a11y-utils-CRHgvsu9.js';
+import { g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-BvGD3xAJ.js';
 import './_commonjsHelpers-DvwKrUS6.js';
-import './slot-utils-BABbKvvc.js';
+import './slot-utils-QOcACBKy.js';
 import './string-utils-C6E9F6QT.js';
 
 const duetMenuBarItemCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;height:100%}.duet-menu-bar-item{position:relative;display:flex;gap:8px;align-items:center;justify-content:center;height:100%;padding:0 12px;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:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer}.duet-menu-bar-item:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-menu-bar-item:focus,.duet-menu-bar-item:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-menu-bar-item .leading-icon,.duet-menu-bar-item .trailing-icon{width:20px;height:20px}@media (min-width: 62em){.duet-menu-bar-item .leading-icon,.duet-menu-bar-item .trailing-icon{width:16px;height:16px}}.duet-menu-bar-item .trailing-icon.trailing-icon-arrow{width:7px;height:7px}.duet-menu-bar-item .external-icon{width:10px;height:10px}.duet-menu-bar-item[aria-expanded=true]{color:rgb(0, 119, 179)}.duet-menu-bar-item[aria-expanded=true] .trailing-icon.rotate{transform:rotate(180deg)}.duet-menu-bar-item.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}.duet-menu-bar-item.duet-theme-turva[aria-expanded=true]{color:rgb(198, 12, 48)}@media (min-width: 62em){.duet-menu-bar-item{padding:0 16px}}@media (min-width: 76.25em){.duet-menu-bar-item{padding:0 28px}}.duet-menu-bar-item.active{color:rgb(0, 119, 179)}.duet-menu-bar-item.active::after{position:absolute;top:auto;bottom:2px;left:0;z-index:1;display:block;width:100%;height:1px;content:\"\";background:rgb(0, 119, 179);transition:300ms ease;transform:translateY(2px)}@media (min-width: 62em){.duet-menu-bar-item.active::after{z-index:auto;height:2px}}.duet-menu-bar-item.active.duet-theme-turva{color:rgb(198, 12, 48)}.duet-menu-bar-item.active.duet-theme-turva::after{background:rgb(198, 12, 48)}@media (min-width: 62em){.duet-menu-bar-item:hover{color:rgb(0, 119, 179)}.duet-menu-bar-item:hover.duet-theme-turva{color:rgb(198, 12, 48)}}:host(.duet-theme-turva2) .duet-menu-bar-item.duet-theme-turva[aria-expanded=true]{color:#e61740}:host(.duet-theme-turva2) .duet-menu-bar-item.active.duet-theme-turva{color:#e61740}:host(.duet-theme-turva2) .duet-menu-bar-item.active.duet-theme-turva::after{background:#e61740}@media (min-width: 62em){:host(.duet-theme-turva2) .duet-menu-bar-item.duet-theme-turva:hover{color:#e61740}}";
@@ -78,11 +78,11 @@ const DuetMenuBarItem = class {
      */
     render() {
         const TagName = this.url ? "a" : "button";
-        return (h(Host, { key: '96e3f6f65b5e2e3b218d75f1fa26bbf06026389c', role: "listitem" }, h(TagName, { key: 'f673532ffa1d58f430618e6e9b62bbd2291d8262', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
+        return (h(Host, { key: 'c8f1492389226bb51cdfb54ab5262d21292a19cb', role: "listitem" }, h(TagName, { key: '251da0ca6cb28157cb26ba5f90c770123cebc5c1', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
                 "duet-menu-bar-item": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (h("duet-icon", { key: '1c232e9096b3307a39f41cb169b3eb4149dcca40', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), h("slot", { key: '0ce1d48d334370e8b90c6250e3bc4386a1dd6a42' }), (this.trailingIcon || this.external) && (h("duet-icon", { key: '0e1f8ea5c34566ff0b6d35672f7ac21c174be123', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": (this.url && getAccessibleLinkLabel(this)) || this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (h("duet-icon", { key: 'bc34c4cc34cd814ec124013da71d619f32986bd7', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), h("slot", { key: 'a913f29ab5fd5e0f3a9aeb2115bae74b83c51a7e' }), (this.trailingIcon || this.external) && (h("duet-icon", { key: 'efb44346bf1cc026263a16f0982981b6420ad298', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!this.external,

package/lib/esm/duet-menu-bar-link.entry.js

@@ -1,8 +1,8 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, h, H as Host, g as getElement } from './index-BPFqbaxm.js';
-import { i as inheritGlobalTheme } from './themeable-component-Csv1RXxf.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-BfHFKBVa.js';
+import { i as inheritGlobalTheme } from './themeable-component-D9rAA2iK.js';
 
 const duetMenuBarLinkCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;height:100%}.duet-menu-bar-link{position:relative;display:flex;gap:8px;align-items:center;justify-content:center;height:100%;padding:0 12px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:inherit;text-align:center;text-decoration:none;white-space:nowrap}.duet-menu-bar-link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-menu-bar-link:focus,.duet-menu-bar-link:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-menu-bar-link .menu-bar-link-icon{width:20px;height:20px}@media (min-width: 62em){.duet-menu-bar-link .menu-bar-link-icon{width:16px;height:16px}}.duet-menu-bar-link.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\"}@media (min-width: 62em){.duet-menu-bar-link{padding:0 16px}}@media (min-width: 76.25em){.duet-menu-bar-link{padding:0 28px}}.duet-menu-bar-link.active{color:rgb(0, 119, 179)}.duet-menu-bar-link.active::after{position:absolute;top:auto;bottom:2px;left:0;z-index:1;display:block;width:100%;height:1px;content:\"\";background:rgb(0, 119, 179);transition:300ms ease;transform:translateY(2px)}@media (min-width: 62em){.duet-menu-bar-link.active::after{z-index:auto;height:2px}}.duet-menu-bar-link.active.duet-theme-turva{color:rgb(198, 12, 48)}.duet-menu-bar-link.active.duet-theme-turva::after{background:rgb(198, 12, 48)}@media (min-width: 62em){.duet-menu-bar-link:hover{color:rgb(0, 119, 179)}.duet-menu-bar-link:hover.duet-theme-turva{color:rgb(198, 12, 48)}}:host(.duet-theme-turva2) .duet-menu-bar-link.active.duet-theme-turva{color:#e61740}:host(.duet-theme-turva2) .duet-menu-bar-link.active.duet-theme-turva::after{background:#e61740}@media (min-width: 62em){:host(.duet-theme-turva2) .duet-menu-bar-link.duet-theme-turva:hover{color:#e61740}}";
 
@@ -37,11 +37,11 @@ const DuetMenuBarLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '2dbba977ecce40e0e35b0446763fb4f2ce144071', role: "listitem" }, h("a", { key: 'e593c87de20138cb156e002a6de68a6492fbcb2b', class: {
+        return (h(Host, { key: '997031f3159b6da185e25915d7241ba645b2b9d0', role: "listitem" }, h("a", { key: '8ef71373a7c481ca8dc93506eb8957c470489c2b', class: {
                 "duet-menu-bar-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: 'ea48038cdd45b8fb0ea26eab4a60a1c14f1ce091', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: 'b679ffa584c1e1738c5c31f320a14ef8aea42937' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: 'f0439bbfecdf854d05fa818663e7e7e93fffa404', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: '426c1a3de2829a37aba8d4f30169d71425d81301' }))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-menu-bar.entry.js

@@ -1,12 +1,12 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BPFqbaxm.js';
-import { i as inheritGlobalTheme } from './themeable-component-Csv1RXxf.js';
-import { a as getLanguage } from './language-utils-CNMTW_pZ.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BfHFKBVa.js';
+import { i as inheritGlobalTheme } from './themeable-component-D9rAA2iK.js';
+import { a as getLanguage } from './language-utils-BvGD3xAJ.js';
 import './string-utils-C6E9F6QT.js';
 
-const duetMenuBarCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;width:100%}.duet-menu-bar{position:relative;top:0;z-index:2;display:flex;align-items:center;justify-content:center;background:rgb(255, 255, 255);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07);transition:top 0.3s}.duet-menu-bar.hidden{top:-200px}.duet-menu-bar.bottom{z-index:1}@media (min-width: 62em){.duet-menu-bar{box-shadow:0 3px 6px 0 rgba(0, 41, 77, 0.1)}}.duet-menu-bar .top{display:none}.duet-menu-bar .bottom{display:none}.duet-menu-bar.horizontal-nav{position:relative}.duet-menu-bar.horizontal-nav .top{position:absolute;top:0;left:3.5%;display:block;width:93%;height:1px;background:rgb(245, 248, 250)}.duet-menu-bar.horizontal-nav .bottom{position:absolute;bottom:0;left:0;display:block;width:100%;height:1px;background:rgb(212, 223, 229)}.duet-menu-bar.horizontal-nav .more-left{position:absolute;top:0;left:0;z-index:1;width:56px;height:49px;pointer-events:none;background:linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0) 100%)}@media (min-width: 62em){.duet-menu-bar.horizontal-nav .more-left{display:none}}.duet-menu-bar.horizontal-nav .more-right{position:absolute;top:0;right:0;z-index:1;width:56px;height:49px;pointer-events:none;background:linear-gradient(270deg, #fff 0%, rgba(255, 255, 255, 0) 100%)}@media (min-width: 62em){.duet-menu-bar.horizontal-nav .more-right{display:none}}@media (pointer: fine){.duet-menu-bar.horizontal-nav{display:none}}@media (pointer: fine) and ((min-width: 62em)){.duet-menu-bar.horizontal-nav{display:flex}}.duet-menu-bar .container{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1440px;height:100%;height:3.25rem;padding:0 8px 0 20px;overflow-x:auto;scrollbar-width:none}.duet-menu-bar .container::-webkit-scrollbar{width:0;height:0}.duet-menu-bar .container duet-logo.large,.duet-menu-bar .container duet-logo.only-symbol{display:none}.duet-menu-bar .container.with-info-text duet-logo.medium{display:none}.duet-menu-bar .container.with-info-text duet-logo.only-symbol{display:block}@media (min-width: 48em){.duet-menu-bar .container.with-info-text duet-logo.medium{display:block}.duet-menu-bar .container.with-info-text duet-logo.only-symbol{display:none}}@media (min-width: 76.25em){.duet-menu-bar .container duet-logo.medium{display:none}.duet-menu-bar .container duet-logo.large{display:block}}@media (min-width: 62em){.duet-menu-bar .container{height:5rem;padding:0 28px;overflow-x:visible}}.duet-menu-bar .container .list{height:100%;list-style-type:none}.duet-menu-bar .container ::slotted(*){height:100%}.duet-menu-bar .container>*{display:flex;align-items:center;justify-content:center;height:100%}.duet-menu-bar .container>:first-child{flex-basis:0;flex-grow:1;justify-content:flex-start;width:auto;height:40px}@media (min-width: 76.25em){.duet-menu-bar .container>:first-child{height:48px}}.duet-menu-bar .container>:first-child:has(.duet-logo-info-text){flex-grow:8}.duet-menu-bar .container>:first-child:has(.duet-logo-info-text) duet-paragraph{max-height:100%}.duet-menu-bar .container>:last-child{flex-basis:0;flex-grow:1;justify-content:flex-end}.duet-menu-bar .container ::slotted(*){display:flex;align-items:center;justify-content:center;height:100%}.duet-menu-bar .container .duet-logo-info-text{max-height:2.8875rem;padding-left:16px;margin-left:16px;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:0.875rem;font-style:normal;font-weight:400;font-variant-numeric:tabular-nums;-webkit-hyphens:auto;hyphens:auto;line-height:1.1;color:rgb(62, 84, 102);text-overflow:ellipsis;border-left:1px solid rgb(212, 223, 229)}.duet-menu-bar .container .duet-logo-info-text.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(71, 78, 101);border-left-color:rgb(222, 224, 228)}@media (min-width: 48em){.duet-menu-bar .container .duet-logo-info-text{max-height:3.3rem;font-size:1rem}}.duet-menu-bar.duet-theme-turva{background:rgb(255, 255, 255);box-shadow:0 2px 6px 0 rgba(23, 28, 58, 0.07)}@media (min-width: 62em){.duet-menu-bar.duet-theme-turva{box-shadow:0 3px 6px 0 rgba(23, 28, 58, 0.1)}}.duet-menu-bar.duet-menu-bar-slim .container duet-logo.medium{display:block}.duet-menu-bar.duet-menu-bar-slim .container duet-logo.large{display:none}.duet-menu-bar.duet-menu-bar-slim .container.with-info-text duet-logo.medium{display:none}.duet-menu-bar.duet-menu-bar-slim .container.with-info-text duet-logo.only-symbol{display:block}@media (min-width: 48em){.duet-menu-bar.duet-menu-bar-slim .container.with-info-text duet-logo.medium{display:block}.duet-menu-bar.duet-menu-bar-slim .container.with-info-text duet-logo.only-symbol{display:none}}@media (min-width: 62em){.duet-menu-bar.duet-menu-bar-slim .container{height:4rem}}.center{font-size:1rem;font-weight:600;line-height:1.25;color:rgb(8, 42, 77)}.duet-theme-turva .center{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.right{font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(0, 75, 129)}.duet-theme-turva .right{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}:host(.duet-theme-turva2) .duet-theme-turva .center{color:#172a3b}:host(.duet-theme-turva2) .duet-theme-turva .right{color:#172a3b}:host(.duet-theme-turva2) .duet-theme-turva .duet-logo-info-text{color:#354f65;border-left-color:#d4dde2}";
+const duetMenuBarCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;width:100%;pointer-events:none}:host *{pointer-events:auto}.duet-menu-bar{position:relative;top:0;z-index:2;display:flex;align-items:center;justify-content:center;background:rgb(255, 255, 255);box-shadow:0 2px 6px 0 rgba(0, 41, 77, 0.07);transition:top 0.3s}.duet-menu-bar.hidden{top:-200px}.duet-menu-bar.bottom{z-index:1}@media (min-width: 62em){.duet-menu-bar{box-shadow:0 3px 6px 0 rgba(0, 41, 77, 0.1)}}.duet-menu-bar .top{display:none}.duet-menu-bar .bottom{display:none}.duet-menu-bar.horizontal-nav{position:relative}.duet-menu-bar.horizontal-nav .top{position:absolute;top:0;left:3.5%;display:block;width:93%;height:1px;background:rgb(245, 248, 250)}.duet-menu-bar.horizontal-nav .bottom{position:absolute;bottom:0;left:0;display:block;width:100%;height:1px;background:rgb(212, 223, 229)}.duet-menu-bar.horizontal-nav .more-left{position:absolute;top:0;left:0;z-index:1;width:56px;height:49px;pointer-events:none;background:linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0) 100%)}@media (min-width: 62em){.duet-menu-bar.horizontal-nav .more-left{display:none}}.duet-menu-bar.horizontal-nav .more-right{position:absolute;top:0;right:0;z-index:1;width:56px;height:49px;pointer-events:none;background:linear-gradient(270deg, #fff 0%, rgba(255, 255, 255, 0) 100%)}@media (min-width: 62em){.duet-menu-bar.horizontal-nav .more-right{display:none}}@media (pointer: fine){.duet-menu-bar.horizontal-nav{display:none}}@media (pointer: fine) and ((min-width: 62em)){.duet-menu-bar.horizontal-nav{display:flex}}.duet-menu-bar .container{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1440px;height:100%;height:3.25rem;padding:0 8px 0 20px;overflow-x:auto;scrollbar-width:none}.duet-menu-bar .container::-webkit-scrollbar{width:0;height:0}.duet-menu-bar .container duet-logo.large,.duet-menu-bar .container duet-logo.only-symbol{display:none}.duet-menu-bar .container.with-info-text duet-logo.medium{display:none}.duet-menu-bar .container.with-info-text duet-logo.only-symbol{display:block}@media (min-width: 48em){.duet-menu-bar .container.with-info-text duet-logo.medium{display:block}.duet-menu-bar .container.with-info-text duet-logo.only-symbol{display:none}}@media (min-width: 76.25em){.duet-menu-bar .container duet-logo.medium{display:none}.duet-menu-bar .container duet-logo.large{display:block}}@media (min-width: 62em){.duet-menu-bar .container{height:5rem;padding:0 28px;overflow-x:visible}}.duet-menu-bar .container .list{height:100%;list-style-type:none}.duet-menu-bar .container ::slotted(*){height:100%}.duet-menu-bar .container>*{display:flex;align-items:center;justify-content:center;height:100%}.duet-menu-bar .container>:first-child{flex-basis:0;flex-grow:1;justify-content:flex-start;width:auto;height:40px}@media (min-width: 76.25em){.duet-menu-bar .container>:first-child{height:48px}}.duet-menu-bar .container>:first-child:has(.duet-logo-info-text){flex-grow:8}.duet-menu-bar .container>:first-child:has(.duet-logo-info-text) duet-paragraph{max-height:100%}.duet-menu-bar .container>:last-child{flex-basis:0;flex-grow:1;justify-content:flex-end}.duet-menu-bar .container ::slotted(*){display:flex;align-items:center;justify-content:center;height:100%}.duet-menu-bar .container .duet-logo-info-text{max-height:2.8875rem;padding-left:16px;margin-left:16px;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:0.875rem;font-style:normal;font-weight:400;font-variant-numeric:tabular-nums;-webkit-hyphens:auto;hyphens:auto;line-height:1.1;color:rgb(62, 84, 102);text-overflow:ellipsis;border-left:1px solid rgb(212, 223, 229)}.duet-menu-bar .container .duet-logo-info-text.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(71, 78, 101);border-left-color:rgb(222, 224, 228)}@media (min-width: 48em){.duet-menu-bar .container .duet-logo-info-text{max-height:3.3rem;font-size:1rem}}.duet-menu-bar.duet-theme-turva{background:rgb(255, 255, 255);box-shadow:0 2px 6px 0 rgba(23, 28, 58, 0.07)}@media (min-width: 62em){.duet-menu-bar.duet-theme-turva{box-shadow:0 3px 6px 0 rgba(23, 28, 58, 0.1)}}.duet-menu-bar.duet-menu-bar-slim .container duet-logo.medium{display:block}.duet-menu-bar.duet-menu-bar-slim .container duet-logo.large{display:none}.duet-menu-bar.duet-menu-bar-slim .container.with-info-text duet-logo.medium{display:none}.duet-menu-bar.duet-menu-bar-slim .container.with-info-text duet-logo.only-symbol{display:block}@media (min-width: 48em){.duet-menu-bar.duet-menu-bar-slim .container.with-info-text duet-logo.medium{display:block}.duet-menu-bar.duet-menu-bar-slim .container.with-info-text duet-logo.only-symbol{display:none}}@media (min-width: 62em){.duet-menu-bar.duet-menu-bar-slim .container{height:4rem}}.center{font-size:1rem;font-weight:600;line-height:1.25;color:rgb(8, 42, 77)}.duet-theme-turva .center{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.right{font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(0, 75, 129)}.duet-theme-turva .right{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}:host(.duet-theme-turva2) .duet-theme-turva .center{color:#172a3b}:host(.duet-theme-turva2) .duet-theme-turva .right{color:#172a3b}:host(.duet-theme-turva2) .duet-theme-turva .duet-logo-info-text{color:#354f65;border-left-color:#d4dde2}";
 
 const DuetMenuBar = class {
     constructor(hostRef) {
@@ -131,17 +131,17 @@ const DuetMenuBar = class {
     render() {
         const slideoutAvailable = document.querySelectorAll("duet-slideout").length > 0;
         const isUsedAsAdditionalHorizontalNav = slideoutAvailable && !this.logo;
-        return (h(Host, { key: 'da384aec934b8177658bc5b2ba9126dabe8b44cc' }, h("nav", { key: 'eb7dd8d958e964d1b0e5d2cf96a20a4d0c0c70dc', class: {
+        return (h(Host, { key: '9f357dd163db230760ba15408c721b345619e369' }, h("nav", { key: '515afdd6ce472b843bb59ab038fa87b76158743d', class: {
                 "duet-menu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 "horizontal-nav": isUsedAsAdditionalHorizontalNav,
                 "duet-menu-bar-slim": !this.centerSlotUsed,
                 hidden: this.hidden && this.hideOnScroll,
                 bottom: this.onBottom,
-            }, "aria-label": this.accessibleLabel }, h("div", { key: '4a8a38d9fd5457b716bff3252791d35eb8441aec', class: "top" }), h("div", { key: 'dfe385565d075aba16005d29790111cc51b5a464', class: { container: true, "with-info-text": !!this.logoInfoText && !this.centerSlotUsed }, ref: el => (this.container = el), onScroll: () => this.scrollbarCheck() }, this.logo && (h("div", { key: 'd7fa21e1f8b0f3ea5eeb5eff037790a47c57be22' }, h("duet-logo", { key: '081cd1b58c97e71196ff421dbb7b1ed4f2e2278e', class: "medium", size: "medium", margin: "none", theme: this.theme, href: this.logoHref, accessibleLabel: this.logoLinkAccessibleLabel, onClick: this.handleLogoClick, language: this.language }), h("duet-logo", { key: '41b6ffe971ec6c9ff78c2f79834df3c9dceb3482', class: "large", size: "large", margin: "none", theme: this.theme, href: this.logoHref, accessibleLabel: this.logoLinkAccessibleLabel, onClick: this.handleLogoClick, language: this.language }), h("duet-logo", { key: '16cc7621a8d50d64d63fd7b8af07f074e30a49d0', class: "only-symbol", onlySymbol: true, margin: "none", theme: this.theme, href: this.logoHref, accessibleLabel: this.logoLinkAccessibleLabel, onClick: this.handleLogoClick, language: this.language }), this.logoInfoText && !this.centerSlotUsed && (h("div", { key: '2f0bcec90b8c9f508d95fb31d8ad9904ea7bf652', class: {
+            }, "aria-label": this.accessibleLabel }, h("div", { key: 'd19d82b1e1c35dd8f0ac72fc3625058f939d2b66', class: "top" }), h("div", { key: '8bd01db2edc2ab2c43e931e07288e252a6838abc', class: { container: true, "with-info-text": !!this.logoInfoText && !this.centerSlotUsed }, ref: el => (this.container = el), onScroll: () => this.scrollbarCheck() }, this.logo && (h("div", { key: '28a65925e1aa7a73822e398a0aaa705de521cc66' }, h("duet-logo", { key: 'f7a068293211c3e3a7c091a084ecf4e7b3c2317c', class: "medium", size: "medium", margin: "none", theme: this.theme, href: this.logoHref, accessibleLabel: this.logoLinkAccessibleLabel, onClick: this.handleLogoClick, language: this.language }), h("duet-logo", { key: 'dcb75e146d612870f0b65295df9f33a2be699d29', class: "large", size: "large", margin: "none", theme: this.theme, href: this.logoHref, accessibleLabel: this.logoLinkAccessibleLabel, onClick: this.handleLogoClick, language: this.language }), h("duet-logo", { key: '675cb30c9aaa18f8352d2c8d84978bb291f2337d', class: "only-symbol", onlySymbol: true, margin: "none", theme: this.theme, href: this.logoHref, accessibleLabel: this.logoLinkAccessibleLabel, onClick: this.handleLogoClick, language: this.language }), this.logoInfoText && !this.centerSlotUsed && (h("div", { key: '48cd2679315bb52d535c58b1b54831bcc1120bd4', class: {
                 "duet-logo-info-text": true,
                 "duet-theme-turva": this.theme === "turva",
-            } }, this.logoInfoText)))), h("div", { key: '0630a90a58cfcfdd4255c018db1ea172240b5611', class: "list center", role: "list" }, h("div", { key: '6e9f9d06775216dfa9ec70b2c768d5957ba67f10', class: "more-left", hidden: !this.leftMoreVisible, role: "presentation" }), h("slot", { key: '03f6a07cf3633d2ba2c62b76d40d2f74bba6f366', name: "center" }), h("div", { key: '7baeb903a2656bb33129bac0cf6007fce4604bd1', class: "more-right", hidden: !this.rightMoreVisible, role: "presentation" })), h("div", { key: '8a183192d62d7040c1ab2a8a684d8a7678803436', class: "list right", role: "list" }, h("slot", { key: 'd2f48181bf06824a5901fdc37f7f9eb729460c68', name: "right" }))), h("div", { key: '3b1e931eb638ea04b5a0743d2ab03413ca220a33', class: "bottom" }))));
+            } }, this.logoInfoText)))), h("div", { key: '0cc0ebfc6fe8b9582f8677ca8eba79c7fb102a97', class: "list center", role: "list" }, h("div", { key: '8ed1c963529c2ad79182293ac831fc2a5c4ba308', class: "more-left", hidden: !this.leftMoreVisible, role: "presentation" }), h("slot", { key: 'c997b17308d679e6364b79e9549600ea88307ebe', name: "center" }), h("div", { key: 'e4d05f0c17fe62eb12a4708237703d32cb8ac339', class: "more-right", hidden: !this.rightMoreVisible, role: "presentation" })), h("div", { key: '438911a93d2bbcfd6a1084c095611bc031636313', class: "list right", role: "list" }, h("slot", { key: 'd8b922aca72f608f7acd42e29742efa50d0b2343', name: "right" }))), h("div", { key: 'cd333a535ef8eac9c224cd6ebc6a2a4145ba20bd', class: "bottom" }))));
     }
     get element() { return getElement(this); }
 };

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

@@ -1,16 +1,16 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-BPFqbaxm.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-BfHFKBVa.js';
 import { d as disableBodyScroll, e as enableBodyScroll } from './bodyScrollLock.es6-B1B-PPrh.js';
-import { i as inheritGlobalTheme } from './themeable-component-Csv1RXxf.js';
+import { i as inheritGlobalTheme } from './themeable-component-D9rAA2iK.js';
 import { b as DuetStringsPleaseWaitDefaults } from './common-strings-BWvtXbhA.js';
-import { f as focusElement } from './focus-utils-BhO5oz9w.js';
+import { f as focusElement } from './focus-utils-CrtNnjPR.js';
 import { a as isEscapeKey } from './keyboard-utils-Db8rvjPI.js';
-import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-CNMTW_pZ.js';
-import { h as hasSlot } from './slot-utils-BABbKvvc.js';
+import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-BvGD3xAJ.js';
+import { h as hasSlot } from './slot-utils-QOcACBKy.js';
 import { T as Teleport } from './teleport-CooAqTCj.js';
-import { p as postfixTheme } from './token-utils-BGFYWQ6j.js';
+import { p as postfixTheme } from './token-utils-C-c-tsXV.js';
 import './string-utils-C6E9F6QT.js';
 import './tokens.module-Z0D6Gy9e.js';
 
@@ -326,14 +326,14 @@ const DuetModal = class {
         var _a, _b;
         const iconColor = postfixTheme("primary", this.theme);
         const closeColor = postfixTheme("secondary", this.theme);
-        const closingButton = (h("div", { key: '39d89598c50f59be771033542b474cc6b7e1df0b', class: "duet-modal-close" }, h("duet-button", { key: 'b5c6f0c486eaa24d4c7747a839288562e63808bf', ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
-        return (h("div", { key: '07de0b18de78d147afa8cdaeadc39c877cd32dca', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
+        const closingButton = (h("div", { key: 'ee572843326c7c6981aa9e70724bfb73de2f5b18', class: "duet-modal-close" }, h("duet-button", { key: '18d574610d760318b8533137648b8cd6eb0cd242', ref: button => (this.buttonEl = button), variation: "plain", accessibleLabel: this.accessibleCloseLabel, color: closeColor, iconSize: "large", icon: "navigation-close", iconOnly: true, margin: "none", theme: this.theme, onClick: ev => this.closeModal(ev), fixed: true })));
+        return (h("div", { key: '8908f9d800b06078fde788e21e6230ad05765147', ref: modal => (this.modalEl = modal), "aria-label": (_a = this.accessibleLabel) !== null && _a !== void 0 ? _a : this.heading, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, "aria-describedby": this.accessibleDescribedBy, role: this.variation === "loader" ? "alert" : "dialog", "aria-modal": this.isSafariBrowser ? false : true, tabindex: "-1", class: {
                 "duet-modal-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-modal-active": this.open,
                 "duet-modal-slide-up": this.variation === "slide-up",
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
-            } }, h("duet-overlay", { key: '08d67fe06635ffce14ed2151c9b7211740f5366f', "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), h("div", { key: '83d7365182d8a008dbceca7d19d5f110d4e3e39a', ref: modalInner => (this.modalInnerEl = modalInner), class: {
+            } }, h("duet-overlay", { key: '3e2d20cd2b9c18631d7103c1679a9c24a5227eef', "z-index": "-1", visible: this.open, variation: this.variation === "loader" ? "white" : "default" }), h("div", { key: '2559835e9bdf2436cc824914d84cca1d87175d84', ref: modalInner => (this.modalInnerEl = modalInner), class: {
                 "duet-modal-inner": true,
                 [this.size]: true,
                 "duet-modal-slide-up": this.variation === "slide-up",
@@ -344,22 +344,22 @@ const DuetModal = class {
                         this.closeModal(e);
                     }
                 }
-            } }, h("div", { key: '926f82204442851d8fa4d3b83c49fa1b3e0970f0', ref: modalContentEl => (this.modalContentEl = modalContentEl), "aria-live": this.accessibleAnnounceChanges === "all" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "all" ? "true" : null, class: {
+            } }, h("div", { key: '135c144620c16f237d1049be960c803139920a46', ref: modalContentEl => (this.modalContentEl = modalContentEl), "aria-live": this.accessibleAnnounceChanges === "all" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "all" ? "true" : null, class: {
                 "duet-modal": true,
                 "duet-modal-has-sticky-header": this.hasStickyHeader,
                 [this.size]: true,
                 [this.variation]: true,
-            } }, this.gutterSize !== "none" && !this.hasStickyHeader && h("duet-spacer", { key: 'b1b6c5d0fab63540a89c585e09db2044a9944957' }), this.hasStickyHeader ? (h("div", { class: "duet-modal-sticky-header" }, closingButton, h("slot", { name: "sticky-header" }))) : (closingButton), h("div", { key: '55e0891ac4dc8e5eaebd53740ccc2afb4759c45c', class: {
+            } }, this.gutterSize !== "none" && !this.hasStickyHeader && h("duet-spacer", { key: '9a1fa991e33910557b8c952450cbdf8ae95eceeb' }), this.hasStickyHeader ? (h("div", { class: "duet-modal-sticky-header" }, closingButton, h("slot", { name: "sticky-header" }))) : (closingButton), h("div", { key: 'a4603f53a19537b5886ee96561b0b2a68c6205ee', class: {
                 "duet-modal-body": true,
                 "duet-modal-gutter-none": this.gutterSize === "none",
                 "duet-modal-gutter-small": this.gutterSize === "small",
                 "duet-modal-gutter-medium": this.gutterSize === "medium",
                 "duet-modal-gutter-large": this.gutterSize === "large",
-            }, "aria-live": this.accessibleAnnounceChanges === "heading" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "heading" ? "true" : null }, h("div", { key: '1cab42f970d7b12c6684ac63e37324516180d168', class: "duet-modal-header" }, h("span", { key: 'a3e9c69a6eb8ebcc8e0cbb282e14438c20153f7c', class: "duet-modal-inner-slot-top" }, h("slot", { key: 'b719c6a7ae968b6687f259d061ec414326ad9301', name: "top" })), this.icon && h("duet-icon", { key: '378d48739073800b81634af0441e5b82013df9a6', name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (h("duet-heading", { key: '8052f57a3d06363e38bcf748d81e37ec8d9e7928', "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (h("div", { key: 'c98e91827794451431e8f875994446ee09d5bd9f', class: "duet-modal-spinner" }, h("duet-spinner", { key: '08f09524dd18e633063e5a5ac5fced5103610d7d', size: "large", color: postfixTheme("primary", this.theme) }))), h("div", { key: 'b237e8483fd62056b4f99507a78580983b1135a8', "aria-live": this.variation === "loader"
+            }, "aria-live": this.accessibleAnnounceChanges === "heading" ? "polite" : null, "aria-atomic": this.accessibleAnnounceChanges === "heading" ? "true" : null }, h("div", { key: 'e698bace2e3ed41ec283123dd3bdff378e439dbd', class: "duet-modal-header" }, h("span", { key: '34b6aaf5ba7d95c6800a57e993a08703f8b8f146', class: "duet-modal-inner-slot-top" }, h("slot", { key: '1b12b5a25096233e768446ca8d3908380d5e15d1', name: "top" })), this.icon && h("duet-icon", { key: '8bdafc9dd71f47bfef151dae0f0b73cd64cd54a6', name: this.icon, size: "xx-large", color: this.color || iconColor }), this.heading && (h("duet-heading", { key: 'e996638326c1526d58e579368a692b19a0ed88f8', "visual-level": (_b = this.headingVisualLevel) !== null && _b !== void 0 ? _b : this.headingLevel, level: this.headingLevel, theme: this.theme }, this.heading))), this.variation === "loader" && (h("div", { key: 'b5261a092defb3671fc33a6a38507d99429b2549', class: "duet-modal-spinner" }, h("duet-spinner", { key: '42123ba82859618de11f0cfba09df8317fb2693c', size: "large", color: postfixTheme("primary", this.theme) }))), h("div", { key: '7ac6dee3c05c9844ab64ec3f8a792cec98019d1d', "aria-live": this.variation === "loader"
                 ? "assertive"
                 : this.accessibleAnnounceChanges === "body"
                     ? "polite"
-                    : null, "aria-atomic": this.accessibleAnnounceChanges === "body" ? "true" : null, class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el) }, h("slot", { key: 'f9ed9945e262cbb20ff4c51d1a2e67329eae9a5e' })))))));
+                    : null, "aria-atomic": this.accessibleAnnounceChanges === "body" ? "true" : null, class: "duet-modal-inner-slot-default", ref: el => (this.slotContainerEl = el) }, h("slot", { key: '787243109cdcf4c0ab5767027ad532ad99a69259' })))))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {