jobiqo-cl/lib/src/components/02-atoms/06-layout/07-spacing/index.js

[](https://circleci.com/gh/jobiqo/jobiqo-cl)

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var tslib_es6 = require('../../../../../node_modules/tslib/tslib.es6.js');
var React = require('react');
var React__default = _interopDefault(React);
var styled = require('styled-components');
var styled__default = _interopDefault(styled);
var index_esm$9 = require('../../../../../node_modules/@styled-system/space/dist/index.esm.js');
require('../../../../../node_modules/styled-system/dist/index.esm.js');

/**
 * @file index.tsx
 *
 * @fileoverview A component that defines spacing on top or bottom.
 */
const StyledSpace = styled__default.div `
  ${index_esm$9.space}
`;
const spacesMap = {
    small: 4,
    medium: 6,
    large: 8
};
/**
 * The Spacing component can be used to wrap some content with either vertical or bottom spacing. or both. it will generate consistent amounts
 * of spacing comming from what is defined in the theme. This ensures that when making space between elements we are defining a consistent look and feel.
 */
const Spacing = (_a) => {
    var { size = 'small', mt = spacesMap[size], mb = spacesMap[size], children } = _a, props = tslib_es6.__rest(_a, ["size", "mt", "mb", "children"]);
    return React.createElement(StyledSpace, Object.assign({}, Object.assign({ size, mt, mb }, props)), children);
};

exports.Spacing = Spacing;
exports.default = Spacing;