@seed-design/react-dismissible-layer 0.0.0-alpha-20260511052324 → 1.0.0

package/lib/{DismissibleLayer-12s-Cz1jvGI2.js → DismissibleLayer-12s-BtXreIO0.js}

@@ -3,8 +3,8 @@ import { jsx } from 'react/jsx-runtime';
 import { composeRefs } from '@radix-ui/react-compose-refs';
 import { Slot } from '@radix-ui/react-slot';
 import { forwardRef } from 'react';
-import { u as useDismissibleLayer } from './useDismissibleLayer-12s-C34wvjXv.js';
-import { D as DismissibleParentContext } from './layer-stack-12s-DjRVp1_u.js';
+import { u as useDismissibleLayer } from './useDismissibleLayer-12s-sWGJcPBy.js';
+import { D as DismissibleParentContext } from './layer-stack-12s-BYEm6Mii.js';
 
 const DismissibleLayer = /*#__PURE__*/ forwardRef((props, ref)=>{
     const { children, ...options } = props;

package/lib/{DismissibleLayer-12s-ZXi0vrlt.cjs → DismissibleLayer-12s-ClcF8WmX.cjs}

@@ -3,8 +3,8 @@ var jsxRuntime = require('react/jsx-runtime');
 var reactComposeRefs = require('@radix-ui/react-compose-refs');
 var reactSlot = require('@radix-ui/react-slot');
 var react = require('react');
-var useDismissibleLayer12s = require('./useDismissibleLayer-12s-D4qWttkW.cjs');
-var layerStack12s = require('./layer-stack-12s-Ctg3ipjW.cjs');
+var useDismissibleLayer12s = require('./useDismissibleLayer-12s-Bt4Fi-Z1.cjs');
+var layerStack12s = require('./layer-stack-12s-VHbg4L96.cjs');
 
 const DismissibleLayer = /*#__PURE__*/ react.forwardRef((props, ref)=>{
     const { children, ...options } = props;

package/lib/index.cjs

@@ -1,6 +1,6 @@
-var useDismissibleLayer12s = require('./useDismissibleLayer-12s-D4qWttkW.cjs');
-var DismissibleLayer12s = require('./DismissibleLayer-12s-ZXi0vrlt.cjs');
-var layerStack12s = require('./layer-stack-12s-Ctg3ipjW.cjs');
+var useDismissibleLayer12s = require('./useDismissibleLayer-12s-Bt4Fi-Z1.cjs');
+var DismissibleLayer12s = require('./DismissibleLayer-12s-ClcF8WmX.cjs');
+var layerStack12s = require('./layer-stack-12s-VHbg4L96.cjs');
 
 
 

package/lib/index.d.ts

@@ -1,5 +1,4 @@
 import * as react from 'react';
-import { CSSProperties } from 'react';
 
 interface CascadeDismissDetail {
     /** The layer node that was removed, causing this cascade dismiss. */
@@ -8,7 +7,6 @@ interface CascadeDismissDetail {
 interface Layer {
     node: HTMLElement;
     dismiss: (detail: CascadeDismissDetail) => void;
-    blockPointerEvents?: boolean;
     /**
      * The parent layer's node. Used to determine cascade-dismiss scope.
      * Only layers whose parentNode matches the removed layer's node will be
@@ -39,11 +37,6 @@ interface UseDismissibleLayerOptions {
      * registered in the stack and no event listeners are attached.
      */
     enabled: boolean;
-    /**
-     * When true, disables pointer events on elements outside this layer.
-     * Used for modal overlays (Dialog, BottomSheet).
-     */
-    blockPointerEvents?: boolean;
     /**
      * Called when escape key is pressed while this layer is topmost.
      * Call `event.preventDefault()` to prevent dismiss.
@@ -85,18 +78,6 @@ declare function useDismissibleLayer(options: UseDismissibleLayerOptions): {
         onPointerDownCapture: () => void;
         onFocusCapture: () => void;
         onBlurCapture: () => void;
-        style?: undefined;
-    };
-    isTopLayer: boolean;
-    /** The current layer node, for providing DismissibleParentContext to children. */
-    layerNode: HTMLElement | null;
-} | {
-    dismissibleRef: (el: HTMLElement | null) => void;
-    dismissibleProps: {
-        onPointerDownCapture: () => void;
-        onFocusCapture: () => void;
-        onBlurCapture: () => void;
-        style: CSSProperties;
     };
     isTopLayer: boolean;
     /** The current layer node, for providing DismissibleParentContext to children. */

package/lib/index.js

@@ -1,3 +1,3 @@
-export { u as useDismissibleLayer } from './useDismissibleLayer-12s-C34wvjXv.js';
-export { D as DismissibleLayer } from './DismissibleLayer-12s-Cz1jvGI2.js';
-export { f as LayerStackContext, h as addBranch, i as isTopMost, j as removeBranch, u as useLayerStackContext } from './layer-stack-12s-DjRVp1_u.js';
+export { u as useDismissibleLayer } from './useDismissibleLayer-12s-sWGJcPBy.js';
+export { D as DismissibleLayer } from './DismissibleLayer-12s-BtXreIO0.js';
+export { e as LayerStackContext, f as addBranch, i as isTopMost, g as removeBranch, u as useLayerStackContext } from './layer-stack-12s-BYEm6Mii.js';

package/lib/{layer-stack-12s-DjRVp1_u.js → layer-stack-12s-BYEm6Mii.js}

@@ -35,24 +35,6 @@ function isInNestedLayer(ctx, node, target) {
 function isInBranch(ctx, target) {
     return ctx.branches.some((branch)=>contains(branch, target));
 }
-function isBelowPointerBlockingLayer(ctx, node) {
-    const index = ctx.layers.findIndex((l)=>l.node === node);
-    const blockingLayers = ctx.layers.filter((l)=>l.blockPointerEvents);
-    const highestBlocking = blockingLayers.at(-1);
-    if (!highestBlocking) return false;
-    const highestBlockingIndex = ctx.layers.indexOf(highestBlocking);
-    return index < highestBlockingIndex;
-}
-function getPointerEventsEnabled(ctx, node) {
-    const hasBlocking = ctx.layers.some((l)=>l.blockPointerEvents);
-    if (!hasBlocking) return true;
-    const index = ctx.layers.findIndex((l)=>l.node === node);
-    const blockingLayers = ctx.layers.filter((l)=>l.blockPointerEvents);
-    const highestBlocking = blockingLayers.at(-1);
-    if (!highestBlocking) return true;
-    const highestBlockingIndex = ctx.layers.indexOf(highestBlocking);
-    return index >= highestBlockingIndex;
-}
 function notifyLayerChange() {
     document.dispatchEvent(new CustomEvent(LAYER_UPDATE_EVENT));
 }
@@ -109,4 +91,4 @@ function removeBranch(ctx, node) {
     if (index >= 0) ctx.branches.splice(index, 1);
 }
 
-export { DismissibleParentContext as D, LAYER_UPDATE_EVENT as L, isInBranch as a, isInNestedLayer as b, isBelowPointerBlockingLayer as c, useDismissibleParentNode as d, addLayer as e, LayerStackContext as f, getPointerEventsEnabled as g, addBranch as h, isTopMost as i, removeBranch as j, removeLayer as r, useLayerStackContext as u };
+export { DismissibleParentContext as D, LAYER_UPDATE_EVENT as L, isInBranch as a, isInNestedLayer as b, useDismissibleParentNode as c, addLayer as d, LayerStackContext as e, addBranch as f, removeBranch as g, isTopMost as i, removeLayer as r, useLayerStackContext as u };

package/lib/{layer-stack-12s-Ctg3ipjW.cjs → layer-stack-12s-VHbg4L96.cjs}

@@ -35,24 +35,6 @@ function isInNestedLayer(ctx, node, target) {
 function isInBranch(ctx, target) {
     return ctx.branches.some((branch)=>contains(branch, target));
 }
-function isBelowPointerBlockingLayer(ctx, node) {
-    const index = ctx.layers.findIndex((l)=>l.node === node);
-    const blockingLayers = ctx.layers.filter((l)=>l.blockPointerEvents);
-    const highestBlocking = blockingLayers.at(-1);
-    if (!highestBlocking) return false;
-    const highestBlockingIndex = ctx.layers.indexOf(highestBlocking);
-    return index < highestBlockingIndex;
-}
-function getPointerEventsEnabled(ctx, node) {
-    const hasBlocking = ctx.layers.some((l)=>l.blockPointerEvents);
-    if (!hasBlocking) return true;
-    const index = ctx.layers.findIndex((l)=>l.node === node);
-    const blockingLayers = ctx.layers.filter((l)=>l.blockPointerEvents);
-    const highestBlocking = blockingLayers.at(-1);
-    if (!highestBlocking) return true;
-    const highestBlockingIndex = ctx.layers.indexOf(highestBlocking);
-    return index >= highestBlockingIndex;
-}
 function notifyLayerChange() {
     document.dispatchEvent(new CustomEvent(LAYER_UPDATE_EVENT));
 }
@@ -114,8 +96,6 @@ exports.LAYER_UPDATE_EVENT = LAYER_UPDATE_EVENT;
 exports.LayerStackContext = LayerStackContext;
 exports.addBranch = addBranch;
 exports.addLayer = addLayer;
-exports.getPointerEventsEnabled = getPointerEventsEnabled;
-exports.isBelowPointerBlockingLayer = isBelowPointerBlockingLayer;
 exports.isInBranch = isInBranch;
 exports.isInNestedLayer = isInNestedLayer;
 exports.isTopMost = isTopMost;

package/lib/{use-escape-keydown-12s-Bl_her-_.js → use-escape-keydown-12s-DHQq12u5.js}

@@ -1,6 +1,6 @@
 'use client';
 import { useRef, useEffect } from 'react';
-import { i as isTopMost } from './layer-stack-12s-DjRVp1_u.js';
+import { i as isTopMost } from './layer-stack-12s-BYEm6Mii.js';
 
 /**
  * Tracks escape keydown on the document (capture phase).

package/lib/{use-escape-keydown-12s-CNZqs1dI.cjs → use-escape-keydown-12s-XPuBxyd9.cjs}

@@ -1,6 +1,6 @@
 'use client';
 var react = require('react');
-var layerStack12s = require('./layer-stack-12s-Ctg3ipjW.cjs');
+var layerStack12s = require('./layer-stack-12s-VHbg4L96.cjs');
 
 /**
  * Tracks escape keydown on the document (capture phase).

package/lib/{use-focus-outside-12s-LpFt7UjO.js → use-focus-outside-12s--rnlvSkk.js}

@@ -1,6 +1,6 @@
 'use client';
 import { useRef, useEffect } from 'react';
-import { a as isInBranch, b as isInNestedLayer } from './layer-stack-12s-DjRVp1_u.js';
+import { a as isInBranch, b as isInNestedLayer } from './layer-stack-12s-BYEm6Mii.js';
 
 /**
  * Detects focus events outside a React subtree.

package/lib/{use-focus-outside-12s-Ch-SoiiA.cjs → use-focus-outside-12s-C_884sbw.cjs}

@@ -1,6 +1,6 @@
 'use client';
 var react = require('react');
-var layerStack12s = require('./layer-stack-12s-Ctg3ipjW.cjs');
+var layerStack12s = require('./layer-stack-12s-VHbg4L96.cjs');
 
 /**
  * Detects focus events outside a React subtree.

package/lib/{use-pointer-down-outside-12s-nlxC-DrD.cjs → use-pointer-down-outside-12s-Bj7Jt4l5.cjs}

@@ -1,6 +1,6 @@
 'use client';
 var react = require('react');
-var layerStack12s = require('./layer-stack-12s-Ctg3ipjW.cjs');
+var layerStack12s = require('./layer-stack-12s-VHbg4L96.cjs');
 
 /**
  * Detects pointer-down events outside a React subtree.
@@ -26,7 +26,6 @@ var layerStack12s = require('./layer-stack-12s-Ctg3ipjW.cjs');
         const ownerDocument = node.ownerDocument ?? document;
         function isOutsideLayer(target) {
             if (!layerStack12s.isTopMost(ctx, node)) return false;
-            if (layerStack12s.isBelowPointerBlockingLayer(ctx, node)) return false;
             if (layerStack12s.isInBranch(ctx, target)) return false;
             if (layerStack12s.isInNestedLayer(ctx, node, target)) return false;
             return true;

package/lib/{use-pointer-down-outside-12s-BLctGw0m.js → use-pointer-down-outside-12s-Bk1SE4lm.js}

@@ -1,6 +1,6 @@
 'use client';
 import { useRef, useEffect } from 'react';
-import { i as isTopMost, c as isBelowPointerBlockingLayer, a as isInBranch, b as isInNestedLayer } from './layer-stack-12s-DjRVp1_u.js';
+import { i as isTopMost, a as isInBranch, b as isInNestedLayer } from './layer-stack-12s-BYEm6Mii.js';
 
 /**
  * Detects pointer-down events outside a React subtree.
@@ -26,7 +26,6 @@ import { i as isTopMost, c as isBelowPointerBlockingLayer, a as isInBranch, b as
         const ownerDocument = node.ownerDocument ?? document;
         function isOutsideLayer(target) {
             if (!isTopMost(ctx, node)) return false;
-            if (isBelowPointerBlockingLayer(ctx, node)) return false;
             if (isInBranch(ctx, target)) return false;
             if (isInNestedLayer(ctx, node, target)) return false;
             return true;

package/lib/{useDismissibleLayer-12s-D4qWttkW.cjs → useDismissibleLayer-12s-Bt4Fi-Z1.cjs}

@@ -1,18 +1,13 @@
 'use client';
 var react = require('react');
-var layerStack12s = require('./layer-stack-12s-Ctg3ipjW.cjs');
-var useEscapeKeydown12s = require('./use-escape-keydown-12s-CNZqs1dI.cjs');
-var usePointerDownOutside12s = require('./use-pointer-down-outside-12s-nlxC-DrD.cjs');
-var useFocusOutside12s = require('./use-focus-outside-12s-Ch-SoiiA.cjs');
+var layerStack12s = require('./layer-stack-12s-VHbg4L96.cjs');
+var useEscapeKeydown12s = require('./use-escape-keydown-12s-XPuBxyd9.cjs');
+var usePointerDownOutside12s = require('./use-pointer-down-outside-12s-Bj7Jt4l5.cjs');
+var useFocusOutside12s = require('./use-focus-outside-12s-C_884sbw.cjs');
 
 const NOOP = ()=>{};
-// Module-level storage for the original body pointer-events value.
-// Follows Radix's pattern: save once when the first blocking layer mounts,
-// restore when the last blocking layer unmounts. This decouples save/restore
-// from React's bottom-up cleanup order.
-let originalBodyPointerEvents;
 function useDismissibleLayer(options) {
-    const { enabled, blockPointerEvents = false, onEscapeKeyDown, onPressOutside, onFocusOutside, onCascadeDismiss, exclude, pressBehavior } = options;
+    const { enabled, onEscapeKeyDown, onPressOutside, onFocusOutside, onCascadeDismiss, exclude, pressBehavior } = options;
     const ctx = layerStack12s.useLayerStackContext();
     const parentNode = layerStack12s.useDismissibleParentNode();
     const [node, setNode] = react.useState(null);
@@ -33,7 +28,6 @@ function useDismissibleLayer(options) {
         const layer = {
             node,
             dismiss: (detail)=>onCascadeDismissRef.current?.(detail),
-            blockPointerEvents,
             parentNode
         };
         layerStack12s.addLayer(ctx, layer);
@@ -43,38 +37,10 @@ function useDismissibleLayer(options) {
     }, [
         node,
         enabled,
-        blockPointerEvents,
         ctx,
         parentNode
     ]);
-    // -- Pointer event blocking --
-    // Follows Radix's pattern: save original value once when the first blocking
-    // layer mounts, restore when the last unmounts. The module-level variable
-    // decouples save/restore from React's bottom-up cleanup order.
-    react.useEffect(()=>{
-        if (!node || !enabled || !blockPointerEvents) return;
-        const ownerDocument = node.ownerDocument ?? document;
-        const blockingLayers = ctx.layers.filter((l)=>l.blockPointerEvents);
-        if (blockingLayers.length === 1) {
-            // First blocking layer — save the original value and block
-            originalBodyPointerEvents = ownerDocument.body.style.pointerEvents;
-            ownerDocument.body.style.pointerEvents = "none";
-        }
-        return ()=>{
-            // Check count BEFORE this layer is removed from ctx.layers.
-            // At cleanup time, this layer is still in the array.
-            const remainingBlocking = ctx.layers.filter((l)=>l.blockPointerEvents && l.node !== node);
-            if (remainingBlocking.length === 0) {
-                ownerDocument.body.style.pointerEvents = originalBodyPointerEvents;
-            }
-        };
-    }, [
-        node,
-        enabled,
-        blockPointerEvents,
-        ctx
-    ]);
-    // -- Subscribe to layer changes for style updates --
+    // -- Subscribe to layer changes to keep isTopLayer fresh --
     react.useEffect(()=>{
         if (!enabled) return;
         const handler = ()=>forceRender({});
@@ -111,12 +77,6 @@ function useDismissibleLayer(options) {
         exclude,
         onFocusOutside: handleFocusOutside
     });
-    // -- Compute pointer-events style --
-    const hasBlocking = ctx.layers.some((l)=>l.blockPointerEvents);
-    const pointerEventsEnabled = node ? layerStack12s.getPointerEventsEnabled(ctx, node) : true;
-    const style = hasBlocking ? {
-        pointerEvents: pointerEventsEnabled ? "auto" : "none"
-    } : {};
     const topLayer = node ? layerStack12s.isTopMost(ctx, node) : true;
     if (!enabled) {
         return {
@@ -135,8 +95,7 @@ function useDismissibleLayer(options) {
         dismissibleProps: {
             onPointerDownCapture: pressOutsideProps.onPointerDownCapture,
             onFocusCapture: focusOutsideProps.onFocusCapture,
-            onBlurCapture: focusOutsideProps.onBlurCapture,
-            style
+            onBlurCapture: focusOutsideProps.onBlurCapture
         },
         isTopLayer: topLayer,
         /** The current layer node, for providing DismissibleParentContext to children. */ layerNode: node

package/lib/{useDismissibleLayer-12s-C34wvjXv.js → useDismissibleLayer-12s-sWGJcPBy.js}

@@ -1,18 +1,13 @@
 'use client';
 import { useState, useCallback, useRef, useEffect } from 'react';
-import { u as useLayerStackContext, d as useDismissibleParentNode, e as addLayer, r as removeLayer, L as LAYER_UPDATE_EVENT, g as getPointerEventsEnabled, i as isTopMost } from './layer-stack-12s-DjRVp1_u.js';
-import { u as useEscapeKeydown } from './use-escape-keydown-12s-Bl_her-_.js';
-import { u as usePointerDownOutside } from './use-pointer-down-outside-12s-BLctGw0m.js';
-import { u as useFocusOutside } from './use-focus-outside-12s-LpFt7UjO.js';
+import { u as useLayerStackContext, c as useDismissibleParentNode, d as addLayer, r as removeLayer, L as LAYER_UPDATE_EVENT, i as isTopMost } from './layer-stack-12s-BYEm6Mii.js';
+import { u as useEscapeKeydown } from './use-escape-keydown-12s-DHQq12u5.js';
+import { u as usePointerDownOutside } from './use-pointer-down-outside-12s-Bk1SE4lm.js';
+import { u as useFocusOutside } from './use-focus-outside-12s--rnlvSkk.js';
 
 const NOOP = ()=>{};
-// Module-level storage for the original body pointer-events value.
-// Follows Radix's pattern: save once when the first blocking layer mounts,
-// restore when the last blocking layer unmounts. This decouples save/restore
-// from React's bottom-up cleanup order.
-let originalBodyPointerEvents;
 function useDismissibleLayer(options) {
-    const { enabled, blockPointerEvents = false, onEscapeKeyDown, onPressOutside, onFocusOutside, onCascadeDismiss, exclude, pressBehavior } = options;
+    const { enabled, onEscapeKeyDown, onPressOutside, onFocusOutside, onCascadeDismiss, exclude, pressBehavior } = options;
     const ctx = useLayerStackContext();
     const parentNode = useDismissibleParentNode();
     const [node, setNode] = useState(null);
@@ -33,7 +28,6 @@ function useDismissibleLayer(options) {
         const layer = {
             node,
             dismiss: (detail)=>onCascadeDismissRef.current?.(detail),
-            blockPointerEvents,
             parentNode
         };
         addLayer(ctx, layer);
@@ -43,38 +37,10 @@ function useDismissibleLayer(options) {
     }, [
         node,
         enabled,
-        blockPointerEvents,
         ctx,
         parentNode
     ]);
-    // -- Pointer event blocking --
-    // Follows Radix's pattern: save original value once when the first blocking
-    // layer mounts, restore when the last unmounts. The module-level variable
-    // decouples save/restore from React's bottom-up cleanup order.
-    useEffect(()=>{
-        if (!node || !enabled || !blockPointerEvents) return;
-        const ownerDocument = node.ownerDocument ?? document;
-        const blockingLayers = ctx.layers.filter((l)=>l.blockPointerEvents);
-        if (blockingLayers.length === 1) {
-            // First blocking layer — save the original value and block
-            originalBodyPointerEvents = ownerDocument.body.style.pointerEvents;
-            ownerDocument.body.style.pointerEvents = "none";
-        }
-        return ()=>{
-            // Check count BEFORE this layer is removed from ctx.layers.
-            // At cleanup time, this layer is still in the array.
-            const remainingBlocking = ctx.layers.filter((l)=>l.blockPointerEvents && l.node !== node);
-            if (remainingBlocking.length === 0) {
-                ownerDocument.body.style.pointerEvents = originalBodyPointerEvents;
-            }
-        };
-    }, [
-        node,
-        enabled,
-        blockPointerEvents,
-        ctx
-    ]);
-    // -- Subscribe to layer changes for style updates --
+    // -- Subscribe to layer changes to keep isTopLayer fresh --
     useEffect(()=>{
         if (!enabled) return;
         const handler = ()=>forceRender({});
@@ -111,12 +77,6 @@ function useDismissibleLayer(options) {
         exclude,
         onFocusOutside: handleFocusOutside
     });
-    // -- Compute pointer-events style --
-    const hasBlocking = ctx.layers.some((l)=>l.blockPointerEvents);
-    const pointerEventsEnabled = node ? getPointerEventsEnabled(ctx, node) : true;
-    const style = hasBlocking ? {
-        pointerEvents: pointerEventsEnabled ? "auto" : "none"
-    } : {};
     const topLayer = node ? isTopMost(ctx, node) : true;
     if (!enabled) {
         return {
@@ -135,8 +95,7 @@ function useDismissibleLayer(options) {
         dismissibleProps: {
             onPointerDownCapture: pressOutsideProps.onPointerDownCapture,
             onFocusCapture: focusOutsideProps.onFocusCapture,
-            onBlurCapture: focusOutsideProps.onBlurCapture,
-            style
+            onBlurCapture: focusOutsideProps.onBlurCapture
         },
         isTopLayer: topLayer,
         /** The current layer node, for providing DismissibleParentContext to children. */ layerNode: node

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seed-design/react-dismissible-layer",
-  "version": "0.0.0-alpha-20260511052324",
+  "version": "1.0.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/daangn/seed-design.git",

package/src/layer-stack.test.ts

@@ -7,8 +7,6 @@ import {
   isTopMost,
   isInNestedLayer,
   isInBranch,
-  isBelowPointerBlockingLayer,
-  getPointerEventsEnabled,
   type LayerStackContextValue,
   type Layer,
 } from "./layer-stack";
@@ -58,12 +56,12 @@ describe("layer-stack", () => {
 
     it("replaces existing layer when same node is added twice", () => {
       const node = createNode();
-      const first = createLayer(node, { blockPointerEvents: false });
-      const second = createLayer(node, { blockPointerEvents: true });
+      const first = createLayer(node);
+      const second = createLayer(node);
       addLayer(ctx, first);
       addLayer(ctx, second);
       expect(ctx.layers).toHaveLength(1);
-      expect(ctx.layers[0].blockPointerEvents).toBe(true);
+      expect(ctx.layers[0].dismiss).toBe(second.dismiss);
     });
   });
 
@@ -257,35 +255,4 @@ describe("layer-stack", () => {
       expect(ctx.branches).toHaveLength(0);
     });
   });
-  describe("pointer blocking", () => {
-    it("isBelowPointerBlockingLayer returns false when no blocking layers", () => {
-      const node = createNode();
-      addLayer(ctx, createLayer(node));
-      expect(isBelowPointerBlockingLayer(ctx, node)).toBe(false);
-    });
-
-    it("isBelowPointerBlockingLayer returns true when below a blocking layer", () => {
-      const dialog = createNode("dialog");
-      const menu = createNode("menu");
-      addLayer(ctx, createLayer(dialog, { blockPointerEvents: true }));
-      addLayer(ctx, createLayer(menu, { blockPointerEvents: true }));
-      expect(isBelowPointerBlockingLayer(ctx, dialog)).toBe(true);
-      expect(isBelowPointerBlockingLayer(ctx, menu)).toBe(false);
-    });
-
-    it("getPointerEventsEnabled returns true when no blocking layers", () => {
-      const node = createNode();
-      addLayer(ctx, createLayer(node));
-      expect(getPointerEventsEnabled(ctx, node)).toBe(true);
-    });
-
-    it("getPointerEventsEnabled returns false for layers below the highest blocking layer", () => {
-      const dialog = createNode("dialog");
-      const menu = createNode("menu");
-      addLayer(ctx, createLayer(dialog, { blockPointerEvents: true }));
-      addLayer(ctx, createLayer(menu, { blockPointerEvents: true }));
-      expect(getPointerEventsEnabled(ctx, dialog)).toBe(false);
-      expect(getPointerEventsEnabled(ctx, menu)).toBe(true);
-    });
-  });
 });

package/src/layer-stack.ts

@@ -10,7 +10,6 @@ export interface CascadeDismissDetail {
 export interface Layer {
   node: HTMLElement;
   dismiss: (detail: CascadeDismissDetail) => void;
-  blockPointerEvents?: boolean;
   /**
    * The parent layer's node. Used to determine cascade-dismiss scope.
    * Only layers whose parentNode matches the removed layer's node will be
@@ -75,32 +74,6 @@ export function isInBranch(ctx: LayerStackContextValue, target: EventTarget | nu
   return ctx.branches.some((branch) => contains(branch, target));
 }
 
-export function isBelowPointerBlockingLayer(
-  ctx: LayerStackContextValue,
-  node: HTMLElement,
-): boolean {
-  const index = ctx.layers.findIndex((l) => l.node === node);
-  const blockingLayers = ctx.layers.filter((l) => l.blockPointerEvents);
-  const highestBlocking = blockingLayers.at(-1);
-  if (!highestBlocking) return false;
-
-  const highestBlockingIndex = ctx.layers.indexOf(highestBlocking);
-  return index < highestBlockingIndex;
-}
-
-export function getPointerEventsEnabled(ctx: LayerStackContextValue, node: HTMLElement): boolean {
-  const hasBlocking = ctx.layers.some((l) => l.blockPointerEvents);
-  if (!hasBlocking) return true;
-
-  const index = ctx.layers.findIndex((l) => l.node === node);
-  const blockingLayers = ctx.layers.filter((l) => l.blockPointerEvents);
-  const highestBlocking = blockingLayers.at(-1);
-  if (!highestBlocking) return true;
-
-  const highestBlockingIndex = ctx.layers.indexOf(highestBlocking);
-  return index >= highestBlockingIndex;
-}
-
 export function notifyLayerChange() {
   document.dispatchEvent(new CustomEvent(LAYER_UPDATE_EVENT));
 }

package/src/use-pointer-down-outside.ts

@@ -1,13 +1,7 @@
 "use client";
 
 import { useEffect, useRef } from "react";
-import {
-  isBelowPointerBlockingLayer,
-  isInBranch,
-  isInNestedLayer,
-  isTopMost,
-  type LayerStackContextValue,
-} from "./layer-stack";
+import { isInBranch, isInNestedLayer, isTopMost, type LayerStackContextValue } from "./layer-stack";
 
 export interface UsePointerDownOutsideOptions {
   enabled: boolean;
@@ -74,7 +68,6 @@ export function usePointerDownOutside(
 
     function isOutsideLayer(target: HTMLElement): boolean {
       if (!isTopMost(ctx, node!)) return false;
-      if (isBelowPointerBlockingLayer(ctx, node!)) return false;
       if (isInBranch(ctx, target)) return false;
       if (isInNestedLayer(ctx, node!, target)) return false;
       return true;

package/src/useDismissibleLayer.test.tsx

@@ -631,102 +631,4 @@ describe("useDismissibleLayer", () => {
       expect(onFocusOutside).toHaveBeenCalledTimes(1);
     });
   });
-
-  describe("pointer event blocking", () => {
-    it("restores body.style.pointerEvents after nested blocking layers unmount", async () => {
-      const original = document.body.style.pointerEvents;
-
-      function Harness() {
-        const [showBoth, setShowBoth] = React.useState(true);
-
-        return (
-          <>
-            {showBoth && (
-              <DismissibleBox
-                options={{ enabled: true, blockPointerEvents: true }}
-                data-testid="outer"
-              >
-                <DismissibleBox
-                  options={{ enabled: true, blockPointerEvents: true }}
-                  data-testid="inner"
-                />
-              </DismissibleBox>
-            )}
-            <button type="button" data-testid="unmount" onClick={() => setShowBoth(false)}>
-              Unmount
-            </button>
-          </>
-        );
-      }
-
-      const { getByTestId } = render(<Harness />);
-
-      // Both blocking layers are mounted → body should be "none"
-      expect(document.body.style.pointerEvents).toBe("none");
-
-      // Unmount both layers — React cleans up children before parents
-      await act(async () => getByTestId("unmount").click());
-
-      // body.style.pointerEvents must be restored
-      expect(document.body.style.pointerEvents).toBe(original);
-    });
-
-    it("restores body.style.pointerEvents when blocking layers mount sequentially then unmount together", async () => {
-      const original = document.body.style.pointerEvents;
-
-      function Harness() {
-        const [showFirst, setShowFirst] = React.useState(false);
-        const [showSecond, setShowSecond] = React.useState(false);
-
-        return (
-          <>
-            {showFirst && (
-              <DismissibleBox
-                options={{ enabled: true, blockPointerEvents: true }}
-                data-testid="first"
-              />
-            )}
-            {showSecond && (
-              <DismissibleBox
-                options={{ enabled: true, blockPointerEvents: true }}
-                data-testid="second"
-              />
-            )}
-            <button type="button" data-testid="mount-first" onClick={() => setShowFirst(true)}>
-              Mount First
-            </button>
-            <button type="button" data-testid="mount-second" onClick={() => setShowSecond(true)}>
-              Mount Second
-            </button>
-            <button
-              type="button"
-              data-testid="unmount-all"
-              onClick={() => {
-                setShowFirst(false);
-                setShowSecond(false);
-              }}
-            >
-              Unmount All
-            </button>
-          </>
-        );
-      }
-
-      const { getByTestId } = render(<Harness />);
-
-      // Mount first blocking layer
-      await act(async () => getByTestId("mount-first").click());
-      expect(document.body.style.pointerEvents).toBe("none");
-
-      // Mount second blocking layer
-      await act(async () => getByTestId("mount-second").click());
-      expect(document.body.style.pointerEvents).toBe("none");
-
-      // Unmount both at once
-      await act(async () => getByTestId("unmount-all").click());
-
-      // body.style.pointerEvents must be restored
-      expect(document.body.style.pointerEvents).toBe(original);
-    });
-  });
 });

package/src/useDismissibleLayer.ts

@@ -1,11 +1,10 @@
 "use client";
 
-import { useCallback, useEffect, useRef, useState, type CSSProperties } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import {
   addLayer,
   removeLayer,
   isTopMost,
-  getPointerEventsEnabled,
   useLayerStackContext,
   useDismissibleParentNode,
   LAYER_UPDATE_EVENT,
@@ -22,12 +21,6 @@ export interface UseDismissibleLayerOptions {
    */
   enabled: boolean;
 
-  /**
-   * When true, disables pointer events on elements outside this layer.
-   * Used for modal overlays (Dialog, BottomSheet).
-   */
-  blockPointerEvents?: boolean;
-
   /**
    * Called when escape key is pressed while this layer is topmost.
    * Call `event.preventDefault()` to prevent dismiss.
@@ -71,16 +64,9 @@ export interface UseDismissibleLayerOptions {
 
 const NOOP = () => {};
 
-// Module-level storage for the original body pointer-events value.
-// Follows Radix's pattern: save once when the first blocking layer mounts,
-// restore when the last blocking layer unmounts. This decouples save/restore
-// from React's bottom-up cleanup order.
-let originalBodyPointerEvents: string;
-
 export function useDismissibleLayer(options: UseDismissibleLayerOptions) {
   const {
     enabled,
-    blockPointerEvents = false,
     onEscapeKeyDown,
     onPressOutside,
     onFocusOutside,
@@ -114,7 +100,6 @@ export function useDismissibleLayer(options: UseDismissibleLayerOptions) {
     const layer = {
       node,
       dismiss: (detail: CascadeDismissDetail) => onCascadeDismissRef.current?.(detail),
-      blockPointerEvents,
       parentNode,
     };
 
@@ -123,35 +108,9 @@ export function useDismissibleLayer(options: UseDismissibleLayerOptions) {
     return () => {
       removeLayer(ctx, node);
     };
-  }, [node, enabled, blockPointerEvents, ctx, parentNode]);
+  }, [node, enabled, ctx, parentNode]);
 
-  // -- Pointer event blocking --
-  // Follows Radix's pattern: save original value once when the first blocking
-  // layer mounts, restore when the last unmounts. The module-level variable
-  // decouples save/restore from React's bottom-up cleanup order.
-  useEffect(() => {
-    if (!node || !enabled || !blockPointerEvents) return;
-
-    const ownerDocument = node.ownerDocument ?? document;
-    const blockingLayers = ctx.layers.filter((l) => l.blockPointerEvents);
-
-    if (blockingLayers.length === 1) {
-      // First blocking layer — save the original value and block
-      originalBodyPointerEvents = ownerDocument.body.style.pointerEvents;
-      ownerDocument.body.style.pointerEvents = "none";
-    }
-
-    return () => {
-      // Check count BEFORE this layer is removed from ctx.layers.
-      // At cleanup time, this layer is still in the array.
-      const remainingBlocking = ctx.layers.filter((l) => l.blockPointerEvents && l.node !== node);
-      if (remainingBlocking.length === 0) {
-        ownerDocument.body.style.pointerEvents = originalBodyPointerEvents;
-      }
-    };
-  }, [node, enabled, blockPointerEvents, ctx]);
-
-  // -- Subscribe to layer changes for style updates --
+  // -- Subscribe to layer changes to keep isTopLayer fresh --
   useEffect(() => {
     if (!enabled) return;
     const handler = () => forceRender({});
@@ -195,14 +154,6 @@ export function useDismissibleLayer(options: UseDismissibleLayerOptions) {
     onFocusOutside: handleFocusOutside,
   });
 
-  // -- Compute pointer-events style --
-  const hasBlocking = ctx.layers.some((l) => l.blockPointerEvents);
-  const pointerEventsEnabled = node ? getPointerEventsEnabled(ctx, node) : true;
-
-  const style: CSSProperties = hasBlocking
-    ? { pointerEvents: pointerEventsEnabled ? "auto" : "none" }
-    : {};
-
   const topLayer = node ? isTopMost(ctx, node) : true;
 
   if (!enabled) {
@@ -225,7 +176,6 @@ export function useDismissibleLayer(options: UseDismissibleLayerOptions) {
       onPointerDownCapture: pressOutsideProps.onPointerDownCapture,
       onFocusCapture: focusOutsideProps.onFocusCapture,
       onBlurCapture: focusOutsideProps.onBlurCapture,
-      style,
     },
     isTopLayer: topLayer,
     /** The current layer node, for providing DismissibleParentContext to children. */