@zag-js/dismissable 0.2.1 → 0.2.3

package/dist/{chunk-PYR5T5VL.mjs → chunk-5BMACJNB.mjs}

@@ -1,30 +1,21 @@
 import {
   trackEscapeKeydown
-} from "./chunk-3ZVQOINJ.mjs";
+} from "./chunk-BBFIKTYR.mjs";
 import {
   assignPointerEventToLayers,
   clearPointerEvent,
   disablePointerEventsOutside
-} from "./chunk-6YFBZALL.mjs";
+} from "./chunk-C5KU67MN.mjs";
 import {
-  contains,
-  getEventTarget,
   layerStack
-} from "./chunk-PFLX3TD5.mjs";
-
-// ../core/src/warning.ts
-function warn(...a) {
-  const m = a.length === 1 ? a[0] : a[1];
-  const c = a.length === 2 ? a[0] : true;
-  if (c && process.env.NODE_ENV !== "production") {
-    console.warn(m);
-  }
-}
+} from "./chunk-G4GHYT27.mjs";
 
 // src/dismissable-layer.ts
+import { contains, getEventTarget } from "@zag-js/dom-query";
 import {
   trackInteractOutside
 } from "@zag-js/interact-outside";
+import { warn } from "@zag-js/utils";
 function trackDismissableElement(node, options) {
   if (!node) {
     warn("[@zag-js/dismissable] node is `null` or `undefined`");
@@ -35,38 +26,35 @@ function trackDismissableElement(node, options) {
   layerStack.add(layer);
   assignPointerEventToLayers();
   function onPointerDownOutside(event) {
-    var _a, _b;
     const target = getEventTarget(event.detail.originalEvent);
     if (layerStack.isBelowPointerBlockingLayer(node) || layerStack.isInBranch(target))
       return;
-    (_a = options.onPointerDownOutside) == null ? void 0 : _a.call(options, event);
-    (_b = options.onInteractOutside) == null ? void 0 : _b.call(options, event);
+    options.onPointerDownOutside?.(event);
+    options.onInteractOutside?.(event);
     if (event.defaultPrevented)
       return;
     if (debug) {
       console.log("onPointerDownOutside:", event.detail.originalEvent);
     }
-    onDismiss == null ? void 0 : onDismiss();
+    onDismiss?.();
   }
   function onFocusOutside(event) {
-    var _a, _b;
     const target = getEventTarget(event.detail.originalEvent);
     if (layerStack.isInBranch(target))
       return;
-    (_a = options.onFocusOutside) == null ? void 0 : _a.call(options, event);
-    (_b = options.onInteractOutside) == null ? void 0 : _b.call(options, event);
+    options.onFocusOutside?.(event);
+    options.onInteractOutside?.(event);
     if (event.defaultPrevented)
       return;
     if (debug) {
       console.log("onFocusOutside:", event.detail.originalEvent);
     }
-    onDismiss == null ? void 0 : onDismiss();
+    onDismiss?.();
   }
   function onEscapeKeyDown(event) {
-    var _a;
     if (!layerStack.isTopMost(node))
       return;
-    (_a = options.onEscapeKeyDown) == null ? void 0 : _a.call(options, event);
+    options.onEscapeKeyDown?.(event);
     if (!event.defaultPrevented && onDismiss) {
       event.preventDefault();
       onDismiss();
@@ -81,14 +69,14 @@ function trackDismissableElement(node, options) {
   }
   const cleanups = [
     pointerBlocking ? disablePointerEventsOutside(node) : void 0,
-    trackEscapeKeydown(onEscapeKeyDown),
+    trackEscapeKeydown(node, onEscapeKeyDown),
     trackInteractOutside(node, { exclude, onFocusOutside, onPointerDownOutside })
   ];
   return () => {
     layerStack.remove(node);
     assignPointerEventToLayers();
     clearPointerEvent(node);
-    cleanups.forEach((fn) => fn == null ? void 0 : fn());
+    cleanups.forEach((fn) => fn?.());
   };
 }
 

package/dist/chunk-BBFIKTYR.mjs

@@ -0,0 +1,14 @@
+// src/escape-keydown.ts
+import { addDomEvent } from "@zag-js/dom-event";
+import { getDocument } from "@zag-js/dom-query";
+function trackEscapeKeydown(node, fn) {
+  const handleKeyDown = (event) => {
+    if (event.key === "Escape")
+      fn?.(event);
+  };
+  return addDomEvent(getDocument(node), "keydown", handleKeyDown);
+}
+
+export {
+  trackEscapeKeydown
+};

package/dist/{chunk-6YFBZALL.mjs → chunk-C5KU67MN.mjs}

@@ -1,9 +1,9 @@
 import {
-  getDocument,
   layerStack
-} from "./chunk-PFLX3TD5.mjs";
+} from "./chunk-G4GHYT27.mjs";
 
 // src/pointer-event-outside.ts
+import { getDocument } from "@zag-js/dom-query";
 var originalBodyPointerEvents;
 function assignPointerEventToLayers() {
   layerStack.layers.forEach(({ node }) => {

package/dist/{chunk-PFLX3TD5.mjs → chunk-G4GHYT27.mjs}

@@ -1,32 +1,5 @@
-// ../dom/src/query.ts
-function isDocument(el) {
-  return el.nodeType === Node.DOCUMENT_NODE;
-}
-function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
-}
-function getDocument(el) {
-  var _a;
-  if (isWindow(el))
-    return el.document;
-  if (isDocument(el))
-    return el;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
-}
-function getEventTarget(event) {
-  var _a, _b;
-  return (_b = (_a = event.composedPath) == null ? void 0 : _a.call(event)[0]) != null ? _b : event.target;
-}
-function contains(parent, child) {
-  if (!parent)
-    return false;
-  return parent === child || isHTMLElement(parent) && isHTMLElement(child) && parent.contains(child);
-}
-function isHTMLElement(v) {
-  return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
-}
-
 // src/layer-stack.ts
+import { contains } from "@zag-js/dom-query";
 var layerStack = {
   layers: [],
   branches: [],
@@ -43,14 +16,13 @@ var layerStack = {
     return this.pointerBlockingLayers().length > 0;
   },
   isBelowPointerBlockingLayer(node) {
-    var _a;
     const index = this.indexOf(node);
-    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf((_a = this.topMostPointerBlockingLayer()) == null ? void 0 : _a.node) : -1;
+    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf(this.topMostPointerBlockingLayer()?.node) : -1;
     return index < highestBlockingIndex;
   },
   isTopMost(node) {
     const layer = this.layers[this.count() - 1];
-    return (layer == null ? void 0 : layer.node) === node;
+    return layer?.node === node;
   },
   getNestedLayers(node) {
     return Array.from(this.layers).slice(this.indexOf(node) + 1);
@@ -86,8 +58,7 @@ var layerStack = {
     return this.layers.findIndex((layer) => layer.node === node);
   },
   dismiss(node) {
-    var _a;
-    (_a = this.layers[this.indexOf(node)]) == null ? void 0 : _a.dismiss();
+    this.layers[this.indexOf(node)]?.dismiss();
   },
   clear() {
     this.remove(this.layers[0].node);
@@ -95,8 +66,5 @@ var layerStack = {
 };
 
 export {
-  getDocument,
-  getEventTarget,
-  contains,
   layerStack
 };

package/dist/dismissable-layer.js

@@ -23,76 +23,23 @@ __export(dismissable_layer_exports, {
   trackDismissableElement: () => trackDismissableElement
 });
 module.exports = __toCommonJS(dismissable_layer_exports);
-
-// ../core/src/functions.ts
-var runIfFn = (v, ...a) => {
-  const res = typeof v === "function" ? v(...a) : v;
-  return res != null ? res : void 0;
-};
-
-// ../core/src/guard.ts
-var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-
-// ../core/src/warning.ts
-function warn(...a) {
-  const m = a.length === 1 ? a[0] : a[1];
-  const c = a.length === 2 ? a[0] : true;
-  if (c && process.env.NODE_ENV !== "production") {
-    console.warn(m);
-  }
-}
-
-// ../dom/src/query.ts
-function isDocument(el) {
-  return el.nodeType === Node.DOCUMENT_NODE;
-}
-function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
-}
-function getDocument(el) {
-  var _a;
-  if (isWindow(el))
-    return el.document;
-  if (isDocument(el))
-    return el;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
-}
-function getEventTarget(event) {
-  var _a, _b;
-  return (_b = (_a = event.composedPath) == null ? void 0 : _a.call(event)[0]) != null ? _b : event.target;
-}
-function contains(parent, child) {
-  if (!parent)
-    return false;
-  return parent === child || isHTMLElement(parent) && isHTMLElement(child) && parent.contains(child);
-}
-function isHTMLElement(v) {
-  return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
-}
-
-// ../dom/src/listener.ts
-var isRef = (v) => hasProp(v, "current");
-function addDomEvent(target, eventName, handler, options) {
-  const node = isRef(target) ? target.current : runIfFn(target);
-  node == null ? void 0 : node.addEventListener(eventName, handler, options);
-  return () => {
-    node == null ? void 0 : node.removeEventListener(eventName, handler, options);
-  };
-}
-
-// src/dismissable-layer.ts
+var import_dom_query4 = require("@zag-js/dom-query");
 var import_interact_outside = require("@zag-js/interact-outside");
+var import_utils = require("@zag-js/utils");
 
 // src/escape-keydown.ts
-function trackEscapeKeydown(fn) {
+var import_dom_event = require("@zag-js/dom-event");
+var import_dom_query = require("@zag-js/dom-query");
+function trackEscapeKeydown(node, fn) {
   const handleKeyDown = (event) => {
     if (event.key === "Escape")
-      fn == null ? void 0 : fn(event);
+      fn?.(event);
   };
-  return addDomEvent(document, "keydown", handleKeyDown);
+  return (0, import_dom_event.addDomEvent)((0, import_dom_query.getDocument)(node), "keydown", handleKeyDown);
 }
 
 // src/layer-stack.ts
+var import_dom_query2 = require("@zag-js/dom-query");
 var layerStack = {
   layers: [],
   branches: [],
@@ -109,23 +56,22 @@ var layerStack = {
     return this.pointerBlockingLayers().length > 0;
   },
   isBelowPointerBlockingLayer(node) {
-    var _a;
     const index = this.indexOf(node);
-    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf((_a = this.topMostPointerBlockingLayer()) == null ? void 0 : _a.node) : -1;
+    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf(this.topMostPointerBlockingLayer()?.node) : -1;
     return index < highestBlockingIndex;
   },
   isTopMost(node) {
     const layer = this.layers[this.count() - 1];
-    return (layer == null ? void 0 : layer.node) === node;
+    return layer?.node === node;
   },
   getNestedLayers(node) {
     return Array.from(this.layers).slice(this.indexOf(node) + 1);
   },
   isInNestedLayer(node, target) {
-    return this.getNestedLayers(node).some((layer) => contains(layer.node, target));
+    return this.getNestedLayers(node).some((layer) => (0, import_dom_query2.contains)(layer.node, target));
   },
   isInBranch(target) {
-    return Array.from(this.branches).some((branch) => contains(branch, target));
+    return Array.from(this.branches).some((branch) => (0, import_dom_query2.contains)(branch, target));
   },
   add(layer) {
     this.layers.push(layer);
@@ -152,8 +98,7 @@ var layerStack = {
     return this.layers.findIndex((layer) => layer.node === node);
   },
   dismiss(node) {
-    var _a;
-    (_a = this.layers[this.indexOf(node)]) == null ? void 0 : _a.dismiss();
+    this.layers[this.indexOf(node)]?.dismiss();
   },
   clear() {
     this.remove(this.layers[0].node);
@@ -161,6 +106,7 @@ var layerStack = {
 };
 
 // src/pointer-event-outside.ts
+var import_dom_query3 = require("@zag-js/dom-query");
 var originalBodyPointerEvents;
 function assignPointerEventToLayers() {
   layerStack.layers.forEach(({ node }) => {
@@ -172,7 +118,7 @@ function clearPointerEvent(node) {
 }
 var DATA_ATTR = "data-inert";
 function disablePointerEventsOutside(node) {
-  const doc = getDocument(node);
+  const doc = (0, import_dom_query3.getDocument)(node);
   if (layerStack.hasPointerBlockingLayer() && !doc.body.hasAttribute(DATA_ATTR)) {
     originalBodyPointerEvents = document.body.style.pointerEvents;
     doc.body.style.pointerEvents = "none";
@@ -191,7 +137,7 @@ function disablePointerEventsOutside(node) {
 // src/dismissable-layer.ts
 function trackDismissableElement(node, options) {
   if (!node) {
-    warn("[@zag-js/dismissable] node is `null` or `undefined`");
+    (0, import_utils.warn)("[@zag-js/dismissable] node is `null` or `undefined`");
     return;
   }
   const { onDismiss, pointerBlocking, exclude: excludeContainers, debug } = options;
@@ -199,38 +145,35 @@ function trackDismissableElement(node, options) {
   layerStack.add(layer);
   assignPointerEventToLayers();
   function onPointerDownOutside(event) {
-    var _a, _b;
-    const target = getEventTarget(event.detail.originalEvent);
+    const target = (0, import_dom_query4.getEventTarget)(event.detail.originalEvent);
     if (layerStack.isBelowPointerBlockingLayer(node) || layerStack.isInBranch(target))
       return;
-    (_a = options.onPointerDownOutside) == null ? void 0 : _a.call(options, event);
-    (_b = options.onInteractOutside) == null ? void 0 : _b.call(options, event);
+    options.onPointerDownOutside?.(event);
+    options.onInteractOutside?.(event);
     if (event.defaultPrevented)
       return;
     if (debug) {
       console.log("onPointerDownOutside:", event.detail.originalEvent);
     }
-    onDismiss == null ? void 0 : onDismiss();
+    onDismiss?.();
   }
   function onFocusOutside(event) {
-    var _a, _b;
-    const target = getEventTarget(event.detail.originalEvent);
+    const target = (0, import_dom_query4.getEventTarget)(event.detail.originalEvent);
     if (layerStack.isInBranch(target))
       return;
-    (_a = options.onFocusOutside) == null ? void 0 : _a.call(options, event);
-    (_b = options.onInteractOutside) == null ? void 0 : _b.call(options, event);
+    options.onFocusOutside?.(event);
+    options.onInteractOutside?.(event);
     if (event.defaultPrevented)
       return;
     if (debug) {
       console.log("onFocusOutside:", event.detail.originalEvent);
     }
-    onDismiss == null ? void 0 : onDismiss();
+    onDismiss?.();
   }
   function onEscapeKeyDown(event) {
-    var _a;
     if (!layerStack.isTopMost(node))
       return;
-    (_a = options.onEscapeKeyDown) == null ? void 0 : _a.call(options, event);
+    options.onEscapeKeyDown?.(event);
     if (!event.defaultPrevented && onDismiss) {
       event.preventDefault();
       onDismiss();
@@ -241,18 +184,18 @@ function trackDismissableElement(node, options) {
       return false;
     const containers = typeof excludeContainers === "function" ? excludeContainers() : excludeContainers;
     const _containers = Array.isArray(containers) ? containers : [containers];
-    return _containers.some((node2) => contains(node2, target)) || layerStack.isInNestedLayer(node, target);
+    return _containers.some((node2) => (0, import_dom_query4.contains)(node2, target)) || layerStack.isInNestedLayer(node, target);
   }
   const cleanups = [
     pointerBlocking ? disablePointerEventsOutside(node) : void 0,
-    trackEscapeKeydown(onEscapeKeyDown),
+    trackEscapeKeydown(node, onEscapeKeyDown),
     (0, import_interact_outside.trackInteractOutside)(node, { exclude, onFocusOutside, onPointerDownOutside })
   ];
   return () => {
     layerStack.remove(node);
     assignPointerEventToLayers();
     clearPointerEvent(node);
-    cleanups.forEach((fn) => fn == null ? void 0 : fn());
+    cleanups.forEach((fn) => fn?.());
   };
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/dismissable-layer.mjs

@@ -1,9 +1,9 @@
 import {
   trackDismissableElement
-} from "./chunk-PYR5T5VL.mjs";
-import "./chunk-3ZVQOINJ.mjs";
-import "./chunk-6YFBZALL.mjs";
-import "./chunk-PFLX3TD5.mjs";
+} from "./chunk-5BMACJNB.mjs";
+import "./chunk-BBFIKTYR.mjs";
+import "./chunk-C5KU67MN.mjs";
+import "./chunk-G4GHYT27.mjs";
 export {
   trackDismissableElement
 };

package/dist/escape-keydown.d.ts

@@ -1,3 +1,3 @@
-declare function trackEscapeKeydown(fn?: (event: KeyboardEvent) => void): () => void;
+declare function trackEscapeKeydown(node: HTMLElement, fn?: (event: KeyboardEvent) => void): () => void;
 
 export { trackEscapeKeydown };

package/dist/escape-keydown.js

@@ -23,33 +23,14 @@ __export(escape_keydown_exports, {
   trackEscapeKeydown: () => trackEscapeKeydown
 });
 module.exports = __toCommonJS(escape_keydown_exports);
-
-// ../core/src/functions.ts
-var runIfFn = (v, ...a) => {
-  const res = typeof v === "function" ? v(...a) : v;
-  return res != null ? res : void 0;
-};
-
-// ../core/src/guard.ts
-var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-
-// ../dom/src/listener.ts
-var isRef = (v) => hasProp(v, "current");
-function addDomEvent(target, eventName, handler, options) {
-  const node = isRef(target) ? target.current : runIfFn(target);
-  node == null ? void 0 : node.addEventListener(eventName, handler, options);
-  return () => {
-    node == null ? void 0 : node.removeEventListener(eventName, handler, options);
-  };
-}
-
-// src/escape-keydown.ts
-function trackEscapeKeydown(fn) {
+var import_dom_event = require("@zag-js/dom-event");
+var import_dom_query = require("@zag-js/dom-query");
+function trackEscapeKeydown(node, fn) {
   const handleKeyDown = (event) => {
     if (event.key === "Escape")
-      fn == null ? void 0 : fn(event);
+      fn?.(event);
   };
-  return addDomEvent(document, "keydown", handleKeyDown);
+  return (0, import_dom_event.addDomEvent)((0, import_dom_query.getDocument)(node), "keydown", handleKeyDown);
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/escape-keydown.mjs

@@ -1,6 +1,6 @@
 import {
   trackEscapeKeydown
-} from "./chunk-3ZVQOINJ.mjs";
+} from "./chunk-BBFIKTYR.mjs";
 export {
   trackEscapeKeydown
 };

package/dist/index.js

@@ -24,75 +24,24 @@ __export(src_exports, {
 });
 module.exports = __toCommonJS(src_exports);
 
-// ../core/src/functions.ts
-var runIfFn = (v, ...a) => {
-  const res = typeof v === "function" ? v(...a) : v;
-  return res != null ? res : void 0;
-};
-
-// ../core/src/guard.ts
-var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-
-// ../core/src/warning.ts
-function warn(...a) {
-  const m = a.length === 1 ? a[0] : a[1];
-  const c = a.length === 2 ? a[0] : true;
-  if (c && process.env.NODE_ENV !== "production") {
-    console.warn(m);
-  }
-}
-
-// ../dom/src/query.ts
-function isDocument(el) {
-  return el.nodeType === Node.DOCUMENT_NODE;
-}
-function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
-}
-function getDocument(el) {
-  var _a;
-  if (isWindow(el))
-    return el.document;
-  if (isDocument(el))
-    return el;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
-}
-function getEventTarget(event) {
-  var _a, _b;
-  return (_b = (_a = event.composedPath) == null ? void 0 : _a.call(event)[0]) != null ? _b : event.target;
-}
-function contains(parent, child) {
-  if (!parent)
-    return false;
-  return parent === child || isHTMLElement(parent) && isHTMLElement(child) && parent.contains(child);
-}
-function isHTMLElement(v) {
-  return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
-}
-
-// ../dom/src/listener.ts
-var isRef = (v) => hasProp(v, "current");
-function addDomEvent(target, eventName, handler, options) {
-  const node = isRef(target) ? target.current : runIfFn(target);
-  node == null ? void 0 : node.addEventListener(eventName, handler, options);
-  return () => {
-    node == null ? void 0 : node.removeEventListener(eventName, handler, options);
-  };
-}
-
 // src/dismissable-layer.ts
+var import_dom_query4 = require("@zag-js/dom-query");
 var import_interact_outside = require("@zag-js/interact-outside");
+var import_utils = require("@zag-js/utils");
 
 // src/escape-keydown.ts
-function trackEscapeKeydown(fn) {
+var import_dom_event = require("@zag-js/dom-event");
+var import_dom_query = require("@zag-js/dom-query");
+function trackEscapeKeydown(node, fn) {
   const handleKeyDown = (event) => {
     if (event.key === "Escape")
-      fn == null ? void 0 : fn(event);
+      fn?.(event);
   };
-  return addDomEvent(document, "keydown", handleKeyDown);
+  return (0, import_dom_event.addDomEvent)((0, import_dom_query.getDocument)(node), "keydown", handleKeyDown);
 }
 
 // src/layer-stack.ts
+var import_dom_query2 = require("@zag-js/dom-query");
 var layerStack = {
   layers: [],
   branches: [],
@@ -109,23 +58,22 @@ var layerStack = {
     return this.pointerBlockingLayers().length > 0;
   },
   isBelowPointerBlockingLayer(node) {
-    var _a;
     const index = this.indexOf(node);
-    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf((_a = this.topMostPointerBlockingLayer()) == null ? void 0 : _a.node) : -1;
+    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf(this.topMostPointerBlockingLayer()?.node) : -1;
     return index < highestBlockingIndex;
   },
   isTopMost(node) {
     const layer = this.layers[this.count() - 1];
-    return (layer == null ? void 0 : layer.node) === node;
+    return layer?.node === node;
   },
   getNestedLayers(node) {
     return Array.from(this.layers).slice(this.indexOf(node) + 1);
   },
   isInNestedLayer(node, target) {
-    return this.getNestedLayers(node).some((layer) => contains(layer.node, target));
+    return this.getNestedLayers(node).some((layer) => (0, import_dom_query2.contains)(layer.node, target));
   },
   isInBranch(target) {
-    return Array.from(this.branches).some((branch) => contains(branch, target));
+    return Array.from(this.branches).some((branch) => (0, import_dom_query2.contains)(branch, target));
   },
   add(layer) {
     this.layers.push(layer);
@@ -152,8 +100,7 @@ var layerStack = {
     return this.layers.findIndex((layer) => layer.node === node);
   },
   dismiss(node) {
-    var _a;
-    (_a = this.layers[this.indexOf(node)]) == null ? void 0 : _a.dismiss();
+    this.layers[this.indexOf(node)]?.dismiss();
   },
   clear() {
     this.remove(this.layers[0].node);
@@ -161,6 +108,7 @@ var layerStack = {
 };
 
 // src/pointer-event-outside.ts
+var import_dom_query3 = require("@zag-js/dom-query");
 var originalBodyPointerEvents;
 function assignPointerEventToLayers() {
   layerStack.layers.forEach(({ node }) => {
@@ -172,7 +120,7 @@ function clearPointerEvent(node) {
 }
 var DATA_ATTR = "data-inert";
 function disablePointerEventsOutside(node) {
-  const doc = getDocument(node);
+  const doc = (0, import_dom_query3.getDocument)(node);
   if (layerStack.hasPointerBlockingLayer() && !doc.body.hasAttribute(DATA_ATTR)) {
     originalBodyPointerEvents = document.body.style.pointerEvents;
     doc.body.style.pointerEvents = "none";
@@ -191,7 +139,7 @@ function disablePointerEventsOutside(node) {
 // src/dismissable-layer.ts
 function trackDismissableElement(node, options) {
   if (!node) {
-    warn("[@zag-js/dismissable] node is `null` or `undefined`");
+    (0, import_utils.warn)("[@zag-js/dismissable] node is `null` or `undefined`");
     return;
   }
   const { onDismiss, pointerBlocking, exclude: excludeContainers, debug } = options;
@@ -199,38 +147,35 @@ function trackDismissableElement(node, options) {
   layerStack.add(layer);
   assignPointerEventToLayers();
   function onPointerDownOutside(event) {
-    var _a, _b;
-    const target = getEventTarget(event.detail.originalEvent);
+    const target = (0, import_dom_query4.getEventTarget)(event.detail.originalEvent);
     if (layerStack.isBelowPointerBlockingLayer(node) || layerStack.isInBranch(target))
       return;
-    (_a = options.onPointerDownOutside) == null ? void 0 : _a.call(options, event);
-    (_b = options.onInteractOutside) == null ? void 0 : _b.call(options, event);
+    options.onPointerDownOutside?.(event);
+    options.onInteractOutside?.(event);
     if (event.defaultPrevented)
       return;
     if (debug) {
       console.log("onPointerDownOutside:", event.detail.originalEvent);
     }
-    onDismiss == null ? void 0 : onDismiss();
+    onDismiss?.();
   }
   function onFocusOutside(event) {
-    var _a, _b;
-    const target = getEventTarget(event.detail.originalEvent);
+    const target = (0, import_dom_query4.getEventTarget)(event.detail.originalEvent);
     if (layerStack.isInBranch(target))
       return;
-    (_a = options.onFocusOutside) == null ? void 0 : _a.call(options, event);
-    (_b = options.onInteractOutside) == null ? void 0 : _b.call(options, event);
+    options.onFocusOutside?.(event);
+    options.onInteractOutside?.(event);
     if (event.defaultPrevented)
       return;
     if (debug) {
       console.log("onFocusOutside:", event.detail.originalEvent);
     }
-    onDismiss == null ? void 0 : onDismiss();
+    onDismiss?.();
   }
   function onEscapeKeyDown(event) {
-    var _a;
     if (!layerStack.isTopMost(node))
       return;
-    (_a = options.onEscapeKeyDown) == null ? void 0 : _a.call(options, event);
+    options.onEscapeKeyDown?.(event);
     if (!event.defaultPrevented && onDismiss) {
       event.preventDefault();
       onDismiss();
@@ -241,18 +186,18 @@ function trackDismissableElement(node, options) {
       return false;
     const containers = typeof excludeContainers === "function" ? excludeContainers() : excludeContainers;
     const _containers = Array.isArray(containers) ? containers : [containers];
-    return _containers.some((node2) => contains(node2, target)) || layerStack.isInNestedLayer(node, target);
+    return _containers.some((node2) => (0, import_dom_query4.contains)(node2, target)) || layerStack.isInNestedLayer(node, target);
   }
   const cleanups = [
     pointerBlocking ? disablePointerEventsOutside(node) : void 0,
-    trackEscapeKeydown(onEscapeKeyDown),
+    trackEscapeKeydown(node, onEscapeKeyDown),
     (0, import_interact_outside.trackInteractOutside)(node, { exclude, onFocusOutside, onPointerDownOutside })
   ];
   return () => {
     layerStack.remove(node);
     assignPointerEventToLayers();
     clearPointerEvent(node);
-    cleanups.forEach((fn) => fn == null ? void 0 : fn());
+    cleanups.forEach((fn) => fn?.());
   };
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/index.mjs

@@ -1,9 +1,9 @@
 import {
   trackDismissableElement
-} from "./chunk-PYR5T5VL.mjs";
-import "./chunk-3ZVQOINJ.mjs";
-import "./chunk-6YFBZALL.mjs";
-import "./chunk-PFLX3TD5.mjs";
+} from "./chunk-5BMACJNB.mjs";
+import "./chunk-BBFIKTYR.mjs";
+import "./chunk-C5KU67MN.mjs";
+import "./chunk-G4GHYT27.mjs";
 export {
   trackDismissableElement
 };

package/dist/layer-stack.js

@@ -23,18 +23,7 @@ __export(layer_stack_exports, {
   layerStack: () => layerStack
 });
 module.exports = __toCommonJS(layer_stack_exports);
-
-// ../dom/src/query.ts
-function contains(parent, child) {
-  if (!parent)
-    return false;
-  return parent === child || isHTMLElement(parent) && isHTMLElement(child) && parent.contains(child);
-}
-function isHTMLElement(v) {
-  return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
-}
-
-// src/layer-stack.ts
+var import_dom_query = require("@zag-js/dom-query");
 var layerStack = {
   layers: [],
   branches: [],
@@ -51,23 +40,22 @@ var layerStack = {
     return this.pointerBlockingLayers().length > 0;
   },
   isBelowPointerBlockingLayer(node) {
-    var _a;
     const index = this.indexOf(node);
-    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf((_a = this.topMostPointerBlockingLayer()) == null ? void 0 : _a.node) : -1;
+    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf(this.topMostPointerBlockingLayer()?.node) : -1;
     return index < highestBlockingIndex;
   },
   isTopMost(node) {
     const layer = this.layers[this.count() - 1];
-    return (layer == null ? void 0 : layer.node) === node;
+    return layer?.node === node;
   },
   getNestedLayers(node) {
     return Array.from(this.layers).slice(this.indexOf(node) + 1);
   },
   isInNestedLayer(node, target) {
-    return this.getNestedLayers(node).some((layer) => contains(layer.node, target));
+    return this.getNestedLayers(node).some((layer) => (0, import_dom_query.contains)(layer.node, target));
   },
   isInBranch(target) {
-    return Array.from(this.branches).some((branch) => contains(branch, target));
+    return Array.from(this.branches).some((branch) => (0, import_dom_query.contains)(branch, target));
   },
   add(layer) {
     this.layers.push(layer);
@@ -94,8 +82,7 @@ var layerStack = {
     return this.layers.findIndex((layer) => layer.node === node);
   },
   dismiss(node) {
-    var _a;
-    (_a = this.layers[this.indexOf(node)]) == null ? void 0 : _a.dismiss();
+    this.layers[this.indexOf(node)]?.dismiss();
   },
   clear() {
     this.remove(this.layers[0].node);

package/dist/layer-stack.mjs

@@ -1,6 +1,6 @@
 import {
   layerStack
-} from "./chunk-PFLX3TD5.mjs";
+} from "./chunk-G4GHYT27.mjs";
 export {
   layerStack
 };

package/dist/pointer-event-outside.js

@@ -25,32 +25,10 @@ __export(pointer_event_outside_exports, {
   disablePointerEventsOutside: () => disablePointerEventsOutside
 });
 module.exports = __toCommonJS(pointer_event_outside_exports);
-
-// ../dom/src/query.ts
-function isDocument(el) {
-  return el.nodeType === Node.DOCUMENT_NODE;
-}
-function isWindow(value) {
-  return (value == null ? void 0 : value.toString()) === "[object Window]";
-}
-function getDocument(el) {
-  var _a;
-  if (isWindow(el))
-    return el.document;
-  if (isDocument(el))
-    return el;
-  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
-}
-function contains(parent, child) {
-  if (!parent)
-    return false;
-  return parent === child || isHTMLElement(parent) && isHTMLElement(child) && parent.contains(child);
-}
-function isHTMLElement(v) {
-  return typeof v === "object" && (v == null ? void 0 : v.nodeType) === Node.ELEMENT_NODE && typeof (v == null ? void 0 : v.nodeName) === "string";
-}
+var import_dom_query2 = require("@zag-js/dom-query");
 
 // src/layer-stack.ts
+var import_dom_query = require("@zag-js/dom-query");
 var layerStack = {
   layers: [],
   branches: [],
@@ -67,23 +45,22 @@ var layerStack = {
     return this.pointerBlockingLayers().length > 0;
   },
   isBelowPointerBlockingLayer(node) {
-    var _a;
     const index = this.indexOf(node);
-    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf((_a = this.topMostPointerBlockingLayer()) == null ? void 0 : _a.node) : -1;
+    const highestBlockingIndex = this.topMostPointerBlockingLayer() ? this.indexOf(this.topMostPointerBlockingLayer()?.node) : -1;
     return index < highestBlockingIndex;
   },
   isTopMost(node) {
     const layer = this.layers[this.count() - 1];
-    return (layer == null ? void 0 : layer.node) === node;
+    return layer?.node === node;
   },
   getNestedLayers(node) {
     return Array.from(this.layers).slice(this.indexOf(node) + 1);
   },
   isInNestedLayer(node, target) {
-    return this.getNestedLayers(node).some((layer) => contains(layer.node, target));
+    return this.getNestedLayers(node).some((layer) => (0, import_dom_query.contains)(layer.node, target));
   },
   isInBranch(target) {
-    return Array.from(this.branches).some((branch) => contains(branch, target));
+    return Array.from(this.branches).some((branch) => (0, import_dom_query.contains)(branch, target));
   },
   add(layer) {
     this.layers.push(layer);
@@ -110,8 +87,7 @@ var layerStack = {
     return this.layers.findIndex((layer) => layer.node === node);
   },
   dismiss(node) {
-    var _a;
-    (_a = this.layers[this.indexOf(node)]) == null ? void 0 : _a.dismiss();
+    this.layers[this.indexOf(node)]?.dismiss();
   },
   clear() {
     this.remove(this.layers[0].node);
@@ -130,7 +106,7 @@ function clearPointerEvent(node) {
 }
 var DATA_ATTR = "data-inert";
 function disablePointerEventsOutside(node) {
-  const doc = getDocument(node);
+  const doc = (0, import_dom_query2.getDocument)(node);
   if (layerStack.hasPointerBlockingLayer() && !doc.body.hasAttribute(DATA_ATTR)) {
     originalBodyPointerEvents = document.body.style.pointerEvents;
     doc.body.style.pointerEvents = "none";

package/dist/pointer-event-outside.mjs

@@ -2,8 +2,8 @@ import {
   assignPointerEventToLayers,
   clearPointerEvent,
   disablePointerEventsOutside
-} from "./chunk-6YFBZALL.mjs";
-import "./chunk-PFLX3TD5.mjs";
+} from "./chunk-C5KU67MN.mjs";
+import "./chunk-G4GHYT27.mjs";
 export {
   assignPointerEventToLayers,
   clearPointerEvent,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/dismissable",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "Dismissable layer utilities for the DOM",
   "keywords": [
     "js",
@@ -23,12 +23,13 @@
     "access": "public"
   },
   "dependencies": {
-    "@zag-js/interact-outside": "0.2.1"
+    "@zag-js/interact-outside": "0.2.3",
+    "@zag-js/dom-event": "0.0.1",
+    "@zag-js/utils": "0.3.3",
+    "@zag-js/dom-query": "0.1.3"
   },
   "devDependencies": {
-    "clean-package": "2.2.0",
-    "@zag-js/dom-utils": "0.2.2",
-    "@zag-js/utils": "0.3.2"
+    "clean-package": "2.2.0"
   },
   "bugs": {
     "url": "https://github.com/chakra-ui/zag/issues"

package/dist/chunk-3ZVQOINJ.mjs

@@ -1,31 +0,0 @@
-// ../core/src/functions.ts
-var runIfFn = (v, ...a) => {
-  const res = typeof v === "function" ? v(...a) : v;
-  return res != null ? res : void 0;
-};
-
-// ../core/src/guard.ts
-var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-
-// ../dom/src/listener.ts
-var isRef = (v) => hasProp(v, "current");
-function addDomEvent(target, eventName, handler, options) {
-  const node = isRef(target) ? target.current : runIfFn(target);
-  node == null ? void 0 : node.addEventListener(eventName, handler, options);
-  return () => {
-    node == null ? void 0 : node.removeEventListener(eventName, handler, options);
-  };
-}
-
-// src/escape-keydown.ts
-function trackEscapeKeydown(fn) {
-  const handleKeyDown = (event) => {
-    if (event.key === "Escape")
-      fn == null ? void 0 : fn(event);
-  };
-  return addDomEvent(document, "keydown", handleKeyDown);
-}
-
-export {
-  trackEscapeKeydown
-};