@pubsweet/ui-toolkit/dist/themeHelper.js

Helper functions and reusable blocks for use with @pubsweet/ui

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.validationColor = exports.th = exports.grid = void 0;

var _lodash = require("lodash");

/**
 * Returns multiples of gridUnit.
 *
 * It lets you replace statements like this:
 *    calc(${th('gridUnit')} * 4)
 * to this:
 *    ${grid(4)}
 *
 */
var grid = function grid(value) {
  return function (props) {
    return "calc(".concat(props.theme.gridUnit, " * ").concat(value, ")");
  };
};
/**
 * A bit of syntactic sugar for styled-components. Lets you replace this:
 *
 * ${props => props.theme.colorPrimary}
 *
 * with this:
 *
 * ${th('colorPrimary')}
 *
 * This is called 'th' (theme helper) for historic reasons
 */


exports.grid = grid;

var th = function th(name) {
  return function (props) {
    return (0, _lodash.get)(props.theme, name);
  };
};
/**
 * returns color from theme object, based on validation status
 */


exports.th = th;

var validationColor = function validationColor(_ref) {
  var theme = _ref.theme,
      _ref$validationStatus = _ref.validationStatus,
      validationStatus = _ref$validationStatus === void 0 ? 'default' : _ref$validationStatus;
  return {
    error: theme.colorError,
    success: theme.colorSuccess,
    "default": theme.colorBorder,
    warning: theme.colorWarning
  }[validationStatus];
};

exports.validationColor = validationColor;