@kiwicom/orbit-components/lib/Box/normalize.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

"use strict";

exports.__esModule = true;
exports.default = void 0;

var _consts = require("./consts");

var _consts2 = require("../utils/layout/consts");

var _common = require("../utils/common");

var _layout = require("../utils/layout");

const normalizeSpacing = (el, property, theme) => {
  if (typeof el === "object") {
    return Object.entries(el).map(([key, val]) => {
      if (val === "none") return (0, _layout.formatCSS)(`${property}-${key}`, "0");
      return (0, _layout.formatCSS)(`${property}-${key}`, (0, _consts2.TOKENS)(theme)[val]);
    });
  }

  if (el !== "none") {
    return [(0, _layout.formatCSS)(property, (0, _consts2.TOKENS)(theme)[el])];
  }

  return [];
};

const normalizeToken = (token, property, prefix, theme) => (0, _layout.formatCSS)(property, theme.orbit[prefix + (0, _common.firstToUpper)(token)]);

const normalizeSize = (val, property) => {
  if (val === _consts.WIDTH_AND_HEIGHT.FULL) {
    return (0, _layout.formatCSS)(property, "100%");
  }

  return (0, _layout.formatCSS)(property, val);
};

const normalizeElevation = (val, theme) => {
  return (0, _layout.formatCSS)("box-shadow", theme.orbit[`boxShadow${(0, _common.firstToUpper)(val)}`]);
};

const norm = ({
  val,
  key,
  theme
}) => {
  if (!(0, _layout.isDefined)(val) || !(0, _layout.isDefined)(key)) return undefined;
  const all = {
    padding: normalizeSpacing(val, key, theme),
    margin: normalizeSpacing(val, key, theme),
    color: key === "color" && normalizeToken(val, key, "palette", theme),
    background: key === "background" && normalizeToken(val, key, "palette", theme),
    height: normalizeSize(val, key),
    width: normalizeSize(val, key),
    borderRadius: key === "borderRadius" && normalizeToken(val, "border-radius", "borderRadius", theme),
    elevation: key === "elevation" && normalizeElevation(val, theme),
    justify: (0, _layout.formatCSS)("justify-content", (0, _layout.getJustify)(val)),
    align: (0, _layout.formatCSS)("align-items", (0, _layout.getAlign)(val)),
    direction: (0, _layout.formatCSS)("flex-direction", (0, _layout.getDirection)(val)),
    grow: (0, _layout.formatCSS)("flex-grow", val),
    shrink: (0, _layout.formatCSS)("flex-shrink", val),
    wrap: (0, _layout.formatCSS)("flex-wrap", (0, _layout.getWrap)(val)),
    textAlign: (0, _layout.formatCSS)("text-align", val),
    minWidth: (0, _layout.formatCSS)("min-width", val),
    maxWidth: (0, _layout.formatCSS)("max-width", val),
    maxHeight: (0, _layout.formatCSS)("max-height", val),
    zIndex: (0, _layout.formatCSS)("z-index", val)
  };
  if (!all[key]) return (0, _layout.formatCSS)(key, val);
  return all[key];
};

const normalize = object => ({
  theme
}) => {
  if (!object) return null;
  return Object.entries(object).reduce((acc, [key, val]) => {
    const accFn = additional => [...acc, ...additional];

    return accFn([norm({
      val,
      key,
      theme
    })]);
  }, []);
};

var _default = normalize;
exports.default = _default;