@radix-ui/react-dismissable-layer 0.1.4-rc.1 → 0.1.4-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/index.d.ts.map +1 -1
  2. package/dist/index.js +1 -1
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.module.js +1 -1
  5. package/dist/index.module.js.map +1 -1
  6. package/package.json +2 -2
package/dist/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"A;A;A;AAqCA,sCAAgC,SAAQ,yBAAyB;CAAG;AAEpE,OAAA,MAAM,8GAkBL,CAAC;AAOF,yBAAyB,MAAM,wBAAwB,CAAC,OAAO,UAAU,GAAG,CAAC,CAAC;AAC9E,mCAAoC,SAAQ,iBAAiB;IAC3D;A;A;A;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IAEtC;A;A;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAEjD;A;A;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAEhE;A;A;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAEpD;A;A;A;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,GAAG,iBAAiB,KAAK,IAAI,CAAC;IAEjF,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AA8GD,+BAA+B,WAAW,CAAC;IAAE,aAAa,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAC5E,yBAAyB,WAAW,CAAC;IAAE,aAAa,EAAE,UAAU,CAAA;CAAE,CAAC,CAAC;AA0JpE,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"}
1
+ {"mappings":"A;A;A;AAqCA,sCAAgC,SAAQ,yBAAyB;CAAG;AAEpE,OAAA,MAAM,8GAkBL,CAAC;AAOF,yBAAyB,MAAM,wBAAwB,CAAC,OAAO,UAAU,GAAG,CAAC,CAAC;AAC9E,mCAAoC,SAAQ,iBAAiB;IAC3D;A;A;A;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IAEtC;A;A;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAEjD;A;A;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAEhE;A;A;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAEpD;A;A;A;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,GAAG,iBAAiB,KAAK,IAAI,CAAC;IAEjF,sEAAsE;IACtE,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAgHD,+BAA+B,WAAW,CAAC;IAAE,aAAa,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAC5E,yBAAyB,WAAW,CAAC;IAAE,aAAa,EAAE,UAAU,CAAA;CAAE,CAAC,CAAC;AA0JpE,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"}
package/dist/index.js CHANGED
@@ -1,2 +1,2 @@
1
- var e,t,n,r=require("@radix-ui/react-use-escape-keydown").useEscapeKeydown,o=require("@radix-ui/react-use-callback-ref").useCallbackRef,u=require("@radix-ui/react-use-body-pointer-events").useBodyPointerEvents,i=require("@radix-ui/react-context").createContext,a=require("@radix-ui/react-primitive").Primitive,s=require("@radix-ui/primitive").composeEventHandlers,c=(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[d,f]=L(),[m,v]=P(),[E,p]=L("TotalLayerCountWithDisabledOutsidePointerEventsProvider"),[C,b]=P("RunningLayerCountWithDisabledOutsidePointerEventsProvider"),y=/*#__PURE__*/c.forwardRef(((e,t)=>{const n=0===v(),r=/*#__PURE__*/c.createElement(w,l({},e,{ref:t}));return n?/*#__PURE__*/c.createElement(d,null,/*#__PURE__*/c.createElement(E,null,r)):r}));exports.DismissableLayer=y;const w=/*#__PURE__*/c.forwardRef(((e,t)=>{const{disableOutsidePointerEvents:n=!1,onEscapeKeyDown:i,onPointerDownOutside:d,onFocusOutside:E,onInteractOutside:y,onDismiss:w,...L}=e,P=f(),D=v()+1,O=D===P,g=p(n),x=b()+(n?1:0),T=x<g;u({disabled:n}),r((e=>{O&&(null==i||i(e),e.defaultPrevented||null==w||w())}));const{onPointerDownCapture:R}=function(e){const t=o(e),n=c.useRef(!1);return c.useEffect((()=>{const e=e=>{const r=e.target;if(r&&!n.current){const n=new CustomEvent("dismissableLayer.pointerDownOutside",{bubbles:!1,cancelable:!0,detail:{originalEvent:e}});r.addEventListener("dismissableLayer.pointerDownOutside",t,{once:!0}),r.dispatchEvent(n)}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=>{T||(null==d||d(e),null==y||y(e),e.defaultPrevented||null==w||w())})),{onBlurCapture:h,onFocusCapture:q}=function(e){const t=o(e),n=c.useRef(!1);return c.useEffect((()=>{const e=e=>{const r=e.target;if(r&&!n.current){const n=new CustomEvent("dismissableLayer.focusOutside",{bubbles:!1,cancelable:!0,detail:{originalEvent:e}});r.addEventListener("dismissableLayer.focusOutside",t,{once:!0}),r.dispatchEvent(n)}};return document.addEventListener("focusin",e),()=>document.removeEventListener("focusin",e)}),[t]),{onFocusCapture:()=>n.current=!0,onBlurCapture:()=>n.current=!1}}((e=>{null==E||E(e),null==y||y(e),e.defaultPrevented||null==w||w()})),k=g>0&&!T;/*#__PURE__*/return c.createElement(m,{runningCount:D},/*#__PURE__*/c.createElement(C,{runningCount:x},/*#__PURE__*/c.createElement(a.div,l({},L,{ref:t,style:{pointerEvents:k?"auto":void 0,...L.style},onPointerDownCapture:s(e.onPointerDownCapture,R),onBlurCapture:s(e.onBlurCapture,h),onFocusCapture:s(e.onFocusCapture,q)}))))}));function L(e){const[t,n]=i("TotalLayerCount",{total:0,onTotalIncrease:()=>{},onTotalDecrease:()=>{}}),r=({children:e})=>{const[n,r]=c.useState(0);/*#__PURE__*/return c.createElement(t,{total:n,onTotalIncrease:c.useCallback((()=>r((e=>e+1))),[]),onTotalDecrease:c.useCallback((()=>r((e=>e-1))),[])},e)};return[r,function(e=!0){const{total:t,onTotalIncrease:r,onTotalDecrease:o}=n("TotalLayerCountConsumer");return c.useLayoutEffect((()=>{if(e)return r(),()=>o()}),[e,r,o]),t}]}function P(e){const[t,n]=i("RunningLayerCount",{count:0}),r=e=>{const{children:n,runningCount:r}=e;/*#__PURE__*/return c.createElement(t,{count:r},n)};return[r,function(){return n("RunningLayerCountConsumer").count||0}]}const D=y;exports.Root=D;
1
+ var e,n,t,r=require("@radix-ui/react-use-escape-keydown").useEscapeKeydown,o=require("@radix-ui/react-use-callback-ref").useCallbackRef,u=require("@radix-ui/react-use-body-pointer-events").useBodyPointerEvents,i=require("@radix-ui/react-context").createContext,a=require("@radix-ui/react-primitive").Primitive,s=require("@radix-ui/primitive").composeEventHandlers,c=(e={},n=require("react"),Object.keys(n).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return n[t]}})})),e),l=(t=require("@babel/runtime/helpers/extends"))&&t.__esModule?t.default:t;const[d,f]=L(),[m,v]=P(),[E,p]=L("TotalLayerCountWithDisabledOutsidePointerEventsProvider"),[C,b]=P("RunningLayerCountWithDisabledOutsidePointerEventsProvider"),y=/*#__PURE__*/c.forwardRef(((e,n)=>{const t=0===v(),r=/*#__PURE__*/c.createElement(w,l({},e,{ref:n}));return t?/*#__PURE__*/c.createElement(d,null,/*#__PURE__*/c.createElement(E,null,r)):r}));exports.DismissableLayer=y;const w=/*#__PURE__*/c.forwardRef(((e,n)=>{const{disableOutsidePointerEvents:t=!1,onEscapeKeyDown:i,onPointerDownOutside:d,onFocusOutside:E,onInteractOutside:y,onDismiss:w,...L}=e,P=f(),D=v()+1,O=D===P,g=p(t),x=b()+(t?1:0),T=x<g;u({disabled:t}),r((e=>{O&&(null==i||i(e),e.defaultPrevented||null==w||w())}));const{onPointerDownCapture:R}=function(e){const n=o(e),t=c.useRef(!1);return c.useEffect((()=>{const e=e=>{const r=e.target;if(r&&!t.current){const t=new CustomEvent("dismissableLayer.pointerDownOutside",{bubbles:!1,cancelable:!0,detail:{originalEvent:e}});r.addEventListener("dismissableLayer.pointerDownOutside",n,{once:!0}),r.dispatchEvent(t)}t.current=!1},r=window.setTimeout((()=>{document.addEventListener("pointerdown",e)}),0);return()=>{window.clearTimeout(r),document.removeEventListener("pointerdown",e)}}),[n]),{onPointerDownCapture:()=>t.current=!0}}((e=>{T||(null==d||d(e),null==y||y(e),e.defaultPrevented||null==w||w())})),{onBlurCapture:h,onFocusCapture:q}=function(e){const n=o(e),t=c.useRef(!1);return c.useEffect((()=>{const e=e=>{const r=e.target;if(r&&!t.current){const t=new CustomEvent("dismissableLayer.focusOutside",{bubbles:!1,cancelable:!0,detail:{originalEvent:e}});r.addEventListener("dismissableLayer.focusOutside",n,{once:!0}),r.dispatchEvent(t)}};return document.addEventListener("focusin",e),()=>document.removeEventListener("focusin",e)}),[n]),{onFocusCapture:()=>t.current=!0,onBlurCapture:()=>t.current=!1}}((e=>{null==E||E(e),null==y||y(e),e.defaultPrevented||null==w||w()})),k=g>0;/*#__PURE__*/return c.createElement(m,{runningCount:D},/*#__PURE__*/c.createElement(C,{runningCount:x},/*#__PURE__*/c.createElement(a.div,l({},L,{ref:n,style:{pointerEvents:k?T?"none":"auto":void 0,...L.style},onPointerDownCapture:s(e.onPointerDownCapture,R),onBlurCapture:s(e.onBlurCapture,h),onFocusCapture:s(e.onFocusCapture,q)}))))}));function L(e){const[n,t]=i("TotalLayerCount",{total:0,onTotalIncrease:()=>{},onTotalDecrease:()=>{}}),r=({children:e})=>{const[t,r]=c.useState(0);/*#__PURE__*/return c.createElement(n,{total:t,onTotalIncrease:c.useCallback((()=>r((e=>e+1))),[]),onTotalDecrease:c.useCallback((()=>r((e=>e-1))),[])},e)};return[r,function(e=!0){const{total:n,onTotalIncrease:r,onTotalDecrease:o}=t("TotalLayerCountConsumer");return c.useLayoutEffect((()=>{if(e)return r(),()=>o()}),[e,r,o]),n}]}function P(e){const[n,t]=i("RunningLayerCount",{count:0}),r=e=>{const{children:t,runningCount:r}=e;/*#__PURE__*/return c.createElement(n,{count:r},t)};return[r,function(){return t("RunningLayerCountConsumer").count||0}]}const D=y;exports.Root=D;
2
2
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +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 { createContext } from '@radix-ui/react-context';\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// We need to compute the total count of layers AND a running count of all layers\n// in order to find which layer is the deepest one.\n// This is use to only dismiss the deepest layer when using the escape key\n// because we bind the key listener to document so cannot take advantage of event.stopPropagation()\nconst [TotalLayerCountProvider, useTotalLayerCount] = createTotalLayerCount();\nconst [RunningLayerCountProvider, usePreviousRunningLayerCount] = createRunningLayerCount();\n\n// We need to compute the total count of layers which set `disableOutsidePointerEvents` to `true` AND\n// a running count of all the layers which set `disableOutsidePointerEvents` to `true` in order to determine\n// which layers should be dismissed when interacting outside.\n// (ie. all layers that do not have a child layer which sets `disableOutsidePointerEvents` to `true`)\nconst [\n TotalLayerCountWithDisabledOutsidePointerEventsProvider,\n useTotalLayerCountWithDisabledOutsidePointerEvents,\n] = createTotalLayerCount('TotalLayerCountWithDisabledOutsidePointerEventsProvider');\nconst [\n RunningLayerCountWithDisabledOutsidePointerEventsProvider,\n usePreviousRunningLayerCountWithDisabledOutsidePointerEvents,\n] = createRunningLayerCount('RunningLayerCountWithDisabledOutsidePointerEventsProvider');\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayer\n * -----------------------------------------------------------------------------------------------*/\n\nconst DISMISSABLE_LAYER_NAME = 'DismissableLayer';\n\ntype DismissableLayerElement = DismissableLayerImplElement;\ninterface DismissableLayerProps extends DismissableLayerImplProps {}\n\nconst DismissableLayer = React.forwardRef<DismissableLayerElement, DismissableLayerProps>(\n (props, forwardedRef) => {\n const runningLayerCount = usePreviousRunningLayerCount();\n const isRootLayer = runningLayerCount === 0;\n const layer = <DismissableLayerImpl {...props} ref={forwardedRef} />;\n\n // if it's the root layer, we wrap it with our necessary root providers\n // (effectively we wrap the whole tree of nested layers)\n return isRootLayer ? (\n <TotalLayerCountProvider>\n <TotalLayerCountWithDisabledOutsidePointerEventsProvider>\n {layer}\n </TotalLayerCountWithDisabledOutsidePointerEventsProvider>\n </TotalLayerCountProvider>\n ) : (\n layer\n );\n }\n);\n\nDismissableLayer.displayName = DISMISSABLE_LAYER_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DismissableLayerImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface DismissableLayerImplProps 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 /**\n * Event handler called when the escape key is down.\n * Can be prevented.\n */\n onEscapeKeyDown?: (event: KeyboardEvent) => void;\n\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 /**\n * Event handler called when the focus moves outside of the `DismissableLayer`.\n * Can be prevented.\n */\n onFocusOutside?: (event: FocusOutsideEvent) => void;\n\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 /** Callback called when the `DismissableLayer` should be dismissed */\n onDismiss?: () => void;\n}\n\nconst DismissableLayerImpl = React.forwardRef<\n DismissableLayerImplElement,\n DismissableLayerImplProps\n>((props, forwardedRef) => {\n const {\n disableOutsidePointerEvents = false,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n onDismiss,\n ...layerProps\n } = props;\n\n const totalLayerCount = useTotalLayerCount();\n const prevRunningLayerCount = usePreviousRunningLayerCount();\n const runningLayerCount = prevRunningLayerCount + 1;\n const isDeepestLayer = runningLayerCount === totalLayerCount;\n\n const totalLayerCountWithDisabledOutsidePointerEvents =\n useTotalLayerCountWithDisabledOutsidePointerEvents(disableOutsidePointerEvents);\n const prevRunningLayerCountWithDisabledOutsidePointerEvents =\n usePreviousRunningLayerCountWithDisabledOutsidePointerEvents();\n const runningLayerCountWithDisabledOutsidePointerEvents =\n prevRunningLayerCountWithDisabledOutsidePointerEvents + (disableOutsidePointerEvents ? 1 : 0);\n const containsChildLayerWithDisabledOutsidePointerEvents =\n runningLayerCountWithDisabledOutsidePointerEvents <\n totalLayerCountWithDisabledOutsidePointerEvents;\n\n // Disable pointer-events on `document.body` when at least one layer is disabling outside pointer events\n useBodyPointerEvents({ disabled: disableOutsidePointerEvents });\n\n // Dismiss on escape\n useEscapeKeydown((event) => {\n // Only dismiss if it's the deepest layer. his is effectively mimicking\n // event.stopPropagation from the layer with disabled outside pointer events.\n if (isDeepestLayer) {\n onEscapeKeyDown?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n });\n\n // Dismiss on pointer down outside\n const { onPointerDownCapture: handlePointerDownCapture } = usePointerDownOutside((event) => {\n // Only dismiss if there's no deeper layer which disabled pointer events outside itself\n if (!containsChildLayerWithDisabledOutsidePointerEvents) {\n onPointerDownOutside?.(event);\n onInteractOutside?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n });\n\n // Dismiss on focus outside\n const { onBlurCapture: handleBlurCapture, onFocusCapture: handleFocusCapture } = useFocusOutside(\n (event) => {\n onFocusOutside?.(event);\n onInteractOutside?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n );\n\n // If we have disabled pointer events on body, we need to reset `pointerEvents: 'auto'`\n // on some layers. This depends on which layers set `disableOutsidePointerEvents` to `true`.\n //\n // NOTE: it's important we set it on ALL layers that need it as we cannot simply\n // set it on the deepest layer which sets `disableOutsidePointerEvents` to `true` and rely\n // on inheritence. This is because layers may be rendered in different portals where\n // inheritence wouldn't apply, so we need to set it explicity on its children too.\n const isBodyPointerEventsDisabled = totalLayerCountWithDisabledOutsidePointerEvents > 0;\n const shouldReEnablePointerEvents =\n isBodyPointerEventsDisabled && !containsChildLayerWithDisabledOutsidePointerEvents;\n\n return (\n <RunningLayerCountProvider runningCount={runningLayerCount}>\n <RunningLayerCountWithDisabledOutsidePointerEventsProvider\n runningCount={runningLayerCountWithDisabledOutsidePointerEvents}\n >\n <Primitive.div\n {...layerProps}\n ref={forwardedRef}\n style={{\n pointerEvents: shouldReEnablePointerEvents ? 'auto' : undefined,\n ...layerProps.style,\n }}\n onPointerDownCapture={composeEventHandlers(\n props.onPointerDownCapture,\n handlePointerDownCapture\n )}\n onBlurCapture={composeEventHandlers(props.onBlurCapture, handleBlurCapture)}\n onFocusCapture={composeEventHandlers(props.onFocusCapture, handleFocusCapture)}\n />\n </RunningLayerCountWithDisabledOutsidePointerEventsProvider>\n </RunningLayerCountProvider>\n );\n});\n\n/* -------------------------------------------------------------------------------------------------\n * Utility hooks\n * -----------------------------------------------------------------------------------------------*/\n\nconst POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';\nconst FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';\ntype PointerDownOutsideEvent = CustomEvent<{ originalEvent: PointerEvent }>;\ntype FocusOutsideEvent = CustomEvent<{ originalEvent: FocusEvent }>;\n\n/**\n * Sets up `pointerdown` listener which listens for events outside a react subtree.\n *\n * We use `pointerdown` rather than `pointerup` to mimic layer dismissing behaviour\n * present in OS which usually happens on `pointerdown`.\n *\n * Returns props to pass to the node we want to check for outside events.\n */\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 const target = event.target;\n if (target && !isPointerInsideReactTreeRef.current) {\n const pointerDownOutsideEvent: PointerDownOutsideEvent = new CustomEvent(\n POINTER_DOWN_OUTSIDE,\n { bubbles: false, cancelable: true, detail: { originalEvent: event } }\n );\n target.addEventListener(POINTER_DOWN_OUTSIDE, handlePointerDownOutside, { once: true });\n target.dispatchEvent(pointerDownOutsideEvent);\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 */\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 const target = event.target;\n if (target && !isFocusInsideReactTreeRef.current) {\n const focusOutsideEvent: FocusOutsideEvent = new CustomEvent(FOCUS_OUTSIDE, {\n bubbles: false,\n cancelable: true,\n detail: { originalEvent: event },\n });\n target.addEventListener(FOCUS_OUTSIDE, handleFocusOutside, { once: true });\n target.dispatchEvent(focusOutsideEvent);\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\n/* -------------------------------------------------------------------------------------------------\n * Layer counting utilities\n * -----------------------------------------------------------------------------------------------*/\n\nfunction createTotalLayerCount(displayName?: string) {\n const [TotalLayerCountProviderImpl, useTotalLayerCountContext] = createContext(\n 'TotalLayerCount',\n { total: 0, onTotalIncrease: () => {}, onTotalDecrease: () => {} }\n );\n\n const TotalLayerCountProvider: React.FC = ({ children }) => {\n const [total, setTotal] = React.useState(0);\n return (\n <TotalLayerCountProviderImpl\n total={total}\n onTotalIncrease={React.useCallback(() => setTotal((n) => n + 1), [])}\n onTotalDecrease={React.useCallback(() => setTotal((n) => n - 1), [])}\n >\n {children}\n </TotalLayerCountProviderImpl>\n );\n };\n if (displayName) {\n TotalLayerCountProvider.displayName = displayName;\n }\n\n function useTotalLayerCount(counted = true) {\n const { total, onTotalIncrease, onTotalDecrease } =\n useTotalLayerCountContext('TotalLayerCountConsumer');\n\n React.useLayoutEffect(() => {\n if (counted) {\n onTotalIncrease();\n return () => onTotalDecrease();\n }\n }, [counted, onTotalIncrease, onTotalDecrease]);\n\n return total;\n }\n\n return [TotalLayerCountProvider, useTotalLayerCount] as const;\n}\n\nfunction createRunningLayerCount(displayName?: string) {\n const [RunningLayerCountProviderImp, useRunningLayerCount] = createContext('RunningLayerCount', {\n count: 0,\n });\n\n const RunningLayerCountProvider: React.FC<{ runningCount: number }> = (props) => {\n const { children, runningCount } = props;\n return (\n <RunningLayerCountProviderImp count={runningCount}>{children}</RunningLayerCountProviderImp>\n );\n };\n if (displayName) {\n RunningLayerCountProvider.displayName = displayName;\n }\n\n function usePreviousRunningLayerCount() {\n const context = useRunningLayerCount('RunningLayerCountConsumer');\n return context.count || 0;\n }\n\n return [RunningLayerCountProvider, usePreviousRunningLayerCount] as const;\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","TotalLayerCountProvider","useTotalLayerCount","createTotalLayerCount","RunningLayerCountProvider","usePreviousRunningLayerCount","createRunningLayerCount","TotalLayerCountWithDisabledOutsidePointerEventsProvider","useTotalLayerCountWithDisabledOutsidePointerEvents","RunningLayerCountWithDisabledOutsidePointerEventsProvider","usePreviousRunningLayerCountWithDisabledOutsidePointerEvents","DismissableLayer","React","forwardRef","props","forwardedRef","isRootLayer","layer","_react","createElement","$cf1f9d06ae8d213f1b082610036f62b$var$DismissableLayerImpl","_babelRuntimeHelpersExtends","ref","$cf1f9d06ae8d213f1b082610036f62b$var$TotalLayerCountProvider","$cf1f9d06ae8d213f1b082610036f62b$var$TotalLayerCountWithDisabledOutsidePointerEventsProvider","DismissableLayerImpl","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","totalLayerCount","runningLayerCount","isDeepestLayer","totalLayerCountWithDisabledOutsidePointerEvents","runningLayerCountWithDisabledOutsidePointerEvents","containsChildLayerWithDisabledOutsidePointerEvents","useBodyPointerEvents","disabled","useEscapeKeydown","event","defaultPrevented","onPointerDownCapture","handlePointerDownCapture","handlePointerDownOutside","useCallbackRef","isPointerInsideReactTreeRef","useRef","useEffect","handlePointerDown","target","current","pointerDownOutsideEvent","CustomEvent","bubbles","cancelable","detail","originalEvent","addEventListener","once","dispatchEvent","timerId","window","setTimeout","document","clearTimeout","removeEventListener","usePointerDownOutside","onBlurCapture","handleBlurCapture","onFocusCapture","handleFocusCapture","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","focusOutsideEvent","useFocusOutside","shouldReEnablePointerEvents","$cf1f9d06ae8d213f1b082610036f62b$var$RunningLayerCountProvider","runningCount","$cf1f9d06ae8d213f1b082610036f62b$var$RunningLayerCountWithDisabledOutsidePointerEventsProvider","Primitive","div","style","pointerEvents","undefined","composeEventHandlers","displayName","TotalLayerCountProviderImpl","useTotalLayerCountContext","createContext","total","onTotalIncrease","onTotalDecrease","children","setTotal","useState","useCallback","n","counted","useLayoutEffect","RunningLayerCountProviderImp","useRunningLayerCount","count","Root"],"version":3,"file":"index.js.map"}
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 { createContext } from '@radix-ui/react-context';\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// We need to compute the total count of layers AND a running count of all layers\n// in order to find which layer is the deepest one.\n// This is use to only dismiss the deepest layer when using the escape key\n// because we bind the key listener to document so cannot take advantage of event.stopPropagation()\nconst [TotalLayerCountProvider, useTotalLayerCount] = createTotalLayerCount();\nconst [RunningLayerCountProvider, usePreviousRunningLayerCount] = createRunningLayerCount();\n\n// We need to compute the total count of layers which set `disableOutsidePointerEvents` to `true` AND\n// a running count of all the layers which set `disableOutsidePointerEvents` to `true` in order to determine\n// which layers should be dismissed when interacting outside.\n// (ie. all layers that do not have a child layer which sets `disableOutsidePointerEvents` to `true`)\nconst [\n TotalLayerCountWithDisabledOutsidePointerEventsProvider,\n useTotalLayerCountWithDisabledOutsidePointerEvents,\n] = createTotalLayerCount('TotalLayerCountWithDisabledOutsidePointerEventsProvider');\nconst [\n RunningLayerCountWithDisabledOutsidePointerEventsProvider,\n usePreviousRunningLayerCountWithDisabledOutsidePointerEvents,\n] = createRunningLayerCount('RunningLayerCountWithDisabledOutsidePointerEventsProvider');\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayer\n * -----------------------------------------------------------------------------------------------*/\n\nconst DISMISSABLE_LAYER_NAME = 'DismissableLayer';\n\ntype DismissableLayerElement = DismissableLayerImplElement;\ninterface DismissableLayerProps extends DismissableLayerImplProps {}\n\nconst DismissableLayer = React.forwardRef<DismissableLayerElement, DismissableLayerProps>(\n (props, forwardedRef) => {\n const runningLayerCount = usePreviousRunningLayerCount();\n const isRootLayer = runningLayerCount === 0;\n const layer = <DismissableLayerImpl {...props} ref={forwardedRef} />;\n\n // if it's the root layer, we wrap it with our necessary root providers\n // (effectively we wrap the whole tree of nested layers)\n return isRootLayer ? (\n <TotalLayerCountProvider>\n <TotalLayerCountWithDisabledOutsidePointerEventsProvider>\n {layer}\n </TotalLayerCountWithDisabledOutsidePointerEventsProvider>\n </TotalLayerCountProvider>\n ) : (\n layer\n );\n }\n);\n\nDismissableLayer.displayName = DISMISSABLE_LAYER_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DismissableLayerImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface DismissableLayerImplProps 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 /**\n * Event handler called when the escape key is down.\n * Can be prevented.\n */\n onEscapeKeyDown?: (event: KeyboardEvent) => void;\n\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 /**\n * Event handler called when the focus moves outside of the `DismissableLayer`.\n * Can be prevented.\n */\n onFocusOutside?: (event: FocusOutsideEvent) => void;\n\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 /** Callback called when the `DismissableLayer` should be dismissed */\n onDismiss?: () => void;\n}\n\nconst DismissableLayerImpl = React.forwardRef<\n DismissableLayerImplElement,\n DismissableLayerImplProps\n>((props, forwardedRef) => {\n const {\n disableOutsidePointerEvents = false,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n onDismiss,\n ...layerProps\n } = props;\n\n const totalLayerCount = useTotalLayerCount();\n const prevRunningLayerCount = usePreviousRunningLayerCount();\n const runningLayerCount = prevRunningLayerCount + 1;\n const isDeepestLayer = runningLayerCount === totalLayerCount;\n\n const totalLayerCountWithDisabledOutsidePointerEvents =\n useTotalLayerCountWithDisabledOutsidePointerEvents(disableOutsidePointerEvents);\n const prevRunningLayerCountWithDisabledOutsidePointerEvents =\n usePreviousRunningLayerCountWithDisabledOutsidePointerEvents();\n const runningLayerCountWithDisabledOutsidePointerEvents =\n prevRunningLayerCountWithDisabledOutsidePointerEvents + (disableOutsidePointerEvents ? 1 : 0);\n const containsChildLayerWithDisabledOutsidePointerEvents =\n runningLayerCountWithDisabledOutsidePointerEvents <\n totalLayerCountWithDisabledOutsidePointerEvents;\n\n // Disable pointer-events on `document.body` when at least one layer is disabling outside pointer events\n useBodyPointerEvents({ disabled: disableOutsidePointerEvents });\n\n // Dismiss on escape\n useEscapeKeydown((event) => {\n // Only dismiss if it's the deepest layer. his is effectively mimicking\n // event.stopPropagation from the layer with disabled outside pointer events.\n if (isDeepestLayer) {\n onEscapeKeyDown?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n });\n\n // Dismiss on pointer down outside\n const { onPointerDownCapture: handlePointerDownCapture } = usePointerDownOutside((event) => {\n // Only dismiss if there's no deeper layer which disabled pointer events outside itself\n if (!containsChildLayerWithDisabledOutsidePointerEvents) {\n onPointerDownOutside?.(event);\n onInteractOutside?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n });\n\n // Dismiss on focus outside\n const { onBlurCapture: handleBlurCapture, onFocusCapture: handleFocusCapture } = useFocusOutside(\n (event) => {\n onFocusOutside?.(event);\n onInteractOutside?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n );\n\n // If we have disabled pointer events on body, we need to reset `pointerEvents: 'auto'`\n // on some layers. This depends on which layers set `disableOutsidePointerEvents` to `true`.\n //\n // NOTE: it's important we set it on ALL layers that need it as we cannot simply\n // set it on the deepest layer which sets `disableOutsidePointerEvents` to `true` and rely\n // on inheritence. This is because layers may be rendered in different portals where\n // inheritence wouldn't apply, so we need to set it explicity on its children too.\n const isBodyPointerEventsDisabled = totalLayerCountWithDisabledOutsidePointerEvents > 0;\n\n return (\n <RunningLayerCountProvider runningCount={runningLayerCount}>\n <RunningLayerCountWithDisabledOutsidePointerEventsProvider\n runningCount={runningLayerCountWithDisabledOutsidePointerEvents}\n >\n <Primitive.div\n {...layerProps}\n ref={forwardedRef}\n style={{\n pointerEvents: isBodyPointerEventsDisabled\n ? containsChildLayerWithDisabledOutsidePointerEvents\n ? 'none'\n : 'auto'\n : undefined,\n ...layerProps.style,\n }}\n onPointerDownCapture={composeEventHandlers(\n props.onPointerDownCapture,\n handlePointerDownCapture\n )}\n onBlurCapture={composeEventHandlers(props.onBlurCapture, handleBlurCapture)}\n onFocusCapture={composeEventHandlers(props.onFocusCapture, handleFocusCapture)}\n />\n </RunningLayerCountWithDisabledOutsidePointerEventsProvider>\n </RunningLayerCountProvider>\n );\n});\n\n/* -------------------------------------------------------------------------------------------------\n * Utility hooks\n * -----------------------------------------------------------------------------------------------*/\n\nconst POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';\nconst FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';\ntype PointerDownOutsideEvent = CustomEvent<{ originalEvent: PointerEvent }>;\ntype FocusOutsideEvent = CustomEvent<{ originalEvent: FocusEvent }>;\n\n/**\n * Sets up `pointerdown` listener which listens for events outside a react subtree.\n *\n * We use `pointerdown` rather than `pointerup` to mimic layer dismissing behaviour\n * present in OS which usually happens on `pointerdown`.\n *\n * Returns props to pass to the node we want to check for outside events.\n */\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 const target = event.target;\n if (target && !isPointerInsideReactTreeRef.current) {\n const pointerDownOutsideEvent: PointerDownOutsideEvent = new CustomEvent(\n POINTER_DOWN_OUTSIDE,\n { bubbles: false, cancelable: true, detail: { originalEvent: event } }\n );\n target.addEventListener(POINTER_DOWN_OUTSIDE, handlePointerDownOutside, { once: true });\n target.dispatchEvent(pointerDownOutsideEvent);\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 */\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 const target = event.target;\n if (target && !isFocusInsideReactTreeRef.current) {\n const focusOutsideEvent: FocusOutsideEvent = new CustomEvent(FOCUS_OUTSIDE, {\n bubbles: false,\n cancelable: true,\n detail: { originalEvent: event },\n });\n target.addEventListener(FOCUS_OUTSIDE, handleFocusOutside, { once: true });\n target.dispatchEvent(focusOutsideEvent);\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\n/* -------------------------------------------------------------------------------------------------\n * Layer counting utilities\n * -----------------------------------------------------------------------------------------------*/\n\nfunction createTotalLayerCount(displayName?: string) {\n const [TotalLayerCountProviderImpl, useTotalLayerCountContext] = createContext(\n 'TotalLayerCount',\n { total: 0, onTotalIncrease: () => {}, onTotalDecrease: () => {} }\n );\n\n const TotalLayerCountProvider: React.FC = ({ children }) => {\n const [total, setTotal] = React.useState(0);\n return (\n <TotalLayerCountProviderImpl\n total={total}\n onTotalIncrease={React.useCallback(() => setTotal((n) => n + 1), [])}\n onTotalDecrease={React.useCallback(() => setTotal((n) => n - 1), [])}\n >\n {children}\n </TotalLayerCountProviderImpl>\n );\n };\n if (displayName) {\n TotalLayerCountProvider.displayName = displayName;\n }\n\n function useTotalLayerCount(counted = true) {\n const { total, onTotalIncrease, onTotalDecrease } =\n useTotalLayerCountContext('TotalLayerCountConsumer');\n\n React.useLayoutEffect(() => {\n if (counted) {\n onTotalIncrease();\n return () => onTotalDecrease();\n }\n }, [counted, onTotalIncrease, onTotalDecrease]);\n\n return total;\n }\n\n return [TotalLayerCountProvider, useTotalLayerCount] as const;\n}\n\nfunction createRunningLayerCount(displayName?: string) {\n const [RunningLayerCountProviderImp, useRunningLayerCount] = createContext('RunningLayerCount', {\n count: 0,\n });\n\n const RunningLayerCountProvider: React.FC<{ runningCount: number }> = (props) => {\n const { children, runningCount } = props;\n return (\n <RunningLayerCountProviderImp count={runningCount}>{children}</RunningLayerCountProviderImp>\n );\n };\n if (displayName) {\n RunningLayerCountProvider.displayName = displayName;\n }\n\n function usePreviousRunningLayerCount() {\n const context = useRunningLayerCount('RunningLayerCountConsumer');\n return context.count || 0;\n }\n\n return [RunningLayerCountProvider, usePreviousRunningLayerCount] as const;\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","TotalLayerCountProvider","useTotalLayerCount","createTotalLayerCount","RunningLayerCountProvider","usePreviousRunningLayerCount","createRunningLayerCount","TotalLayerCountWithDisabledOutsidePointerEventsProvider","useTotalLayerCountWithDisabledOutsidePointerEvents","RunningLayerCountWithDisabledOutsidePointerEventsProvider","usePreviousRunningLayerCountWithDisabledOutsidePointerEvents","DismissableLayer","React","forwardRef","props","forwardedRef","isRootLayer","layer","_react","createElement","$cf1f9d06ae8d213f1b082610036f62b$var$DismissableLayerImpl","_babelRuntimeHelpersExtends","ref","$cf1f9d06ae8d213f1b082610036f62b$var$TotalLayerCountProvider","$cf1f9d06ae8d213f1b082610036f62b$var$TotalLayerCountWithDisabledOutsidePointerEventsProvider","DismissableLayerImpl","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","totalLayerCount","runningLayerCount","isDeepestLayer","totalLayerCountWithDisabledOutsidePointerEvents","runningLayerCountWithDisabledOutsidePointerEvents","containsChildLayerWithDisabledOutsidePointerEvents","useBodyPointerEvents","disabled","useEscapeKeydown","event","defaultPrevented","onPointerDownCapture","handlePointerDownCapture","handlePointerDownOutside","useCallbackRef","isPointerInsideReactTreeRef","useRef","useEffect","handlePointerDown","target","current","pointerDownOutsideEvent","CustomEvent","bubbles","cancelable","detail","originalEvent","addEventListener","once","dispatchEvent","timerId","window","setTimeout","document","clearTimeout","removeEventListener","usePointerDownOutside","onBlurCapture","handleBlurCapture","onFocusCapture","handleFocusCapture","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","focusOutsideEvent","useFocusOutside","isBodyPointerEventsDisabled","$cf1f9d06ae8d213f1b082610036f62b$var$RunningLayerCountProvider","runningCount","$cf1f9d06ae8d213f1b082610036f62b$var$RunningLayerCountWithDisabledOutsidePointerEventsProvider","Primitive","div","style","pointerEvents","undefined","composeEventHandlers","displayName","TotalLayerCountProviderImpl","useTotalLayerCountContext","createContext","total","onTotalIncrease","onTotalDecrease","children","setTotal","useState","useCallback","n","counted","useLayoutEffect","RunningLayerCountProviderImp","useRunningLayerCount","count","Root"],"version":3,"file":"index.js.map"}
package/dist/index.module.js CHANGED
@@ -1,2 +1,2 @@
1
- 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{createContext as r}from"@radix-ui/react-context";import{Primitive as o}from"@radix-ui/react-primitive";import{composeEventHandlers as u}from"@radix-ui/primitive";import*as i from"react";import s from"@babel/runtime/helpers/esm/extends";const[a,c]=C(),[l,d]=b(),[m,f]=C("TotalLayerCountWithDisabledOutsidePointerEventsProvider"),[p,v]=b("RunningLayerCountWithDisabledOutsidePointerEventsProvider");export const DismissableLayer=/*#__PURE__*/i.forwardRef(((e,t)=>{const n=0===d(),r=/*#__PURE__*/i.createElement(E,s({},e,{ref:t}));return n?/*#__PURE__*/i.createElement(a,null,/*#__PURE__*/i.createElement(m,null,r)):r}));/*#__PURE__*/const E=/*#__PURE__*/i.forwardRef(((r,a)=>{const{disableOutsidePointerEvents:m=!1,onEscapeKeyDown:E,onPointerDownOutside:C,onFocusOutside:b,onInteractOutside:w,onDismiss:L,...y}=r,D=c(),P=d()+1,T=P===D,g=f(m),x=v()+(m?1:0),O=x<g;n({disabled:m}),e((e=>{T&&(null==E||E(e),e.defaultPrevented||null==L||L())}));const{onPointerDownCapture:R}=function(e){const n=t(e),r=i.useRef(!1);return i.useEffect((()=>{const e=e=>{const t=e.target;if(t&&!r.current){const r=new CustomEvent("dismissableLayer.pointerDownOutside",{bubbles:!1,cancelable:!0,detail:{originalEvent:e}});t.addEventListener("dismissableLayer.pointerDownOutside",n,{once:!0}),t.dispatchEvent(r)}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=>{O||(null==C||C(e),null==w||w(e),e.defaultPrevented||null==L||L())})),{onBlurCapture:h,onFocusCapture:F}=function(e){const n=t(e),r=i.useRef(!1);return i.useEffect((()=>{const e=e=>{const t=e.target;if(t&&!r.current){const r=new CustomEvent("dismissableLayer.focusOutside",{bubbles:!1,cancelable:!0,detail:{originalEvent:e}});t.addEventListener("dismissableLayer.focusOutside",n,{once:!0}),t.dispatchEvent(r)}};return document.addEventListener("focusin",e),()=>document.removeEventListener("focusin",e)}),[n]),{onFocusCapture:()=>r.current=!0,onBlurCapture:()=>r.current=!1}}((e=>{null==b||b(e),null==w||w(e),e.defaultPrevented||null==L||L()})),k=g>0&&!O;/*#__PURE__*/return i.createElement(l,{runningCount:P},/*#__PURE__*/i.createElement(p,{runningCount:x},/*#__PURE__*/i.createElement(o.div,s({},y,{ref:a,style:{pointerEvents:k?"auto":void 0,...y.style},onPointerDownCapture:u(r.onPointerDownCapture,R),onBlurCapture:u(r.onBlurCapture,h),onFocusCapture:u(r.onFocusCapture,F)}))))}));function C(e){const[t,n]=r("TotalLayerCount",{total:0,onTotalIncrease:()=>{},onTotalDecrease:()=>{}}),o=({children:e})=>{const[n,r]=i.useState(0);/*#__PURE__*/return i.createElement(t,{total:n,onTotalIncrease:i.useCallback((()=>r((e=>e+1))),[]),onTotalDecrease:i.useCallback((()=>r((e=>e-1))),[])},e)};return[o,function(e=!0){const{total:t,onTotalIncrease:r,onTotalDecrease:o}=n("TotalLayerCountConsumer");return i.useLayoutEffect((()=>{if(e)return r(),()=>o()}),[e,r,o]),t}]}function b(e){const[t,n]=r("RunningLayerCount",{count:0}),o=e=>{const{children:n,runningCount:r}=e;/*#__PURE__*/return i.createElement(t,{count:r},n)};return[o,function(){return n("RunningLayerCountConsumer").count||0}]}export const Root=DismissableLayer;
1
+ 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{createContext as r}from"@radix-ui/react-context";import{Primitive as o}from"@radix-ui/react-primitive";import{composeEventHandlers as u}from"@radix-ui/primitive";import*as i from"react";import s from"@babel/runtime/helpers/esm/extends";const[a,c]=C(),[l,d]=b(),[m,f]=C("TotalLayerCountWithDisabledOutsidePointerEventsProvider"),[p,v]=b("RunningLayerCountWithDisabledOutsidePointerEventsProvider");export const DismissableLayer=/*#__PURE__*/i.forwardRef(((e,t)=>{const n=0===d(),r=/*#__PURE__*/i.createElement(E,s({},e,{ref:t}));return n?/*#__PURE__*/i.createElement(a,null,/*#__PURE__*/i.createElement(m,null,r)):r}));/*#__PURE__*/const E=/*#__PURE__*/i.forwardRef(((r,a)=>{const{disableOutsidePointerEvents:m=!1,onEscapeKeyDown:E,onPointerDownOutside:C,onFocusOutside:b,onInteractOutside:w,onDismiss:L,...y}=r,D=c(),P=d()+1,T=P===D,g=f(m),x=v()+(m?1:0),O=x<g;n({disabled:m}),e((e=>{T&&(null==E||E(e),e.defaultPrevented||null==L||L())}));const{onPointerDownCapture:R}=function(e){const n=t(e),r=i.useRef(!1);return i.useEffect((()=>{const e=e=>{const t=e.target;if(t&&!r.current){const r=new CustomEvent("dismissableLayer.pointerDownOutside",{bubbles:!1,cancelable:!0,detail:{originalEvent:e}});t.addEventListener("dismissableLayer.pointerDownOutside",n,{once:!0}),t.dispatchEvent(r)}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=>{O||(null==C||C(e),null==w||w(e),e.defaultPrevented||null==L||L())})),{onBlurCapture:h,onFocusCapture:F}=function(e){const n=t(e),r=i.useRef(!1);return i.useEffect((()=>{const e=e=>{const t=e.target;if(t&&!r.current){const r=new CustomEvent("dismissableLayer.focusOutside",{bubbles:!1,cancelable:!0,detail:{originalEvent:e}});t.addEventListener("dismissableLayer.focusOutside",n,{once:!0}),t.dispatchEvent(r)}};return document.addEventListener("focusin",e),()=>document.removeEventListener("focusin",e)}),[n]),{onFocusCapture:()=>r.current=!0,onBlurCapture:()=>r.current=!1}}((e=>{null==b||b(e),null==w||w(e),e.defaultPrevented||null==L||L()})),k=g>0;/*#__PURE__*/return i.createElement(l,{runningCount:P},/*#__PURE__*/i.createElement(p,{runningCount:x},/*#__PURE__*/i.createElement(o.div,s({},y,{ref:a,style:{pointerEvents:k?O?"none":"auto":void 0,...y.style},onPointerDownCapture:u(r.onPointerDownCapture,R),onBlurCapture:u(r.onBlurCapture,h),onFocusCapture:u(r.onFocusCapture,F)}))))}));function C(e){const[t,n]=r("TotalLayerCount",{total:0,onTotalIncrease:()=>{},onTotalDecrease:()=>{}}),o=({children:e})=>{const[n,r]=i.useState(0);/*#__PURE__*/return i.createElement(t,{total:n,onTotalIncrease:i.useCallback((()=>r((e=>e+1))),[]),onTotalDecrease:i.useCallback((()=>r((e=>e-1))),[])},e)};return[o,function(e=!0){const{total:t,onTotalIncrease:r,onTotalDecrease:o}=n("TotalLayerCountConsumer");return i.useLayoutEffect((()=>{if(e)return r(),()=>o()}),[e,r,o]),t}]}function b(e){const[t,n]=r("RunningLayerCount",{count:0}),o=e=>{const{children:n,runningCount:r}=e;/*#__PURE__*/return i.createElement(t,{count:r},n)};return[o,function(){return n("RunningLayerCountConsumer").count||0}]}export const Root=DismissableLayer;
2
2
  //# sourceMappingURL=index.module.js.map
package/dist/index.module.js.map CHANGED
@@ -1 +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 { createContext } from '@radix-ui/react-context';\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// We need to compute the total count of layers AND a running count of all layers\n// in order to find which layer is the deepest one.\n// This is use to only dismiss the deepest layer when using the escape key\n// because we bind the key listener to document so cannot take advantage of event.stopPropagation()\nconst [TotalLayerCountProvider, useTotalLayerCount] = createTotalLayerCount();\nconst [RunningLayerCountProvider, usePreviousRunningLayerCount] = createRunningLayerCount();\n\n// We need to compute the total count of layers which set `disableOutsidePointerEvents` to `true` AND\n// a running count of all the layers which set `disableOutsidePointerEvents` to `true` in order to determine\n// which layers should be dismissed when interacting outside.\n// (ie. all layers that do not have a child layer which sets `disableOutsidePointerEvents` to `true`)\nconst [\n TotalLayerCountWithDisabledOutsidePointerEventsProvider,\n useTotalLayerCountWithDisabledOutsidePointerEvents,\n] = createTotalLayerCount('TotalLayerCountWithDisabledOutsidePointerEventsProvider');\nconst [\n RunningLayerCountWithDisabledOutsidePointerEventsProvider,\n usePreviousRunningLayerCountWithDisabledOutsidePointerEvents,\n] = createRunningLayerCount('RunningLayerCountWithDisabledOutsidePointerEventsProvider');\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayer\n * -----------------------------------------------------------------------------------------------*/\n\nconst DISMISSABLE_LAYER_NAME = 'DismissableLayer';\n\ntype DismissableLayerElement = DismissableLayerImplElement;\ninterface DismissableLayerProps extends DismissableLayerImplProps {}\n\nconst DismissableLayer = React.forwardRef<DismissableLayerElement, DismissableLayerProps>(\n (props, forwardedRef) => {\n const runningLayerCount = usePreviousRunningLayerCount();\n const isRootLayer = runningLayerCount === 0;\n const layer = <DismissableLayerImpl {...props} ref={forwardedRef} />;\n\n // if it's the root layer, we wrap it with our necessary root providers\n // (effectively we wrap the whole tree of nested layers)\n return isRootLayer ? (\n <TotalLayerCountProvider>\n <TotalLayerCountWithDisabledOutsidePointerEventsProvider>\n {layer}\n </TotalLayerCountWithDisabledOutsidePointerEventsProvider>\n </TotalLayerCountProvider>\n ) : (\n layer\n );\n }\n);\n\nDismissableLayer.displayName = DISMISSABLE_LAYER_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DismissableLayerImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface DismissableLayerImplProps 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 /**\n * Event handler called when the escape key is down.\n * Can be prevented.\n */\n onEscapeKeyDown?: (event: KeyboardEvent) => void;\n\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 /**\n * Event handler called when the focus moves outside of the `DismissableLayer`.\n * Can be prevented.\n */\n onFocusOutside?: (event: FocusOutsideEvent) => void;\n\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 /** Callback called when the `DismissableLayer` should be dismissed */\n onDismiss?: () => void;\n}\n\nconst DismissableLayerImpl = React.forwardRef<\n DismissableLayerImplElement,\n DismissableLayerImplProps\n>((props, forwardedRef) => {\n const {\n disableOutsidePointerEvents = false,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n onDismiss,\n ...layerProps\n } = props;\n\n const totalLayerCount = useTotalLayerCount();\n const prevRunningLayerCount = usePreviousRunningLayerCount();\n const runningLayerCount = prevRunningLayerCount + 1;\n const isDeepestLayer = runningLayerCount === totalLayerCount;\n\n const totalLayerCountWithDisabledOutsidePointerEvents =\n useTotalLayerCountWithDisabledOutsidePointerEvents(disableOutsidePointerEvents);\n const prevRunningLayerCountWithDisabledOutsidePointerEvents =\n usePreviousRunningLayerCountWithDisabledOutsidePointerEvents();\n const runningLayerCountWithDisabledOutsidePointerEvents =\n prevRunningLayerCountWithDisabledOutsidePointerEvents + (disableOutsidePointerEvents ? 1 : 0);\n const containsChildLayerWithDisabledOutsidePointerEvents =\n runningLayerCountWithDisabledOutsidePointerEvents <\n totalLayerCountWithDisabledOutsidePointerEvents;\n\n // Disable pointer-events on `document.body` when at least one layer is disabling outside pointer events\n useBodyPointerEvents({ disabled: disableOutsidePointerEvents });\n\n // Dismiss on escape\n useEscapeKeydown((event) => {\n // Only dismiss if it's the deepest layer. his is effectively mimicking\n // event.stopPropagation from the layer with disabled outside pointer events.\n if (isDeepestLayer) {\n onEscapeKeyDown?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n });\n\n // Dismiss on pointer down outside\n const { onPointerDownCapture: handlePointerDownCapture } = usePointerDownOutside((event) => {\n // Only dismiss if there's no deeper layer which disabled pointer events outside itself\n if (!containsChildLayerWithDisabledOutsidePointerEvents) {\n onPointerDownOutside?.(event);\n onInteractOutside?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n });\n\n // Dismiss on focus outside\n const { onBlurCapture: handleBlurCapture, onFocusCapture: handleFocusCapture } = useFocusOutside(\n (event) => {\n onFocusOutside?.(event);\n onInteractOutside?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n );\n\n // If we have disabled pointer events on body, we need to reset `pointerEvents: 'auto'`\n // on some layers. This depends on which layers set `disableOutsidePointerEvents` to `true`.\n //\n // NOTE: it's important we set it on ALL layers that need it as we cannot simply\n // set it on the deepest layer which sets `disableOutsidePointerEvents` to `true` and rely\n // on inheritence. This is because layers may be rendered in different portals where\n // inheritence wouldn't apply, so we need to set it explicity on its children too.\n const isBodyPointerEventsDisabled = totalLayerCountWithDisabledOutsidePointerEvents > 0;\n const shouldReEnablePointerEvents =\n isBodyPointerEventsDisabled && !containsChildLayerWithDisabledOutsidePointerEvents;\n\n return (\n <RunningLayerCountProvider runningCount={runningLayerCount}>\n <RunningLayerCountWithDisabledOutsidePointerEventsProvider\n runningCount={runningLayerCountWithDisabledOutsidePointerEvents}\n >\n <Primitive.div\n {...layerProps}\n ref={forwardedRef}\n style={{\n pointerEvents: shouldReEnablePointerEvents ? 'auto' : undefined,\n ...layerProps.style,\n }}\n onPointerDownCapture={composeEventHandlers(\n props.onPointerDownCapture,\n handlePointerDownCapture\n )}\n onBlurCapture={composeEventHandlers(props.onBlurCapture, handleBlurCapture)}\n onFocusCapture={composeEventHandlers(props.onFocusCapture, handleFocusCapture)}\n />\n </RunningLayerCountWithDisabledOutsidePointerEventsProvider>\n </RunningLayerCountProvider>\n );\n});\n\n/* -------------------------------------------------------------------------------------------------\n * Utility hooks\n * -----------------------------------------------------------------------------------------------*/\n\nconst POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';\nconst FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';\ntype PointerDownOutsideEvent = CustomEvent<{ originalEvent: PointerEvent }>;\ntype FocusOutsideEvent = CustomEvent<{ originalEvent: FocusEvent }>;\n\n/**\n * Sets up `pointerdown` listener which listens for events outside a react subtree.\n *\n * We use `pointerdown` rather than `pointerup` to mimic layer dismissing behaviour\n * present in OS which usually happens on `pointerdown`.\n *\n * Returns props to pass to the node we want to check for outside events.\n */\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 const target = event.target;\n if (target && !isPointerInsideReactTreeRef.current) {\n const pointerDownOutsideEvent: PointerDownOutsideEvent = new CustomEvent(\n POINTER_DOWN_OUTSIDE,\n { bubbles: false, cancelable: true, detail: { originalEvent: event } }\n );\n target.addEventListener(POINTER_DOWN_OUTSIDE, handlePointerDownOutside, { once: true });\n target.dispatchEvent(pointerDownOutsideEvent);\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 */\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 const target = event.target;\n if (target && !isFocusInsideReactTreeRef.current) {\n const focusOutsideEvent: FocusOutsideEvent = new CustomEvent(FOCUS_OUTSIDE, {\n bubbles: false,\n cancelable: true,\n detail: { originalEvent: event },\n });\n target.addEventListener(FOCUS_OUTSIDE, handleFocusOutside, { once: true });\n target.dispatchEvent(focusOutsideEvent);\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\n/* -------------------------------------------------------------------------------------------------\n * Layer counting utilities\n * -----------------------------------------------------------------------------------------------*/\n\nfunction createTotalLayerCount(displayName?: string) {\n const [TotalLayerCountProviderImpl, useTotalLayerCountContext] = createContext(\n 'TotalLayerCount',\n { total: 0, onTotalIncrease: () => {}, onTotalDecrease: () => {} }\n );\n\n const TotalLayerCountProvider: React.FC = ({ children }) => {\n const [total, setTotal] = React.useState(0);\n return (\n <TotalLayerCountProviderImpl\n total={total}\n onTotalIncrease={React.useCallback(() => setTotal((n) => n + 1), [])}\n onTotalDecrease={React.useCallback(() => setTotal((n) => n - 1), [])}\n >\n {children}\n </TotalLayerCountProviderImpl>\n );\n };\n if (displayName) {\n TotalLayerCountProvider.displayName = displayName;\n }\n\n function useTotalLayerCount(counted = true) {\n const { total, onTotalIncrease, onTotalDecrease } =\n useTotalLayerCountContext('TotalLayerCountConsumer');\n\n React.useLayoutEffect(() => {\n if (counted) {\n onTotalIncrease();\n return () => onTotalDecrease();\n }\n }, [counted, onTotalIncrease, onTotalDecrease]);\n\n return total;\n }\n\n return [TotalLayerCountProvider, useTotalLayerCount] as const;\n}\n\nfunction createRunningLayerCount(displayName?: string) {\n const [RunningLayerCountProviderImp, useRunningLayerCount] = createContext('RunningLayerCount', {\n count: 0,\n });\n\n const RunningLayerCountProvider: React.FC<{ runningCount: number }> = (props) => {\n const { children, runningCount } = props;\n return (\n <RunningLayerCountProviderImp count={runningCount}>{children}</RunningLayerCountProviderImp>\n );\n };\n if (displayName) {\n RunningLayerCountProvider.displayName = displayName;\n }\n\n function usePreviousRunningLayerCount() {\n const context = useRunningLayerCount('RunningLayerCountConsumer');\n return context.count || 0;\n }\n\n return [RunningLayerCountProvider, usePreviousRunningLayerCount] as const;\n}\n\nconst Root = DismissableLayer;\n\nexport {\n DismissableLayer,\n //\n Root,\n};\nexport type { DismissableLayerProps };\n"],"names":["TotalLayerCountProvider","useTotalLayerCount","createTotalLayerCount","RunningLayerCountProvider","usePreviousRunningLayerCount","createRunningLayerCount","TotalLayerCountWithDisabledOutsidePointerEventsProvider","useTotalLayerCountWithDisabledOutsidePointerEvents","RunningLayerCountWithDisabledOutsidePointerEventsProvider","usePreviousRunningLayerCountWithDisabledOutsidePointerEvents","DismissableLayer","React","forwardRef","props","forwardedRef","isRootLayer","layer","_react","createElement","$b3ca5e0c42ec5d7395c8cb24157$var$DismissableLayerImpl","_babelRuntimeHelpersEsmExtends","ref","$b3ca5e0c42ec5d7395c8cb24157$var$TotalLayerCountProvider","$b3ca5e0c42ec5d7395c8cb24157$var$TotalLayerCountWithDisabledOutsidePointerEventsProvider","DismissableLayerImpl","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","totalLayerCount","runningLayerCount","isDeepestLayer","totalLayerCountWithDisabledOutsidePointerEvents","runningLayerCountWithDisabledOutsidePointerEvents","containsChildLayerWithDisabledOutsidePointerEvents","useBodyPointerEvents","disabled","useEscapeKeydown","event","defaultPrevented","onPointerDownCapture","handlePointerDownCapture","handlePointerDownOutside","useCallbackRef","isPointerInsideReactTreeRef","useRef","useEffect","handlePointerDown","target","current","pointerDownOutsideEvent","CustomEvent","bubbles","cancelable","detail","originalEvent","addEventListener","once","dispatchEvent","timerId","window","setTimeout","document","clearTimeout","removeEventListener","usePointerDownOutside","onBlurCapture","handleBlurCapture","onFocusCapture","handleFocusCapture","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","focusOutsideEvent","useFocusOutside","shouldReEnablePointerEvents","$b3ca5e0c42ec5d7395c8cb24157$var$RunningLayerCountProvider","runningCount","$b3ca5e0c42ec5d7395c8cb24157$var$RunningLayerCountWithDisabledOutsidePointerEventsProvider","Primitive","div","style","pointerEvents","undefined","composeEventHandlers","displayName","TotalLayerCountProviderImpl","useTotalLayerCountContext","createContext","total","onTotalIncrease","onTotalDecrease","children","setTotal","useState","useCallback","n","counted","useLayoutEffect","RunningLayerCountProviderImp","useRunningLayerCount","count","Root"],"version":3,"file":"index.module.js.map"}
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 { createContext } from '@radix-ui/react-context';\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// We need to compute the total count of layers AND a running count of all layers\n// in order to find which layer is the deepest one.\n// This is use to only dismiss the deepest layer when using the escape key\n// because we bind the key listener to document so cannot take advantage of event.stopPropagation()\nconst [TotalLayerCountProvider, useTotalLayerCount] = createTotalLayerCount();\nconst [RunningLayerCountProvider, usePreviousRunningLayerCount] = createRunningLayerCount();\n\n// We need to compute the total count of layers which set `disableOutsidePointerEvents` to `true` AND\n// a running count of all the layers which set `disableOutsidePointerEvents` to `true` in order to determine\n// which layers should be dismissed when interacting outside.\n// (ie. all layers that do not have a child layer which sets `disableOutsidePointerEvents` to `true`)\nconst [\n TotalLayerCountWithDisabledOutsidePointerEventsProvider,\n useTotalLayerCountWithDisabledOutsidePointerEvents,\n] = createTotalLayerCount('TotalLayerCountWithDisabledOutsidePointerEventsProvider');\nconst [\n RunningLayerCountWithDisabledOutsidePointerEventsProvider,\n usePreviousRunningLayerCountWithDisabledOutsidePointerEvents,\n] = createRunningLayerCount('RunningLayerCountWithDisabledOutsidePointerEventsProvider');\n\n/* -------------------------------------------------------------------------------------------------\n * DismissableLayer\n * -----------------------------------------------------------------------------------------------*/\n\nconst DISMISSABLE_LAYER_NAME = 'DismissableLayer';\n\ntype DismissableLayerElement = DismissableLayerImplElement;\ninterface DismissableLayerProps extends DismissableLayerImplProps {}\n\nconst DismissableLayer = React.forwardRef<DismissableLayerElement, DismissableLayerProps>(\n (props, forwardedRef) => {\n const runningLayerCount = usePreviousRunningLayerCount();\n const isRootLayer = runningLayerCount === 0;\n const layer = <DismissableLayerImpl {...props} ref={forwardedRef} />;\n\n // if it's the root layer, we wrap it with our necessary root providers\n // (effectively we wrap the whole tree of nested layers)\n return isRootLayer ? (\n <TotalLayerCountProvider>\n <TotalLayerCountWithDisabledOutsidePointerEventsProvider>\n {layer}\n </TotalLayerCountWithDisabledOutsidePointerEventsProvider>\n </TotalLayerCountProvider>\n ) : (\n layer\n );\n }\n);\n\nDismissableLayer.displayName = DISMISSABLE_LAYER_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype DismissableLayerImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface DismissableLayerImplProps 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 /**\n * Event handler called when the escape key is down.\n * Can be prevented.\n */\n onEscapeKeyDown?: (event: KeyboardEvent) => void;\n\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 /**\n * Event handler called when the focus moves outside of the `DismissableLayer`.\n * Can be prevented.\n */\n onFocusOutside?: (event: FocusOutsideEvent) => void;\n\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 /** Callback called when the `DismissableLayer` should be dismissed */\n onDismiss?: () => void;\n}\n\nconst DismissableLayerImpl = React.forwardRef<\n DismissableLayerImplElement,\n DismissableLayerImplProps\n>((props, forwardedRef) => {\n const {\n disableOutsidePointerEvents = false,\n onEscapeKeyDown,\n onPointerDownOutside,\n onFocusOutside,\n onInteractOutside,\n onDismiss,\n ...layerProps\n } = props;\n\n const totalLayerCount = useTotalLayerCount();\n const prevRunningLayerCount = usePreviousRunningLayerCount();\n const runningLayerCount = prevRunningLayerCount + 1;\n const isDeepestLayer = runningLayerCount === totalLayerCount;\n\n const totalLayerCountWithDisabledOutsidePointerEvents =\n useTotalLayerCountWithDisabledOutsidePointerEvents(disableOutsidePointerEvents);\n const prevRunningLayerCountWithDisabledOutsidePointerEvents =\n usePreviousRunningLayerCountWithDisabledOutsidePointerEvents();\n const runningLayerCountWithDisabledOutsidePointerEvents =\n prevRunningLayerCountWithDisabledOutsidePointerEvents + (disableOutsidePointerEvents ? 1 : 0);\n const containsChildLayerWithDisabledOutsidePointerEvents =\n runningLayerCountWithDisabledOutsidePointerEvents <\n totalLayerCountWithDisabledOutsidePointerEvents;\n\n // Disable pointer-events on `document.body` when at least one layer is disabling outside pointer events\n useBodyPointerEvents({ disabled: disableOutsidePointerEvents });\n\n // Dismiss on escape\n useEscapeKeydown((event) => {\n // Only dismiss if it's the deepest layer. his is effectively mimicking\n // event.stopPropagation from the layer with disabled outside pointer events.\n if (isDeepestLayer) {\n onEscapeKeyDown?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n });\n\n // Dismiss on pointer down outside\n const { onPointerDownCapture: handlePointerDownCapture } = usePointerDownOutside((event) => {\n // Only dismiss if there's no deeper layer which disabled pointer events outside itself\n if (!containsChildLayerWithDisabledOutsidePointerEvents) {\n onPointerDownOutside?.(event);\n onInteractOutside?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n });\n\n // Dismiss on focus outside\n const { onBlurCapture: handleBlurCapture, onFocusCapture: handleFocusCapture } = useFocusOutside(\n (event) => {\n onFocusOutside?.(event);\n onInteractOutside?.(event);\n if (!event.defaultPrevented) {\n onDismiss?.();\n }\n }\n );\n\n // If we have disabled pointer events on body, we need to reset `pointerEvents: 'auto'`\n // on some layers. This depends on which layers set `disableOutsidePointerEvents` to `true`.\n //\n // NOTE: it's important we set it on ALL layers that need it as we cannot simply\n // set it on the deepest layer which sets `disableOutsidePointerEvents` to `true` and rely\n // on inheritence. This is because layers may be rendered in different portals where\n // inheritence wouldn't apply, so we need to set it explicity on its children too.\n const isBodyPointerEventsDisabled = totalLayerCountWithDisabledOutsidePointerEvents > 0;\n\n return (\n <RunningLayerCountProvider runningCount={runningLayerCount}>\n <RunningLayerCountWithDisabledOutsidePointerEventsProvider\n runningCount={runningLayerCountWithDisabledOutsidePointerEvents}\n >\n <Primitive.div\n {...layerProps}\n ref={forwardedRef}\n style={{\n pointerEvents: isBodyPointerEventsDisabled\n ? containsChildLayerWithDisabledOutsidePointerEvents\n ? 'none'\n : 'auto'\n : undefined,\n ...layerProps.style,\n }}\n onPointerDownCapture={composeEventHandlers(\n props.onPointerDownCapture,\n handlePointerDownCapture\n )}\n onBlurCapture={composeEventHandlers(props.onBlurCapture, handleBlurCapture)}\n onFocusCapture={composeEventHandlers(props.onFocusCapture, handleFocusCapture)}\n />\n </RunningLayerCountWithDisabledOutsidePointerEventsProvider>\n </RunningLayerCountProvider>\n );\n});\n\n/* -------------------------------------------------------------------------------------------------\n * Utility hooks\n * -----------------------------------------------------------------------------------------------*/\n\nconst POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';\nconst FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';\ntype PointerDownOutsideEvent = CustomEvent<{ originalEvent: PointerEvent }>;\ntype FocusOutsideEvent = CustomEvent<{ originalEvent: FocusEvent }>;\n\n/**\n * Sets up `pointerdown` listener which listens for events outside a react subtree.\n *\n * We use `pointerdown` rather than `pointerup` to mimic layer dismissing behaviour\n * present in OS which usually happens on `pointerdown`.\n *\n * Returns props to pass to the node we want to check for outside events.\n */\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 const target = event.target;\n if (target && !isPointerInsideReactTreeRef.current) {\n const pointerDownOutsideEvent: PointerDownOutsideEvent = new CustomEvent(\n POINTER_DOWN_OUTSIDE,\n { bubbles: false, cancelable: true, detail: { originalEvent: event } }\n );\n target.addEventListener(POINTER_DOWN_OUTSIDE, handlePointerDownOutside, { once: true });\n target.dispatchEvent(pointerDownOutsideEvent);\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 */\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 const target = event.target;\n if (target && !isFocusInsideReactTreeRef.current) {\n const focusOutsideEvent: FocusOutsideEvent = new CustomEvent(FOCUS_OUTSIDE, {\n bubbles: false,\n cancelable: true,\n detail: { originalEvent: event },\n });\n target.addEventListener(FOCUS_OUTSIDE, handleFocusOutside, { once: true });\n target.dispatchEvent(focusOutsideEvent);\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\n/* -------------------------------------------------------------------------------------------------\n * Layer counting utilities\n * -----------------------------------------------------------------------------------------------*/\n\nfunction createTotalLayerCount(displayName?: string) {\n const [TotalLayerCountProviderImpl, useTotalLayerCountContext] = createContext(\n 'TotalLayerCount',\n { total: 0, onTotalIncrease: () => {}, onTotalDecrease: () => {} }\n );\n\n const TotalLayerCountProvider: React.FC = ({ children }) => {\n const [total, setTotal] = React.useState(0);\n return (\n <TotalLayerCountProviderImpl\n total={total}\n onTotalIncrease={React.useCallback(() => setTotal((n) => n + 1), [])}\n onTotalDecrease={React.useCallback(() => setTotal((n) => n - 1), [])}\n >\n {children}\n </TotalLayerCountProviderImpl>\n );\n };\n if (displayName) {\n TotalLayerCountProvider.displayName = displayName;\n }\n\n function useTotalLayerCount(counted = true) {\n const { total, onTotalIncrease, onTotalDecrease } =\n useTotalLayerCountContext('TotalLayerCountConsumer');\n\n React.useLayoutEffect(() => {\n if (counted) {\n onTotalIncrease();\n return () => onTotalDecrease();\n }\n }, [counted, onTotalIncrease, onTotalDecrease]);\n\n return total;\n }\n\n return [TotalLayerCountProvider, useTotalLayerCount] as const;\n}\n\nfunction createRunningLayerCount(displayName?: string) {\n const [RunningLayerCountProviderImp, useRunningLayerCount] = createContext('RunningLayerCount', {\n count: 0,\n });\n\n const RunningLayerCountProvider: React.FC<{ runningCount: number }> = (props) => {\n const { children, runningCount } = props;\n return (\n <RunningLayerCountProviderImp count={runningCount}>{children}</RunningLayerCountProviderImp>\n );\n };\n if (displayName) {\n RunningLayerCountProvider.displayName = displayName;\n }\n\n function usePreviousRunningLayerCount() {\n const context = useRunningLayerCount('RunningLayerCountConsumer');\n return context.count || 0;\n }\n\n return [RunningLayerCountProvider, usePreviousRunningLayerCount] as const;\n}\n\nconst Root = DismissableLayer;\n\nexport {\n DismissableLayer,\n //\n Root,\n};\nexport type { DismissableLayerProps };\n"],"names":["TotalLayerCountProvider","useTotalLayerCount","createTotalLayerCount","RunningLayerCountProvider","usePreviousRunningLayerCount","createRunningLayerCount","TotalLayerCountWithDisabledOutsidePointerEventsProvider","useTotalLayerCountWithDisabledOutsidePointerEvents","RunningLayerCountWithDisabledOutsidePointerEventsProvider","usePreviousRunningLayerCountWithDisabledOutsidePointerEvents","DismissableLayer","React","forwardRef","props","forwardedRef","isRootLayer","layer","_react","createElement","$b3ca5e0c42ec5d7395c8cb24157$var$DismissableLayerImpl","_babelRuntimeHelpersEsmExtends","ref","$b3ca5e0c42ec5d7395c8cb24157$var$TotalLayerCountProvider","$b3ca5e0c42ec5d7395c8cb24157$var$TotalLayerCountWithDisabledOutsidePointerEventsProvider","DismissableLayerImpl","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","totalLayerCount","runningLayerCount","isDeepestLayer","totalLayerCountWithDisabledOutsidePointerEvents","runningLayerCountWithDisabledOutsidePointerEvents","containsChildLayerWithDisabledOutsidePointerEvents","useBodyPointerEvents","disabled","useEscapeKeydown","event","defaultPrevented","onPointerDownCapture","handlePointerDownCapture","handlePointerDownOutside","useCallbackRef","isPointerInsideReactTreeRef","useRef","useEffect","handlePointerDown","target","current","pointerDownOutsideEvent","CustomEvent","bubbles","cancelable","detail","originalEvent","addEventListener","once","dispatchEvent","timerId","window","setTimeout","document","clearTimeout","removeEventListener","usePointerDownOutside","onBlurCapture","handleBlurCapture","onFocusCapture","handleFocusCapture","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","focusOutsideEvent","useFocusOutside","isBodyPointerEventsDisabled","$b3ca5e0c42ec5d7395c8cb24157$var$RunningLayerCountProvider","runningCount","$b3ca5e0c42ec5d7395c8cb24157$var$RunningLayerCountWithDisabledOutsidePointerEventsProvider","Primitive","div","style","pointerEvents","undefined","composeEventHandlers","displayName","TotalLayerCountProviderImpl","useTotalLayerCountContext","createContext","total","onTotalIncrease","onTotalDecrease","children","setTotal","useState","useCallback","n","counted","useLayoutEffect","RunningLayerCountProviderImp","useRunningLayerCount","count","Root"],"version":3,"file":"index.module.js.map"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@radix-ui/react-dismissable-layer",
3
- "version": "0.1.4-rc.1",
3
+ "version": "0.1.4-rc.2",
4
4
  "license": "MIT",
5
5
  "source": "src/index.ts",
6
6
  "main": "dist/index.js",
@@ -19,7 +19,7 @@
19
19
  "@babel/runtime": "^7.13.10",
20
20
  "@radix-ui/primitive": "0.1.0",
21
21
  "@radix-ui/react-context": "0.1.1",
22
- "@radix-ui/react-primitive": "0.1.4-rc.1",
22
+ "@radix-ui/react-primitive": "0.1.4-rc.2",
23
23
  "@radix-ui/react-use-body-pointer-events": "0.1.0",
24
24
  "@radix-ui/react-use-callback-ref": "0.1.0",
25
25
  "@radix-ui/react-use-escape-keydown": "0.1.0"