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