@procore/core-react/dist/Box/Box.styles.js

React library of Procore Design Guidelines

import styled, { css } from 'styled-components';
import { spacing } from '../_styles/spacing';
function appendPx(value) {
  if (!value) {
    return;
  }
  return typeof value === 'string' ? value : "".concat(value, "px");
}
function sizeStrToPx(str) {
  /**
   * hacky usage of "as" here, but since we have a default fallback if the
   * lookup fails it should be fine
   */
  return spacing[str] !== undefined ? "".concat(spacing[str], "px") : str;
}
function shorthandSizeToPx(shorthand) {
  return shorthand === null || shorthand === void 0 ? void 0 : shorthand.split(' ').map(sizeStrToPx).join(' ');
}
function sizeToPx(size) {
  return sizeStrToPx(size) || size;
}
export var StyledBox = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledBox",
  componentId: "core-12_44_0__sc-fgsy0p-0"
})(["", " ", ""], function (_ref) {
  var as = _ref.as;
  if (as === 'ol' || as === 'ul') {
    return css(["list-style:none;margin:0;padding:0;"]);
  }
}, function (p) {
  return css(["align-content:", ";align-items:", ";align-self:", ";display:", ";flex-basis:", ";flex-direction:", ";flex-grow:", ";flex-shrink:", ";flex-wrap:", ";flex:", ";gap:", ";justify-content:", ";margin:", ";margin-bottom:", ";margin-left:", ";margin-right:", ";margin-top:", ";order:", ";padding:", ";padding-bottom:", ";padding-left:", ";padding-right:", ";padding-top:", ";text-align:", ";"], p.$alignContent, p.$alignItems, p.$alignSelf, p.$display, p.$flexBasis, p.$flexDirection, p.$flexGrow, p.$flexShrink, p.$flexWrap, p.$flex, shorthandSizeToPx(p.$gap), p.$justifyContent, shorthandSizeToPx(p.$margin), sizeToPx(p.$marginBottom), sizeToPx(p.$marginLeft), sizeToPx(p.$marginRight), sizeToPx(p.$marginTop), p.$order, shorthandSizeToPx(p.$padding), sizeToPx(p.$paddingBottom), sizeToPx(p.$paddingLeft), sizeToPx(p.$paddingRight), sizeToPx(p.$paddingTop), p.$textAlign);
});
//# sourceMappingURL=Box.styles.js.map