diff --git a/node_modules/react-contextmenu/modules/ContextMenu.js b/node_modules/react-contextmenu/modules/ContextMenu.js index 622a1f9..630ba68 100644 --- a/node_modules/react-contextmenu/modules/ContextMenu.js +++ b/node_modules/react-contextmenu/modules/ContextMenu.js @@ -81,6 +81,11 @@ var ContextMenu = function (_AbstractMenu) { x = _e$detail$position.x, y = _e$detail$position.y; + if (x === undefined) { + var rect = e.detail.target.getBoundingClientRect(); + x = rect.x; + y = rect.y; + } _this.setState({ isVisible: true, x: x, y: y }); _this.registerHandlers(); @@ -226,6 +231,9 @@ var ContextMenu = function (_AbstractMenu) { if (this.state.isVisible) { var wrapper = window.requestAnimationFrame || setTimeout; + if (!this.previousFocus) { + this.previousFocus = document.activeElement; + } wrapper(function () { var _state = _this2.state, @@ -241,13 +249,21 @@ var ContextMenu = function (_AbstractMenu) { _this2.menu.style.top = top + 'px'; _this2.menu.style.left = left + 'px'; _this2.menu.style.opacity = 1; + _this2.menu.style.visibility = 'visible'; _this2.menu.style.pointerEvents = 'auto'; + + _this2.menu.focus(); }); }); } else { if (!this.menu) return; this.menu.style.opacity = 0; this.menu.style.pointerEvents = 'none'; + + if (this.previousFocus && this.previousFocus.focus) { + this.previousFocus.focus(); + this.previousFocus = null; + } } } }, { diff --git a/node_modules/react-contextmenu/modules/SubMenu.js b/node_modules/react-contextmenu/modules/SubMenu.js index 3eb1d4e..0734b63 100644 --- a/node_modules/react-contextmenu/modules/SubMenu.js +++ b/node_modules/react-contextmenu/modules/SubMenu.js @@ -123,6 +123,7 @@ var SubMenu = function (_AbstractMenu) { if (_this.props.disabled || _this.state.visible) return; + if (_this.opentimer) clearTimeout(_this.opentimer); _this.opentimer = setTimeout(function () { return _this.setState({ visible: true, @@ -136,6 +137,7 @@ var SubMenu = function (_AbstractMenu) { if (!_this.state.visible) return; + if (_this.closetimer) clearTimeout(_this.closetimer); _this.closetimer = setTimeout(function () { return _this.setState({ visible: false, @@ -164,6 +166,15 @@ var SubMenu = function (_AbstractMenu) { } }; + _this.cleanup = function () { + _this.subMenu.removeEventListener('transitionend', _this.cleanup); + _this.subMenu.style.removeProperty('bottom'); + _this.subMenu.style.removeProperty('right'); + _this.subMenu.style.top = 0; + _this.subMenu.style.left = '100%'; + _this.unregisterHandlers(); + }; + _this.state = (0, _objectAssign2.default)({}, _this.state, { visible: false }); @@ -196,32 +207,28 @@ var SubMenu = function (_AbstractMenu) { if (this.props.forceOpen || this.state.visible) { var wrapper = window.requestAnimationFrame || setTimeout; wrapper(function () { - var styles = _this2.props.rtl ? _this2.getRTLMenuPosition() : _this2.getMenuPosition(); - - _this2.subMenu.style.removeProperty('top'); - _this2.subMenu.style.removeProperty('bottom'); - _this2.subMenu.style.removeProperty('left'); - _this2.subMenu.style.removeProperty('right'); - - if ((0, _helpers.hasOwnProp)(styles, 'top')) _this2.subMenu.style.top = styles.top; - if ((0, _helpers.hasOwnProp)(styles, 'left')) _this2.subMenu.style.left = styles.left; - if ((0, _helpers.hasOwnProp)(styles, 'bottom')) _this2.subMenu.style.bottom = styles.bottom; - if ((0, _helpers.hasOwnProp)(styles, 'right')) _this2.subMenu.style.right = styles.right; - _this2.subMenu.classList.add(_helpers.cssClasses.menuVisible); - - _this2.registerHandlers(); - _this2.setState({ selectedItem: null }); + if (_this2.props.forceOpen || _this2.state.visible) { + _this2.subMenu.removeEventListener('transitionend', _this2.cleanup); + var styles = _this2.props.rtl ? _this2.getRTLMenuPosition() : _this2.getMenuPosition(); + + _this2.subMenu.style.removeProperty('top'); + _this2.subMenu.style.removeProperty('bottom'); + _this2.subMenu.style.removeProperty('left'); + _this2.subMenu.style.removeProperty('right'); + + if ((0, _helpers.hasOwnProp)(styles, 'top')) _this2.subMenu.style.top = styles.top; + if ((0, _helpers.hasOwnProp)(styles, 'left')) _this2.subMenu.style.left = styles.left; + if ((0, _helpers.hasOwnProp)(styles, 'bottom')) _this2.subMenu.style.bottom = styles.bottom; + if ((0, _helpers.hasOwnProp)(styles, 'right')) _this2.subMenu.style.right = styles.right; + _this2.subMenu.classList.add(_helpers.cssClasses.menuVisible); + + _this2.registerHandlers(); + _this2.setState({ selectedItem: null }); + } }); } else { - var cleanup = function cleanup() { - _this2.subMenu.removeEventListener('transitionend', cleanup); - _this2.subMenu.style.removeProperty('bottom'); - _this2.subMenu.style.removeProperty('right'); - _this2.subMenu.style.top = 0; - _this2.subMenu.style.left = '100%'; - _this2.unregisterHandlers(); - }; - this.subMenu.addEventListener('transitionend', cleanup); + this.subMenu.removeEventListener('transitionend', this.cleanup); + this.subMenu.addEventListener('transitionend', this.cleanup); this.subMenu.classList.remove(_helpers.cssClasses.menuVisible); } }