@dnb/eufemia/components/grid/Item.js

DNB Eufemia Design System UI Library

import _extends from "@babel/runtime/helpers/esm/extends";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
const _excluded = ["element", "span", "className", "style", "children"];
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
import React from 'react';
import classnames from 'classnames';
import Space from '../space/Space';
const media = ['small', 'medium', 'large'];
function GridItem(props) {
  const {
      element = 'div',
      span,
      className,
      style,
      children
    } = props,
    rest = _objectWithoutProperties(props, _excluded);
  const styleObj = _objectSpread(_objectSpread({}, compute(span, 'c')), style);
  const cn = classnames('dnb-grid-item', className);
  return React.createElement(Space, _extends({
    element: element,
    className: cn,
    style: styleObj
  }, rest), children);
}
GridItem._supportsSpacingProps = true;
export default GridItem;
function compute(span, modifier) {
  if (!span) {
    return null;
  }
  const result = {};
  const collect = (media, values) => {
    values.forEach((value, i) => {
      const pos = i === 0 ? 's' : 'e';
      if (i === 1 && value > 0) {
        value += 1;
      }
      if (value === 'end') {
        value = '-1';
      }
      result[makeStyle(media, pos)] = value;
    });
  };
  if (Array.isArray(span)) {
    media.forEach(media => {
      collect(media, span);
    });
  } else {
    for (const media in span) {
      const values = span === null || span === void 0 ? void 0 : span[media];
      if (values === 'full') {
        result[makeStyle(media, 's')] = '1';
        result[makeStyle(media, 'e')] = '-1';
      } else if (Array.isArray(values)) {
        collect(media, values);
      }
    }
  }
  return result;
  function makeStyle(media, pos) {
    return `--${media}-${modifier}-${pos}`;
  }
}
//# sourceMappingURL=Item.js.map