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

Blend core cmponents

import { objectWithoutProperties as _objectWithoutProperties } from './_virtual/_rollupPluginBabelHelpers.js';
import React from 'react';
import Box from './Box.js';
import Flex from './Flex.js';
import PropTypes from 'prop-types';
var _excluded = ["children", "alignContent", "alignItems", "direction", "justify", "flexWrap", "width", "height", "minWidth", "minHeight", "maxWidth", "maxHeight"];
var ALIGN_ITEMS = ["flex-start", "center", "flex-end", "stretch", "baseline"];
var JUSTIFY = ["flex-start", "center", "flex-end", "space-between", "space-around", "space-evenly"];
var ALIGN_CONTENT = ["stretch", "center", "flex-start", "flex-end", "space-between", "space-around"];
var DIRECTION = ["row", "row-reverse", "column", "column-reverse"];

var Grid = function Grid(props) {
  var children = props.children,
      alignContent = props.alignContent,
      alignItems = props.alignItems,
      direction = props.direction,
      justify = props.justify,
      flexWrap = props.flexWrap,
      width = props.width,
      height = props.height,
      minWidth = props.minWidth,
      minHeight = props.minHeight,
      maxWidth = props.maxWidth,
      maxHeight = props.maxHeight,
      rest = _objectWithoutProperties(props, _excluded);

  return /*#__PURE__*/React.createElement(Box, rest, /*#__PURE__*/React.createElement(Flex, {
    flexWrap: flexWrap,
    width: width,
    height: height,
    minWidth: minWidth,
    minHeight: minHeight,
    maxWidth: maxWidth,
    maxHeight: maxHeight,
    alignContent: alignContent,
    alignItems: alignItems,
    justifyContent: justify,
    flexDirection: direction
  }, children));
};

Grid.defaultProps = {
  alignItems: "stretch",
  justify: "flex-start",
  alignContent: "stretch",
  direction: "row",
  flexWrap: "wrap"
};
Grid.displayName = "Grid";
Grid.propTypes = {
  alignItems: PropTypes.oneOf(ALIGN_ITEMS),
  alignContent: PropTypes.oneOf(ALIGN_CONTENT),
  justify: PropTypes.oneOf(JUSTIFY),
  direction: PropTypes.oneOf(DIRECTION),
  flexWrap: PropTypes.oneOf(["wrap", "nowrap", "wrap-reverse", "initial"])
};
Grid.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "Grid",
  "props": {
    "alignItems": {
      "defaultValue": {
        "value": "\"stretch\"",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "\"flex-start\"",
          "computed": false
        }, {
          "value": "\"center\"",
          "computed": false
        }, {
          "value": "\"flex-end\"",
          "computed": false
        }, {
          "value": "\"stretch\"",
          "computed": false
        }, {
          "value": "\"baseline\"",
          "computed": false
        }]
      },
      "required": false
    },
    "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
    },
    "alignContent": {
      "defaultValue": {
        "value": "\"stretch\"",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "\"stretch\"",
          "computed": false
        }, {
          "value": "\"center\"",
          "computed": false
        }, {
          "value": "\"flex-start\"",
          "computed": false
        }, {
          "value": "\"flex-end\"",
          "computed": false
        }, {
          "value": "\"space-between\"",
          "computed": false
        }, {
          "value": "\"space-around\"",
          "computed": false
        }]
      },
      "required": false
    },
    "direction": {
      "defaultValue": {
        "value": "\"row\"",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "\"row\"",
          "computed": false
        }, {
          "value": "\"row-reverse\"",
          "computed": false
        }, {
          "value": "\"column\"",
          "computed": false
        }, {
          "value": "\"column-reverse\"",
          "computed": false
        }]
      },
      "required": false
    },
    "flexWrap": {
      "defaultValue": {
        "value": "\"wrap\"",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "enum",
        "value": [{
          "value": "\"wrap\"",
          "computed": false
        }, {
          "value": "\"nowrap\"",
          "computed": false
        }, {
          "value": "\"wrap-reverse\"",
          "computed": false
        }, {
          "value": "\"initial\"",
          "computed": false
        }]
      },
      "required": false
    }
  }
};
export { Grid as default };