react-popout - npm Package Compare versions

Comparing version 0.5.1 to 0.5.2

_webpack.demo.config.js

@@ -9,15 +9,14 @@ module.exports = {
     contentBase: './demo',
-    hot: true,
-    inline: true
+    hot: true
   },
   module: {
     loaders: [{
-      test: /\.(js|jsx)$/,
+      test: /\.j(s|sx)$/,
       exclude: /node_modules/,
       loader: 'babel',
       query: {
-        stage: 0
+        presets: ['es2015', 'stage-0', 'react']
       }
     }]
-  }
+  },
 };

_webpack.dist.config.js

@@ -10,7 +10,7 @@ module.exports = {
     loaders: [{
-      test: /\.(js|jsx)$/,
+      test: /\.j(s|sx)$/,
       exclude: /node_modules/,
       loader: 'babel',
       query: {
-        stage: 0
+        presets: ['es2015', 'stage-0', 'react']
       }
@@ -17,0 +17,0 @@ }]

demo/demo.jsx

 import React from 'react';
-import ReactDOM from 'react-dom';
-import domready from 'domready';
 import Popout from '../lib/react-popout.jsx';
@@ -5,0 +3,0 @@

demo/demo2.jsx

 import React from 'react';
-import ReactDOM from 'react-dom';
-import domready from 'domready';
 import Popout from '../lib/react-popout.jsx';
@@ -5,0 +3,0 @@

demo/demo3.jsx

 import React from 'react';
-import ReactDOM from 'react-dom';
-import domready from 'domready';
 import Popout from '../lib/react-popout.jsx';
@@ -5,0 +3,0 @@

demo/exampleContainer.jsx

 import React from 'react';
 import ReactDOM from 'react-dom';
-import domready from 'domready';
-import Popout from '../lib/react-popout.jsx';
 import Example from './demo.jsx';
@@ -11,3 +9,2 @@ import Example2 from './demo2.jsx';
   render() {
-
     return (
@@ -25,6 +22,4 @@ <div>
 
-domready(() => {
-  var container = document.createElement('div');
-  document.body.appendChild(container);
-  ReactDOM.render(<ExampleContainer />, container);
-});
+const container = document.createElement('div');
+document.body.appendChild(container);
+ReactDOM.render(<ExampleContainer />, container);

dist/react-popout.min.js

@@ -1,1 +0,1 @@
-!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e(require("react"),require("react-dom"));else if("function"==typeof define&&define.amd)define(["react","react-dom"],e);else{var n="object"==typeof exports?e(require("react"),require("react-dom")):e(t.React,t.ReactDOM);for(var o in n)("object"==typeof exports?exports:t)[o]=n[o]}}(this,function(t,e){return function(t){function e(o){if(n[o])return n[o].exports;var r=n[o]={exports:{},id:o,loaded:!1};return t[o].call(r.exports,r,r.exports,e),r.loaded=!0,r.exports}var n={};return e.m=t,e.c=n,e.p="",e(0)}([function(t,e,n){t.exports=n(1)},function(t,e,n){"use strict";function o(t){return t&&t.__esModule?t:{"default":t}}function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0});var c=function(){function t(t,e){for(var n=0;n<e.length;n++){var o=e[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}return function(e,n,o){return n&&t(e.prototype,n),o&&t(e,o),e}}(),u=function(t,e,n){for(var o=!0;o;){var r=t,i=e,c=n;o=!1,null===r&&(r=Function.prototype);var u=Object.getOwnPropertyDescriptor(r,i);if(void 0!==u){if("value"in u)return u.value;var l=u.get;if(void 0===l)return;return l.call(c)}var p=Object.getPrototypeOf(r);if(null===p)return;t=p,e=i,n=c,o=!0,u=p=void 0}},l=n(2),p=o(l),a=n(3),s=o(a),f=n(4),d=o(f),y=(0,d["default"])(),b="popout-content-container",h=function(t){function e(t){r(this,e),u(Object.getPrototypeOf(e.prototype),"constructor",this).call(this,t),this.defaultOptions={toolbar:"no",location:"no",directories:"no",status:"no",menubar:"no",scrollbars:"yes",resizable:"yes",width:500,height:400,top:function(t,e){return(e.innerHeight-t.height)/2+e.screenY},left:function(t,e){return(e.innerWidth-t.width)/2+e.screenX}},this.state={openedWindow:null},this.closeWindow=this.closeWindow.bind(this)}return i(e,t),c(e,null,[{key:"propTypes",value:{title:p["default"].PropTypes.string.isRequired,url:p["default"].PropTypes.string,onClosing:p["default"].PropTypes.func,options:p["default"].PropTypes.object,window:p["default"].PropTypes.object,containerId:p["default"].PropTypes.string},enumerable:!0}]),c(e,[{key:"componentWillReceiveProps",value:function(t){t.containerId&&(b=t.containerId)}},{key:"componentWillUnmount",value:function(){this.closeWindow()}},{key:"componentDidMount",value:function(){var t=this,e=void 0,n=void 0,o=y({},this.defaultOptions,this.props.options),r=this.props.window||window,i={update:function(t){s["default"].render(t,n)},close:function(){e&&e.close()}};if(r){var c=function(){var e=[];for(var n in o)o.hasOwnProperty(n)&&e.push(n+"="+("function"==typeof o[n]?o[n].call(t,o,r):o[n]));return e.join(",")};e=r.open(this.props.url||"about:blank",this.props.title,c()),e.onbeforeunload=function(){n&&s["default"].unmountComponentAtNode(n),t.windowClosing()},r.addEventListener("unload",this.closeWindow);var u=function(){if(n){if(e.document.getElementById(b))return;s["default"].unmountComponentAtNode(n),n=null}e.document.title=t.props.title,n=e.document.createElement("div"),n.id=b,e.document.body.appendChild(n),s["default"].render(t.props.children,n)};e.onload=u,"complete"===e.document.readyState&&u(),this.setState({openedWindow:i})}}},{key:"closeWindow",value:function(){this.state.openedWindow&&this.state.openedWindow.close(),(this.props.window||window).removeEventListener("unload",this.closeWindow)}},{key:"windowClosing",value:function(){this.props.onClosing&&this.props.onClosing()}},{key:"componentDidUpdate",value:function(){this.state.openedWindow&&this.state.openedWindow.update(this.props.children)}},{key:"render",value:function(){return p["default"].createElement("div",null)}}]),e}(p["default"].Component);e["default"]=h,t.exports=e["default"]},function(e,n){e.exports=t},function(t,n){t.exports=e},function(t,e,n){"use strict";var o=n(5),r=function(){if(!Object.assign)return!1;for(var t="abcdefghijklmnopqrst",e=t.split(""),n={},o=0;o<e.length;++o)n[e[o]]=e[o];var r=Object.assign({},n),i="";for(var c in r)i+=c;return t!==i},i=function(){if(!Object.assign||!Object.preventExtensions)return!1;var t=Object.preventExtensions({1:2});try{Object.assign(t,"xy")}catch(e){return"y"===t[1]}};t.exports=function(){return Object.assign?r()?o:i()?o:Object.assign:o}},function(t,e,n){"use strict";var o=n(6),r=n(8),i=function(t){return"undefined"!=typeof t&&null!==t},c=n(10)(),u=Object,l=r.call(Function.call,Array.prototype.push),p=r.call(Function.call,Object.prototype.propertyIsEnumerable);t.exports=function(t,e){if(!i(t))throw new TypeError("target must be an object");var n,r,a,s,f,d,y,b=u(t);for(n=1;n<arguments.length;++n){if(r=u(arguments[n]),s=o(r),c&&Object.getOwnPropertySymbols)for(f=Object.getOwnPropertySymbols(r),a=0;a<f.length;++a)y=f[a],p(r,y)&&l(s,y);for(a=0;a<s.length;++a)y=s[a],d=r[y],p(r,y)&&(b[y]=d)}return b}},function(t,e,n){"use strict";var o=Object.prototype.hasOwnProperty,r=Object.prototype.toString,i=Array.prototype.slice,c=n(7),u=!{toString:null}.propertyIsEnumerable("toString"),l=function(){}.propertyIsEnumerable("prototype"),p=["toString","toLocaleString","valueOf","hasOwnProperty","isPrototypeOf","propertyIsEnumerable","constructor"],a=function(t){var e=t.constructor;return e&&e.prototype===t},s={$console:!0,$frame:!0,$frameElement:!0,$frames:!0,$parent:!0,$self:!0,$webkitIndexedDB:!0,$webkitStorageInfo:!0,$window:!0},f=function(){if("undefined"==typeof window)return!1;for(var t in window)try{if(!s["$"+t]&&o.call(window,t)&&null!==window[t]&&"object"==typeof window[t])try{a(window[t])}catch(e){return!0}}catch(e){return!0}return!1}(),d=function(t){if("undefined"==typeof window||!f)return a(t);try{return a(t)}catch(e){return!1}},y=function(t){var e=null!==t&&"object"==typeof t,n="[object Function]"===r.call(t),i=c(t),a=e&&"[object String]"===r.call(t),s=[];if(!e&&!n&&!i)throw new TypeError("Object.keys called on a non-object");var f=l&&n;if(a&&t.length>0&&!o.call(t,0))for(var y=0;y<t.length;++y)s.push(String(y));if(i&&t.length>0)for(var b=0;b<t.length;++b)s.push(String(b));else for(var h in t)f&&"prototype"===h||!o.call(t,h)||s.push(String(h));if(u)for(var v=d(t),w=0;w<p.length;++w)v&&"constructor"===p[w]||!o.call(t,p[w])||s.push(p[w]);return s};y.shim=function(){if(Object.keys){var t=function(){return 2===(Object.keys(arguments)||"").length}(1,2);if(!t){var e=Object.keys;Object.keys=function(t){return e(c(t)?i.call(t):t)}}}else Object.keys=y;return Object.keys||y},t.exports=y},function(t,e){"use strict";var n=Object.prototype.toString;t.exports=function(t){var e=n.call(t),o="[object Arguments]"===e;return o||(o="[object Array]"!==e&&null!==t&&"object"==typeof t&&"number"==typeof t.length&&t.length>=0&&"[object Function]"===n.call(t.callee)),o}},function(t,e,n){var o=n(9);t.exports=Function.prototype.bind||o},function(t,e){var n="Function.prototype.bind called on incompatible ",o=Array.prototype.slice,r=Object.prototype.toString,i="[object Function]";t.exports=function(t){var e=this;if("function"!=typeof e||r.call(e)!==i)throw new TypeError(n+e);for(var c,u=o.call(arguments,1),l=function(){if(this instanceof c){var n=e.apply(this,u.concat(o.call(arguments)));return Object(n)===n?n:this}return e.apply(t,u.concat(o.call(arguments)))},p=Math.max(0,e.length-u.length),a=[],s=0;p>s;s++)a.push("$"+s);if(c=Function("binder","return function ("+a.join(",")+"){ return binder.apply(this,arguments); }")(l),e.prototype){var f=function(){};f.prototype=e.prototype,c.prototype=new f,f.prototype=null}return c}},function(t,e,n){"use strict";var o=n(6);t.exports=function(){if("function"!=typeof Symbol||"function"!=typeof Object.getOwnPropertySymbols)return!1;if("symbol"==typeof Symbol.iterator)return!0;var t={},e=Symbol("test");if("string"==typeof e)return!1;var n=42;t[e]=n;for(e in t)return!1;if(0!==o(t).length)return!1;if("function"==typeof Object.keys&&0!==Object.keys(t).length)return!1;if("function"==typeof Object.getOwnPropertyNames&&0!==Object.getOwnPropertyNames(t).length)return!1;var r=Object.getOwnPropertySymbols(t);if(1!==r.length||r[0]!==e)return!1;if(!Object.prototype.propertyIsEnumerable.call(t,e))return!1;if("function"==typeof Object.getOwnPropertyDescriptor){var i=Object.getOwnPropertyDescriptor(t,e);if(i.value!==n||i.enumerable!==!0)return!1}return!0}}])});
+!function(e,o){if("object"==typeof exports&&"object"==typeof module)module.exports=o();else if("function"==typeof define&&define.amd)define([],o);else{var t=o();for(var r in t)("object"==typeof exports?exports:e)[r]=t[r]}}(this,function(){return function(e){function o(r){if(t[r])return t[r].exports;var n=t[r]={exports:{},id:r,loaded:!1};return e[r].call(n.exports,n,n.exports,o),n.loaded=!0,n.exports}var t={};return o.m=e,o.c=t,o.p="",o(0)}([function(e,o,t){!function(){throw new Error('Cannot find module "./lib/react-popout.jsx"')}()}])});

lib/react-popout.jsx

@@ -1,8 +0,5 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import getAssign from 'object.assign/polyfill';
-const assign = getAssign()
+import React        from 'react';
+import ReactDOM     from 'react-dom';
+const _CONTAINER_ID = Symbol('container_id');
 
-let CONTAINER_ID = 'popout-content-container';
-
 /**
@@ -22,6 +19,25 @@ * @class PopoutWindow
     window: React.PropTypes.object,
-    containerId: React.PropTypes.string
-  }
+    containerId: React.PropTypes.string,
+    children: React.PropTypes.element
+  };
 
-	/**
+  state = {
+    openedWindow: null
+  };
+
+  defaultOptions = {
+    toolbar: 'no',
+    location: 'no',
+    directories: 'no',
+    status: 'no',
+    menubar: 'no',
+    scrollbars: 'yes',
+    resizable: 'yes',
+    width: 500,
+    height: 400,
+    top: (o, w) => ((w.innerHeight - o.height) / 2) + w.screenY,
+    left: (o, w) => ((w.innerWidth - o.width) / 2) + w.screenX
+  };
+
+  /**
    * @constructs PoppoutWindow
@@ -32,21 +48,4 @@ * @param props
     super(props);
-
-    this.defaultOptions = {
-      toolbar: 'no',
-      location: 'no',
-      directories: 'no',
-      status: 'no',
-      menubar: 'no',
-      scrollbars: 'yes',
-      resizable: 'yes',
-      width: 500,
-      height: 400,
-      top: (o, w) => ((w.innerHeight - o.height) / 2) + w.screenY,
-      left: (o, w) => ((w.innerWidth - o.width) / 2) + w.screenX
-    };
-
-    this.state = {
-      openedWindow: null
-    };
-    this.closeWindow = this.closeWindow.bind(this)
+    this[_CONTAINER_ID] = props.containerId || 'popout-content-container';
+    this.closeWindow = this.closeWindow.bind(this);
   }
@@ -59,3 +58,3 @@
   componentWillReceiveProps(props){
-    props.containerId && (CONTAINER_ID = props.containerId);
+    props.containerId && (this[_CONTAINER_ID] = props.containerId);
   }
@@ -71,3 +70,3 @@
 
-    const options      = assign({}, this.defaultOptions, this.props.options),
+    const options      = Object.assign({}, this.defaultOptions, this.props.options),
           ownerWindow  = this.props.window || window,
@@ -112,3 +111,3 @@ openedWindow = {
       if (container){
-        if (popoutWindow.document.getElementById(CONTAINER_ID)) return;
+        if (popoutWindow.document.getElementById(this[_CONTAINER_ID])) return;
 
@@ -121,3 +120,3 @@ ReactDOM.unmountComponentAtNode(container);
       container = popoutWindow.document.createElement('div');
-      container.id = CONTAINER_ID;
+      container.id = this[_CONTAINER_ID];
       popoutWindow.document.body.appendChild(container);
@@ -153,5 +152,5 @@
   render(){
-    return <div />;
+    return <div></div>;
   }
 
 }

package.json

 {
   "name": "react-popout",
-  "version": "0.5.1",
+  "version": "0.5.2",
   "description": "Wraps window.open in a react component, allowing the contents to be part of your react render tree",
@@ -29,10 +29,13 @@ "main": "dist/react-popout.min.js",
   "devDependencies": {
-    "babel": "^5.8.23",
-    "babel-core": "^5.8.33",
-    "babel-eslint": "^3.1.10",
-    "babel-loader": "^5.1.3",
-    "babel-runtime": "^5.4.7",
-    "domready": "^1.0.8",
-    "eslint": "^0.22.1",
-    "eslint-plugin-react": "^2.4.0",
+    "babel": "^6.5.2",
+    "babel-cli": "^6.7.5",
+    "babel-core": "^6.7.6",
+    "babel-eslint": "^6.0.2",
+    "babel-loader": "^6.2.4",
+    "babel-preset-es2015": "^6.6.0",
+    "babel-preset-react": "^6.5.0",
+    "babel-preset-stage-0": "^6.5.0",
+    "babel-runtime": "^6.6.1",
+    "eslint": "^2.8.0",
+    "eslint-plugin-react": "^5.0.1",
     "karma": "^0.12.35",
@@ -50,6 +53,5 @@ "karma-chrome-launcher": "^0.1.12",
   "dependencies": {
-    "object.assign": "^4.0.3",
-    "react": "^0.14.2",
-    "react-dom": "^0.14.2"
+    "react": "^0.14.8",
+    "react-dom": "^0.14.8"
   }
 }

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

Uses eval

Supply chain risk

Package uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

223111

691.06%

Dependency count

2

-33.33%

Number of package files

21

5%

Lines of code

1122

186.22%

Number of low quality alerts

2

-33.33%

Worsened metrics

Dev dependency count

21

16.67%

Dependency changes

• - Removed

  object.assign@^4.0.3

• - Removed

  call-bind@1.0.8
  (transitive)

• - Removed

  call-bind-apply-helpers@1.0.2
  (transitive)

• - Removed

  call-bound@1.0.4
  (transitive)

• - Removed

  define-data-property@1.1.4
  (transitive)

• - Removed

  define-properties@1.2.1
  (transitive)

• - Removed

  dunder-proto@1.0.1
  (transitive)

• - Removed

  es-define-property@1.0.1
  (transitive)

• - Removed

  es-errors@1.3.0
  (transitive)

• - Removed

  es-object-atoms@1.1.1
  (transitive)

• - Removed

  function-bind@1.1.2
  (transitive)

• - Removed

  get-intrinsic@1.3.0
  (transitive)

• - Removed

  get-proto@1.0.1
  (transitive)

• - Removed

  gopd@1.2.0
  (transitive)

• - Removed

  has-property-descriptors@1.0.2
  (transitive)

• - Removed

  has-symbols@1.1.0
  (transitive)

• - Removed

  hasown@2.0.2
  (transitive)

• - Removed

  math-intrinsics@1.1.0
  (transitive)

• - Removed

  object-keys@1.1.1
  (transitive)

• - Removed

  object.assign@4.1.7
  (transitive)

• - Removed

  set-function-length@1.2.2
  (transitive)

• Updated

  react@^0.14.8

• Updated

  react-dom@^0.14.8