react-snuggle - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

dist/react-snuggle.cjs.js

@@ -11,2 +11,14 @@ 'use strict';
 
+var removeKeys = (function (blackList) {
+  return function (obj) {
+    var cleanObj = obj;
+
+    blackList.forEach(function (item) {
+      return Object.prototype.hasOwnProperty.call(cleanObj, item) && delete cleanObj[item];
+    });
+
+    return cleanObj;
+  };
+});
+
 var classCallCheck = function (instance, Constructor) {
@@ -86,2 +98,5 @@ if (!(instance instanceof Constructor)) {
 
+var blackListProps = ["rowGap", "columnWidth"];
+var removeBlackListed = removeKeys(blackListProps);
+
 var Snuggle = function (_React$PureComponent) {
@@ -195,4 +210,10 @@ inherits(Snuggle, _React$PureComponent);
       var renderChildren = React.Children.map(children, function (child) {
+        var itemProps = removeBlackListed(_extends({}, item.props, {
+          ref: refItem,
+          innerRef: refItem,
+          key: key()
+        }));
+
         if (item) {
-          return React.createElement(item.type, _extends({}, item.props, { ref: refItem, innerRef: refItem, key: key() }), child);
+          return React.createElement(item.type, itemProps, child);
         }
@@ -203,6 +224,8 @@
 
-      return React.createElement(container.type, _extends({}, container.props, compProps, {
+      var containerProps = removeBlackListed(_extends({}, container.props, compProps, {
         style: _extends({}, container.props.style, this.createGridStyle()),
         ref: refGrid
-      }), renderChildren);
+      }));
+
+      return React.createElement(container.type, containerProps, renderChildren);
     }
@@ -209,0 +232,0 @@ }]);

dist/react-snuggle.es.js

@@ -7,2 +7,14 @@ import { createElement, Children, PureComponent } from 'react';
 
+var removeKeys = (function (blackList) {
+  return function (obj) {
+    var cleanObj = obj;
+
+    blackList.forEach(function (item) {
+      return Object.prototype.hasOwnProperty.call(cleanObj, item) && delete cleanObj[item];
+    });
+
+    return cleanObj;
+  };
+});
+
 var classCallCheck = function (instance, Constructor) {
@@ -82,2 +94,5 @@ if (!(instance instanceof Constructor)) {
 
+var blackListProps = ["rowGap", "columnWidth"];
+var removeBlackListed = removeKeys(blackListProps);
+
 var Snuggle = function (_React$PureComponent) {
@@ -191,4 +206,10 @@ inherits(Snuggle, _React$PureComponent);
       var renderChildren = Children.map(children, function (child) {
+        var itemProps = removeBlackListed(_extends({}, item.props, {
+          ref: refItem,
+          innerRef: refItem,
+          key: key()
+        }));
+
         if (item) {
-          return createElement(item.type, _extends({}, item.props, { ref: refItem, innerRef: refItem, key: key() }), child);
+          return createElement(item.type, itemProps, child);
         }
@@ -199,6 +220,8 @@
 
-      return createElement(container.type, _extends({}, container.props, compProps, {
+      var containerProps = removeBlackListed(_extends({}, container.props, compProps, {
         style: _extends({}, container.props.style, this.createGridStyle()),
         ref: refGrid
-      }), renderChildren);
+      }));
+
+      return createElement(container.type, containerProps, renderChildren);
     }
@@ -205,0 +228,0 @@ }]);

dist/react-snuggle.js

@@ -11,2 +11,14 @@ (function (global, factory) {
 
+  var removeKeys = (function (blackList) {
+    return function (obj) {
+      var cleanObj = obj;
+
+      blackList.forEach(function (item) {
+        return Object.prototype.hasOwnProperty.call(cleanObj, item) && delete cleanObj[item];
+      });
+
+      return cleanObj;
+    };
+  });
+
   var classCallCheck = function (instance, Constructor) {
@@ -86,2 +98,5 @@ if (!(instance instanceof Constructor)) {
 
+  var blackListProps = ["rowGap", "columnWidth"];
+  var removeBlackListed = removeKeys(blackListProps);
+
   var Snuggle = function (_React$PureComponent) {
@@ -195,4 +210,10 @@ inherits(Snuggle, _React$PureComponent);
         var renderChildren = React.Children.map(children, function (child) {
+          var itemProps = removeBlackListed(_extends({}, item.props, {
+            ref: refItem,
+            innerRef: refItem,
+            key: key()
+          }));
+
           if (item) {
-            return React.createElement(item.type, _extends({}, item.props, { ref: refItem, innerRef: refItem, key: key() }), child);
+            return React.createElement(item.type, itemProps, child);
           }
@@ -203,6 +224,8 @@
 
-        return React.createElement(container.type, _extends({}, container.props, compProps, {
+        var containerProps = removeBlackListed(_extends({}, container.props, compProps, {
           style: _extends({}, container.props.style, this.createGridStyle()),
           ref: refGrid
-        }), renderChildren);
+        }));
+
+        return React.createElement(container.type, containerProps, renderChildren);
       }
@@ -209,0 +232,0 @@ }]);

dist/react-snuggle.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t(e.ContentLoader={},e.React)}(this,function(e,f){"use strict";var t=function(){function r(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(e,t,n){return t&&r(e.prototype,t),n&&r(e,n),e}}(),s=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},l=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t},n=function(e){function a(){var e,t,o;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,a);for(var n=arguments.length,r=Array(n),i=0;i<n;i++)r[i]=arguments[i];return(t=o=l(this,(e=a.__proto__||Object.getPrototypeOf(a)).call.apply(e,[this].concat(r)))).reposition=!1,o.elements=[],o.grid=null,o.getRef=function(e){e&&e.firstElementChild&&o.elements.push(e)},o.setValues=function(){var e=o.props.rowGap,r=void 0===e?0:e;0!==o.elements.length&&(o.elements.forEach(function(e){var t=e;if(t&&t.firstElementChild){var n=t.firstElementChild.getBoundingClientRect().height;t.style.gridRowEnd="span "+Math.ceil((n+r)/r)}return null}),o.reposition||(window.requestAnimationFrame(o.setValues),o.reposition=!0))},o.onLoadImages=function(){if(o.grid){var e=o.grid.getElementsByTagName("img");Array.from(e).forEach(function(e){e.onload=function(){o.setValues()}})}},o.createGridStyle=function(){var e=o.props,t=e.rowGap,n=e.columnWidth;return{display:"grid",gridGap:(void 0===t?0:t)+"px",gridTemplateColumns:"repeat(auto-fill, minmax("+(void 0===n?0:n)+"px, 1fr))"}},l(o,t)}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(a,f.PureComponent),t(a,[{key:"componentDidMount",value:function(){this.setValues(),this.onLoadImages()}},{key:"componentDidUpdate",value:function(){this.setValues()}},{key:"render",value:function(){var t=this,e=this.props,n=e.children,r=e.item,o=void 0===r?f.createElement("div"):r,i=e.container,a=void 0===i?f.createElement("div"):i,l=function(e,t){var n={};for(var r in e)t.indexOf(r)<0&&Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}(e,["children","item","container"]);if(!(0<f.Children.count(n)))return null;var u=function(e){t.getRef(e)},c=f.Children.map(n,function(e){return o?f.createElement(o.type,s({},o.props,{ref:u,innerRef:u,key:Math.random().toString(36).substring(2)}),e):null});return f.createElement(a.type,s({},a.props,l,{style:s({},a.props.style,this.createGridStyle()),ref:function(e){t.grid=e}}),c)}}]),a}();n.defaultProps={rowGap:20,columnWidth:250,container:f.createElement("div"),item:f.createElement("div")},e.default=n,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t(e.ContentLoader={},e.React)}(this,function(e,s){"use strict";var n,t=function(){function r(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(e,t,n){return t&&r(e.prototype,t),n&&r(e,n),e}}(),p=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},l=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t},d=(n=["rowGap","columnWidth"],function(e){var t=e;return n.forEach(function(e){return Object.prototype.hasOwnProperty.call(t,e)&&delete t[e]}),t}),r=function(e){function a(){var e,t,o;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,a);for(var n=arguments.length,r=Array(n),i=0;i<n;i++)r[i]=arguments[i];return(t=o=l(this,(e=a.__proto__||Object.getPrototypeOf(a)).call.apply(e,[this].concat(r)))).reposition=!1,o.elements=[],o.grid=null,o.getRef=function(e){e&&e.firstElementChild&&o.elements.push(e)},o.setValues=function(){var e=o.props.rowGap,r=void 0===e?0:e;0!==o.elements.length&&(o.elements.forEach(function(e){var t=e;if(t&&t.firstElementChild){var n=t.firstElementChild.getBoundingClientRect().height;t.style.gridRowEnd="span "+Math.ceil((n+r)/r)}return null}),o.reposition||(window.requestAnimationFrame(o.setValues),o.reposition=!0))},o.onLoadImages=function(){if(o.grid){var e=o.grid.getElementsByTagName("img");Array.from(e).forEach(function(e){e.onload=function(){o.setValues()}})}},o.createGridStyle=function(){var e=o.props,t=e.rowGap,n=e.columnWidth;return{display:"grid",gridGap:(void 0===t?0:t)+"px",gridTemplateColumns:"repeat(auto-fill, minmax("+(void 0===n?0:n)+"px, 1fr))"}},l(o,t)}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(a,s.PureComponent),t(a,[{key:"componentDidMount",value:function(){this.setValues(),this.onLoadImages()}},{key:"componentDidUpdate",value:function(){this.setValues()}},{key:"render",value:function(){var t=this,e=this.props,n=e.children,r=e.item,o=void 0===r?s.createElement("div"):r,i=e.container,a=void 0===i?s.createElement("div"):i,l=function(e,t){var n={};for(var r in e)t.indexOf(r)<0&&Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}(e,["children","item","container"]);if(!(0<s.Children.count(n)))return null;var u=function(e){t.getRef(e)},c=s.Children.map(n,function(e){var t=d(p({},o.props,{ref:u,innerRef:u,key:Math.random().toString(36).substring(2)}));return o?s.createElement(o.type,t,e):null}),f=d(p({},a.props,l,{style:p({},a.props.style,this.createGridStyle()),ref:function(e){t.grid=e}}));return s.createElement(a.type,f,c)}}]),a}();r.defaultProps={rowGap:20,columnWidth:250,container:s.createElement("div"),item:s.createElement("div")},e.default=r,Object.defineProperty(e,"__esModule",{value:!0})});

package.json

 {
   "name": "react-snuggle",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "Simple masonry-like css-based React Component",
@@ -5,0 +5,0 @@ "keywords": [

src/index.js

@@ -5,2 +5,3 @@ // @flow
 import key from "./uid"
+import removeKeys from "./removeKeys"
 
@@ -15,2 +16,5 @@ type PropType = {
 
+const blackListProps = ["rowGap", "columnWidth"]
+const removeBlackListed = removeKeys(blackListProps)
+
 class Snuggle extends React.PureComponent<PropType> {
@@ -119,8 +123,11 @@ static defaultProps = {
     const renderChildren = React.Children.map(children, (child: React.Node) => {
+      const itemProps = removeBlackListed({
+        ...item.props,
+        ref: refItem,
+        innerRef: refItem,
+        key: key()
+      })
+
       if (item) {
-        return React.createElement(
-          item.type,
-          { ...item.props, ref: refItem, innerRef: refItem, key: key() },
-          child
-        )
+        return React.createElement(item.type, itemProps, child)
       }
@@ -131,12 +138,10 @@
 
-    return React.createElement(
-      container.type,
-      {
-        ...container.props,
-        ...compProps,
-        style: { ...container.props.style, ...this.createGridStyle() },
-        ref: refGrid
-      },
-      renderChildren
-    )
+    const containerProps = removeBlackListed({
+      ...container.props,
+      ...compProps,
+      style: { ...container.props.style, ...this.createGridStyle() },
+      ref: refGrid
+    })
+
+    return React.createElement(container.type, containerProps, renderChildren)
   }
@@ -143,0 +148,0 @@ }

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

319102

increased by0.71%

Number of package files

20

increased by5.26%

Lines of code

1027

increased by6.54%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes