react-responsive-masonry - npm Package Compare versions

Comparing version 2.2.2 to 2.3.0

lib/index.js

 "use strict";
 
-exports.__esModule = true;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ResponsiveMasonry", {
+  enumerable: true,
+  get: function get() {
+    return _ResponsiveMasonry["default"];
+  }
+});
 exports["default"] = void 0;
@@ -5,0 +13,0 @@

lib/Masonry/index.js

 "use strict";
 
-exports.__esModule = true;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports["default"] = void 0;
@@ -49,7 +51,10 @@
   _proto.renderColumns = function renderColumns() {
-    var gutter = this.props.gutter;
+    var _this$props2 = this.props,
+        gutter = _this$props2.gutter,
+        itemTag = _this$props2.itemTag,
+        itemStyle = _this$props2.itemStyle;
     return this.getColumns().map(function (column, i) {
-      return /*#__PURE__*/_react["default"].createElement("div", {
+      return _react["default"].createElement(itemTag, {
         key: i,
-        style: {
+        style: _extends({
           display: "flex",
@@ -62,3 +67,3 @@ flexDirection: "column",
           gap: gutter
-        }
+        }, itemStyle)
       }, column.map(function (item) {
@@ -71,7 +76,8 @@ return item;
   _proto.render = function render() {
-    var _this$props2 = this.props,
-        gutter = _this$props2.gutter,
-        className = _this$props2.className,
-        style = _this$props2.style;
-    return /*#__PURE__*/_react["default"].createElement("div", {
+    var _this$props3 = this.props,
+        gutter = _this$props3.gutter,
+        className = _this$props3.className,
+        style = _this$props3.style,
+        containerTag = _this$props3.containerTag;
+    return _react["default"].createElement(containerTag, {
       style: _extends({
@@ -98,3 +104,6 @@ display: "flex",
   className: _propTypes["default"].string,
-  style: _propTypes["default"].object
+  style: _propTypes["default"].object,
+  containerTag: _propTypes["default"].string,
+  itemTag: _propTypes["default"].string,
+  itemStyle: _propTypes["default"].object
 } : {};
@@ -105,3 +114,6 @@ Masonry.defaultProps = {
   className: null,
-  style: {}
+  style: {},
+  containerTag: "div",
+  itemTag: "div",
+  itemStyle: {}
 };
@@ -108,0 +120,0 @@ var _default = Masonry;

lib/ResponsiveMasonry/index.js

 "use strict";
 
-exports.__esModule = true;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports["default"] = void 0;
@@ -33,3 +35,3 @@
 
-  var _useState2 = (0, _react.useState)(window ? window.innerWidth : 0),
+  var _useState2 = (0, _react.useState)(typeof window !== "undefined" ? window.innerWidth : 0),
       width = _useState2[0],
@@ -36,0 +38,0 @@ setWidth = _useState2[1];

package.json

 {
   "name": "react-responsive-masonry",
-  "version": "2.2.2",
+  "version": "2.3.0",
   "author": {
@@ -30,3 +30,4 @@ "name": "Cédric Delpoux",
   "scripts": {
-    "build": "NODE_OPTIONS=--openssl-legacy-provider nwb build-react-component",
+    "openssl:legacy": "NODE_OPTIONS=--openssl-legacy-provider",
+    "build": "yarn run openssl:legacy nwb build-react-component",
     "clean": "nwb clean-module && nwb clean-demo",
@@ -36,3 +37,3 @@ "deploy": "gh-pages -d demo/dist",
     "prepublish": "yarn run clean && yarn run build",
-    "start": "nwb serve-react-demo --port 1190",
+    "start": "yarn run openssl:legacy nwb serve-react-demo --port 1190",
     "test": "jest --colors --no-cache",
@@ -42,5 +43,2 @@ "test:watch": "yarn test -- --watch",
   },
-  "dependencies": {
-    "caniuse-lite": "^1.0.30001638"
-  },
   "devDependencies": {
@@ -47,0 +45,0 @@ "@babel/core": "^7.16.0",

README.md

@@ -88,2 +88,5 @@ # react-responsive-masonry
 | gutter       | String   | Margin surrounding each item e.g. "10px" or "1.5rem"  | "0"     |
+| containerTag | String   | Tag name of the container element                     | "div"   |
+| itemTag      | String   | Tag name of the item element                          | "div"   |
+| itemStyle    | Object   | Style object applied to each item                     | {}      |
 
@@ -90,0 +93,0 @@ ### ResponsiveMasonry component

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

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

Fixed 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

Improved metrics

Total package byte prevSize

54377

increased by248.68%

Dependency count

0

decreased by-100%

Number of package files

12

increased by100%

Lines of code

689

increased by280.66%

Number of lines in readme file

124

increased by2.48%

Worsened metrics

Number of low quality alerts

1

increased byInfinity%

Number of low supply chain risk alerts

4

increased by100%

Dependency changes

• - Removedcaniuse-lite@^1.0.30001638

• - Removedcaniuse-lite@1.0.30001702(transitive)