UNPKG

5.04 kBJavaScriptView Raw
1var $9Icr4$reactariautils = require("@react-aria/utils");
2var $9Icr4$react = require("react");
3
4
5function $parcel$export(e, n, v, s) {
6 Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
7}
8
9$parcel$export(module.exports, "useInteractOutside", () => $edcfa848c42f94f4$export$872b660ac5a1ff98);
10/*
11 * Copyright 2020 Adobe. All rights reserved.
12 * This file is licensed to you under the Apache License, Version 2.0 (the "License");
13 * you may not use this file except in compliance with the License. You may obtain a copy
14 * of the License at http://www.apache.org/licenses/LICENSE-2.0
15 *
16 * Unless required by applicable law or agreed to in writing, software distributed under
17 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
18 * OF ANY KIND, either express or implied. See the License for the specific language
19 * governing permissions and limitations under the License.
20 */ // Portions of the code in this file are based on code from react.
21// Original licensing for the following can be found in the
22// NOTICE file in the root directory of this source tree.
23// See https://github.com/facebook/react/tree/cc7c1aece46a6b69b41958d731e0fd27c94bfc6c/packages/react-interactions
24
25
26function $edcfa848c42f94f4$export$872b660ac5a1ff98(props) {
27 let { ref: ref, onInteractOutside: onInteractOutside, isDisabled: isDisabled, onInteractOutsideStart: onInteractOutsideStart } = props;
28 let stateRef = (0, $9Icr4$react.useRef)({
29 isPointerDown: false,
30 ignoreEmulatedMouseEvents: false
31 });
32 let onPointerDown = (0, $9Icr4$reactariautils.useEffectEvent)((e)=>{
33 if (onInteractOutside && $edcfa848c42f94f4$var$isValidEvent(e, ref)) {
34 if (onInteractOutsideStart) onInteractOutsideStart(e);
35 stateRef.current.isPointerDown = true;
36 }
37 });
38 let triggerInteractOutside = (0, $9Icr4$reactariautils.useEffectEvent)((e)=>{
39 if (onInteractOutside) onInteractOutside(e);
40 });
41 (0, $9Icr4$react.useEffect)(()=>{
42 let state = stateRef.current;
43 if (isDisabled) return;
44 const element = ref.current;
45 const documentObject = (0, $9Icr4$reactariautils.getOwnerDocument)(element);
46 // Use pointer events if available. Otherwise, fall back to mouse and touch events.
47 if (typeof PointerEvent !== 'undefined') {
48 let onPointerUp = (e)=>{
49 if (state.isPointerDown && $edcfa848c42f94f4$var$isValidEvent(e, ref)) triggerInteractOutside(e);
50 state.isPointerDown = false;
51 };
52 // changing these to capture phase fixed combobox
53 documentObject.addEventListener('pointerdown', onPointerDown, true);
54 documentObject.addEventListener('pointerup', onPointerUp, true);
55 return ()=>{
56 documentObject.removeEventListener('pointerdown', onPointerDown, true);
57 documentObject.removeEventListener('pointerup', onPointerUp, true);
58 };
59 } else {
60 let onMouseUp = (e)=>{
61 if (state.ignoreEmulatedMouseEvents) state.ignoreEmulatedMouseEvents = false;
62 else if (state.isPointerDown && $edcfa848c42f94f4$var$isValidEvent(e, ref)) triggerInteractOutside(e);
63 state.isPointerDown = false;
64 };
65 let onTouchEnd = (e)=>{
66 state.ignoreEmulatedMouseEvents = true;
67 if (state.isPointerDown && $edcfa848c42f94f4$var$isValidEvent(e, ref)) triggerInteractOutside(e);
68 state.isPointerDown = false;
69 };
70 documentObject.addEventListener('mousedown', onPointerDown, true);
71 documentObject.addEventListener('mouseup', onMouseUp, true);
72 documentObject.addEventListener('touchstart', onPointerDown, true);
73 documentObject.addEventListener('touchend', onTouchEnd, true);
74 return ()=>{
75 documentObject.removeEventListener('mousedown', onPointerDown, true);
76 documentObject.removeEventListener('mouseup', onMouseUp, true);
77 documentObject.removeEventListener('touchstart', onPointerDown, true);
78 documentObject.removeEventListener('touchend', onTouchEnd, true);
79 };
80 }
81 }, [
82 ref,
83 isDisabled,
84 onPointerDown,
85 triggerInteractOutside
86 ]);
87}
88function $edcfa848c42f94f4$var$isValidEvent(event, ref) {
89 if (event.button > 0) return false;
90 if (event.target) {
91 // if the event target is no longer in the document, ignore
92 const ownerDocument = event.target.ownerDocument;
93 if (!ownerDocument || !ownerDocument.documentElement.contains(event.target)) return false;
94 // If the target is within a top layer element (e.g. toasts), ignore.
95 if (event.target.closest('[data-react-aria-top-layer]')) return false;
96 }
97 return ref.current && !ref.current.contains(event.target);
98}
99
100
101//# sourceMappingURL=useInteractOutside.main.js.map