vcc-ui/es/components/row/index.js

VCC UI is a collection of React UI Components that can be used for developing front-end applications at Volvo Car Corporation.

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; }

import React from 'react';
import PropTypes from 'prop-types';
import { useFela } from 'react-fela';
import { Flex } from '../flex';
var styles = {
  row: function row(_ref) {
    var theme = _ref.theme,
        align = _ref.align;
    return _defineProperty({
      boxSizing: 'border-box',
      justifyContent: align === 'center' ? 'center' : 'flex-' + align,
      marginLeft: -theme.baselineGrid,
      marginRight: -theme.baselineGrid,
      flexDirection: 'row',
      flexWrap: 'wrap'
    }, theme.breakpoints.fromL, {
      marginLeft: theme.baselineGrid * -1.5,
      marginRight: theme.baselineGrid * -1.5
    });
  }
};
export function Row(_ref3) {
  var children = _ref3.children,
      _ref3$align = _ref3.align,
      align = _ref3$align === void 0 ? 'start' : _ref3$align;

  var _useFela = useFela(),
      theme = _useFela.theme;

  var styleProps = {
    theme: theme,
    align: align
  };
  return React.createElement(Flex, {
    extend: styles.row(styleProps)
  }, children);
}
Row.propTypes = {
  /** Align columns */
  align: PropTypes.oneOf(['start', 'end', 'center']),

  /** A JSX node */
  children: PropTypes.node
};