react-flexr - npm Package Compare versions

Comparing version 1.0.0 to 1.1.0

lib/cell.component.js

@@ -1,23 +0,33 @@
-"use strict";
+'use strict';
 
-var _interopRequire = function (obj) { return obj && obj.__esModule ? obj["default"] : obj; };
+var _interopRequireWildcard = function (obj) { return obj && obj.__esModule ? obj : { 'default': obj }; };
 
-var _slicedToArray = function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { var _arr = []; for (var _iterator = arr[Symbol.iterator](), _step; !(_step = _iterator.next()).done;) { _arr.push(_step.value); if (i && _arr.length === i) break; } return _arr; } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } };
+var _slicedToArray = function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } };
 
-var _createClass = (function () { function defineProperties(target, props) { for (var key in props) { var prop = props[key]; prop.configurable = true; if (prop.value) prop.writable = true; } Object.defineProperties(target, props); } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
 
-var _get = function get(object, property, receiver) { var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc && desc.writable) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
 
-var _inherits = function (subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; };
+var _get = function get(object, property, receiver) { var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
 
-var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } };
+var _inherits = function (subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; };
 
-var React = _interopRequire(require("react"));
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
 
-var assign = _interopRequire(require("react/lib/Object.assign"));
+var _React = require('react');
 
-var flexAlignments = _interopRequire(require("./flex-alignments"));
+var _React2 = _interopRequireWildcard(_React);
 
-var PropTypes = React.PropTypes;
+var _assign = require('react/lib/Object.assign');
 
+var _assign2 = _interopRequireWildcard(_assign);
+
+var _flexAlignments = require('./flex-alignments');
+
+var _flexAlignments2 = _interopRequireWildcard(_flexAlignments);
+
+var PropTypes = _React2['default'].PropTypes;
+
 var Cell = (function (_React$Component) {
@@ -27,3 +37,3 @@ function Cell(props) {
 
-    _get(Object.getPrototypeOf(Cell.prototype), "constructor", this).call(this, props);
+    _get(Object.getPrototypeOf(Cell.prototype), 'constructor', this).call(this, props);
     var size = props.size;
@@ -34,4 +44,5 @@ var gutter = props.gutter;
     var align = props.align;
+    var grow = props.grow;
 
-    var _ref = size ? size.split("/") : [];
+    var _ref = size ? size.split('/') : [];
 
@@ -43,10 +54,12 @@ var _ref2 = _slicedToArray(_ref, 2);
 
+    var growStyle = typeof grow === 'number' ? grow : grow === false ? 0 : 1;
+
     var styles = {
-      flex: size ? "0 0 " + 100 / denom * numer + "%" : 1,
-      padding: gutter ? gutter : "0 1em",
-      display: flex ? "flex" : null,
-      alignSelf: align ? flexAlignments[align] : null
+      flex: size ? '0 0 ' + 100 / denom * numer + '%' : '' + growStyle + ' 1',
+      padding: gutter ? gutter : '0 1em',
+      display: flex ? 'flex' : null,
+      alignSelf: align ? _flexAlignments2['default'][align] : null
     };
 
-    this.styles = style ? assign({}, styles, style) : styles;
+    this.styles = style ? _assign2['default']({}, styles, style) : styles;
   }
@@ -56,24 +69,24 @@
 
-  _createClass(Cell, {
-    render: {
-      value: function render() {
-        return React.createElement(
-          "div",
-          { style: this.styles },
-          this.props.children
-        );
-      }
+  _createClass(Cell, [{
+    key: 'render',
+    value: function render() {
+      return _React2['default'].createElement(
+        'div',
+        { style: this.styles },
+        this.props.children
+      );
     }
-  });
+  }]);
 
   return Cell;
-})(React.Component);
+})(_React2['default'].Component);
 
 Cell.propTypes = {
-  gutter: React.PropTypes.string,
-  flex: React.PropTypes.bool,
-  align: PropTypes.oneOf(["top", "center", "bottom"]),
-  size: function (props, propName) {
-    if (props[propName] && props[propName].split("/").length !== 2) {
-      return new Error("Size should be a fraction, e.g. 1/6");
+  grow: PropTypes.oneOf([false, true, _React2['default'].PropTypes.number]),
+  gutter: _React2['default'].PropTypes.string,
+  flex: _React2['default'].PropTypes.bool,
+  align: PropTypes.oneOf(['top', 'center', 'bottom']),
+  size: function size(props, propName) {
+    if (props[propName] && props[propName].split('/').length !== 2) {
+      return new Error('Size should be a fraction, e.g. 1/6');
     }
@@ -83,2 +96,3 @@ }
 
-module.exports = Cell;
+exports['default'] = Cell;
+module.exports = exports['default'];

lib/flex-alignments.js

@@ -1,7 +0,11 @@
-"use strict";
+'use strict';
 
-module.exports = {
-  top: "flex-start",
-  center: "center",
-  bottom: "flex-end"
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+exports['default'] = {
+  top: 'flex-start',
+  center: 'center',
+  bottom: 'flex-end'
 };
+module.exports = exports['default'];

lib/grid.component.js

@@ -1,26 +0,38 @@
-"use strict";
+'use strict';
 
-var _interopRequire = function (obj) { return obj && obj.__esModule ? obj["default"] : obj; };
+var _interopRequireWildcard = function (obj) { return obj && obj.__esModule ? obj : { 'default': obj }; };
 
-var _createClass = (function () { function defineProperties(target, props) { for (var key in props) { var prop = props[key]; prop.configurable = true; if (prop.value) prop.writable = true; } Object.defineProperties(target, props); } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
+var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } };
 
-var _get = function get(object, property, receiver) { var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc && desc.writable) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
+var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
 
-var _inherits = function (subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; };
+var _get = function get(object, property, receiver) { var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
 
-var _classCallCheck = function (instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } };
+var _inherits = function (subClass, superClass) { if (typeof superClass !== 'function' && superClass !== null) { throw new TypeError('Super expression must either be null or a function, not ' + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) subClass.__proto__ = superClass; };
 
-var React = _interopRequire(require("react/addons"));
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
 
-var assign = _interopRequire(require("react/lib/Object.assign"));
+var _React = require('react/addons');
 
-var Cell = _interopRequire(require("./cell.component"));
+var _React2 = _interopRequireWildcard(_React);
 
-var flexAlignments = _interopRequire(require("./flex-alignments"));
+var _assign = require('react/lib/Object.assign');
 
-var Component = React.Component;
-var Children = React.Children;
-var PropTypes = React.PropTypes;
-var addons = React.addons;
+var _assign2 = _interopRequireWildcard(_assign);
 
+var _Cell = require('./cell.component');
+
+var _Cell2 = _interopRequireWildcard(_Cell);
+
+var _flexAlignments = require('./flex-alignments');
+
+var _flexAlignments2 = _interopRequireWildcard(_flexAlignments);
+
+var Component = _React2['default'].Component;
+var Children = _React2['default'].Children;
+var PropTypes = _React2['default'].PropTypes;
+var addons = _React2['default'].addons;
+
 var Grid = (function (_Component) {
@@ -30,3 +42,3 @@ function Grid(props) {
 
-    _get(Object.getPrototypeOf(Grid.prototype), "constructor", this).call(this, props);
+    _get(Object.getPrototypeOf(Grid.prototype), 'constructor', this).call(this, props);
     var gutter = props.gutter;
@@ -37,11 +49,11 @@ var style = props.style;
     var styles = {
-      display: "flex",
-      flexWrap: "wrap",
-      listStyle: "none",
-      margin: gutter ? gutter : "0 -1em 1em",
+      display: 'flex',
+      flexWrap: 'wrap',
+      listStyle: 'none',
+      margin: gutter ? gutter : '0 -1em 1em',
       padding: 0,
-      alignItems: align ? flexAlignments[align] : null
+      alignItems: align ? _flexAlignments2['default'][align] : null
     };
 
-    this.styles = style ? assign({}, styles, style) : styles;
+    this.styles = style ? _assign2['default']({}, styles, style) : styles;
   }
@@ -51,18 +63,17 @@
 
-  _createClass(Grid, {
-    render: {
-      value: function render() {
-        var props = this.props;
-        var children = props.flexCells ? Children.map(props.children, function (child) {
-          return child.type === Cell ? addons.cloneWithProps(child, { flex: true }) : child;
-        }) : props.children;
+  _createClass(Grid, [{
+    key: 'render',
+    value: function render() {
+      var props = this.props;
+      var children = props.flexCells ? Children.map(props.children, function (child) {
+        return child.type === _Cell2['default'] ? addons.cloneWithProps(child, { flex: true }) : child;
+      }) : props.children;
 
-        return React.createElement(
-          "div",
-          { style: this.styles },
-          children
-        );
-      }
+      return _React2['default'].createElement(
+        'div',
+        { style: this.styles },
+        children
+      );
     }
-  });
+  }]);
 
@@ -75,5 +86,6 @@ return Grid;
   flexCells: PropTypes.bool,
-  align: PropTypes.oneOf(["top", "center", "bottom"])
+  align: PropTypes.oneOf(['top', 'center', 'bottom'])
 };
 
-module.exports = Grid;
+exports['default'] = Grid;
+module.exports = exports['default'];

lib/index.js

@@ -1,12 +0,21 @@
-"use strict";
+'use strict';
 
-var _interopRequire = function (obj) { return obj && obj.__esModule ? obj["default"] : obj; };
+var _interopRequireWildcard = function (obj) { return obj && obj.__esModule ? obj : { 'default': obj }; };
 
-var Grid = _interopRequire(require("./grid.component"));
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
 
-var Cell = _interopRequire(require("./cell.component"));
+var _Grid = require('./grid.component');
 
-module.exports = {
-  Grid: Grid,
-  Cell: Cell
+var _Grid2 = _interopRequireWildcard(_Grid);
+
+var _Cell = require('./cell.component');
+
+var _Cell2 = _interopRequireWildcard(_Cell);
+
+exports['default'] = {
+  Grid: _Grid2['default'],
+  Cell: _Cell2['default']
 };
+module.exports = exports['default'];

package.json

 {
   "name": "react-flexr",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "React flexbox grid made simple.",
@@ -16,4 +16,4 @@ "main": "lib",
   "devDependencies": {
-    "babel": "^4.7.16",
-    "babel-loader": "^4.2.0",
+    "babel": "^5.0.9",
+    "babel-loader": "^5.0.0",
     "jsdom": "^4.0.5",
@@ -20,0 +20,0 @@ "mocha": "^2.2.1",

src/cell.component.js

@@ -10,7 +10,11 @@ import React from 'react';
     super(props);
-    const { size, gutter, flex, style, align } = props;
+    const { size, gutter, flex, style, align, grow } = props;
     const [ numer, denom ] = size ? size.split('/') : [];
+    const growStyle =
+      typeof grow === 'number' ? grow :
+      grow === false ? 0 :
+      1;
 
     const styles = {
-      flex: size ? `0 0 ${ ( 100 / denom ) * numer }%` : 1,
+      flex: size ? `0 0 ${ ( 100 / denom ) * numer }%` : `${ growStyle } 1`,
       padding: gutter ? gutter : '0 1em',
@@ -36,2 +40,3 @@ display: flex ? 'flex' : null,
 Cell.propTypes = {
+  grow: PropTypes.oneOf([false, true, React.PropTypes.number]),
   gutter: React.PropTypes.string,
@@ -38,0 +43,0 @@ flex: React.PropTypes.bool,

No alert changes

Improved metrics

Total package byte prevSize

14918

increased by13.26%

Lines of code

254

increased by13.9%

No dependency changes