@bootstrap-styled/css-utils/lib/spacing.js

Bootstrap mixins and utilities in javascript for bootstrap-styled.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.getSpacingUtilities = getSpacingUtilities;
exports.default = exports.defaultProps = void 0;

var _breakpoints = require("@bootstrap-styled/css-mixins/lib/breakpoints");

var defaultProps = {
  '$grid-breakpoints': {
    xs: '0',
    sm: '576px',
    md: '768px',
    lg: '992px',
    xl: '1200px'
  },
  '$spacers': {
    // eslint-disable-line quote-props
    0: {
      x: 0,
      y: 0
    },
    1: {
      x: '0.25rem',
      y: '0.25rem'
    },
    2: {
      x: '0.5rem',
      y: '0.5rem'
    },
    3: {
      x: '1rem',
      y: '1rem'
    },
    4: {
      x: '1.5rem',
      y: '1.5rem'
    },
    5: {
      x: '3rem',
      y: '3rem'
    }
  }
};
exports.defaultProps = defaultProps;

function getSpacingUtilities() // eslint-disable-line dot-notation
{
  var gridBreakpoints = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultProps['$grid-breakpoints'];
  var spacers = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultProps['$spacers'];
  var abbrevs = {
    margin: 'm',
    padding: 'p'
  };
  var spacingUtilityList = [];
  var infixList = [];
  Object.keys(gridBreakpoints).forEach(function (breakpoint) {
    var infix = (0, _breakpoints.breakpointInfix)(breakpoint, gridBreakpoints);
    infixList.push(infix);
    Object.keys(abbrevs).forEach(function (prop) {
      var abbrev = abbrevs[prop];
      Object.keys(spacers).forEach(function (size) {
        var lengths = spacers[size];
        spacingUtilityList.push((0, _breakpoints.mediaBreakpointUp)(breakpoint, gridBreakpoints, "\n          .".concat(abbrev).concat(infix, "-").concat(size, " { ").concat(prop, ":        ").concat(lengths.y, " ").concat(lengths.x, " !important; } /* a = All sides */\n          .").concat(abbrev, "t").concat(infix, "-").concat(size, " { ").concat(prop, "-top:    ").concat(lengths.y, " !important; }\n          .").concat(abbrev, "r").concat(infix, "-").concat(size, " { ").concat(prop, "-right:  ").concat(lengths.x, " !important; }\n          .").concat(abbrev, "b").concat(infix, "-").concat(size, " { ").concat(prop, "-bottom: ").concat(lengths.y, " !important; }\n          .").concat(abbrev, "l").concat(infix, "-").concat(size, " { ").concat(prop, "-left:   ").concat(lengths.x, " !important; }\n          .").concat(abbrev, "x").concat(infix, "-").concat(size, " {\n            ").concat(prop, "-right:  ").concat(lengths.x, " !important;\n            ").concat(prop, "-left:   ").concat(lengths.x, " !important;\n          }\n          .").concat(abbrev, "y").concat(infix, "-").concat(size, " {\n            ").concat(prop, "-top:    ").concat(lengths.y, " !important;\n            ").concat(prop, "-bottom: ").concat(lengths.y, " !important;\n          }\n        ")));
      });
    });
  });
  var infixUtilityList = infixList.map(function (infix) {
    return "\n    .m".concat(infix, "-auto  { margin:        auto !important; }\n    .mt").concat(infix, "-auto { margin-top:    auto !important; }\n    .mr").concat(infix, "-auto { margin-right:  auto !important; }\n    .mb").concat(infix, "-auto { margin-bottom: auto !important; }\n    .ml").concat(infix, "-auto { margin-left:   auto !important; }\n    .mx").concat(infix, "-auto {\n      margin-right: auto !important;\n      margin-left:  auto !important;\n    }\n    .my").concat(infix, "-auto {\n      margin-top:    auto !important;\n      margin-bottom: auto !important;\n    }\n  ");
  });
  return "\n    ".concat(infixUtilityList.join('\n'), "\n    ").concat(spacingUtilityList.join('\n'), "\n  ");
}

var _default = {
  defaultProps: defaultProps,
  getSpacingUtilities: getSpacingUtilities
};
exports.default = _default;