react-portal - npm Package Compare versions

Comparing version 2.1.3 to 2.1.4

build/portal.js

@@ -94,2 +94,7 @@ 'use strict';
   }, {
+    key: 'shouldComponentUpdate',
+    value: function shouldComponentUpdate(nextProps, nextState) {
+      return (0, _shallowCompare2.default)(this, nextProps, nextState);
+    }
+  }, {
     key: 'componentWillUnmount',
@@ -109,31 +114,2 @@ value: function componentWillUnmount() {
   }, {
-    key: 'shouldComponentUpdate',
-    value: function shouldComponentUpdate(nextProps, nextState) {
-      return (0, _shallowCompare2.default)(this, nextProps, nextState);
-    }
-  }, {
-    key: 'renderPortal',
-    value: function renderPortal(props) {
-      if (!this.node) {
-        this.node = document.createElement('div');
-        if (props.className) {
-          this.node.className = props.className;
-        }
-        if (props.style) {
-          _CSSPropertyOperations2.default.setValueForStyles(this.node, props.style);
-        }
-        document.body.appendChild(this.node);
-      }
-      this.portal = _reactDom2.default.unstable_renderSubtreeIntoContainer(this, _react2.default.cloneElement(props.children, { closePortal: this.closePortal }), this.node, this.props.onUpdate);
-    }
-  }, {
-    key: 'render',
-    value: function render() {
-      if (this.props.openByClickOn) {
-        return _react2.default.cloneElement(this.props.openByClickOn, { onClick: this.handleWrapperClick });
-      } else {
-        return null;
-      }
-    }
-  }, {
     key: 'handleWrapperClick',
@@ -155,3 +131,2 @@ value: function handleWrapperClick(e) {
       this.renderPortal(props);
-
       this.props.onOpen(this.node);
@@ -210,2 +185,28 @@ }
     }
+  }, {
+    key: 'renderPortal',
+    value: function renderPortal(props) {
+      if (!this.node) {
+        this.node = document.createElement('div');
+        if (props.className) {
+          this.node.className = props.className;
+        }
+        if (props.style) {
+          // React 15.1.0+ requires third parameter in debug mode
+          /* eslint-disable no-underscore-dangle */
+          _CSSPropertyOperations2.default.setValueForStyles(this.node, props.style, this._reactInternalInstance);
+          /* eslint-enable no-underscore-dangle */
+        }
+        document.body.appendChild(this.node);
+      }
+      this.portal = _reactDom2.default.unstable_renderSubtreeIntoContainer(this, _react2.default.cloneElement(props.children, { closePortal: this.closePortal }), this.node, this.props.onUpdate);
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      if (this.props.openByClickOn) {
+        return _react2.default.cloneElement(this.props.openByClickOn, { onClick: this.handleWrapperClick });
+      }
+      return null;
+    }
   }]);
@@ -212,0 +213,0 @@

lib/portal.js

 import React from 'react';
-import ReactDOM, {findDOMNode} from 'react-dom';
+import ReactDOM, { findDOMNode } from 'react-dom';
 import CSSPropertyOperations from 'react/lib/CSSPropertyOperations';
@@ -7,3 +7,3 @@ import shallowCompare from 'react/lib/shallowCompare';
 const KEYCODES = {
-  ESCAPE: 27
+  ESCAPE: 27,
 };
@@ -15,3 +15,3 @@
     super();
-    this.state = {active: false};
+    this.state = { active: false };
     this.handleWrapperClick = this.handleWrapperClick.bind(this);
@@ -61,2 +61,6 @@ this.closePortal = this.closePortal.bind(this);
 
+  shouldComponentUpdate(nextProps, nextState) {
+    return shallowCompare(this, nextProps, nextState);
+  }
+
   componentWillUnmount() {
@@ -75,28 +79,2 @@ if (this.props.closeOnEsc) {
 
-  shouldComponentUpdate(nextProps, nextState) {
-    return shallowCompare(this, nextProps, nextState);
-  }
-
-  renderPortal(props) {
-    if (!this.node) {
-      this.node = document.createElement('div');
-      if (props.className) {
-        this.node.className = props.className;
-      }
-      if (props.style) {
-        CSSPropertyOperations.setValueForStyles(this.node, props.style);
-      }
-      document.body.appendChild(this.node);
-    }
-    this.portal = ReactDOM.unstable_renderSubtreeIntoContainer(this, React.cloneElement(props.children, {closePortal: this.closePortal}), this.node, this.props.onUpdate);
-  }
-
-  render() {
-    if (this.props.openByClickOn) {
-      return React.cloneElement(this.props.openByClickOn, {onClick: this.handleWrapperClick});
-    } else {
-      return null;
-    }
-  }
-
   handleWrapperClick(e) {
@@ -110,5 +88,4 @@ e.preventDefault();
   openPortal(props = this.props) {
-    this.setState({active: true});
+    this.setState({ active: true });
     this.renderPortal(props);
-
     this.props.onOpen(this.node);
@@ -126,3 +103,3 @@ }
       if (isUnmounted !== true) {
-        this.setState({active: false});
+        this.setState({ active: false });
       }
@@ -158,2 +135,32 @@ };
 
+  renderPortal(props) {
+    if (!this.node) {
+      this.node = document.createElement('div');
+      if (props.className) {
+        this.node.className = props.className;
+      }
+      if (props.style) {
+        // React 15.1.0+ requires third parameter in debug mode
+        /* eslint-disable no-underscore-dangle */
+        CSSPropertyOperations.setValueForStyles(this.node,
+                                                props.style,
+                                                this._reactInternalInstance);
+        /* eslint-enable no-underscore-dangle */
+      }
+      document.body.appendChild(this.node);
+    }
+    this.portal = ReactDOM.unstable_renderSubtreeIntoContainer(
+      this,
+      React.cloneElement(props.children, { closePortal: this.closePortal }),
+      this.node,
+      this.props.onUpdate
+    );
+  }
+
+  render() {
+    if (this.props.openByClickOn) {
+      return React.cloneElement(this.props.openByClickOn, { onClick: this.handleWrapperClick });
+    }
+    return null;
+  }
 }
@@ -172,3 +179,3 @@
   beforeClose: React.PropTypes.func,
-  onUpdate: React.PropTypes.func
+  onUpdate: React.PropTypes.func,
 };
@@ -179,3 +186,3 @@
   onClose: () => {},
-  onUpdate: () => {}
+  onUpdate: () => {},
 };

package.json

 {
   "name": "react-portal",
-  "version": "2.1.3",
+  "version": "2.1.4",
   "description": "React component for transportation of modals, lightboxes, loading bars... to document.body",
@@ -19,6 +19,6 @@ "main": "build/portal",
   "scripts": {
-    "start": "node devServer.js",
+    "start": "node devServerIndex.js",
     "build": "mkdir -p build && babel ./lib/portal.js --out-file ./build/portal.js",
     "build:examples": "npm run clean && npm run build:examples:webpack",
-    "build:examples:webpack": "cross-env NODE_ENV=production webpack --config webpack.config.prod.js",
+    "build:examples:webpack": "cross-env NODE_ENV=production webpack --config webpack.config.prod.babel.js",
     "clean": "rimraf build",
@@ -42,29 +42,32 @@ "test": "mocha",
   "devDependencies": {
-    "babel-cli": "^6.4.0",
-    "babel-core": "^6.4.0",
-    "babel-eslint": "^4.1.6",
+    "babel-cli": "^6.8.0",
+    "babel-core": "^6.8.0",
+    "babel-eslint": "^6.0.4",
     "babel-loader": "^6.2.1",
-    "babel-plugin-add-module-exports": "^0.1.2",
+    "babel-plugin-add-module-exports": "^0.2.1",
     "babel-preset-es2015": "^6.3.13",
     "babel-preset-react": "^6.3.13",
     "babel-preset-react-hmre": "^1.0.1",
-    "babel-register": "^6.3.13",
+    "babel-register": "^6.8.0",
     "cross-env": "^1.0.7",
-    "enzyme": "^2.2.0",
-    "eslint": "^1.10.3",
-    "eslint-plugin-react": "^3.14.0",
+    "enzyme": "^2.3.0",
+    "eslint": "^2.9.0",
+    "eslint-config-airbnb": "^9.0.1",
+    "eslint-plugin-import": "^1.8.0",
+    "eslint-plugin-jsx-a11y": "^1.2.0",
+    "eslint-plugin-react": "^5.1.1",
     "express": "^4.13.3",
-    "jsdom": "^7.2.2",
+    "jsdom": "^9.0.0",
     "mocha": "^2.3.4",
-    "mocha-eslint": "^1.0.0",
-    "react": "^15.0.1",
-    "react-addons-test-utils": "^15.0.1",
-    "react-dom": "^15.0.1",
+    "mocha-eslint": "^2.0.2",
+    "react": "^15.1.0",
+    "react-addons-test-utils": "^15.1.0",
+    "react-dom": "^15.1.0",
     "rimraf": "^2.5.0",
-    "sinon": "^1.17.2",
+    "sinon": "^1.17.4",
     "tween.js": "^16.3.1",
-    "webpack": "^1.12.11",
-    "webpack-dev-middleware": "^1.4.0",
+    "webpack": "^1.13.0",
+    "webpack-dev-middleware": "^1.6.1",
     "webpack-hot-middleware": "^2.6.0"
   }
 }

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Found 1 instance in 1 package

Fixed alerts

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1850292

0.4%

Lines of code

983

1.24%

Worsened metrics

Dev dependency count

29

11.54%

Number of low supply chain risk alerts

2

100%

No dependency changes