v0.2.2

Author: vkbansal

CHANGELOG.md

@@ -9,6 +9,15 @@ All the changes can be found below. Order used:
 - Fixed
 - Security
 
+## v0.2.2
+
+### Added
+ - Add compatibility with IE (Still needed for IE11).
+
+### Fixed
+ - Better event handling.
+ - Only hide the currently visible context menu. On touch screens, the menu closes before the event to click is triggered. This only happened when using multiple contex menus.
+
 ## v0.2.1
 
 ### Fixed

dist/react-contextmenu.js

@@ -33,38 +33,36 @@ exports["default"] = function (identifier, configure) {
         (0, _invariant2["default"])(typeof configure === "function", "Expected configure to be a function. See %s", displayName);
 
         return _react2["default"].createClass({
-          displayName: displayName + "ContextMenuLayer",
-          componentDidMount: function componentDidMount() {
-              document.addEventListener("contextmenu", this.handleContextClick);
-          },
-          componentWillUnmount: function componentWillUnmount() {
-              document.removeEventListener("contextmenu", this.handleContextClick);
-          },
-          handleContextClick: function handleContextClick(event) {
-              var target = event.target;
-              var domNode = _react2["default"].findDOMNode(this);
-
-              if(target == domNode || domNode.contains(target)) {
-                var currentItem = configure(this.props);
-
-                (0, _invariant2["default"])((0, _lodashIsobject2["default"])(currentItem), "Expected configure to return an object. See %s", displayName);
-
-                event.preventDefault();
-                var actions = _flux2["default"].getActions("menu");
-                actions.setParams({
-                    x: event.clientX,
-                    y: event.clientY,
-                    currentItem: currentItem,
-                    isVisible: typeof identifier === "function" ? identifier(this.props) : identifier
-                });
-              }
-
-          },
-          render: function render() {
-              return _react2["default"].createElement(Component, _extends({}, this.props, { identifier: identifier }));
-          }
-      });
+            displayName: displayName + "ContextMenuLayer",
+            componentDidMount: function componentDidMount() {
+                document.addEventListener("contextmenu", this.handleContextClick);
+            },
+            componentWillUnmount: function componentWillUnmount() {
+                document.removeEventListener("contextmenu", this.handleContextClick);
+            },
+            handleContextClick: function handleContextClick(event) {
+                var target = event.target;
+                var domNode = _react2["default"].findDOMNode(this);
+                if (target == domNode || domNode.contains(target)) {
+                    var currentItem = configure(this.props);
+
+                    (0, _invariant2["default"])((0, _lodashIsobject2["default"])(currentItem), "Expected configure to return an object. See %s", displayName);
+
+                    event.preventDefault();
+                    var actions = _flux2["default"].getActions("menu");
+                    actions.setParams({
+                        x: event.clientX,
+                        y: event.clientY,
+                        currentItem: currentItem,
+                        isVisible: typeof identifier === "function" ? identifier(this.props) : identifier
+                    });
+                }
+            },
+            render: function render() {
+                return _react2["default"].createElement(Component, _extends({}, this.props, { identifier: identifier }));
+            }
+        });
     };
 };
 
-module.exports = exports["default"];
+module.exports = exports["default"];

modules/contextmenu-layer.js

@@ -46,9 +46,9 @@ var MenuContainer = _react2["default"].createClass({
     },
     getMenuPosition: function getMenuPosition(x, y) {
         var menu = _react2["default"].findDOMNode(this.refs.menu);
-        var screen = window.screen;
         var scrollX = document.documentElement.scrollTop;
         var scrollY = document.documentElement.scrollLeft;
+        var screen = window.screen;
         var AvailWidth = screen.AvailWidth;
         var AvailHeight = screen.AvailHeight;
         var offsetWidth = menu.offsetWidth;
@@ -73,22 +73,23 @@ var MenuContainer = _react2["default"].createClass({
         var _props = this.props;
         var isVisible = _props.isVisible;
         var identifier = _props.identifier;
-        if(isVisible === identifier) {
-          var localNode = this.localNode,
-              source = event.target,
-              found = false;
 
-          while (source.parentNode) {
-              found = source === localNode;
+        if (isVisible === identifier) {
+            var localNode = this.localNode,
+                source = event.target,
+                found = false;
+
+            while (source.parentNode) {
+                found = source === localNode;
 
-              if (found) {
-                  return;
-              }
+                if (found) {
+                    return;
+                }
 
-              source = source.parentNode;
-          }
+                source = source.parentNode;
+            }
 
-          this._hideMenu();
+            this._hideMenu();
         }
     },
     _hideMenu: function _hideMenu() {
@@ -114,10 +115,10 @@ var MenuContainer = _react2["default"].createClass({
         document.addEventListener("scroll", fn2);
     },
     render: function render() {
-        var _props = this.props;
-        var currentItem = _props.currentItem;
-        var isVisible = _props.isVisible;
-        var identifier = _props.identifier;
+        var _props2 = this.props;
+        var currentItem = _props2.currentItem;
+        var isVisible = _props2.isVisible;
+        var identifier = _props2.identifier;
 
         var classes = (0, _classnames2["default"])({
             "context-menu": true,
@@ -137,4 +138,4 @@ var MenuContainer = _react2["default"].createClass({
 });
 
 exports["default"] = MenuContainer;
-module.exports = exports["default"];
+module.exports = exports["default"];

modules/menu-container.js

@@ -1,6 +1,6 @@
 {
   "name": "react-contextmenu",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "description": "Context Menu implemented in React",
   "main": "modules/index.js",
   "keywords": [