@duetds/components 9.2.2 → 9.2.4

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

@@ -53,6 +53,7 @@ export class DuetSlideoutPanel {
         this.icon = undefined;
         this.labelSize = "medium";
         this.backgroundColor = "primary-lightest";
+        this.badge = false;
     }
     /**
      * Component lifecycle events.
@@ -158,21 +159,23 @@ export class DuetSlideoutPanel {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (h(Host, { key: '85cf2add8e070d2f95b325f17fd3888ef083b452' }, h("div", { key: '669f9374c0582745503772912e8994f0d80fab7f', class: {
+        return (h(Host, { key: '10b414a1d813be3e7f5ef8070b2c1d984c25ac44' }, h("div", { key: '50ee38592ea290018fefaf87e3c8625579636ed9', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: '05bc5386920089fbd1989e0c264164bf75cc0d90', 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: '4222c80ec11e0f6acb4eeaebf216968e42537c70', 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("duet-icon", { key: '5ae33e802c26d6855b0188566c471d9e14455ea2', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: 'cc0e3bafc2edf37d33ae03f04e6e35dd7bc6a8bf', class: "label" }, h("span", { key: '5d485ef3892c579a2b356d050f63e70d55c59a81', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: '66e9cf07933f415e19ef15cec9fefde9bfbeaa79', name: "label" })), h("duet-icon", { key: '230b0a6b97baf7820f59d6b9eecd371b554b1a80', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: '6c62b1fedab912d257de8b8921c5cf1e05bc1f3e', ref: element => (this.dialog = element), class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && (h("div", { key: 'ef87af453a36ae15d81ed98b882798092522610c', class: "duet-slideout-icon" }, h("duet-icon", { key: '540a8e1f36285104c675438d0a053ce5a8aeaa38', name: this.icon, size: "medium", margin: "none", color: "secondary" }), this.badge && h("div", { key: 'a90b2189e9b0fe8325b12db27faa55955a5aaa0b', class: "duet-slideout-badge" }))), h("span", { key: '9f266762f46f74d6c627098e57315df106bf9dfe', class: "label" }, h("span", { key: '60a41c1094f9ba9b51cd6e29666af8f601b8a8d2', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: '4160b184173ed8e9e3e93cee11cb8b797911c350', name: "label" })), h("duet-icon", { key: '1572389c79f37ff516d2462ec7dfc9e6e740c6c8', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: 'fc738196e7f3d69ca2cc01db8fcbf5a7be3c39f1', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, h(FocusGuard, { key: 'de5845c8cda4523a2fb34b3f0e1b24176fffb23e', moveFocusTo: this.closeButton }), h("div", { key: '3348199d135e2886b2324e28b5d1cf0b8b5f1ae8', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '379ee13d14ee14ebe08bdc16ead2f4c6b1b44224', class: "top" }, h("button", { key: '8bfc0961203fe8b7529257f3c22f0ea36629fa8c', 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: '00a3795728a3374280aaa5f2b6b97f67bac388c6', moveFocusTo: this.closeButton }), h("div", { key: '84e8cf7f05aedd1fd6df3f08cd06b66abbd1ef17', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'a462d45d835fe35e6ce1e64e9527aeae033c192f', class: "top" }, h("button", { key: '5b4eb5d8985437d6701987273dbe10d55185c0cf', 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: '88da885f77d6a1bf04a94688f62051fe8919d3d2', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: 'eeae988e8f287320ce366a80beb333415bc5342b' }, this.label.innerHTML), h("button", { key: '7533c4fdc5b5c59ec06579ad0656d44505a51c55', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: 'e1520bf9ec14b782f25b13a6c139a0bf260dc961', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'f7ffaa74e560bdda5d8f9364b65fc1960b7b5a94', class: "sticky-header" }, h("slot", { key: 'ea473e76641c6705cd2dca5afb3f84f7b9217cc8', name: "sticky-header" }))), h("div", { key: 'c3c70db81e357383a4629d095c082c024bbc6e0e', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, h("duet-icon", { key: 'b17a49853ca91e459db693d0c1dcbe861f9ee663', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: '033f64eb9236b0a1cc28214b0393f3c7e62d62f2' }, this.label.innerHTML), h("button", { key: '005c6e62887ae4effd15bc19266a4b72d45f11bc', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: '0934dfbccb73be3827e684b1414f2a76c080b0fb', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '984c15369f3cd4a09dfd02efe5aa65effb2f453c', class: "sticky-header" }, h("slot", { key: '28aea810fee655e0039f9412a5a0e979d4e0991e', name: "sticky-header" }))), h("div", { key: 'd0fed891a8cd1320d5edd35d4461d1df9f1bec7d', tabindex: "-1", role: "menu",
+            //TODO: slideout menu fades out, needs to be instant
+            id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, h("slot", { key: '0bf5ecbaad2132d5d2da8be4d74a9b2653414fdd' })), h(FocusGuard, { key: 'f70457896fa82645d77260ef4762c9cb4a775d86', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: '859c0b8b029620561483192901482f2d7ac69fd8' })), h(FocusGuard, { key: '5676e24c74f3223c83eaa6cf67d05cc93c8ea339', moveFocusTo: this.closeButton })))));
     }
     static get is() { return "duet-slideout-panel"; }
     static get encapsulation() { return "shadow"; }
@@ -208,6 +211,8 @@ export class DuetSlideoutPanel {
                     "tags": [],
                     "text": "Theme."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "theme",
                 "reflect": false,
                 "defaultValue": "\"\""
@@ -226,6 +231,8 @@ export class DuetSlideoutPanel {
                     "tags": [],
                     "text": "Active"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "active",
                 "reflect": true,
                 "defaultValue": "false"
@@ -244,6 +251,8 @@ export class DuetSlideoutPanel {
                     "tags": [],
                     "text": "Open"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "open",
                 "reflect": true,
                 "defaultValue": "false"
@@ -262,6 +271,8 @@ export class DuetSlideoutPanel {
                     "tags": [],
                     "text": "Icon"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "icon",
                 "reflect": true,
                 "defaultValue": "undefined"
@@ -280,6 +291,8 @@ export class DuetSlideoutPanel {
                     "tags": [],
                     "text": "Size. Small, medium or large."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "label-size",
                 "reflect": true,
                 "defaultValue": "\"medium\""
@@ -304,9 +317,31 @@ export class DuetSlideoutPanel {
                     "tags": [],
                     "text": "Background color. Use one of the color tokens."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "background-color",
                 "reflect": true,
                 "defaultValue": "\"primary-lightest\""
+            },
+            "badge": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Show a badge that indicates something has changed."
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "badge",
+                "reflect": false,
+                "defaultValue": "false"
             }
         };
     }

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: '928a234e72a6cbc3d987453b0536284beb302544' }, h("div", { key: '6381d9b535e0aae5f1ffcd4598d7ef5549414629', class: {
+        return (h(Host, { key: '79b5b5d923940bc3b0ab0515ccab7d498b327d5e' }, h("div", { key: 'b66ac749e1950d6c70c1c465479604cd91c03cfd', class: {
                 "duet-slideout-panel-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: 'a16624ab904bb50b789dfd427d697eb2aee6cf6a', 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: '7155b74267a0786267237b0170e30a4c20d8d180', 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: 'e8adbb28483423f4361812416579bf6745a76bc4', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: '6ab66a503a7592d00d08ade39b35540fef97f4a8', class: "label" }, h("slot", { key: '9feeacf271ad1b3a3110ef847e2c4054f6c137cf', name: "label" }), h("duet-icon", { key: 'dc0fe5de62591c574d56a1a315523584833a29d2', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: 'ffa8f24645466213c7a8ee05928e09229d602102', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, this.icon && h("duet-icon", { key: '014c5790e8eb52f02d10ecf398271b233b88f7b0', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: 'be3875ea25d4f094220b3599aa15bf7e014e81bd', class: "label" }, h("slot", { key: '36b0112f4b2aa6ed192c19da3397beca24b8b29c', name: "label" }), h("duet-icon", { key: '2d4c1df9d41e97d1c7bb031252d31baa865a587c', class: "caret", name: "action-arrow-down-small", margin: "none", size: "xx-small", color: "secondary" }))), h("div", { key: 'a9729a27afa76ccee3c7d3b14e7d48dab1dcb7a3', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: 'a719e7e86838333ea006a8c7d3e76b431d8c47fa' })))));
+            } }, h("slot", { key: '63761e3a8bbea310fbc531dd63eae808be5cf3e4' })))));
     }
     static get is() { return "duet-slideout-panel-dropdown"; }
     static get encapsulation() { return "shadow"; }
@@ -85,6 +85,8 @@ export class DuetSlideoutPanelDropdown {
                     "tags": [],
                     "text": "Theme."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "theme",
                 "reflect": false,
                 "defaultValue": "\"\""
@@ -103,6 +105,8 @@ export class DuetSlideoutPanelDropdown {
                     "tags": [],
                     "text": "Active"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "active",
                 "reflect": true,
                 "defaultValue": "false"
@@ -121,6 +125,8 @@ export class DuetSlideoutPanelDropdown {
                     "tags": [],
                     "text": "Open"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "open",
                 "reflect": true,
                 "defaultValue": "false"
@@ -139,6 +145,8 @@ export class DuetSlideoutPanelDropdown {
                     "tags": [],
                     "text": "Icon"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "icon",
                 "reflect": true,
                 "defaultValue": "undefined"

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

@@ -60,6 +60,8 @@ export class DuetSpacer {
                     "tags": [],
                     "text": "Size variation of the spacer. Can be any of the spacing tokens."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "size",
                 "reflect": false,
                 "defaultValue": "\"medium\""
@@ -84,6 +86,8 @@ export class DuetSpacer {
                     "tags": [],
                     "text": "Direction of the space added."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "direction",
                 "reflect": false,
                 "defaultValue": "\"vertical\""
@@ -108,6 +112,8 @@ export class DuetSpacer {
                     "tags": [],
                     "text": "Adjusts the breakpoint where the spacer is shown in. The functionality\nfollows 1:1 the media queries defined in design tokens."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "breakpoint",
                 "reflect": false,
                 "defaultValue": "\"\""

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

@@ -60,6 +60,8 @@ export class DuetSpinner {
                     "tags": [],
                     "text": "Adds accessible label for the spinner that is only shown for screen readers."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "accessible-label",
                 "reflect": false
             },
@@ -83,6 +85,8 @@ export class DuetSpinner {
                     "tags": [],
                     "text": "Color of the spinner, as a design token entered in camelCase or kebab-case.\nExample: \"color-primary\". This property can also be set to \"currentColor\"\nwhich forces the icon to use the CSS text color of parent element instead.\nUseful when you want to control the color in stylesheet instead."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "color",
                 "reflect": false,
                 "defaultValue": "\"gray-lightest\""
@@ -107,6 +111,8 @@ export class DuetSpinner {
                     "tags": [],
                     "text": "Size variation of the spinner."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "size",
                 "reflect": false,
                 "defaultValue": "\"small\""
@@ -131,6 +137,8 @@ export class DuetSpinner {
                     "tags": [],
                     "text": "Theme of the spinner. When used this will override the color setting and\nuse \"primary\" or \"primary-turva\" as the color depending on which theme\nis chosen."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "theme",
                 "reflect": false,
                 "defaultValue": "\"\""

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

@@ -129,6 +129,8 @@ export class DuetStep {
                     "tags": [],
                     "text": "Theme of the component."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "theme",
                 "reflect": false,
                 "defaultValue": "\"\""
@@ -147,6 +149,8 @@ export class DuetStep {
                     "tags": [],
                     "text": "Set the heading for the step."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "heading",
                 "reflect": false
             },
@@ -170,6 +174,8 @@ export class DuetStep {
                     "tags": [],
                     "text": "Set the heading level used in the HTML markup."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "heading-level",
                 "reflect": false
             },
@@ -190,6 +196,8 @@ export class DuetStep {
                         }],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "step-index",
                 "reflect": false
             },
@@ -216,6 +224,8 @@ export class DuetStep {
                         }],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "state",
                 "reflect": false
             },
@@ -236,6 +246,8 @@ export class DuetStep {
                         }],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "rounded-top",
                 "reflect": false,
                 "defaultValue": "false"
@@ -257,6 +269,8 @@ export class DuetStep {
                         }],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "rounded-bottom",
                 "reflect": false,
                 "defaultValue": "false"

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

@@ -124,6 +124,8 @@ export class DuetStepper {
                     "tags": [],
                     "text": "Theme of the component."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "theme",
                 "reflect": false,
                 "defaultValue": "\"\""
@@ -142,6 +144,8 @@ export class DuetStepper {
                     "tags": [],
                     "text": "Format of message used to announce current step when navigating between steps.\nThe string {current} is replaced with current the step number.\nThe string {total} is replaced with the total number of steps."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "accessible-live",
                 "reflect": false,
                 "defaultValue": "\"Lista jossa {total} kohtaa. Olet kohdassa {current}.\""
@@ -166,6 +170,8 @@ export class DuetStepper {
                     "tags": [],
                     "text": "Controls the margin of the component."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "margin",
                 "reflect": false,
                 "defaultValue": "\"auto\""
@@ -184,6 +190,8 @@ export class DuetStepper {
                     "tags": [],
                     "text": "Controls whether navigation back to previous steps is allowed or not."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "back-disabled",
                 "reflect": false,
                 "defaultValue": "false"
@@ -202,6 +210,8 @@ export class DuetStepper {
                     "tags": [],
                     "text": "The index of the current step."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "selected",
                 "reflect": true,
                 "defaultValue": "0"

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: 'e2117d735a8e911cded7f265c6f8a595ae48dfdb' }, h("nav", { key: '0797f1b1016c6932a6d6c59b11f487f70cc50f07', class: {
+        return (h(Host, { key: 'e1887ce1a641c6c58a54f0cc22d6548b71274312' }, h("nav", { key: '324f9788c4c5f0f07b6a6462e6333b9021c24b8d', class: {
                 "duet-submenu-bar": true,
                 "duet-theme-turva": this.theme === "turva",
                 hidden: this.hidden,
-            }, "aria-label": this.accessibleLabel }, this.hasItems && (h("button", { key: '94866119076b73cb76c5b8d17f9d1545db542f1a', 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: '5f4aab6f8d310a840b9428d100990a279bd88344', 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: 'dc870c6204c962afae8c9c26be03fdc13d0e5764', class: "label" }, h("slot", { key: '725b22668a7a9c521f5db94a7d61b88648bc6ccf', name: "label" }), h("duet-icon", { key: 'ad1ada873a49f7a04eba3b4a0875b980c3848eb5', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), h("div", { key: '09728b4fb000a4a22f6de2ac8c7f0c782dde65b2', class: {
+            }, onClick: this.onClick }, h("span", { key: '80740c4fe31825abf62d11762f8c11bcab49b3c1', class: "label" }, h("slot", { key: 'b59a92e6417e6c0da5dfce940b386cd026fa4f26', name: "label" }), h("duet-icon", { key: '370f031d4cd186535f3f62f5952461914364ca8a', theme: this.theme, class: "caret", name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" })))), h("div", { key: 'a482eaf5d9705512b952c67ef7e038fcce800c5a', class: {
                 "menu-container": true,
                 hidden: !this.open,
-            }, role: "presentation" }, h("div", { key: 'aa8bd7be5c9a023bd8334cb2de62172bd6d329ac', 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: '8e71057de372c6ec2c2c9b00a754e9dddbe5ff14', 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: 'bd0d108bfcd3823bcb1dfc8bc5cd1484a40fa75a', class: "list", role: this.mobile ? "presentation" : "list" }, h("slot", { key: '4186c575bbd77f9286ac918604da8e77f47953dd' }), h("div", { key: 'd1eb8709213d69f098493b3b31b3187ec352df6b', class: "list-padding" }))), h("duet-overlay", { key: '7fee9a7696fa6e91b3689e688272538906345ca9', "keep-stacking-context": true, visible: this.open, "display-device": "not-large", transition: "immediate" })))));
+            }, ref: element => (this.itemsContainer = element) }, h("div", { key: '6b216f3309c1da5a171a3fa39b31fcad805d76f4', class: "list", role: this.mobile ? "presentation" : "list" }, h("slot", { key: 'f4c31cc6c1c32d56d50a0d2e664ebf727255a025' }), h("div", { key: '0a170fb9952aefa7fa6150514497fdef9caf8cea', class: "list-padding" }))), h("duet-overlay", { key: 'd513c9c698863e334c70587b7d905023d48d2f46', "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"; }
@@ -170,6 +170,8 @@ export class DuetSubmenuBar {
                     "tags": [],
                     "text": "Theme."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "theme",
                 "reflect": false,
                 "defaultValue": "\"\""
@@ -188,6 +190,8 @@ export class DuetSubmenuBar {
                     "tags": [],
                     "text": "Makes the submenu bar hide on top of the window when page is scrolled down\nShould be used only with sticky navigation."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "hide-on-scroll",
                 "reflect": false,
                 "defaultValue": "false"
@@ -206,6 +210,8 @@ export class DuetSubmenuBar {
                     "tags": [],
                     "text": "Open"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "open",
                 "reflect": true,
                 "defaultValue": "false"
@@ -224,6 +230,8 @@ export class DuetSubmenuBar {
                     "tags": [],
                     "text": "Adds accessible label for the button that is only shown for screen readers.\nTypically, this label text replaces the visible text on the button for\nusers who use assistive technology."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "accessible-label",
                 "reflect": false
             }

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: '8f08ece395a4ba1314841a67287af313a8855186', role: "listitem" }, h("div", { key: 'e95acc4335f412ca02f26b8de05ade89164a7527', class: {
+        return (h(Host, { key: '82d9bb10d3b975fb643a1ff0735369158fc0267d', role: "listitem" }, h("div", { key: '04220a59fb49f405a8e072c61dd7f629275844a9', class: {
                 "duet-submenu-bar-dropdown": true,
                 "duet-theme-turva": this.theme === "turva",
                 open: this.open,
                 active: this.active,
-            } }, h("button", { key: 'a8d0369c81b9a06c1f124cd48d88306c1ed333dd', 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: 'e3b117a883729e81e5b044b700638798005758a7', 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: '4c0cc2b9677d5e58c2cf4428efa9d62a1e3c8d91', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'bd5c5b92ef9dc39bf26c2553a0f5e053ef5f1c48', class: "label" }, h("span", { key: '7d1aa5919c3e138f7b533d19aed057826f0fa314', class: "label-text" }, h("slot", { key: 'de5d49c359fa794ccf67bb2add1783e26ade578b', name: "label" })), h("duet-icon", { key: '94eba6e2c4541d80a1152018a9ce87138a947030', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: '9c101cf1fdaaabeca35e85d8e7fc41adc223dcd7', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick, onKeyUp: e => this.handleEscape(e) }, this.icon && (h("duet-icon", { key: '4f6aa1cd847b01bb6149300dd095bc2d90f0f8ee', class: "submenu-bar-dropdown-icon", theme: this.theme, name: this.icon, size: "auto", margin: "none", color: "currentColor" })), h("div", { key: 'e4e0fe843ffb97eb94ac1940b3daabbfdebaed09', class: "label" }, h("span", { key: '7527471d9064055386d235ff8a576a66b93e9246', class: "label-text" }, h("slot", { key: '13887aced4d286f3a79ffd7f125f124801d436a8', name: "label" })), h("duet-icon", { key: 'aa48764d6c7ee181d825621d1b565a92d0ac1a58', class: "caret", theme: this.theme, name: "action-arrow-down-small", margin: "none", size: "xxx-small", color: "currentColor" }))), h("div", { key: 'b03feb7412459e67e233d5c1dcf6f6263e574898', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
                 hidden: !this.open,
-            } }, h("slot", { key: '4f2254bd20c2b678903b0c0df54fd0f97402faed' })))));
+            } }, h("slot", { key: 'a1ad4d341602b1f922d38f24c8183be203867abb' })))));
     }
     static get is() { return "duet-submenu-bar-dropdown"; }
     static get encapsulation() { return "shadow"; }
@@ -143,6 +143,8 @@ export class DuetSubmenuBarDropdown {
                     "tags": [],
                     "text": "Theme."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "theme",
                 "reflect": false,
                 "defaultValue": "\"\""
@@ -161,6 +163,8 @@ export class DuetSubmenuBarDropdown {
                     "tags": [],
                     "text": "Active"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "active",
                 "reflect": false,
                 "defaultValue": "false"
@@ -179,6 +183,8 @@ export class DuetSubmenuBarDropdown {
                     "tags": [],
                     "text": "Open"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "open",
                 "reflect": true,
                 "defaultValue": "false"
@@ -197,6 +203,8 @@ export class DuetSubmenuBarDropdown {
                     "tags": [],
                     "text": "Icon"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "icon",
                 "reflect": true,
                 "defaultValue": "undefined"

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: '11e639e57c680a97a0ef21a57328360133227dd1' }, h("a", { key: '919512fb3aa5bf046fa9262710f43fcfd7c9fb39', class: {
+        return (h(Host, { key: '06b062162cb366accf11fd8844dc842cb4086e11' }, h("a", { key: 'aeba09894b5f6a4aec3c462fef6f62966fd3849f', 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: 'ebf2d185b72200c222f27e355adeff4c079ca4ea', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("span", { key: '0974a4c820f420a579284d59a828f4885c6e29f0', class: "label-container" }, h("span", { key: '56a4127149b845914f81522e8f4d1aee1bb5841d', class: "label" }, h("slot", { key: 'f7b1b3f63774566fde033aaeefc564f4f49e5565' })), this.caret && h("duet-icon", { key: '30ecc9e26ae5fd94776b1b6f36bd33762f857630', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (h("duet-icon", { key: '71a328a1d78b6d1d4c13ca0d07b5918677d93061', 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: '72463c8f6d29475ed51097a63b8c627e35454570', name: this.icon, size: "x-small", margin: "none", color: "currentColor" }), h("span", { key: '457b5b54be2bdbb03e665ed5549ac06b45e0a591', class: "label-container" }, h("span", { key: '0fe3839576cb252a5f928774b0808bf85913d6fe', class: "label" }, h("slot", { key: '4ca119e9809d2122107fbade53b8f0d21f499f99' })), this.caret && h("duet-icon", { key: '98119ea79cc812daa6857fa4286c97f0ffd6d4ca', name: "action-arrow-right-small", size: "xxx-small", margin: "none" })), this.active && (h("duet-icon", { key: 'c4cbb062c343bb3bf6b15d771de4618f1d75b531', 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"; }
@@ -72,6 +72,8 @@ export class DuetSubmenuBarDropdownLink {
                     "tags": [],
                     "text": "Theme."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "theme",
                 "reflect": false,
                 "defaultValue": "\"\""
@@ -90,6 +92,8 @@ export class DuetSubmenuBarDropdownLink {
                     "tags": [],
                     "text": "Active"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "active",
                 "reflect": false,
                 "defaultValue": "false"
@@ -108,6 +112,8 @@ export class DuetSubmenuBarDropdownLink {
                     "tags": [],
                     "text": "Href"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "href",
                 "reflect": false,
                 "defaultValue": "\"#\""
@@ -126,6 +132,8 @@ export class DuetSubmenuBarDropdownLink {
                     "tags": [],
                     "text": "Icon"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "icon",
                 "reflect": true,
                 "defaultValue": "undefined"
@@ -144,6 +152,8 @@ export class DuetSubmenuBarDropdownLink {
                     "tags": [],
                     "text": "Caret"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "caret",
                 "reflect": false,
                 "defaultValue": "false"
@@ -162,6 +172,8 @@ export class DuetSubmenuBarDropdownLink {
                     "tags": [],
                     "text": "Highlight"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "highlight",
                 "reflect": false,
                 "defaultValue": "false"