@blend-ui/core/dist/esm/Cell.js

Blend core cmponents

import { objectSpread2 as _objectSpread2, toConsumableArray as _toConsumableArray, objectWithoutProperties as _objectWithoutProperties, extends as _extends } from './_virtual/_rollupPluginBabelHelpers.js';
import React from 'react';
import Box from './Box.js';
import PropTypes from 'prop-types';
import styledProps from '@styled-system/prop-types';
var _excluded = ["children", "xs", "sm", "md", "lg", "xl", "justify"];
var BREAKPOINTS = ["xs", "sm", "md", "lg", "xl"]; //const aliases = ["sm", "md", "lg", "xl", "xxl"];
//export const breakpoints = [32, 40, 48, 64, 80].map(n => n + "em");

var JUSTIFY = ["flex-start", "center", "flex-end", "space-between", "space-around", "space-evenly"];

var Cell = function Cell(props) {
  var children = props.children;
  props.xs;
  props.sm;
  props.md;
  props.lg;
  props.xl;

  var justify = props.justify,
      rest = _objectWithoutProperties(props, _excluded);

  var width = null;

  if (props.width) {
    width = props.width;
  } else {
    width = [];
    BREAKPOINTS.forEach(function (bp) {
      if (typeof props[bp] !== "undefined") {
        width.push(props[bp] / 12);
      } else {
        width.push(null);
      }
    });
  }

  console.log("WIDTH ", width);
  return /*#__PURE__*/React.createElement(Box, _extends({}, rest, {
    width: width,
    justifyContent: justify
  }), children);
};

Cell.displayName = "Grid";
Cell.defaultProps = {
  justify: "flex-start"
};
Cell.propTypes = _objectSpread2(_objectSpread2({
  xs: PropTypes.oneOf(_toConsumableArray(new Array(12)).map(function (_, i) {
    return i + 1;
  })),
  sm: PropTypes.oneOf(_toConsumableArray(new Array(12)).map(function (_, i) {
    return i + 1;
  })),
  md: PropTypes.oneOf(_toConsumableArray(new Array(12)).map(function (_, i) {
    return i + 1;
  })),
  lg: PropTypes.oneOf(_toConsumableArray(new Array(12)).map(function (_, i) {
    return i + 1;
  })),
  xl: PropTypes.oneOf(_toConsumableArray(new Array(12)).map(function (_, i) {
    return i + 1;
  })),
  justify: PropTypes.oneOf(JUSTIFY)
}, styledProps.layout), styledProps.space);
Cell.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "Grid",
  "props": {
    "justify": {
      "defaultValue": {
        "value": "\"flex-start\"",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "\"flex-start\"",
          "computed": false
        }, {
          "value": "\"center\"",
          "computed": false
        }, {
          "value": "\"flex-end\"",
          "computed": false
        }, {
          "value": "\"space-between\"",
          "computed": false
        }, {
          "value": "\"space-around\"",
          "computed": false
        }, {
          "value": "\"space-evenly\"",
          "computed": false
        }]
      },
      "required": false
    },
    "xs": {
      "description": "",
      "type": {
        "name": "enum",
        "computed": true,
        "value": "[...new Array(12)].map((_, i) => i + 1)"
      },
      "required": false
    },
    "sm": {
      "description": "",
      "type": {
        "name": "enum",
        "computed": true,
        "value": "[...new Array(12)].map((_, i) => i + 1)"
      },
      "required": false
    },
    "md": {
      "description": "",
      "type": {
        "name": "enum",
        "computed": true,
        "value": "[...new Array(12)].map((_, i) => i + 1)"
      },
      "required": false
    },
    "lg": {
      "description": "",
      "type": {
        "name": "enum",
        "computed": true,
        "value": "[...new Array(12)].map((_, i) => i + 1)"
      },
      "required": false
    },
    "xl": {
      "description": "",
      "type": {
        "name": "enum",
        "computed": true,
        "value": "[...new Array(12)].map((_, i) => i + 1)"
      },
      "required": false
    }
  },
  "composes": ["@styled-system/prop-types"]
};
export { Cell as default };