@duetds/components 9.0.2 → 9.1.0

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

@@ -113,7 +113,7 @@ export class DuetParagraph {
                     "references": {
                         "DuetParagraphSize": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-paragraph/duet-paragraph.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-paragraph/duet-paragraph.tsx",
                             "id": "src/components/duet-paragraph/duet-paragraph.tsx::DuetParagraphSize"
                         }
                     }
@@ -137,7 +137,7 @@ export class DuetParagraph {
                     "references": {
                         "DuetParagraphWeight": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-paragraph/duet-paragraph.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-paragraph/duet-paragraph.tsx",
                             "id": "src/components/duet-paragraph/duet-paragraph.tsx::DuetParagraphWeight"
                         }
                     }
@@ -161,7 +161,7 @@ export class DuetParagraph {
                     "references": {
                         "DuetParagraphVariation": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-paragraph/duet-paragraph.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-paragraph/duet-paragraph.tsx",
                             "id": "src/components/duet-paragraph/duet-paragraph.tsx::DuetParagraphVariation"
                         }
                     }

package/lib/collection/components/duet-popup-menu/duet-popup-menu.js

@@ -473,7 +473,7 @@ export class DuetPopupMenu {
                     "references": {
                         "DuetPopupMenuEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-popup-menu/duet-popup-menu.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-popup-menu/duet-popup-menu.tsx",
                             "id": "src/components/duet-popup-menu/duet-popup-menu.tsx::DuetPopupMenuEvent"
                         }
                     }

package/lib/collection/components/duet-popup-menu-item/duet-popup-menu-item.js

@@ -341,7 +341,7 @@ export class DuetPopupMenuItem {
                     "references": {
                         "DuetPopupMenuItemEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-popup-menu-item/duet-popup-menu-item.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-popup-menu-item/duet-popup-menu-item.tsx",
                             "id": "src/components/duet-popup-menu-item/duet-popup-menu-item.tsx::DuetPopupMenuItemEvent"
                         }
                     }
@@ -362,7 +362,7 @@ export class DuetPopupMenuItem {
                     "references": {
                         "DuetPopupMenuItemEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-popup-menu-item/duet-popup-menu-item.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-popup-menu-item/duet-popup-menu-item.tsx",
                             "id": "src/components/duet-popup-menu-item/duet-popup-menu-item.tsx::DuetPopupMenuItemEvent"
                         }
                     }

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

@@ -546,7 +546,7 @@ export class DuetRadio {
                     "references": {
                         "DuetRadioEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-radio/duet-radio.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-radio/duet-radio.tsx",
                             "id": "src/components/duet-radio/duet-radio.tsx::DuetRadioEvent"
                         }
                     }
@@ -567,7 +567,7 @@ export class DuetRadio {
                     "references": {
                         "DuetRadioEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-radio/duet-radio.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-radio/duet-radio.tsx",
                             "id": "src/components/duet-radio/duet-radio.tsx::DuetRadioEvent"
                         }
                     }
@@ -588,7 +588,7 @@ export class DuetRadio {
                     "references": {
                         "DuetRadioEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-radio/duet-radio.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-radio/duet-radio.tsx",
                             "id": "src/components/duet-radio/duet-radio.tsx::DuetRadioEvent"
                         }
                     }

package/lib/collection/components/duet-range-slider/duet-range-slider.js

@@ -567,7 +567,7 @@ export class DuetRangeSlider {
                     "references": {
                         "DuetRangeChangeEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-range-slider/duet-range-slider.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-range-slider/duet-range-slider.tsx",
                             "id": "src/components/duet-range-slider/duet-range-slider.tsx::DuetRangeChangeEvent"
                         }
                     }
@@ -588,7 +588,7 @@ export class DuetRangeSlider {
                     "references": {
                         "DuetRangeChangeEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-range-slider/duet-range-slider.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-range-slider/duet-range-slider.tsx",
                             "id": "src/components/duet-range-slider/duet-range-slider.tsx::DuetRangeChangeEvent"
                         }
                     }

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

@@ -379,7 +379,7 @@ export class DuetRangeStepper {
                     "references": {
                         "DuetRangeStepperUpdateEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-range-stepper/duet-range-stepper.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-range-stepper/duet-range-stepper.tsx",
                             "id": "src/components/duet-range-stepper/duet-range-stepper.tsx::DuetRangeStepperUpdateEvent"
                         }
                     }

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

@@ -194,7 +194,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectVariation": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectVariation"
                         }
                     }
@@ -510,7 +510,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectItems": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectItems"
                         }
                     }
@@ -701,7 +701,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectEvent"
                         }
                     }
@@ -722,7 +722,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectEvent"
                         }
                     }
@@ -743,7 +743,7 @@ export class DuetSelect {
                     "references": {
                         "DuetSelectEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-select/duet-select.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-select/duet-select.tsx",
                             "id": "src/components/duet-select/duet-select.tsx::DuetSelectEvent"
                         }
                     }

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

@@ -439,7 +439,7 @@ export class DuetShowMore {
                     "references": {
                         "DuetShowMoreToggleEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-show-more/duet-show-more.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/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

@@ -2,8 +2,8 @@
  * Built with Duet Design System
  */
 import { Build, h, Host, } from "@stencil/core";
-import { disableBodyScroll, enableBodyScroll } from "body-scroll-lock/lib/bodyScrollLock.es6.js";
 import { inheritGlobalTheme } from "../../common/themeable-component";
+import { disableBodyScroll, enableBodyScroll } from "../../utils/body-scroll";
 import { focusElement, FocusGuard } from "../../utils/focus-utils";
 import { isEscapeKey } from "../../utils/keyboard-utils";
 import { connectLanguageChangeObserver, disconnectLanguageChangeObserver, getLanguage, getLocaleString, } from "../../utils/language-utils";
@@ -211,15 +211,15 @@ export class DuetSlideout {
         };
         const topLevelOpenMenuBarTranslation = getLocaleString(this.topLevelOpenMenuBarLangObject);
         const exitTranslation = getLocaleString(this.exitLangObject);
-        return (h(Host, { key: 'a4e4bdbc1fa5714960b933fa40326461327e12e1' }, h("div", { key: 'e8cc6e3dfb961a706ab453423aadea140e20e7f9', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, h("duet-overlay", { key: 'f5389b854f0613665330be43ee1298fefe46d40f', onClick: this.bgOnClick, visible: this.open, "display-device": "large", zIndex: "600" }), h("div", { key: 'a99ce65f80ba47d02fab0c4906e70556a7a60c9c', 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: '88684eeca3c2d0993e9df0926e243a336fdd92a1' }, h("div", { key: 'ca9c8e8e4328049a64f33121bb958db863b6e0b8', class: { "duet-slideout": true, "duet-theme-turva": this.theme === "turva" } }, h("duet-overlay", { key: '8dc6d03b51c732ac868513ee80c923b3250595ec', onClick: this.bgOnClick, visible: this.open, "display-device": "large", zIndex: "600" }), h("div", { key: '05407d5ce3cd0a99d4e26df046d9f83b4b8e07a9', 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,
-            }, style: styles }, h(FocusGuard, { key: '1dbeeb5a35769b86cff89696062b31cdfd89a88b', moveFocusTo: this.closeButton }), h("div", { key: 'cd7a062e50bc5d0e9d0fe8dfa38917abf16c18e7', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: 'a97e253b687f92583bef886526e4d68e56bd6a5b', class: "top" }, h("button", { key: '88bf10f979ea8e208e01b5efc7affe90d27d105f', 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: '8cb01fd8120627bcd639886ae7d6233d9b08e8b6', moveFocusTo: this.closeButton }), h("div", { key: '2370e221ccbc3d408acbbf0ee6a03fad28e443d4', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '69189bd75f4b018e76fba05c6e610ca880741bb0', class: "top" }, h("button", { key: '62ded799dcc6087171e5ea4073f34cc565097f91', 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: '485c88489c6d71efefa5dd7588e89d3695c8d093', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '89533e2074dcba7373fb80a2ac2f55c196769f3c', class: "sticky-header" }, h("slot", { key: '9d76126801e6325d7515b1f67e1dd9c651a4d95f', name: "sticky-header" }))), h("div", { key: '9e6ba73148012c0cfe036e66a0f9806aa65e6772', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
+            }, onClick: this.onClick, inert: this.openPanel }, h("duet-icon", { key: 'e1bd07316366d09d49ea42d642d9fa4ac1b20767', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '0d1ec43ab54b2ca16880d552849000e0db14fe78', class: "sticky-header" }, h("slot", { key: 'e86ccd4f468257d18b874be14d654685493f0f02', name: "sticky-header" }))), h("div", { key: '7619e955e5292aa26cc195089516c8c1eefbcc6d', id: "slot-container", role: this.accessibleRole, "aria-label": this.openPanel ? topLevelOpenMenuBarTranslation : null, class: {
                 items: true,
-            } }, h("slot", { key: '81acda30d3373d8343eb397963a441ec1be34076' })), h(FocusGuard, { key: 'a8b78b2d968fe2b687ef4e1a2050fce07473adaa', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: '977a423ed91d61da268dbba22fa4920a6b4febce' })), h(FocusGuard, { key: '5b7c2df982e810d0e6ab3093ffce228e0a4c435e', moveFocusTo: this.closeButton })))));
     }
     static get is() { return "duet-slideout"; }
     static get encapsulation() { return "shadow"; }
@@ -362,7 +362,7 @@ export class DuetSlideout {
                     "references": {
                         "DuetSlideoutEventDetails": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-slideout/duet-slideout.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/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.css

@@ -28,6 +28,7 @@
   align-items: center;
   justify-content: flex-start;
   width: min-content;
+  white-space: nowrap;
 }
 
 ::slotted(*) {

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

@@ -1,8 +1,9 @@
 /*!
  * Built with Duet Design System
  */
-import { h, Host } from "@stencil/core";
+import { Build, h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common/themeable-component";
+import { disableBodyScroll, enableBodyScroll } from "../../utils/body-scroll";
 import { FocusGuard } from "../../utils/focus-utils";
 import { connectLanguageChangeObserver, disconnectLanguageChangeObserver, getLanguage, getLocaleString, } from "../../utils/language-utils";
 import { hasSlot } from "../../utils/slot-utils";
@@ -38,11 +39,14 @@ export class DuetSlideoutPanel {
             const parentElement = this.element.parentElement;
             if (parentElement.tagName === "DUET-SLIDEOUT") {
                 const slideout = this.element.parentElement;
+                enableBodyScroll(this.dialog);
+                this.bodyScrollLocked = false;
                 slideout.toggle();
             }
         };
         this.label = undefined;
         this.language = getLanguage();
+        this.bodyScrollLocked = false;
         this.theme = "";
         this.active = false;
         this.open = false;
@@ -60,9 +64,38 @@ export class DuetSlideoutPanel {
     }
     connectedCallback() {
         connectLanguageChangeObserver(this);
+        if (Build.isServer) {
+            return;
+        }
+        this.mutationObserver = new MutationObserver(() => {
+            const parentElement = this.element.parentElement;
+            if (parentElement.tagName === "DUET-SLIDEOUT") {
+                const slideout = this.element.parentElement;
+                if (slideout.open && this.open && !this.bodyScrollLocked) {
+                    this.bodyScrollLocked = true;
+                    disableBodyScroll(this.dialog, { reserveScrollBarGap: true });
+                }
+                else if (!slideout.open && this.bodyScrollLocked) {
+                    this.bodyScrollLocked = false;
+                    enableBodyScroll(this.dialog);
+                }
+            }
+        });
+        this.mutationObserver.observe(this.element.parentElement, {
+            childList: false,
+            attributeFilter: ["open"],
+            subtree: false,
+        });
     }
     disconnectedCallback() {
         disconnectLanguageChangeObserver(this);
+        if (this.dialog) {
+            enableBodyScroll(this.dialog);
+            this.bodyScrollLocked = false;
+        }
+        if (this.mutationObserver) {
+            this.mutationObserver.disconnect();
+        }
     }
     handleOpenChange(newValue, oldValue) {
         if (!!newValue === !!oldValue) {
@@ -76,6 +109,10 @@ export class DuetSlideoutPanel {
                         sibling.inert = true;
                     }
                 });
+                if (!this.bodyScrollLocked) {
+                    disableBodyScroll(this.dialog, { reserveScrollBarGap: true });
+                    this.bodyScrollLocked = true;
+                }
                 this.closeButton.focus();
             }, 200);
         }
@@ -86,6 +123,8 @@ export class DuetSlideoutPanel {
                     sibling.inert = false;
                 });
                 this.openButton.focus();
+                enableBodyScroll(this.dialog);
+                this.bodyScrollLocked = false;
             }, 200);
         }
     }
@@ -119,21 +158,21 @@ export class DuetSlideoutPanel {
         };
         const exitTranslation = getLocaleString(this.exitLangObject);
         const backTranslation = getLocaleString(this.backLangObject);
-        return (h(Host, { key: '22c28c0ab12659f418c97fbf93bbebd68608fb79' }, h("div", { key: '34c09abac8c0aee1c1dfd1f2bbac570ed0611b35', class: {
+        return (h(Host, { key: '826b4e03c6bd1a11d837c69c0cfb03e2a02ec806' }, h("div", { key: '236614595991d9fe5a593fafbd854ffd58485acc', class: {
                 "duet-slideout-panel": true,
                 "duet-theme-turva": this.theme === "turva",
                 active: this.open,
-            } }, h("button", { key: '8dcfb92e4eb8610e0a89fdbe3c7675e00a2e8379', 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: '99e2effee13c3455735edab40bf5469fede73c1a', 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: '4944cd788c6d0018243a4cc6b7d9f597ee6d435e', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: '813420fa817e10189a300006605f4f724b2b854e', class: "label" }, h("span", { key: 'b63f12c4351efa40940bdcac2dea8889cfbf2c82', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: 'fb495263ce936ce817e173148e4fcc35f7fa73b8', name: "label" })), h("duet-icon", { key: 'c61e62bf194e44656274ff86ceb55aa51fc3cec8', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: 'b0b8171895a218075cfc034265abb67c6c12ab4a', class: {
+            }, onClick: this.onClick, inert: this.open }, this.icon && h("duet-icon", { key: '751ac391008a23aecf0d7f84ff7a9609abbc04a9', name: this.icon, size: "medium", margin: "none", color: "secondary" }), h("span", { key: 'fde8fa06f82408652b3655f4adee5e99cd21cd45', class: "label" }, h("span", { key: 'b7818aab551be863114d6d7ac6529ee3fcd22ef7', class: { "label-text": true, [this.labelSize]: true } }, h("slot", { key: '8b2109422483b57c6a21cb4e263e83d8144f2276', name: "label" })), h("duet-icon", { key: '541ec1d29979a51b1a1d18a9b0453ea3c8f1b00a', class: "caret", name: "action-arrow-right", margin: "none", size: "x-small", color: "secondary" }))), h("div", { key: '8a6b84ab619429087424437536caed8d4d05628a', ref: element => (this.dialog = element), class: {
                 dialog: true,
                 hidden: !this.open,
-            }, style: styles }, h(FocusGuard, { key: 'e5fba5ca765f1a531361fddee555cb1811fcdcdb', moveFocusTo: this.closeButton }), h("div", { key: 'b5134e29091047b89083c0034c9cea235ca2fe5c', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '9419dbfcc225548ac136e2e0627bc7c17a788fb3', class: "top" }, h("button", { key: '4479933ad445c05b72de00c10a54c3336ca89e44', 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: '836ef8caef82089ba3b17d5afaa5bad08f999da4', moveFocusTo: this.closeButton }), h("div", { key: '10f8e89d308df9691eb69ba7b7c4f15bac425fd8', class: { "top-container": true, "has-sticky-header-slot": this.hasStickyHeaderSlot } }, h("div", { key: '39cdbb723d9f39f67e618b8e590692e9a4c1c701', class: "top" }, h("button", { key: '4bc8770ac0597cae623bd0097dbe88d4dc39af55', 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: '627ec8facc8df37e986fd32f83771825ed0fa23a', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: 'b597e175c2c2f97b604f04dccdbf5d00b71bcdb1' }, this.label.innerHTML), h("button", { key: 'fda07c1948d6aabdfbdebd84a5bbe71bbbe37bfa', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: 'ae152cff044ba959bed507383387374a07c64bf1', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: 'c6be3120a863c54dccf941033374c9c207d8e4af', class: "sticky-header" }, h("slot", { key: '723211cc2c88a3c20a61a96c5a802ee1fbe462c0', name: "sticky-header" }))), h("div", { key: '0f34420d3730ff49bb92f54457ba2db91fc43114', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
+            }, onClick: this.onClick }, h("duet-icon", { key: '6a4d622df1a1c0800ee494ab908b9fe9f8f026a9', class: "caret", name: "action-arrow-left", margin: "none", size: "small", color: "secondary" })), h("span", { key: '7506cec97907a13ba9b0128d77eaea32ee52612e' }, this.label.innerHTML), h("button", { key: '0073a94eb5c3593268212183b8c3d5b1561e5a15', class: "close", type: "button", onClick: this.onCloseClick, "aria-label": `${exitTranslation}` }, h("duet-icon", { key: '0913d58ffdd39f25b182be1dd3010d6b2c9d1705', name: "navigation-close", size: "small", margin: "none", color: "secondary" }))), h("div", { key: '22df548f77d37d3230ba043f165208f10a83dbdb', class: "sticky-header" }, h("slot", { key: '9d3c0f92ec8f24c7fb768e83adc7f83b8a9e0f75', name: "sticky-header" }))), h("div", { key: '71a5f93e693dde7b87f741695f0eefda26d0f687', tabindex: "-1", role: "menu", id: "menu", "aria-labelledby": "button", class: {
                 items: true,
-            } }, h("slot", { key: '8575454b60ae274fe2d4876b3d89fb1b9642afef' })), h(FocusGuard, { key: '5f96aa2ae4fa9eea21b2dff7ee8151cd3259c291', moveFocusTo: this.closeButton })))));
+            } }, h("slot", { key: 'a06f06fd10e0263f926dfc96a849caedb82ae2a9' })), h(FocusGuard, { key: '175d490d2b901e31a1da5e85d223547669ac8dd6', moveFocusTo: this.closeButton })))));
     }
     static get is() { return "duet-slideout-panel"; }
     static get encapsulation() { return "shadow"; }
@@ -274,7 +313,8 @@ export class DuetSlideoutPanel {
     static get states() {
         return {
             "label": {},
-            "language": {}
+            "language": {},
+            "bodyScrollLocked": {}
         };
     }
     static get methods() {

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

@@ -49,7 +49,7 @@ export class DuetSpacer {
                     "references": {
                         "DuetSpacerSize": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-spacer/duet-spacer.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-spacer/duet-spacer.tsx",
                             "id": "src/components/duet-spacer/duet-spacer.tsx::DuetSpacerSize"
                         }
                     }
@@ -97,7 +97,7 @@ export class DuetSpacer {
                     "references": {
                         "DuetSpacerBreakpoint": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-spacer/duet-spacer.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/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

@@ -96,7 +96,7 @@ export class DuetSpinner {
                     "references": {
                         "DuetSpinnerSize": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-spinner/duet-spinner.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-spinner/duet-spinner.tsx",
                             "id": "src/components/duet-spinner/duet-spinner.tsx::DuetSpinnerSize"
                         }
                     }

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

@@ -96,7 +96,7 @@ export class DuetStep {
             } }, h("div", { class: "duet-step-heading", id: this.buttonId, role: this.state !== "current" ? "button" : "region", "aria-current": this.state === "current" ? "step" : undefined, tabindex: this.state !== "current" ? "0" : undefined, "aria-disabled": this.isClickDisabled().toString(), "aria-expanded": (this.state === "current").toString(), "aria-controls": this.contentId, "aria-selected": (this.state === "current").toString(), onClick: this.handleClick, onKeyDown: this.handleKeyDown, ref: element => (this.buttonElement = element) }, h("div", { "aria-hidden": "true" }, h("div", { class: "duet-step-counter" }, this.renderStepCounter())), h("duet-spacer", { direction: "horizontal", size: "large", breakpoint: "small" }), h("duet-spacer", { direction: "horizontal", size: "medium", breakpoint: "x-small" }), h("div", null, h("duet-heading", { theme: this.theme, level: this.headingLevel, visualLevel: "h4", color: this.headingColor(), margin: "none" }, this.heading)), h("duet-spacer", { direction: "horizontal", size: "large" }), h("div", { class: "duet-step-heading-slot" }, h("slot", { name: "heading-content" }))), h("div", { class: "duet-step-content-wrapper" }, h("div", { class: "duet-step-content", role: "region", "aria-labelledby": this.buttonId, id: this.contentId }, h("slot", null)))));
     }
     static get is() { return "duet-step"; }
-    static get encapsulation() { return "scoped"; }
+    static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
         return {
             "$": ["duet-step.scss"]
@@ -202,7 +202,7 @@ export class DuetStep {
                     "references": {
                         "DuetStepState": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-step/duet-step.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-step/duet-step.tsx",
                             "id": "src/components/duet-step/duet-step.tsx::DuetStepState"
                         }
                     }
@@ -280,7 +280,7 @@ export class DuetStep {
                     "references": {
                         "DuetStepClickEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-step/duet-step.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/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

@@ -225,7 +225,7 @@ export class DuetStepper {
                     "references": {
                         "DuetStepChangeEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-stepper/duet-stepper.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-stepper/duet-stepper.tsx",
                             "id": "src/components/duet-stepper/duet-stepper.tsx::DuetStepChangeEvent"
                         }
                     }

package/lib/collection/components/duet-tab-group/duet-tab-group.js

@@ -326,7 +326,7 @@ export class DuetTabGroup {
                     "references": {
                         "DuetTabVariation": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
                             "id": "src/components/duet-tab-group/duet-tab-group.tsx::DuetTabVariation"
                         }
                     }
@@ -570,7 +570,7 @@ export class DuetTabGroup {
                     "references": {
                         "DuetTabGroupEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
                             "id": "src/components/duet-tab-group/duet-tab-group.tsx::DuetTabGroupEvent"
                         }
                     }
@@ -591,7 +591,7 @@ export class DuetTabGroup {
                     "references": {
                         "DuetTabGroupEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
                             "id": "src/components/duet-tab-group/duet-tab-group.tsx::DuetTabGroupEvent"
                         }
                     }
@@ -612,7 +612,7 @@ export class DuetTabGroup {
                     "references": {
                         "DuetTabGroupEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
                             "id": "src/components/duet-tab-group/duet-tab-group.tsx::DuetTabGroupEvent"
                         }
                     }
@@ -636,7 +636,7 @@ export class DuetTabGroup {
                         },
                         "DuetTabGroupEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-tab-group/duet-tab-group.tsx",
                             "id": "src/components/duet-tab-group/duet-tab-group.tsx::DuetTabGroupEvent"
                         }
                     },

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

@@ -820,7 +820,7 @@ export class DuetTextarea {
                     "references": {
                         "DuetTextareaEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-textarea/duet-textarea.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-textarea/duet-textarea.tsx",
                             "id": "src/components/duet-textarea/duet-textarea.tsx::DuetTextareaEvent"
                         }
                     }
@@ -841,7 +841,7 @@ export class DuetTextarea {
                     "references": {
                         "DuetTextareaEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-textarea/duet-textarea.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-textarea/duet-textarea.tsx",
                             "id": "src/components/duet-textarea/duet-textarea.tsx::DuetTextareaEvent"
                         }
                     }
@@ -862,7 +862,7 @@ export class DuetTextarea {
                     "references": {
                         "DuetTextareaEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-textarea/duet-textarea.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-textarea/duet-textarea.tsx",
                             "id": "src/components/duet-textarea/duet-textarea.tsx::DuetTextareaEvent"
                         }
                     }
@@ -883,7 +883,7 @@ export class DuetTextarea {
                     "references": {
                         "DuetTextareaEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-textarea/duet-textarea.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-textarea/duet-textarea.tsx",
                             "id": "src/components/duet-textarea/duet-textarea.tsx::DuetTextareaEvent"
                         }
                     }

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

@@ -486,7 +486,7 @@ export class DuetToggle {
                     "references": {
                         "DuetToggleChangeEvent": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-toggle/duet-toggle.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-toggle/duet-toggle.tsx",
                             "id": "src/components/duet-toggle/duet-toggle.tsx::DuetToggleChangeEvent"
                         }
                     }

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

@@ -424,7 +424,7 @@ export class DuetTooltip {
                     "references": {
                         "DuetTooltipBreakpoint": {
                             "location": "local",
-                            "path": "/Users/administrator/duetds/packages/components/src/components/duet-tooltip/duet-tooltip.tsx",
+                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-tooltip/duet-tooltip.tsx",
                             "id": "src/components/duet-tooltip/duet-tooltip.tsx::DuetTooltipBreakpoint"
                         }
                     }