react-onclickoutside - npm Package Compare versions

Comparing version 6.3.1 to 6.4.0

lib/generateOutsideCheck.js

 "use strict";
 
-exports.__esModule = true;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.default = generateOutsideCheck;
@@ -5,0 +7,0 @@ /**

lib/index.js

 'use strict';
 
-exports.__esModule = true;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
 exports.default = onClickOutsideHOC;
@@ -42,2 +47,4 @@
     function onClickOutside() {
+      var _ref;
+
       var _temp, _this, _ret;
@@ -51,3 +58,3 @@
 
-      return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.__outsideClickHandler = null, _this.enableOnClickOutside = function () {
+      return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = onClickOutside.__proto__ || Object.getPrototypeOf(onClickOutside)).call.apply(_ref, [this].concat(args))), _this), _this.__outsideClickHandler = null, _this.enableOnClickOutside = function () {
         var fn = _this.__outsideClickHandler;
@@ -80,157 +87,173 @@ if (fn && typeof document !== 'undefined') {
 
-    /**
-     * Access the WrappedComponent's instance.
-     */
-    onClickOutside.prototype.getInstance = function getInstance() {
-      if (!WrappedComponent.prototype.isReactComponent) {
-        return this;
+    _createClass(onClickOutside, [{
+      key: 'getInstance',
+
+
+      /**
+       * Access the WrappedComponent's instance.
+       */
+      value: function getInstance() {
+        if (!WrappedComponent.prototype.isReactComponent) {
+          return this;
+        }
+        var ref = this.instanceRef;
+        return ref.getInstance ? ref.getInstance() : ref;
       }
-      var ref = this.instanceRef;
-      return ref.getInstance ? ref.getInstance() : ref;
-    };
 
-    // this is given meaning in componentDidMount/componentDidUpdate
+      // this is given meaning in componentDidMount/componentDidUpdate
 
+    }, {
+      key: 'componentDidMount',
 
-    /**
-     * Add click listeners to the current document,
-     * linked to this component's state.
-     */
-    onClickOutside.prototype.componentDidMount = function componentDidMount() {
-      // If we are in an environment without a DOM such
-      // as shallow rendering or snapshots then we exit
-      // early to prevent any unhandled errors being thrown.
-      if (typeof document === 'undefined' || !document.createElement) {
-        return;
-      }
 
-      var instance = this.getInstance();
+      /**
+       * Add click listeners to the current document,
+       * linked to this component's state.
+       */
+      value: function componentDidMount() {
+        // If we are in an environment without a DOM such
+        // as shallow rendering or snapshots then we exit
+        // early to prevent any unhandled errors being thrown.
+        if (typeof document === 'undefined' || !document.createElement) {
+          return;
+        }
 
-      if (config && typeof config.handleClickOutside === 'function') {
-        this.__clickOutsideHandlerProp = config.handleClickOutside(instance);
-        if (typeof this.__clickOutsideHandlerProp !== 'function') {
-          throw new Error('WrappedComponent lacks a function for processing outside click events specified by the handleClickOutside config option.');
-        }
-      } else if (typeof instance.handleClickOutside === 'function') {
-        if (_react.Component.prototype.isPrototypeOf(instance)) {
-          this.__clickOutsideHandlerProp = instance.handleClickOutside.bind(instance);
+        var instance = this.getInstance();
+
+        if (config && typeof config.handleClickOutside === 'function') {
+          this.__clickOutsideHandlerProp = config.handleClickOutside(instance);
+          if (typeof this.__clickOutsideHandlerProp !== 'function') {
+            throw new Error('WrappedComponent lacks a function for processing outside click events specified by the handleClickOutside config option.');
+          }
+        } else if (typeof instance.handleClickOutside === 'function') {
+          if (_react.Component.prototype.isPrototypeOf(instance)) {
+            this.__clickOutsideHandlerProp = instance.handleClickOutside.bind(instance);
+          } else {
+            this.__clickOutsideHandlerProp = instance.handleClickOutside;
+          }
+        } else if (typeof instance.props.handleClickOutside === 'function') {
+          this.__clickOutsideHandlerProp = instance.props.handleClickOutside;
         } else {
-          this.__clickOutsideHandlerProp = instance.handleClickOutside;
+          throw new Error('WrappedComponent lacks a handleClickOutside(event) function for processing outside click events.');
         }
-      } else if (typeof instance.props.handleClickOutside === 'function') {
-        this.__clickOutsideHandlerProp = instance.props.handleClickOutside;
-      } else {
-        throw new Error('WrappedComponent lacks a handleClickOutside(event) function for processing outside click events.');
-      }
 
-      // TODO: try to get rid of this, could be done with function ref, might be problematic for SFC though, they do not expose refs
-      if ((0, _reactDom.findDOMNode)(instance) === null) {
-        return;
+        // TODO: try to get rid of this, could be done with function ref, might be problematic for SFC though, they do not expose refs
+        if ((0, _reactDom.findDOMNode)(instance) === null) {
+          return;
+        }
+
+        this.addOutsideClickHandler();
       }
 
-      this.addOutsideClickHandler();
-    };
+      /**
+      * Track for disableOnClickOutside props changes and enable/disable click outside
+      */
 
-    /**
-    * Track for disableOnClickOutside props changes and enable/disable click outside
-    */
+    }, {
+      key: 'componentWillReceiveProps',
+      value: function componentWillReceiveProps(nextProps) {
+        if (this.props.disableOnClickOutside && !nextProps.disableOnClickOutside) {
+          this.enableOnClickOutside();
+        } else if (!this.props.disableOnClickOutside && nextProps.disableOnClickOutside) {
+          this.disableOnClickOutside();
+        }
+      }
+    }, {
+      key: 'componentDidUpdate',
+      value: function componentDidUpdate() {
+        var componentNode = (0, _reactDom.findDOMNode)(this.getInstance());
 
+        if (componentNode === null && this.__outsideClickHandler) {
+          this.removeOutsideClickHandler();
+          return;
+        }
 
-    onClickOutside.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
-      if (this.props.disableOnClickOutside && !nextProps.disableOnClickOutside) {
-        this.enableOnClickOutside();
-      } else if (!this.props.disableOnClickOutside && nextProps.disableOnClickOutside) {
-        this.disableOnClickOutside();
+        if (componentNode !== null && !this.__outsideClickHandler) {
+          this.addOutsideClickHandler();
+          return;
+        }
       }
-    };
 
-    onClickOutside.prototype.componentDidUpdate = function componentDidUpdate() {
-      var componentNode = (0, _reactDom.findDOMNode)(this.getInstance());
+      /**
+       * Remove all document's event listeners for this component
+       */
 
-      if (componentNode === null && this.__outsideClickHandler) {
+    }, {
+      key: 'componentWillUnmount',
+      value: function componentWillUnmount() {
         this.removeOutsideClickHandler();
-        return;
       }
 
-      if (componentNode !== null && !this.__outsideClickHandler) {
-        this.addOutsideClickHandler();
-        return;
-      }
-    };
+      /**
+       * Can be called to explicitly enable event listening
+       * for clicks and touches outside of this element.
+       */
 
-    /**
-     * Remove all document's event listeners for this component
-     */
 
+      /**
+       * Can be called to explicitly disable event listening
+       * for clicks and touches outside of this element.
+       */
 
-    onClickOutside.prototype.componentWillUnmount = function componentWillUnmount() {
-      this.removeOutsideClickHandler();
-    };
+    }, {
+      key: 'addOutsideClickHandler',
+      value: function addOutsideClickHandler() {
+        var fn = this.__outsideClickHandler = (0, _generateOutsideCheck2.default)((0, _reactDom.findDOMNode)(this.getInstance()), this.__clickOutsideHandlerProp, this.props.outsideClickIgnoreClass, this.props.excludeScrollbar, this.props.preventDefault, this.props.stopPropagation);
 
-    /**
-     * Can be called to explicitly enable event listening
-     * for clicks and touches outside of this element.
-     */
+        var pos = registeredComponents.length;
+        registeredComponents.push(this);
+        handlers[pos] = fn;
 
+        // If there is a truthy disableOnClickOutside property for this
+        // component, don't immediately start listening for outside events.
+        if (!this.props.disableOnClickOutside) {
+          this.enableOnClickOutside();
+        }
+      }
+    }, {
+      key: 'removeOutsideClickHandler',
+      value: function removeOutsideClickHandler() {
+        this.disableOnClickOutside();
+        this.__outsideClickHandler = false;
 
-    /**
-     * Can be called to explicitly disable event listening
-     * for clicks and touches outside of this element.
-     */
+        var pos = registeredComponents.indexOf(this);
 
+        if (pos > -1) {
+          // clean up so we don't leak memory
+          if (handlers[pos]) {
+            handlers.splice(pos, 1);
+          }
+          registeredComponents.splice(pos, 1);
+        }
+      }
+    }, {
+      key: 'render',
 
-    onClickOutside.prototype.addOutsideClickHandler = function addOutsideClickHandler() {
-      var fn = this.__outsideClickHandler = (0, _generateOutsideCheck2.default)((0, _reactDom.findDOMNode)(this.getInstance()), this.__clickOutsideHandlerProp, this.props.outsideClickIgnoreClass, this.props.excludeScrollbar, this.props.preventDefault, this.props.stopPropagation);
 
-      var pos = registeredComponents.length;
-      registeredComponents.push(this);
-      handlers[pos] = fn;
+      /**
+       * Pass-through render
+       */
+      value: function render() {
+        var _this2 = this;
 
-      // If there is a truthy disableOnClickOutside property for this
-      // component, don't immediately start listening for outside events.
-      if (!this.props.disableOnClickOutside) {
-        this.enableOnClickOutside();
-      }
-    };
+        var props = Object.keys(this.props).filter(function (prop) {
+          return prop !== 'excludeScrollbar';
+        }).reduce(function (props, prop) {
+          props[prop] = _this2.props[prop];
+          return props;
+        }, {});
 
-    onClickOutside.prototype.removeOutsideClickHandler = function removeOutsideClickHandler() {
-      this.disableOnClickOutside();
-      this.__outsideClickHandler = false;
-
-      var pos = registeredComponents.indexOf(this);
-
-      if (pos > -1) {
-        // clean up so we don't leak memory
-        if (handlers[pos]) {
-          handlers.splice(pos, 1);
+        if (WrappedComponent.prototype.isReactComponent) {
+          props.ref = this.getRef;
+        } else {
+          props.wrappedRef = this.getRef;
         }
-        registeredComponents.splice(pos, 1);
-      }
-    };
 
-    /**
-     * Pass-through render
-     */
-    onClickOutside.prototype.render = function render() {
-      var _this2 = this;
+        props.disableOnClickOutside = this.disableOnClickOutside;
+        props.enableOnClickOutside = this.enableOnClickOutside;
 
-      var props = Object.keys(this.props).filter(function (prop) {
-        return prop !== 'excludeScrollbar';
-      }).reduce(function (props, prop) {
-        props[prop] = _this2.props[prop];
-        return props;
-      }, {});
-
-      if (WrappedComponent.prototype.isReactComponent) {
-        props.ref = this.getRef;
-      } else {
-        props.wrappedRef = this.getRef;
+        return (0, _react.createElement)(WrappedComponent, props);
       }
+    }]);
 
-      props.disableOnClickOutside = this.disableOnClickOutside;
-      props.enableOnClickOutside = this.enableOnClickOutside;
-
-      return (0, _react.createElement)(WrappedComponent, props);
-    };
-
     return onClickOutside;
@@ -237,0 +260,0 @@ }(_react.Component), _class.displayName = 'OnClickOutside(' + (WrappedComponent.displayName || WrappedComponent.name || 'Component') + ')', _class.defaultProps = {

package.json

 {
   "name": "react-onclickoutside",
-  "version": "6.3.1",
+  "version": "6.4.0",
   "description": "An onClickOutside wrapper for React components",
@@ -32,3 +32,3 @@ "main": "lib/index.js",
   "scripts": {
-    "build": "run-p build:*",
+    "build": "npm run build:es && npm run build:commonjs",
     "build:es": "cross-env BABEL_ENV=es babel src -d es",
@@ -38,3 +38,3 @@ "build:commonjs": "cross-env BABEL_ENV=commonjs babel src -d lib",
     "test": "run-s test:**",
-    "test:basic": "run-s lint build:commonjs",
+    "test:basic": "run-s lint build",
     "test:karma": "karma start test/karma.conf.js --single-run",
@@ -41,0 +41,0 @@ "test:nodom": "mocha test/no-dom-test.js",

README.md

@@ -11,17 +11,2 @@ # An onClickOutside wrapper for React components
 
-## Sections covered in this README
-
-- [Installation](#installation)
-- [Regulate which events to listen for](#regulate-which-events-to-listen-for)
-- [Regulate whether or not to listen for outside clicks](#regulate-whether-or-not-to-listen-for-outside-clicks)
-- [Regulate whether or not to listen to scrollbar clicks](#regulate-whether-or-not-to-listen-to-scrollbar-clicks)
-- [Regulating `evt.preventDefault()` and `evt.stopPropagation()`](#regulating-evtpreventdefault-and-evtstoppropagation)
-- [Marking elements as "skip over this one" during the event loop](#marking-elements-as-skip-over-this-one-during-the-event-loop)
-- [Older React code: "What happened to the Mixin??"](#older-react-code-what-happened-to-the-mixin)
-  * [But how can I access my component? It has an API that I rely on!](#but-how-can-i-access-my-component-it-has-an-api-that-i-rely-on)
-- [Which version do I need for which version of React?](#which-version-do-i-need-for-which-version-of-react)
-  * [Support-wise, only the latest version will receive updates and bug fixes.](#support-wise-only-the-latest-version-will-receive-updates-and-bug-fixes)
-- [IE does not support classList for SVG elements!](#ie-does-not-support-classlist-for-svg-elements)
-- [I can't find what I need in the README](#i-cant-find-what-i-need-in-the-readme)
-
 ## Installation
@@ -239,5 +224,1 @@
 Eventually this problem will stop being one, but in the mean time *you* are responsible for making *your* site work by shimming everything that needs shimming for IE.  As such, **if you file a PR to fix classList-and-SVG issues specifically for this library, your PR will be closed and I will politely point you to this README.md section**. I will not accept PRs to fix this issue. You already have the power to fix it, and I expect you to take responsibility as a fellow developer to shim what you need instead of getting obsolete quirks supported by libraries whose job isn't to support obsolete quirks.
-
-## I can't find what I need in the README
-
-If you've read the whole thing and you still can't find what you were looking for, then the README is missing important information that should be added in. Please [file an issue](issues) with a request for additional documentation, describing what you were hoping to find in enough detail that it can be used to write up the information you needed.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

38311

increased by43.61%

Number of package files

6

increased by50%

Lines of code

557

increased by113.41%

Worsened metrics

Number of lines in readme file

223

decreased by-7.85%

No dependency changes