@zag-js/dismissable 1.45.0 → 1.47.0

package/dist/dismissable-layer.d.mts

@@ -1,4 +1,4 @@
-import { InteractOutsideHandlers } from '@zag-js/interact-outside';
+import { InteractOutsideHandlers, PointerDownOutsideEvent, FocusOutsideEvent } from '@zag-js/interact-outside';
 import { MaybeFunction } from '@zag-js/utils';
 import { LayerDismissEvent, LayerStyleTarget, LayerType } from './layer-stack.mjs';
 
@@ -39,9 +39,9 @@ interface DismissableElementOptions extends DismissableElementHandlers, Persiste
      */
     pointerBlocking?: boolean | undefined;
     /**
-     * Function called when the dismissable element is dismissed
+     * Function called when the dismissable element is dismissed, with the event that caused it
      */
-    onDismiss: VoidFunction;
+    onDismiss: (event?: KeyboardEvent | PointerDownOutsideEvent | FocusOutsideEvent) => void;
     /**
      * Exclude containers from the interact outside event
      */
@@ -50,6 +50,10 @@ interface DismissableElementOptions extends DismissableElementHandlers, Persiste
      * Defer the interact outside event to the next frame
      */
     defer?: boolean | undefined;
+    /**
+     * The root the node is queried from, observed while the node is deferred
+     */
+    getRootNode?: (() => Node) | undefined;
     /**
      * Whether to warn when the node is `null` or `undefined`
      */
@@ -60,8 +64,6 @@ interface DismissableElementOptions extends DismissableElementHandlers, Persiste
     type?: LayerType | undefined;
 }
 declare function trackDismissableElement(nodeOrFn: NodeOrFn, options: DismissableElementOptions): VoidFunction;
-declare function trackDismissableBranch(nodeOrFn: NodeOrFn, options?: {
-    defer?: boolean | undefined;
-}): VoidFunction;
+declare function trackDismissableBranch(nodeOrFn: NodeOrFn, options?: Pick<DismissableElementOptions, "defer" | "getRootNode">): VoidFunction;
 
 export { type DismissableElementHandlers, type DismissableElementOptions, type PersistentElementOptions, trackDismissableBranch, trackDismissableElement };

package/dist/dismissable-layer.d.ts

@@ -1,4 +1,4 @@
-import { InteractOutsideHandlers } from '@zag-js/interact-outside';
+import { InteractOutsideHandlers, PointerDownOutsideEvent, FocusOutsideEvent } from '@zag-js/interact-outside';
 import { MaybeFunction } from '@zag-js/utils';
 import { LayerDismissEvent, LayerStyleTarget, LayerType } from './layer-stack.js';
 
@@ -39,9 +39,9 @@ interface DismissableElementOptions extends DismissableElementHandlers, Persiste
      */
     pointerBlocking?: boolean | undefined;
     /**
-     * Function called when the dismissable element is dismissed
+     * Function called when the dismissable element is dismissed, with the event that caused it
      */
-    onDismiss: VoidFunction;
+    onDismiss: (event?: KeyboardEvent | PointerDownOutsideEvent | FocusOutsideEvent) => void;
     /**
      * Exclude containers from the interact outside event
      */
@@ -50,6 +50,10 @@ interface DismissableElementOptions extends DismissableElementHandlers, Persiste
      * Defer the interact outside event to the next frame
      */
     defer?: boolean | undefined;
+    /**
+     * The root the node is queried from, observed while the node is deferred
+     */
+    getRootNode?: (() => Node) | undefined;
     /**
      * Whether to warn when the node is `null` or `undefined`
      */
@@ -60,8 +64,6 @@ interface DismissableElementOptions extends DismissableElementHandlers, Persiste
     type?: LayerType | undefined;
 }
 declare function trackDismissableElement(nodeOrFn: NodeOrFn, options: DismissableElementOptions): VoidFunction;
-declare function trackDismissableBranch(nodeOrFn: NodeOrFn, options?: {
-    defer?: boolean | undefined;
-}): VoidFunction;
+declare function trackDismissableBranch(nodeOrFn: NodeOrFn, options?: Pick<DismissableElementOptions, "defer" | "getRootNode">): VoidFunction;
 
 export { type DismissableElementHandlers, type DismissableElementOptions, type PersistentElementOptions, trackDismissableBranch, trackDismissableElement };

package/dist/dismissable-layer.js

@@ -59,7 +59,7 @@ function trackDismissableElementImpl(node, options) {
     if (debug) {
       console.log("onPointerDownOutside:", event.detail.originalEvent);
     }
-    onDismiss?.();
+    onDismiss?.(event);
   }
   function onFocusOutside(event) {
     const target = (0, import_dom_query.getEventTarget)(event.detail.originalEvent);
@@ -70,14 +70,14 @@ function trackDismissableElementImpl(node, options) {
     if (debug) {
       console.log("onFocusOutside:", event.detail.originalEvent);
     }
-    onDismiss?.();
+    onDismiss?.(event);
   }
   function onEscapeKeyDown(event) {
     if (!import_layer_stack.layerStack.isTopMost(node)) return;
     options.onEscapeKeyDown?.(event);
     if (!event.defaultPrevented && onDismiss) {
       event.preventDefault();
-      onDismiss();
+      onDismiss(event);
     }
   }
   function exclude(target) {
@@ -103,6 +103,7 @@ function trackDismissableElement(nodeOrFn, options) {
   const { warnOnMissingNode = true } = options;
   return (0, import_dom_query.whenNode)(nodeOrFn, (node) => trackDismissableElementImpl(node, options), {
     defer: options.defer,
+    getRootNode: options.getRootNode,
     onMissing: warnOnMissingNode ? () => (0, import_utils.warn)("[@zag-js/dismissable] node is `null` or `undefined`") : void 0
   });
 }
@@ -117,6 +118,7 @@ function trackDismissableBranch(nodeOrFn, options = {}) {
     },
     {
       defer: options.defer,
+      getRootNode: options.getRootNode,
       onMissing: () => (0, import_utils.warn)("[@zag-js/dismissable] branch node is `null` or `undefined`")
     }
   );

package/dist/dismissable-layer.mjs

@@ -36,7 +36,7 @@ function trackDismissableElementImpl(node, options) {
     if (debug) {
       console.log("onPointerDownOutside:", event.detail.originalEvent);
     }
-    onDismiss?.();
+    onDismiss?.(event);
   }
   function onFocusOutside(event) {
     const target = getEventTarget(event.detail.originalEvent);
@@ -47,14 +47,14 @@ function trackDismissableElementImpl(node, options) {
     if (debug) {
       console.log("onFocusOutside:", event.detail.originalEvent);
     }
-    onDismiss?.();
+    onDismiss?.(event);
   }
   function onEscapeKeyDown(event) {
     if (!layerStack.isTopMost(node)) return;
     options.onEscapeKeyDown?.(event);
     if (!event.defaultPrevented && onDismiss) {
       event.preventDefault();
-      onDismiss();
+      onDismiss(event);
     }
   }
   function exclude(target) {
@@ -80,6 +80,7 @@ function trackDismissableElement(nodeOrFn, options) {
   const { warnOnMissingNode = true } = options;
   return whenNode(nodeOrFn, (node) => trackDismissableElementImpl(node, options), {
     defer: options.defer,
+    getRootNode: options.getRootNode,
     onMissing: warnOnMissingNode ? () => warn("[@zag-js/dismissable] node is `null` or `undefined`") : void 0
   });
 }
@@ -94,6 +95,7 @@ function trackDismissableBranch(nodeOrFn, options = {}) {
     },
     {
       defer: options.defer,
+      getRootNode: options.getRootNode,
       onMissing: () => warn("[@zag-js/dismissable] branch node is `null` or `undefined`")
     }
   );

package/dist/layer-stack.js

@@ -166,7 +166,6 @@ function applyLayerStackMetadata(layer, index, el) {
 function clearLayerStyleMirror(el) {
   el.style.removeProperty("--layer-index");
   el.style.removeProperty("--nested-layer-count");
-  el.style.removeProperty("--z-index");
   el.removeAttribute("data-nested");
   el.removeAttribute("data-has-nested");
 }

package/dist/layer-stack.mjs

@@ -142,7 +142,6 @@ function applyLayerStackMetadata(layer, index, el) {
 function clearLayerStyleMirror(el) {
   el.style.removeProperty("--layer-index");
   el.style.removeProperty("--nested-layer-count");
-  el.style.removeProperty("--z-index");
   el.removeAttribute("data-nested");
   el.removeAttribute("data-has-nested");
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/dismissable",
-  "version": "1.45.0",
+  "version": "1.47.0",
   "description": "Dismissable layer utilities for the DOM",
   "keywords": [
     "js",
@@ -26,9 +26,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@zag-js/dom-query": "1.45.0",
-    "@zag-js/interact-outside": "1.45.0",
-    "@zag-js/utils": "1.45.0"
+    "@zag-js/interact-outside": "1.47.0",
+    "@zag-js/dom-query": "1.47.0",
+    "@zag-js/utils": "1.47.0"
   },
   "devDependencies": {
     "clean-package": "2.2.0"