react-bem-grid - npm Package Compare versions

Comparing version 0.0.13 to 0.0.14

dist/Col-styles.js

@@ -17,8 +17,14 @@ 'use strict';
 
-var styles = {
+var basicBreakpoint = {
+  'flex-grow': 1,
+  'flex-basis': 0,
+  'max-width': '100%'
+};
+
+var initStyles = {
   col: {
     'box-sizing': 'border-box',
-    'flex': '0 0 auto',
-    'padding-right': _stylesSpec.gutter.replace(/rem/, '') / 4 + 'rem',
-    'padding-left': _stylesSpec.gutter.replace(/rem/, '') / 4 + 'rem'
+    flex: '0 0 auto',
+    paddingRight: _stylesSpec.gutter.replace(/rem/, '') / -4,
+    paddingLeft: _stylesSpec.gutter.replace(/rem/, '') / -4
   },
@@ -29,51 +35,30 @@ reverse: {
 };
-var _size = function _size(i) {
-  return Number(100 / _stylesSpec.columns * i).toFixed(4);
+
+var hydrateBasicBreakpoint = function hydrateBasicBreakpoint(breakpoint) {
+  return _defineProperty({}, breakpoint, basicBreakpoint);
 };
 
-var helpers = {
-  basic: {
-    'flex-grow': 1,
-    'flex-basis': 0,
-    'max-width': '100%'
-  },
-  size: function size(i) {
-    return {
-      'flex-basis': _size(i) + '%',
-      'max-width': _size(i) + '%'
-    };
-  },
-  offset: function offset(i) {
-    return {
-      'margin-left': _size(i) + '%'
-    };
-  },
-  first: {
-    order: '-1'
-  },
-  last: {
-    order: '1'
-  }
+var stylesWithBasicBreakpoints = Object.keys(_stylesSpec.breakpoints).reduce(function (state, item) {
+  return (0, _stylesSpec.merge)(state, hydrateBasicBreakpoint(item));
+}, initStyles);
+
+var colNumericStyles = function colNumericStyles(i) {
+  var size = Number(_stylesSpec.columns / i).toFixed(2);
+  return {
+    'flex-basis': size + '%',
+    'max-width': size + '%'
+  };
 };
 
-Object.keys(_stylesSpec.breakpoints).forEach(function (breakpoint) {
-  Object.keys(helpers).map(function (key) {
-    return { key: key, helper: helpers[key] };
-  }).forEach(function (_ref3) {
-    var key = _ref3.key;
-    var helper = _ref3.helper;
+var hydrateNumericBreakpoint = function hydrateNumericBreakpoint(breakpoint) {
+  return range(_stylesSpec.columns).map(function (i) {
+    return _defineProperty({}, breakpoint + '-' + i, colNumericStyles(i));
+  }).reduce(_stylesSpec.merge, {});
+};
 
-    if (key === 'size' || key === 'offset') {
-      range(_stylesSpec.columns).forEach(function (colIndex) {
-        styles[breakpoint + '-' + key + '-' + colIndex] = breakpoint === 'xs' ? helper(colIndex) : _defineProperty({}, _stylesSpec.media[breakpoint], helper(colIndex));
-      });
-    } else {
-      var sKey = key === 'basic' ? breakpoint : breakpoint + '-' + key;
-      var sValue = breakpoint === 'xs' ? helper : _defineProperty({}, _stylesSpec.media[breakpoint], helper);
-      styles[sKey] = sValue;
-    }
-  });
-});
+var stylesWithNumericBreakpoints = Object.keys(_stylesSpec.breakpoints).reduce(function (state, item) {
+  return (0, _stylesSpec.merge)(state, hydrateNumericBreakpoint(item));
+}, stylesWithBasicBreakpoints);
 
-exports['default'] = styles;
+exports['default'] = stylesWithNumericBreakpoints;
 module.exports = exports['default'];

dist/Row-styles.js

@@ -18,7 +18,7 @@ 'use strict';
     'flex-wrap': 'wrap',
-    'margin-right': _stylesSpec.gutter.replace(/rem/, '') / -4 + 'rem',
-    'margin-left': _stylesSpec.gutter.replace(/rem/, '') / -4 + 'rem'
+    'margin-right': _stylesSpec.gutter.replace(/rem/, '') / -4,
+    'margin-left': _stylesSpec.gutter.replace(/rem/, '') / -4
   },
   reverse: {
-    'flex-direction': 'row-reverse'
+    'flex-direction': 'column-reverse'
   }
@@ -44,3 +44,3 @@ };
   around: { 'justify-content': 'space-around' },
-  between: { 'justify-content': 'space-between' }
+  beetween: { 'justify-content': 'space-between' }
 };
@@ -47,0 +47,0 @@

package.json

 {
   "name": "react-bem-grid",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "description": "A BEM-ified port of Flexbox Grid to a simple, reusable React component.",
@@ -48,2 +48,3 @@ "main": "dist/index.js",
     "prop-types": "^15.5.10",
+    "react-prop-types": "^0.3.0",
     "react-pure-render": "^1.0.2"
@@ -75,3 +76,2 @@ },
     "react-dom": "^15.5",
-    "react-prop-types": "^0.3.0",
     "rimraf": "^2.3.4",
@@ -78,0 +78,0 @@ "sinon": "^1.15.4",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

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

Dev dependency count

27

decreased by-3.57%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

204231

decreased by-0.1%

Dependency count

7

increased by16.67%

Lines of code

4913

decreased by-0.37%

Dependency changes

• + Addedreact-prop-types@^0.3.0

• + Addedreact-prop-types@0.3.2(transitive)

• + Addedwarning@2.1.0(transitive)