reflay/lib/components/Box.js

React Flexbox Layout.

'use strict';

exports.__esModule = true;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

var _breakpoints = require('../helpers/breakpoints');

var _breakpoints2 = _interopRequireDefault(_breakpoints);

var _createProps = require('../helpers/createProps');

var _createProps2 = _interopRequireDefault(_createProps);

var _box = require('../helpers/box');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

// Helpers.


// Flex.


/**
 * Prepare Box propTypes.
 * @returns {Object}
 */
var getPropTypes = function getPropTypes() {
  var propTypes = {};

  // Dynamically generated propTypes.
  var dynamicPropTypes = {};
  var breakpointsSpecificProps = {
    flex: _react.PropTypes.oneOf((0, _box.getPossibleFlexValues)()),
    order: _react.PropTypes.oneOf((0, _box.getPossibleOrderValues)()),
    offset: _react.PropTypes.oneOf((0, _box.getPossibleOffsetValues)()),
    hide: _react.PropTypes.bool,
    show: _react.PropTypes.bool
  };

  var _iteratorNormalCompletion = true;
  var _didIteratorError = false;
  var _iteratorError = undefined;

  try {
    var _loop = function _loop() {
      var k = _step.value;

      var v = breakpointsSpecificProps[k];
      propTypes['' + k] = v;
      _breakpoints2.default.map(function (breakpoint) {
        propTypes[k + '-' + breakpoint] = v;
      });
    };

    for (var _iterator = Object.keys(breakpointsSpecificProps)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
      _loop();
    }

    // Other propTypes.
  } catch (err) {
    _didIteratorError = true;
    _iteratorError = err;
  } finally {
    try {
      if (!_iteratorNormalCompletion && _iterator.return) {
        _iterator.return();
      }
    } finally {
      if (_didIteratorError) {
        throw _iteratorError;
      }
    }
  }

  var otherPropTypes = {
    className: _react.PropTypes.string,
    tagName: _react.PropTypes.string,
    children: _react.PropTypes.node
  };

  return Object.assign(propTypes, dynamicPropTypes, otherPropTypes);
};

var propTypes = getPropTypes();

/**
 * Prepare Box defaultProps.
 * @returns {Object}
 */
var getDefaultProps = function getDefaultProps() {
  return {
    tagName: 'div'
  };
};

var defaultProps = getDefaultProps();

/**
 * Box component.
 */
var Box = function Box(props) {
  var classes = [];

  classes.push(_defineProperty({}, 'flex-' + props['flex'], props['flex']));
  _breakpoints2.default.map(function (breakpoint) {
    classes.push(_defineProperty({}, 'flex-' + breakpoint + '-' + props['flex-' + breakpoint], props['flex-' + breakpoint]));
  });['order', 'offset'].map(function (prop) {
    classes.push(_defineProperty({}, 'flex-' + prop + '-' + props[prop], props[prop]));
    _breakpoints2.default.map(function (breakpoint) {
      classes.push(_defineProperty({}, 'flex-' + prop + '-' + breakpoint + '-' + props[prop + '-' + breakpoint], props[prop + '-' + breakpoint]));
    });
  });['hide', 'show'].map(function (prop) {
    classes.push(_defineProperty({}, '' + prop, props[prop]));
    _breakpoints2.default.map(function (breakpoint) {
      classes.push(_defineProperty({}, prop + '-' + breakpoint, props[prop + '-' + breakpoint]));
    });
  });

  var className = (0, _classnames2.default)(props.className, classes);

  return _react2.default.createElement(props.tagName, (0, _createProps2.default)(propTypes, props, className));
};

Box.propTypes = propTypes;
Box.defaultProps = defaultProps;

exports.default = Box;