@duetds/components 10.0.0-alpha.2 → 10.0.0-alpha.3

package/lib/esm/duet-slideout-panel.entry.js

@@ -7,9 +7,9 @@ import { e as enableBodyScroll, d as disableBodyScroll } from './body-scroll-468
 import { F as FocusGuard } from './focus-utils-adcd9463.js';
 import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './language-utils-14969cef.js';
 import { h as hasSlot } from './slot-utils-4e5ed4eb.js';
-import { g as getColorByName } from './token-utils-a32eb753.js';
+import { g as getColorByName } from './token-utils-b9ba8c5e.js';
 import './string-utils-192eb3c8.js';
-import './tokens.module-a746651a.js';
+import './tokens.module-2d02f5ff.js';
 
 const duetSlideoutPanelCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;height:100%}:host slot:not([name=label])::slotted(*){position:relative;top:0.5rem;opacity:0;transition:top 0.3s ease-in, opacity 0.3s ease-in}:host([open]) slot:not([name=label])::slotted(*){top:0;opacity:1}.duet-slideout-panel{position:relative;height:100%}.duet-slideout-panel .link{position:relative;display:flex;gap:20px;align-items:center;justify-content:flex-start;width:100%;height:100%;padding:8px 0;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1.5rem;font-weight:800;line-height:1.25;color:rgb(8, 42, 77);text-align:left;text-decoration:none;cursor:pointer}.duet-slideout-panel .link .duet-slideout-icon{position:relative;display:inline-flex;font-size:0;line-height:normal;vertical-align:baseline}.duet-slideout-panel .link .duet-slideout-icon .duet-slideout-badge{position:absolute;top:0;left:16px;display:inline-block;width:6px;height:6px;background:rgb(247, 178, 40);border-radius:50%;box-shadow:0 0 0 1px #c18b1f}.duet-theme-turva .duet-slideout-panel .link .duet-slideout-icon .duet-slideout-badge{background:rgb(247, 178, 40)}@media (min-width: 62em){.duet-slideout-panel .link .duet-slideout-icon{margin-right:8px}}.duet-slideout-panel .link .label{display:flex;gap:0.5rem;align-items:center;justify-content:space-between;width:100%}.duet-slideout-panel .link .label-text.small{font-size:1rem;font-weight:600}.duet-slideout-panel .link .label-text.medium{font-size:1.25rem;font-weight:600}.duet-slideout-panel .link .label-text.large{font-size:1.5rem;font-weight:800}.duet-slideout-panel .link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-slideout-panel .link.active .label-text{position:relative}.duet-slideout-panel .link.active .label-text.small::after{height:1px;transform:translateY(1px)}.duet-slideout-panel .link.active .label-text::after{position:absolute;top:auto;bottom:0;left:0;display:block;width:100%;height:2px;content:\"\";background:rgb(0, 119, 179);transform:translateY(2px)}.duet-slideout-panel .dialog{position:fixed;top:0;left:0;z-index:600;width:100%;height:100%;overflow-y:auto;visibility:visible}.duet-slideout-panel .dialog.hidden{visibility:hidden}.duet-slideout-panel .dialog.hidden .top .back,.duet-slideout-panel .dialog.hidden .top span{opacity:0}.duet-slideout-panel .top-container.has-sticky-header-slot{position:sticky;top:0;z-index:200}.duet-slideout-panel .top-container.has-sticky-header-slot .top{background:rgb(240, 247, 250)}.duet-slideout-panel .top-container.has-sticky-header-slot .sticky-header{display:block;padding:0 16px}.duet-slideout-panel .top{display:flex;align-items:center;justify-content:space-between;padding:4px}.duet-slideout-panel .top .back{opacity:1;transition:top 0.3s ease-in, opacity 0.3s ease-in}.duet-slideout-panel .top .back:focus,.duet-slideout-panel .top .close:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-slideout-panel .top duet-icon{padding:16px}.duet-slideout-panel .top span{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;line-height:1.5;color:rgb(8, 42, 77);opacity:1;transition:top 0.3s ease-in, opacity 0.3s ease-in}.duet-slideout-panel .sticky-header{display:none;width:100%;padding:0 1.5rem;margin-bottom:20px;background:rgb(240, 247, 250);border-bottom:1px solid rgb(212, 223, 229)}.duet-slideout-panel .items{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:1rem 16px;overflow-y:auto;color:rgb(8, 42, 77)}.duet-slideout-panel.duet-theme-turva .link{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-slideout-panel.duet-theme-turva .link:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-slideout-panel.duet-theme-turva .link.active .label-text::after{background:rgb(198, 12, 48)}.duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .top{background:rgb(245, 247, 250)}.duet-slideout-panel.duet-theme-turva .has-sticky-header-slot .sticky-header{background:rgb(245, 247, 250);border-bottom:1px solid rgb(222, 224, 228)}.duet-slideout-panel.duet-theme-turva .top .back:focus,.duet-slideout-panel.duet-theme-turva .top .close:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-slideout-panel.duet-theme-turva .top span{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}slot:not([name=label]){--active-height:1px;--active-translate-y:translateY(1px);font-size:1rem;font-weight:600;color:rgb(8, 42, 77)}.duet-theme-turva slot:not([name=label]){color:rgb(23, 28, 58)}";
 const DuetSlideoutPanelStyle0 = duetSlideoutPanelCss;
@@ -160,23 +160,23 @@ const DuetSlideoutPanel = class {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (h(Host, { key: '0318776fab9cea36b44efcbd8a066fc7a71aa59e' }, h("div", { key: '1d95822243d5c86ec5b5173e4e681b4146e4476f', class: {
+        return (h(Host, { key: '3cc575a27526f9eb936cc77fbd5d73fae704a02e' }, h("div", { key: '54f6df02833967cc73e36fea9e3bc054e9b6aa73', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: 'a45e36b09686a148c2ba62e9984627920710ecb7', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, h("button", { key: '2757a9e467ee80835f260ea3631fbe561f2aabf5', ref: element => (this.openButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 link: true,
                 active: this.active,
-            }, onClick: this.onClick, inert: this.open }, this.icon && (h("div", { key: '6f2dee22c324bf4ead87048ebff2a20c47ca896a', class: "duet-slideout-icon" }, h("duet-icon", { key: '44e1cac15f61dab325132fcc3514c8e0354cc43a', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && h("div", { key: '024312ec408282554844e751ab4b49d05b96b548', class: "duet-slideout-badge" }))), h("span", { key: '283051aa5c3b14ee17ca9da70c094a57235e749e', class: "label" }, h("span", { key: '81b5642422add92e13dbf34d95a26c0588858de7', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: 'd44a3600f9a66a1768a530317ee8e97d61d7d5a4', name: "label" })), h("duet-icon", { key: '4e27c46508e15f8a57b08025121d7a30386fd7e1', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: '0e7fce1743db4fe772c3165ea76ddd2b5215e3c3', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && (h("div", { key: '227406b6650708fc7fd1904d7c7d528692edaf64', class: "duet-slideout-icon" }, h("duet-icon", { key: '36401c7328497294e9c894e9dd6d27937a51c494', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && h("div", { key: '7e06124b0bd84ab528b325885bc3c0babbd08742', class: "duet-slideout-badge" }))), h("span", { key: '9a846cb510d44c0af591554b22f23efab9560448', class: "label" }, h("span", { key: '6307191c9aa066915943fc6111c8c9de795c13cb', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: 'c52bc96f6bd93f8183fd8f05d551218a0f67e637', name: "label" })), h("duet-icon", { key: '74c42ebef00e4feeb6205718db4b7ef1315d3855', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: 'bc171acb5cbbe6c929fdb639dc3aa6bfb11740b1', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, h(FocusGuard, { key: '40a3ed99c1bf1bceb7378326804d3f5e76a2caf0', moveFocusTo: this.closeButton }), h("div", { key: '513ce8191e12b73aa0ec22360499905c9a120aca', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'f6d518848785f147415050e356dcfe42e00e64af', class: "top" }, h("button", { key: '6c6d3320016eeabed6b06b5d997bf0fe871b7d5b', ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-label": `${backTranslation}`, type: "button", class: {
+            }, style: styles }, h(FocusGuard, { key: '4db620b5032b9f8b5f37a4ba07ad387fc38b680f', moveFocusTo: this.closeButton }), h("div", { key: '8a4b956558e630cf3ab6b148a94bfbde4300b7ea', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'ddd353e3cf2e9d4d938cd9402e440459a64809af', class: "top" }, h("button", { key: '7fcb43d03e0a15af4a12f67e7b2810efb595d02b', ref: element => (this.closeButton = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-label": `${backTranslation}`, type: "button", class: {
                 back: true,
-            }, onClick: this.onClick }, h("duet-icon", { key: 'e68686b85946c9e54babfb2aa7012e37048b6a23', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: 'b2082182002d6fc1687fdbe1a75c30a62061a083' }, this.label.innerHTML), h("button", { key: 'b6cfea3156d9398f6ff290c6abbdbdff55a16edd', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: '4f973e329f5254a4d6fbb230bb2e1c815d07fab5', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'b2f3ca3d5bd5e4881cfbe6acd61b8ff209408f35', class: "sticky-header" }, h("slot", { key: '9a1594cd89ffce28613a575b53219736fcf02bae', name: "sticky-header" }))), h("div", { key: '74a5a1eefa940a78f4904f118fbb22da52177d83', tabindex: "-1", role: "menu",
+            }, onClick: this.onClick }, h("duet-icon", { key: '98891c6a2349246b457f003ed501770a2289afe7', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: '1b052537ae01f496e1d175c6f99134048278c3fd' }, this.label.innerHTML), h("button", { key: '8b4098001333b24d00d1dde0a39f9b6ee9b065cc', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: 'd0e70007d5554ddb18292fa3d90a136198c89c3a', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'a3abfbd5e6b8616670c4ba95ba76ba89b5d84f70', class: "sticky-header" }, h("slot", { key: '0276df7b3885dfe4b806db392e6f1a2000df5894', name: "sticky-header" }))), h("div", { key: '20894d6bbfece88c8094cef54fede14b97469ead', tabindex: "-1", role: "menu",
             //TODO: slideout menu fades out, needs to be instant
             id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, h("slot", { key: '59168289af3be6afbf35af828da4800c1209809c' })), h(FocusGuard, { key: '688c55a2b0881c10204aa353123bc524c88a23b9', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: 'e6fa25439fd7062824cc0fae6b4c7cb2e258f089' })), h(FocusGuard, { key: '9cb7008c88d6f03f06a0e027c8fd174277b99fd6', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {

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

@@ -9,9 +9,9 @@ import { f as isEscapeKey } from './keyboard-utils-439bcc8b.js';
 import { a as getLanguage, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver, g as getLocaleString } from './language-utils-14969cef.js';
 import { h as hasSlot } from './slot-utils-4e5ed4eb.js';
 import { T as Teleport } from './teleport-546f382d.js';
-import { g as getColorByName } from './token-utils-a32eb753.js';
+import { g as getColorByName } from './token-utils-b9ba8c5e.js';
 import './string-utils-192eb3c8.js';
-import './tokens.module-a746651a.js';
+import './tokens.module-2d02f5ff.js';
 
 const duetSlideoutCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:absolute;height:100%}::slotted(*){position:relative;width:100%;visibility:hidden;opacity:0}:host([open]:not([open=false])) ::slotted(*){visibility:visible;opacity:1}:host(:not([open])) ::slotted(duet-slideout-panel){display:none}.duet-slideout{display:flex;align-items:center;height:100%;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(8, 42, 77)}.duet-slideout.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}@media (min-width: 62em){.duet-slideout.duet-theme-turva .desktop-bg{background:rgb(23, 28, 58)}}.duet-slideout .dialog{position:fixed;top:0;bottom:0;left:0;z-index:600;width:100%;height:100%;padding-bottom:75px;overflow-y:auto;box-shadow:0 3px 6px 0 rgba(0, 41, 77, 0.1) inset}.duet-slideout .dialog:not(.modal){box-shadow:0 2px 20px 0 rgba(0, 0, 0, 0.2)}@media (min-width: 62em){.duet-slideout .dialog{right:0;left:auto;width:500px;padding-bottom:0;transition:right 300ms ease;transition-delay:0s}}.duet-slideout .dialog .top-container.has-sticky-header-slot{position:sticky;top:0;z-index:200}.duet-slideout .dialog .top-container.has-sticky-header-slot .top{background:rgb(240, 247, 250)}.duet-slideout .dialog .top-container.has-sticky-header-slot .sticky-header{display:block}.duet-slideout .dialog .top{position:relative;z-index:1;display:flex;align-items:center;justify-content:flex-end;padding:4px}.duet-slideout .dialog .top button{cursor:pointer}.duet-slideout .dialog .top button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-slideout .dialog .top duet-icon{padding:16px}.duet-slideout .dialog .sticky-header{display:none;width:100%;padding:0 1.5rem;margin-bottom:20px;background:rgb(240, 247, 250);border-bottom:1px solid rgb(212, 223, 229)}.duet-slideout .dialog .items{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:100%;padding:0 1.5rem}.duet-slideout .dialog.hidden{pointer-events:none;visibility:hidden}@media (min-width: 62em){.duet-slideout .dialog.hidden{right:-500px;transition:300ms ease}}.duet-slideout.duet-theme-turva .dialog{box-shadow:0 3px 6px 0 rgba(23, 28, 58, 0.1) inset}.duet-slideout.duet-theme-turva .dialog:not(.modal){box-shadow:0 2px 20px 0 rgba(0, 0, 0, 0.2)}.duet-slideout.duet-theme-turva button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-slideout.duet-theme-turva button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-slideout.duet-theme-turva button.active{color:rgb(198, 12, 48)}.duet-slideout.duet-theme-turva button.active::after{background:rgb(198, 12, 48)}.duet-slideout.duet-theme-turva .has-sticky-header-slot .top{background:rgb(245, 247, 250)}.duet-slideout.duet-theme-turva .has-sticky-header-slot .sticky-header{background:rgb(245, 247, 250);border-bottom:1px solid rgb(222, 224, 228)}.duet-slideout.duet-theme-turva .dialog .top button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}slot{color:rgb(8, 42, 77)}.duet-theme-turva slot{color:rgb(23, 28, 58)}";
 const DuetSlideoutStyle0 = duetSlideoutCss;
@@ -245,16 +245,16 @@ const DuetSlideout = class {
         };
         const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
         const exitTranslation = getLocaleString(this.exitLangObject);
-        return (h(Host, { key: '7e5384e7a8da21a6bfcd4e6f84f8c0cb60d3250a' }, h("div", { key: 'a0ddecf72e05002132592afbea9ab503e8929698', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && h("duet-overlay", { key: 'bd9eb4bb301549c79486fbec4ec9cc3306001152', visible: this.open, "display-device": "large", zIndex: "600" }), h("div", { key: '8bcb933d1862b16a784105144cbb830b085b7a37', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
+        return (h(Host, { key: '4642a8ace569ca295407eda479135ae7fd5617bf' }, h("div", { key: '7df49b85ec162cd738dca6cfcdac057a87bbdc13', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && h("duet-overlay", { key: '71364dcd7bdac4d224eae40ef7b43ee2571a1adf', visible: this.open, "display-device": "large", zIndex: "600" }), h("div", { key: '62eade96c8ad9c494d3843adc75b19b7ad18cada', ref: element => (this.dialog = element), tabindex: "-1", role: "dialog", id: "dialog", "aria-labelledby": "button", "aria-modal": this.isSafariBrowser ? false : true, "aria-flowto": "slot-container", class: {
                 dialog: true,
                 hidden: !this.open,
                 modal: this.modal,
-            }, style: styles }, h(FocusGuard, { key: '4f32ae824a9963b9324a6a75aec30a1ec3b9da34', moveFocusTo: this.closeButton }), h("div", { key: 'b3a2d23360f0080c3345925ab2dd3ba71726102e', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '346320e78d1b3b31cd27505873e27d9de14e7105', class: "top" }, h("button", { key: '70bd3ca676c250d31bf67ffc0cd4900c73d2e093', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
+            }, style: styles }, h(FocusGuard, { key: '2a3b77e3e65a92028c5dc3b787f85165e15eeb79', moveFocusTo: this.closeButton }), h("div", { key: '4b0dc292f4e488e4d0d0499c5c2c5e5cced54d35', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '6eabc63710bcbb2f2673eb2fe25bb5b88b6697bb', class: "top" }, h("button", { key: 'e697b74648bb04e0083b88d3bb8e808de86d7112', ref: element => (this.closeButton = element), "aria-haspopup": "dialog", "aria-controls": "dialog", "aria-expanded": this.open ? "true" : "false", "aria-label": `${exitTranslation}`, type: "button", class: {
                 "slideout-close": true,
                 active: this.open,
-            }, onClick: this.onClick, inert: this.openPanel }, h("duet-icon", { key: '1aa814b1f9015483a3b4bc7f473b5aede84f3cd0', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'f11c81c8efcdca2ddb6cdc987e2e1f220d467398', class: "sticky-header" }, h("slot", { key: 'e0bf8ba236ee29c1f1b497df27b337ab1f96628a', name: "sticky-header" }))), h("div", { key: 'dbf227d18aed0d6d3db65db6522ffda1b69d8dba', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
+            }, onClick: this.onClick, inert: this.openPanel }, h("duet-icon", { key: '9d03c80e89da1ef8a573fc482b7cc248e9c777a5', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '807b9077f797cde0ae3d59701d5d9cb5adecf989', class: "sticky-header" }, h("slot", { key: '2f1e747dad6226d8894931fcbfcc1716014e9a7e', name: "sticky-header" }))), h("div", { key: 'b14462c558ad7ec4030c461de80e604a9bd1204a', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
                 items: true,
-            } }, h("slot", { key: 'facef4d207e8df7c34a8aeca8595d832fd6de5e6' })), h(FocusGuard, { key: '5733820870caa0acd80b157d88b03ae1797360b8', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: 'ee510eec06bfef03ad124b9cd0ea5a26aeaad9cf' })), h(FocusGuard, { key: '64f7a35f2435307ca7572160445c4fad38812c87', moveFocusTo: this.closeButton })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {

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

@@ -87,13 +87,13 @@ const DuetStep = class {
      * Always the last one in the class.
      */
     render() {
-        return (h("div", { key: '4824107e0acf23c2c8705c98bf936075b57f0832', class: {
+        return (h("div", { key: 'cf7f017c189308e969ac8fc319fff799b44b675b', class: {
                 "duet-step": true,
                 [`is-${this.state}`]: true,
                 "rounded-top": this.roundedTop,
                 "rounded-bottom": this.roundedBottom,
                 "duet-theme-turva": this.theme === "turva",
-            } }, h("div", { key: '090c1ada985e57f936ac65154af4e1cde73cf820', class: "duet-step-heading", id: this.buttonId, role: this.state !== "current" ? "button" : "region", "aria-current": this.state === "current" ? "step" : undefined, tabindex: this.state !== "current" ? "0" : undefined, "aria-disabled": this.isClickDisabled().toString(), "aria-expanded": (this.state === "current").toString(), "aria-controls": this.contentId, "aria-selected": (this.state === "current").toString(), onClick: this.handleClick, onKeyDown: this.handleKeyDown, ref: element => (this.buttonElement = element) }, h("div", { key: '2fe4d50db56975760a58c1aa4a326758fbceeac8', "aria-hidden": "true" }, h("div", { key: '9c2265041152125c05b017c65f432b9ec0c758d6', class: "duet-step-counter" }, this.renderStepCounter())), h("duet-spacer", { key: '3820e59fd9b9cb0b9618eed034474a90293f3985', direction: "horizontal", size: "large", breakpoint: "small" }), h("duet-spacer", { key: '9c3a323b02d4543d4791ba77a2bf90d2e0ed77bd', direction: "horizontal", size: "medium", breakpoint: "x-small" }), h("div", { key: 'a50916963ca0efc77a309f009255f283b5584258' }, h("duet-heading", { key: '637ef135f7d47160eba76bf7d736e0f0a8086282', theme: this.theme, level: this.headingLevel, visualLevel: "h4", color: this.headingColor(), margin: "none" }, this.heading)), h("duet-spacer", { key: 'efe8ebfe55fbc93f526803ac66c469492967f21d', direction: "horizontal", size: "large" }), h("div", { key: '0974cb5ac0bb24d1cf9bd7a1bfa2eaac4a67f18f', class: "duet-step-heading-slot" }, h("slot", { key: 'f7ee80ecb5f96068f5dfc59f1a42cd17fca1f2c3', name: "heading-content" }))), h("div", { key: '31fab92932786d05ac222d35e3097b4f4d9a014d', class: "duet-step-content-wrapper" }, h("div", { key: '00679961075564d18dbd7faffa05618cf3dac572', class: "duet-step-content", role: "region", "aria-labelledby": this.buttonId, id: this.contentId }, h("slot", { key: '898ad6c5810daff1adeb5d85ff6db990ae3d7c43' })))));
+            } }, h("div", { key: '2742f57e0e278b597d2fb9715b6b85207446064f', class: "duet-step-heading", id: this.buttonId, role: this.state !== "current" ? "button" : "region", "aria-current": this.state === "current" ? "step" : undefined, tabindex: this.state !== "current" ? "0" : undefined, "aria-disabled": this.isClickDisabled().toString(), "aria-expanded": (this.state === "current").toString(), "aria-controls": this.contentId, "aria-selected": (this.state === "current").toString(), onClick: this.handleClick, onKeyDown: this.handleKeyDown, ref: element => (this.buttonElement = element) }, h("div", { key: 'c32bbaed270ec8ea14228ca59f7077128c952b78', "aria-hidden": "true" }, h("div", { key: 'fee937f7b9f3ef92d303fa0502f29632558c3967', class: "duet-step-counter" }, this.renderStepCounter())), h("duet-spacer", { key: '8fa4deb09aaa709141dcfd6d4b8b2969840fb48d', direction: "horizontal", size: "large", breakpoint: "small" }), h("duet-spacer", { key: 'dadc92ff570d92e7e600918019ab84ea6f22ca36', direction: "horizontal", size: "medium", breakpoint: "x-small" }), h("div", { key: '412ba9538aea65069601a21a229a13e38a959cf1' }, h("duet-heading", { key: 'b85991761212bba3610b566a9cf48b28562859d6', theme: this.theme, level: this.headingLevel, visualLevel: "h4", color: this.headingColor(), margin: "none" }, this.heading)), h("duet-spacer", { key: '7b28ba235ac2d4ef273bb4825a1bb53e4069150e', direction: "horizontal", size: "large" }), h("div", { key: '74230c5744cf324e8f406a8d0dfadce54f8cf82d', class: "duet-step-heading-slot" }, h("slot", { key: '74ef4c487e447ba8fc2dfa181a27d5bead1f7cd1', name: "heading-content" }))), h("div", { key: 'a4df2c7c64cbb35185b4d7665235a85d1c503ea0', class: "duet-step-content-wrapper" }, h("div", { key: '0a2fbd936f386294c6fe75bbacb3bd2b324a6311', class: "duet-step-content", role: "region", "aria-labelledby": this.buttonId, id: this.contentId }, h("slot", { key: 'a748fceef07a8ec5cc280d1e7d655b3e9ae14860' })))));
     }
     get element() { return getElement(this); }
 };
@@ -200,7 +200,7 @@ const DuetStepper = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'a9fd058aba3edef3374cccd0a93f842c0f9aaeb2', class: { "duet-m-0": this.margin === "none" } }, h("div", { key: '0669c1d5037caa0fd14184e653d7bcd8bff5c84e', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, h("duet-visually-hidden", { key: 'c129a1a808027193572c28b4708b9bc036b117c2', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), h("slot", { key: 'c6d77528bc6dcd5f9e3fd0d2a3ae62253fca0114' }))));
+        return (h(Host, { key: '082c93b48c5dfaadde04f9352ef6181ccdb38334', class: { "duet-m-0": this.margin === "none" } }, h("div", { key: '703904a5ecf2f0eb09c89c65639ec8ade1f674e6', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, h("duet-visually-hidden", { key: 'aa4c9cec5585ee50da88bf4143ee998bbe98f9db', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), h("slot", { key: '708b76a314c85e496f66a12f9f578c2f97e8a96b' }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {

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

@@ -36,12 +36,12 @@ const DuetSubmenuBarDropdownLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'a746efa1453d4cec928e66f4122f1a1b593e8442' }, h("a", { key: '6c959b9aad16526f25fa0f8c94d544e47850a69b', class: {
+        return (h(Host, { key: 'd9bf8b959631193d6f3f43b692c9676345ccee13' }, h("a", { key: '7d5b7455b0f524636ab19ce917e4455dc177ce70', class: {
                 "duet-submenu-bar-dropdown-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 highlight: this.highlight,
                 active: this.active,
-            }, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && h("duet-icon", { key: 'c0fc8773a756787903d3e312ebabdae1f5854445', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("span", { key: 'e3970bb855fdb008fe5c71d5b70ffaa0c95c6ca1', class: "label-container" }, h("span", { key: '615e56e9b3b4c900b96ae2e77435dcfd29a9a321', class: "label" }, h("slot", { key: '66142de58ca0b982f962787e57583acf2645acd2' })), this.caret && h("duet-icon", { key: '690f5210ff9271e47c36a9ec86fbe0c427a7e823', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (h("duet-icon", { key: '019e32fdb4672495348327df056ff55e5654c91d', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
+            }, "aria-current": this.active ? "true" : "false", href: this.href, onKeyUp: e => this.handleEscape(e) }, this.icon && h("duet-icon", { key: 'd7c3fd1e9b8a41b7ce6e3cd25080a91b0c7d6016', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("span", { key: '20d44dabb05864b92b0b22738eac84a5abf3704c', class: "label-container" }, h("span", { key: '9315948652add6e10e7da692b3e1a7c5d1951de8', class: "label" }, h("slot", { key: '6a3d5cab2ef53af7702050b635aa8499755ae529' })), this.caret && h("duet-icon", { key: '696c65250b22665f8f3dbf53e48b1fa143017995', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (h("duet-icon", { key: 'ebbaa8d86e0b2b2316fe79d62a7792db28e1196f', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
 };

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

@@ -101,18 +101,18 @@ const DuetSubmenuBarDropdown = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '950ec986065630156024e30fc4ff3808bd83331e', role: "listitem" }, h("div", { key: '8aa74d12b0b0e63f82062c705b61f3881a130ece', class: {
+        return (h(Host, { key: 'dbe67ca5e8969c25e00b21789ace2b3333fa9f83', role: "listitem" }, h("div", { key: 'af7f49d3f8004673eb2fbc5caacf125644257b1f', class: {
                 "duet-submenu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 open: this.open,
                 active: this.active,
-            } }, h("button", { key: '06132dc834775c0f78a00690e71381f2f8bc48dd', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
+            } }, h("button", { key: '6bdb9006795459b7fc8250e7e0b50c4dc3836f8b', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", id: "button", type: "button", class: {
                 open: this.open,
                 active: this.active,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: '5808b4d746aacc6834d5c7cfc886cb2318ca11bf', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: '4d1a960326bb00837cdffa7d7968d1a09c246656', class: "label" }, h("span", { key: '0b0fab9353193d5f65ba7a40474548653b0bd233', class: "label-text" }, h("slot", { key: '6270448ade06bfe7555500c63eba0c0dd4bc589a', name: "label" })), h("duet-icon", { key: '445ce13635b1ac94a6059dfa0cc74925bdb42829', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: '72428c05d80b77b7443611c15548731847faf492', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: '7351a62029da296d445ae8cca2930853c4dd71ed', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: '3e90e7c718f28a7aea7c0593a8316348ae45df42', class: "label" }, h("span", { key: '25d4bd4818e5946b36e5821b6f41beb2bc6b9e90', class: "label-text" }, h("slot", { key: '35c9b86fe5328041cbd228b5b54937dd5ead9682', name: "label" })), h("duet-icon", { key: 'b542830855f09f4386a00623e81188c3847314e8', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: '884cca9d45a91703c9d39cdc27e9d7f576fd667f', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: 'da23085cb0178dc3a796bfef1127aff57a055703' })))));
+            } }, h("slot", { key: 'c670ddeff29a0e408436e7be0f65f37047b6d5b5' })))));
     }
     get element() { return getElement(this); }
 };

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

@@ -64,7 +64,7 @@ const DuetSubmenuBarItem = class {
     render() {
         const TagName = this.url ? "a" : "button";
         const role = this.url ? "link" : "button";
-        return (h(Host, { key: 'bbd6de093fd02cb675b6a27822e8fd64ae2e6e36', role: "listitem" }, h(TagName, { key: '857df988d8c2d9ee3c830455d97496903f43af24', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "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, role: role, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (h("duet-icon", { key: '77a2683b345776fdd073d562025d01ad7b42b8cf', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'e5e54d900b8e9861fd7f687c302a83e9a5d26087', class: "label" }, h("span", { key: '7b8893ae6bd4a6209763cd1e88606495db78f84e', class: "label-text" }, h("slot", { key: 'bd0380cd2eee95bed2c16884fdc77827a7748da2' })), (this.trailingIcon || this.external) && (h("duet-icon", { key: '94315f7a4d4ab2444536fec20724bbbeaee83a65', class: {
+        return (h(Host, { key: '9b58300e549e07f8d602bacb3f16cd612e84ffbb', role: "listitem" }, h(TagName, { key: '51335abf288a934ee2518e2ca05727cea7833bc7', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: { "duet-submenu-bar-item": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.url, onKeyUp: e => this.handleEscape(e), "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, role: role, rel: this.external ? "noopener" : undefined }, this.leadingIcon && (h("duet-icon", { key: '35adf7829385efe26c9412bb25d6d28175a21922', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: '0194c9310d97abac5f4a29ead95c975ab00c1faa', class: "label" }, h("span", { key: '8ec232e32e64fba21b3716e8f165cd36199c1673', class: "label-text" }, h("slot", { key: '8945c541d7ede0ff362d9b48f6066f4665aafc9f' })), (this.trailingIcon || this.external) && (h("duet-icon", { key: '7f21d4325c823b403a5a4e04b73bb82241362ddb', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!this.external,

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

@@ -34,7 +34,7 @@ const DuetSubmenuBarLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'd500cddc2f019854bae1756301dc68ae23835b10', role: "listitem" }, h("a", { key: '3688cdd47046d93cae4ad667a348881d35449cb8', class: { "duet-submenu-bar-link": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.href, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false" }, this.icon && (h("duet-icon", { key: 'c620d6cac216344f07879ad271f2488f9e4a3036', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("span", { key: '82438bf5ee24adf621d9e342de9886829f193176', class: "label" }, h("slot", { key: '5ee0ae247c68b887845ce939e812e7923b994be8' })))));
+        return (h(Host, { key: '2d44998a36518c013b11ebacab17b616834ab27c', role: "listitem" }, h("a", { key: '848befb6c1d67cfe2ea4cd7c1431c15e3ebbe484', class: { "duet-submenu-bar-link": true, "duet-theme-turva": this.theme === "turva", active: this.active }, href: this.href, onKeyUp: e => this.handleEscape(e), "aria-current": this.active ? "true" : "false" }, this.icon && (h("duet-icon", { key: '9344282a522be5d1ee0396e8fd93becd53d423a5', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("span", { key: 'a4a42910fa379e78ebe4711a47ea8338dc5d53b8', class: "label" }, h("slot", { key: 'c2fcb5acc1c26e0fca2a087238f281f1e931dc09' })))));
     }
     get element() { return getElement(this); }
 };

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

@@ -127,19 +127,19 @@ const DuetSubmenuBar = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'a63e21429e735858870de3a6c6b4f1d641ea0536' }, h("nav", { key: 'ec81c1ea9da9a6a1f976e4f809a44f5a0cc9129f', class: {
+        return (h(Host, { key: 'ea56c035a544993c18dce5a3164ee203e287352f' }, h("nav", { key: '9410059fc6de0b9ead6a7c387d0412f5a26b70f3', class: {
                 "duet-submenu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 hidden: this.hidden,
-            }, "aria-label": this.accessibleLabel }, this.hasItems && (h("button", { key: '9c7afa7571d91d251c0a9ed320dcfaefe4ff10ec', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
+            }, "aria-label": this.accessibleLabel }, this.hasItems && (h("button", { key: '27e0fddeffe5a7c093a5270e350236812c7a9c86', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", id: "button", type: "button", class: {
                 active: this.open,
-            }, onClick: this.onClick }, h("span", { key: '670e006fcab56b5057addd32c86e78c488a6a954', class: "label" }, h("slot", { key: '6aeb5157b136b0d51ea614df7170db9901d7159a', name: "label" }), h("duet-icon", { key: 'd7801a42f75a4b6dfde7c1bd197b5c4aafb7eb03', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), h("div", { key: 'b527227c328438130d7ec32a80c7d9ac8ee472b2', class: {
+            }, onClick: this.onClick }, h("span", { key: 'da29ea7a5ceb616f6e727539e47c3a46b38a83c1', class: "label" }, h("slot", { key: '83fabbf6803d799627cdc4b7b427d07613fc855b', name: "label" }), h("duet-icon", { key: '16eba6cc2f9871260789c21fe184d6846ad7b199', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), h("div", { key: '1f722a24bf9a82cc6110a258db43df328947c3a6', class: {
                 "menu-container": true,
                 hidden: !this.open,
-            }, role: "presentation" }, h("div", { key: '60bcdce4e176cf742905e6eb6e50d4dc8046b1be', role: this.mobile ? "menu" : null, id: "menu", "aria-labelledby": this.mobile ? "button" : null, "aria-expanded": this.mobile ? (this.open ? "true" : "false") : null, class: {
+            }, role: "presentation" }, h("div", { key: 'fc121e02816e700bf9bbb83a21ca202c4356a339', role: this.mobile ? "menu" : null, id: "menu", "aria-labelledby": this.mobile ? "button" : null, "aria-expanded": this.mobile ? (this.open ? "true" : "false") : null, class: {
                 items: true,
                 hidden: !this.open,
-            }, ref: element => (this.itemsContainer = element) }, h("div", { key: '69d9ea394265451a554e19db4e5105e21027a61e', class: "list", role: this.mobile ? "presentation" : "list" }, h("slot", { key: '95f8cedf2b0590010f0a6560531e9306350b2c37' }), h("div", { key: '780946443cd19822597df52bd006d3d3a30c2e5f', class: "list-padding" }))), h("duet-overlay", { key: '19734aa5ac1dd7c03192d3310518173fa8a43c07', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
+            }, ref: element => (this.itemsContainer = element) }, h("div", { key: '6e43327f6bac2c8614ab0e18160248abc9038523', class: "list", role: this.mobile ? "presentation" : "list" }, h("slot", { key: '56d8860ecde5b13838f8951f7c3bc71d6f67ea84' }), h("div", { key: '1c57c208d07a9082d2c1f639c7a679a8c8cfa44e', class: "list-padding" }))), h("duet-overlay", { key: 'd6605341c64e6086535892c24201655ba260984e', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {

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

@@ -175,17 +175,17 @@ const DuetTextarea = class {
      */
     render() {
         const identifier = this.identifier || this.textareaId;
-        return (h(Host, { key: '3464ae302a0a5d5c887a331e3550c8fa3dcd7162', class: {
+        return (h(Host, { key: '49e8e10db6bb3a82dba74429a4ef16fd0f1adca5', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-has-counter": this.counter && !this.error,
                 "duet-expand": this.expand,
-            } }, h("div", { key: '978e5736c81e0166f9268c875e6688d528b5962a', class: {
+            } }, h("div", { key: '3ebe6d991a459d25fcb624c6be6d7287cd6f2856', class: {
                 "duet-textarea-container": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-label-hidden": this.labelHidden,
                 "duet-input-top-caption-shown": this.isCaptionVisible,
                 "has-error": !!this.error,
-            } }, h(DuetInternalLabel, { key: 'acdfc1c7ff2213b9bc2ae22d0df671dc662530c5', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (h("duet-tooltip", { key: '744fc7ed55f9e6e309d085d2b4d7b6570ab082c1', direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), h("slot", { key: 'e30e5ff63c68f40f67659852379b94900d7766e7', name: "tooltip" }), this.caption && (h("duet-caption", { key: '1c45d6d2fcf37e765fa52e71fddb5bf4501ad684', id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), h("div", { key: '3ecae1e53fde36ad09855189ded9f4db6ae66186', class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (h("duet-caption", { key: '130a8a8ab7da05cb546a7062868dce091ddc37b8', id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), h("textarea", { key: 'e0bb89af0dc04035955549f847426a3a556ceaa9', onInput: this.handleInput, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus, ref: input => (this.nativeInput = input), class: { "duet-textarea": true, disabled: this.disabled }, value: this.value, disabled: this.disabled, "aria-labelledby": this.accessibleLabelledBy ? `${this.labelId} ${this.accessibleLabelledBy}` : this.labelId, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getDescribedBy(), "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, placeholder: this.placeholder, spellcheck: "false", required: this.required, minlength: this.minlength, maxlength: this.maxlength, role: this.role, name: this.name, id: identifier })), h("duet-grid", { key: 'c0c8298e15d3c59ed98fb4360ee8f51e720be244', alignment: "stretch" }, h("duet-grid-item", { key: '897903be716ae4f138a75f6fbce0a8cb43abbc73', margin: "none", fill: true }, h("div", { key: '668f83d7eeb1d96e8450568a37a6134dc80ca7c0', class: "duet-textarea-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", { key: 'c3d07dc5c524d1fb9c3dba1878bf3dbc2c7baeeb' }, this.error))), h("duet-grid-item", { key: '32452898c098f736f18daed1a7adcc33bc64869c', margin: "none", class: "duet-character-count-caption" }, this.counter && (h(CharacterCount, { key: '794d07d1f318b92f803c092c13187abb6b3102b7', theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (h("duet-visually-hidden", { key: '25fd4397e3d9139040bd3eb54449ba1183fa4131', class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
+            } }, h(DuetInternalLabel, { key: '431f2df70846aae2a6d04f75e66c0ae702f77bb2', theme: this.theme === "turva" ? "turva" : "default", class: { "duet-has-tooltip": !!this.tooltip }, margin: this.isCaptionVisible ? "small" : "auto", color: this.labelColor, weight: this.labelWeight, id: this.labelId, for: identifier }, this.label), this.tooltip && (h("duet-tooltip", { key: '3c8ee3d71cbefc2d3859d5c78a09357599fa3d93', direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), h("slot", { key: 'ecbbd7b2de0465087b6559c8941e2273e5d6e25a', name: "tooltip" }), this.caption && (h("duet-caption", { key: 'bbfa15caf320dfda6ae6d48b0c9c6fe0fe25e284', id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), h("div", { key: 'c91f39fb9542a81ed961971d304517124a7046ae', class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (h("duet-caption", { key: '5f550265ff6c886f752c33ca662d56890d9f21a8', id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), h("textarea", { key: '0b24c58e21a7b62f658e573f13e44d68d5639df0', onInput: this.handleInput, onChange: this.handleChange, onBlur: this.handleBlur, onFocus: this.handleFocus, ref: input => (this.nativeInput = input), class: { "duet-textarea": true, disabled: this.disabled }, value: this.value, disabled: this.disabled, "aria-labelledby": this.accessibleLabelledBy ? `${this.labelId} ${this.accessibleLabelledBy}` : this.labelId, "aria-controls": this.accessibleControls, "aria-autocomplete": this.accessibleAutocomplete, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.getDescribedBy(), "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, placeholder: this.placeholder, spellcheck: "false", required: this.required, minlength: this.minlength, maxlength: this.maxlength, role: this.role, name: this.name, id: identifier })), h("duet-grid", { key: '8b7934cf5d66a8dd93054007879d3755f24edce4', alignment: "stretch" }, h("duet-grid-item", { key: '04e9818c668a06504b70dd73a925fdfd2734eee7', margin: "none", fill: true }, h("div", { key: '6fe4e85fb3d4935cc1374c4027a73e76bb499604', class: "duet-textarea-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && h("span", { key: 'ee5eb2a2149271a7644588aa8e36c4046c7fa59e' }, this.error))), h("duet-grid-item", { key: '47937bb1385e1385d5445e978714896dadd5b320', margin: "none", class: "duet-character-count-caption" }, this.counter && (h(CharacterCount, { key: 'd681d37404d792fc9b1e379b6c84cb21c6f23190', theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (h("duet-visually-hidden", { key: 'e044e35903993d4f9ac1c589bfb148eb02db83f1', class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
                 this.hiddenCounterLabel = el;
             } })))));
     }

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

@@ -87,12 +87,12 @@ const DuetToggle = class {
      */
     render() {
         const identifier = this.identifier || this.toggleId;
-        return (h(Host, { key: '72296626084b22e1e913073a7cab579306a9351f', onClick: this.disabled ? undefined : this.onClick, class: { "duet-m-0": this.margin === "none" } }, h("div", { key: '27f25315d1e9fe41194f3234bb8a9981e9a6a182', class: {
+        return (h(Host, { key: '694e8b1cb37f0b0b1842ff3d6c185029579e0b1f', onClick: this.disabled ? undefined : this.onClick, class: { "duet-m-0": this.margin === "none" } }, h("div", { key: '167e4372a5554dce04af310a69ed4c4e0c6ee3ed', class: {
                 "duet-toggle": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-side-label": this.labelPosition !== "top",
                 "duet-reverse-label": this.labelPosition === "right",
-            } }, h(DuetInternalLabel, { key: '717144b9f527406c0c865f2b361b307fd0405adc', theme: this.theme, color: this.labelColor, weight: this.labelWeight, for: identifier, margin: this.labelPosition === "top" ? "auto" : "none" }, this.label), h("label", { key: 'd142c9a5d7972009c5f3a287547f54206776550f', class: "duet-switch" }, h("input", { key: 'b41af320a24f9b2baabe3051a44c4b1d60400e37', type: "checkbox", value: this.value, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, id: identifier, role: this.role, name: this.name, checked: this.checked, required: this.required, disabled: this.disabled, ref: input => (this.nativeInput = input) }), h("div", { key: '51ba5bed4ddbcdea28fe16ff61b0b5889e3c0eb8', class: "duet-slider" })))));
+            } }, h(DuetInternalLabel, { key: '125d2ac85be7fc1097655a5d14257c480861b7d4', theme: this.theme, color: this.labelColor, weight: this.labelWeight, for: identifier, margin: this.labelPosition === "top" ? "auto" : "none" }, this.label), h("label", { key: '8f91d032e9063ff55aaf2c0058d2e5d401ad8724', class: "duet-switch" }, h("input", { key: 'c9bc713caaf82122725cb37f320f3318ce102fd8', type: "checkbox", value: this.value, "aria-controls": this.accessibleControls, "aria-activedescendant": this.accessibleActiveDescendant, "aria-owns": this.accessibleOwns, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, id: identifier, role: this.role, name: this.name, checked: this.checked, required: this.required, disabled: this.disabled, ref: input => (this.nativeInput = input) }), h("div", { key: '01ff73ea8682b434fa35435c3e6ceb1f0ddb650d', class: "duet-slider" })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {

package/lib/esm/duet-toolbar-dropdown-link.entry.js

@@ -36,11 +36,11 @@ const DuetToolbarDropdownLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '8cb69dd33c2d35233088309fd5cdad8c1d16ed01' }, h("a", { key: 'c805b960def6061680c14e5b401d1854c52f94a6', class: {
+        return (h(Host, { key: 'e6284cb0d289f8b64e26d5588c12aac7d490b170' }, h("a", { key: '56812f3a45834d09c37c304491daa0a7b8573c8e', class: {
                 "duet-toolbar-dropdown-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
-            }, href: this.href, lang: this.targetLanguage, hreflang: this.targetLanguage, role: "link menuitem", "aria-label": this.accessibleLabel, "aria-current": this.active ? "true" : "false", onKeyUp: e => this.handleEscape(e) }, this.icon && h("duet-icon", { key: 'aa73a86d1c127f99f803b772bd2ae89b207fab30', name: this.icon, size: "x-small", margin: "none" }), h("span", { key: '7435a9263b6389e3a4a2e980a6528741c3b7a46f', class: "label" }, h("slot", { key: '5bdd6f17bf41ee7a6f6dec80b9f3c9f741a1fc27' })), this.active && (h("duet-icon", { key: '6d9294ed304b2652d8cf535f549edad17fc6965d', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
+            }, href: this.href, lang: this.targetLanguage, hreflang: this.targetLanguage, role: "link menuitem", "aria-label": this.accessibleLabel, "aria-current": this.active ? "true" : "false", onKeyUp: e => this.handleEscape(e) }, this.icon && h("duet-icon", { key: '3a1f39a9f5c3fdfba1b4849b289b874ee6d0d3bf', name: this.icon, size: "x-small", margin: "none" }), h("span", { key: 'ad7c40813561cb6d3c215b0986a25f0aeadac435', class: "label" }, h("slot", { key: 'ee1ffcf539b6fc36dab482151cbea393d7582ef0' })), this.active && (h("duet-icon", { key: 'b95754e56d673cd0330bc41aefd6a6a48e25cff6', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-toolbar-dropdown.entry.js

@@ -55,18 +55,18 @@ const DuetToolbarDropdown = class {
             itemsAlign = this.element.parentElement.getAttribute("slot") === "left" ? "right" : "left";
         }
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (h(Host, { key: '3f216acdbee35637a06bba1ad6bd31c79060c485', role: "listitem" }, h("div", { key: 'f327067f1cca48416dbadf416c81beb395f68bf6', class: {
+        return (h(Host, { key: 'b9c82af8341d828827b7c5536dda939aca2f2cda', role: "listitem" }, h("div", { key: 'a8d047838de2e4b01362bf0cd8e7c1ba25490d23', class: {
                 "duet-toolbar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 [itemsAlign]: true,
                 [variation]: true,
-            } }, h("button", { key: '7dc771dbb2a86dea2b8765ce9913edf088f789f6', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, id: "button", type: "button", class: {
+            } }, h("button", { key: '02b9012547af6361406a20419a042e19317e5cb4', ref: element => (this.button = element), "aria-haspopup": "menu", "aria-controls": "menu", "aria-expanded": this.open ? "true" : "false", "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, id: "button", type: "button", class: {
                 active: this.active,
                 open: this.open,
-            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: 'dddf695359ec083dc8f227c5e1deae8a5506b73f', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), h("span", { key: 'd334e49d8815344ab29ac8db03eb694ddb496a54', class: "label" }, h("slot", { key: '348fcd3dd00b6a81b94d33771f6e4557284bd16d', name: "label" }), h("duet-icon", { key: '7dc2d3d54ff3117e2f48e687f3a762db43a837d4', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: '90d305c6cecfb3fd7ee23ce5169cdcad6c4dd66f', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: 'b6ebb6cb14ebcb9d6d9763c915dcb4b0299c842d', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), h("span", { key: 'c12058a53fa6dd527225b99c19afe407728915b5', class: "label" }, h("slot", { key: '32968bac767897e9da6913bd81eabcc7db113006', name: "label" }), h("duet-icon", { key: '6f02485c14f602b5f9147de5d85a10296341d5bf', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: '69af428a1a3159f77134ec15939af57d8b2a5ee0', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: 'eda0a71fd30d9a00a11d61a797243b2da1d4e19a' })))));
+            } }, h("slot", { key: '80bd5bf933f8fe6af768ee625f4fcaea1bd961b0' })))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-toolbar-item.entry.js

@@ -64,17 +64,17 @@ const DuetToolbarItem = class {
             : this.variation === "secondary"
                 ? "secondary"
                 : "default";
-        return (h(Host, { key: 'dd49a814af5543b3c5322f9ba0f14b94c1f2c0ff', role: "listitem" }, h(TagName, { key: '99e8b130d9de3a738aa494473908afa59fcb5c9d', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
+        return (h(Host, { key: '5c9c5d91e896d720dafdbdd0a087ecbf2fed62a1', role: "listitem" }, h(TagName, { key: '9cd2ac354b443cb850cdc9a3dab0798927db4b90', target: !this.url ? null : this.external ? "_blank" : "_self", ref: element => (this.itemElement = element), class: {
                 "duet-toolbar-item": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [variation]: true,
-            }, 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("div", { key: 'f2cb988f3e1224d79d1fe65d289e08364b43d75f', class: "duet-toolbar-icon" }, h("duet-icon", { key: '8608706b7b512cfe61e35f4eb63a41804ac0085d', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" }), this.badge && h("div", { key: 'c4a5b2eba922d2bcaf1e90c63d496d6e0e8a282f', class: "duet-toolbar-badge" }))), h("slot", { key: 'c4c8114069e098da845703905b77f15c4bb1c743' }), (this.trailingIcon || (this.url && this.external)) && (h("div", { key: '7f21cf0cd2a5aeca2685360049504e5daab02c3b', class: "duet-toolbar-icon" }, h("duet-icon", { key: '0c39d469df56947c3cec7f2e377906f0f48d0ef6', 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("div", { key: '6b275748935ac11b86a4abb677debff450804ecf', class: "duet-toolbar-icon" }, h("duet-icon", { key: '6076231664a2a10b0d78400436f506ba46beacfd', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" }), this.badge && h("div", { key: '56380ea981d2c92215213646d3e16ab0e1af9f3e', class: "duet-toolbar-badge" }))), h("slot", { key: '464fb2cde04cf2e57bd136bdc4ea15a84117b478' }), (this.trailingIcon || (this.url && this.external)) && (h("div", { key: '9e6f3430c39e7c426de9bc8ebe4e5229bc2c474d', class: "duet-toolbar-icon" }, h("duet-icon", { key: '3a5b1dfffd22b2a06c25f06a8665f1458e881d63', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!(this.url && this.external),
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
-            }, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? actionNewWindowSmall.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && h("div", { key: 'a59af5319ed0f896c0ba81b8c6234d7ebed0d3f2', class: "duet-toolbar-badge" }))))));
+            }, theme: this.theme, name: this.trailingIcon ? this.trailingIcon : this.url && this.external ? actionNewWindowSmall.title : "", margin: "none", size: "auto", color: "currentColor" }), this.badge && this.trailingIcon !== "action-arrow-down-small" && h("div", { key: 'adb45d78113ceec08f8577d445b43145506f9334', class: "duet-toolbar-badge" }))))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-toolbar-link.entry.js

@@ -29,12 +29,12 @@ const DuetToolbarLink = class {
      */
     render() {
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (h(Host, { key: '2656a1b596a4b66cf46c4f417335e35eb881dab2', role: "listitem" }, h("a", { key: 'ce034bce2589926b97d4bb34280799747927414f', class: {
+        return (h(Host, { key: 'fc85b821b21b1c14c76dc287a8cf4c2ec2eef5f4', role: "listitem" }, h("a", { key: '1d04a6e6b8f053d336f7b1e64bb43b1f3af5ca72', class: {
                 "duet-toolbar-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [variation]: true,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '0fc473d63161aaa4922c4557f902e170f68464ed', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), h("slot", { key: 'beba45fdc4e282f23e04735c6491c67f65ac7b7f' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (h("duet-icon", { key: '12a6f9ab1d2acfb541abc22579c85304d5e52c3b', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), h("slot", { key: 'bc2beb7e22a6152835e1d475d8a888b3fbe3b37b' }))));
     }
     get element() { return getElement(this); }
 };

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

@@ -32,11 +32,11 @@ const DuetToolbar = class {
             : this.variation === "secondary"
                 ? "secondary"
                 : "default";
-        return (h(Host, { key: '21d533cd790fd3160001662f405fd6d576238601' }, h("nav", { key: '7b6dd43ab8c737929acec750be80136d3f5bb007', class: {
+        return (h(Host, { key: '188a69397278acb8403cb0798a75fbc9d80a0d45' }, h("nav", { key: 'e215710483f2e92e44b12755d131bd1b7c3503fe', class: {
                 "duet-toolbar": true,
                 "duet-theme-turva": this.theme === "turva",
                 [variation]: true,
-            }, "aria-label": this.accessibleLabel }, h("div", { key: 'c6858334c5f7a5a760775d6cb1d5f3c8439f10a7', class: "container" }, h("div", { key: '28485640df44e2daf65bee426b757931d7fe01e8', class: "list", role: "list" }, h("slot", { key: '7fe71028d8cd2e938ec176fcf8a3bf9dd1d2e446', name: "left" })), h("div", { key: 'a5fa75c98324be554112c6bead973905e2144371', class: "list", role: "list" }, h("slot", { key: '277f1bafd019f0e03080d3c830be989eac1dd461', name: "right" }))))));
+            }, "aria-label": this.accessibleLabel }, h("div", { key: 'eacf66f064b8f43f140fb37852432c08d2bc4cde', class: "container" }, h("div", { key: 'fc3781dbe2dda46e2452d996dcabf0fc29f07695', class: "list", role: "list" }, h("slot", { key: '291e04fd4f9b9aa3bc0a63577593825bcc51a94d', name: "left" })), h("div", { key: '3f9cfd1df02a12b5186353c61bb14b587308f1d4', class: "list", role: "list" }, h("slot", { key: '7ab7c8a0f368b4d569370887ca4b5aefa2724893', name: "right" }))))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-tooltip-button_2.entry.js

@@ -42,12 +42,12 @@ const DuetTooltipButton = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '9072e8917cb41793dea41b85387c0d0ed01364ab' }, h("button", { key: '873fe45b6a53107875d7f6cbd52edcef6c35a4cd', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
+        return (h(Host, { key: 'ae2e6b2178ee576213dd23b3454d9301c7d76445' }, h("button", { key: '828b657596897f539bcb09e9c61f8351a105dbf3', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
                 "duet-tooltip-button": true,
                 "duet-tooltip-button-has-label": !!this.label,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-button-negative": this.negative,
-            } }, h("svg", { key: '323d7874dea1e157dfa25d203eb3dda93e4a4100', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'ef7df8fea96fc5f5adfec07ac1c7176c58f5939e', d: "m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z" }), h("circle", { key: 'd5e097119c80dbcee1e9a8b40e0a8e1416991c78', cx: "11.625", cy: "7.125", r: "1.125" }), h("path", { key: 'a85da0b6a9f044e2584d7a0cfbab5ff3045ee19a', d: "m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z" })), this.label ? (h("span", { class: "duet-tooltip-label" }, this.label)) : (h("duet-visually-hidden", null, this.accessibleLabel)))));
+            } }, h("svg", { key: 'f1910fbcf2abe0cd566aafc35bff9aafafba261c', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'cb30d10b660bb70e460cc38411be2085d25e40f5', d: "m13.5 17.25c-1.241 0-2.25-1.009-2.25-2.25v-3.75h-.75c-.414 0-.75-.336-.75-.75s.336-.75.75-.75h.75c.827 0 1.5.673 1.5 1.5v3.75c0 .414.336.75.75.75h.75c.414 0 .75.336.75.75s-.336.75-.75.75z" }), h("circle", { key: '0aa8e5f682f4d4bbfde4b77ef9a1db672cabb281', cx: "11.625", cy: "7.125", r: "1.125" }), h("path", { key: 'c35b7243eb4c68c3668ecfaa0c90fb2672b7d25e', d: "m12 24c-6.617 0-12-5.383-12-12s5.383-12 12-12 12 5.383 12 12-5.383 12-12 12zm0-22.5c-5.79 0-10.5 4.71-10.5 10.5s4.71 10.5 10.5 10.5 10.5-4.71 10.5-10.5-4.71-10.5-10.5-10.5z" })), this.label ? (h("span", { class: "duet-tooltip-label" }, this.label)) : (h("duet-visually-hidden", null, this.accessibleLabel)))));
     }
     get element() { return getElement(this); }
 };
@@ -98,11 +98,11 @@ const DuetTooltipPopup = class {
         this.contentEl.focus();
     }
     render() {
-        return (h(Host, { key: '8acc3821b4d946db588b369f4b6a49949049aef3' }, h("div", { key: '4e67df16578e9d684c13956359696ebb46aaa431', class: {
+        return (h(Host, { key: '964556bf2968cb31ee22add9a0e5f776b8bf6d97' }, h("div", { key: '82334ed0e1c500f24b71337475a2d54236f3e87a', class: {
                 "duet-tooltip": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-active": this.active === true,
-            } }, h(FocusGuard, { key: 'f80a8056489ea1d33f28e35e02956080855b8e0c', moveFocusTo: this.buttonEl }), h("div", { key: '776dd94339d875a1a66e6384792b6ceb1c6aa3d0', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, h("slot", { key: '5ca5cb490bbd841897e92550487d5ec2994c1454' })), h("div", { key: '0d94a795e9e48495dfaf0f89a2deb85168e28e93', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, h("div", { key: '55de0f4a7b2af1fdc80591cf22164528677038b3', class: { "arrow-container": true, [this.placement]: true } })), h("button", { key: '5c666a5fa3eeb84d1b9cae6a8e8c9ead45c44b69', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, h("duet-icon", { key: '50e2ef126f129c562fe92652d057f7295d1c67f2', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), h("duet-visually-hidden", { key: '1453b395ca04e521704846b572d7165cc150f0ff' }, this.accessibleCloseLabel)), h(FocusGuard, { key: '75fbf5e7a95c4f2a30064a47e2e1c3905c2ee289', moveFocusTo: this.contentEl }))));
+            } }, h(FocusGuard, { key: '42360ef43ddb6feb72e5fe4cc4133ab0338946a1', moveFocusTo: this.buttonEl }), h("div", { key: 'f72ad11e31a3e94c9e605cb08b65f93e7718ddfd', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, h("slot", { key: '3259ef9c053e2db1b0bad6cc6dc0f444081163d9' })), h("div", { key: 'e278204fb9d9cfd336fe51a7b3902a8193b27191', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, h("div", { key: '292a12a67948c7186631bc1bb17a4897ba17f2f0', class: { "arrow-container": true, [this.placement]: true } })), h("button", { key: 'e624c12dff7a645bbb09fc938ae55366afdea858', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, h("duet-icon", { key: '6913f2962c93f355f3336636b1b2b806cd09561a', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), h("duet-visually-hidden", { key: '1a4ffc8085ae871cfa321a0aef3b4c88354fe077' }, this.accessibleCloseLabel)), h(FocusGuard, { key: '9db665a257c4fdd8152612ddc981e14d3534debd', moveFocusTo: this.contentEl }))));
     }
     get element() { return getElement(this); }
 };

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

@@ -2,7 +2,7 @@
  * Built with Duet Design System
  */
 import { r as registerInstance, h, F as Fragment, g as getElement } from './index-1d0b7c66.js';
-import { s as sizeHeader } from './tokens.module-a746651a.js';
+import { s as sizeHeader } from './tokens.module-2d02f5ff.js';
 import { i as inheritGlobalTheme } from './themeable-component-860041c5.js';
 import { c as createID } from './create-id-149a1b6d.js';
 import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './keyboard-utils-439bcc8b.js';
@@ -89,14 +89,14 @@ const DuetTray = class {
      * Always the last one in the class.
      */
     render() {
-        return (h("div", { key: '978707965f7036c59164be861c06e3a95d0b010c', class: {
+        return (h("div", { key: 'e3792fad133de97e663da30b97f7f1b2178d37ef', class: {
                 "duet-tray": true,
                 "duet-tray-is-active": this.active,
                 "duet-tray-is-hidden": this.hiddenState,
                 "duet-tray-is-responsive": this.responsive,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tray-is-expandable": this.hasAdditionalContent,
-            } }, h("div", { key: 'fa71800b202335afe225062b6546c259024d1ebc', class: "duet-tray-default-content", role: "status" }, h("slot", { key: '88504b3e7785cb2c996ca2a69f4f7613b3142641' })), this.hasAdditionalContent && (h(Fragment, { key: 'b7bbc3062d4b56e76021d7fb1e275033b1d973de' }, h("button", { key: '9f63e2b609caa6ba75251270b1e3f21e2c51900f', "aria-expanded": this.expanded ? "true" : "false", "aria-controls": this.expandableId, onClick: ev => this.toggleExpandable(ev), class: { "duet-tray-button": true, "duet-tray-is-expanded": this.expanded } }, h("duet-icon", { key: '1976d894857521dba637850fd6d0f67dc5d2fb7c', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), h("duet-visually-hidden", { key: '52a51dd5b1c5f590ab6b69cb14f229df0b7af8cd' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), h("div", { key: '6258528ccbe8a9bb546ad35639457757583a4914', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, h("div", { key: '79124cc2718b71d49e3ce57eaa405f7663f2db1e', class: "duet-tray-expandable-content" }, h("slot", { key: '842a4506b47dae4db5b81bd1fe551e09a08672f0', name: "additional" })))))));
+            } }, h("div", { key: 'bd59a764acecbe3ef06cd35bd66f1dfef7510f61', class: "duet-tray-default-content", role: "status" }, h("slot", { key: '130a7f33d591f4217c0cb53518c64263fb157835' })), this.hasAdditionalContent && (h(Fragment, { key: 'b6f16fc8d0d2f00496c7621e586ce20fbda294bc' }, h("button", { key: '80c8ef3feaacc7dfbee92487b4c45b76a29c06ad', "aria-expanded": this.expanded ? "true" : "false", "aria-controls": this.expandableId, onClick: ev => this.toggleExpandable(ev), class: { "duet-tray-button": true, "duet-tray-is-expanded": this.expanded } }, h("duet-icon", { key: '6ee4d016a02a102e29cbec8a4529911ff0971adf', name: "action-arrow-down", size: "small", color: "currentColor", margin: "none" }), h("duet-visually-hidden", { key: '647c81ca9f0ff38f430d4d941b482d86bf4f9e59' }, this.expanded ? this.accessibleCloseLabel : this.accessibleOpenLabel)), h("div", { key: '5c4e077f923a7ea0089832043d9c00f57370c536', id: this.expandableId, class: { "duet-tray-expandable": true, active: this.expanded } }, h("div", { key: '22cac37f81a3f69ffc0fb81fb547d8c358080c19', class: "duet-tray-expandable-content" }, h("slot", { key: '68324e24bafd484cd8639d23fdc0ed6c9ffd053e', name: "additional" })))))));
     }
     get element() { return getElement(this); }
 };

package/lib/esm/duet-upload-aria-status.entry.js

@@ -62,7 +62,7 @@ const DuetUploadAriaStatus = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '177f33a14fe939c866cc4b465b1886899d97af29', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, h("duet-visually-hidden", { key: '410c70a49016691f5795d537a66ead6cc2a9bb64' }, this.statusMessage)));
+        return (h(Host, { key: '26f9145a9517170dfe1ba393f2c5ad65b0b06a02', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, h("duet-visually-hidden", { key: '972991ded0b6c0b7006d97923b1a0f554b7ab597' }, this.statusMessage)));
     }
     get element() { return getElement(this); }
     static get watchers() { return {

package/lib/esm/duet-upload-item.entry.js

@@ -92,9 +92,9 @@ const DuetUploadItem = class {
         const { uid, meta, item } = this.data;
         const Badges = meta && meta.badges ? (h("span", null, meta.badges.map(badgeText => (h("duet-badge", { color: "primary" }, badgeText))))) : undefined;
         const actionDescription = `${meta && meta.badges ? meta.badges.join(",") : ""} ${item.name}`;
-        return (h("div", { key: '499163ce1be1b45ff2d97156ce06d7d9f3fefeb2', class: {
+        return (h("div", { key: 'c8c6c57d941704bc0ddb5c25e0e76287ca4469a1', class: {
                 "upload-item-row": true,
-            } }, this.showCategory && (h("div", { key: '0486c8703101bcb3837161c24ad0fc1a4ffe215f', class: "item-categories" }, h("duet-heading", { key: '292cc4893eebebb39be0360efc9559c5de47b22e', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), h("div", { key: '8e6c67e49f9b5bc79fc011bc44362392eb3b7b24', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (h("duet-heading", { key: '24f05bb11ee5970722963e688fd5c5e797a0e77c', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), h("div", { key: '1c93322e3405f0c329978af89b70c91e7eb9733d', class: "item-actions" }, this.actions.map(actionItem => {
+            } }, this.showCategory && (h("div", { key: '0789dde74b01d1ee704ee518dda0975c31413989', class: "item-categories" }, h("duet-heading", { key: 'fb76eeb96a18a1bc8c5073a41b0656ab506a4b40', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), h("div", { key: 'cb374b138f6cf6c4124a810ed423aa1424105eec', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (h("duet-heading", { key: '19db25ee3bf0a7034ac787e6fa511cbd3c0b3b91', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), h("div", { key: '4c918f6aff58a949d21146cad2fbfb3e30d09b48', class: "item-actions" }, this.actions.map(actionItem => {
             return (h("duet-action-button", { actionMeta: Object.assign({}, meta || {}), actionId: uid || null, actionName: actionItem.name, theme: this.theme, iconName: actionItem.icon, iconColor: actionItem.color, iconSize: actionItem.size, background: actionItem.background, "accessible-label": `${actionDescription} ${getLocaleString(actionItem.label)} `, accessibleTitle: this.getActionButtonTitle(actionItem), ref: button => (this.actionButton = button) }));
         }))));
     }

package/lib/esm/duet-visually-hidden.entry.js

@@ -15,7 +15,7 @@ const DuetVisuallyHidden = class {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'cd9e7fe168ed42bfa9fc4751303db7edd312ce75', class: "duet-visually-hidden" }, h("slot", { key: 'bd33aa5a8f5cf442fab2f40ef59b13c36b32eb9d' })));
+        return (h(Host, { key: 'f655733ff3605a6ba0993f8e37ac51650f8366bb', class: "duet-visually-hidden" }, h("slot", { key: '4825e5d1d6c0268ea3f2b81dab7c44bcd2715046' })));
     }
     get element() { return getElement(this); }
 };