@duetds/components 9.1.1 → 9.1.2

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

@@ -5,12 +5,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const bodyScroll = require('./body-scroll-dba42314.js');
-const focusUtils = require('./focus-utils-b8926034.js');
-const languageUtils = require('./language-utils-8f7743a1.js');
-const slotUtils = require('./slot-utils-85cd307f.js');
+const focusUtils = require('./focus-utils-8bf2f9fe.js');
+const languageUtils = require('./language-utils-0eb766d8.js');
+const slotUtils = require('./slot-utils-0975145c.js');
 const tokenUtils = require('./token-utils-ecc7f5a1.js');
 require('./string-utils-7b13c16e.js');
 require('./tokens.module-cf303205.js');
@@ -163,21 +163,21 @@ const DuetSlideoutPanel = class {
         };
         const exitTranslation = languageUtils.getLocaleString(this.exitLangObject);
         const backTranslation = languageUtils.getLocaleString(this.backLangObject);
-        return (index.h(index.Host, { key: '805cfaa182eb761f1ce6217e1c62ed5dd007a947' }, index.h("div", { key: '363f2f3eaf901468c5f15ad7dcba4d3b781cc500', class: {
+        return (index.h(index.Host, { key: 'a5c1eec78534ae8db8761d48b76978ca2ded8e35' }, index.h("div", { key: 'aa93bb12f4f97f9bbef331eb7cea1e931e65b7cc', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, index.h("button", { key: '5ec34b3ecd11c56416277f0f4753d6dc1f8efed6', 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: {
+            } }, index.h("button", { key: '5990bb80c52d510fce212b4cc8fad608739f8d42', 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 && index.h("duet-icon", { key: '5d6a27c57dc78e388b271f0f2d6eb2cd7821c202', name: this.icon, size: "medium", margin: "none", color: "secondary" }), index.h("span", { key: 'd64964aca9eea3caa8ae881296e258f08146e487', class: "label" }, index.h("span", { key: '6b4148f10a5d1b3065758fb5625da769c52f72ec', class: { "label-text": true, [this.labelSize]: true } }, index.h("slot", { key: '81eb240dd33e6fb12e4a7cca81de48fdcee2af19', name: "label" })), index.h("duet-icon", { key: '50cc29a5a19817e58bfcf90efa70b59b2fba9fdd', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), index.h("div", { key: '37829b24562f4b2815f7d4ab2affd231e7850d9e', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && index.h("duet-icon", { key: 'ea71530dd8a823272b2ea36de72dd21199dd445a', name: this.icon, size: "medium", margin: "none", color: "secondary" }), index.h("span", { key: '575f875b4d6f064432a97287d9e684cdf9b20669', class: "label" }, index.h("span", { key: 'bebaf60d3c1fd76a4ec6dccc9323a1bbb9566694', class: { "label-text": true, [this.labelSize]: true } }, index.h("slot", { key: '5e6ac4f9f3bc0010630a09bf81994e04222501b1', name: "label" })), index.h("duet-icon", { key: 'e076639dc902c33f9f0c42e53b3b2b752a9157f9', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), index.h("div", { key: 'bf5b0f13572d5d9b9545df036812d02bce2620a1', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, index.h(focusUtils.FocusGuard, { key: '866309235d2682686f46604d200cb8fb7789fd78', moveFocusTo: this.closeButton }), index.h("div", { key: 'bf2bc641f6c8818f917fb40b13f6b7fe5e6f208f', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, index.h("div", { key: '67071ec5db130b7f92587562eec7b5ebac45e1bd', class: "top" }, index.h("button", { key: '33da125c06f6246cd7b6a388ffa332c32b8fd374', 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 }, index.h(focusUtils.FocusGuard, { key: '541fecb5051d8b6806c5aa7b50326b1f46eeefe9', moveFocusTo: this.closeButton }), index.h("div", { key: 'db0146241dce60a5cfc5bd3322639b513a015311', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, index.h("div", { key: '905caaacb647cf1c9dc9af4c03b69476653d1138', class: "top" }, index.h("button", { key: '8ae12cbb18bcf43399b1ea04b24b07d70910edc7', 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 }, index.h("duet-icon", { key: '24b7d7426f408b7aa4043495bbf6647851f7d162', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), index.h("span", { key: 'cd331fba8d0793d7c2b59d96e9796a50d77b4224' }, this.label.innerHTML), index.h("button", { key: '62fd9e793ff023422c32a9024a74b9befeb1c056', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, index.h("duet-icon", { key: 'de1281dc825979a6cb290a8e4faf24e53ed3c49a', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), index.h("div", { key: 'c7e160049359ff2cef0e1713fc416b81461a8e44', class: "sticky-header" }, index.h("slot", { key: '8d216879c47672cc6479b1aa9ba76c3379d5e0ec', name: "sticky-header" }))), index.h("div", { key: 'b0bd9025bc1021ff7771105fc79e2c2fe4545ddc', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, index.h("duet-icon", { key: '003116e8f89c352b9df846a570d1e422fac49a57', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), index.h("span", { key: '5005dc1a683188c01552fae3476249deda621e0f' }, this.label.innerHTML), index.h("button", { key: 'bd452a3c82b967e03c8a0e3d02af9e1c3798597d', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, index.h("duet-icon", { key: '8ee0d03ef0e79382c30379f32d2d9a1a8d75402d', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), index.h("div", { key: 'c3cef830db93ac7895786faa7b9a5d5d54c6e35e', class: "sticky-header" }, index.h("slot", { key: '198f7584ed3a2694c1669a4378b93ddf7ddfea9d', name: "sticky-header" }))), index.h("div", { key: '73b1becefc58307429e8cbf003376efda1817526', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, index.h("slot", { key: 'd48e80a480587c2dd49773b14f31ddd56fe790dc' })), index.h(focusUtils.FocusGuard, { key: '4dd1a90579416304992efa312c3999f7941d1a65', moveFocusTo: this.closeButton })))));
+            } }, index.h("slot", { key: '86e3442c8f251c91e30b3c9e279a2080106a3d84' })), index.h(focusUtils.FocusGuard, { key: '4c88ff3bd62b5183cc5647c1874e10964b14b6be', moveFocusTo: this.closeButton })))));
     }
     get element() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -5,13 +5,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const bodyScroll = require('./body-scroll-dba42314.js');
-const focusUtils = require('./focus-utils-b8926034.js');
+const focusUtils = require('./focus-utils-8bf2f9fe.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');
-const languageUtils = require('./language-utils-8f7743a1.js');
-const slotUtils = require('./slot-utils-85cd307f.js');
+const languageUtils = require('./language-utils-0eb766d8.js');
+const slotUtils = require('./slot-utils-0975145c.js');
 const teleport = require('./teleport-c6f8391a.js');
 const tokenUtils = require('./token-utils-ecc7f5a1.js');
 require('./string-utils-7b13c16e.js');

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const createId = require('./create-id-1f8c438f.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');
 
@@ -40,12 +40,12 @@ const DuetSubmenuBarDropdownLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (index.h(index.Host, { key: 'becb2a65396836f75dd2107bbca7b490a721ec9f' }, index.h("a", { key: 'd5e322c29ea914b48d57fad90136d18fe17229ac', class: {
+        return (index.h(index.Host, { key: '64c7a859f5b865bc0308445b9d0156156837fe49' }, index.h("a", { key: 'c44943bce8c5a15f3ede97c010eff57f7f7941c7', 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 && index.h("duet-icon", { key: '6172f90356d35fba7e533fb632c212b400244666', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), index.h("span", { key: '4612a1f95f7d0d41b37d856ac49f8455fb4bca40', class: "label-container" }, index.h("span", { key: '44b1a2a55750d0eff61f8057f8730a2ef2167131', class: "label" }, index.h("slot", { key: '1c1bbf56491ce130a990833ad158ce64dfb55c04' })), this.caret && index.h("duet-icon", { key: 'b1a63e742eadf1244fcd90b98a9df90f37e87fee', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (index.h("duet-icon", { key: '22ae20117fc0318b97289382cfc6727b101058c1', 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 && index.h("duet-icon", { key: '83939de1b509ebcfc60714398b51dcaf374d6b30', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), index.h("span", { key: 'ce3588496af8ffac960897c667027edd97ae5e65', class: "label-container" }, index.h("span", { key: '752537ca0a31718f20089bb9804ba19b20c0c443', class: "label" }, index.h("slot", { key: '16331721c331936cb46311d02038526b00b7bcac' })), this.caret && index.h("duet-icon", { key: 'ac8613eceb672049fc7d6c05c51e2216d93b61df', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (index.h("duet-icon", { key: 'f18ca26aca59468eac301dd11a1f13a0c77aaa31', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const tokens = require('./tokens-1c133754.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');
@@ -105,18 +105,18 @@ const DuetSubmenuBarDropdown = class {
      * Always the last one in the class.
      */
     render() {
-        return (index.h(index.Host, { key: 'ced56417d146eb3149884a6acf9d2f0c2a63441f', role: "listitem" }, index.h("div", { key: '166bb208b5185668b66feb8dbd14e7afb38bb649', class: {
+        return (index.h(index.Host, { key: '361b820b8f227befb95bc64b87c761c2d0396a4f', role: "listitem" }, index.h("div", { key: '53210cb90b3d5e714d1d8e30cca928b9ca22e416', class: {
                 "duet-submenu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 open: this.open,
                 active: this.active,
-            } }, index.h("button", { key: 'de45f25e558d837a8325f7f33a4f30e3c1071902', 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: {
+            } }, index.h("button", { key: '2df474dfe088be14b042114456474c876f4b61a0', 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 && (index.h("duet-icon", { key: '8308454f3cc3c2771afaad1632f2eeb812ad8e84', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), index.h("div", { key: 'f34879f5749b92e79c2e16ac83261526f958d6a1', class: "label" }, index.h("span", { key: 'f8be24eef6e5e42e40b1e05fa1a6c391670849a7', class: "label-text" }, index.h("slot", { key: 'a5e526a73c39672ab1c5cd81f58cb6c362b249eb', name: "label" })), index.h("duet-icon", { key: '160ce4e95b62545c0432587ee7510bb74607697e', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), index.h("div", { key: 'eb0c9fbe5a4001f406eaa529a7909f148100e8de', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (index.h("duet-icon", { key: '89d102ebae36a02c887f3824fffaa4271590d92a', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), index.h("div", { key: '31866b710f3df48bfb0aa0dcff165e617e8cc327', class: "label" }, index.h("span", { key: '193d3e662d773b7ce3bc8e67265469fb254d8f1f', class: "label-text" }, index.h("slot", { key: 'a1c2a3a7d385a99ad697244ea8ff303bc9f62d34', name: "label" })), index.h("duet-icon", { key: '7190348fc2dd0ea59e407be5b60de9476a349594', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), index.h("div", { key: 'c0cad51034312dcdb9ff9ca435f9091ae9ecfc55', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, index.h("slot", { key: '9648718ea62884b361f4cf695b8bc08fcaf42434' })))));
+            } }, index.h("slot", { key: 'e53f34efca52841432dd37b703f1ffdaa68eb940' })))));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');
 
@@ -50,7 +50,7 @@ const DuetSubmenuBarItem = class {
     render() {
         const TagName = this.url ? "a" : "button";
         const role = this.url ? "link" : "button";
-        return (index.h(index.Host, { key: '003b6e77d31a2b55fcfbb5c07708a96e7a687224', role: "listitem" }, index.h(TagName, { key: '65bb3b4ae0bc56ffa9425e410026685f09f4cff3', 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.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role }, this.leadingIcon && (index.h("duet-icon", { key: '75babe76dbd89f0a7fe44760ea40c2d318132163', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), index.h("div", { key: 'f7d6d855c464595ce3ed2e3682b0b469e8d9f0ba', class: "label" }, index.h("span", { key: '3cfdea86b60ad0e7584374489ae068fabd9b5480', class: "label-text" }, index.h("slot", { key: '9703e9c022f42456bb4f3237343a256116815731' })), this.trailingIcon && (index.h("duet-icon", { key: '4da2be3263bfda5b511034edeef0e9308302f7d1', class: {
+        return (index.h(index.Host, { key: '0e1724544b134f6de86d56dd739a9635f337e717', role: "listitem" }, index.h(TagName, { key: '6f04e57ea3e9bf27a1967283e2375a281d675529', 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.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, role: role }, this.leadingIcon && (index.h("duet-icon", { key: 'e1b98f949d70182538731d1d7f07bd961fd79836', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), index.h("div", { key: 'af220f398f6bdc969c4de91c5bdf03cb814631f0', class: "label" }, index.h("span", { key: '6b376bcca90ac606bd44f4dc04026d8eda710004', class: "label-text" }, index.h("slot", { key: 'cec40ee0c2ca47ee02e3b0ede33d41d8a0e6d797' })), this.trailingIcon && (index.h("duet-icon", { key: '243fd913a9c6d73489e2d1bcfa60566fa72bfcf6', class: {
                 "trailing-icon": true,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');
 
@@ -38,7 +38,7 @@ const DuetSubmenuBarLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (index.h(index.Host, { key: 'c48d47c5e033d5ca70c1d1c80bac45c29f348341', role: "listitem" }, index.h("a", { key: '8ed842cbabe3a496e0f5736573a9981a74ce8257', 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 && (index.h("duet-icon", { key: '3a930062f0a0a0f79b178cedaf990f8b74112603', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), index.h("span", { key: '8e9b0e67db2502fdc4616342944576a648002b70', class: "label" }, index.h("slot", { key: '0c5445ad8aa0dee1c593548e14c91ae7a467d1ee' })))));
+        return (index.h(index.Host, { key: 'ab3dd8345454b3f0c20458f6302dffaaee6cc002', role: "listitem" }, index.h("a", { key: 'bcc31509ceddcef3f2c3c58e29c5b108eb8b432f', 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 && (index.h("duet-icon", { key: 'f5d87725bdb14e435d6d4b04ef0c84b1de5d1a3e', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), index.h("span", { key: 'f24d079552fa8ce924d8dd3125afe01bbd331ab5', class: "label" }, index.h("slot", { key: '669772430086a3f897f68ab40b5703a75e631f3a' })))));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const tokens = require('./tokens-1c133754.js');
 const bodyScrollLock_es6 = require('./bodyScrollLock.es6-dd2d7d91.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
@@ -131,19 +131,19 @@ const DuetSubmenuBar = class {
      * Always the last one in the class.
      */
     render() {
-        return (index.h(index.Host, { key: 'd23feaeb59a6a54db129042cc984d77237de92c4' }, index.h("nav", { key: 'c1a5e23bf7598285828acc0df6ba04d10777d816', class: {
+        return (index.h(index.Host, { key: '46b42aaf1cf7b5948285be8b8fada1fbb895c29c' }, index.h("nav", { key: '24fb21f0c3223068128475fee9e711c407c6cc42', class: {
                 "duet-submenu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 hidden: this.hidden,
-            }, "aria-label": this.accessibleLabel }, this.hasItems && (index.h("button", { key: '37bef492a5c920f7c63f33cef8496079b25151dd', 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 && (index.h("button", { key: 'fdae5917434838629bea146c0fecd71d6eba5a49', 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 }, index.h("span", { key: '3627d9e5b49dca1946bbcea8b30139afa373da36', class: "label" }, index.h("slot", { key: 'e129c5ce82224625f3bec58dec0c20085664b4c8', name: "label" }), index.h("duet-icon", { key: 'acf4f3367afe06a7068b3120bf8f12951b2a8845', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), index.h("div", { key: '882629e17e25bbddaa56c909a298d69d534abe08', class: {
+            }, onClick: this.onClick }, index.h("span", { key: '741ee52c89789d6f29807af0318e7ad3ce387ea2', class: "label" }, index.h("slot", { key: 'cc032638072e4bf611fa6f90f4e87a06d6d62011', name: "label" }), index.h("duet-icon", { key: 'e5d275e6378ca608e4770cf01548db63c53fc921', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), index.h("div", { key: '4b3528bc077697f379eee779e85cbd8a0ddb407e', class: {
                 "menu-container": true,
                 hidden: !this.open,
-            }, role: "presentation" }, index.h("div", { key: 'f06adcfe1330258fdf9395766e0e6a2a44bb1540', 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" }, index.h("div", { key: '22d201c917df952f74c4ce0f28786cfca78c6e5c', 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) }, index.h("div", { key: 'c0b7893f4beafab4ea530f6c7a0723988bd986c8', class: "list", role: this.mobile ? "presentation" : "list" }, index.h("slot", { key: '81800724eb1fdc99ebf058a192746cd64ff5f2f4' }), index.h("div", { key: '33615812b5ac6e839c6487696a1a3bc31f620744', class: "list-padding" }))), index.h("duet-overlay", { key: '09b4069d8369250684e4a51c085d0b804f57ad29', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
+            }, ref: element => (this.itemsContainer = element) }, index.h("div", { key: 'c602c78831309546c9e825b1b7b77fc92dc3f0fa', class: "list", role: this.mobile ? "presentation" : "list" }, index.h("slot", { key: '0a329fa6a2e485a50588f108544dfe414480a3b6' }), index.h("div", { key: 'cbe81c72e9210a0384d82a5a827a54edf890f020', class: "list-padding" }))), index.h("duet-overlay", { key: 'e802c1912aa5dc34d0dbf0e265190fc7ba27a1d3', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
     }
     get element() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -5,15 +5,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const createId = require('./create-id-1f8c438f.js');
 const inputUtils = require('./input-utils-1096a2c5.js');
-const languageUtils = require('./language-utils-8f7743a1.js');
-const slotUtils = require('./slot-utils-85cd307f.js');
+const languageUtils = require('./language-utils-0eb766d8.js');
+const slotUtils = require('./slot-utils-0975145c.js');
 require('./string-utils-7b13c16e.js');
 
-const duetTextareaCss = "*.sc-duet-textarea,*.sc-duet-textarea::after,*.sc-duet-textarea::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}.sc-duet-textarea-h{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:16px !important;margin-bottom:12px !important;display:block;width:100%;max-width:100%;text-align:left}.sc-duet-textarea-h:last-child,.sc-duet-textarea-h:last-of-type{margin-right:0 !important}@media (min-width: 36em){.sc-duet-textarea-h{width:calc(50% - 16px - 3px)}.duet-expand.sc-duet-textarea-h{width:100% !important}}.duet-m-0.sc-duet-textarea-h{margin:0 !important}duet-tooltip.sc-duet-textarea,.sc-duet-textarea-s>duet-tooltip{position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip.sc-duet-textarea,.sc-duet-textarea-s>duet-tooltip{position:relative;top:4px;right:auto}}.duet-textarea-container.sc-duet-textarea{position:relative;width:100%;height:100%}.duet-textarea-container.sc-duet-textarea .duet-input-top-caption.sc-duet-textarea{display:none}.duet-textarea-container.duet-input-top-caption-shown.sc-duet-textarea .duet-input-top-caption.sc-duet-textarea{display:flex !important}.duet-textarea-wrapper.sc-duet-textarea{position:relative}.duet-textarea-placeholder.sc-duet-textarea{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-textarea.sc-duet-textarea{padding:15px !important;position:relative;z-index:100;display:block;width:100%;min-width:8rem;min-height:160px;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;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(0, 41, 77);resize:vertical;background:rgb(255, 255, 255);border:1px solid rgb(144, 149, 153);border-radius:4px;transition:150ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea{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);border-color:rgb(116, 116, 117)}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:rgb(222, 35, 98) !important}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea{border-color:rgb(224, 42, 13) !important}.duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:rgb(101, 119, 135);opacity:1 !important;transition:color 300ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-webkit-input-placeholder{color:rgb(116, 116, 117)}.duet-textarea.sc-duet-textarea:focus::-webkit-input-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus::-webkit-input-placeholder{color:rgb(207, 207, 209)}.duet-textarea.sc-duet-textarea::-moz-placeholder{color:rgb(101, 119, 135);opacity:1 !important}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea::-moz-placeholder{color:rgb(116, 116, 117)}.duet-textarea.sc-duet-textarea:focus::-moz-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus::-moz-placeholder{color:rgb(207, 207, 209)}.duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:rgb(101, 119, 135)}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:-ms-input-placeholder{color:rgb(116, 116, 117)}.duet-textarea.sc-duet-textarea:focus:-ms-input-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus:-ms-input-placeholder{color:rgb(207, 207, 209)}.duet-textarea[disabled].sc-duet-textarea{color:rgb(101, 119, 135) !important;cursor:not-allowed !important;background:rgb(245, 248, 250) !important;border-color:rgb(245, 248, 250) !important}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea{color:rgb(116, 116, 117) !important;background:rgb(245, 245, 247) !important;border-color:rgb(245, 245, 247) !important}.duet-textarea[disabled].sc-duet-textarea::-webkit-input-placeholder{color:rgb(0, 41, 77);opacity:1 !important;transition:color 300ms ease}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea::-webkit-input-placeholder{color:rgb(23, 28, 58)}.duet-textarea[disabled].sc-duet-textarea::-moz-placeholder{color:rgb(0, 41, 77);opacity:1 !important}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea::-moz-placeholder{color:rgb(23, 28, 58)}.duet-textarea[disabled].sc-duet-textarea:-ms-input-placeholder{color:rgb(0, 41, 77)}.duet-theme-turva.sc-duet-textarea .duet-textarea[disabled].sc-duet-textarea:-ms-input-placeholder{color:rgb(23, 28, 58)}.duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #909599}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #747475}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #e55039}.duet-textarea.sc-duet-textarea:focus{border-color:rgb(0, 119, 179);outline:0;box-shadow:0 0 0 1px #0077b3 !important;transition:none}.duet-theme-turva.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{border-color:rgb(23, 28, 58);box-shadow:0 0 0 1px #171c3a !important}.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea.sc-duet-textarea:focus{box-shadow:0 0 0 1px #e55039}.duet-textarea.sc-duet-textarea:not(:focus):not(:hover):invalid{box-shadow:none}.duet-textarea-help.sc-duet-textarea{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;line-height:1.25}.duet-textarea-help.sc-duet-textarea span.sc-duet-textarea{display:block;margin-top:8px}.duet-theme-turva.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{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(116, 116, 117)}.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:rgb(222, 35, 98)}.duet-theme-turva.has-error.sc-duet-textarea .duet-textarea-help.sc-duet-textarea{color:rgb(224, 42, 13)}.duet-label-hidden.sc-duet-textarea duet-label.sc-duet-textarea{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-character-count.sc-duet-textarea{display:block;margin:8px 0 0 auto}";
+const duetTextareaCss = "*,*::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;margin-right:16px !important;margin-bottom:12px !important;display:block;width:100%;max-width:100%;text-align:left}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (min-width: 36em){:host{width:calc(50% - 16px - 3px)}:host.duet-expand{width:100% !important}}:host(.duet-m-0){margin:0 !important}duet-tooltip,::slotted(duet-tooltip){position:absolute;top:12px;right:0}@media (min-width: 48em){duet-tooltip,::slotted(duet-tooltip){position:relative;top:4px;right:auto}}.duet-textarea-container{position:relative;width:100%;height:100%}.duet-textarea-container .duet-input-top-caption{display:none}.duet-textarea-container.duet-input-top-caption-shown .duet-input-top-caption{display:flex !important}.duet-textarea-wrapper{position:relative}.duet-textarea-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-textarea{padding:15px !important;position:relative;z-index:100;display:block;width:100%;min-width:8rem;min-height:160px;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;font-variant-numeric:tabular-nums;line-height:1.25;color:rgb(0, 41, 77);resize:vertical;background:rgb(255, 255, 255);border:1px solid rgb(144, 149, 153);border-radius:4px;transition:150ms ease}.duet-theme-turva .duet-textarea{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);border-color:rgb(116, 116, 117)}.has-error .duet-textarea{border-color:rgb(222, 35, 98) !important}.duet-theme-turva.has-error .duet-textarea{border-color:rgb(224, 42, 13) !important}.duet-textarea::-webkit-input-placeholder{color:rgb(101, 119, 135);opacity:1 !important;transition:color 300ms ease}.duet-theme-turva .duet-textarea::-webkit-input-placeholder{color:rgb(116, 116, 117)}.duet-textarea:focus::-webkit-input-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva .duet-textarea:focus::-webkit-input-placeholder{color:rgb(207, 207, 209)}.duet-textarea::-moz-placeholder{color:rgb(101, 119, 135);opacity:1 !important}.duet-theme-turva .duet-textarea::-moz-placeholder{color:rgb(116, 116, 117)}.duet-textarea:focus::-moz-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva .duet-textarea:focus::-moz-placeholder{color:rgb(207, 207, 209)}.duet-textarea:-ms-input-placeholder{color:rgb(101, 119, 135)}.duet-theme-turva .duet-textarea:-ms-input-placeholder{color:rgb(116, 116, 117)}.duet-textarea:focus:-ms-input-placeholder{color:rgb(207, 210, 212)}.duet-theme-turva .duet-textarea:focus:-ms-input-placeholder{color:rgb(207, 207, 209)}.duet-textarea[disabled]{color:rgb(101, 119, 135) !important;cursor:not-allowed !important;background:rgb(245, 248, 250) !important;border-color:rgb(245, 248, 250) !important}.duet-theme-turva .duet-textarea[disabled]{color:rgb(116, 116, 117) !important;background:rgb(245, 245, 247) !important;border-color:rgb(245, 245, 247) !important}.duet-textarea[disabled]::-webkit-input-placeholder{color:rgb(0, 41, 77);opacity:1 !important;transition:color 300ms ease}.duet-theme-turva .duet-textarea[disabled]::-webkit-input-placeholder{color:rgb(23, 28, 58)}.duet-textarea[disabled]::-moz-placeholder{color:rgb(0, 41, 77);opacity:1 !important}.duet-theme-turva .duet-textarea[disabled]::-moz-placeholder{color:rgb(23, 28, 58)}.duet-textarea[disabled]:-ms-input-placeholder{color:rgb(0, 41, 77)}.duet-theme-turva .duet-textarea[disabled]:-ms-input-placeholder{color:rgb(23, 28, 58)}.duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #909599}.duet-theme-turva .duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #747475}.has-error .duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error .duet-textarea:hover:not(:disabled){box-shadow:0 0 0 1px #e55039}.duet-textarea:focus{border-color:rgb(0, 119, 179);outline:0;box-shadow:0 0 0 1px #0077b3 !important;transition:none}.duet-theme-turva .duet-textarea:focus{border-color:rgb(23, 28, 58);box-shadow:0 0 0 1px #171c3a !important}.has-error .duet-textarea:focus{box-shadow:0 0 0 1px #de2362}.duet-theme-turva.has-error .duet-textarea:focus{box-shadow:0 0 0 1px #e55039}.duet-textarea:not(:focus):not(:hover):invalid{box-shadow:none}.duet-textarea-help{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;line-height:1.25}.duet-textarea-help span{display:block;margin-top:8px}.duet-theme-turva .duet-textarea-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(116, 116, 117)}.has-error .duet-textarea-help{color:rgb(222, 35, 98)}.duet-theme-turva.has-error .duet-textarea-help{color:rgb(224, 42, 13)}.duet-label-hidden duet-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}.duet-character-count{display:block;margin:8px 0 0 auto}";
 const DuetTextareaStyle0 = duetTextareaCss;
 
 const CharacterCount = ({ value, maxlength, label, theme }) => {
@@ -174,17 +174,17 @@ const DuetTextarea = class {
      */
     render() {
         const identifier = this.identifier || this.textareaId;
-        return (index.h(index.Host, { class: {
+        return (index.h(index.Host, { key: '95fd5e5a71db0cbdbdb4e4f51c031eb38e98eb20', class: {
                 "duet-m-0": this.margin === "none",
                 "duet-has-counter": this.counter && !this.error,
                 "duet-expand": this.expand,
-            } }, index.h("div", { class: {
+            } }, index.h("div", { key: '417ef9e56fbc4667adfcddd29e709b86b3c29496', 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,
-            } }, index.h("duet-label", { 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 && (index.h("duet-tooltip", { direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), index.h("slot", { name: "tooltip" }), this.caption && (index.h("duet-caption", { id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), index.h("div", { class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (index.h("duet-caption", { id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), index.h("textarea", { 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 })), index.h("duet-grid", { alignment: "stretch" }, index.h("duet-grid-item", { margin: "none", fill: true }, index.h("div", { class: "duet-textarea-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && index.h("span", null, this.error))), index.h("duet-grid-item", { margin: "none", class: "duet-character-count-caption" }, this.counter && (index.h(CharacterCount, { theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (index.h("duet-visually-hidden", { class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
+            } }, index.h("duet-label", { key: 'c970faa68895f7c718c3461ff56b36ba51ca2b39', 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 && (index.h("duet-tooltip", { key: 'e819a4b2a028a99b64c2065f4c9f6029600d2acb', direction: this.tooltipDirection, accessibleInputLabel: this.label, theme: this.theme === "turva" ? "turva" : "default" }, this.tooltip)), index.h("slot", { key: '3ec4fdbb3f16f533c56b73d7f9c435345f4ce0ce', name: "tooltip" }), this.caption && (index.h("duet-caption", { key: 'ac0b106adb6889cb8eb4878fb26f4e8e2dda7188', id: this.topCaptionId, size: "medium", theme: this.theme === "turva" ? "turva" : "default" }, this.caption)), index.h("div", { key: '7214df64bab9dce0d99d3ff2a96ff2e010d2fb83', class: "duet-textarea-wrapper" }, this.placeholder && this.echoPlaceholder && this.value && (index.h("duet-caption", { key: 'ff3814fd43da859de1cf2269bf6e2b55cc34fd9c', id: this.topCaptionPlaceholderId, class: "duet-textarea-placeholder", size: "small" }, this.placeholder)), index.h("textarea", { key: '56f4f30b7d7ee1407aefe788835ada1305f7bcf9', 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 })), index.h("duet-grid", { key: '622cfa8317fe37f645b1180c6ad35f59b8351fa4', alignment: "stretch" }, index.h("duet-grid-item", { key: '9a1ef5419a5f72b2d23986eef1681b547067c5f4', margin: "none", fill: true }, index.h("div", { key: 'd7e0dcd97261a2ee0744b19efb5c6f78ab6b2a9f', class: "duet-textarea-help", id: this.errorId, "aria-atomic": "true", "aria-live": this.accessibleLiveError, "aria-relevant": "additions removals" }, this.error && index.h("span", { key: 'e1673fe8bdc7e4560a701074a103b0ef8f6fd5f8' }, this.error))), index.h("duet-grid-item", { key: '8be9f6e9ca8afbe0734c4a366d4a7c43fdc01cdb', margin: "none", class: "duet-character-count-caption" }, this.counter && (index.h(CharacterCount, { key: '853baf2df8a6816d1af92476a4af383e5d656ea2', theme: this.theme, value: this.value, maxlength: this.maxlength, label: this.counterLabel })))), this.counter && (index.h("duet-visually-hidden", { key: '9f13bfdda388bd779ebad2bcbd33058f3242f79c', class: "duet-visually-hidden", id: this.characterCountId, ref: el => {
                 this.hiddenCounterLabel = el;
             } })))));
     }

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const createId = require('./create-id-1f8c438f.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');
 
@@ -40,11 +40,11 @@ const DuetToolbarDropdownLink = class {
      * Always the last one in the class.
      */
     render() {
-        return (index.h(index.Host, { key: '4af2710f36e24283c22b8c18882e2ffbd9087470' }, index.h("a", { key: '14042423bfb55754bf44164fade567d2cdd05362', class: {
+        return (index.h(index.Host, { key: 'd363a198149fd9a4c08eb181eaa1056d18c0898a' }, index.h("a", { key: '99aad91124922259990a94a28be6e94622eea6c5', 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 && index.h("duet-icon", { key: '045f0d9fb5cc474dcac7444658549fa290ba6243', name: this.icon, size: "x-small", margin: "none" }), index.h("span", { key: 'b8383c9956ddbe65a5c6f5b94f267f3dc09aa27a', class: "label" }, index.h("slot", { key: '7ba816b6a70ed2cdcccdb91d166212c5b9f0770d' })), this.active && (index.h("duet-icon", { key: '0cfcee7e092007e149e6aac61a285f15e9abd39d', 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 && index.h("duet-icon", { key: '8eb9410146ab81b0cf902afb892e67f693a10be3', name: this.icon, size: "x-small", margin: "none" }), index.h("span", { key: '780d2b204def16a761608214698d0486905e7c3f', class: "label" }, index.h("slot", { key: 'bd1aba77300442cf2d08d04221e8b7a44c93d168' })), this.active && (index.h("duet-icon", { key: '26f6d4384f221713f8dc3b58945a77cecd2b746d', name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');
 
@@ -59,18 +59,18 @@ const DuetToolbarDropdown = class {
             itemsAlign = this.element.parentElement.getAttribute("slot") === "left" ? "right" : "left";
         }
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (index.h(index.Host, { key: 'a03134ac9fe7d5f02b65f2e2d971ba2ae2917151', role: "listitem" }, index.h("div", { key: 'cdba6c57b783cf33ebb02779c157841d1f3a7069', class: {
+        return (index.h(index.Host, { key: 'c896db9b3ac2a4d10e400e67b7f31b6ecacb3737', role: "listitem" }, index.h("div", { key: '7f55d5535230767d71071a62c58f6754e8cafc1f', class: {
                 "duet-toolbar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 [itemsAlign]: true,
                 [variation]: true,
-            } }, index.h("button", { key: '6e9e598d0b050543edf965afa4a039329225bf30', 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: {
+            } }, index.h("button", { key: 'ce96d8220ea871a3ab72bf615107174f6c0802e8', 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 && (index.h("duet-icon", { key: '994ca2b6041ac20bcf181d0a508d9af0544a49b9', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), index.h("span", { key: '1f5e46c63cc1de968f174d6d86319ee0d934089c', class: "label" }, index.h("slot", { key: 'e9f8b3231e608fb37d152cced5288b66f4ac4035', name: "label" }), index.h("duet-icon", { key: '131452437b2bdca148bff41a245be592715af9c0', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), index.h("div", { key: '868b963973203d0d10ce080b273d28a569d5d8c2', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (index.h("duet-icon", { key: '11582ddf116e08da6aa3ba54ccc2db6e4a395abb', theme: this.theme, name: this.icon, size: "x-small", margin: "none", color: "currentColor" })), index.h("span", { key: '74d8a298238f17ab10bc16d0073aeb0104699047', class: "label" }, index.h("slot", { key: '8df1bb703f76b2ef0460055c037bcfc4e842d10b', name: "label" }), index.h("duet-icon", { key: 'acfa3f2f7862089008f8d8b2eba95bb6dfef3aa0', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), index.h("div", { key: '718e2a52bf0c3579a1094991f83f2b9fd6e8491c', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, index.h("slot", { key: '1e6a4a1d661c39acf3c7a66fbf3c3532b897df6b' })))));
+            } }, index.h("slot", { key: 'ececcbe7ad87bdc55995ce8db36d464f47fefbf9' })))));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -5,10 +5,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 
-const duetToolbarItemCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;height:100%}.duet-toolbar-item{position:relative;display:flex;gap:8px;align-items:center;justify-content:center;height:100%;padding:0 16px;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, 77, 128);text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer}.duet-toolbar-item:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-toolbar-item:focus,.duet-toolbar-item:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-toolbar-item[aria-expanded=true] .trailing-icon.rotate{transform:rotate(180deg)}.duet-toolbar-item.negative{color:rgb(255, 255, 255)}.duet-toolbar-item.negative[aria-expanded=true]{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item.negative duet-icon{color:rgb(205, 229, 241)}.duet-toolbar-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\";color:rgb(23, 28, 58)}.duet-toolbar-item.duet-theme-turva.negative{color:rgb(255, 255, 255)}.duet-toolbar-item.duet-theme-turva.negative[aria-expanded=true]{background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.duet-theme-turva.negative duet-icon{color:rgb(244, 207, 214)}.duet-toolbar-item:hover{color:rgb(0, 41, 77);background:rgb(243, 249, 252)}.duet-toolbar-item:hover.negative{color:rgb(255, 255, 255);background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item:hover.duet-theme-turva{color:rgb(23, 28, 58);background:rgb(245, 245, 247)}.duet-toolbar-item:hover.duet-theme-turva.negative{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.active{color:rgb(0, 41, 77)}.duet-toolbar-item.active.negative{font-weight:600;color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.active.negative::after{display:none}.duet-toolbar-item.active::after{position:absolute;top:auto;bottom:1px;left:0;display:block;width:100%;height:1px;content:\"\";background:rgb(0, 119, 179);transition:300ms ease;transform:translateY(1px)}.duet-toolbar-item.active::after.duet-theme-turva{background:rgb(198, 12, 48)}.duet-toolbar-item.active.duet-theme-turva{color:rgb(23, 28, 58)}.duet-toolbar-item.active.duet-theme-turva::after{background:rgb(198, 12, 48)}.duet-toolbar-item.active.duet-theme-turva.negative{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}";
+const duetToolbarItemCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;height:100%}.duet-toolbar-item{position:relative;display:flex;gap:8px;align-items:center;justify-content:center;height:100%;padding:0 16px;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, 77, 128);text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer}.duet-toolbar-item:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-toolbar-item:focus,.duet-toolbar-item:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-toolbar-item[aria-expanded=true] .trailing-icon.rotate{transform:rotate(180deg)}.duet-toolbar-item.primary,.duet-toolbar-item.secondary{color:rgb(255, 255, 255)}.duet-toolbar-item.primary[aria-expanded=true],.duet-toolbar-item.secondary[aria-expanded=true]{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item.primary duet-icon,.duet-toolbar-item.secondary duet-icon{color:rgb(205, 229, 241)}.duet-toolbar-item.primary[aria-expanded=true]{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item.secondary[aria-expanded=true]{background:rgb(3, 56, 102)}.duet-toolbar-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\";color:rgb(23, 28, 58)}.duet-toolbar-item.duet-theme-turva.primary{color:rgb(255, 255, 255)}.duet-toolbar-item.duet-theme-turva.primary[aria-expanded=true]{background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.duet-theme-turva.primary duet-icon{color:rgb(244, 207, 214)}.duet-toolbar-item:hover{color:rgb(0, 41, 77);background:rgb(243, 249, 252)}.duet-toolbar-item:hover.primary,.duet-toolbar-item:hover.secondary{color:rgb(255, 255, 255)}.duet-toolbar-item:hover.primary{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item:hover.secondary{background:rgb(3, 56, 102)}.duet-toolbar-item:hover.duet-theme-turva{color:rgb(23, 28, 58);background:rgb(245, 245, 247)}.duet-toolbar-item:hover.duet-theme-turva.primary{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}.duet-toolbar-item.active{color:rgb(0, 41, 77)}.duet-toolbar-item.active.primary,.duet-toolbar-item.active.secondary{font-weight:600;color:rgb(255, 255, 255)}.duet-toolbar-item.active.primary::after,.duet-toolbar-item.active.secondary::after{display:none}.duet-toolbar-item.active.primary{background:rgba(0, 41, 77, 0.2)}.duet-toolbar-item.active.secondary{background:rgb(3, 56, 102)}.duet-toolbar-item.active::after{position:absolute;top:auto;bottom:1px;left:0;display:block;width:100%;height:1px;content:\"\";background:rgb(0, 119, 179);transition:300ms ease;transform:translateY(1px)}.duet-toolbar-item.active::after.duet-theme-turva{background:rgb(198, 12, 48)}.duet-toolbar-item.active.duet-theme-turva{color:rgb(23, 28, 58)}.duet-toolbar-item.active.duet-theme-turva::after{background:rgb(198, 12, 48)}.duet-toolbar-item.active.duet-theme-turva.primary{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}";
 const DuetToolbarItemStyle0 = duetToolbarItemCss;
 
 const DuetToolbarItem = class {
@@ -42,13 +42,19 @@ const DuetToolbarItem = class {
      */
     render() {
         const TagName = this.url ? "a" : "button";
-        const variation = this.variation === "negative" ? "negative" : "white";
-        return (index.h(index.Host, { key: '11516108db5173962d464b171bda937ea1ee8a04', role: "listitem" }, index.h(TagName, { key: 'd96f7785b4b44b47427e42feaf67d421ec87b749', ref: element => (this.itemElement = element), class: {
+        const variation = this.variation === "primary" ||
+            this.variation === "negative" ||
+            (this.theme === "turva" && this.variation === "secondary")
+            ? "primary"
+            : this.variation === "secondary"
+                ? "secondary"
+                : "default";
+        return (index.h(index.Host, { key: 'be0a9608c45623e976d79e193f6f4255fad2812d', role: "listitem" }, index.h(TagName, { key: 'baeb9d0e203b2fc97983530d798121d4df7e9b7b', 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.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.leadingIcon && (index.h("duet-icon", { key: 'c8626052490a913781ed6584838b02d83155927c', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), index.h("slot", { key: '5fbfcb6f90f3b361703c90848a164ca181fcc5b1' }), this.trailingIcon && (index.h("duet-icon", { key: 'eba6c7cb4e69d84bb484a7914b1a4846abadd5b8', class: {
+            }, href: this.url, role: `${TagName === "a" ? "link" : "button"}`, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel, "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined }, this.leadingIcon && (index.h("duet-icon", { key: 'c77109ca570f1c6da5e3aef5a71a3c708d8962e9', size: "x-small", name: this.leadingIcon, margin: "none", theme: this.theme, color: "currentColor" })), index.h("slot", { key: 'e020d036269f7847cbd20c879c4d2267f312f6e3' }), this.trailingIcon && (index.h("duet-icon", { key: '00d90da73a2063c9990fd93f4aa0c613a7d0f52f', class: {
                 "trailing-icon": true,
                 rotate: this.trailingIcon === "action-arrow-down-small" && this.accessibleExpanded,
             }, theme: this.theme, name: this.trailingIcon, margin: "none", size: this.trailingIcon === "action-arrow-down-small" ? "xxx-small" : "x-small", color: "currentColor" })))));

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

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 
 const duetToolbarLinkCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;height:100%}.duet-toolbar-link{position:relative;display:flex;gap:8px;align-items:center;justify-content:center;height:100%;padding:0 16px;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, 77, 128);text-align:center;text-decoration:none;white-space:nowrap}.duet-toolbar-link:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-toolbar-link:focus,.duet-toolbar-link:focus.duet-theme-turva{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-toolbar-link.negative{color:rgb(255, 255, 255)}.duet-toolbar-link.negative duet-icon{color:rgb(205, 229, 241)}.duet-toolbar-link.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:rgb(23, 28, 58)}.duet-toolbar-link.duet-theme-turva.negative{color:rgb(255, 255, 255)}.duet-toolbar-link.duet-theme-turva.negative duet-icon{color:rgb(244, 207, 214)}.duet-toolbar-link:hover{color:rgb(0, 41, 77);background:rgb(243, 249, 252)}.duet-toolbar-link:hover.negative{color:rgb(255, 255, 255);background:rgba(0, 41, 77, 0.2)}.duet-toolbar-link:hover.duet-theme-turva{color:rgb(23, 28, 58);background:rgb(245, 245, 247)}.duet-toolbar-link:hover.duet-theme-turva.negative{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}.duet-toolbar-link.active{color:rgb(0, 41, 77)}.duet-toolbar-link.active.negative{font-weight:600;color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}.duet-toolbar-link.active.negative::after{display:none}.duet-toolbar-link.active::after{position:absolute;top:auto;bottom:1px;left:0;display:block;width:100%;height:1px;content:\"\";background:rgb(0, 119, 179);transition:300ms ease;transform:translateY(1px)}.duet-toolbar-link.active::after.duet-theme-turva{background:rgb(198, 12, 48)}.duet-toolbar-link.active.duet-theme-turva{color:rgb(23, 28, 58)}.duet-toolbar-link.active.duet-theme-turva::after{background:rgb(198, 12, 48)}.duet-toolbar-link.active.duet-theme-turva.negative{color:rgb(255, 255, 255);background:rgba(23, 28, 58, 0.2)}";
@@ -33,12 +33,12 @@ const DuetToolbarLink = class {
      */
     render() {
         const variation = this.variation === "negative" ? "negative" : "white";
-        return (index.h(index.Host, { key: '7f5f647cab17b662b98eefc40871e9bbb1ea60ed', role: "listitem" }, index.h("a", { key: '0e23a4045370b6706ed875e15b6ae161127ad4b9', class: {
+        return (index.h(index.Host, { key: '258aa71d94e0e3959eef224ab891ceb4db3886ad', role: "listitem" }, index.h("a", { key: 'e3557495157f9c6212582f47cf027f1f8389d7e9', 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 && (index.h("duet-icon", { key: '6945770c58a55dd974722d2966e26033f6417c6b', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), index.h("slot", { key: '00cb434641f8e9399f667b5c2e772fe93e3f087c' }))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", "aria-label": this.accessibleLabel }, this.icon && (index.h("duet-icon", { key: '28195a63fb2020c70155284152086fa6fd4be0a1', size: "x-small", name: this.icon, margin: "none", theme: this.theme, color: "currentColor" })), index.h("slot", { key: '85fdc84a09716bf992dbb7325b9677ed74fec706' }))));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -5,10 +5,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 
-const duetToolbarCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;width:100%}.duet-toolbar{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;background:rgb(255, 255, 255)}.duet-toolbar .container{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1384px;height:36px;margin:0 28px;border-bottom:1px solid rgb(225, 227, 230)}.duet-toolbar .list{display:flex;align-items:center;justify-content:space-between;height:100%;list-style-type:none}.duet-toolbar ::slotted(*){display:flex;align-items:center;justify-content:center;height:100%}.duet-toolbar.negative{background:rgb(0, 119, 179)}.duet-toolbar.negative .container{border-bottom:0}.duet-toolbar.duet-theme-turva{background:rgb(255, 255, 255)}.duet-toolbar.duet-theme-turva .container{border-bottom:1px solid rgb(228, 228, 230)}.duet-toolbar.duet-theme-turva.negative{background:rgb(198, 12, 48)}.duet-toolbar.duet-theme-turva.negative .container{border-bottom:0}";
+const duetToolbarCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;width:100%}.duet-toolbar{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;background:rgb(255, 255, 255)}.duet-toolbar .container{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1384px;height:36px;margin:0 28px;border-bottom:1px solid rgb(225, 227, 230)}.duet-toolbar .list{display:flex;align-items:center;justify-content:space-between;height:100%;list-style-type:none}.duet-toolbar ::slotted(*){display:flex;align-items:center;justify-content:center;height:100%}.duet-toolbar.primary{background:rgb(0, 119, 179)}.duet-toolbar.primary .container{border-bottom:0}.duet-toolbar.secondary{background:rgb(8, 42, 77)}.duet-toolbar.secondary .container{border-bottom:0}.duet-toolbar.duet-theme-turva{background:rgb(255, 255, 255)}.duet-toolbar.duet-theme-turva .container{border-bottom:1px solid rgb(228, 228, 230)}.duet-toolbar.duet-theme-turva.primary{background:rgb(198, 12, 48)}.duet-toolbar.duet-theme-turva.primary .container{border-bottom:0}";
 const DuetToolbarStyle0 = duetToolbarCss;
 
 const DuetToolbar = class {
@@ -29,12 +29,18 @@ const DuetToolbar = class {
      * Always the last one in the class.
      */
     render() {
-        const variation = this.variation === "negative" ? "negative" : "default";
-        return (index.h(index.Host, { key: '7600688d2b7f3cf63474d71705af2630a04c9a5a' }, index.h("nav", { key: '9673ecc614b00413b228099aa0ca4ceec4260f0a', class: {
+        const variation = this.variation === "primary" ||
+            this.variation === "negative" ||
+            (this.theme === "turva" && this.variation === "secondary")
+            ? "primary"
+            : this.variation === "secondary"
+                ? "secondary"
+                : "default";
+        return (index.h(index.Host, { key: 'eefe1ccb55e157002c987d984645204ef1180dbe' }, index.h("nav", { key: '62efd79c042a659c4bbee9f62a61d22218c4e79b', class: {
                 "duet-toolbar": true,
                 "duet-theme-turva": this.theme === "turva",
                 [variation]: true,
-            }, "aria-label": this.accessibleLabel }, index.h("div", { key: '60381599cb6eaedc773a667047a8893e96f3047b', class: "container" }, index.h("div", { key: 'c88cbc1def0dac05211916d6e8d9d0e4dd973abd', class: "list", role: "list" }, index.h("slot", { key: '4baa8024e241ff80607839bcb74a3b37cc00f82e', name: "left" })), index.h("div", { key: '89e025134ac6b299d17a839b128b1e9d4cebd0db', class: "list", role: "list" }, index.h("slot", { key: '382e9e3033e9c1034d10d72a8d441b1e249b93b4', name: "right" }))))));
+            }, "aria-label": this.accessibleLabel }, index.h("div", { key: '45c6853e0ddbbd7d4e108dcd1a953cb3ec56f0e8', class: "container" }, index.h("div", { key: 'a842d519cb078cba8b4aca675ff55d3b2320e303', class: "list", role: "list" }, index.h("slot", { key: '7d034eb78a40ca22aeb9a6450d0fb70d418d03d9', name: "left" })), index.h("div", { key: '94a6e0def0e7d556721247f576605dc2fa0ccf1f', class: "list", role: "list" }, index.h("slot", { key: '3c7c48e9959fa7fc27577c89723f72d022c0a663', name: "right" }))))));
     }
     get element() { return index.getElement(this); }
 };

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

@@ -5,10 +5,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-0c9fd2f8.js');
+const index = require('./index-9e6f7e53.js');
 const themeableComponent = require('./themeable-component-996b489c.js');
 const keyboardUtils = require('./keyboard-utils-681e11ec.js');
-const focusUtils = require('./focus-utils-b8926034.js');
+const focusUtils = require('./focus-utils-8bf2f9fe.js');
 const teleport = require('./teleport-c6f8391a.js');
 
 const duetTooltipButtonCss = "*,*::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}.duet-tooltip-button{z-index:100;display:inline-block;align-items:center;justify-content:center;min-width:48px;height:48px;padding:0 !important;margin-right:-12px;line-height:normal !important;color:rgb(0, 119, 179);white-space:nowrap;cursor:pointer;background:transparent !important;border-radius:4px}.duet-tooltip-button.duet-theme-turva{color:rgb(198, 12, 48)}.duet-tooltip-button:hover{color:rgb(0, 77, 128)}.duet-tooltip-button:hover.duet-theme-turva{color:rgb(148, 9, 37)}.duet-tooltip-button:focus{background:transparent !important;outline:0}:host(.user-is-tabbing) .duet-tooltip-button:focus{background:transparent !important;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3 !important}:host(.user-is-tabbing) .duet-tooltip-button.duet-theme-turva:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a !important}.duet-tooltip-button svg{width:20px;height:20px;pointer-events:none}.duet-tooltip-button-has-label{margin-right:0}.duet-tooltip-label{position:relative;z-index:100;display:inline-block;max-width:calc(100% - 30px);margin-left:12px !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;line-height:1.25;text-align:left;white-space:normal;vertical-align:top}.duet-theme-turva .duet-tooltip-label{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"}";
@@ -45,11 +45,11 @@ const DuetTooltipButton = class {
      * Always the last one in the class.
      */
     render() {
-        return (index.h(index.Host, { key: '409d3704a983f806173cea73c03d981054e3c6de' }, index.h("button", { key: '426df6b2d139b2fc0bebcdafb1e8ab3d1633bd92', ref: el => (this.buttonElement = el), "aria-controls": this.tooltipId, "aria-expanded": this.active ? "true" : "false", type: "button", class: {
+        return (index.h(index.Host, { key: '4be97c3001005d18be45efe72c3b80bab321580f' }, index.h("button", { key: '610f35f05d9c3caac636aa3d32dfda78df0a41be', 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",
-            } }, index.h("svg", { key: 'b7b5ed8d8cb3979f81938d3261c7049816e82062', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '6b3d544f0f09ee64b358e6a8e9f1cc7a0dcdd8c9', 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" }), index.h("circle", { key: '1578bebdcebb5186e29c5f026a825616199dd007', cx: "11.625", cy: "7.125", r: "1.125" }), index.h("path", { key: '7c8e34396e670e46b2640a507e24653fbf3485db', 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 ? (index.h("span", { class: "duet-tooltip-label" }, this.label)) : (index.h("duet-visually-hidden", null, this.accessibleLabel)))));
+            } }, index.h("svg", { key: 'c8c4071751aaed98f301674b9dd26d5e1ed67033', "aria-hidden": "true", role: "img", fill: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: 'beb7762d011e678668b723c8c362ad6fe09a7e71', 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" }), index.h("circle", { key: '2e18209c0945b8bbed7132d7c58e6987d195f936', cx: "11.625", cy: "7.125", r: "1.125" }), index.h("path", { key: '0d2299a6de3f42d32be3268c9efeca24fea9f7b4', 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 ? (index.h("span", { class: "duet-tooltip-label" }, this.label)) : (index.h("duet-visually-hidden", null, this.accessibleLabel)))));
     }
     get element() { return index.getElement(this); }
 };
@@ -100,11 +100,11 @@ const DuetTooltipPopup = class {
         this.contentEl.focus();
     }
     render() {
-        return (index.h(index.Host, { key: '0505ed0cbdfc2184bce129841b824d49f8001687' }, index.h("div", { key: 'fb29acd88d0b6f76e85fa8f86323c689e76a92bc', class: {
+        return (index.h(index.Host, { key: '5937d404a3288b6afe2b9c8e1d47147e96eef933' }, index.h("div", { key: 'bc2694a70963dabcaddce627d1abfe51dc36ebac', class: {
                 "duet-tooltip": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-tooltip-active": this.active === true,
-            } }, index.h(focusUtils.FocusGuard, { key: '8c7134490cd4755b81c13f3315253046859c06b8', moveFocusTo: this.buttonEl }), index.h("div", { key: 'b7029cf387be46aa709fe235e3423a96e9708373', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, index.h("slot", { key: 'ee542792786783f96d8c642effad47b783d75795' })), index.h("div", { key: '025ac152bd807712198087beefd28ed6367ba4e9', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, index.h("div", { key: '6a7cf9e5e0e8041bb85296ccba14590e4ae160e5', class: { "arrow-container": true, [this.placement]: true } })), index.h("button", { key: '32c2c7ea24b5fb24aff18e59e3e22068dd7cd275', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, index.h("duet-icon", { key: '20f6fcf5664b69ed51d6e181db1b0cc579e4b18f', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), index.h("duet-visually-hidden", { key: '503b472571ac81e165ae397c126a7596764d8316' }, this.accessibleCloseLabel)), index.h(focusUtils.FocusGuard, { key: '3f291c5fcf7128f5f4ed13a0f870018f8f2e66e7', moveFocusTo: this.contentEl }))));
+            } }, index.h(focusUtils.FocusGuard, { key: '461ee4e709c80fae34d04f2bba0fd60e6305f594', moveFocusTo: this.buttonEl }), index.h("div", { key: '47e8f609387722060e93fc37558a219c2bad2ed6', ref: element => (this.contentEl = element), class: "duet-tooltip-content-area", tabindex: 0, id: this.tooltipId }, index.h("slot", { key: '64350c3d73d2560711890254d8be979f07c27f1b' })), index.h("div", { key: '0544215577fd0b4e6be97eadcbad8f58114ffb38', ref: element => (this.arrowEl = element), class: { arrow: true, [this.placement]: true }, style: this.arrowStyles }, index.h("div", { key: '1076a224b4a4f9d455271245e7bd879689a96bf4', class: { "arrow-container": true, [this.placement]: true } })), index.h("button", { key: 'bf275bd1c1597e42ab29ce57338a37e8ff534bfc', type: "button", class: "duet-tooltip-close", onClick: this.handleCloseClick, ref: el => (this.buttonEl = el) }, index.h("duet-icon", { key: 'e06529abd6465f5e65f57f85ba2392c1df82d59f', name: "navigation-close-small", margin: "none", color: "currentColor", size: "xxx-small" }), index.h("duet-visually-hidden", { key: '43cabf152e52e237b886642e66a30875973fac6f' }, this.accessibleCloseLabel)), index.h(focusUtils.FocusGuard, { key: '47ef9a81ce996efe8d52d06f36799c5a4f3b26cc', moveFocusTo: this.contentEl }))));
     }
     get element() { return index.getElement(this); }
 };