1 | import * as React from 'react';
|
2 | import PropTypes from 'prop-types';
|
3 | import { elementAcceptingRef, exactProp, unstable_ownerDocument as ownerDocument, unstable_useForkRef as useForkRef, unstable_useEventCallback as useEventCallback } from '@mui/utils';
|
4 |
|
5 |
|
6 | import { jsx as _jsx } from "react/jsx-runtime";
|
7 | function mapEventPropToEvent(eventProp) {
|
8 | return eventProp.substring(2).toLowerCase();
|
9 | }
|
10 | function clickedRootScrollbar(event, doc) {
|
11 | return doc.documentElement.clientWidth < event.clientX || doc.documentElement.clientHeight < event.clientY;
|
12 | }
|
13 |
|
14 |
|
15 |
|
16 |
|
17 |
|
18 |
|
19 |
|
20 |
|
21 |
|
22 |
|
23 |
|
24 |
|
25 | function ClickAwayListener(props) {
|
26 | var children = props.children,
|
27 | _props$disableReactTr = props.disableReactTree,
|
28 | disableReactTree = _props$disableReactTr === void 0 ? false : _props$disableReactTr,
|
29 | _props$mouseEvent = props.mouseEvent,
|
30 | mouseEvent = _props$mouseEvent === void 0 ? 'onClick' : _props$mouseEvent,
|
31 | onClickAway = props.onClickAway,
|
32 | _props$touchEvent = props.touchEvent,
|
33 | touchEvent = _props$touchEvent === void 0 ? 'onTouchEnd' : _props$touchEvent;
|
34 | var movedRef = React.useRef(false);
|
35 | var nodeRef = React.useRef(null);
|
36 | var activatedRef = React.useRef(false);
|
37 | var syntheticEventRef = React.useRef(false);
|
38 | React.useEffect(function () {
|
39 |
|
40 |
|
41 | setTimeout(function () {
|
42 | activatedRef.current = true;
|
43 | }, 0);
|
44 | return function () {
|
45 | activatedRef.current = false;
|
46 | };
|
47 | }, []);
|
48 | var handleRef = useForkRef(
|
49 |
|
50 | children.ref, nodeRef);
|
51 |
|
52 |
|
53 |
|
54 |
|
55 |
|
56 |
|
57 |
|
58 | var handleClickAway = useEventCallback(function (event) {
|
59 |
|
60 |
|
61 | var insideReactTree = syntheticEventRef.current;
|
62 | syntheticEventRef.current = false;
|
63 | var doc = ownerDocument(nodeRef.current);
|
64 |
|
65 |
|
66 |
|
67 |
|
68 | if (!activatedRef.current || !nodeRef.current || 'clientX' in event && clickedRootScrollbar(event, doc)) {
|
69 | return;
|
70 | }
|
71 |
|
72 |
|
73 | if (movedRef.current) {
|
74 | movedRef.current = false;
|
75 | return;
|
76 | }
|
77 | var insideDOM;
|
78 |
|
79 |
|
80 | if (event.composedPath) {
|
81 | insideDOM = event.composedPath().indexOf(nodeRef.current) > -1;
|
82 | } else {
|
83 | insideDOM = !doc.documentElement.contains(
|
84 |
|
85 | event.target) || nodeRef.current.contains(
|
86 |
|
87 | event.target);
|
88 | }
|
89 | if (!insideDOM && (disableReactTree || !insideReactTree)) {
|
90 | onClickAway(event);
|
91 | }
|
92 | });
|
93 |
|
94 |
|
95 | var createHandleSynthetic = function createHandleSynthetic(handlerName) {
|
96 | return function (event) {
|
97 | syntheticEventRef.current = true;
|
98 | var childrenPropsHandler = children.props[handlerName];
|
99 | if (childrenPropsHandler) {
|
100 | childrenPropsHandler(event);
|
101 | }
|
102 | };
|
103 | };
|
104 | var childrenProps = {
|
105 | ref: handleRef
|
106 | };
|
107 | if (touchEvent !== false) {
|
108 | childrenProps[touchEvent] = createHandleSynthetic(touchEvent);
|
109 | }
|
110 | React.useEffect(function () {
|
111 | if (touchEvent !== false) {
|
112 | var mappedTouchEvent = mapEventPropToEvent(touchEvent);
|
113 | var doc = ownerDocument(nodeRef.current);
|
114 | var handleTouchMove = function handleTouchMove() {
|
115 | movedRef.current = true;
|
116 | };
|
117 | doc.addEventListener(mappedTouchEvent, handleClickAway);
|
118 | doc.addEventListener('touchmove', handleTouchMove);
|
119 | return function () {
|
120 | doc.removeEventListener(mappedTouchEvent, handleClickAway);
|
121 | doc.removeEventListener('touchmove', handleTouchMove);
|
122 | };
|
123 | }
|
124 | return undefined;
|
125 | }, [handleClickAway, touchEvent]);
|
126 | if (mouseEvent !== false) {
|
127 | childrenProps[mouseEvent] = createHandleSynthetic(mouseEvent);
|
128 | }
|
129 | React.useEffect(function () {
|
130 | if (mouseEvent !== false) {
|
131 | var mappedMouseEvent = mapEventPropToEvent(mouseEvent);
|
132 | var doc = ownerDocument(nodeRef.current);
|
133 | doc.addEventListener(mappedMouseEvent, handleClickAway);
|
134 | return function () {
|
135 | doc.removeEventListener(mappedMouseEvent, handleClickAway);
|
136 | };
|
137 | }
|
138 | return undefined;
|
139 | }, [handleClickAway, mouseEvent]);
|
140 | return _jsx(React.Fragment, {
|
141 | children: React.cloneElement(children, childrenProps)
|
142 | });
|
143 | }
|
144 | process.env.NODE_ENV !== "production" ? ClickAwayListener.propTypes = {
|
145 |
|
146 |
|
147 |
|
148 |
|
149 | |
150 |
|
151 |
|
152 | children: elementAcceptingRef.isRequired,
|
153 | |
154 |
|
155 |
|
156 |
|
157 |
|
158 | disableReactTree: PropTypes.bool,
|
159 | |
160 |
|
161 |
|
162 |
|
163 | mouseEvent: PropTypes.oneOf(['onClick', 'onMouseDown', 'onMouseUp', 'onPointerDown', 'onPointerUp', false]),
|
164 | |
165 |
|
166 |
|
167 | onClickAway: PropTypes.func.isRequired,
|
168 | |
169 |
|
170 |
|
171 |
|
172 | touchEvent: PropTypes.oneOf(['onTouchEnd', 'onTouchStart', false])
|
173 | } : void 0;
|
174 | if (process.env.NODE_ENV !== 'production') {
|
175 |
|
176 | ClickAwayListener['propTypes' + ''] = exactProp(ClickAwayListener.propTypes);
|
177 | }
|
178 | export default ClickAwayListener; |
\ | No newline at end of file |