@duetds/components 9.5.2 → 9.7.0

package/lib/collection/components/duet-select/duet-select.js

@@ -194,7 +194,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectVariation": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectVariation"
                         }
                     }
@@ -544,7 +544,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectItems": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectItems"
                         }
                     }
@@ -753,7 +753,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectEvent": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectEvent"
                         }
                     }
@@ -774,7 +774,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectEvent": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectEvent"
                         }
                     }
@@ -795,7 +795,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectEvent": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectEvent"
                         }
                     }

package/lib/collection/components/duet-shaped-image/duet-shaped-image.js

@@ -25,9 +25,9 @@ export class DuetShapedImage {
         const style = {
             "--rotation": `${this.rotation}deg`,
         };
-        return (h(Host, { key: '2261e3fd3e60d1ea8591219a9e64b3137fc93969', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, h("span", { key: '1c4204740ad1cfd299e96b484c602189f189e137', class: {
+        return (h(Host, { key: '1014997f5cd5d7115313762e6ba18827e1a10f15', class: { "duet-theme-turva": this.theme === "turva", "duet-m-0": this.margin === "none" } }, h("span", { key: '46afc61323d3dd569cd651a4720693cab08addfc', class: {
                 "shaped-image": true,
-            }, role: "img", "aria-label": this.accessibleLabel, style: style }, h("span", { key: 'e313b068532ce26450e93a3b68bfe7190f6dd4fc', class: "shaped-image-mask", role: "presentation" }, h("span", { key: '01ffb3799bf6211c8b11bfd62a42b1c080bf1a74', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
+            }, role: "img", "aria-label": this.accessibleLabel, style: style }, h("span", { key: '3f2dd1fff15551bc6477b2d837d6174777f3497a', class: "shaped-image-mask", role: "presentation" }, h("span", { key: '77941a17559185e4068b39b3f72cce8d3059de99', class: "shaped-image-img", role: "presentation", style: { backgroundImage: `url("${this.src}")` } })))));
     }
     static get is() { return "duet-shaped-image"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-show-more/duet-show-more.js

@@ -90,12 +90,12 @@ export class DuetShowMore {
      * Always the last one of the class.
      */
     render() {
-        return (h(Host, { key: '342980885abd34eaaed8c7a94d2c8814af8ac7b1' }, h("div", { key: 'ad3d469d25dc5073ab2e585f075e4a6d239da446', class: {
+        return (h(Host, { key: '27f636be53efea5d69dd3bc537087167b463b8e2' }, h("div", { key: '4faa618e7991c20efcea923a14a462625bc9c7a1', class: {
                 "duet-show-more": true,
                 "duet-theme-turva": this.theme === "turva",
                 "duet-m-0": this.margin === "none",
                 open: this.open,
-            } }, h("div", { key: 'e11ff42b395ce60a533b3d293e95d0b9d28985b1', ref: ref => (this.contentElement = ref), class: { content: true }, id: this.contentId, tabindex: this.open ? "0" : "" }, h("div", { key: 'ce456a7014e3c0d41542315a58952db9a67958ca', class: { "slotted-content": true } }, h("slot", { key: '1359b929236258f2f46becc67c2ef0212d720aab' }))), h("duet-button", { key: '89258a40cc1e2a2332a2f76bec76ff7478f5d48a', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.open, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, h("span", { key: '3fdb11c208b0ef335f23e4f8f5d0076add4d3cbb' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
+            } }, h("div", { key: '7b411cbfaac4891d278a40bcc55ea191699c59c4', ref: ref => (this.contentElement = ref), class: { content: true }, id: this.contentId, tabindex: this.open ? "0" : "" }, h("div", { key: '56a5a7a895ad551d195b2460853ffed16074d6d4', class: { "slotted-content": true } }, h("slot", { key: '77d2f9c3a4bd70b70955833703783aeb378adc84' }))), h("duet-button", { key: '090cffb717634d720c36011499331772b94ef4f3', id: this.buttonId, variation: "plain", "accessible-label": this.buttonAriaOpen ? this.showLessAccessibleLabel : this.showMoreAccessibleLabel, "accessible-expanded": this.buttonAriaOpen ? "true" : "false", "accessible-controls": this.contentId, accessiblePressed: this.open, onClick: this.handleClick, onKeyDown: this.handleKeyDown, "icon-right": true, icon: this.open ? "action-arrow-up-small" : "action-arrow-down-small", "icon-size": "medium-small", size: "small", margin: this.buttonMargin, padding: this.buttonPadding, theme: this.theme === "turva" ? "turva" : "default" }, h("span", { key: '7e21c6b742df95374d04e6b8345115fbd5e38189' }, this.open ? this.showLessLabel : this.showMoreLabel)))));
     }
     static get is() { return "duet-show-more"; }
     static get encapsulation() { return "shadow"; }
@@ -467,7 +467,7 @@ export class DuetShowMore {
                     "references": {
                         "DuetShowMoreToggleEvent": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-show-more/duet-show-more.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-show-more/duet-show-more.tsx",
                             "id": "src/components/duet-show-more/duet-show-more.tsx::DuetShowMoreToggleEvent"
                         }
                     }

package/lib/collection/components/duet-slideout/duet-slideout.js

@@ -260,16 +260,16 @@ export class DuetSlideout {
         };
         const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
         const exitTranslation = getLocaleString(this.exitLangObject);
-        return (h(Host, { key: '4adf7d99cbc333b181e8fd4866d08855eb6a6d1c' }, h("div", { key: '78f45ec446655208a7bf17cfe3be6a4aebc5c181', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && h("duet-overlay", { key: '278b3a9e1823ab3650f7fc705d3d7d41a676b70f', visible: this.open, "display-device": "large", zIndex: "600" }), h("div", { key: 'c5fd8e77aa37a4e5106dafcc83a4b07098fc5695', 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: 'dcefec6bb011072769a403f67849797e5fa8f3ae' }, h("div", { key: 'd498c18cb535e4750ce2b9af9d19a7e2197c8a0a', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, this.modal && h("duet-overlay", { key: '032de240d334b8653caab29e94d72abafa1807fc', visible: this.open, "display-device": "large", zIndex: "600" }), h("div", { key: '48ed352b83ed43e36bc3689f5606500b549fd871', 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: '3d629c66c8376aec3febe6c9c0818b8a45df56a2', moveFocusTo: this.closeButton }), h("div", { key: '7792e9afa44d5ff99e1350e99f0ec4cf0a570067', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'b1849e638fe366a073e2d247695ed828259f385a', class: "top" }, h("button", { key: 'cfd4aaf534427596f9fe01415e42bf355608798a', 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: 'b434b224c99a059a8ac6f764eaa6a37a8aefd142', moveFocusTo: this.closeButton }), h("div", { key: 'be5f535c7ed0347040bedca4a4b4834666d6c327', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'f74dce46123f8bb14f06a5a69bea2de111f53a69', class: "top" }, h("button", { key: '1054e241cbd47253774aeb9fa51631ae94688592', 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: '410f3f0ce0f8e66791f998f3fb9169ddcd6723c7', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '6341b9c23dd91454d7e8bb38201578a02906cb15', class: "sticky-header" }, h("slot", { key: 'a9128943f3767198b7b3602dd242ab35ee7fc104', name: "sticky-header" }))), h("div", { key: '53aa0fd6b0097f061b2d5767b8a0b4a360a78040', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
+            }, onClick: this.onClick, inert: this.openPanel }, h("duet-icon", { key: '41709242489fff542f2db4560557795af2620408', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'fa2eeb005c1d625af0c792b735128a22fb33169c', class: "sticky-header" }, h("slot", { key: 'c2754ffd21e986a6038fb5cac5fd50f8823cf933', name: "sticky-header" }))), h("div", { key: '5a42ff8d5bc2a3e3749460bc71b6792530295993', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
                 items: true,
-            } }, h("slot", { key: 'd0bb2bfede05aae54cd56e487fb7a69b124b84ce' })), h(FocusGuard, { key: '73d243e3a801c30a7706edac7d87a78a7750a4f1', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: 'ef27791ecc42176dffccc3b5aa9bab77a736d4fb' })), h(FocusGuard, { key: '94f2649dff2bcebaa1b716aa4bd15e472d1730e8', moveFocusTo: this.closeButton })))));
     }
     static get is() { return "duet-slideout"; }
     static get encapsulation() { return "shadow"; }
@@ -491,7 +491,7 @@ export class DuetSlideout {
                     "references": {
                         "DuetSlideoutEventDetails": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-slideout/duet-slideout.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-slideout/duet-slideout.tsx",
                             "id": "src/components/duet-slideout/duet-slideout.tsx::DuetSlideoutEventDetails"
                         }
                     }

package/lib/collection/components/duet-slideout-lang/duet-slideout-lang.js

@@ -35,7 +35,7 @@ export class DuetSlideoutLang {
      */
     render() {
         const langTranslation = getLocaleString(this.chooseLangObject);
-        return (h(Host, { key: '00c9777c6d216869e7a3c1dcc5dae6e4503bfa25' }, h("div", { key: 'a39f00f60a7a25189b6564165aafcf0e1d480824', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, h("duet-icon", { key: '6a895b8e8e7c4dbdf541a16a01566fabb3150c9d', name: "navigation-language", margin: "none", color: "secondary" }), h("slot", { key: 'dd216d56b29a88616d01acd917af1e8f7d21e31d' }))));
+        return (h(Host, { key: '26940a9efe3228ad051940cfb903980d683cf614' }, h("div", { key: 'a031d990d2bf459e73678e682d1952e7225a67e7', class: "duet-slideout-lang", role: "group", "aria-label": langTranslation }, h("duet-icon", { key: '7ff54cdd19c444cb9d8c8a67b5e563df53f13e0b', name: "navigation-language", margin: "none", color: "secondary" }), h("slot", { key: '2c0a83341839a6953c176fd68882dbd05151948a' }))));
     }
     static get is() { return "duet-slideout-lang"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-slideout-link/duet-slideout-link.js

@@ -42,12 +42,12 @@ export class DuetSlideoutLink {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'e550af12584f602566859a45b7cbee36a7aae43e' }, h("a", { key: '414c6a6a1fb91c95f3d241b0a9c90b13bb4c0793', target: !this.href ? null : this.external ? "_blank" : "_self", class: {
+        return (h(Host, { key: 'e58e7e022f359b763fff57c4794d9581204ae9f1' }, h("a", { key: 'b02485b104f43923bb51c25449ad782669da2a3f', target: !this.href ? null : this.external ? "_blank" : "_self", class: {
                 "duet-slideout-link": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.active,
                 [this.size]: true,
-            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": (this.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (h("duet-icon", { key: 'd8c1ebd401cd5e022ac9e4a1204133a336d3a2b7', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), h("div", { key: '473fe104cec5068f8f4bd4d5ee4e928de4bc268a', class: "label" }, h("span", { key: '425d0d0252417d78b704a7f294577110048729bc' }, h("span", { key: 'ba72671d83eee86369e9408738a00a44331bbf95', class: "label-container" }, h("span", { key: '907ae07b430dd127c8fb7931d3432b4e84d2b885', class: "label-content" }, h("slot", { key: '3ed0ebaace8750688a19520a5e7f5d1606a6dc00' })), this.external && (h("duet-icon", { key: 'f872b62d2c5757e7a0d059092cc143f4cb683abe', class: "external-icon", theme: this.theme, name: newWindowIcon.title, margin: "none", size: "auto", color: "currentColor" }))), h("slot", { key: '19c6036aa3e972f49c02e5c66f7c5856601da94e', name: "description" })), this.caret && (h("duet-icon", { key: '1f649b48aff0af010198404d37f1df359fa5a043', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
+            }, href: this.href, "aria-current": this.active ? "true" : "false", lang: this.targetLanguage, hreflang: this.targetLanguage, "aria-label": (this.href && getAccessibleLinkLabel(this)) || this.accessibleLabel, rel: this.external ? "noopener" : undefined }, this.icon && (h("duet-icon", { key: 'f2a699889f3e342915733dc322f5607d4dc1b381', name: this.icon, color: "secondary", size: this.menuItem ? "x-small" : "medium", margin: "none" })), h("div", { key: '67777983021ac91e35b68e9b8bdb6f0b56279107', class: "label" }, h("span", { key: 'd0ac662968dec767e9a095843f32f7dcea698190' }, h("span", { key: '1e75583ea91cbe3bf1ff4720f9b2d9efc96be742', class: "label-container" }, h("span", { key: 'c8be5ead58f8ae2669a818f2d552c91d2f95804f', class: "label-content" }, h("slot", { key: 'fd51bd2d2971917a7259abc816268bfa38cb439d' })), this.external && (h("duet-icon", { key: '7ef7af0a841d9241becd86c1364c89f6cae59c6a', class: "external-icon", theme: this.theme, name: newWindowIcon.title, margin: "none", size: "auto", color: "currentColor" }))), h("slot", { key: 'fb1da47dfd02a661c7286b0c523a8c3ac5f83cf1', name: "description" })), this.caret && (h("duet-icon", { key: 'c4f51f17072cd66112993ed45421a5a8ccb59058', name: "action-arrow-right", color: "secondary", size: "x-small", margin: "none" }))))));
     }
     static get is() { return "duet-slideout-link"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-slideout-panel/duet-slideout-panel.js

@@ -159,23 +159,23 @@ export class DuetSlideoutPanel {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (h(Host, { key: 'a710fcd33474df65bbe83049ae28e187effd69ae' }, h("div", { key: 'fe869129deed68044a9f2481c205d080cd330b2a', class: {
+        return (h(Host, { key: '2b36b05ce039386747c09abf0e5323c48b5e0488' }, h("div", { key: 'd58f2b9732c3ab38b13bd4f0439efe9012b9d515', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: '8a24f464c102b7c76c02b5acca1cb2e908555178', 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: '529140519e744fd8e36ff8afea01ca18938414b0', 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: '664e55c2ca66476e87fa06a4eae62611e36e43b7', class: "duet-slideout-icon" }, h("duet-icon", { key: 'de6f7888ca1f7a98f68295cdab35aa37951ad364', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && h("div", { key: 'e3dc40373f694ff41a804d29a9e323a95aafc443', class: "duet-slideout-badge" }))), h("span", { key: '430e44ec6d63d207f7d0c5daccb6c0ec3855331b', class: "label" }, h("span", { key: '54f5dd510db6b7b2210b6dfefb6b45c6c5d5291c', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: 'e5c11e4b9011bf989df3035c09d760d536a81ab2', name: "label" })), h("duet-icon", { key: '75ca92a7f5340d296f7672f24f349b02bb44c035', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: '656e51077667f5439a4d15b62570e34367d012cb', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && (h("div", { key: '4f8d0249d6221a523a3a0b3836933b432829d8c8', class: "duet-slideout-icon" }, h("duet-icon", { key: '230b927f9771d593709e791c14618db90d7aa895', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && h("div", { key: '33617258b158f4f59b6e9655b058a84a3ee47af1', class: "duet-slideout-badge" }))), h("span", { key: '7da950982ae9adb1e9d37515b3e271e506836d41', class: "label" }, h("span", { key: '6046719acd63d608ed7a2a47452f5dba66c99d8b', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: '4d7b76d2d25171390101ef25f431af7c8ef1a008', name: "label" })), h("duet-icon", { key: 'd9c3ae0d685375bc29e8901f2c41bf8e2028a1db', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: '4e5a633d2f18f22bcf2cb69252f8f497def373fe', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, h(FocusGuard, { key: 'b77848293b232403fdd8ad8a60b113a91ddbc721', moveFocusTo: this.closeButton }), h("div", { key: '80d042265606b8ecdbf2c26379a9c8f9a8659cbc', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '8afeafcbef97a3f50614baa1e070a5a52ab7a8ae', class: "top" }, h("button", { key: '43aa773b6c0590cfec9b967e56a10e29cb3ec384', 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: '9f810bf575701688ab08f60726de6da69bc12635', moveFocusTo: this.closeButton }), h("div", { key: '13828354ebc908614edfa649b633c78b5ca040d0', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'd3a965830f5cb2f31d767b925c9f35470dab844d', class: "top" }, h("button", { key: 'c07c0504cb16358d05e42cce8554b99f034d07b9', 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: 'aa92eb201a646609e6b07cfc5784a7b45b4edd88', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: '87e20bf173b45a95f21ae12b7ccda422f23bb65c' }, this.label.innerHTML), h("button", { key: '956cac2cdd217b51c1a95b6dac24eb752c1b3e8a', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: '83df0e158d36a13e6aea98a1d2d0473c039305c2', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'ddf1937be4406b7f411cb78b676e9a7dc0ada529', class: "sticky-header" }, h("slot", { key: '66a7f892da69baf18f0c371c0ecfd9a21d9d2f08', name: "sticky-header" }))), h("div", { key: '2eeb327bce4ea692cef4c5b9c8742f0bf7f19e47', tabindex: "-1", role: "menu",
+            }, onClick: this.onClick }, h("duet-icon", { key: '521c0a3724fe426035c1c941752d1498e41034be', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: 'e9727f3f182d3bbfd2aa5f65d3f750b0e1da6131' }, this.label.innerHTML), h("button", { key: '6132ffcdc5f194d857698b0a8e4bb6b725113af2', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: '2aa67d1f3468592b7886bafa0b168db8a8156b9b', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'bc7eec6649885a979ed139c6742de251672a9821', class: "sticky-header" }, h("slot", { key: 'b9983428eb3d8232c5d68154a8bb200cd4cc7e2a', name: "sticky-header" }))), h("div", { key: '20ea66396b8e7d802a44d36c7aa326294e7a95cb', tabindex: "-1", role: "menu",
             //TODO: slideout menu fades out, needs to be instant
             id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, h("slot", { key: '74cce3b2ebaffc2b345804e6fe417912db8e72e2' })), h(FocusGuard, { key: '259710cbfb6565bfc2f542d78513017882dc507d', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: '625703e33ae89586ed068b86912c37721035c645' })), h(FocusGuard, { key: 'e34b98e036503d08b5d653169fbff5bd8dea058f', moveFocusTo: this.closeButton })))));
     }
     static get is() { return "duet-slideout-panel"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-slideout-panel-dropdown/duet-slideout-panel-dropdown.js

@@ -40,16 +40,16 @@ export class DuetSlideoutPanelDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '4dd2ace190b42dc603842e0a68bede86a0576849' }, h("div", { key: '3bcae1d437eb66927c58c9d6394668f7e89b96c0', class: {
+        return (h(Host, { key: '35bf0d91a006cd0fb6a50012f5f48b8b84d5ecac' }, h("div", { key: 'aebfdab784d0a2921fc1f5b461b881c241ef5066', class: {
                 "duet-slideout-panel-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: '0dc6a0b34fe49504c0a3d50e2d3bc5b46f0edf47', 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: 'f3174e8f9f070b3c8cd4da9e6db8b695982f236b', 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: {
                 active: this.active,
-            }, onClick: this.onClick }, this.icon && h("duet-icon", { key: '0210db38d3f9ddcfb8d06635554d6d59a655fdf9', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: '4cd6d589071a450df12bad944193b1cb1ad884ce', class: "label" }, h("slot", { key: '9426c6a0c178440bb061f2beab412bc89aaab672', name: "label" }), h("duet-icon", { key: '1e1c91b9e194bc0e96b46659e469447ea8a189f2', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: '05ac5933fa4af767dd52ac778b7a95a9fdf30a1c', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, this.icon && h("duet-icon", { key: '02b31af38cf8ef821d9bd8b83ede34c900b58c41', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: '1244f292f215410cba0750e205392e5d5fcd9ab7', class: "label" }, h("slot", { key: 'a55379905e5ec24ec617910fccdba8f351494d11', name: "label" }), h("duet-icon", { key: 'c63d4943d43087e6ec52e7e54f8a4211daebeadd', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: '31e1e8a311b9ee173852bcbf3733cc846d7f87da', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: '5d9e9507bb4d8ec3ce3dcc4101b9a1ff432af55a' })))));
+            } }, h("slot", { key: 'b7365965b0950b899e494162007d51130444478d' })))));
     }
     static get is() { return "duet-slideout-panel-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-spacer/duet-spacer.js

@@ -13,7 +13,7 @@ export class DuetSpacer {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '37319380d158f854c7b73b9fc3360a521c6660a3', class: {
+        return (h(Host, { key: '8f58f01a032554c469822d7f0529e3a1a5f5bc72', class: {
                 "duet-spacer": true,
                 "duet-spacer-xx-small": this.breakpoint === "xx-small",
                 "duet-spacer-x-small": this.breakpoint === "x-small",
@@ -49,7 +49,7 @@ export class DuetSpacer {
                     "references": {
                         "DuetSpacerSize": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-spacer/duet-spacer.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-spacer/duet-spacer.tsx",
                             "id": "src/components/duet-spacer/duet-spacer.tsx::DuetSpacerSize"
                         }
                     }
@@ -101,7 +101,7 @@ export class DuetSpacer {
                     "references": {
                         "DuetSpacerBreakpoint": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-spacer/duet-spacer.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-spacer/duet-spacer.tsx",
                             "id": "src/components/duet-spacer/duet-spacer.tsx::DuetSpacerBreakpoint"
                         }
                     }

package/lib/collection/components/duet-spinner/duet-spinner.js

@@ -23,11 +23,11 @@ export class DuetSpinner {
      */
     render() {
         const color = this.color === "currentColor" ? "currentColor" : getColorByName(this.color);
-        return (h(Host, { key: 'def09b6729906cf4ce285aaae09c5d25232eccd3', class: {
+        return (h(Host, { key: 'dcb6140eeae0e31c85319ee668193865ba6a5e57', class: {
                 "duet-custom-color": this.color !== "currentColor" && this.theme !== "turva" && this.theme !== "default",
                 "duet-theme-turva": this.theme === "turva" && this.color !== "currentColor",
                 "duet-theme-default": this.theme === "default" && this.color !== "currentColor",
-            } }, h("div", { key: 'c288229cd2603d51ad54de0bab9017bfdc53ac73', class: {
+            } }, h("div", { key: 'd3d38db9f52dbd35af639463194130c6c265d24d', class: {
                 "duet-spinner": true,
                 [this.size]: true,
             }, style: { color }, "aria-label": this.accessibleLabel })));
@@ -100,7 +100,7 @@ export class DuetSpinner {
                     "references": {
                         "DuetSpinnerSize": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-spinner/duet-spinner.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-spinner/duet-spinner.tsx",
                             "id": "src/components/duet-spinner/duet-spinner.tsx::DuetSpinnerSize"
                         }
                     }

package/lib/collection/components/duet-status-icon/duet-status-icon.js

@@ -7,13 +7,13 @@ export class DuetStatusIcon {
     constructor() {
         this.bg = {
             default: {
-                default: "color_lt_blue_100",
+                default: "color_lt_blue_200",
                 success: "color_success_200",
                 warning: "color_warning_200",
-                danger: "color_danger_100",
+                danger: "color_danger_200",
             },
             strong: {
-                default: "color_lt_blue_600",
+                default: "color_lt_blue_700",
                 success: "color_success_700",
                 warning: "color_warning_500",
                 danger: "color_danger_600",
@@ -21,10 +21,10 @@ export class DuetStatusIcon {
         };
         this.color = {
             default: {
-                default: "color_lt_blue_700",
+                default: "color_lt_blue_800",
                 success: "color_success_800",
                 warning: "color_warning_800",
-                danger: "color_danger_700",
+                danger: "color_danger_800",
             },
             strong: {
                 default: "color_lt_blue_100",
@@ -70,10 +70,10 @@ export class DuetStatusIcon {
         }
     }
     render() {
-        return (h(Host, { key: '3f55d55c4c4a2b1d600dc40d12463f217add88b1', class: {
+        return (h(Host, { key: '62f4a599636b2d283b9f41c94c9b6a1425e2c1a4', class: {
                 [`duet-status-icon-${this.variation}`]: true,
                 "duet-strong-bg": this.strong,
-            } }, h("duet-icon", { key: 'e45fb67068cc9f4bfe66554808f1b47888bd86a8', icon: this.getIcon(), size: this.size, margin: this.margin })));
+            } }, h("duet-icon", { key: '8223a11f889eeb219bd27b1c70601904bca84ade', icon: this.getIcon(), size: this.size, margin: this.margin })));
     }
     static get is() { return "duet-status-icon"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-step/duet-step.js

@@ -210,7 +210,7 @@ export class DuetStep {
                     "references": {
                         "DuetStepState": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-step/duet-step.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-step/duet-step.tsx",
                             "id": "src/components/duet-step/duet-step.tsx::DuetStepState"
                         }
                     }
@@ -294,7 +294,7 @@ export class DuetStep {
                     "references": {
                         "DuetStepClickEvent": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-step/duet-step.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-step/duet-step.tsx",
                             "id": "src/components/duet-step/duet-step.tsx::DuetStepClickEvent"
                         }
                     }

package/lib/collection/components/duet-stepper/duet-stepper.js

@@ -88,7 +88,7 @@ export class DuetStepper {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '1610872b3116487ea00058e453cbc05beb944c0d', class: { "duet-m-0": this.margin === "none" } }, h("div", { key: 'a3c844eacac0fe68ba12bf98ae281b377e682c02', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, h("duet-visually-hidden", { key: 'cfb5cb389a4790fe4e65113e777c0773050fc8bc', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), h("slot", { key: '26d446f0b321cce787c514db98fe94d902382201' }))));
+        return (h(Host, { key: 'd8655560066e926969cdbfc73ec98098886dbd5d', class: { "duet-m-0": this.margin === "none" } }, h("div", { key: '664fc460cb80dc283a4569bd43466fea99d9611b', class: { "duet-stepper": true, "duet-theme-turva": this.theme === "turva" } }, h("duet-visually-hidden", { key: '023543f1d0738023d8841a6bd4755662d63fffcd', "aria-live": "polite", "aria-atomic": "true", "aria-relevant": "all" }, this.formatAnnouncement()), h("slot", { key: 'c7d59ff95b0a833472f364bace7b06b9c292545c' }))));
     }
     static get is() { return "duet-stepper"; }
     static get encapsulation() { return "shadow"; }
@@ -235,7 +235,7 @@ export class DuetStepper {
                     "references": {
                         "DuetStepChangeEvent": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-stepper/duet-stepper.tsx",
+                            "path": "/Users/kasimir/Documents/projects/duet-design-system/packages/components/src/components/duet-stepper/duet-stepper.tsx",
                             "id": "src/components/duet-stepper/duet-stepper.tsx::DuetStepChangeEvent"
                         }
                     }

package/lib/collection/components/duet-submenu-bar/duet-submenu-bar.js

@@ -122,19 +122,19 @@ export class DuetSubmenuBar {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'fec25f6c8b5983923f591d756decc5ae3404de5e' }, h("nav", { key: '6f812f5da82df3218d6de29f655d2596ed865a4d', class: {
+        return (h(Host, { key: '2720db892c55577581be1f5cff69e6b56d0eddb1' }, h("nav", { key: '6450c2d32c229ffc2cdefffaf4d0824c927f2dfe', class: {
                 "duet-submenu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 hidden: this.hidden,
-            }, "aria-label": this.accessibleLabel }, this.hasItems && (h("button", { key: '5e8ab90a4e09dbd7746b1405d3ea92615a439dd7', 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: 'fbf58c54a86a16f1c9c9b018800e74dc86ad7827', 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: '1f2ed95c73d93faf4ba71d7984e00488137250d1', class: "label" }, h("slot", { key: '5ca819d2a6f97bb4c9e75f2ea024187f76af67e2', name: "label" }), h("duet-icon", { key: '3b1a4bcac49bec29f344a38e5f743aaeb63f59a0', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), h("div", { key: '01e35b212a44a4bb39a8fd5cc5a694b94dcb1ccb', class: {
+            }, onClick: this.onClick }, h("span", { key: '95c4226bedf3122965ef044122688e824788fad4', class: "label" }, h("slot", { key: '93a3fb333e252ee09987a9832a782a86dd15e13c', name: "label" }), h("duet-icon", { key: '125465c2c40457117a28f562c60eb2b63ae061ad', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), h("div", { key: '4d23eea3732698f64ec388a4c65d29016c4b0b47', class: {
                 "menu-container": true,
                 hidden: !this.open,
-            }, role: "presentation" }, h("div", { key: '5f94254c66db242ce904ddfd963f6dbe7f4337b6', 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: 'cedb273340657fe22fdcbd234b632079ba8bae94', 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: 'be03e176ea88bf9b83e506a67470747a4f30b9ee', class: "list", role: this.mobile ? "presentation" : "list" }, h("slot", { key: '1ba101226680d98cffade2702cbe6f6c40432146' }), h("div", { key: 'c51c2e13e3f5a24edf28dba162ee0602666ca1f9', class: "list-padding" }))), h("duet-overlay", { key: '5b93e09b26a80acce10526710c818c0017d74627', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
+            }, ref: element => (this.itemsContainer = element) }, h("div", { key: 'c0c2a1cdea75e574b2a5136164422716db80e020', class: "list", role: this.mobile ? "presentation" : "list" }, h("slot", { key: '43c189da567108214e33bd29bd5ecadf396c3be4' }), h("div", { key: '4e7ee2bf92b8446dbee5ac9e81a6cf6c4e424950', class: "list-padding" }))), h("duet-overlay", { key: 'df603367a1254cd933205e844295693c5d40e7b5', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
     }
     static get is() { return "duet-submenu-bar"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-submenu-bar-dropdown/duet-submenu-bar-dropdown.js

@@ -96,18 +96,18 @@ export class DuetSubmenuBarDropdown {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'b3ceba0158daeda5a08cdbb24998e6a5621a3703', role: "listitem" }, h("div", { key: '7151474e27716eb431d4e91c40df63183b3a7aa3', class: {
+        return (h(Host, { key: '1eb547e5709ea63b23354ca9c59b1b19c038c102', role: "listitem" }, h("div", { key: '570a652c6c926ccebcb1a9541fd676558a2239a4', class: {
                 "duet-submenu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 open: this.open,
                 active: this.active,
-            } }, h("button", { key: '5c52390b4c51542e2f964c334678b69bbd579520', 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: 'cb6806df3c0914e15d8b5fdfa96cdaba6b36ad6d', 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: 'b54bb41ddf9a8743c91ca00b851f278ed01be2d3', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: '5e48f0afd254dc828b65347ed8b9503a258cf2fa', class: "label" }, h("span", { key: '11e104876c90fb056e2ec497e48a8ab634bcaf90', class: "label-text" }, h("slot", { key: 'a5eba5494cfa87a94cfa0f7a6b9614f5e84127e5', name: "label" })), h("duet-icon", { key: '954b21321b8f10dda0da3e8b049157bd6ac52b49', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: 'f2cbdcc7f153986c5d76351fb27070eb233cf68c', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: '3c866f7cb7ccf04b91b02bd01fa4a2e57462bc10', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'a5aa098f80c23566bb2c91b50ce002a36c18a0ba', class: "label" }, h("span", { key: 'dbc5f7743345200a326a2367107b0b1fa3245ded', class: "label-text" }, h("slot", { key: '5da6e5fcef0e333fe29fb08b72696251cb067436', name: "label" })), h("duet-icon", { key: '875a3ffcc5d12b13e2d52fc338373c160f77939a', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: '0d53fb12a29c3ef496d588e07565c47bf07c9fee', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: '4e14b8e2e6c20c4fa8e9e90b34047a6a790ff5e6' })))));
+            } }, h("slot", { key: 'aca1769900ed458bdfd1e8da0bd6cd516b0026db' })))));
     }
     static get is() { return "duet-submenu-bar-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-submenu-bar-dropdown-link/duet-submenu-bar-dropdown-link.js

@@ -31,12 +31,12 @@ export class DuetSubmenuBarDropdownLink {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: 'f80ee91cccb915e476e1f572f9656985c2028978' }, h("a", { key: '8a53200290262940ac11346d9d7526afed459893', class: {
+        return (h(Host, { key: '8e171bfdd3a97a208d76852cad10497303cc6a41' }, h("a", { key: '6ef3bedf1b242e3564a6a32b5e564e50c0ca6e08', 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: '006a4ba73b60083703dbcc084263b8a721c320d7', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("span", { key: '9450f9f49041afd67cd79bf8c9b3ea0094cef6ce', class: "label-container" }, h("span", { key: 'f0e0d4882fd97aeb7c33c29e68be8c4ee40302f8', class: "label" }, h("slot", { key: 'a72b1bcc2fcd65022d09fea90b1c7c957e54ffb5' })), this.caret && h("duet-icon", { key: '795f6f318bde5239cf79fa96a4a915e42032e5d1', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (h("duet-icon", { key: 'd79f93df8837c4e201869a960f8f7a53783b7852', 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: '696a5c14ddf44486ccd7ae685987d3ae73819eda', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("span", { key: '0066ac29350ba089295585f001dde093e303028b', class: "label-container" }, h("span", { key: '003bfe108d7aa853d32238e6b888587965e63710', class: "label" }, h("slot", { key: '82c97684842fa6839700732f1bc75ef2b7eeda68' })), this.caret && h("duet-icon", { key: 'e85bc1b85802155eb3044d8ab5c78d7e4e8a247b', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (h("duet-icon", { key: 'ba3841ab9bd427fb8b9b31fb1f9340b59afd2949', class: "active-check", name: "messaging-checked-small", size: "xx-small", margin: "none", color: "currentColor" })))));
     }
     static get is() { return "duet-submenu-bar-dropdown-link"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/components/duet-submenu-bar-item/duet-submenu-bar-item.js

@@ -57,7 +57,7 @@ export class DuetSubmenuBarItem {
     render() {
         const TagName = this.url ? "a" : "button";
         const role = this.url ? "link" : "button";
-        return (h(Host, { key: '4f756bb5d0c55701f39ebf12163f4cb3c012b82d', role: "listitem" }, h(TagName, { key: 'b56d439030bf2f1404182a33c1163053e95a197d', 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: '822cf51d5d913baf86769986bd55bef7d6a0883a', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'f7bae35be4b779f37353b53df8d0169ea73a1838', class: "label" }, h("span", { key: 'd6ad26e44b91ab1d3cf1e8fddb7ae97a40fa226b', class: "label-text" }, h("slot", { key: '6a69204d83f659345eb5ff39d1549f99b30a3bbc' })), (this.trailingIcon || this.external) && (h("duet-icon", { key: '8c47a9f36d1531a4f29b8da89d02174d663cbf24', class: {
+        return (h(Host, { key: 'fcd533d6b3dfc93e0e759de65ecb3454a157d32f', role: "listitem" }, h(TagName, { key: '0ca1f847b9660fe205bf77e5bbe78a9f7c8616df', 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: '3f0da6b4b7ef1b9b6630a170fd6175125c849dd4', class: "leading-icon", theme: this.theme, name: this.leadingIcon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'c8406d5e73d587f29c3b8c5b09f2522c70fd4ea8', class: "label" }, h("span", { key: '7d6a4ad4c5358a5c16d4986946df79dcc040633c', class: "label-text" }, h("slot", { key: '3e615ac54c970f4f3576c2dd2451d93f1bb06fd1' })), (this.trailingIcon || this.external) && (h("duet-icon", { key: 'ce7aa0ea2fc8cecc831ecf940a2aca520b420c93', class: {
                 "trailing-icon": !!this.trailingIcon,
                 "trailing-icon-arrow": this.trailingIcon === "action-arrow-down-small",
                 "external-icon": !!this.external,

package/lib/collection/components/duet-submenu-bar-link/duet-submenu-bar-link.js

@@ -29,7 +29,7 @@ export class DuetSubmenuBarLink {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '51e5c82b88f45b2a32b9007c1cba3c28bebb0f76', role: "listitem" }, h("a", { key: '777ef8ad98f32b4be821e576e7085b767e2c80ac', 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: 'eb80ccc57229a8a448d32e17695c7f573805f967', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("span", { key: '3dc063ad2c8b8fb92d1d292205dcf5ea82889b4f', class: "label" }, h("slot", { key: '2274f12f2198558e45a4b79c828c06cf9bb7f1c0' })))));
+        return (h(Host, { key: 'b569ba8e1407349d04924791421693d47d99c224', role: "listitem" }, h("a", { key: '632ba619dd762a3041bf7c17d2aa02d18d9c7033', 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: 'f69a20105e32823478e19579230083c4b08e97ac', class: "submenu-bar-link-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("span", { key: '53b5b5dc9e1f66785096f307bb980aa734cbb67c', class: "label" }, h("slot", { key: '937a94eda35d6fbb713f4a9b5073778ba6cb2e23' })))));
     }
     static get is() { return "duet-submenu-bar-link"; }
     static get encapsulation() { return "shadow"; }