react-grid-system - npm Package Compare versions

Comparing version 4.0.1 to 4.1.0

build/grid/Col/style.js

@@ -38,5 +38,2 @@ 'use strict';
 
-  var theGutterWidth = typeof gutterWidth === 'number' ? gutterWidth : _utils.defaultGutterWidth;
-  var theGridColumns = typeof gridColumns === 'number' ? gridColumns : _utils.defaultGridColumns;
-
   var styles = _extends({
@@ -46,4 +43,4 @@ boxSizing: 'border-box',
     position: 'relative',
-    paddingLeft: theGutterWidth / 2 + 'px',
-    paddingRight: theGutterWidth / 2 + 'px',
+    paddingLeft: gutterWidth / 2 + 'px',
+    paddingRight: gutterWidth / 2 + 'px',
     width: '100%',
@@ -68,7 +65,7 @@ overflow: 'hidden'
     if (_utils.screenClasses.indexOf(screenClass) >= index) {
-      styles.flexBasis = getWidth(width[size], theGridColumns) || styles.flexBasis;
-      styles.maxWidth = getWidth(width[size], theGridColumns) || styles.maxWidth;
-      styles.marginLeft = getWidth(offset[size], theGridColumns) || styles.marginLeft;
-      styles.right = getWidth(pull[size], theGridColumns) || styles.right;
-      styles.left = getWidth(push[size], theGridColumns) || styles.left;
+      styles.flexBasis = getWidth(width[size], gridColumns) || styles.flexBasis;
+      styles.maxWidth = getWidth(width[size], gridColumns) || styles.maxWidth;
+      styles.marginLeft = getWidth(offset[size], gridColumns) || styles.marginLeft;
+      styles.right = getWidth(pull[size], gridColumns) || styles.right;
+      styles.left = getWidth(push[size], gridColumns) || styles.left;
     }
@@ -75,0 +72,0 @@ });

build/grid/Container/style.js

@@ -6,8 +6,5 @@ 'use strict';
 });
-exports.getAfterStyle = undefined;
 
 var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
-var _utils = require('../../utils');
-
 exports.default = function (_ref) {
@@ -25,5 +22,2 @@ var fluid = _ref.fluid,
 
-  var theContainerWidths = containerWidths && containerWidths.length ? containerWidths : _utils.defaultContainerWidths;
-  var theGutterWidth = typeof gutterWidth === 'number' ? gutterWidth : _utils.defaultGutterWidth;
-
   var styles = _extends({
@@ -34,4 +28,4 @@ boxSizing: 'border-box',
     marginRight: 'auto',
-    paddingLeft: theGutterWidth / 2 + 'px',
-    paddingRight: theGutterWidth / 2 + 'px'
+    paddingLeft: gutterWidth / 2 + 'px',
+    paddingRight: gutterWidth / 2 + 'px'
   }, moreStyle);
@@ -43,16 +37,16 @@
 
-  if (screenClass === 'sm' && theContainerWidths[0] && !sm && !xs) {
-    styles.maxWidth = theContainerWidths[0] + 'px';
+  if (screenClass === 'sm' && containerWidths[0] && !sm && !xs) {
+    styles.maxWidth = containerWidths[0] + 'px';
   }
 
-  if (screenClass === 'md' && theContainerWidths[1] && !md) {
-    styles.maxWidth = theContainerWidths[1] + 'px';
+  if (screenClass === 'md' && containerWidths[1] && !md) {
+    styles.maxWidth = containerWidths[1] + 'px';
   }
 
-  if (screenClass === 'lg' && theContainerWidths[2] && !lg) {
-    styles.maxWidth = theContainerWidths[2] + 'px';
+  if (screenClass === 'lg' && containerWidths[2] && !lg) {
+    styles.maxWidth = containerWidths[2] + 'px';
   }
 
-  if (screenClass === 'xl' && theContainerWidths[3] && !xl) {
-    styles.maxWidth = theContainerWidths[3] + 'px';
+  if (screenClass === 'xl' && containerWidths[3] && !xl) {
+    styles.maxWidth = containerWidths[3] + 'px';
   }
@@ -59,0 +53,0 @@

build/grid/Row/style.js

@@ -9,4 +9,2 @@ 'use strict';
 
-var _utils = require('../../utils');
-
 exports.default = function (_ref) {
@@ -18,4 +16,2 @@ var gutterWidth = _ref.gutterWidth,
 
-  var theGutterWidth = typeof gutterWidth === 'number' ? gutterWidth : _utils.defaultGutterWidth;
-
   var alignItems = align;
@@ -26,4 +22,4 @@ if (align === 'start') alignItems = 'flex-start';
   var styles = _extends({
-    marginLeft: '-' + theGutterWidth / 2 + 'px',
-    marginRight: '-' + theGutterWidth / 2 + 'px',
+    marginLeft: '-' + gutterWidth / 2 + 'px',
+    marginRight: '-' + gutterWidth / 2 + 'px',
     display: 'flex',
@@ -30,0 +26,0 @@ flexWrap: 'wrap',

package.json

 {
   "name": "react-grid-system",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "description": "A no CSS Bootstrap-like responsive grid system for React.",
@@ -5,0 +5,0 @@ "main": "./build/index.js",

src/grid/Col/style.js

@@ -1,2 +0,2 @@
-import { defaultGutterWidth, screenClasses, defaultGridColumns } from '../../utils';
+import { screenClasses } from '../../utils';
 
@@ -22,5 +22,2 @@ const hasWidth = widths => Object.keys(widths).reduce((acc, cur) => acc || widths[cur], false);
 }) => {
-  const theGutterWidth = typeof gutterWidth === 'number' ? gutterWidth : defaultGutterWidth;
-  const theGridColumns = typeof gridColumns === 'number' ? gridColumns : defaultGridColumns;
-
   const styles = {
@@ -30,4 +27,4 @@ boxSizing: 'border-box',
     position: 'relative',
-    paddingLeft: `${theGutterWidth / 2}px`,
-    paddingRight: `${theGutterWidth / 2}px`,
+    paddingLeft: `${gutterWidth / 2}px`,
+    paddingRight: `${gutterWidth / 2}px`,
     width: '100%',
@@ -53,7 +50,7 @@ overflow: 'hidden',
     if (screenClasses.indexOf(screenClass) >= index) {
-      styles.flexBasis = getWidth(width[size], theGridColumns) || styles.flexBasis;
-      styles.maxWidth = getWidth(width[size], theGridColumns) || styles.maxWidth;
-      styles.marginLeft = getWidth(offset[size], theGridColumns) || styles.marginLeft;
-      styles.right = getWidth(pull[size], theGridColumns) || styles.right;
-      styles.left = getWidth(push[size], theGridColumns) || styles.left;
+      styles.flexBasis = getWidth(width[size], gridColumns) || styles.flexBasis;
+      styles.maxWidth = getWidth(width[size], gridColumns) || styles.maxWidth;
+      styles.marginLeft = getWidth(offset[size], gridColumns) || styles.marginLeft;
+      styles.right = getWidth(pull[size], gridColumns) || styles.right;
+      styles.left = getWidth(push[size], gridColumns) || styles.left;
     }
@@ -60,0 +57,0 @@ });

src/grid/Container/style.js

@@ -1,3 +0,1 @@
-import { defaultContainerWidths, defaultGutterWidth } from '../../utils';
-
 export default ({
@@ -11,7 +9,2 @@ fluid,
 }) => {
-  const theContainerWidths = containerWidths && containerWidths.length
-    ? containerWidths
-    : defaultContainerWidths;
-  const theGutterWidth = typeof gutterWidth === 'number' ? gutterWidth : defaultGutterWidth;
-
   const styles = {
@@ -22,4 +15,4 @@ boxSizing: 'border-box',
     marginRight: 'auto',
-    paddingLeft: `${theGutterWidth / 2}px`,
-    paddingRight: `${theGutterWidth / 2}px`,
+    paddingLeft: `${gutterWidth / 2}px`,
+    paddingRight: `${gutterWidth / 2}px`,
     ...moreStyle,
@@ -32,16 +25,16 @@ };
 
-  if (screenClass === 'sm' && theContainerWidths[0] && !sm && !xs) {
-    styles.maxWidth = `${theContainerWidths[0]}px`;
+  if (screenClass === 'sm' && containerWidths[0] && !sm && !xs) {
+    styles.maxWidth = `${containerWidths[0]}px`;
   }
 
-  if (screenClass === 'md' && theContainerWidths[1] && !md) {
-    styles.maxWidth = `${theContainerWidths[1]}px`;
+  if (screenClass === 'md' && containerWidths[1] && !md) {
+    styles.maxWidth = `${containerWidths[1]}px`;
   }
 
-  if (screenClass === 'lg' && theContainerWidths[2] && !lg) {
-    styles.maxWidth = `${theContainerWidths[2]}px`;
+  if (screenClass === 'lg' && containerWidths[2] && !lg) {
+    styles.maxWidth = `${containerWidths[2]}px`;
   }
 
-  if (screenClass === 'xl' && theContainerWidths[3] && !xl) {
-    styles.maxWidth = `${theContainerWidths[3]}px`;
+  if (screenClass === 'xl' && containerWidths[3] && !xl) {
+    styles.maxWidth = `${containerWidths[3]}px`;
   }
@@ -48,0 +41,0 @@

src/grid/Row/style.js

@@ -1,8 +0,4 @@
-import { defaultGutterWidth } from '../../utils';
-
 export default ({
   gutterWidth, align, debug, moreStyle,
 }) => {
-  const theGutterWidth = typeof gutterWidth === 'number' ? gutterWidth : defaultGutterWidth;
-
   let alignItems = align;
@@ -13,4 +9,4 @@ if (align === 'start') alignItems = 'flex-start';
   const styles = {
-    marginLeft: `-${theGutterWidth / 2}px`,
-    marginRight: `-${theGutterWidth / 2}px`,
+    marginLeft: `-${gutterWidth / 2}px`,
+    marginRight: `-${gutterWidth / 2}px`,
     display: 'flex',
@@ -17,0 +13,0 @@ flexWrap: 'wrap',

No alert changes

Worsened metrics

Total package byte prevSize

68628

decreased by-2%

Lines of code

1571

decreased by-1.07%

No dependency changes