@kiwicom/orbit-components/es/utils/Grid/index.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

import * as React from "react";
import styled, { css } from "styled-components";
import defaultTheme from "../../defaultTheme";
import mediaQueries from "../mediaQuery";
import { DEVICES } from "../mediaQuery/consts";
import getViewportGridStyles from "./helpers/getViewportGridStyles";
import isDefined from "../../Stack/helpers/isDefined";
const StyledGrid = styled(({
  className,
  children,
  dataTest
}) => React.createElement("div", {
  className: className,
  "data-test": dataTest
}, children)).withConfig({
  displayName: "Grid__StyledGrid",
  componentId: "cj22hw-0"
})(["", ";& > *{display:block;}"], props => DEVICES.map((viewport, index, devices) => viewport in mediaQueries ? mediaQueries[viewport](css(["", ";"], isDefined(props[viewport]) && getViewportGridStyles({
  viewport,
  index,
  devices
}))) : viewport === "smallMobile" && css(["", ";"], getViewportGridStyles({
  viewport,
  index,
  devices
}))));
StyledGrid.defaultProps = {
  theme: defaultTheme
};

const Grid = (_ref) => {
  let {
    inline,
    rows = "1fr",
    columns = "1fr",
    gap,
    rowGap,
    columnGap,
    maxWidth,
    children,
    dataTest,
    element = "div"
  } = _ref,
      props = _objectWithoutProperties(_ref, ["inline", "rows", "columns", "gap", "rowGap", "columnGap", "maxWidth", "children", "dataTest", "element"]);

  const smallMobile = {
    inline,
    rows,
    columns,
    gap,
    rowGap,
    columnGap,
    maxWidth
  };
  return React.createElement(StyledGrid, _extends({
    smallMobile: smallMobile,
    "data-test": dataTest,
    as: element
  }, props), children);
};

export default Grid;