@geezee/react-ui/esm/spacer/spacer.js

Modern and minimalist React UI library.

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
import _JSXStyle from "styled-jsx/style";
import React from 'react';
import withDefaults from '../utils/with-defaults';
var defaultProps = {
  x: 1,
  y: 1,
  inline: false,
  className: ''
};
export var getMargin = function getMargin(num) {
  return "calc(".concat(num, " * 16px + 1px * ").concat(num - 1, ")");
};

var Spacer = function Spacer(_ref) {
  var x = _ref.x,
      y = _ref.y,
      inline = _ref.inline,
      className = _ref.className,
      props = _objectWithoutProperties(_ref, ["x", "y", "inline", "className"]);

  var left = getMargin(x);
  var top = getMargin(y);
  return /*#__PURE__*/React.createElement("span", _extends({}, props, {
    className: _JSXStyle.dynamic([["782780554", [inline ? 'inline-block' : 'block', left, top]]]) + " " + (props && props.className != null && props.className || className || "")
  }), /*#__PURE__*/React.createElement(_JSXStyle, {
    id: "782780554",
    dynamic: [inline ? 'inline-block' : 'block', left, top]
  }, "span.__jsx-style-dynamic-selector{display:".concat(inline ? 'inline-block' : 'block', ";height:1px;width:1px;margin-left:").concat(left, ";margin-top:").concat(top, ";}")));
};

var MemoSpacer = React.memo(Spacer);
export default withDefaults(MemoSpacer, defaultProps);