@zag-js/dismissable 1.41.0 → 1.41.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/pointer-event-outside.js +35 -4
  2. package/dist/pointer-event-outside.mjs +36 -5
  3. package/package.json +4 -4
package/dist/pointer-event-outside.js CHANGED
@@ -27,20 +27,47 @@ __export(pointer_event_outside_exports, {
27
27
  module.exports = __toCommonJS(pointer_event_outside_exports);
28
28
  var import_dom_query = require("@zag-js/dom-query");
29
29
  var import_layer_stack = require("./layer-stack.js");
30
- var originalBodyPointerEvents;
30
+ var originalBodyPointerEvents = /* @__PURE__ */ new WeakMap();
31
+ var layerObservers = /* @__PURE__ */ new WeakMap();
32
+ function getDesiredPointerEvents(node) {
33
+ return import_layer_stack.layerStack.isBelowPointerBlockingLayer(node) ? "none" : "auto";
34
+ }
35
+ function applyPointerEvents(node) {
36
+ const desired = getDesiredPointerEvents(node);
37
+ if (node.style.pointerEvents !== desired) {
38
+ node.style.pointerEvents = desired;
39
+ }
40
+ }
41
+ function ensurePointerEventsObserver(node) {
42
+ if (layerObservers.has(node)) return;
43
+ const win = (0, import_dom_query.getWindow)(node);
44
+ if (typeof win.MutationObserver === "undefined") return;
45
+ const observer = new win.MutationObserver(() => {
46
+ if (!layerObservers.has(node)) return;
47
+ applyPointerEvents(node);
48
+ });
49
+ observer.observe(node, { attributes: true, attributeFilter: ["style"] });
50
+ layerObservers.set(node, observer);
51
+ }
31
52
  function assignPointerEventToLayers() {
32
53
  import_layer_stack.layerStack.layers.forEach(({ node }) => {
33
- node.style.pointerEvents = import_layer_stack.layerStack.isBelowPointerBlockingLayer(node) ? "none" : "auto";
54
+ applyPointerEvents(node);
55
+ ensurePointerEventsObserver(node);
34
56
  });
35
57
  }
36
58
  function clearPointerEvent(node) {
59
+ const observer = layerObservers.get(node);
60
+ if (observer) {
61
+ observer.disconnect();
62
+ layerObservers.delete(node);
63
+ }
37
64
  node.style.pointerEvents = "";
38
65
  }
39
66
  function disablePointerEventsOutside(node, persistentElements) {
40
67
  const doc = (0, import_dom_query.getDocument)(node);
41
68
  const cleanups = [];
42
69
  if (import_layer_stack.layerStack.hasPointerBlockingLayer() && !doc.body.hasAttribute("data-inert")) {
43
- originalBodyPointerEvents = doc.body.style.pointerEvents;
70
+ originalBodyPointerEvents.set(doc.body, doc.body.style.pointerEvents);
44
71
  queueMicrotask(() => {
45
72
  const body = doc.body;
46
73
  if (!body) return;
@@ -64,7 +91,11 @@ function disablePointerEventsOutside(node, persistentElements) {
64
91
  queueMicrotask(() => {
65
92
  const body = doc.body;
66
93
  if (!body) return;
67
- body.style.pointerEvents = originalBodyPointerEvents;
94
+ const original = originalBodyPointerEvents.get(body);
95
+ if (original !== void 0) {
96
+ body.style.pointerEvents = original;
97
+ originalBodyPointerEvents.delete(body);
98
+ }
68
99
  body.removeAttribute("data-inert");
69
100
  if (body.style.length === 0) body.removeAttribute("style");
70
101
  });
package/dist/pointer-event-outside.mjs CHANGED
@@ -1,20 +1,47 @@
1
1
  // src/pointer-event-outside.ts
2
- import { getDocument, isHTMLElement, setStyle, waitForElement } from "@zag-js/dom-query";
2
+ import { getDocument, getWindow, isHTMLElement, setStyle, waitForElement } from "@zag-js/dom-query";
3
3
  import { layerStack } from "./layer-stack.mjs";
4
- var originalBodyPointerEvents;
4
+ var originalBodyPointerEvents = /* @__PURE__ */ new WeakMap();
5
+ var layerObservers = /* @__PURE__ */ new WeakMap();
6
+ function getDesiredPointerEvents(node) {
7
+ return layerStack.isBelowPointerBlockingLayer(node) ? "none" : "auto";
8
+ }
9
+ function applyPointerEvents(node) {
10
+ const desired = getDesiredPointerEvents(node);
11
+ if (node.style.pointerEvents !== desired) {
12
+ node.style.pointerEvents = desired;
13
+ }
14
+ }
15
+ function ensurePointerEventsObserver(node) {
16
+ if (layerObservers.has(node)) return;
17
+ const win = getWindow(node);
18
+ if (typeof win.MutationObserver === "undefined") return;
19
+ const observer = new win.MutationObserver(() => {
20
+ if (!layerObservers.has(node)) return;
21
+ applyPointerEvents(node);
22
+ });
23
+ observer.observe(node, { attributes: true, attributeFilter: ["style"] });
24
+ layerObservers.set(node, observer);
25
+ }
5
26
  function assignPointerEventToLayers() {
6
27
  layerStack.layers.forEach(({ node }) => {
7
- node.style.pointerEvents = layerStack.isBelowPointerBlockingLayer(node) ? "none" : "auto";
28
+ applyPointerEvents(node);
29
+ ensurePointerEventsObserver(node);
8
30
  });
9
31
  }
10
32
  function clearPointerEvent(node) {
33
+ const observer = layerObservers.get(node);
34
+ if (observer) {
35
+ observer.disconnect();
36
+ layerObservers.delete(node);
37
+ }
11
38
  node.style.pointerEvents = "";
12
39
  }
13
40
  function disablePointerEventsOutside(node, persistentElements) {
14
41
  const doc = getDocument(node);
15
42
  const cleanups = [];
16
43
  if (layerStack.hasPointerBlockingLayer() && !doc.body.hasAttribute("data-inert")) {
17
- originalBodyPointerEvents = doc.body.style.pointerEvents;
44
+ originalBodyPointerEvents.set(doc.body, doc.body.style.pointerEvents);
18
45
  queueMicrotask(() => {
19
46
  const body = doc.body;
20
47
  if (!body) return;
@@ -38,7 +65,11 @@ function disablePointerEventsOutside(node, persistentElements) {
38
65
  queueMicrotask(() => {
39
66
  const body = doc.body;
40
67
  if (!body) return;
41
- body.style.pointerEvents = originalBodyPointerEvents;
68
+ const original = originalBodyPointerEvents.get(body);
69
+ if (original !== void 0) {
70
+ body.style.pointerEvents = original;
71
+ originalBodyPointerEvents.delete(body);
72
+ }
42
73
  body.removeAttribute("data-inert");
43
74
  if (body.style.length === 0) body.removeAttribute("style");
44
75
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/dismissable",
3
- "version": "1.41.0",
3
+ "version": "1.41.2",
4
4
  "description": "Dismissable layer utilities for the DOM",
5
5
  "keywords": [
6
6
  "js",
@@ -23,9 +23,9 @@
23
23
  "access": "public"
24
24
  },
25
25
  "dependencies": {
26
- "@zag-js/interact-outside": "1.41.0",
27
- "@zag-js/dom-query": "1.41.0",
28
- "@zag-js/utils": "1.41.0"
26
+ "@zag-js/interact-outside": "1.41.2",
27
+ "@zag-js/dom-query": "1.41.2",
28
+ "@zag-js/utils": "1.41.2"
29
29
  },
30
30
  "devDependencies": {
31
31
  "clean-package": "2.2.0"