import React from "react";
import PropTypes from "prop-types";
import ContextMenu from "./ContextMenu";

export default class ContextMenuWraper extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selected: false,
      offsetTop: null,
      offsetLeft: null
    };
    this._handleRightClick = this._handleRightClick.bind(this);
    this._handleGlobalClick = this._handleGlobalClick.bind(this);
  }

  componentWillUnmount() {
    document.removeEventListener("click", this._handleGlobalClick);
  }

  _handleGlobalClick() {
    this.setState({
      selected: false,
      offsetTop: null,
      offsetLeft: null
    });
    document.removeEventListener("click", this._handleGlobalClick);
  }

  _handleRightClick(e) {
    const { pageX, pageY } = e;
    this.setState({
      selected: true,
      // TODO: We could do an initial render to see if the menu fits here
      // and do a second render if it does not.
      offsetTop: pageY,
      offsetLeft: pageX
    });
    // Even if you right click multiple times before closeing,
    // we should only end up with one global listener.
    document.addEventListener("click", this._handleGlobalClick);
    e.preventDefault();
    e.stopPropagation();
  }

  render() {
    const { children, renderContents, ...passThroughProps } = this.props;
    return (
      <div
        onContextMenu={this._handleRightClick}
        style={{ width: "100%", height: "100%" }}
        {...passThroughProps}
      >
        <ContextMenu
          selected={this.state.selected}
          offsetTop={this.state.offsetTop}
          offsetLeft={this.state.offsetLeft}
        >
          {renderContents()}
        </ContextMenu>
        {children}
      </div>
    );
  }
}

ContextMenuWraper.propTypes = {
  children: PropTypes.any.isRequired,
  renderContents: PropTypes.func.isRequired
};

@@ -435,131 +435,154 @@
 ;%0A  
-%7D%0A%0A  componentWillUnmount() %7B%0A    document.removeEventListener(%22click%22, this._handleGlobalClick);%0A  %7D%0A%0A  _handleGlobalClick
+  this._handleGlobalRightClick = this._handleGlobalRightClick.bind(this);%0A  %7D%0A%0A  componentWillUnmount() %7B%0A    this._closeMenu();%0A  %7D%0A%0A  _closeMenu
 () %7B
@@ -593,38 +593,32 @@
  this.setState(%7B
-%0A     
  selected: false
@@ -610,38 +610,32 @@
 selected: false,
-%0A     
  offsetTop: null
@@ -627,38 +627,32 @@
 offsetTop: null,
-%0A     
  offsetLeft: nul
@@ -652,22 +652,86 @@
 ft: null
+ %7D);
 %0A    
-%7D
+document.removeEventListener(%22click%22, this._handleGlobalClick
 );%0A    d
@@ -730,32 +730,37 @@
 );%0A    document.
+body.
 removeEventListe
@@ -767,40 +767,227 @@
 ner(
-%22click%22, this._handleGlobalClick
+%0A      %22contextmenu%22,%0A      this._handleGlobalRightClick%0A    );%0A  %7D%0A%0A  _handleGlobalRightClick() %7B%0A    this._closeMenu();%0A  %7D%0A%0A  _handleGlobalClick(e) %7B%0A    if (e.button === 2) %7B%0A      return;%0A    %7D%0A    this._closeMenu(
 );%0A 
@@ -1446,24 +1446,105 @@
 obalClick);%0A
+    document.body.addEventListener(%22contextmenu%22, this._handleGlobalRightClick);%0A
     e.preven

Fix context menus in Firefox