@radix-ui/react-dismissable-layer 0.1.4-rc.17 → 0.1.4-rc.18

package/dist/index.d.ts

@@ -36,6 +36,9 @@ export interface DismissableLayerProps extends PrimitiveDivProps {
     onDismiss?: () => void;
 }
 export const DismissableLayer: React.ForwardRefExoticComponent<DismissableLayerProps & React.RefAttributes<HTMLDivElement>>;
+interface DismissableLayerBranchProps extends PrimitiveDivProps {
+}
+export const DismissableLayerBranch: React.ForwardRefExoticComponent<DismissableLayerBranchProps & React.RefAttributes<HTMLDivElement>>;
 type PointerDownOutsideEvent = CustomEvent<{
     originalEvent: PointerEvent;
 }>;
@@ -43,5 +46,6 @@ type FocusOutsideEvent = CustomEvent<{
     originalEvent: FocusEvent;
 }>;
 export const Root: React.ForwardRefExoticComponent<DismissableLayerProps & React.RefAttributes<HTMLDivElement>>;
+export const Branch: React.ForwardRefExoticComponent<DismissableLayerBranchProps & React.RefAttributes<HTMLDivElement>>;
 
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"mappings":"A;A;A;AAyBA,yBAAyB,MAAM,wBAAwB,CAAC,OAAO,UAAU,GAAG,CAAC,CAAC;AAC9E,sCAAgC,SAAQ,iBAAiB;IACvD;A;A;A;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;A;A;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD;A;A;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAChE;A;A;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACpD;A;A;A;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,GAAG,iBAAiB,KAAK,IAAI,CAAC;IACjF;A;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,OAAA,MAAM,8GA6FL,CAAC;AAMF,+BAA+B,WAAW,CAAC;IAAE,aAAa,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAC5E,yBAAyB,WAAW,CAAC;IAAE,aAAa,EAAE,UAAU,CAAA;CAAE,CAAC,CAAC;AAwFpE,OAAA,MAAM,kGAAuB,CAAC","sources":["./packages/react/dismissable-layer/src/packages/react/dismissable-layer/src/DismissableLayer.tsx","./packages/react/dismissable-layer/src/packages/react/dismissable-layer/src/index.ts"],"sourcesContent":[null,null],"names":[],"version":3,"file":"index.d.ts.map"}
+{"mappings":"A;A;A;AA0BA,yBAAyB,MAAM,wBAAwB,CAAC,OAAO,UAAU,GAAG,CAAC,CAAC;AAC9E,sCAAgC,SAAQ,iBAAiB;IACvD;A;A;A;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;A;A;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD;A;A;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAChE;A;A;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACpD;A;A;A;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,GAAG,iBAAiB,KAAK,IAAI,CAAC;IACjF;A;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,OAAA,MAAM,8GAkGL,CAAC;AAWF,qCAAsC,SAAQ,iBAAiB;CAAG;AAElE,OAAA,MAAM,0HAmBJ,CAAC;AAMH,+BAA+B,WAAW,CAAC;IAAE,aAAa,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAC5E,yBAAyB,WAAW,CAAC;IAAE,aAAa,EAAE,UAAU,CAAA;CAAE,CAAC,CAAC;AAwFpE,OAAA,MAAM,kGAAuB,CAAC;AAC9B,OAAA,MAAM,0GAA+B,CAAC","sources":["./packages/react/dismissable-layer/src/packages/react/dismissable-layer/src/DismissableLayer.tsx","./packages/react/dismissable-layer/src/packages/react/dismissable-layer/src/index.ts"],"sourcesContent":[null,null],"names":[],"version":3,"file":"index.d.ts.map"}

package/dist/index.js

@@ -1,2 +1,2 @@
-var e,t,n,r=require("@radix-ui/react-use-escape-keydown").useEscapeKeydown,s=require("@radix-ui/react-use-callback-ref").useCallbackRef,i=require("@radix-ui/react-use-body-pointer-events").useBodyPointerEvents,u=require("@radix-ui/react-compose-refs").useComposedRefs,o=require("@radix-ui/react-primitive").Primitive,a=require("@radix-ui/primitive").composeEventHandlers,d=(e={},t=require("react"),Object.keys(t).forEach((function(n){"default"!==n&&"__esModule"!==n&&Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[n]}})})),e),l=(n=require("@babel/runtime/helpers/extends"))&&n.__esModule?n.default:n;const c=/*#__PURE__*/d.createContext({layers:new Set,layersWithOutsidePointerEventsDisabled:new Set}),f=/*#__PURE__*/d.forwardRef(((e,t)=>{const{disableOutsidePointerEvents:n=!1,onEscapeKeyDown:f,onPointerDownOutside:E,onFocusOutside:m,onInteractOutside:y,onDismiss:b,...w}=e,C=d.useContext(c),[P,O]=d.useState(null),[,D]=d.useState({}),x=u(t,(e=>O(e))),L=Array.from(C.layers),[h]=[...C.layersWithOutsidePointerEventsDisabled].slice(-1),q=L.indexOf(h),g=P?L.indexOf(P):-1,R=C.layersWithOutsidePointerEventsDisabled.size>0,B=g>=q,F=function(e){const t=s(e),n=d.useRef(!1);return d.useEffect((()=>{const e=e=>{if(e.target&&!n.current){p("dismissableLayer.pointerDownOutside",t,{originalEvent:e})}n.current=!1},r=window.setTimeout((()=>{document.addEventListener("pointerdown",e)}),0);return()=>{window.clearTimeout(r),document.removeEventListener("pointerdown",e)}}),[t]),{onPointerDownCapture:()=>n.current=!0}}((e=>{B&&(null==E||E(e),null==y||y(e),e.defaultPrevented||null==b||b())})),W=function(e){const t=s(e),n=d.useRef(!1);return d.useEffect((()=>{const e=e=>{if(e.target&&!n.current){p("dismissableLayer.focusOutside",t,{originalEvent:e})}};return document.addEventListener("focusin",e),()=>document.removeEventListener("focusin",e)}),[t]),{onFocusCapture:()=>n.current=!0,onBlurCapture:()=>n.current=!1}}((e=>{null==m||m(e),null==y||y(e),e.defaultPrevented||null==b||b()}));return r((e=>{g===C.layers.size-1&&(null==f||f(e),e.defaultPrevented||null==b||b())})),i({disabled:n}),d.useEffect((()=>{P&&(n&&C.layersWithOutsidePointerEventsDisabled.add(P),C.layers.add(P),v())}),[P,n,C]),d.useEffect((()=>()=>{P&&(C.layers.delete(P),C.layersWithOutsidePointerEventsDisabled.delete(P),v())}),[P,C]),d.useEffect((()=>{const e=()=>D({});return document.addEventListener("dismissableLayer.update",e),()=>document.removeEventListener("dismissableLayer.update",e)}),[]),/*#__PURE__*/d.createElement(o.div,l({},w,{ref:x,style:{pointerEvents:R?B?"auto":"none":void 0,...e.style},onFocusCapture:a(e.onFocusCapture,W.onFocusCapture),onBlurCapture:a(e.onBlurCapture,W.onBlurCapture),onPointerDownCapture:a(e.onPointerDownCapture,F.onPointerDownCapture)}))}));function v(){const e=new Event("dismissableLayer.update");document.dispatchEvent(e)}function p(e,t,n){const r=n.originalEvent.target,s=new CustomEvent(e,{bubbles:!1,cancelable:!0,detail:n});return t&&r.addEventListener(e,t,{once:!0}),!r.dispatchEvent(s)}exports.DismissableLayer=f;const E=f;exports.Root=E;
+var e,t,n,r=require("@radix-ui/react-use-escape-keydown").useEscapeKeydown,s=require("@radix-ui/react-use-callback-ref").useCallbackRef,i=require("@radix-ui/react-use-body-pointer-events").useBodyPointerEvents,u=require("@radix-ui/react-compose-refs").useComposedRefs,o=require("@radix-ui/react-primitive").Primitive,a=require("@radix-ui/primitive").composeEventHandlers,d=(e={},t=require("react"),Object.keys(t).forEach((function(n){"default"!==n&&"__esModule"!==n&&Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[n]}})})),e),c=(n=require("@babel/runtime/helpers/extends"))&&n.__esModule?n.default:n;const l=/*#__PURE__*/d.createContext({layers:new Set,layersWithOutsidePointerEventsDisabled:new Set,branches:new Set}),f=/*#__PURE__*/d.forwardRef(((e,t)=>{const{disableOutsidePointerEvents:n=!1,onEscapeKeyDown:f,onPointerDownOutside:v,onFocusOutside:E,onInteractOutside:b,onDismiss:y,...w}=e,C=d.useContext(l),[h,P]=d.useState(null),[,x]=d.useState({}),D=u(t,(e=>P(e))),O=Array.from(C.layers),[L]=[...C.layersWithOutsidePointerEventsDisabled].slice(-1),g=O.indexOf(L),q=h?O.indexOf(h):-1,R=C.layersWithOutsidePointerEventsDisabled.size>0,B=q>=g,F=function(e){const t=s(e),n=d.useRef(!1);return d.useEffect((()=>{const e=e=>{if(e.target&&!n.current){m("dismissableLayer.pointerDownOutside",t,{originalEvent:e})}n.current=!1},r=window.setTimeout((()=>{document.addEventListener("pointerdown",e)}),0);return()=>{window.clearTimeout(r),document.removeEventListener("pointerdown",e)}}),[t]),{onPointerDownCapture:()=>n.current=!0}}((e=>{const t=e.target,n=[...C.branches].some((e=>e.contains(t)));B&&!n&&(null==v||v(e),null==b||b(e),e.defaultPrevented||null==y||y())})),S=function(e){const t=s(e),n=d.useRef(!1);return d.useEffect((()=>{const e=e=>{if(e.target&&!n.current){m("dismissableLayer.focusOutside",t,{originalEvent:e})}};return document.addEventListener("focusin",e),()=>document.removeEventListener("focusin",e)}),[t]),{onFocusCapture:()=>n.current=!0,onBlurCapture:()=>n.current=!1}}((e=>{const t=e.target;[...C.branches].some((e=>e.contains(t)))||(null==E||E(e),null==b||b(e),e.defaultPrevented||null==y||y())}));return r((e=>{q===C.layers.size-1&&(null==f||f(e),e.defaultPrevented||null==y||y())})),i({disabled:n}),d.useEffect((()=>{h&&(n&&C.layersWithOutsidePointerEventsDisabled.add(h),C.layers.add(h),p())}),[h,n,C]),d.useEffect((()=>()=>{h&&(C.layers.delete(h),C.layersWithOutsidePointerEventsDisabled.delete(h),p())}),[h,C]),d.useEffect((()=>{const e=()=>x({});return document.addEventListener("dismissableLayer.update",e),()=>document.removeEventListener("dismissableLayer.update",e)}),[]),/*#__PURE__*/d.createElement(o.div,c({},w,{ref:D,style:{pointerEvents:R?B?"auto":"none":void 0,...e.style},onFocusCapture:a(e.onFocusCapture,S.onFocusCapture),onBlurCapture:a(e.onBlurCapture,S.onBlurCapture),onPointerDownCapture:a(e.onPointerDownCapture,F.onPointerDownCapture)}))}));exports.DismissableLayer=f;const v=/*#__PURE__*/d.forwardRef(((e,t)=>{const n=d.useContext(l),r=d.useRef(null),s=u(t,r);return d.useEffect((()=>{const e=r.current;if(e)return n.branches.add(e),()=>{n.branches.delete(e)}}),[n.branches]),/*#__PURE__*/d.createElement(o.div,c({},e,{ref:s}))}));function p(){const e=new Event("dismissableLayer.update");document.dispatchEvent(e)}function m(e,t,n){const r=n.originalEvent.target,s=new CustomEvent(e,{bubbles:!1,cancelable:!0,detail:n});return t&&r.addEventListener(e,t,{once:!0}),!r.dispatchEvent(s)}exports.DismissableLayerBranch=v;const E=f;exports.Root=E;const b=v;exports.Branch=b;
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["./node_modules/@parcel/scope-hoisting/lib/helpers.js","./packages/react/dismissable-layer/src/DismissableLayer.tsx"],"sourcesContent":["function $parcel$interopDefault(a) {\n  return a && a.__esModule ? a.default : a;\n}\n\nfunction $parcel$defineInteropFlag(a) {\n  Object.defineProperty(a, '__esModule', {value: true});\n}\n\nfunction $parcel$reexport(e, n, v) {\n  Object.defineProperty(e, n, {get: v, enumerable: true});\n}\n\nfunction $parcel$exportWildcard(dest, source) {\n  Object.keys(source).forEach(function(key) {\n    if (key === 'default' || key === '__esModule') {\n      return;\n    }\n\n    Object.defineProperty(dest, key, {\n      enumerable: true,\n      get: function get() {\n        return source[key];\n      },\n    });\n  });\n\n  return dest;\n}\n\nfunction $parcel$missingModule(name) {\n  var err = new Error(\"Cannot find module '\" + name + \"'\");\n  err.code = 'MODULE_NOT_FOUND';\n  throw err;\n}\n\nvar $parcel$global =\n  typeof globalThis !== 'undefined'\n    ? globalThis\n    : typeof self !== 'undefined'\n    ? self\n    : typeof window !== 'undefined'\n    ? window\n    : typeof global !== 'undefined'\n    ? global\n    : {};\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { useBodyPointerEvents } from '@radix-ui/react-use-body-pointer-events';\nimport { useCallbackRef } from '@radix-ui/react-use-callback-ref';\nimport { useEscapeKeydown } from '@radix-ui/react-use-escape-keydown';\n\nimport type * as Radix from '@radix-ui/react-primitive';\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayer\n * -----------------------------------------------------------------------------------------------*/\n\nconst DISMISSABLE_LAYER_NAME = 'DismissableLayer';\nconst CONTEXT_UPDATE = 'dismissableLayer.update';\nconst POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';\nconst FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';\n\nconst DismissableLayerContext = React.createContext({\n  layers: new Set<DismissableLayerElement>(),\n  layersWithOutsidePointerEventsDisabled: new Set<DismissableLayerElement>(),\n});\n\ntype DismissableLayerElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface DismissableLayerProps extends PrimitiveDivProps {\n  /**\n   * When `true`, hover/focus/click interactions will be disabled on elements outside\n   * the `DismissableLayer`. Users will need to click twice on outside elements to\n   * interact with them: once to close the `DismissableLayer`, and again to trigger the element.\n   */\n  disableOutsidePointerEvents?: boolean;\n  /**\n   * Event handler called when the escape key is down.\n   * Can be prevented.\n   */\n  onEscapeKeyDown?: (event: KeyboardEvent) => void;\n  /**\n   * Event handler called when the a `pointerdown` event happens outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onPointerDownOutside?: (event: PointerDownOutsideEvent) => void;\n  /**\n   * Event handler called when the focus moves outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onFocusOutside?: (event: FocusOutsideEvent) => void;\n  /**\n   * Event handler called when an interaction happens outside the `DismissableLayer`.\n   * Specifically, when a `pointerdown` event happens outside or focus moves outside of it.\n   * Can be prevented.\n   */\n  onInteractOutside?: (event: PointerDownOutsideEvent | FocusOutsideEvent) => void;\n  /**\n   * Handler called when the `DismissableLayer` should be dismissed\n   */\n  onDismiss?: () => void;\n}\n\nconst DismissableLayer = React.forwardRef<DismissableLayerElement, DismissableLayerProps>(\n  (props, forwardedRef) => {\n    const {\n      disableOutsidePointerEvents = false,\n      onEscapeKeyDown,\n      onPointerDownOutside,\n      onFocusOutside,\n      onInteractOutside,\n      onDismiss,\n      ...layerProps\n    } = props;\n    const context = React.useContext(DismissableLayerContext);\n    const [node, setNode] = React.useState<DismissableLayerElement | null>(null);\n    const [, force] = React.useState({});\n    const composedRefs = useComposedRefs(forwardedRef, (node) => setNode(node));\n    const layers = Array.from(context.layers);\n    const [highestLayerWithOutsidePointerEventsDisabled] = [...context.layersWithOutsidePointerEventsDisabled].slice(-1); // prettier-ignore\n    const highestLayerWithOutsidePointerEventsDisabledIndex = layers.indexOf(highestLayerWithOutsidePointerEventsDisabled); // prettier-ignore\n    const index = node ? layers.indexOf(node) : -1;\n    const isBodyPointerEventsDisabled = context.layersWithOutsidePointerEventsDisabled.size > 0;\n    const isPointerEventsEnabled = index >= highestLayerWithOutsidePointerEventsDisabledIndex;\n\n    const pointerDownOutside = usePointerDownOutside((event) => {\n      if (!isPointerEventsEnabled) return;\n      onPointerDownOutside?.(event);\n      onInteractOutside?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    const focusOutside = useFocusOutside((event) => {\n      onFocusOutside?.(event);\n      onInteractOutside?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    useEscapeKeydown((event) => {\n      const isHighestLayer = index === context.layers.size - 1;\n      if (!isHighestLayer) return;\n      onEscapeKeyDown?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    useBodyPointerEvents({ disabled: disableOutsidePointerEvents });\n\n    React.useEffect(() => {\n      if (!node) return;\n      if (disableOutsidePointerEvents) context.layersWithOutsidePointerEventsDisabled.add(node);\n      context.layers.add(node);\n      dispatchUpdate();\n    }, [node, disableOutsidePointerEvents, context]);\n\n    /**\n     * We purposefully prevent combining this effect with the `disableOutsidePointerEvents` effect\n     * because a change to `disableOutsidePointerEvents` would remove this layer from the stack\n     * and add it to the end again so the layering order wouldn't be _creation order_.\n     * We only want them to be removed from context stacks when unmounted.\n     */\n    React.useEffect(() => {\n      return () => {\n        if (!node) return;\n        context.layers.delete(node);\n        context.layersWithOutsidePointerEventsDisabled.delete(node);\n        dispatchUpdate();\n      };\n    }, [node, context]);\n\n    React.useEffect(() => {\n      const handleUpdate = () => force({});\n      document.addEventListener(CONTEXT_UPDATE, handleUpdate);\n      return () => document.removeEventListener(CONTEXT_UPDATE, handleUpdate);\n    }, []);\n\n    return (\n      <Primitive.div\n        {...layerProps}\n        ref={composedRefs}\n        style={{\n          pointerEvents: isBodyPointerEventsDisabled\n            ? isPointerEventsEnabled\n              ? 'auto'\n              : 'none'\n            : undefined,\n          ...props.style,\n        }}\n        onFocusCapture={composeEventHandlers(props.onFocusCapture, focusOutside.onFocusCapture)}\n        onBlurCapture={composeEventHandlers(props.onBlurCapture, focusOutside.onBlurCapture)}\n        onPointerDownCapture={composeEventHandlers(\n          props.onPointerDownCapture,\n          pointerDownOutside.onPointerDownCapture\n        )}\n      />\n    );\n  }\n);\n\nDismissableLayer.displayName = DISMISSABLE_LAYER_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype PointerDownOutsideEvent = CustomEvent<{ originalEvent: PointerEvent }>;\ntype FocusOutsideEvent = CustomEvent<{ originalEvent: FocusEvent }>;\n\n/**\n * Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`\n * to mimic layer dismissing behaviour present in OS.\n * Returns props to pass to the node we want to check for outside events.\n */\nfunction usePointerDownOutside(onPointerDownOutside?: (event: PointerDownOutsideEvent) => void) {\n  const handlePointerDownOutside = useCallbackRef(onPointerDownOutside) as EventListener;\n  const isPointerInsideReactTreeRef = React.useRef(false);\n\n  React.useEffect(() => {\n    const handlePointerDown = (event: PointerEvent) => {\n      if (event.target && !isPointerInsideReactTreeRef.current) {\n        const eventDetail = { originalEvent: event };\n        dispatchCustomEvent(POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail);\n      }\n      isPointerInsideReactTreeRef.current = false;\n    };\n    /**\n     * if this hook executes in a component that mounts via a `pointerdown` event, the event\n     * would bubble up to the document and trigger a `pointerDownOutside` event. We avoid\n     * this by delaying the event listener registration on the document.\n     * This is not React specific, but rather how the DOM works, ie:\n     * ```\n     * button.addEventListener('pointerdown', () => {\n     *   console.log('I will log');\n     *   document.addEventListener('pointerdown', () => {\n     *     console.log('I will also log');\n     *   })\n     * });\n     */\n    const timerId = window.setTimeout(() => {\n      document.addEventListener('pointerdown', handlePointerDown);\n    }, 0);\n    return () => {\n      window.clearTimeout(timerId);\n      document.removeEventListener('pointerdown', handlePointerDown);\n    };\n  }, [handlePointerDownOutside]);\n\n  return {\n    // ensures we check React component tree (not just DOM tree)\n    onPointerDownCapture: () => (isPointerInsideReactTreeRef.current = true),\n  };\n}\n\n/**\n * Listens for when focus happens outside a react subtree.\n * Returns props to pass to the root (node) of the subtree we want to check.\n */\nfunction useFocusOutside(onFocusOutside?: (event: FocusOutsideEvent) => void) {\n  const handleFocusOutside = useCallbackRef(onFocusOutside) as EventListener;\n  const isFocusInsideReactTreeRef = React.useRef(false);\n\n  React.useEffect(() => {\n    const handleFocus = (event: FocusEvent) => {\n      if (event.target && !isFocusInsideReactTreeRef.current) {\n        const eventDetail = { originalEvent: event };\n        dispatchCustomEvent(FOCUS_OUTSIDE, handleFocusOutside, eventDetail);\n      }\n    };\n    document.addEventListener('focusin', handleFocus);\n    return () => document.removeEventListener('focusin', handleFocus);\n  }, [handleFocusOutside]);\n\n  return {\n    onFocusCapture: () => (isFocusInsideReactTreeRef.current = true),\n    onBlurCapture: () => (isFocusInsideReactTreeRef.current = false),\n  };\n}\n\nfunction dispatchUpdate() {\n  const event = new Event(CONTEXT_UPDATE);\n  document.dispatchEvent(event);\n}\n\nfunction dispatchCustomEvent<E extends CustomEvent, OriginalEvent extends Event>(\n  name: string,\n  handler: ((event: E) => void) | undefined,\n  detail: { originalEvent: OriginalEvent } & (E extends CustomEvent<infer D> ? D : never)\n) {\n  const target = detail.originalEvent.target as HTMLElement;\n  const event = new CustomEvent(name, { bubbles: false, cancelable: true, detail });\n  if (handler) target.addEventListener(name, handler as EventListener, { once: true });\n  return !target.dispatchEvent(event);\n}\n\nconst Root = DismissableLayer;\n\nexport {\n  DismissableLayer,\n  //\n  Root,\n};\nexport type { DismissableLayerProps };\n"],"names":["dest","source","a","Object","keys","forEach","key","defineProperty","enumerable","get","__esModule","default","DismissableLayerContext","React","createContext","layers","Set","layersWithOutsidePointerEventsDisabled","DismissableLayer","forwardRef","props","forwardedRef","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","context","useContext","node","setNode","useState","force","composedRefs","useComposedRefs","Array","from","highestLayerWithOutsidePointerEventsDisabled","slice","highestLayerWithOutsidePointerEventsDisabledIndex","indexOf","index","isBodyPointerEventsDisabled","size","isPointerEventsEnabled","pointerDownOutside","handlePointerDownOutside","useCallbackRef","isPointerInsideReactTreeRef","useRef","useEffect","handlePointerDown","event","target","current","dispatchCustomEvent","originalEvent","timerId","window","setTimeout","document","addEventListener","clearTimeout","removeEventListener","onPointerDownCapture","usePointerDownOutside","defaultPrevented","focusOutside","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","onFocusCapture","onBlurCapture","useFocusOutside","useEscapeKeydown","useBodyPointerEvents","disabled","add","dispatchUpdate","delete","handleUpdate","_react","createElement","Primitive","div","_babelRuntimeHelpersExtends","ref","style","pointerEvents","undefined","composeEventHandlers","Event","dispatchEvent","name","handler","detail","CustomEvent","bubbles","cancelable","once","Root"],"version":3,"file":"index.js.map"}
+{"mappings":"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","sources":["./node_modules/@parcel/scope-hoisting/lib/helpers.js","./packages/react/dismissable-layer/src/DismissableLayer.tsx"],"sourcesContent":["function $parcel$interopDefault(a) {\n  return a && a.__esModule ? a.default : a;\n}\n\nfunction $parcel$defineInteropFlag(a) {\n  Object.defineProperty(a, '__esModule', {value: true});\n}\n\nfunction $parcel$reexport(e, n, v) {\n  Object.defineProperty(e, n, {get: v, enumerable: true});\n}\n\nfunction $parcel$exportWildcard(dest, source) {\n  Object.keys(source).forEach(function(key) {\n    if (key === 'default' || key === '__esModule') {\n      return;\n    }\n\n    Object.defineProperty(dest, key, {\n      enumerable: true,\n      get: function get() {\n        return source[key];\n      },\n    });\n  });\n\n  return dest;\n}\n\nfunction $parcel$missingModule(name) {\n  var err = new Error(\"Cannot find module '\" + name + \"'\");\n  err.code = 'MODULE_NOT_FOUND';\n  throw err;\n}\n\nvar $parcel$global =\n  typeof globalThis !== 'undefined'\n    ? globalThis\n    : typeof self !== 'undefined'\n    ? self\n    : typeof window !== 'undefined'\n    ? window\n    : typeof global !== 'undefined'\n    ? global\n    : {};\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { useBodyPointerEvents } from '@radix-ui/react-use-body-pointer-events';\nimport { useCallbackRef } from '@radix-ui/react-use-callback-ref';\nimport { useEscapeKeydown } from '@radix-ui/react-use-escape-keydown';\n\nimport type * as Radix from '@radix-ui/react-primitive';\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayer\n * -----------------------------------------------------------------------------------------------*/\n\nconst DISMISSABLE_LAYER_NAME = 'DismissableLayer';\nconst CONTEXT_UPDATE = 'dismissableLayer.update';\nconst POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';\nconst FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';\n\nconst DismissableLayerContext = React.createContext({\n  layers: new Set<DismissableLayerElement>(),\n  layersWithOutsidePointerEventsDisabled: new Set<DismissableLayerElement>(),\n  branches: new Set<DismissableLayerBranchElement>(),\n});\n\ntype DismissableLayerElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface DismissableLayerProps extends PrimitiveDivProps {\n  /**\n   * When `true`, hover/focus/click interactions will be disabled on elements outside\n   * the `DismissableLayer`. Users will need to click twice on outside elements to\n   * interact with them: once to close the `DismissableLayer`, and again to trigger the element.\n   */\n  disableOutsidePointerEvents?: boolean;\n  /**\n   * Event handler called when the escape key is down.\n   * Can be prevented.\n   */\n  onEscapeKeyDown?: (event: KeyboardEvent) => void;\n  /**\n   * Event handler called when the a `pointerdown` event happens outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onPointerDownOutside?: (event: PointerDownOutsideEvent) => void;\n  /**\n   * Event handler called when the focus moves outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onFocusOutside?: (event: FocusOutsideEvent) => void;\n  /**\n   * Event handler called when an interaction happens outside the `DismissableLayer`.\n   * Specifically, when a `pointerdown` event happens outside or focus moves outside of it.\n   * Can be prevented.\n   */\n  onInteractOutside?: (event: PointerDownOutsideEvent | FocusOutsideEvent) => void;\n  /**\n   * Handler called when the `DismissableLayer` should be dismissed\n   */\n  onDismiss?: () => void;\n}\n\nconst DismissableLayer = React.forwardRef<DismissableLayerElement, DismissableLayerProps>(\n  (props, forwardedRef) => {\n    const {\n      disableOutsidePointerEvents = false,\n      onEscapeKeyDown,\n      onPointerDownOutside,\n      onFocusOutside,\n      onInteractOutside,\n      onDismiss,\n      ...layerProps\n    } = props;\n    const context = React.useContext(DismissableLayerContext);\n    const [node, setNode] = React.useState<DismissableLayerElement | null>(null);\n    const [, force] = React.useState({});\n    const composedRefs = useComposedRefs(forwardedRef, (node) => setNode(node));\n    const layers = Array.from(context.layers);\n    const [highestLayerWithOutsidePointerEventsDisabled] = [...context.layersWithOutsidePointerEventsDisabled].slice(-1); // prettier-ignore\n    const highestLayerWithOutsidePointerEventsDisabledIndex = layers.indexOf(highestLayerWithOutsidePointerEventsDisabled); // prettier-ignore\n    const index = node ? layers.indexOf(node) : -1;\n    const isBodyPointerEventsDisabled = context.layersWithOutsidePointerEventsDisabled.size > 0;\n    const isPointerEventsEnabled = index >= highestLayerWithOutsidePointerEventsDisabledIndex;\n\n    const pointerDownOutside = usePointerDownOutside((event) => {\n      const target = event.target as HTMLElement;\n      const isPointerDownOnBranch = [...context.branches].some((branch) => branch.contains(target));\n      if (!isPointerEventsEnabled || isPointerDownOnBranch) return;\n      onPointerDownOutside?.(event);\n      onInteractOutside?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    const focusOutside = useFocusOutside((event) => {\n      const target = event.target as HTMLElement;\n      const isFocusInBranch = [...context.branches].some((branch) => branch.contains(target));\n      if (isFocusInBranch) return;\n      onFocusOutside?.(event);\n      onInteractOutside?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    useEscapeKeydown((event) => {\n      const isHighestLayer = index === context.layers.size - 1;\n      if (!isHighestLayer) return;\n      onEscapeKeyDown?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    useBodyPointerEvents({ disabled: disableOutsidePointerEvents });\n\n    React.useEffect(() => {\n      if (!node) return;\n      if (disableOutsidePointerEvents) context.layersWithOutsidePointerEventsDisabled.add(node);\n      context.layers.add(node);\n      dispatchUpdate();\n    }, [node, disableOutsidePointerEvents, context]);\n\n    /**\n     * We purposefully prevent combining this effect with the `disableOutsidePointerEvents` effect\n     * because a change to `disableOutsidePointerEvents` would remove this layer from the stack\n     * and add it to the end again so the layering order wouldn't be _creation order_.\n     * We only want them to be removed from context stacks when unmounted.\n     */\n    React.useEffect(() => {\n      return () => {\n        if (!node) return;\n        context.layers.delete(node);\n        context.layersWithOutsidePointerEventsDisabled.delete(node);\n        dispatchUpdate();\n      };\n    }, [node, context]);\n\n    React.useEffect(() => {\n      const handleUpdate = () => force({});\n      document.addEventListener(CONTEXT_UPDATE, handleUpdate);\n      return () => document.removeEventListener(CONTEXT_UPDATE, handleUpdate);\n    }, []);\n\n    return (\n      <Primitive.div\n        {...layerProps}\n        ref={composedRefs}\n        style={{\n          pointerEvents: isBodyPointerEventsDisabled\n            ? isPointerEventsEnabled\n              ? 'auto'\n              : 'none'\n            : undefined,\n          ...props.style,\n        }}\n        onFocusCapture={composeEventHandlers(props.onFocusCapture, focusOutside.onFocusCapture)}\n        onBlurCapture={composeEventHandlers(props.onBlurCapture, focusOutside.onBlurCapture)}\n        onPointerDownCapture={composeEventHandlers(\n          props.onPointerDownCapture,\n          pointerDownOutside.onPointerDownCapture\n        )}\n      />\n    );\n  }\n);\n\nDismissableLayer.displayName = DISMISSABLE_LAYER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayerBranch\n * -----------------------------------------------------------------------------------------------*/\n\nconst BRANCH_NAME = 'DismissableLayerBranch';\n\ntype DismissableLayerBranchElement = React.ElementRef<typeof Primitive.div>;\ninterface DismissableLayerBranchProps extends PrimitiveDivProps {}\n\nconst DismissableLayerBranch = React.forwardRef<\n  DismissableLayerBranchElement,\n  DismissableLayerBranchProps\n>((props, forwardedRef) => {\n  const context = React.useContext(DismissableLayerContext);\n  const ref = React.useRef<DismissableLayerBranchElement>(null);\n  const composedRefs = useComposedRefs(forwardedRef, ref);\n\n  React.useEffect(() => {\n    const node = ref.current;\n    if (node) {\n      context.branches.add(node);\n      return () => {\n        context.branches.delete(node);\n      };\n    }\n  }, [context.branches]);\n\n  return <Primitive.div {...props} ref={composedRefs} />;\n});\n\nDismissableLayerBranch.displayName = BRANCH_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype PointerDownOutsideEvent = CustomEvent<{ originalEvent: PointerEvent }>;\ntype FocusOutsideEvent = CustomEvent<{ originalEvent: FocusEvent }>;\n\n/**\n * Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`\n * to mimic layer dismissing behaviour present in OS.\n * Returns props to pass to the node we want to check for outside events.\n */\nfunction usePointerDownOutside(onPointerDownOutside?: (event: PointerDownOutsideEvent) => void) {\n  const handlePointerDownOutside = useCallbackRef(onPointerDownOutside) as EventListener;\n  const isPointerInsideReactTreeRef = React.useRef(false);\n\n  React.useEffect(() => {\n    const handlePointerDown = (event: PointerEvent) => {\n      if (event.target && !isPointerInsideReactTreeRef.current) {\n        const eventDetail = { originalEvent: event };\n        dispatchCustomEvent(POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail);\n      }\n      isPointerInsideReactTreeRef.current = false;\n    };\n    /**\n     * if this hook executes in a component that mounts via a `pointerdown` event, the event\n     * would bubble up to the document and trigger a `pointerDownOutside` event. We avoid\n     * this by delaying the event listener registration on the document.\n     * This is not React specific, but rather how the DOM works, ie:\n     * ```\n     * button.addEventListener('pointerdown', () => {\n     *   console.log('I will log');\n     *   document.addEventListener('pointerdown', () => {\n     *     console.log('I will also log');\n     *   })\n     * });\n     */\n    const timerId = window.setTimeout(() => {\n      document.addEventListener('pointerdown', handlePointerDown);\n    }, 0);\n    return () => {\n      window.clearTimeout(timerId);\n      document.removeEventListener('pointerdown', handlePointerDown);\n    };\n  }, [handlePointerDownOutside]);\n\n  return {\n    // ensures we check React component tree (not just DOM tree)\n    onPointerDownCapture: () => (isPointerInsideReactTreeRef.current = true),\n  };\n}\n\n/**\n * Listens for when focus happens outside a react subtree.\n * Returns props to pass to the root (node) of the subtree we want to check.\n */\nfunction useFocusOutside(onFocusOutside?: (event: FocusOutsideEvent) => void) {\n  const handleFocusOutside = useCallbackRef(onFocusOutside) as EventListener;\n  const isFocusInsideReactTreeRef = React.useRef(false);\n\n  React.useEffect(() => {\n    const handleFocus = (event: FocusEvent) => {\n      if (event.target && !isFocusInsideReactTreeRef.current) {\n        const eventDetail = { originalEvent: event };\n        dispatchCustomEvent(FOCUS_OUTSIDE, handleFocusOutside, eventDetail);\n      }\n    };\n    document.addEventListener('focusin', handleFocus);\n    return () => document.removeEventListener('focusin', handleFocus);\n  }, [handleFocusOutside]);\n\n  return {\n    onFocusCapture: () => (isFocusInsideReactTreeRef.current = true),\n    onBlurCapture: () => (isFocusInsideReactTreeRef.current = false),\n  };\n}\n\nfunction dispatchUpdate() {\n  const event = new Event(CONTEXT_UPDATE);\n  document.dispatchEvent(event);\n}\n\nfunction dispatchCustomEvent<E extends CustomEvent, OriginalEvent extends Event>(\n  name: string,\n  handler: ((event: E) => void) | undefined,\n  detail: { originalEvent: OriginalEvent } & (E extends CustomEvent<infer D> ? D : never)\n) {\n  const target = detail.originalEvent.target as HTMLElement;\n  const event = new CustomEvent(name, { bubbles: false, cancelable: true, detail });\n  if (handler) target.addEventListener(name, handler as EventListener, { once: true });\n  return !target.dispatchEvent(event);\n}\n\nconst Root = DismissableLayer;\nconst Branch = DismissableLayerBranch;\n\nexport {\n  DismissableLayer,\n  DismissableLayerBranch,\n  //\n  Root,\n  Branch,\n};\nexport type { DismissableLayerProps };\n"],"names":["dest","source","a","Object","keys","forEach","key","defineProperty","enumerable","get","__esModule","default","DismissableLayerContext","React","createContext","layers","Set","layersWithOutsidePointerEventsDisabled","branches","DismissableLayer","forwardRef","props","forwardedRef","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","context","useContext","node","setNode","useState","force","composedRefs","useComposedRefs","Array","from","highestLayerWithOutsidePointerEventsDisabled","slice","highestLayerWithOutsidePointerEventsDisabledIndex","indexOf","index","isBodyPointerEventsDisabled","size","isPointerEventsEnabled","pointerDownOutside","handlePointerDownOutside","useCallbackRef","isPointerInsideReactTreeRef","useRef","useEffect","handlePointerDown","event","target","current","dispatchCustomEvent","originalEvent","timerId","window","setTimeout","document","addEventListener","clearTimeout","removeEventListener","onPointerDownCapture","usePointerDownOutside","isPointerDownOnBranch","some","branch","contains","defaultPrevented","focusOutside","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","onFocusCapture","onBlurCapture","useFocusOutside","useEscapeKeydown","useBodyPointerEvents","disabled","add","dispatchUpdate","delete","handleUpdate","_react","createElement","Primitive","div","_babelRuntimeHelpersExtends","ref","style","pointerEvents","undefined","composeEventHandlers","DismissableLayerBranch","Event","dispatchEvent","name","handler","detail","CustomEvent","bubbles","cancelable","once","Root","Branch"],"version":3,"file":"index.js.map"}

package/dist/index.module.js

@@ -1,2 +1,2 @@
-import{useEscapeKeydown as e}from"@radix-ui/react-use-escape-keydown";import{useCallbackRef as t}from"@radix-ui/react-use-callback-ref";import{useBodyPointerEvents as n}from"@radix-ui/react-use-body-pointer-events";import{useComposedRefs as r}from"@radix-ui/react-compose-refs";import{Primitive as i}from"@radix-ui/react-primitive";import{composeEventHandlers as s}from"@radix-ui/primitive";import*as o from"react";import u from"@babel/runtime/helpers/esm/extends";const a=/*#__PURE__*/o.createContext({layers:new Set,layersWithOutsidePointerEventsDisabled:new Set});export const DismissableLayer=/*#__PURE__*/o.forwardRef(((c,m)=>{const{disableOutsidePointerEvents:f=!1,onEscapeKeyDown:p,onPointerDownOutside:v,onFocusOutside:E,onInteractOutside:y,onDismiss:b,...w}=c,C=o.useContext(a),[D,L]=o.useState(null),[,P]=o.useState({}),x=r(m,(e=>L(e))),O=Array.from(C.layers),[h]=[...C.layersWithOutsidePointerEventsDisabled].slice(-1),g=O.indexOf(h),F=D?O.indexOf(D):-1,W=C.layersWithOutsidePointerEventsDisabled.size>0,B=F>=g,R=function(e){const n=t(e),r=o.useRef(!1);return o.useEffect((()=>{const e=e=>{if(e.target&&!r.current){l("dismissableLayer.pointerDownOutside",n,{originalEvent:e})}r.current=!1},t=window.setTimeout((()=>{document.addEventListener("pointerdown",e)}),0);return()=>{window.clearTimeout(t),document.removeEventListener("pointerdown",e)}}),[n]),{onPointerDownCapture:()=>r.current=!0}}((e=>{B&&(null==v||v(e),null==y||y(e),e.defaultPrevented||null==b||b())})),S=function(e){const n=t(e),r=o.useRef(!1);return o.useEffect((()=>{const e=e=>{if(e.target&&!r.current){l("dismissableLayer.focusOutside",n,{originalEvent:e})}};return document.addEventListener("focusin",e),()=>document.removeEventListener("focusin",e)}),[n]),{onFocusCapture:()=>r.current=!0,onBlurCapture:()=>r.current=!1}}((e=>{null==E||E(e),null==y||y(e),e.defaultPrevented||null==b||b()}));return e((e=>{F===C.layers.size-1&&(null==p||p(e),e.defaultPrevented||null==b||b())})),n({disabled:f}),o.useEffect((()=>{D&&(f&&C.layersWithOutsidePointerEventsDisabled.add(D),C.layers.add(D),d())}),[D,f,C]),o.useEffect((()=>()=>{D&&(C.layers.delete(D),C.layersWithOutsidePointerEventsDisabled.delete(D),d())}),[D,C]),o.useEffect((()=>{const e=()=>P({});return document.addEventListener("dismissableLayer.update",e),()=>document.removeEventListener("dismissableLayer.update",e)}),[]),/*#__PURE__*/o.createElement(i.div,u({},w,{ref:x,style:{pointerEvents:W?B?"auto":"none":void 0,...c.style},onFocusCapture:s(c.onFocusCapture,S.onFocusCapture),onBlurCapture:s(c.onBlurCapture,S.onBlurCapture),onPointerDownCapture:s(c.onPointerDownCapture,R.onPointerDownCapture)}))}));/*#__PURE__*/function d(){const e=new Event("dismissableLayer.update");document.dispatchEvent(e)}function l(e,t,n){const r=n.originalEvent.target,i=new CustomEvent(e,{bubbles:!1,cancelable:!0,detail:n});return t&&r.addEventListener(e,t,{once:!0}),!r.dispatchEvent(i)}export const Root=DismissableLayer;
+import{useEscapeKeydown as e}from"@radix-ui/react-use-escape-keydown";import{useCallbackRef as t}from"@radix-ui/react-use-callback-ref";import{useBodyPointerEvents as n}from"@radix-ui/react-use-body-pointer-events";import{useComposedRefs as r}from"@radix-ui/react-compose-refs";import{Primitive as s}from"@radix-ui/react-primitive";import{composeEventHandlers as o}from"@radix-ui/primitive";import*as i from"react";import a from"@babel/runtime/helpers/esm/extends";const u=/*#__PURE__*/i.createContext({layers:new Set,layersWithOutsidePointerEventsDisabled:new Set,branches:new Set});export const DismissableLayer=/*#__PURE__*/i.forwardRef(((l,m)=>{const{disableOutsidePointerEvents:f=!1,onEscapeKeyDown:p,onPointerDownOutside:v,onFocusOutside:b,onInteractOutside:E,onDismiss:y,...w}=l,h=i.useContext(u),[D,x]=i.useState(null),[,C]=i.useState({}),L=r(m,(e=>x(e))),P=Array.from(h.layers),[O]=[...h.layersWithOutsidePointerEventsDisabled].slice(-1),g=P.indexOf(O),B=D?P.indexOf(D):-1,R=h.layersWithOutsidePointerEventsDisabled.size>0,F=B>=g,S=function(e){const n=t(e),r=i.useRef(!1);return i.useEffect((()=>{const e=e=>{if(e.target&&!r.current){d("dismissableLayer.pointerDownOutside",n,{originalEvent:e})}r.current=!1},t=window.setTimeout((()=>{document.addEventListener("pointerdown",e)}),0);return()=>{window.clearTimeout(t),document.removeEventListener("pointerdown",e)}}),[n]),{onPointerDownCapture:()=>r.current=!0}}((e=>{const t=e.target,n=[...h.branches].some((e=>e.contains(t)));F&&!n&&(null==v||v(e),null==E||E(e),e.defaultPrevented||null==y||y())})),W=function(e){const n=t(e),r=i.useRef(!1);return i.useEffect((()=>{const e=e=>{if(e.target&&!r.current){d("dismissableLayer.focusOutside",n,{originalEvent:e})}};return document.addEventListener("focusin",e),()=>document.removeEventListener("focusin",e)}),[n]),{onFocusCapture:()=>r.current=!0,onBlurCapture:()=>r.current=!1}}((e=>{const t=e.target;[...h.branches].some((e=>e.contains(t)))||(null==b||b(e),null==E||E(e),e.defaultPrevented||null==y||y())}));return e((e=>{B===h.layers.size-1&&(null==p||p(e),e.defaultPrevented||null==y||y())})),n({disabled:f}),i.useEffect((()=>{D&&(f&&h.layersWithOutsidePointerEventsDisabled.add(D),h.layers.add(D),c())}),[D,f,h]),i.useEffect((()=>()=>{D&&(h.layers.delete(D),h.layersWithOutsidePointerEventsDisabled.delete(D),c())}),[D,h]),i.useEffect((()=>{const e=()=>C({});return document.addEventListener("dismissableLayer.update",e),()=>document.removeEventListener("dismissableLayer.update",e)}),[]),/*#__PURE__*/i.createElement(s.div,a({},w,{ref:L,style:{pointerEvents:R?F?"auto":"none":void 0,...l.style},onFocusCapture:o(l.onFocusCapture,W.onFocusCapture),onBlurCapture:o(l.onBlurCapture,W.onBlurCapture),onPointerDownCapture:o(l.onPointerDownCapture,S.onPointerDownCapture)}))}));/*#__PURE__*/export const DismissableLayerBranch=/*#__PURE__*/i.forwardRef(((e,t)=>{const n=i.useContext(u),o=i.useRef(null),c=r(t,o);return i.useEffect((()=>{const e=o.current;if(e)return n.branches.add(e),()=>{n.branches.delete(e)}}),[n.branches]),/*#__PURE__*/i.createElement(s.div,a({},e,{ref:c}))}));/*#__PURE__*/function c(){const e=new Event("dismissableLayer.update");document.dispatchEvent(e)}function d(e,t,n){const r=n.originalEvent.target,s=new CustomEvent(e,{bubbles:!1,cancelable:!0,detail:n});return t&&r.addEventListener(e,t,{once:!0}),!r.dispatchEvent(s)}export const Root=DismissableLayer;export const Branch=DismissableLayerBranch;
 //# sourceMappingURL=index.module.js.map

package/dist/index.module.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["./packages/react/dismissable-layer/src/DismissableLayer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { useBodyPointerEvents } from '@radix-ui/react-use-body-pointer-events';\nimport { useCallbackRef } from '@radix-ui/react-use-callback-ref';\nimport { useEscapeKeydown } from '@radix-ui/react-use-escape-keydown';\n\nimport type * as Radix from '@radix-ui/react-primitive';\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayer\n * -----------------------------------------------------------------------------------------------*/\n\nconst DISMISSABLE_LAYER_NAME = 'DismissableLayer';\nconst CONTEXT_UPDATE = 'dismissableLayer.update';\nconst POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';\nconst FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';\n\nconst DismissableLayerContext = React.createContext({\n  layers: new Set<DismissableLayerElement>(),\n  layersWithOutsidePointerEventsDisabled: new Set<DismissableLayerElement>(),\n});\n\ntype DismissableLayerElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface DismissableLayerProps extends PrimitiveDivProps {\n  /**\n   * When `true`, hover/focus/click interactions will be disabled on elements outside\n   * the `DismissableLayer`. Users will need to click twice on outside elements to\n   * interact with them: once to close the `DismissableLayer`, and again to trigger the element.\n   */\n  disableOutsidePointerEvents?: boolean;\n  /**\n   * Event handler called when the escape key is down.\n   * Can be prevented.\n   */\n  onEscapeKeyDown?: (event: KeyboardEvent) => void;\n  /**\n   * Event handler called when the a `pointerdown` event happens outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onPointerDownOutside?: (event: PointerDownOutsideEvent) => void;\n  /**\n   * Event handler called when the focus moves outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onFocusOutside?: (event: FocusOutsideEvent) => void;\n  /**\n   * Event handler called when an interaction happens outside the `DismissableLayer`.\n   * Specifically, when a `pointerdown` event happens outside or focus moves outside of it.\n   * Can be prevented.\n   */\n  onInteractOutside?: (event: PointerDownOutsideEvent | FocusOutsideEvent) => void;\n  /**\n   * Handler called when the `DismissableLayer` should be dismissed\n   */\n  onDismiss?: () => void;\n}\n\nconst DismissableLayer = React.forwardRef<DismissableLayerElement, DismissableLayerProps>(\n  (props, forwardedRef) => {\n    const {\n      disableOutsidePointerEvents = false,\n      onEscapeKeyDown,\n      onPointerDownOutside,\n      onFocusOutside,\n      onInteractOutside,\n      onDismiss,\n      ...layerProps\n    } = props;\n    const context = React.useContext(DismissableLayerContext);\n    const [node, setNode] = React.useState<DismissableLayerElement | null>(null);\n    const [, force] = React.useState({});\n    const composedRefs = useComposedRefs(forwardedRef, (node) => setNode(node));\n    const layers = Array.from(context.layers);\n    const [highestLayerWithOutsidePointerEventsDisabled] = [...context.layersWithOutsidePointerEventsDisabled].slice(-1); // prettier-ignore\n    const highestLayerWithOutsidePointerEventsDisabledIndex = layers.indexOf(highestLayerWithOutsidePointerEventsDisabled); // prettier-ignore\n    const index = node ? layers.indexOf(node) : -1;\n    const isBodyPointerEventsDisabled = context.layersWithOutsidePointerEventsDisabled.size > 0;\n    const isPointerEventsEnabled = index >= highestLayerWithOutsidePointerEventsDisabledIndex;\n\n    const pointerDownOutside = usePointerDownOutside((event) => {\n      if (!isPointerEventsEnabled) return;\n      onPointerDownOutside?.(event);\n      onInteractOutside?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    const focusOutside = useFocusOutside((event) => {\n      onFocusOutside?.(event);\n      onInteractOutside?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    useEscapeKeydown((event) => {\n      const isHighestLayer = index === context.layers.size - 1;\n      if (!isHighestLayer) return;\n      onEscapeKeyDown?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    useBodyPointerEvents({ disabled: disableOutsidePointerEvents });\n\n    React.useEffect(() => {\n      if (!node) return;\n      if (disableOutsidePointerEvents) context.layersWithOutsidePointerEventsDisabled.add(node);\n      context.layers.add(node);\n      dispatchUpdate();\n    }, [node, disableOutsidePointerEvents, context]);\n\n    /**\n     * We purposefully prevent combining this effect with the `disableOutsidePointerEvents` effect\n     * because a change to `disableOutsidePointerEvents` would remove this layer from the stack\n     * and add it to the end again so the layering order wouldn't be _creation order_.\n     * We only want them to be removed from context stacks when unmounted.\n     */\n    React.useEffect(() => {\n      return () => {\n        if (!node) return;\n        context.layers.delete(node);\n        context.layersWithOutsidePointerEventsDisabled.delete(node);\n        dispatchUpdate();\n      };\n    }, [node, context]);\n\n    React.useEffect(() => {\n      const handleUpdate = () => force({});\n      document.addEventListener(CONTEXT_UPDATE, handleUpdate);\n      return () => document.removeEventListener(CONTEXT_UPDATE, handleUpdate);\n    }, []);\n\n    return (\n      <Primitive.div\n        {...layerProps}\n        ref={composedRefs}\n        style={{\n          pointerEvents: isBodyPointerEventsDisabled\n            ? isPointerEventsEnabled\n              ? 'auto'\n              : 'none'\n            : undefined,\n          ...props.style,\n        }}\n        onFocusCapture={composeEventHandlers(props.onFocusCapture, focusOutside.onFocusCapture)}\n        onBlurCapture={composeEventHandlers(props.onBlurCapture, focusOutside.onBlurCapture)}\n        onPointerDownCapture={composeEventHandlers(\n          props.onPointerDownCapture,\n          pointerDownOutside.onPointerDownCapture\n        )}\n      />\n    );\n  }\n);\n\nDismissableLayer.displayName = DISMISSABLE_LAYER_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype PointerDownOutsideEvent = CustomEvent<{ originalEvent: PointerEvent }>;\ntype FocusOutsideEvent = CustomEvent<{ originalEvent: FocusEvent }>;\n\n/**\n * Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`\n * to mimic layer dismissing behaviour present in OS.\n * Returns props to pass to the node we want to check for outside events.\n */\nfunction usePointerDownOutside(onPointerDownOutside?: (event: PointerDownOutsideEvent) => void) {\n  const handlePointerDownOutside = useCallbackRef(onPointerDownOutside) as EventListener;\n  const isPointerInsideReactTreeRef = React.useRef(false);\n\n  React.useEffect(() => {\n    const handlePointerDown = (event: PointerEvent) => {\n      if (event.target && !isPointerInsideReactTreeRef.current) {\n        const eventDetail = { originalEvent: event };\n        dispatchCustomEvent(POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail);\n      }\n      isPointerInsideReactTreeRef.current = false;\n    };\n    /**\n     * if this hook executes in a component that mounts via a `pointerdown` event, the event\n     * would bubble up to the document and trigger a `pointerDownOutside` event. We avoid\n     * this by delaying the event listener registration on the document.\n     * This is not React specific, but rather how the DOM works, ie:\n     * ```\n     * button.addEventListener('pointerdown', () => {\n     *   console.log('I will log');\n     *   document.addEventListener('pointerdown', () => {\n     *     console.log('I will also log');\n     *   })\n     * });\n     */\n    const timerId = window.setTimeout(() => {\n      document.addEventListener('pointerdown', handlePointerDown);\n    }, 0);\n    return () => {\n      window.clearTimeout(timerId);\n      document.removeEventListener('pointerdown', handlePointerDown);\n    };\n  }, [handlePointerDownOutside]);\n\n  return {\n    // ensures we check React component tree (not just DOM tree)\n    onPointerDownCapture: () => (isPointerInsideReactTreeRef.current = true),\n  };\n}\n\n/**\n * Listens for when focus happens outside a react subtree.\n * Returns props to pass to the root (node) of the subtree we want to check.\n */\nfunction useFocusOutside(onFocusOutside?: (event: FocusOutsideEvent) => void) {\n  const handleFocusOutside = useCallbackRef(onFocusOutside) as EventListener;\n  const isFocusInsideReactTreeRef = React.useRef(false);\n\n  React.useEffect(() => {\n    const handleFocus = (event: FocusEvent) => {\n      if (event.target && !isFocusInsideReactTreeRef.current) {\n        const eventDetail = { originalEvent: event };\n        dispatchCustomEvent(FOCUS_OUTSIDE, handleFocusOutside, eventDetail);\n      }\n    };\n    document.addEventListener('focusin', handleFocus);\n    return () => document.removeEventListener('focusin', handleFocus);\n  }, [handleFocusOutside]);\n\n  return {\n    onFocusCapture: () => (isFocusInsideReactTreeRef.current = true),\n    onBlurCapture: () => (isFocusInsideReactTreeRef.current = false),\n  };\n}\n\nfunction dispatchUpdate() {\n  const event = new Event(CONTEXT_UPDATE);\n  document.dispatchEvent(event);\n}\n\nfunction dispatchCustomEvent<E extends CustomEvent, OriginalEvent extends Event>(\n  name: string,\n  handler: ((event: E) => void) | undefined,\n  detail: { originalEvent: OriginalEvent } & (E extends CustomEvent<infer D> ? D : never)\n) {\n  const target = detail.originalEvent.target as HTMLElement;\n  const event = new CustomEvent(name, { bubbles: false, cancelable: true, detail });\n  if (handler) target.addEventListener(name, handler as EventListener, { once: true });\n  return !target.dispatchEvent(event);\n}\n\nconst Root = DismissableLayer;\n\nexport {\n  DismissableLayer,\n  //\n  Root,\n};\nexport type { DismissableLayerProps };\n"],"names":["DismissableLayerContext","React","createContext","layers","Set","layersWithOutsidePointerEventsDisabled","DismissableLayer","forwardRef","props","forwardedRef","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","context","useContext","node","setNode","useState","force","composedRefs","useComposedRefs","Array","from","highestLayerWithOutsidePointerEventsDisabled","slice","highestLayerWithOutsidePointerEventsDisabledIndex","indexOf","index","isBodyPointerEventsDisabled","size","isPointerEventsEnabled","pointerDownOutside","handlePointerDownOutside","useCallbackRef","isPointerInsideReactTreeRef","useRef","useEffect","handlePointerDown","event","target","current","dispatchCustomEvent","originalEvent","timerId","window","setTimeout","document","addEventListener","clearTimeout","removeEventListener","onPointerDownCapture","usePointerDownOutside","defaultPrevented","focusOutside","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","onFocusCapture","onBlurCapture","useFocusOutside","useEscapeKeydown","useBodyPointerEvents","disabled","add","dispatchUpdate","delete","handleUpdate","_react","createElement","Primitive","div","_babelRuntimeHelpersEsmExtends","ref","style","pointerEvents","undefined","composeEventHandlers","Event","dispatchEvent","name","handler","detail","CustomEvent","bubbles","cancelable","once","Root"],"version":3,"file":"index.module.js.map"}
+{"mappings":"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","sources":["./packages/react/dismissable-layer/src/DismissableLayer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { useBodyPointerEvents } from '@radix-ui/react-use-body-pointer-events';\nimport { useCallbackRef } from '@radix-ui/react-use-callback-ref';\nimport { useEscapeKeydown } from '@radix-ui/react-use-escape-keydown';\n\nimport type * as Radix from '@radix-ui/react-primitive';\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayer\n * -----------------------------------------------------------------------------------------------*/\n\nconst DISMISSABLE_LAYER_NAME = 'DismissableLayer';\nconst CONTEXT_UPDATE = 'dismissableLayer.update';\nconst POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';\nconst FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';\n\nconst DismissableLayerContext = React.createContext({\n  layers: new Set<DismissableLayerElement>(),\n  layersWithOutsidePointerEventsDisabled: new Set<DismissableLayerElement>(),\n  branches: new Set<DismissableLayerBranchElement>(),\n});\n\ntype DismissableLayerElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface DismissableLayerProps extends PrimitiveDivProps {\n  /**\n   * When `true`, hover/focus/click interactions will be disabled on elements outside\n   * the `DismissableLayer`. Users will need to click twice on outside elements to\n   * interact with them: once to close the `DismissableLayer`, and again to trigger the element.\n   */\n  disableOutsidePointerEvents?: boolean;\n  /**\n   * Event handler called when the escape key is down.\n   * Can be prevented.\n   */\n  onEscapeKeyDown?: (event: KeyboardEvent) => void;\n  /**\n   * Event handler called when the a `pointerdown` event happens outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onPointerDownOutside?: (event: PointerDownOutsideEvent) => void;\n  /**\n   * Event handler called when the focus moves outside of the `DismissableLayer`.\n   * Can be prevented.\n   */\n  onFocusOutside?: (event: FocusOutsideEvent) => void;\n  /**\n   * Event handler called when an interaction happens outside the `DismissableLayer`.\n   * Specifically, when a `pointerdown` event happens outside or focus moves outside of it.\n   * Can be prevented.\n   */\n  onInteractOutside?: (event: PointerDownOutsideEvent | FocusOutsideEvent) => void;\n  /**\n   * Handler called when the `DismissableLayer` should be dismissed\n   */\n  onDismiss?: () => void;\n}\n\nconst DismissableLayer = React.forwardRef<DismissableLayerElement, DismissableLayerProps>(\n  (props, forwardedRef) => {\n    const {\n      disableOutsidePointerEvents = false,\n      onEscapeKeyDown,\n      onPointerDownOutside,\n      onFocusOutside,\n      onInteractOutside,\n      onDismiss,\n      ...layerProps\n    } = props;\n    const context = React.useContext(DismissableLayerContext);\n    const [node, setNode] = React.useState<DismissableLayerElement | null>(null);\n    const [, force] = React.useState({});\n    const composedRefs = useComposedRefs(forwardedRef, (node) => setNode(node));\n    const layers = Array.from(context.layers);\n    const [highestLayerWithOutsidePointerEventsDisabled] = [...context.layersWithOutsidePointerEventsDisabled].slice(-1); // prettier-ignore\n    const highestLayerWithOutsidePointerEventsDisabledIndex = layers.indexOf(highestLayerWithOutsidePointerEventsDisabled); // prettier-ignore\n    const index = node ? layers.indexOf(node) : -1;\n    const isBodyPointerEventsDisabled = context.layersWithOutsidePointerEventsDisabled.size > 0;\n    const isPointerEventsEnabled = index >= highestLayerWithOutsidePointerEventsDisabledIndex;\n\n    const pointerDownOutside = usePointerDownOutside((event) => {\n      const target = event.target as HTMLElement;\n      const isPointerDownOnBranch = [...context.branches].some((branch) => branch.contains(target));\n      if (!isPointerEventsEnabled || isPointerDownOnBranch) return;\n      onPointerDownOutside?.(event);\n      onInteractOutside?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    const focusOutside = useFocusOutside((event) => {\n      const target = event.target as HTMLElement;\n      const isFocusInBranch = [...context.branches].some((branch) => branch.contains(target));\n      if (isFocusInBranch) return;\n      onFocusOutside?.(event);\n      onInteractOutside?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    useEscapeKeydown((event) => {\n      const isHighestLayer = index === context.layers.size - 1;\n      if (!isHighestLayer) return;\n      onEscapeKeyDown?.(event);\n      if (!event.defaultPrevented) onDismiss?.();\n    });\n\n    useBodyPointerEvents({ disabled: disableOutsidePointerEvents });\n\n    React.useEffect(() => {\n      if (!node) return;\n      if (disableOutsidePointerEvents) context.layersWithOutsidePointerEventsDisabled.add(node);\n      context.layers.add(node);\n      dispatchUpdate();\n    }, [node, disableOutsidePointerEvents, context]);\n\n    /**\n     * We purposefully prevent combining this effect with the `disableOutsidePointerEvents` effect\n     * because a change to `disableOutsidePointerEvents` would remove this layer from the stack\n     * and add it to the end again so the layering order wouldn't be _creation order_.\n     * We only want them to be removed from context stacks when unmounted.\n     */\n    React.useEffect(() => {\n      return () => {\n        if (!node) return;\n        context.layers.delete(node);\n        context.layersWithOutsidePointerEventsDisabled.delete(node);\n        dispatchUpdate();\n      };\n    }, [node, context]);\n\n    React.useEffect(() => {\n      const handleUpdate = () => force({});\n      document.addEventListener(CONTEXT_UPDATE, handleUpdate);\n      return () => document.removeEventListener(CONTEXT_UPDATE, handleUpdate);\n    }, []);\n\n    return (\n      <Primitive.div\n        {...layerProps}\n        ref={composedRefs}\n        style={{\n          pointerEvents: isBodyPointerEventsDisabled\n            ? isPointerEventsEnabled\n              ? 'auto'\n              : 'none'\n            : undefined,\n          ...props.style,\n        }}\n        onFocusCapture={composeEventHandlers(props.onFocusCapture, focusOutside.onFocusCapture)}\n        onBlurCapture={composeEventHandlers(props.onBlurCapture, focusOutside.onBlurCapture)}\n        onPointerDownCapture={composeEventHandlers(\n          props.onPointerDownCapture,\n          pointerDownOutside.onPointerDownCapture\n        )}\n      />\n    );\n  }\n);\n\nDismissableLayer.displayName = DISMISSABLE_LAYER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayerBranch\n * -----------------------------------------------------------------------------------------------*/\n\nconst BRANCH_NAME = 'DismissableLayerBranch';\n\ntype DismissableLayerBranchElement = React.ElementRef<typeof Primitive.div>;\ninterface DismissableLayerBranchProps extends PrimitiveDivProps {}\n\nconst DismissableLayerBranch = React.forwardRef<\n  DismissableLayerBranchElement,\n  DismissableLayerBranchProps\n>((props, forwardedRef) => {\n  const context = React.useContext(DismissableLayerContext);\n  const ref = React.useRef<DismissableLayerBranchElement>(null);\n  const composedRefs = useComposedRefs(forwardedRef, ref);\n\n  React.useEffect(() => {\n    const node = ref.current;\n    if (node) {\n      context.branches.add(node);\n      return () => {\n        context.branches.delete(node);\n      };\n    }\n  }, [context.branches]);\n\n  return <Primitive.div {...props} ref={composedRefs} />;\n});\n\nDismissableLayerBranch.displayName = BRANCH_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype PointerDownOutsideEvent = CustomEvent<{ originalEvent: PointerEvent }>;\ntype FocusOutsideEvent = CustomEvent<{ originalEvent: FocusEvent }>;\n\n/**\n * Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`\n * to mimic layer dismissing behaviour present in OS.\n * Returns props to pass to the node we want to check for outside events.\n */\nfunction usePointerDownOutside(onPointerDownOutside?: (event: PointerDownOutsideEvent) => void) {\n  const handlePointerDownOutside = useCallbackRef(onPointerDownOutside) as EventListener;\n  const isPointerInsideReactTreeRef = React.useRef(false);\n\n  React.useEffect(() => {\n    const handlePointerDown = (event: PointerEvent) => {\n      if (event.target && !isPointerInsideReactTreeRef.current) {\n        const eventDetail = { originalEvent: event };\n        dispatchCustomEvent(POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail);\n      }\n      isPointerInsideReactTreeRef.current = false;\n    };\n    /**\n     * if this hook executes in a component that mounts via a `pointerdown` event, the event\n     * would bubble up to the document and trigger a `pointerDownOutside` event. We avoid\n     * this by delaying the event listener registration on the document.\n     * This is not React specific, but rather how the DOM works, ie:\n     * ```\n     * button.addEventListener('pointerdown', () => {\n     *   console.log('I will log');\n     *   document.addEventListener('pointerdown', () => {\n     *     console.log('I will also log');\n     *   })\n     * });\n     */\n    const timerId = window.setTimeout(() => {\n      document.addEventListener('pointerdown', handlePointerDown);\n    }, 0);\n    return () => {\n      window.clearTimeout(timerId);\n      document.removeEventListener('pointerdown', handlePointerDown);\n    };\n  }, [handlePointerDownOutside]);\n\n  return {\n    // ensures we check React component tree (not just DOM tree)\n    onPointerDownCapture: () => (isPointerInsideReactTreeRef.current = true),\n  };\n}\n\n/**\n * Listens for when focus happens outside a react subtree.\n * Returns props to pass to the root (node) of the subtree we want to check.\n */\nfunction useFocusOutside(onFocusOutside?: (event: FocusOutsideEvent) => void) {\n  const handleFocusOutside = useCallbackRef(onFocusOutside) as EventListener;\n  const isFocusInsideReactTreeRef = React.useRef(false);\n\n  React.useEffect(() => {\n    const handleFocus = (event: FocusEvent) => {\n      if (event.target && !isFocusInsideReactTreeRef.current) {\n        const eventDetail = { originalEvent: event };\n        dispatchCustomEvent(FOCUS_OUTSIDE, handleFocusOutside, eventDetail);\n      }\n    };\n    document.addEventListener('focusin', handleFocus);\n    return () => document.removeEventListener('focusin', handleFocus);\n  }, [handleFocusOutside]);\n\n  return {\n    onFocusCapture: () => (isFocusInsideReactTreeRef.current = true),\n    onBlurCapture: () => (isFocusInsideReactTreeRef.current = false),\n  };\n}\n\nfunction dispatchUpdate() {\n  const event = new Event(CONTEXT_UPDATE);\n  document.dispatchEvent(event);\n}\n\nfunction dispatchCustomEvent<E extends CustomEvent, OriginalEvent extends Event>(\n  name: string,\n  handler: ((event: E) => void) | undefined,\n  detail: { originalEvent: OriginalEvent } & (E extends CustomEvent<infer D> ? D : never)\n) {\n  const target = detail.originalEvent.target as HTMLElement;\n  const event = new CustomEvent(name, { bubbles: false, cancelable: true, detail });\n  if (handler) target.addEventListener(name, handler as EventListener, { once: true });\n  return !target.dispatchEvent(event);\n}\n\nconst Root = DismissableLayer;\nconst Branch = DismissableLayerBranch;\n\nexport {\n  DismissableLayer,\n  DismissableLayerBranch,\n  //\n  Root,\n  Branch,\n};\nexport type { DismissableLayerProps };\n"],"names":["DismissableLayerContext","React","createContext","layers","Set","layersWithOutsidePointerEventsDisabled","branches","DismissableLayer","forwardRef","props","forwardedRef","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","context","useContext","node","setNode","useState","force","composedRefs","useComposedRefs","Array","from","highestLayerWithOutsidePointerEventsDisabled","slice","highestLayerWithOutsidePointerEventsDisabledIndex","indexOf","index","isBodyPointerEventsDisabled","size","isPointerEventsEnabled","pointerDownOutside","handlePointerDownOutside","useCallbackRef","isPointerInsideReactTreeRef","useRef","useEffect","handlePointerDown","event","target","current","dispatchCustomEvent","originalEvent","timerId","window","setTimeout","document","addEventListener","clearTimeout","removeEventListener","onPointerDownCapture","usePointerDownOutside","isPointerDownOnBranch","some","branch","contains","defaultPrevented","focusOutside","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","onFocusCapture","onBlurCapture","useFocusOutside","useEscapeKeydown","useBodyPointerEvents","disabled","add","dispatchUpdate","delete","handleUpdate","_react","createElement","Primitive","div","_babelRuntimeHelpersEsmExtends","ref","style","pointerEvents","undefined","composeEventHandlers","DismissableLayerBranch","Event","dispatchEvent","name","handler","detail","CustomEvent","bubbles","cancelable","once","Root","Branch"],"version":3,"file":"index.module.js.map"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@radix-ui/react-dismissable-layer",
-  "version": "0.1.4-rc.17",
+  "version": "0.1.4-rc.18",
   "license": "MIT",
   "source": "src/index.ts",
   "main": "dist/index.js",
@@ -19,7 +19,7 @@
     "@babel/runtime": "^7.13.10",
     "@radix-ui/primitive": "0.1.0",
     "@radix-ui/react-compose-refs": "0.1.0",
-    "@radix-ui/react-primitive": "0.1.4-rc.17",
+    "@radix-ui/react-primitive": "0.1.4-rc.18",
     "@radix-ui/react-use-body-pointer-events": "0.1.0",
     "@radix-ui/react-use-callback-ref": "0.1.0",
     "@radix-ui/react-use-escape-keydown": "0.1.0"