@radix-ui/react-dismissable-layer 0.1.6-rc.7 → 1.0.0-rc.1

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 +53 -36
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.module.js +48 -22
  5. package/dist/index.module.js.map +1 -1
  6. package/package.json +9 -9
package/dist/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;AA0BA,yBAAyB,MAAM,wBAAwB,CAAC,OAAO,UAAU,GAAG,CAAC,CAAC;AAC9E,sCAAgC,SAAQ,iBAAiB;IACvD;;;;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD;;;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAChE;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACpD;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,GAAG,iBAAiB,KAAK,IAAI,CAAC;IACjF;;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","packages/react/dismissable-layer/src/index.ts"],"sourcesContent":[null,null,"export * from './DismissableLayer';\n"],"names":[],"version":3,"file":"index.d.ts.map"}
1
+ {"mappings":";;;AA2BA,yBAAyB,MAAM,wBAAwB,CAAC,OAAO,UAAU,GAAG,CAAC,CAAC;AAC9E,sCAAgC,SAAQ,iBAAiB;IACvD;;;;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC;;;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACjD;;;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAChE;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACpD;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,GAAG,iBAAiB,KAAK,IAAI,CAAC;IACjF;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,OAAA,MAAM,8GAiHL,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;AA8HpE,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","packages/react/dismissable-layer/src/index.ts"],"sourcesContent":[null,null,"export {\n DismissableLayer,\n DismissableLayerBranch,\n //\n Root,\n Branch,\n} from './DismissableLayer';\nexport type { DismissableLayerProps } from './DismissableLayer';\n"],"names":[],"version":3,"file":"index.d.ts.map"}
package/dist/index.js CHANGED
@@ -3,39 +3,20 @@ var $g2vWm$react = require("react");
3
3
  var $g2vWm$radixuiprimitive = require("@radix-ui/primitive");
4
4
  var $g2vWm$radixuireactprimitive = require("@radix-ui/react-primitive");
5
5
  var $g2vWm$radixuireactcomposerefs = require("@radix-ui/react-compose-refs");
6
- var $g2vWm$radixuireactusebodypointerevents = require("@radix-ui/react-use-body-pointer-events");
7
6
  var $g2vWm$radixuireactusecallbackref = require("@radix-ui/react-use-callback-ref");
8
7
  var $g2vWm$radixuireactuseescapekeydown = require("@radix-ui/react-use-escape-keydown");
9
8
 
10
- function $parcel$exportWildcard(dest, source) {
11
- Object.keys(source).forEach(function(key) {
12
- if (key === 'default' || key === '__esModule' || dest.hasOwnProperty(key)) {
13
- return;
14
- }
15
-
16
- Object.defineProperty(dest, key, {
17
- enumerable: true,
18
- get: function get() {
19
- return source[key];
20
- }
21
- });
22
- });
23
-
24
- return dest;
9
+ function $parcel$export(e, n, v, s) {
10
+ Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
25
11
  }
26
12
  function $parcel$interopDefault(a) {
27
13
  return a && a.__esModule ? a.default : a;
28
14
  }
29
- function $parcel$export(e, n, v, s) {
30
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
31
- }
32
- var $d715e0554b679f1f$exports = {};
33
-
34
- $parcel$export($d715e0554b679f1f$exports, "DismissableLayer", () => $d715e0554b679f1f$export$177fb62ff3ec1f22);
35
- $parcel$export($d715e0554b679f1f$exports, "DismissableLayerBranch", () => $d715e0554b679f1f$export$4d5eb2109db14228);
36
- $parcel$export($d715e0554b679f1f$exports, "Root", () => $d715e0554b679f1f$export$be92b6f5f03c0fe9);
37
- $parcel$export($d715e0554b679f1f$exports, "Branch", () => $d715e0554b679f1f$export$aecb2ddcb55c95be);
38
15
 
16
+ $parcel$export(module.exports, "DismissableLayer", () => $d715e0554b679f1f$export$177fb62ff3ec1f22);
17
+ $parcel$export(module.exports, "DismissableLayerBranch", () => $d715e0554b679f1f$export$4d5eb2109db14228);
18
+ $parcel$export(module.exports, "Root", () => $d715e0554b679f1f$export$be92b6f5f03c0fe9);
19
+ $parcel$export(module.exports, "Branch", () => $d715e0554b679f1f$export$aecb2ddcb55c95be);
39
20
 
40
21
 
41
22
 
@@ -49,6 +30,7 @@ $parcel$export($d715e0554b679f1f$exports, "Branch", () => $d715e0554b679f1f$expo
49
30
  const $d715e0554b679f1f$var$CONTEXT_UPDATE = 'dismissableLayer.update';
50
31
  const $d715e0554b679f1f$var$POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';
51
32
  const $d715e0554b679f1f$var$FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';
33
+ let $d715e0554b679f1f$var$originalBodyPointerEvents;
52
34
  const $d715e0554b679f1f$var$DismissableLayerContext = /*#__PURE__*/ $g2vWm$react.createContext({
53
35
  layers: new Set(),
54
36
  layersWithOutsidePointerEventsDisabled: new Set(),
@@ -95,16 +77,25 @@ const $d715e0554b679f1f$export$177fb62ff3ec1f22 = /*#__PURE__*/ $g2vWm$react.for
95
77
  const isHighestLayer = index === context.layers.size - 1;
96
78
  if (!isHighestLayer) return;
97
79
  onEscapeKeyDown === null || onEscapeKeyDown === void 0 || onEscapeKeyDown(event);
98
- if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
99
- });
100
- $g2vWm$radixuireactusebodypointerevents.useBodyPointerEvents({
101
- disabled: disableOutsidePointerEvents
80
+ if (!event.defaultPrevented && onDismiss) {
81
+ event.preventDefault();
82
+ onDismiss();
83
+ }
102
84
  });
103
85
  $g2vWm$react.useEffect(()=>{
104
86
  if (!node1) return;
105
- if (disableOutsidePointerEvents) context.layersWithOutsidePointerEventsDisabled.add(node1);
87
+ if (disableOutsidePointerEvents) {
88
+ if (context.layersWithOutsidePointerEventsDisabled.size === 0) {
89
+ $d715e0554b679f1f$var$originalBodyPointerEvents = document.body.style.pointerEvents;
90
+ document.body.style.pointerEvents = 'none';
91
+ }
92
+ context.layersWithOutsidePointerEventsDisabled.add(node1);
93
+ }
106
94
  context.layers.add(node1);
107
95
  $d715e0554b679f1f$var$dispatchUpdate();
96
+ return ()=>{
97
+ if (disableOutsidePointerEvents && context.layersWithOutsidePointerEventsDisabled.size === 1) document.body.style.pointerEvents = $d715e0554b679f1f$var$originalBodyPointerEvents;
98
+ };
108
99
  }, [
109
100
  node1,
110
101
  disableOutsidePointerEvents,
@@ -179,13 +170,36 @@ const $d715e0554b679f1f$export$4d5eb2109db14228 = /*#__PURE__*/ $g2vWm$react.for
179
170
  */ function $d715e0554b679f1f$var$usePointerDownOutside(onPointerDownOutside) {
180
171
  const handlePointerDownOutside = $g2vWm$radixuireactusecallbackref.useCallbackRef(onPointerDownOutside);
181
172
  const isPointerInsideReactTreeRef = $g2vWm$react.useRef(false);
173
+ const handleClickRef = $g2vWm$react.useRef(()=>{});
182
174
  $g2vWm$react.useEffect(()=>{
183
175
  const handlePointerDown = (event)=>{
184
176
  if (event.target && !isPointerInsideReactTreeRef.current) {
185
177
  const eventDetail = {
186
178
  originalEvent: event
187
179
  };
188
- $d715e0554b679f1f$var$dispatchCustomEvent($d715e0554b679f1f$var$POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail);
180
+ function handleAndDispatchPointerDownOutsideEvent() {
181
+ $d715e0554b679f1f$var$handleAndDispatchCustomEvent($d715e0554b679f1f$var$POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail, {
182
+ discrete: true
183
+ });
184
+ }
185
+ /**
186
+ * On touch devices, we need to wait for a click event because browsers implement
187
+ * a ~350ms delay between the time the user stops touching the display and when the
188
+ * browser executres events. We need to ensure we don't reactivate pointer-events within
189
+ * this timeframe otherwise the browser may execute events that should have been prevented.
190
+ *
191
+ * Additionally, this also lets us deal automatically with cancellations when a click event
192
+ * isn't raised because the page was considered scrolled/drag-scrolled, long-pressed, etc.
193
+ *
194
+ * This is why we also continuously remove the previous listener, because we cannot be
195
+ * certain that it was raised, and therefore cleaned-up.
196
+ */ if (event.pointerType === 'touch') {
197
+ document.removeEventListener('click', handleClickRef.current);
198
+ handleClickRef.current = handleAndDispatchPointerDownOutsideEvent;
199
+ document.addEventListener('click', handleClickRef.current, {
200
+ once: true
201
+ });
202
+ } else handleAndDispatchPointerDownOutsideEvent();
189
203
  }
190
204
  isPointerInsideReactTreeRef.current = false;
191
205
  };
@@ -207,6 +221,7 @@ const $d715e0554b679f1f$export$4d5eb2109db14228 = /*#__PURE__*/ $g2vWm$react.for
207
221
  return ()=>{
208
222
  window.clearTimeout(timerId);
209
223
  document.removeEventListener('pointerdown', handlePointerDown);
224
+ document.removeEventListener('click', handleClickRef.current);
210
225
  };
211
226
  }, [
212
227
  handlePointerDownOutside
@@ -228,7 +243,9 @@ const $d715e0554b679f1f$export$4d5eb2109db14228 = /*#__PURE__*/ $g2vWm$react.for
228
243
  const eventDetail = {
229
244
  originalEvent: event
230
245
  };
231
- $d715e0554b679f1f$var$dispatchCustomEvent($d715e0554b679f1f$var$FOCUS_OUTSIDE, handleFocusOutside, eventDetail);
246
+ $d715e0554b679f1f$var$handleAndDispatchCustomEvent($d715e0554b679f1f$var$FOCUS_OUTSIDE, handleFocusOutside, eventDetail, {
247
+ discrete: false
248
+ });
232
249
  }
233
250
  };
234
251
  document.addEventListener('focusin', handleFocus);
@@ -244,10 +261,10 @@ const $d715e0554b679f1f$export$4d5eb2109db14228 = /*#__PURE__*/ $g2vWm$react.for
244
261
  };
245
262
  }
246
263
  function $d715e0554b679f1f$var$dispatchUpdate() {
247
- const event = new Event($d715e0554b679f1f$var$CONTEXT_UPDATE);
264
+ const event = new CustomEvent($d715e0554b679f1f$var$CONTEXT_UPDATE);
248
265
  document.dispatchEvent(event);
249
266
  }
250
- function $d715e0554b679f1f$var$dispatchCustomEvent(name, handler, detail) {
267
+ function $d715e0554b679f1f$var$handleAndDispatchCustomEvent(name, handler, detail, { discrete: discrete }) {
251
268
  const target = detail.originalEvent.target;
252
269
  const event = new CustomEvent(name, {
253
270
  bubbles: false,
@@ -257,13 +274,13 @@ function $d715e0554b679f1f$var$dispatchCustomEvent(name, handler, detail) {
257
274
  if (handler) target.addEventListener(name, handler, {
258
275
  once: true
259
276
  });
260
- return !target.dispatchEvent(event);
277
+ if (discrete) $g2vWm$radixuireactprimitive.dispatchDiscreteCustomEvent(target, event);
278
+ else target.dispatchEvent(event);
261
279
  }
262
280
  const $d715e0554b679f1f$export$be92b6f5f03c0fe9 = $d715e0554b679f1f$export$177fb62ff3ec1f22;
263
281
  const $d715e0554b679f1f$export$aecb2ddcb55c95be = $d715e0554b679f1f$export$4d5eb2109db14228;
264
282
 
265
283
 
266
- $parcel$exportWildcard(module.exports, $d715e0554b679f1f$exports);
267
284
 
268
285
 
269
286
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react/dismissable-layer/src/index.ts","packages/react/dismissable-layer/src/DismissableLayer.tsx"],"sourcesContent":["export * from './DismissableLayer';\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":["React","composeEventHandlers","Primitive","useComposedRefs","useBodyPointerEvents","useCallbackRef","useEscapeKeydown","DISMISSABLE_LAYER_NAME","CONTEXT_UPDATE","POINTER_DOWN_OUTSIDE","FOCUS_OUTSIDE","DismissableLayerContext","createContext","layers","Set","layersWithOutsidePointerEventsDisabled","branches","DismissableLayer","forwardRef","props","forwardedRef","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","context","useContext","node","setNode","useState","force","composedRefs","Array","from","highestLayerWithOutsidePointerEventsDisabled","slice","highestLayerWithOutsidePointerEventsDisabledIndex","indexOf","index","isBodyPointerEventsDisabled","size","isPointerEventsEnabled","pointerDownOutside","usePointerDownOutside","event","target","isPointerDownOnBranch","some","branch","contains","defaultPrevented","focusOutside","useFocusOutside","isFocusInBranch","isHighestLayer","disabled","useEffect","add","dispatchUpdate","delete","handleUpdate","document","addEventListener","removeEventListener","pointerEvents","undefined","style","onFocusCapture","onBlurCapture","onPointerDownCapture","BRANCH_NAME","DismissableLayerBranch","ref","useRef","current","handlePointerDownOutside","isPointerInsideReactTreeRef","handlePointerDown","eventDetail","originalEvent","dispatchCustomEvent","timerId","window","setTimeout","clearTimeout","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","Event","dispatchEvent","name","handler","detail","CustomEvent","bubbles","cancelable","once","Root","Branch"],"version":3,"file":"index.js.map"}
1
+ {"mappings":"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","sources":["packages/react/dismissable-layer/src/index.ts","packages/react/dismissable-layer/src/DismissableLayer.tsx"],"sourcesContent":["export {\n DismissableLayer,\n DismissableLayerBranch,\n //\n Root,\n Branch,\n} from './DismissableLayer';\nexport type { DismissableLayerProps } from './DismissableLayer';\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Primitive, dispatchDiscreteCustomEvent } from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\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\nlet originalBodyPointerEvents: string;\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 event.preventDefault();\n onDismiss();\n }\n });\n\n React.useEffect(() => {\n if (!node) return;\n if (disableOutsidePointerEvents) {\n if (context.layersWithOutsidePointerEventsDisabled.size === 0) {\n originalBodyPointerEvents = document.body.style.pointerEvents;\n document.body.style.pointerEvents = 'none';\n }\n context.layersWithOutsidePointerEventsDisabled.add(node);\n }\n context.layers.add(node);\n dispatchUpdate();\n return () => {\n if (\n disableOutsidePointerEvents &&\n context.layersWithOutsidePointerEventsDisabled.size === 1\n ) {\n document.body.style.pointerEvents = originalBodyPointerEvents;\n }\n };\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 const handleClickRef = React.useRef(() => {});\n\n React.useEffect(() => {\n const handlePointerDown = (event: PointerEvent) => {\n if (event.target && !isPointerInsideReactTreeRef.current) {\n const eventDetail = { originalEvent: event };\n\n function handleAndDispatchPointerDownOutsideEvent() {\n handleAndDispatchCustomEvent(\n POINTER_DOWN_OUTSIDE,\n handlePointerDownOutside,\n eventDetail,\n { discrete: true }\n );\n }\n\n /**\n * On touch devices, we need to wait for a click event because browsers implement\n * a ~350ms delay between the time the user stops touching the display and when the\n * browser executres events. We need to ensure we don't reactivate pointer-events within\n * this timeframe otherwise the browser may execute events that should have been prevented.\n *\n * Additionally, this also lets us deal automatically with cancellations when a click event\n * isn't raised because the page was considered scrolled/drag-scrolled, long-pressed, etc.\n *\n * This is why we also continuously remove the previous listener, because we cannot be\n * certain that it was raised, and therefore cleaned-up.\n */\n if (event.pointerType === 'touch') {\n document.removeEventListener('click', handleClickRef.current);\n handleClickRef.current = handleAndDispatchPointerDownOutsideEvent;\n document.addEventListener('click', handleClickRef.current, { once: true });\n } else {\n handleAndDispatchPointerDownOutsideEvent();\n }\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 document.removeEventListener('click', handleClickRef.current);\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 handleAndDispatchCustomEvent(FOCUS_OUTSIDE, handleFocusOutside, eventDetail, {\n discrete: false,\n });\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 CustomEvent(CONTEXT_UPDATE);\n document.dispatchEvent(event);\n}\n\nfunction handleAndDispatchCustomEvent<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 { discrete }: { discrete: boolean }\n) {\n const target = detail.originalEvent.target;\n const event = new CustomEvent(name, { bubbles: false, cancelable: true, detail });\n if (handler) target.addEventListener(name, handler as EventListener, { once: true });\n\n if (discrete) {\n dispatchDiscreteCustomEvent(target, event);\n } else {\n target.dispatchEvent(event);\n }\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":["DismissableLayer","DismissableLayerBranch","Root","Branch","React","composeEventHandlers","Primitive","dispatchDiscreteCustomEvent","useComposedRefs","useCallbackRef","useEscapeKeydown","DISMISSABLE_LAYER_NAME","CONTEXT_UPDATE","POINTER_DOWN_OUTSIDE","FOCUS_OUTSIDE","originalBodyPointerEvents","DismissableLayerContext","createContext","layers","Set","layersWithOutsidePointerEventsDisabled","branches","forwardRef","props","forwardedRef","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","context","useContext","node","setNode","useState","force","composedRefs","Array","from","highestLayerWithOutsidePointerEventsDisabled","slice","highestLayerWithOutsidePointerEventsDisabledIndex","indexOf","index","isBodyPointerEventsDisabled","size","isPointerEventsEnabled","pointerDownOutside","usePointerDownOutside","event","target","isPointerDownOnBranch","some","branch","contains","defaultPrevented","focusOutside","useFocusOutside","isFocusInBranch","isHighestLayer","preventDefault","useEffect","document","body","style","pointerEvents","add","dispatchUpdate","delete","handleUpdate","addEventListener","removeEventListener","undefined","onFocusCapture","onBlurCapture","onPointerDownCapture","BRANCH_NAME","ref","useRef","current","handlePointerDownOutside","isPointerInsideReactTreeRef","handleClickRef","handlePointerDown","eventDetail","originalEvent","handleAndDispatchPointerDownOutsideEvent","handleAndDispatchCustomEvent","discrete","pointerType","once","timerId","window","setTimeout","clearTimeout","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","CustomEvent","dispatchEvent","name","handler","detail","bubbles","cancelable"],"version":3,"file":"index.js.map"}
package/dist/index.module.js CHANGED
@@ -1,22 +1,11 @@
1
1
  import $kqwpH$babelruntimehelpersesmextends from "@babel/runtime/helpers/esm/extends";
2
2
  import {createContext as $kqwpH$createContext, forwardRef as $kqwpH$forwardRef, useContext as $kqwpH$useContext, useState as $kqwpH$useState, useEffect as $kqwpH$useEffect, createElement as $kqwpH$createElement, useRef as $kqwpH$useRef} from "react";
3
3
  import {composeEventHandlers as $kqwpH$composeEventHandlers} from "@radix-ui/primitive";
4
- import {Primitive as $kqwpH$Primitive} from "@radix-ui/react-primitive";
4
+ import {Primitive as $kqwpH$Primitive, dispatchDiscreteCustomEvent as $kqwpH$dispatchDiscreteCustomEvent} from "@radix-ui/react-primitive";
5
5
  import {useComposedRefs as $kqwpH$useComposedRefs} from "@radix-ui/react-compose-refs";
6
- import {useBodyPointerEvents as $kqwpH$useBodyPointerEvents} from "@radix-ui/react-use-body-pointer-events";
7
6
  import {useCallbackRef as $kqwpH$useCallbackRef} from "@radix-ui/react-use-callback-ref";
8
7
  import {useEscapeKeydown as $kqwpH$useEscapeKeydown} from "@radix-ui/react-use-escape-keydown";
9
8
 
10
- function $parcel$export(e, n, v, s) {
11
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
12
- }
13
- var $5cb92bef7577960e$exports = {};
14
-
15
- $parcel$export($5cb92bef7577960e$exports, "DismissableLayer", () => $5cb92bef7577960e$export$177fb62ff3ec1f22);
16
- $parcel$export($5cb92bef7577960e$exports, "DismissableLayerBranch", () => $5cb92bef7577960e$export$4d5eb2109db14228);
17
- $parcel$export($5cb92bef7577960e$exports, "Root", () => $5cb92bef7577960e$export$be92b6f5f03c0fe9);
18
- $parcel$export($5cb92bef7577960e$exports, "Branch", () => $5cb92bef7577960e$export$aecb2ddcb55c95be);
19
-
20
9
 
21
10
 
22
11
 
@@ -30,6 +19,7 @@ $parcel$export($5cb92bef7577960e$exports, "Branch", () => $5cb92bef7577960e$expo
30
19
  const $5cb92bef7577960e$var$CONTEXT_UPDATE = 'dismissableLayer.update';
31
20
  const $5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';
32
21
  const $5cb92bef7577960e$var$FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';
22
+ let $5cb92bef7577960e$var$originalBodyPointerEvents;
33
23
  const $5cb92bef7577960e$var$DismissableLayerContext = /*#__PURE__*/ $kqwpH$createContext({
34
24
  layers: new Set(),
35
25
  layersWithOutsidePointerEventsDisabled: new Set(),
@@ -76,16 +66,25 @@ const $5cb92bef7577960e$export$177fb62ff3ec1f22 = /*#__PURE__*/ $kqwpH$forwardRe
76
66
  const isHighestLayer = index === context.layers.size - 1;
77
67
  if (!isHighestLayer) return;
78
68
  onEscapeKeyDown === null || onEscapeKeyDown === void 0 || onEscapeKeyDown(event);
79
- if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
80
- });
81
- $kqwpH$useBodyPointerEvents({
82
- disabled: disableOutsidePointerEvents
69
+ if (!event.defaultPrevented && onDismiss) {
70
+ event.preventDefault();
71
+ onDismiss();
72
+ }
83
73
  });
84
74
  $kqwpH$useEffect(()=>{
85
75
  if (!node1) return;
86
- if (disableOutsidePointerEvents) context.layersWithOutsidePointerEventsDisabled.add(node1);
76
+ if (disableOutsidePointerEvents) {
77
+ if (context.layersWithOutsidePointerEventsDisabled.size === 0) {
78
+ $5cb92bef7577960e$var$originalBodyPointerEvents = document.body.style.pointerEvents;
79
+ document.body.style.pointerEvents = 'none';
80
+ }
81
+ context.layersWithOutsidePointerEventsDisabled.add(node1);
82
+ }
87
83
  context.layers.add(node1);
88
84
  $5cb92bef7577960e$var$dispatchUpdate();
85
+ return ()=>{
86
+ if (disableOutsidePointerEvents && context.layersWithOutsidePointerEventsDisabled.size === 1) document.body.style.pointerEvents = $5cb92bef7577960e$var$originalBodyPointerEvents;
87
+ };
89
88
  }, [
90
89
  node1,
91
90
  disableOutsidePointerEvents,
@@ -160,13 +159,36 @@ const $5cb92bef7577960e$export$4d5eb2109db14228 = /*#__PURE__*/ $kqwpH$forwardRe
160
159
  */ function $5cb92bef7577960e$var$usePointerDownOutside(onPointerDownOutside) {
161
160
  const handlePointerDownOutside = $kqwpH$useCallbackRef(onPointerDownOutside);
162
161
  const isPointerInsideReactTreeRef = $kqwpH$useRef(false);
162
+ const handleClickRef = $kqwpH$useRef(()=>{});
163
163
  $kqwpH$useEffect(()=>{
164
164
  const handlePointerDown = (event)=>{
165
165
  if (event.target && !isPointerInsideReactTreeRef.current) {
166
166
  const eventDetail = {
167
167
  originalEvent: event
168
168
  };
169
- $5cb92bef7577960e$var$dispatchCustomEvent($5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail);
169
+ function handleAndDispatchPointerDownOutsideEvent() {
170
+ $5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail, {
171
+ discrete: true
172
+ });
173
+ }
174
+ /**
175
+ * On touch devices, we need to wait for a click event because browsers implement
176
+ * a ~350ms delay between the time the user stops touching the display and when the
177
+ * browser executres events. We need to ensure we don't reactivate pointer-events within
178
+ * this timeframe otherwise the browser may execute events that should have been prevented.
179
+ *
180
+ * Additionally, this also lets us deal automatically with cancellations when a click event
181
+ * isn't raised because the page was considered scrolled/drag-scrolled, long-pressed, etc.
182
+ *
183
+ * This is why we also continuously remove the previous listener, because we cannot be
184
+ * certain that it was raised, and therefore cleaned-up.
185
+ */ if (event.pointerType === 'touch') {
186
+ document.removeEventListener('click', handleClickRef.current);
187
+ handleClickRef.current = handleAndDispatchPointerDownOutsideEvent;
188
+ document.addEventListener('click', handleClickRef.current, {
189
+ once: true
190
+ });
191
+ } else handleAndDispatchPointerDownOutsideEvent();
170
192
  }
171
193
  isPointerInsideReactTreeRef.current = false;
172
194
  };
@@ -188,6 +210,7 @@ const $5cb92bef7577960e$export$4d5eb2109db14228 = /*#__PURE__*/ $kqwpH$forwardRe
188
210
  return ()=>{
189
211
  window.clearTimeout(timerId);
190
212
  document.removeEventListener('pointerdown', handlePointerDown);
213
+ document.removeEventListener('click', handleClickRef.current);
191
214
  };
192
215
  }, [
193
216
  handlePointerDownOutside
@@ -209,7 +232,9 @@ const $5cb92bef7577960e$export$4d5eb2109db14228 = /*#__PURE__*/ $kqwpH$forwardRe
209
232
  const eventDetail = {
210
233
  originalEvent: event
211
234
  };
212
- $5cb92bef7577960e$var$dispatchCustomEvent($5cb92bef7577960e$var$FOCUS_OUTSIDE, handleFocusOutside, eventDetail);
235
+ $5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$FOCUS_OUTSIDE, handleFocusOutside, eventDetail, {
236
+ discrete: false
237
+ });
213
238
  }
214
239
  };
215
240
  document.addEventListener('focusin', handleFocus);
@@ -225,10 +250,10 @@ const $5cb92bef7577960e$export$4d5eb2109db14228 = /*#__PURE__*/ $kqwpH$forwardRe
225
250
  };
226
251
  }
227
252
  function $5cb92bef7577960e$var$dispatchUpdate() {
228
- const event = new Event($5cb92bef7577960e$var$CONTEXT_UPDATE);
253
+ const event = new CustomEvent($5cb92bef7577960e$var$CONTEXT_UPDATE);
229
254
  document.dispatchEvent(event);
230
255
  }
231
- function $5cb92bef7577960e$var$dispatchCustomEvent(name, handler, detail) {
256
+ function $5cb92bef7577960e$var$handleAndDispatchCustomEvent(name, handler, detail, { discrete: discrete }) {
232
257
  const target = detail.originalEvent.target;
233
258
  const event = new CustomEvent(name, {
234
259
  bubbles: false,
@@ -238,7 +263,8 @@ function $5cb92bef7577960e$var$dispatchCustomEvent(name, handler, detail) {
238
263
  if (handler) target.addEventListener(name, handler, {
239
264
  once: true
240
265
  });
241
- return !target.dispatchEvent(event);
266
+ if (discrete) $kqwpH$dispatchDiscreteCustomEvent(target, event);
267
+ else target.dispatchEvent(event);
242
268
  }
243
269
  const $5cb92bef7577960e$export$be92b6f5f03c0fe9 = $5cb92bef7577960e$export$177fb62ff3ec1f22;
244
270
  const $5cb92bef7577960e$export$aecb2ddcb55c95be = $5cb92bef7577960e$export$4d5eb2109db14228;
package/dist/index.module.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/react/dismissable-layer/src/index.ts","packages/react/dismissable-layer/src/DismissableLayer.tsx"],"sourcesContent":["export * from './DismissableLayer';\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":["React","composeEventHandlers","Primitive","useComposedRefs","useBodyPointerEvents","useCallbackRef","useEscapeKeydown","DISMISSABLE_LAYER_NAME","CONTEXT_UPDATE","POINTER_DOWN_OUTSIDE","FOCUS_OUTSIDE","DismissableLayerContext","createContext","layers","Set","layersWithOutsidePointerEventsDisabled","branches","DismissableLayer","forwardRef","props","forwardedRef","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","context","useContext","node","setNode","useState","force","composedRefs","Array","from","highestLayerWithOutsidePointerEventsDisabled","slice","highestLayerWithOutsidePointerEventsDisabledIndex","indexOf","index","isBodyPointerEventsDisabled","size","isPointerEventsEnabled","pointerDownOutside","usePointerDownOutside","event","target","isPointerDownOnBranch","some","branch","contains","defaultPrevented","focusOutside","useFocusOutside","isFocusInBranch","isHighestLayer","disabled","useEffect","add","dispatchUpdate","delete","handleUpdate","document","addEventListener","removeEventListener","pointerEvents","undefined","style","onFocusCapture","onBlurCapture","onPointerDownCapture","BRANCH_NAME","DismissableLayerBranch","ref","useRef","current","handlePointerDownOutside","isPointerInsideReactTreeRef","handlePointerDown","eventDetail","originalEvent","dispatchCustomEvent","timerId","window","setTimeout","clearTimeout","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","Event","dispatchEvent","name","handler","detail","CustomEvent","bubbles","cancelable","once","Root","Branch"],"version":3,"file":"index.module.js.map"}
1
+ {"mappings":";;;;;;;;A;;;;;;;ACSA;;oGAEA,CAEA,MAAMW,4CAAsB,GAAG,kBAA/B,AAAA;AACA,MAAMC,oCAAc,GAAG,yBAAvB,AAAA;AACA,MAAMC,0CAAoB,GAAG,qCAA7B,AAAA;AACA,MAAMC,mCAAa,GAAG,+BAAtB,AAAA;AAEA,IAAIC,+CAAJ,AAAA;AAEA,MAAMC,6CAAuB,GAAA,aAAGZ,CAAAA,oBAAA,CAAoB;IAClDc,MAAM,EAAE,IAAIC,GAAJ,EAD0C;IAElDC,sCAAsC,EAAE,IAAID,GAAJ,EAFU;IAGlDE,QAAQ,EAAE,IAAIF,GAAJ,EAAVE;CAH8B,CAAhC,AAAoD;AA0CpD,MAAMrB,yCAAgB,GAAA,aAAGI,CAAAA,iBAAA,CACvB,CAACmB,KAAD,EAAQC,YAAR,GAAyB;IACvB,MAAM,+BACJC,2BAA2B,GAAG,KAD1B,G,iBAEJC,eAFI,CAAA,E,sBAGJC,oBAHI,CAAA,E,gBAIJC,cAJI,CAAA,E,mBAKJC,iBALI,CAAA,E,WAMJC,SANI,CAAA,EAOJ,GAAGC,UAAH,EAPI,GAQFR,KARJ,AAAM;IASN,MAAMS,OAAO,GAAG5B,iBAAA,CAAiBY,6CAAjB,CAAhB,AAAA;IACA,MAAM,CAACkB,KAAD,EAAOC,OAAP,CAAA,GAAkB/B,eAAA,CAA+C,IAA/C,CAAxB,AAAA;IACA,MAAM,GAAGiC,KAAH,CAAA,GAAYjC,eAAA,CAAe,EAAf,CAAlB,AAAA;IACA,MAAMkC,YAAY,GAAG9B,sBAAe,CAACgB,YAAD,EAAgBU,CAAAA,IAAD,GAAUC,OAAO,CAACD,IAAD,CAAhC;IAAA,CAApC,AAAA;IACA,MAAMhB,MAAM,GAAGqB,KAAK,CAACC,IAAN,CAAWR,OAAO,CAACd,MAAnB,CAAf,AAAA;IACA,MAAM,CAACuB,4CAAD,CAAA,GAAiD;WAAIT,OAAO,CAACZ,sCAAZ;KAAA,CAAoDsB,KAApD,CAA0D,EAA1D,CAAvD,AAfuB,EAe+F,kBAAtH;IACA,MAAMC,iDAAiD,GAAGzB,MAAM,CAAC0B,OAAP,CAAeH,4CAAf,CAA1D,AAhBuB,EAgBiG,kBAAxH;IACA,MAAMI,KAAK,GAAGX,KAAI,GAAGhB,MAAM,CAAC0B,OAAP,CAAeV,KAAf,CAAH,GAA0B,EAA5C,AAAA;IACA,MAAMY,2BAA2B,GAAGd,OAAO,CAACZ,sCAAR,CAA+C2B,IAA/C,GAAsD,CAA1F,AAAA;IACA,MAAMC,sBAAsB,GAAGH,KAAK,IAAIF,iDAAxC,AAAA;IAEA,MAAMM,kBAAkB,GAAGC,2CAAqB,CAAEC,CAAAA,KAAD,GAAW;QAC1D,MAAMC,MAAM,GAAGD,KAAK,CAACC,MAArB,AAAA;QACA,MAAMC,qBAAqB,GAAG;eAAIrB,OAAO,CAACX,QAAZ;SAAA,CAAsBiC,IAAtB,CAA4BC,CAAAA,MAAD,GAAYA,MAAM,CAACC,QAAP,CAAgBJ,MAAhB,CAAvC;QAAA,CAA9B,AAAA;QACA,IAAI,CAACJ,sBAAD,IAA2BK,qBAA/B,EAAsD,OAAtD;QACA1B,oBAAoB,KAAA,IAApB,IAAAA,oBAAoB,KAAA,KAAA,CAApB,IAAAA,oBAAoB,CAAGwB,KAAH,CAApB,CAAAxB;QACAE,iBAAiB,KAAA,IAAjB,IAAAA,iBAAiB,KAAA,KAAA,CAAjB,IAAAA,iBAAiB,CAAGsB,KAAH,CAAjB,CAAAtB;QACA,IAAI,CAACsB,KAAK,CAACM,gBAAX,EAA6B3B,SAAS,KAAA,IAAT,IAAAA,SAAS,KAAA,KAAA,CAAT,IAAAA,SAAS,EAAtC,CAAA;KAN8C,CAAhD,AAOC;IAED,MAAM4B,YAAY,GAAGC,qCAAe,CAAER,CAAAA,KAAD,GAAW;QAC9C,MAAMC,MAAM,GAAGD,KAAK,CAACC,MAArB,AAAA;QACA,MAAMQ,eAAe,GAAG;eAAI5B,OAAO,CAACX,QAAZ;SAAA,CAAsBiC,IAAtB,CAA4BC,CAAAA,MAAD,GAAYA,MAAM,CAACC,QAAP,CAAgBJ,MAAhB,CAAvC;QAAA,CAAxB,AAAA;QACA,IAAIQ,eAAJ,EAAqB,OAArB;QACAhC,cAAc,KAAA,IAAd,IAAAA,cAAc,KAAA,KAAA,CAAd,IAAAA,cAAc,CAAGuB,KAAH,CAAd,CAAAvB;QACAC,iBAAiB,KAAA,IAAjB,IAAAA,iBAAiB,KAAA,KAAA,CAAjB,IAAAA,iBAAiB,CAAGsB,KAAH,CAAjB,CAAAtB;QACA,IAAI,CAACsB,KAAK,CAACM,gBAAX,EAA6B3B,SAAS,KAAA,IAAT,IAAAA,SAAS,KAAA,KAAA,CAAT,IAAAA,SAAS,EAAtC,CAAA;KANkC,CAApC,AAOC;IAEDpB,uBAAgB,CAAEyC,CAAAA,KAAD,GAAW;QAC1B,MAAMU,cAAc,GAAGhB,KAAK,KAAKb,OAAO,CAACd,MAAR,CAAe6B,IAAf,GAAsB,CAAvD,AAAA;QACA,IAAI,CAACc,cAAL,EAAqB,OAArB;QACAnC,eAAe,KAAA,IAAf,IAAAA,eAAe,KAAA,KAAA,CAAf,IAAAA,eAAe,CAAGyB,KAAH,CAAf,CAAAzB;QACA,IAAI,CAACyB,KAAK,CAACM,gBAAP,IAA2B3B,SAA/B,EAA0C;YACxCqB,KAAK,CAACW,cAAN,EAAAX,CAAAA;YACArB,SAAS,EAATA,CAAAA;SACD;KAPa,CAAhB,CAQC;IAED1B,gBAAA,CAAgB,IAAM;QACpB,IAAI,CAAC8B,KAAL,EAAW,OAAX;QACA,IAAIT,2BAAJ,EAAiC;YAC/B,IAAIO,OAAO,CAACZ,sCAAR,CAA+C2B,IAA/C,KAAwD,CAA5D,EAA+D;gBAC7DhC,+CAAyB,GAAGiD,QAAQ,CAACC,IAAT,CAAcC,KAAd,CAAoBC,aAAhD,CAAApD;gBACAiD,QAAQ,CAACC,IAAT,CAAcC,KAAd,CAAoBC,aAApB,GAAoC,MAApC,CAAAH;aACD;YACDhC,OAAO,CAACZ,sCAAR,CAA+CgD,GAA/C,CAAmDlC,KAAnD,CAAAF,CAAAA;SACD;QACDA,OAAO,CAACd,MAAR,CAAekD,GAAf,CAAmBlC,KAAnB,CAAAF,CAAAA;QACAqC,oCAAc,EAAdA,CAAAA;QACA,OAAO,IAAM;YACX,IACE5C,2BAA2B,IAC3BO,OAAO,CAACZ,sCAAR,CAA+C2B,IAA/C,KAAwD,CAF1D,EAIEiB,QAAQ,CAACC,IAAT,CAAcC,KAAd,CAAoBC,aAApB,GAAoCpD,+CAApC,CAAAiD;SALJ,CAOC;KAlBH,EAmBG;QAAC9B,KAAD;QAAOT,2BAAP;QAAoCO,OAApC;KAnBH,CAmBC,CAAA;IAED;;;;;KAKJ,CACI5B,gBAAA,CAAgB,IAAM;QACpB,OAAO,IAAM;YACX,IAAI,CAAC8B,KAAL,EAAW,OAAX;YACAF,OAAO,CAACd,MAAR,CAAeoD,MAAf,CAAsBpC,KAAtB,CAAAF,CAAAA;YACAA,OAAO,CAACZ,sCAAR,CAA+CkD,MAA/C,CAAsDpC,KAAtD,CAAAF,CAAAA;YACAqC,oCAAc,EAAdA,CAAAA;SAJF,CAKC;KANH,EAOG;QAACnC,KAAD;QAAOF,OAAP;KAPH,CAOC,CAAA;IAED5B,gBAAA,CAAgB,IAAM;QACpB,MAAMmE,YAAY,GAAG,IAAMlC,KAAK,CAAC,EAAD,CAAhC;QAAA;QACA2B,QAAQ,CAACQ,gBAAT,CAA0B5D,oCAA1B,EAA0C2D,YAA1C,CAAAP,CAAAA;QACA,OAAO,IAAMA,QAAQ,CAACS,mBAAT,CAA6B7D,oCAA7B,EAA6C2D,YAA7C,CAAb;QAAA,CAAA;KAHF,EAIG,EAJH,CAIC,CAAA;IAED,OAAA,aACE,CAAA,oBAAA,CAAC,gBAAD,CAAW,GAAX,EAAA,oCAAA,CAAA,EAAA,EACMxC,UADN,EADF;QAGI,GAAG,EAAEO,YAFP;QAGE,KAAK,EAAE;YACL6B,aAAa,EAAErB,2BAA2B,GACtCE,sBAAsB,GACpB,MADoB,GAEpB,MAHoC,GAItC0B,SALC;YAML,GAAGnD,KAAK,CAAC2C,KAAT;SATJ;QAWE,cAAc,EAAE7D,2BAAoB,CAACkB,KAAK,CAACoD,cAAP,EAAuBjB,YAAY,CAACiB,cAApC,CAXtC;QAYE,aAAa,EAAEtE,2BAAoB,CAACkB,KAAK,CAACqD,aAAP,EAAsBlB,YAAY,CAACkB,aAAnC,CAZrC;QAaE,oBAAoB,EAAEvE,2BAAoB,CACxCkB,KAAK,CAACsD,oBADkC,EAExC5B,kBAAkB,CAAC4B,oBAFqB,CAA1C;KAbF,CAAA,CADF,CACE;CA7FmB,CAAzB,AAgHG;AAGH,aAAA,CAAA,MAAA,CAAA,MAAA,CAAA,yCAAA,EAAA;IAAA,WAAA,EAAA,4CAAA;CAAA,CAAA,CAAA;AAEA;;oGAEA,CAEA,MAAMC,iCAAW,GAAG,wBAApB,AAAA;AAKA,MAAM7E,yCAAsB,GAAA,aAAGG,CAAAA,iBAAA,CAG7B,CAACmB,KAAD,EAAQC,YAAR,GAAyB;IACzB,MAAMQ,OAAO,GAAG5B,iBAAA,CAAiBY,6CAAjB,CAAhB,AAAA;IACA,MAAM+D,GAAG,GAAG3E,aAAA,CAA4C,IAA5C,CAAZ,AAAA;IACA,MAAMkC,YAAY,GAAG9B,sBAAe,CAACgB,YAAD,EAAeuD,GAAf,CAApC,AAAA;IAEA3E,gBAAA,CAAgB,IAAM;QACpB,MAAM8B,IAAI,GAAG6C,GAAG,CAACE,OAAjB,AAAA;QACA,IAAI/C,IAAJ,EAAU;YACRF,OAAO,CAACX,QAAR,CAAiB+C,GAAjB,CAAqBlC,IAArB,CAAAF,CAAAA;YACA,OAAO,IAAM;gBACXA,OAAO,CAACX,QAAR,CAAiBiD,MAAjB,CAAwBpC,IAAxB,CAAAF,CAAAA;aADF,CAEC;SACF;KAPH,EAQG;QAACA,OAAO,CAACX,QAAT;KARH,CAQC,CAAA;IAED,OAAA,aAAO,CAAA,oBAAA,CAAC,gBAAD,CAAW,GAAX,EAAA,oCAAA,CAAA,EAAA,EAAmBE,KAAnB,EAAP;QAAiC,GAAG,EAAEe,YAAL;KAA1B,CAAA,CAAP,CAAO;CAlBsB,CAA/B,AAmBC;AAED,aAAA,CAAA,MAAA,CAAA,MAAA,CAAA,yCAAA,EAAA;IAAA,WAAA,EAAA,iCAAA;CAAA,CAAA,CAAA;AAEA,oGAAA,CAKA;;;;GAIA,CACA,SAASY,2CAAT,CAA+BvB,oBAA/B,EAAgG;IAC9F,MAAMuD,wBAAwB,GAAGzE,qBAAc,CAACkB,oBAAD,CAA/C,AAAA;IACA,MAAMwD,2BAA2B,GAAG/E,aAAA,CAAa,KAAb,CAApC,AAAA;IACA,MAAMgF,cAAc,GAAGhF,aAAA,CAAa,IAAM,EAAnB,CAAvB,AAAA;IAEAA,gBAAA,CAAgB,IAAM;QACpB,MAAMiF,iBAAiB,GAAIlC,CAAAA,KAAD,GAAyB;YACjD,IAAIA,KAAK,CAACC,MAAN,IAAgB,CAAC+B,2BAA2B,CAACF,OAAjD,EAA0D;gBACxD,MAAMK,WAAW,GAAG;oBAAEC,aAAa,EAAEpC,KAAfoC;iBAAtB,AAAoB;gBAEpB,SAASC,wCAAT,GAAoD;oBAClDC,kDAA4B,CAC1B5E,0CAD0B,EAE1BqE,wBAF0B,EAG1BI,WAH0B,EAI1B;wBAAEI,QAAQ,EAAE,IAAVA;qBAJwB,CAA5B,CAIE;iBAEH;gBAED;;;;;;;;;;;WAWR,CACQ,IAAIvC,KAAK,CAACwC,WAAN,KAAsB,OAA1B,EAAmC;oBACjC3B,QAAQ,CAACS,mBAAT,CAA6B,OAA7B,EAAsCW,cAAc,CAACH,OAArD,CAAAjB,CAAAA;oBACAoB,cAAc,CAACH,OAAf,GAAyBO,wCAAzB,CAAAJ;oBACApB,QAAQ,CAACQ,gBAAT,CAA0B,OAA1B,EAAmCY,cAAc,CAACH,OAAlD,EAA2D;wBAAEW,IAAI,EAAE,IAANA;qBAA7D,CAA2D,CAAA;iBAH7D,MAKEJ,wCAAwC,EAAxCA,CAAAA;aAEH;YACDL,2BAA2B,CAACF,OAA5B,GAAsC,KAAtC,CAAAE;SAjCF,AAkCC;QACD;;;;;;;;;;;;OAYJ,CACI,MAAMU,OAAO,GAAGC,MAAM,CAACC,UAAP,CAAkB,IAAM;YACtC/B,QAAQ,CAACQ,gBAAT,CAA0B,aAA1B,EAAyCa,iBAAzC,CAAArB,CAAAA;SADc,EAEb,CAFa,CAAhB,AAEC;QACD,OAAO,IAAM;YACX8B,MAAM,CAACE,YAAP,CAAoBH,OAApB,CAAAC,CAAAA;YACA9B,QAAQ,CAACS,mBAAT,CAA6B,aAA7B,EAA4CY,iBAA5C,CAAArB,CAAAA;YACAA,QAAQ,CAACS,mBAAT,CAA6B,OAA7B,EAAsCW,cAAc,CAACH,OAArD,CAAAjB,CAAAA;SAHF,CAIC;KAxDH,EAyDG;QAACkB,wBAAD;KAzDH,CAyDC,CAAA;IAED,OAAO;QACL,4DAAA;QACAL,oBAAoB,EAAE,IAAOM,2BAA2B,CAACF,OAA5B,GAAsC,IAAnEJ;KAFF,CAAO;CAIR;AAED;;;GAGA,CACA,SAASlB,qCAAT,CAAyB/B,cAAzB,EAA8E;IAC5E,MAAMqE,kBAAkB,GAAGxF,qBAAc,CAACmB,cAAD,CAAzC,AAAA;IACA,MAAMsE,yBAAyB,GAAG9F,aAAA,CAAa,KAAb,CAAlC,AAAA;IAEAA,gBAAA,CAAgB,IAAM;QACpB,MAAM+F,WAAW,GAAIhD,CAAAA,KAAD,GAAuB;YACzC,IAAIA,KAAK,CAACC,MAAN,IAAgB,CAAC8C,yBAAyB,CAACjB,OAA/C,EAAwD;gBACtD,MAAMK,WAAW,GAAG;oBAAEC,aAAa,EAAEpC,KAAfoC;iBAAtB,AAAoB;gBACpBE,kDAA4B,CAAC3E,mCAAD,EAAgBmF,kBAAhB,EAAoCX,WAApC,EAAiD;oBAC3EI,QAAQ,EAAE,KAAVA;iBAD0B,CAA5B,CAA6E;aAG9E;SANH,AAOC;QACD1B,QAAQ,CAACQ,gBAAT,CAA0B,SAA1B,EAAqC2B,WAArC,CAAAnC,CAAAA;QACA,OAAO,IAAMA,QAAQ,CAACS,mBAAT,CAA6B,SAA7B,EAAwC0B,WAAxC,CAAb;QAAA,CAAA;KAVF,EAWG;QAACF,kBAAD;KAXH,CAWC,CAAA;IAED,OAAO;QACLtB,cAAc,EAAE,IAAOuB,yBAAyB,CAACjB,OAA1B,GAAoC,IADtD;QAAA;QAELL,aAAa,EAAE,IAAOsB,yBAAyB,CAACjB,OAA1B,GAAoC,KAA1DL;KAFF,CAAO;CAIR;AAED,SAASP,oCAAT,GAA0B;IACxB,MAAMlB,KAAK,GAAG,IAAIiD,WAAJ,CAAgBxF,oCAAhB,CAAd,AAAA;IACAoD,QAAQ,CAACqC,aAAT,CAAuBlD,KAAvB,CAAAa,CAAAA;CACD;AAED,SAASyB,kDAAT,CACEa,IADF,EAEEC,OAFF,EAGEC,MAHF,EAIE,E,UAAEd,QAAAA,CAAAA,EAJJ,EAKE;IACA,MAAMtC,MAAM,GAAGoD,MAAM,CAACjB,aAAP,CAAqBnC,MAApC,AAAA;IACA,MAAMD,KAAK,GAAG,IAAIiD,WAAJ,CAAgBE,IAAhB,EAAsB;QAAEG,OAAO,EAAE,KAAX;QAAkBC,UAAU,EAAE,IAA9B;Q,QAAoCF,MAAAA;KAA1D,CAAd,AAAoC;IACpC,IAAID,OAAJ,EAAanD,MAAM,CAACoB,gBAAP,CAAwB8B,IAAxB,EAA8BC,OAA9B,EAAwD;QAAEX,IAAI,EAAE,IAANA;KAA1D,CAAwD,CAAA;IAErE,IAAIF,QAAJ,EACEnF,kCAA2B,CAAC6C,MAAD,EAASD,KAAT,CAA3B,CAAA5C;SAEA6C,MAAM,CAACiD,aAAP,CAAqBlD,KAArB,CAAAC,CAAAA;CAEH;AAED,MAAMlD,yCAAI,GAAGF,yCAAb,AAAA;AACA,MAAMG,yCAAM,GAAGF,yCAAf,AAAA;;ADrVA","sources":["packages/react/dismissable-layer/src/index.ts","packages/react/dismissable-layer/src/DismissableLayer.tsx"],"sourcesContent":["export {\n DismissableLayer,\n DismissableLayerBranch,\n //\n Root,\n Branch,\n} from './DismissableLayer';\nexport type { DismissableLayerProps } from './DismissableLayer';\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { Primitive, dispatchDiscreteCustomEvent } from '@radix-ui/react-primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\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\nlet originalBodyPointerEvents: string;\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 event.preventDefault();\n onDismiss();\n }\n });\n\n React.useEffect(() => {\n if (!node) return;\n if (disableOutsidePointerEvents) {\n if (context.layersWithOutsidePointerEventsDisabled.size === 0) {\n originalBodyPointerEvents = document.body.style.pointerEvents;\n document.body.style.pointerEvents = 'none';\n }\n context.layersWithOutsidePointerEventsDisabled.add(node);\n }\n context.layers.add(node);\n dispatchUpdate();\n return () => {\n if (\n disableOutsidePointerEvents &&\n context.layersWithOutsidePointerEventsDisabled.size === 1\n ) {\n document.body.style.pointerEvents = originalBodyPointerEvents;\n }\n };\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 const handleClickRef = React.useRef(() => {});\n\n React.useEffect(() => {\n const handlePointerDown = (event: PointerEvent) => {\n if (event.target && !isPointerInsideReactTreeRef.current) {\n const eventDetail = { originalEvent: event };\n\n function handleAndDispatchPointerDownOutsideEvent() {\n handleAndDispatchCustomEvent(\n POINTER_DOWN_OUTSIDE,\n handlePointerDownOutside,\n eventDetail,\n { discrete: true }\n );\n }\n\n /**\n * On touch devices, we need to wait for a click event because browsers implement\n * a ~350ms delay between the time the user stops touching the display and when the\n * browser executres events. We need to ensure we don't reactivate pointer-events within\n * this timeframe otherwise the browser may execute events that should have been prevented.\n *\n * Additionally, this also lets us deal automatically with cancellations when a click event\n * isn't raised because the page was considered scrolled/drag-scrolled, long-pressed, etc.\n *\n * This is why we also continuously remove the previous listener, because we cannot be\n * certain that it was raised, and therefore cleaned-up.\n */\n if (event.pointerType === 'touch') {\n document.removeEventListener('click', handleClickRef.current);\n handleClickRef.current = handleAndDispatchPointerDownOutsideEvent;\n document.addEventListener('click', handleClickRef.current, { once: true });\n } else {\n handleAndDispatchPointerDownOutsideEvent();\n }\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 document.removeEventListener('click', handleClickRef.current);\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 handleAndDispatchCustomEvent(FOCUS_OUTSIDE, handleFocusOutside, eventDetail, {\n discrete: false,\n });\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 CustomEvent(CONTEXT_UPDATE);\n document.dispatchEvent(event);\n}\n\nfunction handleAndDispatchCustomEvent<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 { discrete }: { discrete: boolean }\n) {\n const target = detail.originalEvent.target;\n const event = new CustomEvent(name, { bubbles: false, cancelable: true, detail });\n if (handler) target.addEventListener(name, handler as EventListener, { once: true });\n\n if (discrete) {\n dispatchDiscreteCustomEvent(target, event);\n } else {\n target.dispatchEvent(event);\n }\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":["DismissableLayer","DismissableLayerBranch","Root","Branch","React","composeEventHandlers","Primitive","dispatchDiscreteCustomEvent","useComposedRefs","useCallbackRef","useEscapeKeydown","DISMISSABLE_LAYER_NAME","CONTEXT_UPDATE","POINTER_DOWN_OUTSIDE","FOCUS_OUTSIDE","originalBodyPointerEvents","DismissableLayerContext","createContext","layers","Set","layersWithOutsidePointerEventsDisabled","branches","forwardRef","props","forwardedRef","disableOutsidePointerEvents","onEscapeKeyDown","onPointerDownOutside","onFocusOutside","onInteractOutside","onDismiss","layerProps","context","useContext","node","setNode","useState","force","composedRefs","Array","from","highestLayerWithOutsidePointerEventsDisabled","slice","highestLayerWithOutsidePointerEventsDisabledIndex","indexOf","index","isBodyPointerEventsDisabled","size","isPointerEventsEnabled","pointerDownOutside","usePointerDownOutside","event","target","isPointerDownOnBranch","some","branch","contains","defaultPrevented","focusOutside","useFocusOutside","isFocusInBranch","isHighestLayer","preventDefault","useEffect","document","body","style","pointerEvents","add","dispatchUpdate","delete","handleUpdate","addEventListener","removeEventListener","undefined","onFocusCapture","onBlurCapture","onPointerDownCapture","BRANCH_NAME","ref","useRef","current","handlePointerDownOutside","isPointerInsideReactTreeRef","handleClickRef","handlePointerDown","eventDetail","originalEvent","handleAndDispatchPointerDownOutsideEvent","handleAndDispatchCustomEvent","discrete","pointerType","once","timerId","window","setTimeout","clearTimeout","handleFocusOutside","isFocusInsideReactTreeRef","handleFocus","CustomEvent","dispatchEvent","name","handler","detail","bubbles","cancelable"],"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.6-rc.7",
3
+ "version": "1.0.0-rc.1",
4
4
  "license": "MIT",
5
5
  "source": "src/index.ts",
6
6
  "main": "dist/index.js",
@@ -17,18 +17,18 @@
17
17
  },
18
18
  "dependencies": {
19
19
  "@babel/runtime": "^7.13.10",
20
- "@radix-ui/primitive": "0.1.0",
21
- "@radix-ui/react-compose-refs": "0.1.1-rc.7",
22
- "@radix-ui/react-primitive": "0.1.5-rc.7",
23
- "@radix-ui/react-use-body-pointer-events": "0.1.2-rc.7",
24
- "@radix-ui/react-use-callback-ref": "0.1.1-rc.7",
25
- "@radix-ui/react-use-escape-keydown": "0.1.1-rc.7"
20
+ "@radix-ui/primitive": "1.0.0-rc.1",
21
+ "@radix-ui/react-compose-refs": "1.0.0-rc.1",
22
+ "@radix-ui/react-primitive": "1.0.0-rc.1",
23
+ "@radix-ui/react-use-callback-ref": "1.0.0-rc.1",
24
+ "@radix-ui/react-use-escape-keydown": "1.0.0-rc.1"
26
25
  },
27
26
  "devDependencies": {
28
- "react-remove-scroll": "^2.4.0"
27
+ "react-remove-scroll": "2.5.4"
29
28
  },
30
29
  "peerDependencies": {
31
- "react": "^16.8 || ^17.0 || ^18.0"
30
+ "react": "^16.8 || ^17.0 || ^18.0",
31
+ "react-dom": "^16.8 || ^17.0 || ^18.0"
32
32
  },
33
33
  "homepage": "https://radix-ui.com/primitives",
34
34
  "repository": {