@m3e/dialog 1.2.2 → 1.3.1

package/dist/custom-elements.json

@@ -238,6 +238,13 @@
               "privacy": "private",
               "readonly": true
             },
+            {
+              "kind": "field",
+              "name": "#scrollLockController",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new ScrollLockController(this)"
+            },
             {
               "kind": "field",
               "name": "alert",

package/dist/index.js

@@ -3,8 +3,9 @@
  * Copyright (c) 2025 matraic
  * See LICENSE file in the project root for full license text.
  */
-import { ActionElementBase, EventAttribute, focusWhenReady, DesignToken, HtmlFor } from '@m3e/core';
+import { ActionElementBase, EventAttribute, ScrollLockController, focusWhenReady, DesignToken, HtmlFor } from '@m3e/core';
 import { LitElement, html, unsafeCSS, css, nothing } from 'lit';
+import '@m3e/core/a11y';
 
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
@@ -779,7 +780,7 @@ j?.(N, R), (t.litHtmlVersions ??= []).push("3.3.1");
  */
 const o = o => o ?? E;
 
-var _M3eDialogElement_instances, _M3eDialogElement_id, _M3eDialogElement_open, _M3eDialogElement_escapePressedWithoutCancel, _M3eDialogElement_renderCloseButton, _M3eDialogElement_handleClose, _M3eDialogElement_handleCancel, _M3eDialogElement_handleClick, _M3eDialogElement_handleKeyDown, _M3eDialogElement_handleActionsSlotChange;
+var _M3eDialogElement_instances, _M3eDialogElement_id, _M3eDialogElement_open, _M3eDialogElement_escapePressedWithoutCancel, _M3eDialogElement_scrollLockController, _M3eDialogElement_renderCloseButton, _M3eDialogElement_handleClose, _M3eDialogElement_handleCancel, _M3eDialogElement_handleClick, _M3eDialogElement_handleKeyDown, _M3eDialogElement_handleActionsSlotChange;
 var M3eDialogElement_1;
 /**
  * A dialog that provides important prompts in a user flow.
@@ -854,6 +855,8 @@ let M3eDialogElement = M3eDialogElement_1 = class M3eDialogElement extends Event
     _M3eDialogElement_escapePressedWithoutCancel.set(this, false);
     /** @private */
     this._hasActions = false;
+    /** @private */
+    _M3eDialogElement_scrollLockController.set(this, new ScrollLockController(this));
     /**
      * Whether the dialog is an alert.
      * @default false
@@ -916,6 +919,7 @@ let M3eDialogElement = M3eDialogElement_1 = class M3eDialogElement extends Event
       this.open = false;
       return;
     }
+    __classPrivateFieldGet(this, _M3eDialogElement_scrollLockController, "f").lock();
     this._base.showModal();
     this._content.scrollTop = 0;
     const focusable = this.querySelector("[autofocus]");
@@ -935,6 +939,7 @@ let M3eDialogElement = M3eDialogElement_1 = class M3eDialogElement extends Event
       return;
     }
     await this.updateComplete;
+    __classPrivateFieldGet(this, _M3eDialogElement_scrollLockController, "f").unlock();
     if (!this._base.open) {
       this.open = false;
       return;
@@ -959,6 +964,7 @@ let M3eDialogElement = M3eDialogElement_1 = class M3eDialogElement extends Event
 _M3eDialogElement_id = new WeakMap();
 _M3eDialogElement_open = new WeakMap();
 _M3eDialogElement_escapePressedWithoutCancel = new WeakMap();
+_M3eDialogElement_scrollLockController = new WeakMap();
 _M3eDialogElement_instances = new WeakSet();
 _M3eDialogElement_renderCloseButton = function _M3eDialogElement_renderCloseButton() {
   return !this.dismissible ? nothing : html`<m3e-icon-button aria-label="${this.closeLabel}" class="close" @click="${this.hide}"><slot name="close-icon"><svg class="close-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg></slot></m3e-icon-button>`;
@@ -976,7 +982,7 @@ _M3eDialogElement_handleCancel = function _M3eDialogElement_handleCancel(e) {
   if (e.target !== this._base) return;
   __classPrivateFieldSet(this, _M3eDialogElement_escapePressedWithoutCancel, false, "f");
   e.preventDefault();
-  if (!this.dispatchEvent(new Event("cancel", {
+  if (this.dispatchEvent(new Event("cancel", {
     cancelable: true
   }))) {
     this.hide();