Merge pull request #63 from yjose/V1.3.2

V1.3.2
yjose · Dec 13, 2018 · 48b1f0d · 48b1f0d
2 parents f06ed79 + 6a5cc59
commit 48b1f0d
Show file tree

Hide file tree

Showing 9 changed files with 125 additions and 54 deletions.
diff --git a/lib/index.d.ts b/lib/index.d.ts
@@ -19,6 +19,7 @@ declare module 'reactjs-popup' {
     lockScroll?: boolean;
     closeOnDocumentClick?: boolean;
     closeOnEscape?: boolean;
+    repositionOnResize?: boolean;
     mouseEnterDelay?: number;
     mouseLeaveDelay?: number;
     onOpen?: () => any;
@@ -29,7 +30,5 @@ declare module 'reactjs-popup' {
     keepTooltipInside?: boolean | string;
   }
 
-  class Popup extends React.Component<Props> {}
-
-  export = Popup;
+  export default class Popup extends React.PureComponent<Props> {}
 }
diff --git a/lib/package.json b/lib/package.json
@@ -1,6 +1,6 @@
 {
   "name": "reactjs-popup",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "React Popup Component - Modals,Tooltips and Menus —  All in one",
   "main": "reactjs-popup.cjs.js",
   "module": "reactjs-popup.es.js",
@@ -35,5 +35,5 @@
   "bugs": {
     "url": "https://github.com/yjose/reactjs-popup/issues"
   },
-  "homepage": "https://react-popup.netlify.com/"
+  "homepage": "https://react-popup.elazizi.com/"
 }
diff --git a/lib/reactjs-popup.cjs.js b/lib/reactjs-popup.cjs.js
@@ -1,5 +1,5 @@
 /*!
- * reactjs-popup v1.3.1
+ * reactjs-popup v1.3.2
  * (c) 2018-present Youssouf EL AZIZI <[email protected]>
  * Released under the MIT License.
  */
@@ -326,6 +326,14 @@ function (_React$PureComponent) {
 
     });
 
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "repositionOnResize", function () {
+      _this.setPosition();
+    });
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "onEscape", function (e) {
+      if (e.key === "Escape") _this.closePopup();
+    });
+
     _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "lockScroll", function () {
       if (_this.state.modal && _this.props.lockScroll) document.getElementsByTagName("body")[0].style.overflow = "hidden";
     });
@@ -403,15 +411,17 @@ function (_React$PureComponent) {
     });
 
     _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "setPosition", function () {
+      var _this$state = _this.state,
+          modal = _this$state.modal,
+          isOpen = _this$state.isOpen;
+      if (modal || !isOpen) return;
       var _this$props = _this.props,
           arrow = _this$props.arrow,
           position = _this$props.position,
           offsetX = _this$props.offsetX,
           offsetY = _this$props.offsetY,
           keepTooltipInside = _this$props.keepTooltipInside,
           arrowStyle = _this$props.arrowStyle;
-      var modal = _this.state.modal;
-      if (modal) return;
 
       var helper = _this.HelperEl.getBoundingClientRect();
 
@@ -532,17 +542,18 @@ function (_React$PureComponent) {
   _createClass(Popup, [{
     key: "componentDidMount",
     value: function componentDidMount() {
-      var _this2 = this;
-
       var _this$props5 = this.props,
           closeOnEscape = _this$props5.closeOnEscape,
-          defaultOpen = _this$props5.defaultOpen;
+          defaultOpen = _this$props5.defaultOpen,
+          repositionOnResize = _this$props5.repositionOnResize;
       if (defaultOpen) this.setPosition();
 
       if (closeOnEscape) {
-        window.addEventListener("keyup", function (e) {
-          if (e.key === "Escape") _this2.closePopup();
-        });
+        window.addEventListener("keyup", this.onEscape);
+      }
+
+      if (repositionOnResize) {
+        window.addEventListener('resize', this.repositionOnResize);
       }
     }
   }, {
@@ -563,14 +574,25 @@ function (_React$PureComponent) {
     value: function componentWillUnmount() {
       // kill any function to execute if the component is unmounted
       clearTimeout(this.timeOut);
+      var _this$props6 = this.props,
+          closeOnEscape = _this$props6.closeOnEscape,
+          repositionOnResize = _this$props6.repositionOnResize; // remove events listeners
+
+      if (closeOnEscape) {
+        window.removeEventListener("keyup", this.onEscape);
+      }
+
+      if (repositionOnResize) {
+        window.removeEventListener('resize', this.repositionOnResize);
+      }
     }
   }, {
     key: "render",
     value: function render() {
-      var _this$props6 = this.props,
-          overlayStyle = _this$props6.overlayStyle,
-          closeOnDocumentClick = _this$props6.closeOnDocumentClick,
-          on = _this$props6.on;
+      var _this$props7 = this.props,
+          overlayStyle = _this$props7.overlayStyle,
+          closeOnDocumentClick = _this$props7.closeOnDocumentClick,
+          on = _this$props7.on;
       var modal = this.state.modal;
       var overlay = this.state.isOpen && !(on.indexOf("hover") >= 0);
       var ovStyle = modal ? styles.overlay.modal : styles.overlay.tooltip;
@@ -608,6 +630,7 @@ _defineProperty(Popup, "defaultProps", {
   open: false,
   disabled: false,
   closeOnDocumentClick: true,
+  repositionOnResize: true,
   closeOnEscape: true,
   on: ["click"],
   contentStyle: {},
@@ -636,6 +659,7 @@ if (process.env.NODE_ENV !== "production") {
     className: PropTypes.string,
     modal: PropTypes.bool,
     closeOnDocumentClick: PropTypes.bool,
+    repositionOnResize: PropTypes.bool,
     disabled: PropTypes.bool,
     lockScroll: PropTypes.bool,
     offsetX: PropTypes.number,

diff --git a/lib/reactjs-popup.es.js b/lib/reactjs-popup.es.js
@@ -1,5 +1,5 @@
 /*!
- * reactjs-popup v1.3.1
+ * reactjs-popup v1.3.2
  * (c) 2018-present Youssouf EL AZIZI <[email protected]>
  * Released under the MIT License.
  */
@@ -322,6 +322,14 @@ function (_React$PureComponent) {
 
     });
 
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "repositionOnResize", function () {
+      _this.setPosition();
+    });
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "onEscape", function (e) {
+      if (e.key === "Escape") _this.closePopup();
+    });
+
     _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "lockScroll", function () {
       if (_this.state.modal && _this.props.lockScroll) document.getElementsByTagName("body")[0].style.overflow = "hidden";
     });
@@ -399,15 +407,17 @@ function (_React$PureComponent) {
     });
 
     _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "setPosition", function () {
+      var _this$state = _this.state,
+          modal = _this$state.modal,
+          isOpen = _this$state.isOpen;
+      if (modal || !isOpen) return;
       var _this$props = _this.props,
           arrow = _this$props.arrow,
           position = _this$props.position,
           offsetX = _this$props.offsetX,
           offsetY = _this$props.offsetY,
           keepTooltipInside = _this$props.keepTooltipInside,
           arrowStyle = _this$props.arrowStyle;
-      var modal = _this.state.modal;
-      if (modal) return;
 
       var helper = _this.HelperEl.getBoundingClientRect();
 
@@ -528,17 +538,18 @@ function (_React$PureComponent) {
   _createClass(Popup, [{
     key: "componentDidMount",
     value: function componentDidMount() {
-      var _this2 = this;
-
       var _this$props5 = this.props,
           closeOnEscape = _this$props5.closeOnEscape,
-          defaultOpen = _this$props5.defaultOpen;
+          defaultOpen = _this$props5.defaultOpen,
+          repositionOnResize = _this$props5.repositionOnResize;
       if (defaultOpen) this.setPosition();
 
       if (closeOnEscape) {
-        window.addEventListener("keyup", function (e) {
-          if (e.key === "Escape") _this2.closePopup();
-        });
+        window.addEventListener("keyup", this.onEscape);
+      }
+
+      if (repositionOnResize) {
+        window.addEventListener('resize', this.repositionOnResize);
       }
     }
   }, {
@@ -559,14 +570,25 @@ function (_React$PureComponent) {
     value: function componentWillUnmount() {
       // kill any function to execute if the component is unmounted
       clearTimeout(this.timeOut);
+      var _this$props6 = this.props,
+          closeOnEscape = _this$props6.closeOnEscape,
+          repositionOnResize = _this$props6.repositionOnResize; // remove events listeners
+
+      if (closeOnEscape) {
+        window.removeEventListener("keyup", this.onEscape);
+      }
+
+      if (repositionOnResize) {
+        window.removeEventListener('resize', this.repositionOnResize);
+      }
     }
   }, {
     key: "render",
     value: function render() {
-      var _this$props6 = this.props,
-          overlayStyle = _this$props6.overlayStyle,
-          closeOnDocumentClick = _this$props6.closeOnDocumentClick,
-          on = _this$props6.on;
+      var _this$props7 = this.props,
+          overlayStyle = _this$props7.overlayStyle,
+          closeOnDocumentClick = _this$props7.closeOnDocumentClick,
+          on = _this$props7.on;
       var modal = this.state.modal;
       var overlay = this.state.isOpen && !(on.indexOf("hover") >= 0);
       var ovStyle = modal ? styles.overlay.modal : styles.overlay.tooltip;
@@ -604,6 +626,7 @@ _defineProperty(Popup, "defaultProps", {
   open: false,
   disabled: false,
   closeOnDocumentClick: true,
+  repositionOnResize: true,
   closeOnEscape: true,
   on: ["click"],
   contentStyle: {},
@@ -632,6 +655,7 @@ if (process.env.NODE_ENV !== "production") {
     className: PropTypes.string,
     modal: PropTypes.bool,
     closeOnDocumentClick: PropTypes.bool,
+    repositionOnResize: PropTypes.bool,
     disabled: PropTypes.bool,
     lockScroll: PropTypes.bool,
     offsetX: PropTypes.number,

diff --git a/lib/reactjs-popup.js b/lib/reactjs-popup.js
@@ -1,5 +1,5 @@
 /*!
- * reactjs-popup v1.3.1
+ * reactjs-popup v1.3.2
  * (c) 2018-present Youssouf EL AZIZI <[email protected]>
  * Released under the MIT License.
  */
@@ -327,6 +327,14 @@
 
       });
 
+      _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "repositionOnResize", function () {
+        _this.setPosition();
+      });
+
+      _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "onEscape", function (e) {
+        if (e.key === "Escape") _this.closePopup();
+      });
+
       _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "lockScroll", function () {
         if (_this.state.modal && _this.props.lockScroll) document.getElementsByTagName("body")[0].style.overflow = "hidden";
       });
@@ -404,15 +412,17 @@
       });
 
       _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "setPosition", function () {
+        var _this$state = _this.state,
+            modal = _this$state.modal,
+            isOpen = _this$state.isOpen;
+        if (modal || !isOpen) return;
         var _this$props = _this.props,
             arrow = _this$props.arrow,
             position = _this$props.position,
             offsetX = _this$props.offsetX,
             offsetY = _this$props.offsetY,
             keepTooltipInside = _this$props.keepTooltipInside,
             arrowStyle = _this$props.arrowStyle;
-        var modal = _this.state.modal;
-        if (modal) return;
 
         var helper = _this.HelperEl.getBoundingClientRect();
 
@@ -533,17 +543,18 @@
     _createClass(Popup, [{
       key: "componentDidMount",
       value: function componentDidMount() {
-        var _this2 = this;
-
         var _this$props5 = this.props,
             closeOnEscape = _this$props5.closeOnEscape,
-            defaultOpen = _this$props5.defaultOpen;
+            defaultOpen = _this$props5.defaultOpen,
+            repositionOnResize = _this$props5.repositionOnResize;
         if (defaultOpen) this.setPosition();
 
         if (closeOnEscape) {
-          window.addEventListener("keyup", function (e) {
-            if (e.key === "Escape") _this2.closePopup();
-          });
+          window.addEventListener("keyup", this.onEscape);
+        }
+
+        if (repositionOnResize) {
+          window.addEventListener('resize', this.repositionOnResize);
         }
       }
     }, {
@@ -564,14 +575,25 @@
       value: function componentWillUnmount() {
         // kill any function to execute if the component is unmounted
         clearTimeout(this.timeOut);
+        var _this$props6 = this.props,
+            closeOnEscape = _this$props6.closeOnEscape,
+            repositionOnResize = _this$props6.repositionOnResize; // remove events listeners
+
+        if (closeOnEscape) {
+          window.removeEventListener("keyup", this.onEscape);
+        }
+
+        if (repositionOnResize) {
+          window.removeEventListener('resize', this.repositionOnResize);
+        }
       }
     }, {
       key: "render",
       value: function render() {
-        var _this$props6 = this.props,
-            overlayStyle = _this$props6.overlayStyle,
-            closeOnDocumentClick = _this$props6.closeOnDocumentClick,
-            on = _this$props6.on;
+        var _this$props7 = this.props,
+            overlayStyle = _this$props7.overlayStyle,
+            closeOnDocumentClick = _this$props7.closeOnDocumentClick,
+            on = _this$props7.on;
         var modal = this.state.modal;
         var overlay = this.state.isOpen && !(on.indexOf("hover") >= 0);
         var ovStyle = modal ? styles.overlay.modal : styles.overlay.tooltip;
@@ -609,6 +631,7 @@
     open: false,
     disabled: false,
     closeOnDocumentClick: true,
+    repositionOnResize: true,
     closeOnEscape: true,
     on: ["click"],
     contentStyle: {},
@@ -637,6 +660,7 @@
       className: PropTypes.string,
       modal: PropTypes.bool,
       closeOnDocumentClick: PropTypes.bool,
+      repositionOnResize: PropTypes.bool,
       disabled: PropTypes.bool,
       lockScroll: PropTypes.bool,
       offsetX: PropTypes.number,