@vaadin/overlay 25.2.7 → 25.2.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/overlay",
-  "version": "25.2.7",
+  "version": "25.2.9",
   "publishConfig": {
     "access": "public"
   },
@@ -34,19 +34,19 @@
   ],
   "dependencies": {
     "@open-wc/dedupe-mixin": "^1.3.0",
-    "@vaadin/a11y-base": "~25.2.7",
-    "@vaadin/component-base": "~25.2.7",
-    "@vaadin/vaadin-themable-mixin": "~25.2.7",
+    "@vaadin/a11y-base": "~25.2.9",
+    "@vaadin/component-base": "~25.2.9",
+    "@vaadin/vaadin-themable-mixin": "~25.2.9",
     "lit": "^3.0.0"
   },
   "devDependencies": {
-    "@vaadin/aura": "~25.2.7",
-    "@vaadin/chai-plugins": "~25.2.7",
-    "@vaadin/test-runner-commands": "~25.2.7",
+    "@vaadin/aura": "~25.2.9",
+    "@vaadin/chai-plugins": "~25.2.9",
+    "@vaadin/test-runner-commands": "~25.2.9",
     "@vaadin/testing-helpers": "^2.0.0",
-    "@vaadin/vaadin-lumo-styles": "~25.2.7",
+    "@vaadin/vaadin-lumo-styles": "~25.2.9",
     "sinon": "^22.0.0"
   },
   "customElements": "custom-elements.json",
-  "gitHead": "14be1af674f3968cce68c6eb4742340694c4a949"
+  "gitHead": "233d7875d586aca82b9cd43f19616bd6a4e81631"
 }

package/src/styles/vaadin-overlay-base-styles.js

@@ -55,6 +55,11 @@ export const overlayStyles = css`
     display: none !important;
   }
 
+  :host([suppressed]) [part='overlay'],
+  :host([suppressed]) ::slotted(*) {
+    pointer-events: none !important;
+  }
+
   [part='overlay'] {
     color: var(--vaadin-overlay-text-color, var(--vaadin-text-color));
     background: var(--vaadin-overlay-background, var(--vaadin-background-color));

package/src/vaadin-overlay-mixin.js

@@ -479,7 +479,7 @@ export const OverlayMixin = (superClass) =>
     _finishClosing() {
       this._detachOverlay();
       this._removeAttachedInstance();
-      this.$.overlay.style.removeProperty('pointer-events');
+      this.toggleAttribute('suppressed', false);
       setOverlayStateAttribute(this, 'closing', false);
       this.dispatchEvent(new CustomEvent('vaadin-overlay-closed'));
     }
@@ -557,6 +557,11 @@ export const OverlayMixin = (superClass) =>
 
       if (this.opened && !evt.defaultPrevented) {
         this.close(event);
+
+        // Only for modal overlays which make underlying content non-interactive.
+        if (!this.opened && !this.modeless) {
+          event.preventDefault();
+        }
       }
     }
 

package/src/vaadin-overlay-stack-mixin.js

@@ -106,10 +106,10 @@ export const OverlayStackMixin = (superClass) =>
         document.body.style.pointerEvents = 'none';
       }
 
-      // Disable pointer events in other attached overlays
+      // Suppress pointer events in other attached overlays
       getAttachedInstances().forEach((el) => {
         if (el !== this) {
-          el.$.overlay.style.pointerEvents = 'none';
+          el.toggleAttribute('suppressed', true);
         }
       });
     }
@@ -122,7 +122,7 @@ export const OverlayStackMixin = (superClass) =>
         delete this._previousDocumentPointerEvents;
       }
 
-      // Restore pointer events in the previous overlay(s)
+      // Stop suppressing pointer events in the previous overlay(s)
       const instances = getAttachedInstances();
 
       let el;
@@ -132,7 +132,7 @@ export const OverlayStackMixin = (superClass) =>
           // Skip the current instance
           continue;
         }
-        el.$.overlay.style.removeProperty('pointer-events');
+        el.toggleAttribute('suppressed', false);
         if (!el.modeless) {
           // Stop after the last modal
           break;