@duetds/components 10.6.0 → 10.8.0

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

@@ -1,16 +1,16 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-D3450NfA.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CdcBxXLd.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-QHdUfcat.js';
-import { D as DuetInternalLabel } from './label-C1HF2o4Y.js';
+import { i as inheritGlobalTheme } from './themeable-component-DQtSOD4i.js';
+import { D as DuetInternalLabel } from './label-D835wXCb.js';
 import { c as createID } from './create-id-Cfr_DJqU.js';
 import { c as cleanValue, r as resetCursor } from './input-utils-CLDy7YaM.js';
 import { o as isCharacterInsertKey, a as isEscapeKey, c as isEnterKey, p as isBackspaceKey, d as isArrowLeftKey, f as isArrowRightKey } from './keyboard-utils-BaefVzkx.js';
-import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './language-utils-D4WVl8Ph.js';
-import { c as checkNamedSlotElement, p as proxyInputToSlot } from './slot-utils-Dxcjtmp3.js';
+import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './language-utils-C-lpMyP9.js';
+import { c as checkNamedSlotElement, p as proxyInputToSlot } from './slot-utils-BSS0Em_Z.js';
 import { g as getColorByName } from './token-utils-BILzD7LX.js';
 import './string-utils-C6E9F6QT.js';
 import './tokens.module-kkZE1C6Z.js';
@@ -28,7 +28,7 @@ function requireFormEmail () {
 var formEmailExports = requireFormEmail();
 var emailIcon = /*@__PURE__*/getDefaultExportFromCjs(formEmailExports);
 
-const duetInputCss = ".duet-internal-label{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:12px !important;position:relative;z-index:100;display:inline-flex;width:auto;margin-top:8px !important;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600 !important;line-height:1.25;line-height:1.25;color:rgb(8, 42, 77);text-align:left;word-break:break-word;cursor:default}.duet-internal-label.duet-p-0{padding:0 !important}.duet-internal-label.duet-m-0{margin:0 !important}.duet-internal-label span{font-size:1rem;font-weight:600 !important;word-break:break-word}.duet-internal-label.duet-m-0{margin-bottom:0 !important}.duet-internal-label.duet-small-margin{margin-top:8px !important;margin-bottom:4px !important}.duet-internal-label.duet-has-tooltip{padding-right:48px}@media (min-width: 48em){.duet-internal-label.duet-has-tooltip{padding-right:0}}.duet-internal-label.duet-internal-label-small{font-size:0.875rem}.duet-internal-label.duet-internal-label-small span{font-size:0.875rem}.duet-internal-label.duet-weight-normal{font-weight:400 !important}.duet-internal-label.duet-weight-normal span{font-weight:400 !important}.duet-internal-label.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, 42, 59)}*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{margin-right:16px !important}:host(:last-child),:host(:last-of-type){margin-right:0 !important}:host(.form-distribute:last-of-type:not(:last-child)){margin-right:16px !important}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:12px !important;display:inline-flex;width:100%;min-width:calc(33.333% - 8px);max-width:100%;vertical-align:bottom;text-align:left}@media (min-width: 36em){:host{width:calc(50% - 16px - 3px)}}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}input[type=time]::-webkit-datetime-edit-fields-wrapper{padding:0}input[type=time]::-webkit-calendar-picker-indicator{display:none}duet-tooltip,::slotted(duet-tooltip){position:relative;top:12px;right:0}@media (min-width: 48em){duet-tooltip,::slotted(duet-tooltip){right:auto}}duet-caption:not(:last-of-type){margin-bottom:0}.duet-input-placeholder{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:rgb(255, 255, 255)}.duet-input-icon{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;font-size:0;line-height:normal;color:rgb(8, 42, 77);pointer-events:none;transform:translateY(-50%)}.duet-input-container{position:relative;width:100%;height:100%}.duet-input-container.has-clear .duet-input-clear-icon{position:relative;z-index:250}.duet-input-container.has-clear .duet-input-clear-icon button{position:absolute;top:-24px;right:-24px;min-width:48px;min-height:48px;color:rgb(0, 75, 129)}.duet-input-container.has-clear .duet-input-clear-icon button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-input-container.has-clear .duet-input-clear-icon button:focus,.duet-input-container.has-clear .duet-input-clear-icon button:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-input-container.has-clear .duet-input-clear-icon button:active{opacity:0.75;transition:none}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-xx-small button{top:-12px}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-x-small button{top:-16px}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-small button{top:-20px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single button{top:-48px;right:0}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-xx-small button{top:-36px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-x-small button{top:-40px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-small button{top:-44px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double button{top:-24px;right:12px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-xx-small button{top:-12px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-x-small button{top:-16px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-small button{top:-20px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-button button{top:-24px;right:0}.duet-input-container.has-clear.has-icon .duet-input-clear-icon{top:-24px;right:24px}.duet-input-label-container{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between}@media (min-width: 48em){.duet-input-label-container{justify-content:flex-start}}.duet-input{position:relative;z-index:100;display:block !important;width:100% !important;min-width:8rem;max-width:initial !important;height:auto !important;padding:12px 14px !important;margin:initial !important;margin-bottom:initial !important;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400 !important;font-variant-numeric:tabular-nums;line-height:1.5 !important;color:rgb(8, 42, 77) !important;cursor:initial !important;outline-color:initial !important;background:rgb(255, 255, 255) !important;background-clip:initial !important;border:1px solid rgb(127, 150, 165) !important;border-radius:4px !important;transition:border 150ms ease !important}.duet-input.input-padding-small{padding:8px 10px !important}.duet-input.input-padding-x-small{padding:4px 6px !important}.duet-input.input-padding-xx-small{padding:0px 2px !important}.duet-input.is-number{padding-right:112px !important}.duet-input.is-date{padding-right:64px !important}.duet-input.after-chip{padding-left:8px !important}.has-error .duet-input{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.has-error .duet-input+.duet-input-icon{color:rgb(214, 28, 82) !important}.has-icon .duet-input{padding-right:48px !important}.duet-input.align-right{text-align:right}.duet-input::-ms-clear{display:none}.duet-input::-webkit-contacts-auto-fill-button{display:none !important}.duet-input::placeholder{color:rgb(98, 121, 138);opacity:1 !important;transition:color 300ms ease}.duet-input:focus::placeholder{color:rgb(181, 198, 208)}.duet-input[disabled]{color:rgb(98, 121, 138) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 236, 239) !important;border-color:rgb(181, 198, 208) !important;opacity:1 !important;-webkit-text-fill-color:rgb(8, 42, 77) !important}.duet-input:hover:not(:disabled):not(:focus){outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input:hover:not(:disabled):not(:focus),.duet-input:hover:not(:disabled):not(:focus).duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.has-error .duet-input:hover:not(:disabled):not(:focus){outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important}.duet-input:focus{outline:2px solid;outline-color:rgb(0, 119, 179) !important;outline-offset:-1px}.duet-theme-turva .duet-input:focus,.duet-input:focus.duet-theme-turva{outline-color:rgb(23, 42, 59) !important}.has-error .duet-input:focus{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255) !important}.duet-input:focus+.duet-input-icon{color:rgb(0, 119, 179)}.duet-input[type=search]:not(:placeholder-shown):focus+.duet-input-icon{display:none}.duet-input:not(:focus):not(:hover):invalid{outline:none !important}.duet-input[type=number]::-webkit-inner-spin-button,.duet-input[type=number]::-webkit-outer-spin-button,.duet-input[type=time]::-webkit-inner-spin-button,.duet-input[type=time]::-webkit-outer-spin-button{display:none;margin:0;-webkit-appearance:none}.duet-input::-webkit-search-cancel-button{margin-right:-28px}.duet-input-help{display:block;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(98, 121, 138);border-radius:4px}.duet-input-help span{display:block;margin-top:8px}.has-error .duet-input-help{color:rgb(214, 28, 82)}.duet-label-hidden label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip:rect(0 0 0 0)}.duet-input-relative{position:relative;width:100%}.duet-input-variation-button,.duet-input-variation-button-left{position:relative;width:100%}.duet-input-variation-button .duet-input-relative,.duet-input-variation-button-left .duet-input-relative{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;align-items:center;justify-content:flex-start;width:auto}.duet-input-variation-button .duet-input-relative duet-button,.duet-input-variation-button-left .duet-input-relative duet-button{z-index:250;margin-bottom:0}.duet-input-variation-button-left .duet-input-relative{border-radius:4px}.duet-input-variation-button .duet-input-relative .duet-input{border-right-width:0 !important;border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.duet-input-variation-button-left .duet-input-relative .duet-input{border-left-width:0 !important;border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.duet-input-variation-revealable{position:relative;width:100%}.duet-input-variation-revealable ::-ms-reveal{display:none}.duet-input-variation-revealable .duet-input-relative{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;align-items:center;justify-content:flex-start;width:auto;outline:initial;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 150ms ease}.duet-input-variation-revealable .duet-input-relative duet-button{z-index:250;margin-bottom:0}.duet-input-variation-revealable .duet-input-relative .duet-input{border-width:0 !important}.duet-input-variation-revealable .duet-input-relative .duet-input:focus,.duet-input-variation-revealable .duet-input-relative .duet-input:hover{outline:none !important;border-width:0 !important}.duet-input-variation-revealable.disabled .duet-input-relative{outline:none;background:rgb(245, 248, 250);border-color:rgb(212, 223, 229)}.duet-input-variation-revealable.has-error .duet-input-relative{border-color:rgb(214, 28, 82)}.duet-input-variation-revealable.has-focus .duet-input-relative{outline:2px solid;outline-offset:-1px;outline-color:rgb(62, 84, 102);border-color:rgb(0, 119, 179)}.duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative{outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative,.duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-input-variation-revealable.has-error:hover:not(.disabled) .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment.has-focus .duet-input-relative,.duet-input-container.has-chips.has-focus .duet-input-relative{outline:2px solid;outline-color:rgb(0, 119, 179) !important;outline-offset:-1px}.duet-theme-turva .duet-input-container.has-adornment.has-focus .duet-input-relative,.duet-input-container.has-adornment.has-focus .duet-input-relative.duet-theme-turva,.duet-theme-turva .duet-input-container.has-chips.has-focus .duet-input-relative,.duet-input-container.has-chips.has-focus .duet-input-relative.duet-theme-turva{outline-color:rgb(23, 42, 59) !important}.duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative{outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative.duet-theme-turva,.duet-theme-turva .duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-input-container.has-adornment.has-error .duet-input-relative,.duet-input-container.has-chips.has-error .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment.has-error.has-focus .duet-input-relative,.duet-input-container.has-chips.has-error.has-focus .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255) !important}.duet-input-container.has-adornment.has-error:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips.has-error:hover:not(:disabled):not(.has-focus) .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment .duet-input-relative,.duet-input-container.has-chips .duet-input-relative{display:flex;flex-direction:row;flex-wrap:wrap;align-content:center;align-items:center;justify-content:flex-start;width:auto;padding-right:2px;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 150ms ease}.duet-input-container.has-adornment .duet-input-relative .duet-input,.duet-input-container.has-chips .duet-input-relative .duet-input{flex-grow:1;flex-basis:4rem;padding-left:0 !important;margin-left:12px !important;border-width:0 !important}.duet-input-container.has-adornment .duet-input-relative .duet-input:focus,.duet-input-container.has-adornment .duet-input-relative .duet-input:hover,.duet-input-container.has-chips .duet-input-relative .duet-input:focus,.duet-input-container.has-chips .duet-input-relative .duet-input:hover{outline:none !important;border-width:0 !important}.duet-input-container.has-adornment .duet-input-relative .duet-input{padding:12px 14px !important;margin:initial !important}.duet-input-container.has-adornment .duet-input-relative .input-adornment{color:rgb(98, 121, 138)}.duet-input-container.has-adornment .duet-input-relative .input-adornment.prefix{padding-left:14px}.duet-input-container.has-adornment .duet-input-relative .input-adornment.suffix{padding-right:14px}.duet-input-container.has-prefix .duet-input-relative .duet-input{padding-left:8px !important}.duet-input-container.has-suffix .duet-input-relative .duet-input{padding-right:8px !important}.duet-theme-turva .duet-input-icon{color:rgb(23, 42, 59)}.duet-theme-turva.duet-input-container.has-clear .duet-input-clear-icon button{color:rgb(8, 42, 77)}.duet-theme-turva.has-error .duet-input+.duet-input-icon{color:rgb(214, 28, 82) !important}.duet-theme-turva:not(.has-error) .duet-input{border-color:rgb(120, 145, 164) !important}.duet-theme-turva .duet-input{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, 42, 59) !important}.duet-theme-turva .duet-input[disabled]{color:rgb(95, 122, 143) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 233, 237) !important;border-color:rgb(178, 194, 205) !important;opacity:1 !important;-webkit-text-fill-color:rgb(23, 42, 59) !important}.duet-theme-turva .duet-input::placeholder{color:rgb(120, 145, 164)}.duet-theme-turva .duet-input:focus::placeholder{color:rgb(178, 194, 205)}.duet-theme-turva .duet-input:focus+.duet-input-icon{color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-variation-button-left.has-focus .duet-input-relative{border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-variation-revealable.has-focus .duet-input-relative{border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-help{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(120, 145, 164)}.duet-theme-turva.has-error .duet-input-help{color:rgb(214, 28, 82)}.duet-theme-turva .duet-input-variation-revealable .duet-input-relative{border-color:rgb(120, 145, 164)}.duet-theme-turva.duet-input-variation-revealable.has-error .duet-input-relative{border-color:rgb(214, 28, 82)}.duet-theme-turva.duet-input-variation-revealable.has-focus .duet-input-relative{outline:2px solid;outline-offset:-1px;outline-color:rgb(53, 79, 101);border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-container.has-chips.has-focus .duet-input-relative{outline:2px solid;outline-offset:2px;outline-color:rgb(53, 79, 101)}.duet-theme-turva .duet-input-container.has-chips .duet-input-relative{border-color:rgb(120, 145, 164)}";
+const duetInputCss = ".duet-internal-label{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:12px !important;position:relative;z-index:100;display:inline-flex;width:auto;margin-top:8px !important;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:600 !important;line-height:1.25;line-height:1.25;color:rgb(8, 42, 77);text-align:left;word-break:break-word;cursor:default}.duet-internal-label.duet-p-0{padding:0 !important}.duet-internal-label.duet-m-0{margin:0 !important}.duet-internal-label span{font-size:1rem;font-weight:600 !important;word-break:break-word}.duet-internal-label.duet-m-0{margin-bottom:0 !important}.duet-internal-label.duet-small-margin{margin-top:8px !important;margin-bottom:4px !important}.duet-internal-label.duet-has-tooltip{padding-right:48px}@media (min-width: 48em){.duet-internal-label.duet-has-tooltip{padding-right:0}}.duet-internal-label.duet-internal-label-small{font-size:0.875rem}.duet-internal-label.duet-internal-label-small span{font-size:0.875rem}.duet-internal-label.duet-weight-normal{font-weight:400 !important}.duet-internal-label.duet-weight-normal span{font-weight:400 !important}.duet-internal-label.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, 42, 59)}*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{margin-right:16px !important}:host(:last-child),:host(:last-of-type){margin-right:0 !important}:host(.form-distribute:last-of-type:not(:last-child)){margin-right:16px !important}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;margin-bottom:12px !important;display:inline-flex;width:100%;min-width:calc(33.333% - 8px);max-width:100%;vertical-align:bottom;text-align:left}@media (min-width: 36em){:host{width:calc(50% - 16px - 3px)}}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}input[type=time]::-webkit-datetime-edit-fields-wrapper{padding:0}input[type=time]::-webkit-calendar-picker-indicator{display:none}duet-tooltip,::slotted(duet-tooltip){position:relative;top:12px;right:0}@media (min-width: 48em){duet-tooltip,::slotted(duet-tooltip){right:auto}}duet-caption:not(:last-of-type){margin-bottom:0}.duet-input-placeholder{position:absolute;top:-9px;left:9px;z-index:200;display:block;width:auto;max-width:60%;padding:0 0.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:rgb(255, 255, 255)}.duet-input-icon{position:absolute;top:50%;right:16px;z-index:200;width:20px;height:20px;font-size:0;line-height:normal;color:rgb(8, 42, 77);pointer-events:none;transform:translateY(-50%)}.duet-input-container{position:relative;width:100%;height:100%}.duet-input-container.has-clear .duet-input-clear-icon{position:relative;z-index:250}.duet-input-container.has-clear .duet-input-clear-icon button{position:absolute;top:-24px;right:-24px;min-width:48px;min-height:48px;color:rgb(0, 75, 129)}.duet-input-container.has-clear .duet-input-clear-icon button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-input-container.has-clear .duet-input-clear-icon button:focus,.duet-input-container.has-clear .duet-input-clear-icon button:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-input-container.has-clear .duet-input-clear-icon button:active{opacity:0.75;transition:none}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-xx-small button{top:-12px}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-x-small button{top:-16px}.duet-input-container.has-clear .duet-input-clear-icon.input-padding-small button{top:-20px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single button{top:-48px;right:0}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-xx-small button{top:-36px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-x-small button{top:-40px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-single.input-padding-small button{top:-44px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double button{top:-24px;right:12px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-xx-small button{top:-12px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-x-small button{top:-16px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-double.input-padding-small button{top:-20px}.duet-input-container.has-clear .duet-input-clear-icon.duet-input-clear-icon-button button{top:-24px;right:0}.duet-input-container.has-clear.has-icon .duet-input-clear-icon{top:-24px;right:24px}.duet-input-label-container{display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between}@media (min-width: 48em){.duet-input-label-container{justify-content:flex-start}}.duet-input{position:relative;z-index:100;display:block !important;width:100% !important;min-width:8rem;max-width:initial !important;height:auto !important;padding:12px 14px !important;margin:initial !important;margin-bottom:initial !important;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400 !important;font-variant-numeric:tabular-nums;line-height:1.5 !important;color:rgb(8, 42, 77) !important;cursor:initial !important;outline-color:initial !important;background:rgb(255, 255, 255) !important;background-clip:initial !important;border:1px solid rgb(127, 150, 165) !important;border-radius:4px !important;transition:border 150ms ease !important}.duet-input.input-padding-small{padding:8px 10px !important}.duet-input.input-padding-x-small{padding:4px 6px !important}.duet-input.input-padding-xx-small{padding:0px 2px !important}.duet-input.is-number{padding-right:112px !important}.duet-input.is-date{padding-right:64px !important}.duet-input.after-chip{padding-left:8px !important}.duet-input[readonly]{color:rgb(62, 84, 102) !important;border-color:rgb(212, 223, 229)}.has-error .duet-input{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.has-error .duet-input+.duet-input-icon{color:rgb(214, 28, 82) !important}.has-icon .duet-input{padding-right:48px !important}.duet-input.align-right{text-align:right}.duet-input::-ms-clear{display:none}.duet-input::-webkit-contacts-auto-fill-button{display:none !important}.duet-input::placeholder{color:rgb(98, 121, 138);opacity:1 !important;transition:color 300ms ease}.duet-input:focus::placeholder{color:rgb(181, 198, 208)}.duet-input[disabled]{color:rgb(98, 121, 138) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 236, 239) !important;border-color:rgb(181, 198, 208) !important;opacity:1 !important;-webkit-text-fill-color:rgb(8, 42, 77) !important}.duet-input:hover:not(:disabled):not(:focus){outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input:hover:not(:disabled):not(:focus),.duet-input:hover:not(:disabled):not(:focus).duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.has-error .duet-input:hover:not(:disabled):not(:focus){outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important}.duet-input:focus{outline:2px solid;outline-color:rgb(0, 119, 179) !important;outline-offset:-1px}.duet-theme-turva .duet-input:focus,.duet-input:focus.duet-theme-turva{outline-color:rgb(23, 42, 59) !important}.has-error .duet-input:focus{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255) !important}.duet-input:focus+.duet-input-icon{color:rgb(0, 119, 179)}.duet-input[type=search]:not(:placeholder-shown):focus+.duet-input-icon{display:none}.duet-input:not(:focus):not(:hover):invalid{outline:none !important}.duet-input[type=number]::-webkit-inner-spin-button,.duet-input[type=number]::-webkit-outer-spin-button,.duet-input[type=time]::-webkit-inner-spin-button,.duet-input[type=time]::-webkit-outer-spin-button{display:none;margin:0;-webkit-appearance:none}.duet-input::-webkit-search-cancel-button{margin-right:-28px}.duet-input-help{display:block;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(98, 121, 138);border-radius:4px}.duet-input-help span{display:block;margin-top:8px}.has-error .duet-input-help{color:rgb(214, 28, 82)}.duet-label-hidden label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;border:0;clip:rect(0 0 0 0)}.duet-input-relative{position:relative;width:100%}.duet-input-variation-button,.duet-input-variation-button-left{position:relative;width:100%}.duet-input-variation-button .duet-input-relative,.duet-input-variation-button-left .duet-input-relative{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;align-items:center;justify-content:flex-start;width:auto}.duet-input-variation-button .duet-input-relative duet-button,.duet-input-variation-button-left .duet-input-relative duet-button{z-index:250;margin-bottom:0}.duet-input-variation-button-left .duet-input-relative{border-radius:4px}.duet-input-variation-button .duet-input-relative .duet-input{border-right-width:0 !important;border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.duet-input-variation-button-left .duet-input-relative .duet-input{border-left-width:0 !important;border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.duet-input-variation-revealable{position:relative;width:100%}.duet-input-variation-revealable ::-ms-reveal{display:none}.duet-input-variation-revealable .duet-input-relative{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;align-items:center;justify-content:flex-start;width:auto;outline:initial;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 150ms ease}.duet-input-variation-revealable .duet-input-relative duet-button{z-index:250;margin-bottom:0}.duet-input-variation-revealable .duet-input-relative .duet-input{border-width:0 !important}.duet-input-variation-revealable .duet-input-relative .duet-input:focus,.duet-input-variation-revealable .duet-input-relative .duet-input:hover{outline:none !important;border-width:0 !important}.duet-input-variation-revealable.disabled .duet-input-relative{outline:none;background:rgb(245, 248, 250);border-color:rgb(181, 198, 208)}.duet-input-variation-revealable.readonly .duet-input-relative{border-color:rgb(212, 223, 229)}.duet-input-variation-revealable.has-error .duet-input-relative{border-color:rgb(214, 28, 82)}.duet-input-variation-revealable.has-focus .duet-input-relative{outline:2px solid;outline-offset:-1px;outline-color:rgb(62, 84, 102);border-color:rgb(0, 119, 179)}.duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative{outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative,.duet-input-variation-revealable:hover:not(.disabled):not(.has-focus) .duet-input-relative.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-input-variation-revealable.has-error:hover:not(.disabled) .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment.disabled .duet-input-relative,.duet-input-container.has-chips.disabled .duet-input-relative{border-color:rgb(181, 198, 208)}.duet-input-container.has-adornment.readonly .duet-input-relative,.duet-input-container.has-chips.readonly .duet-input-relative{border-color:rgb(212, 223, 229)}.duet-input-container.has-adornment.has-focus .duet-input-relative,.duet-input-container.has-chips.has-focus .duet-input-relative{outline:2px solid;outline-color:rgb(0, 119, 179) !important;outline-offset:-1px}.duet-theme-turva .duet-input-container.has-adornment.has-focus .duet-input-relative,.duet-input-container.has-adornment.has-focus .duet-input-relative.duet-theme-turva,.duet-theme-turva .duet-input-container.has-chips.has-focus .duet-input-relative,.duet-input-container.has-chips.has-focus .duet-input-relative.duet-theme-turva{outline-color:rgb(23, 42, 59) !important}.duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative{outline:2px solid;outline-color:rgb(127, 150, 165) !important;outline-offset:-1px}.duet-theme-turva .duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-adornment:hover:not(:disabled):not(.has-focus) .duet-input-relative.duet-theme-turva,.duet-theme-turva .duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips:hover:not(:disabled):not(.has-focus) .duet-input-relative.duet-theme-turva{outline-color:rgb(120, 145, 164) !important}.duet-input-container.has-adornment.has-error .duet-input-relative,.duet-input-container.has-chips.has-error .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment.has-error.has-focus .duet-input-relative,.duet-input-container.has-chips.has-error.has-focus .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important;background:rgb(255, 255, 255) !important}.duet-input-container.has-adornment.has-error:hover:not(:disabled):not(.has-focus) .duet-input-relative,.duet-input-container.has-chips.has-error:hover:not(:disabled):not(.has-focus) .duet-input-relative{outline-offset:-1px;background-color:rgb(255, 240, 243) !important;border-color:rgb(214, 28, 82) !important;outline-width:2px;outline-color:rgb(214, 28, 82) !important}.duet-input-container.has-adornment .duet-input-relative,.duet-input-container.has-chips .duet-input-relative{display:flex;flex-direction:row;flex-wrap:wrap;align-content:center;align-items:center;justify-content:flex-start;width:auto;padding-right:2px;border:1px solid rgb(127, 150, 165);border-radius:4px;transition:border 150ms ease}.duet-input-container.has-adornment .duet-input-relative .duet-input,.duet-input-container.has-chips .duet-input-relative .duet-input{flex-grow:1;flex-basis:4rem;padding-left:0 !important;margin-left:12px !important;border-width:0 !important}.duet-input-container.has-adornment .duet-input-relative .duet-input:focus,.duet-input-container.has-adornment .duet-input-relative .duet-input:hover,.duet-input-container.has-chips .duet-input-relative .duet-input:focus,.duet-input-container.has-chips .duet-input-relative .duet-input:hover{outline:none !important;border-width:0 !important}.duet-input-container.has-adornment .duet-input-relative .duet-input{padding:12px 14px !important;margin:initial !important}.duet-input-container.has-adornment .duet-input-relative .input-adornment{color:rgb(98, 121, 138)}.duet-input-container.has-adornment .duet-input-relative .input-adornment.prefix{padding-left:14px}.duet-input-container.has-adornment .duet-input-relative .input-adornment.suffix{padding-right:14px}.duet-input-container.has-prefix .duet-input-relative .duet-input{padding-left:8px !important}.duet-input-container.has-suffix .duet-input-relative .duet-input{padding-right:8px !important}.duet-theme-turva .duet-input-icon{color:rgb(23, 42, 59)}.duet-theme-turva.duet-input-container.has-clear .duet-input-clear-icon button{color:rgb(8, 42, 77)}.duet-theme-turva.has-error .duet-input+.duet-input-icon{color:rgb(214, 28, 82) !important}.duet-theme-turva:not(.has-error) .duet-input{border-color:rgb(120, 145, 164) !important}.duet-theme-turva .duet-input{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, 42, 59) !important}.duet-theme-turva .duet-input[readonly]{color:rgb(53, 79, 101) !important;border-color:rgb(212, 221, 226)}.duet-theme-turva .duet-input[disabled]{color:rgb(95, 122, 143) !important;cursor:not-allowed !important;outline:none !important;background:rgb(228, 233, 237) !important;border-color:rgb(178, 194, 205) !important;opacity:1 !important;-webkit-text-fill-color:rgb(23, 42, 59) !important}.duet-theme-turva .duet-input::placeholder{color:rgb(120, 145, 164)}.duet-theme-turva .duet-input:focus::placeholder{color:rgb(178, 194, 205)}.duet-theme-turva .duet-input:focus+.duet-input-icon{color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-variation-button-left.has-focus .duet-input-relative{border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-variation-revealable.has-focus .duet-input-relative{border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-help{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(120, 145, 164)}.duet-theme-turva.has-error .duet-input-help{color:rgb(214, 28, 82)}.duet-theme-turva .duet-input-variation-revealable .duet-input-relative{border-color:rgb(120, 145, 164)}.duet-theme-turva.duet-input-variation-revealable.disabled .duet-input-relative{border-color:rgb(178, 194, 205)}.duet-theme-turva.duet-input-variation-revealable.readonly .duet-input-relative{border-color:rgb(212, 221, 226)}.duet-theme-turva.duet-input-variation-revealable.has-error .duet-input-relative{border-color:rgb(214, 28, 82)}.duet-theme-turva.duet-input-variation-revealable.has-focus .duet-input-relative{outline:2px solid;outline-offset:-1px;outline-color:rgb(53, 79, 101);border-color:rgb(23, 42, 59)}.duet-theme-turva .duet-input-container.has-chips.has-focus .duet-input-relative{outline:2px solid;outline-offset:2px;outline-color:rgb(53, 79, 101)}.duet-theme-turva .duet-input-container.has-chips .duet-input-relative{border-color:rgb(120, 145, 164)}.duet-theme-turva .duet-input-container.has-chips.disabled .duet-input-relative{border-color:rgb(178, 194, 205)}.duet-theme-turva .duet-input-container.has-chips.readonly .duet-input-relative{border-color:rgb(212, 221, 226)}";
 
 const icons = {
     search: searchIcon,
@@ -160,6 +160,13 @@ const DuetInput = class {
          * interact with the input, and conveys its inactive state to assistive technologies.
          */
         this.disabled = false;
+        /**
+         * Makes the input component not mutable, meaning the user cannot edit the control.
+         * The user can otherwise interact, e.g. by selecting the content and copying it.
+         * Due to differences in different browsers' and screen readers' implementations it
+         * is strongly advisable to use this only with type="text".
+         */
+        this.readonly = false;
         /**
          * Controls the margin of the component.
          */
@@ -199,7 +206,8 @@ const DuetInput = class {
          */
         this.label = "Label";
         /**
-         * Display the input in error state along with an error message.
+         * Display the input in error state along with an error message. If input is disabled or readonly,
+         * error is ignored.
          */
         this.error = "";
         /**
@@ -369,7 +377,7 @@ const DuetInput = class {
             return clearing;
         };
         this.keyHandler = (event) => {
-            if (isEscapeKey(event) && this.clear) {
+            if (isEscapeKey(event) && this.clear && this.writable) {
                 this.handleClearClick(event);
             }
             if (isEnterKey(event) && this.variation === "revealable") {
@@ -382,7 +390,7 @@ const DuetInput = class {
             }
             if (this.chips && this.nativeInput.value.length === 0) {
                 if (isBackspaceKey(event)) {
-                    if (this.isChipSelected()) {
+                    if (this.isChipSelected() && this.writable) {
                         this.getSelectedChip().removeChip();
                         setTimeout(() => this.selectLastChip());
                     }
@@ -491,7 +499,6 @@ const DuetInput = class {
     componentWillLoad() {
         inheritGlobalTheme(this);
         this.disallowedPatternChange();
-        this.isCaptionVisible = !!this.caption;
         // Accept also slot element so that other components using duet-input can pass their tooltip slots here.
         checkNamedSlotElement(this.element, "tooltip", "duet-tooltip, slot", 1, true);
     }
@@ -508,9 +515,15 @@ const DuetInput = class {
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
     }
+    componentWillRender() {
+        this.isCaptionVisible = !!this.caption;
+    }
     componentDidRender() {
         proxyInputToSlot(this.element, this.proxyId, this.name, this.value, this.required);
     }
+    get writable() {
+        return !this.disabled && !this.readonly;
+    }
     /**
      * Sets focus on the specified `duet-input`. Use this method instead of the global
      * `input.focus()`.
@@ -680,7 +693,7 @@ const DuetInput = class {
             this.type !== "password" &&
             this.type !== "time" &&
             this.variation !== "button";
-        return (h(Host, { key: '1119e8e51f3a490e34665e77ce32ec21f7bc70c7', class: { "duet-expand": this.expand, "duet-m-0": this.margin === "none" }, onKeyUp: e => this.keyHandler(e) }, this.type === "time" && (h("duet-visually-hidden", { key: '31afa65dcb1b161f8c5a87c65953a26a552066b8', "aria-live": "polite", "aria-atomic": "true" }, selectedTime ? `${this.timeAnnouncement[this.language]} ${selectedTime.toLocaleTimeString()}` : "")), h("div", { key: '5574afef8c592593193cbf0c99eaf8eaa84dbf11', class: {
+        return (h(Host, { key: 'a859732fa2ed3e36d5564c93e08d4bd4cb501188', class: { "duet-expand": this.expand, "duet-m-0": this.margin === "none" }, onKeyUp: e => this.keyHandler(e) }, this.type === "time" && (h("duet-visually-hidden", { key: 'ce15aa89693e557f5abd16e8111db759be70c89d', "aria-live": "polite", "aria-atomic": "true" }, selectedTime ? `${this.timeAnnouncement[this.language]} ${selectedTime.toLocaleTimeString()}` : "")), h("div", { key: '58f44c874cc78e07b6ea9f9b07502f46830d389f', class: {
                 "duet-input-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 [`duet-input-variation-${this.variation}`]: true,
@@ -689,7 +702,7 @@ const DuetInput = class {
                 "has-icon": this.variation !== "button" &&
                     (!!this.icon ||
                         (this.type !== "text" && this.type !== "tel" && this.type !== "password" && this.type !== "time")),
-                "has-error": !!this.error,
+                "has-error": !!this.error && this.writable,
                 "has-chips": this.chips,
                 "has-clear": this.clear,
                 "has-focus": this.isFocused,
@@ -697,11 +710,12 @@ const DuetInput = class {
                 "has-prefix": !!this.fieldPrefix,
                 "has-suffix": !!this.fieldSuffix,
                 disabled: this.disabled,
-            } }, h("div", { key: 'cd0dfb4e8ef821c84d342fff017da9b3e6938134', class: "duet-input-label-container" }, h(DuetInternalLabel, { key: '7ef9a4e3ccbc5b7ac030ca66912eb0471103ed10', 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: 'f263424aa51a59f4252cad4b4a1347b5986869ae', class: "duet-input-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), h("slot", { key: 'b4afd5ae65bbc03083b81996965cb354d6fd2a35', name: "tooltip" })), this.caption && (h("duet-caption", { key: '1d126824ee2ef4b7a4dae8650363e9da0b58c288', id: this.topCaptionId, size: "medium" }, this.caption)), h("div", { key: 'adb5b8fa3b3de37c96d74fd1b888de75689a3ce0', class: {
+                readonly: this.readonly,
+            } }, h("div", { key: '285821770ae823d73eaaeff2f2c88996778f8b69', class: "duet-input-label-container" }, h(DuetInternalLabel, { key: '3fa55f1f4bd918ba022ecf233e9aff5b972a72db', 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: '2e08a75002784f2269629dce2ae232fa768d0906', class: "duet-input-tooltip", direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), h("slot", { key: '4125f60b2ae5f69cf6e33ad5485f6d9633b6ea47', name: "tooltip" })), this.caption && (h("duet-caption", { key: 'e7c72af17640691b585f81ac5c9c838ebb8c36b0', id: this.topCaptionId, size: "medium" }, this.caption)), h("div", { key: 'f7228488fa060e6b0344fd86ac487aed1c76a418', class: {
                 "duet-input-relative": true,
                 "duet-theme-turva": this.theme === "turva",
-                "has-error": !!this.error,
-            } }, this.placeholder && this.echoPlaceholder && (this.value || this.type === "time") && (h("duet-caption", { key: 'fcadd06bf9e0dc4115c0bd004de23fa5692b03fc', id: this.topCaptionPlaceholderId, class: "duet-input-placeholder", margin: "none", size: "small" }, this.placeholder)), this.chips && (h("duet-visually-hidden", { key: '84a8a1feed5a0895936f5e1d5ee310c6282f1678', id: this.chipCountId }, ", ", `${this.getAllChips().length} ${getLocaleString(this.chipsSelectedDesriptionLabel)}`, ",")), this.variation === "button-left" && h("slot", { key: '90533c1b234e2644eb97317f903abbf04fee8138', name: "button-left" }), this.fieldPrefix && (h("span", { key: '151fd6757766b8c7e86ded73639d87bb32814089', class: "input-adornment prefix", id: this.prefixId }, this.fieldPrefix)), h("input", Object.assign({ key: '06811722717032661d4ba5e3bfa9c2b6196cf082', ref: input => (this.nativeInput = input), onInput: this.onInput, onKeyDown: this.onInputKeyDown, onPaste: this.onInputPaste, onBlur: this.onBlur, onFocus: this.onFocus, type: this.getInputType(), class: {
+                "has-error": !!this.error && this.writable,
+            } }, this.placeholder && this.echoPlaceholder && (this.value || this.type === "time") && (h("duet-caption", { key: 'b9f16783722dd5eceffa4c680f735d0a967e2cb1', id: this.topCaptionPlaceholderId, class: "duet-input-placeholder", margin: "none", size: "small" }, this.placeholder)), this.chips && (h("duet-visually-hidden", { key: 'ceeb27c775ffc161915f98aaeeb0cf0a61b56b95', id: this.chipCountId }, ", ", `${this.getAllChips().length} ${getLocaleString(this.chipsSelectedDesriptionLabel)}`, ",")), this.variation === "button-left" && h("slot", { key: '8cccc4fde3d2315b69a9212e2f1bacf627fefa0b', name: "button-left" }), this.fieldPrefix && (h("span", { key: 'cdc1574242d2921e79c871330b4e058e8a7219cb', class: "input-adornment prefix", id: this.prefixId }, this.fieldPrefix)), h("input", Object.assign({ key: '707a06f6db287db4753feafcf24f5d4d1e34d01a', ref: input => (this.nativeInput = input), onInput: this.onInput, onKeyDown: this.onInputKeyDown, onPaste: this.onInputPaste, onBlur: this.onBlur, onFocus: this.onFocus, type: this.getInputType(), class: {
                 "duet-input": true,
                 disabled: this.disabled,
                 "is-number": this.component === "number",
@@ -709,17 +723,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.getAriaLabelledBy(), "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.getAutocomplete(), required: this.required, role: this.role, name: this.name, id: identifier }, inputProps)), this.maxlength && (h("duet-visually-hidden", { key: `maxlength-announcement-${this.maxlengthAnnouncementKey}`, "aria-live": "polite", "aria-atomic": "true" }, this.maxlengthAnnouncement)), this.fieldSuffix && (h("span", { key: 'b2d284fc05798f7dab08555f524cabf4f94f0e19', class: "input-adornment suffix", id: this.suffixId }, this.fieldSuffix)), !this.value && hasInputIcon && (h("div", { key: '8364a8a7687b6e37279585edf55da9005673f4df', class: "duet-input-icon" }, h("duet-icon", { key: '1b420da3e76241f1e105ce5ef8b9f40e6490424d', margin: "none", size: "small", icon: icons[this.type].svg, color: "currentColor" }))), this.clear && this.value && (h("div", { key: 'c67978258fbf64a22563a8e139b7a7de012bb4ca', class: {
+            }, value: this.value, disabled: this.disabled, readonly: this.readonly, "aria-invalid": this.error && this.writable ? "true" : "false", "aria-labelledby": this.getAriaLabelledBy(), "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.getAutocomplete(), required: this.required, role: this.role, name: this.name, id: identifier }, inputProps)), this.maxlength && (h("duet-visually-hidden", { key: `maxlength-announcement-${this.maxlengthAnnouncementKey}`, "aria-live": "polite", "aria-atomic": "true" }, this.maxlengthAnnouncement)), this.fieldSuffix && (h("span", { key: 'b75739603d5e5ad093db7a2440c0b8abc217dcf6', class: "input-adornment suffix", id: this.suffixId }, this.fieldSuffix)), !this.value && hasInputIcon && (h("div", { key: '404d988da35d4387e0eda7e1d343e6d98df86be7', class: "duet-input-icon" }, h("duet-icon", { key: '917289116b7c97efb8f384353f44f02c7fd07205', margin: "none", size: "small", icon: icons[this.type].svg, color: "currentColor" }))), this.clear && this.value && this.writable && (h("div", { key: 'b7b38ab40d68c5092bc82672308572134a033168', 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: 'b243244d6d5184c42a9afb93483479a0b07bad7d', onClick: this.handleClearClick, id: this.clearId, "aria-label": this.clearLabel[this.language], "aria-keyshortcuts": "Escape" }, h("duet-icon", { key: '2ff21863005e55dc7a4dc1a16e2e2e40ad7f85cf', margin: "none", size: "medium", name: "action-clear-input", color: "currentColor" })))), this.icon && this.variation !== "button" && (h("div", { key: '7732892f159a6c7c9ad7c89b0031052b1ed45502', class: "duet-input-icon" }, h("duet-icon", { key: '97de6dc8ff0c506db494dc36edc6d0107792c2b9', margin: "none", size: "small", name: this.icon, color: "currentColor" }))), this.variation === "button" && h("slot", { key: '5c940caf605e2eaff4db2a36c63548db78f36f41', name: "button" }), this.variation === "revealable" && (h("duet-button", { key: 'caf0a7c8bec4a620e2ca5f897eaabc1814f32c5d', 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: 'ea77d45ff7dde685c5f35e0b33d1c75189d2d6c4', onClick: this.handleClearClick, id: this.clearId, "aria-label": this.clearLabel[this.language], "aria-keyshortcuts": "Escape" }, h("duet-icon", { key: '7807be8fb14c59731458e17b7ceecb99cda77545', margin: "none", size: "medium", name: "action-clear-input", color: "currentColor" })))), this.icon && this.variation !== "button" && (h("div", { key: 'c6a744f0be1c484f051980f70d0a0deed5fcd9c0', class: "duet-input-icon" }, h("duet-icon", { key: '9d33dac97ba817f3bfa11e82097b95499727c885', margin: "none", size: "small", name: this.icon, color: "currentColor" }))), this.variation === "button" && h("slot", { key: '435f5d3927a55c4ce2c17e4483305b4f47afef8b', name: "button" }), this.variation === "revealable" && (h("duet-button", { key: 'a1074a0cfe211da5cdebdf9a81c82d6200de6961', 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: 'cc394dbd7d28fc9e1cf0a864c67e7e7a6a835d1a' }, h("span", { key: '20033ed28c86634d6faf03180e53cff84def1329', "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: '0a8bbe5ec03d73b5e673c42a7031c6b097bd8681' }, h("span", { key: 'cf080989a3e7b86369904921249a95fe1cb3bc19', "aria-live": "polite" }, this.isPasswordRevealed
             ? this.passwordShownAriaAnnouncement[this.language]
-            : this.passwordHiddenAriaAnnouncement[this.language]))), h("slot", { key: 'b72c50503fa80fd1ba6764b7b3348bc5d7b2813c' })), h("span", { key: '25790e8c5147bb271fefa6cbce2343287b57c816', class: "duet-input-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", { key: 'c62d261a03ebec492aed9c65a836525e47660cfc', class: "duet-input-error" }, this.error)))));
+            : this.passwordHiddenAriaAnnouncement[this.language]))), h("slot", { key: '32c4cb54404e67cf564c60e555f7aee3437f0282' })), h("span", { key: 'a860619ce4d528dcb8d714ef3680629640c08461', class: "duet-input-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && this.writable && h("span", { key: '3dfc64f27935e571630a215cbd69bcd2c0d8e1f1', 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-D3450NfA.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-CdcBxXLd.js';
 import { i as isInternetExplorer } from './is-internet-explorer-DxESMgwA.js';
-import { c as checkNamedSlotElement } from './slot-utils-Dxcjtmp3.js';
+import { c as checkNamedSlotElement } from './slot-utils-BSS0Em_Z.js';
 
 const duetLayoutCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}::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;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;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)}}";
 

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-D3450NfA.js';
-import { i as inheritGlobalTheme } from './themeable-component-QHdUfcat.js';
+import { r as registerInstance, h, g as getElement, H as Host } from './index-CdcBxXLd.js';
+import { i as inheritGlobalTheme } from './themeable-component-DQtSOD4i.js';
 import { w as watchForOptions } from './watch-options-BmMFVM-y.js';
 
 const duetListCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;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}";
@@ -150,7 +150,7 @@ const DuetListItem = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '83029afa5ebc666926eb1572b8ad9a311bdbfcf1', class: {
+        return (h(Host, { key: '93429c86b018cb9924bb270b97c4cc6ea77e15e2', 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: '884936458d12b95cd553cd4dc4d8a237cd8e5830' }, h("slot", { key: 'b17473caf7b410acf49f8c68f9ae53b3071397d7', name: "label" })), h("dd", { key: 'e5c6aa8b8d8998d500d27493896a288f71861df6' }, h("slot", { key: '7a6a3b223c394bb3376d7734791cfd439076d5f7', name: "value" }))));
+            } }, h("dt", { key: '0cecfd17dc6b92affc741ef0acd7bd0711458349' }, h("slot", { key: '697172f2c68302fa10188e2b403d3cddbd00e87e', name: "label" })), h("dd", { key: 'd9fd6244ee03c35c91e8b22a4ddce2daf7e97c0e' }, h("slot", { key: '52593380dc62cbb4245718eaf4093fa9e1faa45c', 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-D3450NfA.js';
-import { i as inheritGlobalTheme } from './themeable-component-QHdUfcat.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-CdcBxXLd.js';
+import { i as inheritGlobalTheme } from './themeable-component-DQtSOD4i.js';
 
 const duetMenuBarButtonCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;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:2px solid;outline-offset:-4px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-menu-bar-button:focus,.duet-menu-bar-button:focus.duet-theme-turva{outline:2px solid;outline-offset:-4px;outline-color:rgba(53, 79, 101, 0.8)}.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}}@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-theme-turva.duet-menu-bar-button{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-theme-turva.duet-menu-bar-button:hover{color:rgb(230, 23, 64)}}";
 
@@ -53,10 +53,10 @@ const DuetMenuBarButton = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'e826fdb0b0fb223aea52738971ddbc17f6004833', role: "listitem", onfocus: () => this.setFocus() }, h("button", { key: '350dd3a06df24d5f3a3f3dccb4a4a48b4a43e9f7', ref: button => (this.nativeButton = button), class: {
+        return (h(Host, { key: '88f40e311573b2d27899805495afd382b2aad3fb', role: "listitem", onfocus: () => this.setFocus() }, h("button", { key: '08b48017ee3ecd55f15950dfaae5d3ad1793c903', 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: '96911d1ad50d5b247e27d3e6b5712326434a6354', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: '004e73cb6a5e6f3126a45d9fa7184f7b424d4f60' }))));
+            }, "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: 'd976b8e93df053c47a8a9eb29f110032af9c5296', class: "menu-bar-button-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: 'ca7e1fdd2f0076481571c6e68dbbf502b07a6eac' }))));
     }
     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-D3450NfA.js';
-import { i as inheritGlobalTheme } from './themeable-component-QHdUfcat.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-CdcBxXLd.js';
+import { i as inheritGlobalTheme } from './themeable-component-DQtSOD4i.js';
 import { a as isEscapeKey } from './keyboard-utils-BaefVzkx.js';
 
 const duetMenuBarDropdownLinkCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;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:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-menu-bar-dropdown-link:focus,.duet-menu-bar-dropdown-link:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}.duet-menu-bar-dropdown-link:hover{background:rgb(228, 241, 247)}.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, 42, 59)}.duet-menu-bar-dropdown-link.duet-theme-turva:hover{background:rgb(251, 235, 225)}";
@@ -52,11 +52,11 @@ const DuetMenuBarDropdownLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '9321ae6f770fbc1b00cde317df160db1d32fc53a' }, h("a", { key: '85ef5b95cffcae577699f0a3453b0c3fd24d50e9', class: {
+        return (h(Host, { key: 'd38d954b553c14935519a49e02698a1bd32428b4' }, h("a", { key: '2476410fa261eb67053dbd56f01bc335bdbcbd7d', 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: '374d983fce34f87bf8c7878ede20b9fae712b8cc', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), h("slot", { key: '26ababe0542732c2fc589340dda968e3bc574caa' }))));
+            }, href: this.href, role: "menuitem", onKeyUp: e => this.handleEscape(e), "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: 'ba2417251a7dbd8bc7148c65d0aae529f728b274', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), h("slot", { key: '257327a6af0a87c8565bf75cace2b5657580783a' }))));
     }
     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-D3450NfA.js';
-import { i as inheritGlobalTheme } from './themeable-component-QHdUfcat.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-CdcBxXLd.js';
+import { i as inheritGlobalTheme } from './themeable-component-DQtSOD4i.js';
 import { a as isEscapeKey } from './keyboard-utils-BaefVzkx.js';
 
 const duetMenuBarDropdownCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;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}.duet-menu-bar-dropdown button:focus{outline:2px solid;outline-offset:2px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-menu-bar-dropdown button:focus,.duet-menu-bar-dropdown button:focus.duet-theme-turva{outline:2px solid;outline-offset:2px;outline-color:rgba(53, 79, 101, 0.8)}@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 .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-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);transform:translateY(2px);transition:300ms ease}.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, 42, 59)}.duet-menu-bar-dropdown.duet-theme-turva button:hover{color:rgb(230, 23, 64)}.duet-menu-bar-dropdown.duet-theme-turva button.active{color:rgb(230, 23, 64)}.duet-menu-bar-dropdown.duet-theme-turva button.active::after{background:rgb(230, 23, 64)}.duet-menu-bar-dropdown.duet-theme-turva .items{background:rgb(255, 255, 255)}";
@@ -66,17 +66,17 @@ const DuetMenuBarDropdown = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'a8e5a338b3e99161819aca174ed5d7390adcd508', role: "listitem" }, h("div", { key: '3515f7355c3f564bdebbea9a7d1845754ad9d3ce', class: {
+        return (h(Host, { key: 'ff056c7f9b32fc195dce24533ee8630abfeaaf3a', role: "listitem" }, h("div", { key: '60e89230ad26c406f88ac6f97b0aa6c6ba3d375e', 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: '8ae1babb7852048ac222167858eeb10f2ef8a3ee', 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: 'f17715296f5d32580c607489aa7af48e86f08d76', 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: '2d22eaa31070fc91119b0d15fcae8768764b3038', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'fa891196c7c3247a4349fc5db8d59e0500754cb9', class: "label" }, h("slot", { key: '59a1658b0e39bae2f94b8583e7ce787118f13221', name: "label" }), h("duet-icon", { key: '31da6e0c50072b0411a7e9c69d79aa810963d0b8', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: '9490db9c65cf17be947333aed8562e5a146da13e', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: 'f8c1548339d36aac26609301b610e0f06970d3f4', class: "menu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: '8c9b33f5e4963f0a44ebfd8c2153e67273e220fe', class: "label" }, h("slot", { key: '384f003e1c584084aa93a1419370fb90ee1dd12b', name: "label" }), h("duet-icon", { key: '09e840b30922276af41659768e0ccdbc2dfd6bfd', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: 'fe85298a3a0c0bdffba6571a62a4946b884aaca1', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: '31a887188bb39ed4efbe1383940b3b8db7396102' })))));
+            } }, h("slot", { key: '826246d0e8db1cc67ad2549613e8ae6dc6a6a6b0' })))));
     }
     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-D3450NfA.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-CdcBxXLd.js';
 import { n as newWindowIcon } from './action-new-window-small-EH8_HdAm.js';
 import { a as DuetStringsExternalDefaults } from './common-strings-8RjiAqaE.js';
-import { i as inheritGlobalTheme } from './themeable-component-QHdUfcat.js';
-import { g as getAccessibleLinkLabel } from './a11y-utils--wwGTL0T.js';
-import { g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-D4WVl8Ph.js';
+import { i as inheritGlobalTheme } from './themeable-component-DQtSOD4i.js';
+import { g as getAccessibleLinkLabel } from './a11y-utils-DbDY4hy4.js';
+import { g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './language-utils-C-lpMyP9.js';
 import './_commonjsHelpers-DvwKrUS6.js';
-import './slot-utils-Dxcjtmp3.js';
+import './slot-utils-BSS0Em_Z.js';
 import './string-utils-C6E9F6QT.js';
 
 const duetMenuBarItemCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;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;white-space:nowrap;text-decoration:none;cursor:pointer}.duet-menu-bar-item:focus{outline:2px solid;outline-offset:-4px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-menu-bar-item:focus,.duet-menu-bar-item:focus.duet-theme-turva{outline:2px solid;outline-offset:-4px;outline-color:rgba(53, 79, 101, 0.8)}.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)}@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);transform:translateY(2px);transition:300ms ease}@media (min-width: 62em){.duet-menu-bar-item.active::after{z-index:auto;height:2px}}@media (min-width: 62em){.duet-menu-bar-item:hover{color:rgb(0, 119, 179)}}.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::after{background:rgb(230, 23, 64)}.duet-menu-bar-item.duet-theme-turva[aria-expanded=true]{color:rgb(230, 23, 64)}.duet-menu-bar-item.active.duet-theme-turva{color:rgb(230, 23, 64)}.duet-menu-bar-item.active.duet-theme-turva::after{background:rgb(230, 23, 64)}@media (min-width: 62em){.duet-menu-bar-item.duet-theme-turva:hover{color:rgb(230, 23, 64)}}";
@@ -78,11 +78,11 @@ const DuetMenuBarItem = class {
      */
     render() {
         const TagName = this.url ? "a" : "button";
-        return (h(Host, { key: '19ec1a0c3d191845df0ae30cdb8f9b83c198b79b', role: "listitem" }, h(TagName, { key: '85786500b66990fe9eee940a466ab9cd08eb2103', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
+        return (h(Host, { key: 'e9d6de396865bf28beb5717950467d4b0d1f519c', role: "listitem" }, h(TagName, { key: 'f7cbfca8d2781170838b37dfa65714ddbf932145', 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: 'ba8faece0464d006590733c1ff8437cdd931ca03', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), h("slot", { key: '80207075bb856dbfecb6a91e0a72b13287751da4' }), (this.trailingIcon || this.external) && (h("duet-icon", { key: '7e04921588a4c306f61b8056c7c0a7b83c2c29f8', 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: '934988ad9b43c8e3691c02a698c0677ea2629faa', class: "leading-icon", size: "auto", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), h("slot", { key: '50cbb5cdd4a117936eea719c9f176667688e74dc' }), (this.trailingIcon || this.external) && (h("duet-icon", { key: 'cfe3ea2669e9d8eb1f14ffa88eacd1c08548f55c', 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-D3450NfA.js';
-import { i as inheritGlobalTheme } from './themeable-component-QHdUfcat.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-CdcBxXLd.js';
+import { i as inheritGlobalTheme } from './themeable-component-DQtSOD4i.js';
 
 const duetMenuBarLinkCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;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;white-space:nowrap;text-decoration:none}.duet-menu-bar-link:focus{outline:2px solid;outline-offset:-4px;outline-color:rgba(0, 119, 179, 0.8)}.duet-theme-turva .duet-menu-bar-link:focus,.duet-menu-bar-link:focus.duet-theme-turva{outline:2px solid;outline-offset:-4px;outline-color:rgba(53, 79, 101, 0.8)}.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}}@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);transform:translateY(2px);transition:300ms ease}@media (min-width: 62em){.duet-menu-bar-link.active::after{z-index:auto;height:2px}}@media (min-width: 62em){.duet-menu-bar-link:hover{color:rgb(0, 119, 179)}}.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\"}.duet-menu-bar-link.active.duet-theme-turva{color:rgb(230, 23, 64)}.duet-menu-bar-link.active.duet-theme-turva::after{background:rgb(230, 23, 64)}@media (min-width: 62em){.duet-menu-bar-link.duet-theme-turva:hover{color:rgb(230, 23, 64)}}";
 
@@ -37,11 +37,11 @@ const DuetMenuBarLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'ed2a24c6bdd70f91370a4a70bf22804ce698ca49', role: "listitem" }, h("a", { key: 'f957e2da0344bdd58789bb90151c23b341824d93', class: {
+        return (h(Host, { key: '8c3490151abb08fa0f203abfa0d7376b26df086f', role: "listitem" }, h("a", { key: '6b285bf13edb937dc1e7a6e5e6479ae58c9e2578', 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: 'c6f7c0a4fbc065c7ff132dba57ec468036359582', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: '73100c0c85e3087896e81c526816b1e92d13b9c3' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '551b1bb669f59a9db03276cc4bfdebd3c42a8929', class: "menu-bar-link-icon", theme: this.theme, size: "auto", name: this.icon, margin: "none", color: "currentColor" })), h("slot", { key: '271053e138876c15abe304dcb141122d5d313f1f' }))));
     }
     get element() { return getElement(this); }
 };

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

@@ -1,9 +1,9 @@
 /*!
  * Built with Duet Design System
  */
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-D3450NfA.js';
-import { i as inheritGlobalTheme } from './themeable-component-QHdUfcat.js';
-import { a as getLanguage } from './language-utils-D4WVl8Ph.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CdcBxXLd.js';
+import { i as inheritGlobalTheme } from './themeable-component-DQtSOD4i.js';
+import { a as getLanguage } from './language-utils-C-lpMyP9.js';
 import './string-utils-C6E9F6QT.js';
 
 const duetMenuBarCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0}:host{box-sizing:border-box;padding:0;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;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-grow:1;flex-basis:0;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-grow:1;flex-basis:0;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;text-overflow:ellipsis;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;line-height:1.1;color:rgb(62, 84, 102);-webkit-hyphens:auto;hyphens:auto;border-left:1px solid rgb(212, 223, 229)}@media (min-width: 48em){.duet-menu-bar .container .duet-logo-info-text{max-height:3.3rem;font-size:1rem}}.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)}.right{font-size:0.875rem;font-weight:400;line-height:1.25;color:rgb(0, 75, 129)}.duet-theme-turva .duet-menu-bar{background:rgb(255, 255, 255);box-shadow:0 2px 6px 0 rgba(23, 28, 58, 0.07)}@media (min-width: 62em){.duet-theme-turva .duet-menu-bar{box-shadow:0 3px 6px 0 rgba(23, 28, 58, 0.1)}}.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, 42, 59)}.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, 42, 59)}.duet-theme-turva .duet-logo-info-text{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(53, 79, 101);border-left-color:rgb(212, 221, 226)}";