@quarkly/atomize/build/cjs/atomic-styles/index.js

Library for creating atomic react components

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.wrap = exports.makeAtom = exports.makeComponent = exports.isTemplate = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _isPlainObject2 = _interopRequireDefault(require("lodash/fp/isPlainObject"));

var _isArray2 = _interopRequireDefault(require("lodash/fp/isArray"));

var _bootstrap = _interopRequireDefault(require("./bootstrap"));

var _dict = _interopRequireDefault(require("../constants/dict"));

var _normalizeProps = _interopRequireDefault(require("../utils/normalize-props"));

var _propInfo = _interopRequireDefault(require("../prop-info"));

var defaultStyles = Object.keys(_dict["default"]);
var defaultConfig = {
  useAliases: true
};

var isTemplate = function isTemplate(arg) {
  return (0, _isArray2["default"])(arg);
};

exports.isTemplate = isTemplate;

var makeComponent = function makeComponent(styled, tag, _styles, config, other) {
  var forwardCssProperties = config.forwardCssProperties;
  var defaultProps = (0, _isPlainObject2["default"])(other) ? other : undefined;
  var rulesCreator = (0, _bootstrap["default"])(config, defaultProps);
  var rules = (0, _isArray2["default"])(other) ? other : [];
  var pureCSS = typeof forwardCssProperties === 'boolean' ? !forwardCssProperties : typeof tag === 'string';
  var denieList = ['cssObject'];
  if (pureCSS) denieList.push('theme');
  var Component = (0, _normalizeProps["default"])(styled(tag).withConfig({
    shouldForwardProp: function shouldForwardProp(prop) {
      return !denieList.includes(prop);
    }
  })(rules, function (props) {
    var cssObject = props.cssObject;
    return cssObject;
  }), rulesCreator, pureCSS);

  if (config.name) {
    Component.displayName = config.name;
  }

  if (config.description) {
    Component.description = config.description;
  }

  if (config.effects) {
    Component.effects = config.effects;
  }

  if (config.overrides) {
    Component.overrides = config.overrides;
  }

  Component.propInfo = (0, _propInfo["default"])(config.propInfo || {});
  Component.defaultProps = defaultProps;
  return Component;
};

exports.makeComponent = makeComponent;

var makeAtom = function makeAtom(styled) {
  return function (tag, config, defaultProps) {
    if (config === void 0) {
      config = {};
    }

    var styles = config.styles || defaultStyles;

    if (isTemplate(config)) {
      return makeComponent(styled, tag, styles, {}, config);
    }

    return makeComponent(styled, tag, styles, (0, _extends2["default"])((0, _extends2["default"])({}, defaultConfig), config), defaultProps);
  };
};

exports.makeAtom = makeAtom;

var wrap = function wrap(styled) {
  var atom = makeAtom(styled);
  return Object.keys(styled).reduce(function (acc, tag) {
    acc[tag] = atom.bind(null, tag);
    return acc;
  }, function (tag) {
    return atom.bind(null, tag);
  });
};

exports.wrap = wrap;