Trigger.js 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _extends2 = require('babel-runtime/helpers/extends');
  6. var _extends3 = _interopRequireDefault(_extends2);
  7. var _vue = require('vue');
  8. var _vue2 = _interopRequireDefault(_vue);
  9. var _vueRef = require('vue-ref');
  10. var _vueRef2 = _interopRequireDefault(_vueRef);
  11. var _vueTypes = require('../_util/vue-types');
  12. var _vueTypes2 = _interopRequireDefault(_vueTypes);
  13. var _contains = require('../vc-util/Dom/contains');
  14. var _contains2 = _interopRequireDefault(_contains);
  15. var _propsUtil = require('../_util/props-util');
  16. var _requestAnimationTimeout = require('../_util/requestAnimationTimeout');
  17. var _addEventListener = require('../vc-util/Dom/addEventListener');
  18. var _addEventListener2 = _interopRequireDefault(_addEventListener);
  19. var _warning = require('../_util/warning');
  20. var _warning2 = _interopRequireDefault(_warning);
  21. var _Popup = require('./Popup');
  22. var _Popup2 = _interopRequireDefault(_Popup);
  23. var _utils = require('./utils');
  24. var _BaseMixin = require('../_util/BaseMixin');
  25. var _BaseMixin2 = _interopRequireDefault(_BaseMixin);
  26. var _vnode = require('../_util/vnode');
  27. var _ContainerRender = require('../_util/ContainerRender');
  28. var _ContainerRender2 = _interopRequireDefault(_ContainerRender);
  29. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
  30. _vue2['default'].use(_vueRef2['default'], { name: 'ant-ref' });
  31. function returnEmptyString() {
  32. return '';
  33. }
  34. function returnDocument() {
  35. return window.document;
  36. }
  37. var ALL_HANDLERS = ['click', 'mousedown', 'touchstart', 'mouseenter', 'mouseleave', 'focus', 'blur', 'contextmenu'];
  38. exports['default'] = {
  39. name: 'Trigger',
  40. mixins: [_BaseMixin2['default']],
  41. props: {
  42. action: _vueTypes2['default'].oneOfType([_vueTypes2['default'].string, _vueTypes2['default'].arrayOf(_vueTypes2['default'].string)]).def([]),
  43. showAction: _vueTypes2['default'].any.def([]),
  44. hideAction: _vueTypes2['default'].any.def([]),
  45. getPopupClassNameFromAlign: _vueTypes2['default'].any.def(returnEmptyString),
  46. // onPopupVisibleChange: PropTypes.func.def(noop),
  47. afterPopupVisibleChange: _vueTypes2['default'].func.def(_utils.noop),
  48. popup: _vueTypes2['default'].any,
  49. popupStyle: _vueTypes2['default'].object.def(function () {
  50. return {};
  51. }),
  52. prefixCls: _vueTypes2['default'].string.def('rc-trigger-popup'),
  53. popupClassName: _vueTypes2['default'].string.def(''),
  54. popupPlacement: _vueTypes2['default'].string,
  55. builtinPlacements: _vueTypes2['default'].object,
  56. popupTransitionName: _vueTypes2['default'].oneOfType([_vueTypes2['default'].string, _vueTypes2['default'].object]),
  57. popupAnimation: _vueTypes2['default'].any,
  58. mouseEnterDelay: _vueTypes2['default'].number.def(0),
  59. mouseLeaveDelay: _vueTypes2['default'].number.def(0.1),
  60. zIndex: _vueTypes2['default'].number,
  61. focusDelay: _vueTypes2['default'].number.def(0),
  62. blurDelay: _vueTypes2['default'].number.def(0.15),
  63. getPopupContainer: _vueTypes2['default'].func,
  64. getDocument: _vueTypes2['default'].func.def(returnDocument),
  65. forceRender: _vueTypes2['default'].bool,
  66. destroyPopupOnHide: _vueTypes2['default'].bool.def(false),
  67. mask: _vueTypes2['default'].bool.def(false),
  68. maskClosable: _vueTypes2['default'].bool.def(true),
  69. // onPopupAlign: PropTypes.func.def(noop),
  70. popupAlign: _vueTypes2['default'].object.def(function () {
  71. return {};
  72. }),
  73. popupVisible: _vueTypes2['default'].bool,
  74. defaultPopupVisible: _vueTypes2['default'].bool.def(false),
  75. maskTransitionName: _vueTypes2['default'].oneOfType([_vueTypes2['default'].string, _vueTypes2['default'].object]),
  76. maskAnimation: _vueTypes2['default'].string,
  77. stretch: _vueTypes2['default'].string,
  78. alignPoint: _vueTypes2['default'].bool // Maybe we can support user pass position in the future
  79. },
  80. provide: function provide() {
  81. return {
  82. vcTriggerContext: this
  83. };
  84. },
  85. inject: {
  86. vcTriggerContext: { 'default': function _default() {
  87. return {};
  88. } },
  89. savePopupRef: { 'default': function _default() {
  90. return _utils.noop;
  91. } },
  92. dialogContext: { 'default': function _default() {
  93. return null;
  94. } }
  95. },
  96. data: function data() {
  97. var _this = this;
  98. var props = this.$props;
  99. var popupVisible = void 0;
  100. if ((0, _propsUtil.hasProp)(this, 'popupVisible')) {
  101. popupVisible = !!props.popupVisible;
  102. } else {
  103. popupVisible = !!props.defaultPopupVisible;
  104. }
  105. ALL_HANDLERS.forEach(function (h) {
  106. _this['fire' + h] = function (e) {
  107. _this.fireEvents(h, e);
  108. };
  109. });
  110. return {
  111. prevPopupVisible: popupVisible,
  112. sPopupVisible: popupVisible,
  113. point: null
  114. };
  115. },
  116. watch: {
  117. popupVisible: function popupVisible(val) {
  118. if (val !== undefined) {
  119. this.prevPopupVisible = this.sPopupVisible;
  120. this.sPopupVisible = val;
  121. }
  122. }
  123. },
  124. deactivated: function deactivated() {
  125. this.setPopupVisible(false);
  126. },
  127. mounted: function mounted() {
  128. var _this2 = this;
  129. this.$nextTick(function () {
  130. _this2.renderComponent(null);
  131. _this2.updatedCal();
  132. });
  133. },
  134. updated: function updated() {
  135. var _this3 = this;
  136. var triggerAfterPopupVisibleChange = function triggerAfterPopupVisibleChange() {
  137. if (_this3.sPopupVisible !== _this3.prevPopupVisible) {
  138. _this3.afterPopupVisibleChange(_this3.sPopupVisible);
  139. }
  140. _this3.prevPopupVisible = _this3.sPopupVisible;
  141. };
  142. this.renderComponent(null, triggerAfterPopupVisibleChange);
  143. this.$nextTick(function () {
  144. _this3.updatedCal();
  145. });
  146. },
  147. beforeDestroy: function beforeDestroy() {
  148. this.clearDelayTimer();
  149. this.clearOutsideHandler();
  150. clearTimeout(this.mouseDownTimeout);
  151. },
  152. methods: {
  153. updatedCal: function updatedCal() {
  154. var props = this.$props;
  155. var state = this.$data;
  156. // We must listen to `mousedown` or `touchstart`, edge case:
  157. // https://github.com/ant-design/ant-design/issues/5804
  158. // https://github.com/react-component/calendar/issues/250
  159. // https://github.com/react-component/trigger/issues/50
  160. if (state.sPopupVisible) {
  161. var currentDocument = void 0;
  162. if (!this.clickOutsideHandler && (this.isClickToHide() || this.isContextmenuToShow())) {
  163. currentDocument = props.getDocument();
  164. this.clickOutsideHandler = (0, _addEventListener2['default'])(currentDocument, 'mousedown', this.onDocumentClick);
  165. }
  166. // always hide on mobile
  167. if (!this.touchOutsideHandler) {
  168. currentDocument = currentDocument || props.getDocument();
  169. this.touchOutsideHandler = (0, _addEventListener2['default'])(currentDocument, 'touchstart', this.onDocumentClick);
  170. }
  171. // close popup when trigger type contains 'onContextmenu' and document is scrolling.
  172. if (!this.contextmenuOutsideHandler1 && this.isContextmenuToShow()) {
  173. currentDocument = currentDocument || props.getDocument();
  174. this.contextmenuOutsideHandler1 = (0, _addEventListener2['default'])(currentDocument, 'scroll', this.onContextmenuClose);
  175. }
  176. // close popup when trigger type contains 'onContextmenu' and window is blur.
  177. if (!this.contextmenuOutsideHandler2 && this.isContextmenuToShow()) {
  178. this.contextmenuOutsideHandler2 = (0, _addEventListener2['default'])(window, 'blur', this.onContextmenuClose);
  179. }
  180. } else {
  181. this.clearOutsideHandler();
  182. }
  183. },
  184. onMouseenter: function onMouseenter(e) {
  185. var mouseEnterDelay = this.$props.mouseEnterDelay;
  186. this.fireEvents('mouseenter', e);
  187. this.delaySetPopupVisible(true, mouseEnterDelay, mouseEnterDelay ? null : e);
  188. },
  189. onMouseMove: function onMouseMove(e) {
  190. this.fireEvents('mousemove', e);
  191. this.setPoint(e);
  192. },
  193. onMouseleave: function onMouseleave(e) {
  194. this.fireEvents('mouseleave', e);
  195. this.delaySetPopupVisible(false, this.$props.mouseLeaveDelay);
  196. },
  197. onPopupMouseenter: function onPopupMouseenter() {
  198. this.clearDelayTimer();
  199. },
  200. onPopupMouseleave: function onPopupMouseleave(e) {
  201. if (e && e.relatedTarget && !e.relatedTarget.setTimeout && this._component && this._component.getPopupDomNode && (0, _contains2['default'])(this._component.getPopupDomNode(), e.relatedTarget)) {
  202. return;
  203. }
  204. this.delaySetPopupVisible(false, this.$props.mouseLeaveDelay);
  205. },
  206. onFocus: function onFocus(e) {
  207. this.fireEvents('focus', e);
  208. // incase focusin and focusout
  209. this.clearDelayTimer();
  210. if (this.isFocusToShow()) {
  211. this.focusTime = Date.now();
  212. this.delaySetPopupVisible(true, this.$props.focusDelay);
  213. }
  214. },
  215. onMousedown: function onMousedown(e) {
  216. this.fireEvents('mousedown', e);
  217. this.preClickTime = Date.now();
  218. },
  219. onTouchstart: function onTouchstart(e) {
  220. this.fireEvents('touchstart', e);
  221. this.preTouchTime = Date.now();
  222. },
  223. onBlur: function onBlur(e) {
  224. if (!(0, _contains2['default'])(e.target, e.relatedTarget || document.activeElement)) {
  225. this.fireEvents('blur', e);
  226. this.clearDelayTimer();
  227. if (this.isBlurToHide()) {
  228. this.delaySetPopupVisible(false, this.$props.blurDelay);
  229. }
  230. }
  231. },
  232. onContextmenu: function onContextmenu(e) {
  233. e.preventDefault();
  234. this.fireEvents('contextmenu', e);
  235. this.setPopupVisible(true, e);
  236. },
  237. onContextmenuClose: function onContextmenuClose() {
  238. if (this.isContextmenuToShow()) {
  239. this.close();
  240. }
  241. },
  242. onClick: function onClick(event) {
  243. this.fireEvents('click', event);
  244. // focus will trigger click
  245. if (this.focusTime) {
  246. var preTime = void 0;
  247. if (this.preClickTime && this.preTouchTime) {
  248. preTime = Math.min(this.preClickTime, this.preTouchTime);
  249. } else if (this.preClickTime) {
  250. preTime = this.preClickTime;
  251. } else if (this.preTouchTime) {
  252. preTime = this.preTouchTime;
  253. }
  254. if (Math.abs(preTime - this.focusTime) < 20) {
  255. return;
  256. }
  257. this.focusTime = 0;
  258. }
  259. this.preClickTime = 0;
  260. this.preTouchTime = 0;
  261. // Only prevent default when all the action is click.
  262. // https://github.com/ant-design/ant-design/issues/17043
  263. // https://github.com/ant-design/ant-design/issues/17291
  264. if (this.isClickToShow() && (this.isClickToHide() || this.isBlurToHide()) && event && event.preventDefault) {
  265. event.preventDefault();
  266. }
  267. if (event && event.domEvent) {
  268. event.domEvent.preventDefault();
  269. }
  270. var nextVisible = !this.$data.sPopupVisible;
  271. if (this.isClickToHide() && !nextVisible || nextVisible && this.isClickToShow()) {
  272. this.setPopupVisible(!this.$data.sPopupVisible, event);
  273. }
  274. },
  275. onPopupMouseDown: function onPopupMouseDown() {
  276. var _this4 = this;
  277. var _vcTriggerContext = this.vcTriggerContext,
  278. vcTriggerContext = _vcTriggerContext === undefined ? {} : _vcTriggerContext;
  279. this.hasPopupMouseDown = true;
  280. clearTimeout(this.mouseDownTimeout);
  281. this.mouseDownTimeout = setTimeout(function () {
  282. _this4.hasPopupMouseDown = false;
  283. }, 0);
  284. if (vcTriggerContext.onPopupMouseDown) {
  285. vcTriggerContext.onPopupMouseDown.apply(vcTriggerContext, arguments);
  286. }
  287. },
  288. onDocumentClick: function onDocumentClick(event) {
  289. if (this.$props.mask && !this.$props.maskClosable) {
  290. return;
  291. }
  292. var target = event.target;
  293. var root = this.$el;
  294. if (!(0, _contains2['default'])(root, target) && !this.hasPopupMouseDown) {
  295. this.close();
  296. }
  297. },
  298. getPopupDomNode: function getPopupDomNode() {
  299. if (this._component && this._component.getPopupDomNode) {
  300. return this._component.getPopupDomNode();
  301. }
  302. return null;
  303. },
  304. getRootDomNode: function getRootDomNode() {
  305. return this.$el;
  306. // return this.$el.children[0] || this.$el
  307. },
  308. handleGetPopupClassFromAlign: function handleGetPopupClassFromAlign(align) {
  309. var className = [];
  310. var props = this.$props;
  311. var popupPlacement = props.popupPlacement,
  312. builtinPlacements = props.builtinPlacements,
  313. prefixCls = props.prefixCls,
  314. alignPoint = props.alignPoint,
  315. getPopupClassNameFromAlign = props.getPopupClassNameFromAlign;
  316. if (popupPlacement && builtinPlacements) {
  317. className.push((0, _utils.getAlignPopupClassName)(builtinPlacements, prefixCls, align, alignPoint));
  318. }
  319. if (getPopupClassNameFromAlign) {
  320. className.push(getPopupClassNameFromAlign(align));
  321. }
  322. return className.join(' ');
  323. },
  324. getPopupAlign: function getPopupAlign() {
  325. var props = this.$props;
  326. var popupPlacement = props.popupPlacement,
  327. popupAlign = props.popupAlign,
  328. builtinPlacements = props.builtinPlacements;
  329. if (popupPlacement && builtinPlacements) {
  330. return (0, _utils.getAlignFromPlacement)(builtinPlacements, popupPlacement, popupAlign);
  331. }
  332. return popupAlign;
  333. },
  334. savePopup: function savePopup(node) {
  335. this._component = node;
  336. this.savePopupRef(node);
  337. },
  338. getComponent: function getComponent() {
  339. var h = this.$createElement;
  340. var self = this;
  341. var mouseProps = {};
  342. if (this.isMouseEnterToShow()) {
  343. mouseProps.mouseenter = self.onPopupMouseenter;
  344. }
  345. if (this.isMouseLeaveToHide()) {
  346. mouseProps.mouseleave = self.onPopupMouseleave;
  347. }
  348. mouseProps.mousedown = this.onPopupMouseDown;
  349. mouseProps.touchstart = this.onPopupMouseDown;
  350. var handleGetPopupClassFromAlign = self.handleGetPopupClassFromAlign,
  351. getRootDomNode = self.getRootDomNode,
  352. getContainer = self.getContainer;
  353. var _self$$props = self.$props,
  354. prefixCls = _self$$props.prefixCls,
  355. destroyPopupOnHide = _self$$props.destroyPopupOnHide,
  356. popupClassName = _self$$props.popupClassName,
  357. action = _self$$props.action,
  358. popupAnimation = _self$$props.popupAnimation,
  359. popupTransitionName = _self$$props.popupTransitionName,
  360. popupStyle = _self$$props.popupStyle,
  361. mask = _self$$props.mask,
  362. maskAnimation = _self$$props.maskAnimation,
  363. maskTransitionName = _self$$props.maskTransitionName,
  364. zIndex = _self$$props.zIndex,
  365. stretch = _self$$props.stretch,
  366. alignPoint = _self$$props.alignPoint;
  367. var _$data = this.$data,
  368. sPopupVisible = _$data.sPopupVisible,
  369. point = _$data.point;
  370. var align = this.getPopupAlign();
  371. var popupProps = {
  372. props: {
  373. prefixCls: prefixCls,
  374. destroyPopupOnHide: destroyPopupOnHide,
  375. visible: sPopupVisible,
  376. point: alignPoint && point,
  377. action: action,
  378. align: align,
  379. animation: popupAnimation,
  380. getClassNameFromAlign: handleGetPopupClassFromAlign,
  381. stretch: stretch,
  382. getRootDomNode: getRootDomNode,
  383. mask: mask,
  384. zIndex: zIndex,
  385. transitionName: popupTransitionName,
  386. maskAnimation: maskAnimation,
  387. maskTransitionName: maskTransitionName,
  388. getContainer: getContainer,
  389. popupClassName: popupClassName,
  390. popupStyle: popupStyle
  391. },
  392. on: (0, _extends3['default'])({
  393. align: (0, _propsUtil.getListeners)(this).popupAlign || _utils.noop
  394. }, mouseProps),
  395. directives: [{
  396. name: 'ant-ref',
  397. value: this.savePopup
  398. }]
  399. };
  400. return h(
  401. _Popup2['default'],
  402. popupProps,
  403. [(0, _propsUtil.getComponentFromProp)(self, 'popup')]
  404. );
  405. },
  406. getContainer: function getContainer() {
  407. var props = this.$props,
  408. dialogContext = this.dialogContext;
  409. var popupContainer = document.createElement('div');
  410. // Make sure default popup container will never cause scrollbar appearing
  411. // https://github.com/react-component/trigger/issues/41
  412. popupContainer.style.position = 'absolute';
  413. popupContainer.style.top = '0';
  414. popupContainer.style.left = '0';
  415. popupContainer.style.width = '100%';
  416. var mountNode = props.getPopupContainer ? props.getPopupContainer(this.$el, dialogContext) : props.getDocument().body;
  417. mountNode.appendChild(popupContainer);
  418. this.popupContainer = popupContainer;
  419. return popupContainer;
  420. },
  421. setPopupVisible: function setPopupVisible(sPopupVisible, event) {
  422. var alignPoint = this.alignPoint,
  423. prevPopupVisible = this.sPopupVisible;
  424. this.clearDelayTimer();
  425. if (prevPopupVisible !== sPopupVisible) {
  426. if (!(0, _propsUtil.hasProp)(this, 'popupVisible')) {
  427. this.setState({
  428. sPopupVisible: sPopupVisible,
  429. prevPopupVisible: prevPopupVisible
  430. });
  431. }
  432. var listeners = (0, _propsUtil.getListeners)(this);
  433. listeners.popupVisibleChange && listeners.popupVisibleChange(sPopupVisible);
  434. }
  435. // Always record the point position since mouseEnterDelay will delay the show
  436. if (alignPoint && event) {
  437. this.setPoint(event);
  438. }
  439. },
  440. setPoint: function setPoint(point) {
  441. var alignPoint = this.$props.alignPoint;
  442. if (!alignPoint || !point) return;
  443. this.setState({
  444. point: {
  445. pageX: point.pageX,
  446. pageY: point.pageY
  447. }
  448. });
  449. },
  450. delaySetPopupVisible: function delaySetPopupVisible(visible, delayS, event) {
  451. var _this5 = this;
  452. var delay = delayS * 1000;
  453. this.clearDelayTimer();
  454. if (delay) {
  455. var point = event ? { pageX: event.pageX, pageY: event.pageY } : null;
  456. this.delayTimer = (0, _requestAnimationTimeout.requestAnimationTimeout)(function () {
  457. _this5.setPopupVisible(visible, point);
  458. _this5.clearDelayTimer();
  459. }, delay);
  460. } else {
  461. this.setPopupVisible(visible, event);
  462. }
  463. },
  464. clearDelayTimer: function clearDelayTimer() {
  465. if (this.delayTimer) {
  466. (0, _requestAnimationTimeout.cancelAnimationTimeout)(this.delayTimer);
  467. this.delayTimer = null;
  468. }
  469. },
  470. clearOutsideHandler: function clearOutsideHandler() {
  471. if (this.clickOutsideHandler) {
  472. this.clickOutsideHandler.remove();
  473. this.clickOutsideHandler = null;
  474. }
  475. if (this.contextmenuOutsideHandler1) {
  476. this.contextmenuOutsideHandler1.remove();
  477. this.contextmenuOutsideHandler1 = null;
  478. }
  479. if (this.contextmenuOutsideHandler2) {
  480. this.contextmenuOutsideHandler2.remove();
  481. this.contextmenuOutsideHandler2 = null;
  482. }
  483. if (this.touchOutsideHandler) {
  484. this.touchOutsideHandler.remove();
  485. this.touchOutsideHandler = null;
  486. }
  487. },
  488. createTwoChains: function createTwoChains(event) {
  489. var fn = function fn() {};
  490. var events = (0, _propsUtil.getListeners)(this);
  491. if (this.childOriginEvents[event] && events[event]) {
  492. return this['fire' + event];
  493. }
  494. fn = this.childOriginEvents[event] || events[event] || fn;
  495. return fn;
  496. },
  497. isClickToShow: function isClickToShow() {
  498. var _$props = this.$props,
  499. action = _$props.action,
  500. showAction = _$props.showAction;
  501. return action.indexOf('click') !== -1 || showAction.indexOf('click') !== -1;
  502. },
  503. isContextmenuToShow: function isContextmenuToShow() {
  504. var _$props2 = this.$props,
  505. action = _$props2.action,
  506. showAction = _$props2.showAction;
  507. return action.indexOf('contextmenu') !== -1 || showAction.indexOf('contextmenu') !== -1;
  508. },
  509. isClickToHide: function isClickToHide() {
  510. var _$props3 = this.$props,
  511. action = _$props3.action,
  512. hideAction = _$props3.hideAction;
  513. return action.indexOf('click') !== -1 || hideAction.indexOf('click') !== -1;
  514. },
  515. isMouseEnterToShow: function isMouseEnterToShow() {
  516. var _$props4 = this.$props,
  517. action = _$props4.action,
  518. showAction = _$props4.showAction;
  519. return action.indexOf('hover') !== -1 || showAction.indexOf('mouseenter') !== -1;
  520. },
  521. isMouseLeaveToHide: function isMouseLeaveToHide() {
  522. var _$props5 = this.$props,
  523. action = _$props5.action,
  524. hideAction = _$props5.hideAction;
  525. return action.indexOf('hover') !== -1 || hideAction.indexOf('mouseleave') !== -1;
  526. },
  527. isFocusToShow: function isFocusToShow() {
  528. var _$props6 = this.$props,
  529. action = _$props6.action,
  530. showAction = _$props6.showAction;
  531. return action.indexOf('focus') !== -1 || showAction.indexOf('focus') !== -1;
  532. },
  533. isBlurToHide: function isBlurToHide() {
  534. var _$props7 = this.$props,
  535. action = _$props7.action,
  536. hideAction = _$props7.hideAction;
  537. return action.indexOf('focus') !== -1 || hideAction.indexOf('blur') !== -1;
  538. },
  539. forcePopupAlign: function forcePopupAlign() {
  540. if (this.$data.sPopupVisible && this._component && this._component.$refs.alignInstance) {
  541. this._component.$refs.alignInstance.forceAlign();
  542. }
  543. },
  544. fireEvents: function fireEvents(type, e) {
  545. if (this.childOriginEvents[type]) {
  546. this.childOriginEvents[type](e);
  547. }
  548. this.__emit(type, e);
  549. },
  550. close: function close() {
  551. this.setPopupVisible(false);
  552. }
  553. },
  554. render: function render() {
  555. var _this6 = this;
  556. var h = arguments[0];
  557. var sPopupVisible = this.sPopupVisible;
  558. var children = (0, _propsUtil.filterEmpty)(this.$slots['default']);
  559. var _$props8 = this.$props,
  560. forceRender = _$props8.forceRender,
  561. alignPoint = _$props8.alignPoint;
  562. if (children.length > 1) {
  563. (0, _warning2['default'])(false, 'Trigger $slots.default.length > 1, just support only one default', true);
  564. }
  565. var child = children[0];
  566. this.childOriginEvents = (0, _propsUtil.getDataEvents)(child);
  567. var newChildProps = {
  568. props: {},
  569. nativeOn: {},
  570. key: 'trigger'
  571. };
  572. if (this.isContextmenuToShow()) {
  573. newChildProps.nativeOn.contextmenu = this.onContextmenu;
  574. } else {
  575. newChildProps.nativeOn.contextmenu = this.createTwoChains('contextmenu');
  576. }
  577. if (this.isClickToHide() || this.isClickToShow()) {
  578. newChildProps.nativeOn.click = this.onClick;
  579. newChildProps.nativeOn.mousedown = this.onMousedown;
  580. newChildProps.nativeOn.touchstart = this.onTouchstart;
  581. } else {
  582. newChildProps.nativeOn.click = this.createTwoChains('click');
  583. newChildProps.nativeOn.mousedown = this.createTwoChains('mousedown');
  584. newChildProps.nativeOn.touchstart = this.createTwoChains('onTouchstart');
  585. }
  586. if (this.isMouseEnterToShow()) {
  587. newChildProps.nativeOn.mouseenter = this.onMouseenter;
  588. if (alignPoint) {
  589. newChildProps.nativeOn.mousemove = this.onMouseMove;
  590. }
  591. } else {
  592. newChildProps.nativeOn.mouseenter = this.createTwoChains('mouseenter');
  593. }
  594. if (this.isMouseLeaveToHide()) {
  595. newChildProps.nativeOn.mouseleave = this.onMouseleave;
  596. } else {
  597. newChildProps.nativeOn.mouseleave = this.createTwoChains('mouseleave');
  598. }
  599. if (this.isFocusToShow() || this.isBlurToHide()) {
  600. newChildProps.nativeOn.focus = this.onFocus;
  601. newChildProps.nativeOn.blur = this.onBlur;
  602. } else {
  603. newChildProps.nativeOn.focus = this.createTwoChains('focus');
  604. newChildProps.nativeOn.blur = function (e) {
  605. if (e && (!e.relatedTarget || !(0, _contains2['default'])(e.target, e.relatedTarget))) {
  606. _this6.createTwoChains('blur')(e);
  607. }
  608. };
  609. }
  610. this.trigger = (0, _vnode.cloneElement)(child, newChildProps);
  611. return h(_ContainerRender2['default'], {
  612. attrs: {
  613. parent: this,
  614. visible: sPopupVisible,
  615. autoMount: false,
  616. forceRender: forceRender,
  617. getComponent: this.getComponent,
  618. getContainer: this.getContainer,
  619. children: function children(_ref) {
  620. var renderComponent = _ref.renderComponent;
  621. _this6.renderComponent = renderComponent;
  622. return _this6.trigger;
  623. }
  624. }
  625. });
  626. }
  627. };