1 | "use strict";
|
2 |
|
3 | Object.defineProperty(exports, "__esModule", {
|
4 | value: true
|
5 | });
|
6 | exports.generateTrigger = generateTrigger;
|
7 | exports.default = void 0;
|
8 |
|
9 | var _react = _interopRequireDefault(require("react"));
|
10 |
|
11 | var _reactDom = _interopRequireDefault(require("react-dom"));
|
12 |
|
13 | var _contains = _interopRequireDefault(require("rc-util/lib/Dom/contains"));
|
14 |
|
15 | var _findDOMNode = _interopRequireDefault(require("rc-util/lib/Dom/findDOMNode"));
|
16 |
|
17 | var _ref2 = require("rc-util/lib/ref");
|
18 |
|
19 | var _addEventListener = _interopRequireDefault(require("rc-util/lib/Dom/addEventListener"));
|
20 |
|
21 | var _Portal = _interopRequireDefault(require("rc-util/lib/Portal"));
|
22 |
|
23 | var _classnames = _interopRequireDefault(require("classnames"));
|
24 |
|
25 | var _alignUtil = require("./utils/alignUtil");
|
26 |
|
27 | var _Popup = _interopRequireDefault(require("./Popup"));
|
28 |
|
29 | var _context = _interopRequireDefault(require("./context"));
|
30 |
|
31 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
32 |
|
33 | function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
34 |
|
35 | function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
|
36 |
|
37 | function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
38 |
|
39 | function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
40 |
|
41 | function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
42 |
|
43 | function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
44 |
|
45 | function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
46 |
|
47 | function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
48 |
|
49 | function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
50 |
|
51 | function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function () { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
52 |
|
53 | function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
54 |
|
55 | function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
56 |
|
57 | function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
|
58 |
|
59 | function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
60 |
|
61 | function noop() {}
|
62 |
|
63 | function returnEmptyString() {
|
64 | return '';
|
65 | }
|
66 |
|
67 | function returnDocument() {
|
68 | return window.document;
|
69 | }
|
70 |
|
71 | var ALL_HANDLERS = ['onClick', 'onMouseDown', 'onTouchStart', 'onMouseEnter', 'onMouseLeave', 'onFocus', 'onBlur', 'onContextMenu'];
|
72 |
|
73 |
|
74 |
|
75 |
|
76 | function generateTrigger(PortalComponent) {
|
77 | var Trigger = function (_React$Component) {
|
78 | _inherits(Trigger, _React$Component);
|
79 |
|
80 | var _super = _createSuper(Trigger);
|
81 |
|
82 | function Trigger(props) {
|
83 | var _this;
|
84 |
|
85 | _classCallCheck(this, Trigger);
|
86 |
|
87 | _this = _super.call(this, props);
|
88 | _this.popupRef = _react.default.createRef();
|
89 | _this.triggerRef = _react.default.createRef();
|
90 |
|
91 | _this.onMouseEnter = function (e) {
|
92 | var mouseEnterDelay = _this.props.mouseEnterDelay;
|
93 |
|
94 | _this.fireEvents('onMouseEnter', e);
|
95 |
|
96 | _this.delaySetPopupVisible(true, mouseEnterDelay, mouseEnterDelay ? null : e);
|
97 | };
|
98 |
|
99 | _this.onMouseMove = function (e) {
|
100 | _this.fireEvents('onMouseMove', e);
|
101 |
|
102 | _this.setPoint(e);
|
103 | };
|
104 |
|
105 | _this.onMouseLeave = function (e) {
|
106 | _this.fireEvents('onMouseLeave', e);
|
107 |
|
108 | _this.delaySetPopupVisible(false, _this.props.mouseLeaveDelay);
|
109 | };
|
110 |
|
111 | _this.onPopupMouseEnter = function () {
|
112 | _this.clearDelayTimer();
|
113 | };
|
114 |
|
115 | _this.onPopupMouseLeave = function (e) {
|
116 |
|
117 |
|
118 | if (e.relatedTarget && !e.relatedTarget.setTimeout && _this.popupRef.current && _this.popupRef.current.popupRef.current && (0, _contains.default)(_this.popupRef.current.popupRef.current, e.relatedTarget)) {
|
119 | return;
|
120 | }
|
121 |
|
122 | _this.delaySetPopupVisible(false, _this.props.mouseLeaveDelay);
|
123 | };
|
124 |
|
125 | _this.onFocus = function (e) {
|
126 | _this.fireEvents('onFocus', e);
|
127 |
|
128 |
|
129 | _this.clearDelayTimer();
|
130 |
|
131 | if (_this.isFocusToShow()) {
|
132 | _this.focusTime = Date.now();
|
133 |
|
134 | _this.delaySetPopupVisible(true, _this.props.focusDelay);
|
135 | }
|
136 | };
|
137 |
|
138 | _this.onMouseDown = function (e) {
|
139 | _this.fireEvents('onMouseDown', e);
|
140 |
|
141 | _this.preClickTime = Date.now();
|
142 | };
|
143 |
|
144 | _this.onTouchStart = function (e) {
|
145 | _this.fireEvents('onTouchStart', e);
|
146 |
|
147 | _this.preTouchTime = Date.now();
|
148 | };
|
149 |
|
150 | _this.onBlur = function (e) {
|
151 | _this.fireEvents('onBlur', e);
|
152 |
|
153 | _this.clearDelayTimer();
|
154 |
|
155 | if (_this.isBlurToHide()) {
|
156 | _this.delaySetPopupVisible(false, _this.props.blurDelay);
|
157 | }
|
158 | };
|
159 |
|
160 | _this.onContextMenu = function (e) {
|
161 | e.preventDefault();
|
162 |
|
163 | _this.fireEvents('onContextMenu', e);
|
164 |
|
165 | _this.setPopupVisible(true, e);
|
166 | };
|
167 |
|
168 | _this.onContextMenuClose = function () {
|
169 | if (_this.isContextMenuToShow()) {
|
170 | _this.close();
|
171 | }
|
172 | };
|
173 |
|
174 | _this.onClick = function (event) {
|
175 | _this.fireEvents('onClick', event);
|
176 |
|
177 |
|
178 | if (_this.focusTime) {
|
179 | var preTime;
|
180 |
|
181 | if (_this.preClickTime && _this.preTouchTime) {
|
182 | preTime = Math.min(_this.preClickTime, _this.preTouchTime);
|
183 | } else if (_this.preClickTime) {
|
184 | preTime = _this.preClickTime;
|
185 | } else if (_this.preTouchTime) {
|
186 | preTime = _this.preTouchTime;
|
187 | }
|
188 |
|
189 | if (Math.abs(preTime - _this.focusTime) < 20) {
|
190 | return;
|
191 | }
|
192 |
|
193 | _this.focusTime = 0;
|
194 | }
|
195 |
|
196 | _this.preClickTime = 0;
|
197 | _this.preTouchTime = 0;
|
198 |
|
199 |
|
200 |
|
201 | if (_this.isClickToShow() && (_this.isClickToHide() || _this.isBlurToHide()) && event && event.preventDefault) {
|
202 | event.preventDefault();
|
203 | }
|
204 |
|
205 | var nextVisible = !_this.state.popupVisible;
|
206 |
|
207 | if (_this.isClickToHide() && !nextVisible || nextVisible && _this.isClickToShow()) {
|
208 | _this.setPopupVisible(!_this.state.popupVisible, event);
|
209 | }
|
210 | };
|
211 |
|
212 | _this.onPopupMouseDown = function () {
|
213 | _this.hasPopupMouseDown = true;
|
214 | clearTimeout(_this.mouseDownTimeout);
|
215 | _this.mouseDownTimeout = window.setTimeout(function () {
|
216 | _this.hasPopupMouseDown = false;
|
217 | }, 0);
|
218 |
|
219 | if (_this.context) {
|
220 | var _this$context;
|
221 |
|
222 | (_this$context = _this.context).onPopupMouseDown.apply(_this$context, arguments);
|
223 | }
|
224 | };
|
225 |
|
226 | _this.onDocumentClick = function (event) {
|
227 | if (_this.props.mask && !_this.props.maskClosable) {
|
228 | return;
|
229 | }
|
230 |
|
231 | var target = event.target;
|
232 |
|
233 | var root = _this.getRootDomNode();
|
234 |
|
235 | var popupNode = _this.getPopupDomNode();
|
236 |
|
237 | if (!(0, _contains.default)(root, target) && !(0, _contains.default)(popupNode, target) && !_this.hasPopupMouseDown) {
|
238 | _this.close();
|
239 | }
|
240 | };
|
241 |
|
242 | _this.getRootDomNode = function () {
|
243 | var getTriggerDOMNode = _this.props.getTriggerDOMNode;
|
244 |
|
245 | if (getTriggerDOMNode) {
|
246 | return getTriggerDOMNode(_this.triggerRef.current);
|
247 | }
|
248 |
|
249 | try {
|
250 | var domNode = (0, _findDOMNode.default)(_this.triggerRef.current);
|
251 |
|
252 | if (domNode) {
|
253 | return domNode;
|
254 | }
|
255 | } catch (err) {
|
256 | }
|
257 |
|
258 | return _reactDom.default.findDOMNode(_assertThisInitialized(_this));
|
259 | };
|
260 |
|
261 | _this.getPopupClassNameFromAlign = function (align) {
|
262 | var className = [];
|
263 | var _this$props = _this.props,
|
264 | popupPlacement = _this$props.popupPlacement,
|
265 | builtinPlacements = _this$props.builtinPlacements,
|
266 | prefixCls = _this$props.prefixCls,
|
267 | alignPoint = _this$props.alignPoint,
|
268 | getPopupClassNameFromAlign = _this$props.getPopupClassNameFromAlign;
|
269 |
|
270 | if (popupPlacement && builtinPlacements) {
|
271 | className.push((0, _alignUtil.getAlignPopupClassName)(builtinPlacements, prefixCls, align, alignPoint));
|
272 | }
|
273 |
|
274 | if (getPopupClassNameFromAlign) {
|
275 | className.push(getPopupClassNameFromAlign(align));
|
276 | }
|
277 |
|
278 | return className.join(' ');
|
279 | };
|
280 |
|
281 | _this.getComponent = function () {
|
282 | var _this$props2 = _this.props,
|
283 | prefixCls = _this$props2.prefixCls,
|
284 | destroyPopupOnHide = _this$props2.destroyPopupOnHide,
|
285 | popupClassName = _this$props2.popupClassName,
|
286 | onPopupAlign = _this$props2.onPopupAlign,
|
287 | popupMotion = _this$props2.popupMotion,
|
288 | popupAnimation = _this$props2.popupAnimation,
|
289 | popupTransitionName = _this$props2.popupTransitionName,
|
290 | popupStyle = _this$props2.popupStyle,
|
291 | mask = _this$props2.mask,
|
292 | maskAnimation = _this$props2.maskAnimation,
|
293 | maskTransitionName = _this$props2.maskTransitionName,
|
294 | maskMotion = _this$props2.maskMotion,
|
295 | zIndex = _this$props2.zIndex,
|
296 | popup = _this$props2.popup,
|
297 | stretch = _this$props2.stretch,
|
298 | alignPoint = _this$props2.alignPoint;
|
299 | var _this$state = _this.state,
|
300 | popupVisible = _this$state.popupVisible,
|
301 | point = _this$state.point;
|
302 |
|
303 | var align = _this.getPopupAlign();
|
304 |
|
305 | var mouseProps = {};
|
306 |
|
307 | if (_this.isMouseEnterToShow()) {
|
308 | mouseProps.onMouseEnter = _this.onPopupMouseEnter;
|
309 | }
|
310 |
|
311 | if (_this.isMouseLeaveToHide()) {
|
312 | mouseProps.onMouseLeave = _this.onPopupMouseLeave;
|
313 | }
|
314 |
|
315 | mouseProps.onMouseDown = _this.onPopupMouseDown;
|
316 | mouseProps.onTouchStart = _this.onPopupMouseDown;
|
317 | return _react.default.createElement(_Popup.default, Object.assign({
|
318 | prefixCls: prefixCls,
|
319 | destroyPopupOnHide: destroyPopupOnHide,
|
320 | visible: popupVisible,
|
321 | point: alignPoint && point,
|
322 | className: popupClassName,
|
323 | align: align,
|
324 | onAlign: onPopupAlign,
|
325 | animation: popupAnimation,
|
326 | getClassNameFromAlign: _this.getPopupClassNameFromAlign
|
327 | }, mouseProps, {
|
328 | stretch: stretch,
|
329 | getRootDomNode: _this.getRootDomNode,
|
330 | style: popupStyle,
|
331 | mask: mask,
|
332 | zIndex: zIndex,
|
333 | transitionName: popupTransitionName,
|
334 | maskAnimation: maskAnimation,
|
335 | maskTransitionName: maskTransitionName,
|
336 | maskMotion: maskMotion,
|
337 | ref: _this.popupRef,
|
338 | motion: popupMotion
|
339 | }), typeof popup === 'function' ? popup() : popup);
|
340 | };
|
341 |
|
342 | _this.getContainer = function () {
|
343 | var _assertThisInitialize = _assertThisInitialized(_this),
|
344 | props = _assertThisInitialize.props;
|
345 |
|
346 | var popupContainer = document.createElement('div');
|
347 |
|
348 |
|
349 | popupContainer.style.position = 'absolute';
|
350 | popupContainer.style.top = '0';
|
351 | popupContainer.style.left = '0';
|
352 | popupContainer.style.width = '100%';
|
353 | var mountNode = props.getPopupContainer ? props.getPopupContainer(_this.getRootDomNode()) : props.getDocument().body;
|
354 | mountNode.appendChild(popupContainer);
|
355 | return popupContainer;
|
356 | };
|
357 |
|
358 | _this.setPoint = function (point) {
|
359 | var alignPoint = _this.props.alignPoint;
|
360 | if (!alignPoint || !point) return;
|
361 |
|
362 | _this.setState({
|
363 | point: {
|
364 | pageX: point.pageX,
|
365 | pageY: point.pageY
|
366 | }
|
367 | });
|
368 | };
|
369 |
|
370 | _this.handlePortalUpdate = function () {
|
371 | if (_this.state.prevPopupVisible !== _this.state.popupVisible) {
|
372 | _this.props.afterPopupVisibleChange(_this.state.popupVisible);
|
373 | }
|
374 | };
|
375 |
|
376 | var popupVisible;
|
377 |
|
378 | if ('popupVisible' in props) {
|
379 | popupVisible = !!props.popupVisible;
|
380 | } else {
|
381 | popupVisible = !!props.defaultPopupVisible;
|
382 | }
|
383 |
|
384 | _this.state = {
|
385 | prevPopupVisible: popupVisible,
|
386 | popupVisible: popupVisible
|
387 | };
|
388 | ALL_HANDLERS.forEach(function (h) {
|
389 | _this["fire".concat(h)] = function (e) {
|
390 | _this.fireEvents(h, e);
|
391 | };
|
392 | });
|
393 | return _this;
|
394 | }
|
395 |
|
396 | _createClass(Trigger, [{
|
397 | key: "componentDidMount",
|
398 | value: function componentDidMount() {
|
399 | this.componentDidUpdate();
|
400 | }
|
401 | }, {
|
402 | key: "componentDidUpdate",
|
403 | value: function componentDidUpdate() {
|
404 | var props = this.props;
|
405 | var state = this.state;
|
406 |
|
407 |
|
408 |
|
409 |
|
410 | if (state.popupVisible) {
|
411 | var currentDocument;
|
412 |
|
413 | if (!this.clickOutsideHandler && (this.isClickToHide() || this.isContextMenuToShow())) {
|
414 | currentDocument = props.getDocument();
|
415 | this.clickOutsideHandler = (0, _addEventListener.default)(currentDocument, 'mousedown', this.onDocumentClick);
|
416 | }
|
417 |
|
418 |
|
419 | if (!this.touchOutsideHandler) {
|
420 | currentDocument = currentDocument || props.getDocument();
|
421 | this.touchOutsideHandler = (0, _addEventListener.default)(currentDocument, 'touchstart', this.onDocumentClick);
|
422 | }
|
423 |
|
424 |
|
425 | if (!this.contextMenuOutsideHandler1 && this.isContextMenuToShow()) {
|
426 | currentDocument = currentDocument || props.getDocument();
|
427 | this.contextMenuOutsideHandler1 = (0, _addEventListener.default)(currentDocument, 'scroll', this.onContextMenuClose);
|
428 | }
|
429 |
|
430 |
|
431 | if (!this.contextMenuOutsideHandler2 && this.isContextMenuToShow()) {
|
432 | this.contextMenuOutsideHandler2 = (0, _addEventListener.default)(window, 'blur', this.onContextMenuClose);
|
433 | }
|
434 |
|
435 | return;
|
436 | }
|
437 |
|
438 | this.clearOutsideHandler();
|
439 | }
|
440 | }, {
|
441 | key: "componentWillUnmount",
|
442 | value: function componentWillUnmount() {
|
443 | this.clearDelayTimer();
|
444 | this.clearOutsideHandler();
|
445 | clearTimeout(this.mouseDownTimeout);
|
446 | }
|
447 | }, {
|
448 | key: "getPopupDomNode",
|
449 | value: function getPopupDomNode() {
|
450 |
|
451 | if (this.popupRef.current && this.popupRef.current.popupRef.current) {
|
452 | return this.popupRef.current.popupRef.current;
|
453 | }
|
454 |
|
455 | return null;
|
456 | }
|
457 | }, {
|
458 | key: "getPopupAlign",
|
459 | value: function getPopupAlign() {
|
460 | var props = this.props;
|
461 | var popupPlacement = props.popupPlacement,
|
462 | popupAlign = props.popupAlign,
|
463 | builtinPlacements = props.builtinPlacements;
|
464 |
|
465 | if (popupPlacement && builtinPlacements) {
|
466 | return (0, _alignUtil.getAlignFromPlacement)(builtinPlacements, popupPlacement, popupAlign);
|
467 | }
|
468 |
|
469 | return popupAlign;
|
470 | }
|
471 | |
472 |
|
473 |
|
474 |
|
475 |
|
476 | }, {
|
477 | key: "setPopupVisible",
|
478 | value: function setPopupVisible(popupVisible, event) {
|
479 | var alignPoint = this.props.alignPoint;
|
480 | var prevPopupVisible = this.state.popupVisible;
|
481 | this.clearDelayTimer();
|
482 |
|
483 | if (prevPopupVisible !== popupVisible) {
|
484 | if (!('popupVisible' in this.props)) {
|
485 | this.setState({
|
486 | popupVisible: popupVisible,
|
487 | prevPopupVisible: prevPopupVisible
|
488 | });
|
489 | }
|
490 |
|
491 | this.props.onPopupVisibleChange(popupVisible);
|
492 | }
|
493 |
|
494 |
|
495 | if (alignPoint && event) {
|
496 | this.setPoint(event);
|
497 | }
|
498 | }
|
499 | }, {
|
500 | key: "delaySetPopupVisible",
|
501 | value: function delaySetPopupVisible(visible, delayS, event) {
|
502 | var _this2 = this;
|
503 |
|
504 | var delay = delayS * 1000;
|
505 | this.clearDelayTimer();
|
506 |
|
507 | if (delay) {
|
508 | var point = event ? {
|
509 | pageX: event.pageX,
|
510 | pageY: event.pageY
|
511 | } : null;
|
512 | this.delayTimer = window.setTimeout(function () {
|
513 | _this2.setPopupVisible(visible, point);
|
514 |
|
515 | _this2.clearDelayTimer();
|
516 | }, delay);
|
517 | } else {
|
518 | this.setPopupVisible(visible, event);
|
519 | }
|
520 | }
|
521 | }, {
|
522 | key: "clearDelayTimer",
|
523 | value: function clearDelayTimer() {
|
524 | if (this.delayTimer) {
|
525 | clearTimeout(this.delayTimer);
|
526 | this.delayTimer = null;
|
527 | }
|
528 | }
|
529 | }, {
|
530 | key: "clearOutsideHandler",
|
531 | value: function clearOutsideHandler() {
|
532 | if (this.clickOutsideHandler) {
|
533 | this.clickOutsideHandler.remove();
|
534 | this.clickOutsideHandler = null;
|
535 | }
|
536 |
|
537 | if (this.contextMenuOutsideHandler1) {
|
538 | this.contextMenuOutsideHandler1.remove();
|
539 | this.contextMenuOutsideHandler1 = null;
|
540 | }
|
541 |
|
542 | if (this.contextMenuOutsideHandler2) {
|
543 | this.contextMenuOutsideHandler2.remove();
|
544 | this.contextMenuOutsideHandler2 = null;
|
545 | }
|
546 |
|
547 | if (this.touchOutsideHandler) {
|
548 | this.touchOutsideHandler.remove();
|
549 | this.touchOutsideHandler = null;
|
550 | }
|
551 | }
|
552 | }, {
|
553 | key: "createTwoChains",
|
554 | value: function createTwoChains(event) {
|
555 | var childPros = this.props.children.props;
|
556 | var props = this.props;
|
557 |
|
558 | if (childPros[event] && props[event]) {
|
559 | return this["fire".concat(event)];
|
560 | }
|
561 |
|
562 | return childPros[event] || props[event];
|
563 | }
|
564 | }, {
|
565 | key: "isClickToShow",
|
566 | value: function isClickToShow() {
|
567 | var _this$props3 = this.props,
|
568 | action = _this$props3.action,
|
569 | showAction = _this$props3.showAction;
|
570 | return action.indexOf('click') !== -1 || showAction.indexOf('click') !== -1;
|
571 | }
|
572 | }, {
|
573 | key: "isContextMenuToShow",
|
574 | value: function isContextMenuToShow() {
|
575 | var _this$props4 = this.props,
|
576 | action = _this$props4.action,
|
577 | showAction = _this$props4.showAction;
|
578 | return action.indexOf('contextMenu') !== -1 || showAction.indexOf('contextMenu') !== -1;
|
579 | }
|
580 | }, {
|
581 | key: "isClickToHide",
|
582 | value: function isClickToHide() {
|
583 | var _this$props5 = this.props,
|
584 | action = _this$props5.action,
|
585 | hideAction = _this$props5.hideAction;
|
586 | return action.indexOf('click') !== -1 || hideAction.indexOf('click') !== -1;
|
587 | }
|
588 | }, {
|
589 | key: "isMouseEnterToShow",
|
590 | value: function isMouseEnterToShow() {
|
591 | var _this$props6 = this.props,
|
592 | action = _this$props6.action,
|
593 | showAction = _this$props6.showAction;
|
594 | return action.indexOf('hover') !== -1 || showAction.indexOf('mouseEnter') !== -1;
|
595 | }
|
596 | }, {
|
597 | key: "isMouseLeaveToHide",
|
598 | value: function isMouseLeaveToHide() {
|
599 | var _this$props7 = this.props,
|
600 | action = _this$props7.action,
|
601 | hideAction = _this$props7.hideAction;
|
602 | return action.indexOf('hover') !== -1 || hideAction.indexOf('mouseLeave') !== -1;
|
603 | }
|
604 | }, {
|
605 | key: "isFocusToShow",
|
606 | value: function isFocusToShow() {
|
607 | var _this$props8 = this.props,
|
608 | action = _this$props8.action,
|
609 | showAction = _this$props8.showAction;
|
610 | return action.indexOf('focus') !== -1 || showAction.indexOf('focus') !== -1;
|
611 | }
|
612 | }, {
|
613 | key: "isBlurToHide",
|
614 | value: function isBlurToHide() {
|
615 | var _this$props9 = this.props,
|
616 | action = _this$props9.action,
|
617 | hideAction = _this$props9.hideAction;
|
618 | return action.indexOf('focus') !== -1 || hideAction.indexOf('blur') !== -1;
|
619 | }
|
620 | }, {
|
621 | key: "forcePopupAlign",
|
622 | value: function forcePopupAlign() {
|
623 | if (this.state.popupVisible && this.popupRef.current && this.popupRef.current.alignRef.current) {
|
624 | this.popupRef.current.alignRef.current.forceAlign();
|
625 | }
|
626 | }
|
627 | }, {
|
628 | key: "fireEvents",
|
629 | value: function fireEvents(type, e) {
|
630 | var childCallback = this.props.children.props[type];
|
631 |
|
632 | if (childCallback) {
|
633 | childCallback(e);
|
634 | }
|
635 |
|
636 | var callback = this.props[type];
|
637 |
|
638 | if (callback) {
|
639 | callback(e);
|
640 | }
|
641 | }
|
642 | }, {
|
643 | key: "close",
|
644 | value: function close() {
|
645 | this.setPopupVisible(false);
|
646 | }
|
647 | }, {
|
648 | key: "render",
|
649 | value: function render() {
|
650 | var popupVisible = this.state.popupVisible;
|
651 | var _this$props10 = this.props,
|
652 | children = _this$props10.children,
|
653 | forceRender = _this$props10.forceRender,
|
654 | alignPoint = _this$props10.alignPoint,
|
655 | className = _this$props10.className,
|
656 | autoDestroy = _this$props10.autoDestroy;
|
657 |
|
658 | var child = _react.default.Children.only(children);
|
659 |
|
660 | var newChildProps = {
|
661 | key: 'trigger'
|
662 | };
|
663 |
|
664 | if (this.isContextMenuToShow()) {
|
665 | newChildProps.onContextMenu = this.onContextMenu;
|
666 | } else {
|
667 | newChildProps.onContextMenu = this.createTwoChains('onContextMenu');
|
668 | }
|
669 |
|
670 | if (this.isClickToHide() || this.isClickToShow()) {
|
671 | newChildProps.onClick = this.onClick;
|
672 | newChildProps.onMouseDown = this.onMouseDown;
|
673 | newChildProps.onTouchStart = this.onTouchStart;
|
674 | } else {
|
675 | newChildProps.onClick = this.createTwoChains('onClick');
|
676 | newChildProps.onMouseDown = this.createTwoChains('onMouseDown');
|
677 | newChildProps.onTouchStart = this.createTwoChains('onTouchStart');
|
678 | }
|
679 |
|
680 | if (this.isMouseEnterToShow()) {
|
681 | newChildProps.onMouseEnter = this.onMouseEnter;
|
682 |
|
683 | if (alignPoint) {
|
684 | newChildProps.onMouseMove = this.onMouseMove;
|
685 | }
|
686 | } else {
|
687 | newChildProps.onMouseEnter = this.createTwoChains('onMouseEnter');
|
688 | }
|
689 |
|
690 | if (this.isMouseLeaveToHide()) {
|
691 | newChildProps.onMouseLeave = this.onMouseLeave;
|
692 | } else {
|
693 | newChildProps.onMouseLeave = this.createTwoChains('onMouseLeave');
|
694 | }
|
695 |
|
696 | if (this.isFocusToShow() || this.isBlurToHide()) {
|
697 | newChildProps.onFocus = this.onFocus;
|
698 | newChildProps.onBlur = this.onBlur;
|
699 | } else {
|
700 | newChildProps.onFocus = this.createTwoChains('onFocus');
|
701 | newChildProps.onBlur = this.createTwoChains('onBlur');
|
702 | }
|
703 |
|
704 | var childrenClassName = (0, _classnames.default)(child && child.props && child.props.className, className);
|
705 |
|
706 | if (childrenClassName) {
|
707 | newChildProps.className = childrenClassName;
|
708 | }
|
709 |
|
710 | var cloneProps = _objectSpread({}, newChildProps);
|
711 |
|
712 | if ((0, _ref2.supportRef)(child)) {
|
713 | cloneProps.ref = (0, _ref2.composeRef)(this.triggerRef, child.ref);
|
714 | }
|
715 |
|
716 | var trigger = _react.default.cloneElement(child, cloneProps);
|
717 |
|
718 | var portal;
|
719 |
|
720 | if (popupVisible || this.popupRef.current || forceRender) {
|
721 | portal = _react.default.createElement(PortalComponent, {
|
722 | key: "portal",
|
723 | getContainer: this.getContainer,
|
724 | didUpdate: this.handlePortalUpdate
|
725 | }, this.getComponent());
|
726 | }
|
727 |
|
728 | if (!popupVisible && autoDestroy) {
|
729 | portal = null;
|
730 | }
|
731 |
|
732 | return _react.default.createElement(_context.default.Provider, {
|
733 | value: {
|
734 | onPopupMouseDown: this.onPopupMouseDown
|
735 | }
|
736 | }, trigger, portal);
|
737 | }
|
738 | }], [{
|
739 | key: "getDerivedStateFromProps",
|
740 | value: function getDerivedStateFromProps(_ref, prevState) {
|
741 | var popupVisible = _ref.popupVisible;
|
742 | var newState = {};
|
743 |
|
744 | if (popupVisible !== undefined && prevState.popupVisible !== popupVisible) {
|
745 | newState.popupVisible = popupVisible;
|
746 | newState.prevPopupVisible = prevState.popupVisible;
|
747 | }
|
748 |
|
749 | return newState;
|
750 | }
|
751 | }]);
|
752 |
|
753 | return Trigger;
|
754 | }(_react.default.Component);
|
755 |
|
756 | Trigger.contextType = _context.default;
|
757 | Trigger.defaultProps = {
|
758 | prefixCls: 'rc-trigger-popup',
|
759 | getPopupClassNameFromAlign: returnEmptyString,
|
760 | getDocument: returnDocument,
|
761 | onPopupVisibleChange: noop,
|
762 | afterPopupVisibleChange: noop,
|
763 | onPopupAlign: noop,
|
764 | popupClassName: '',
|
765 | mouseEnterDelay: 0,
|
766 | mouseLeaveDelay: 0.1,
|
767 | focusDelay: 0,
|
768 | blurDelay: 0.15,
|
769 | popupStyle: {},
|
770 | destroyPopupOnHide: false,
|
771 | popupAlign: {},
|
772 | defaultPopupVisible: false,
|
773 | mask: false,
|
774 | maskClosable: true,
|
775 | action: [],
|
776 | showAction: [],
|
777 | hideAction: [],
|
778 | autoDestroy: false
|
779 | };
|
780 | return Trigger;
|
781 | }
|
782 |
|
783 | var _default = generateTrigger(_Portal.default);
|
784 |
|
785 | exports.default = _default; |
\ | No newline at end of file |