Socket
Socket
Sign inDemoInstall

react-portal

Package Overview
Dependencies
Maintainers
1
Versions
51
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-portal - npm Package Compare versions

Comparing version 2.1.3 to 2.1.4

61

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 @@

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: () => {},
};
{
"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"
}
}

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc