styletron-react-compose/es/styled.js

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };

var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _styletronUtils = require('styletron-utils');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var STYLETRON_KEY = '__STYLETRON';
var toCamelCase = function toCamelCase(str) {
  return str.replace(/-([a-z])/g, function (_ref) {
    var _ref2 = _slicedToArray(_ref, 2),
        x = _ref2[1];

    return x.toUpperCase();
  });
};
var omit$Props = function omit$Props(source) {
  return Object.keys(source).filter(function (_ref3) {
    var _ref4 = _slicedToArray(_ref3, 1),
        s = _ref4[0];

    return s !== '$';
  }).reduce(function (res, k) {
    res[k] = source[k];return res;
  }, {});
};

function assign(target, source) {
  for (var key in source) {
    var val = source[key];
    if ((typeof val === 'undefined' ? 'undefined' : _typeof(val)) === 'object') {
      target[key] = target[key] || {};
      target[key] = Object.assign(target[key], val);
    } else {
      target[key] = val;
    }
  }
  return target;
}

function assignProps(styletron, styleResult, ownProps) {
  var className = ownProps.className;

  var styleFromClassName = {};
  if (className) {
    var classNames = [];
    className.split(' ').forEach(function (cn) {
      var dec = styletron.getDeclarationFromClassName(cn);
      if (dec) {
        var block = dec.block,
            media = dec.media,
            pseudo = dec.pseudo;

        var propName = media ? '@media ' + media : pseudo;

        var _block$split = block.split(':'),
            _block$split2 = _slicedToArray(_block$split, 2),
            prop = _block$split2[0],
            val = _block$split2[1];

        var node = _defineProperty({}, toCamelCase(prop), val);
        assign(styleFromClassName, propName ? _defineProperty({}, propName, node) : node);
      } else {
        classNames.push(cn);
      }
    });
    className = classNames.join(' ');
  }
  var styletronClassName = (0, _styletronUtils.injectStylePrefixed)(styletron, assign(styleResult, styleFromClassName));

  if (ownProps.styleProps) {
    delete ownProps.styleProps;
  }

  ownProps.className = className ? className + ' ' + styletronClassName : styletronClassName;
  return ownProps;
}

function createStyledElementComponent(base, stylesArray) {
  function StyledElement(props, context) {
    var ownProps = Object.assign({}, props);
    delete ownProps.innerRef;

    var styleResult = {};
    StyledElement[STYLETRON_KEY].styles.forEach(function (style) {
      if (typeof style === 'function') {
        assign(styleResult, style(ownProps, context));
      } else if ((typeof style === 'undefined' ? 'undefined' : _typeof(style)) === 'object') {
        assign(styleResult, style);
      }
    });

    var elementProps = assignProps(context.styletron, styleResult, ownProps);

    elementProps = omit$Props(elementProps);

    if (props.innerRef) {
      elementProps.ref = props.innerRef;
    }

    return _react2.default.createElement(StyledElement[STYLETRON_KEY].tag, elementProps);
  }

  StyledElement[STYLETRON_KEY] = {
    tag: base,
    styles: stylesArray
  };

  StyledElement.contextTypes = Object.assign({}, base.contextTypes);
  StyledElement.contextTypes.styletron = _propTypes2.default.object;

  if (process.env.NODE_ENV !== 'production') {
    var name = base.displayName ? base.displayName : typeof base === 'function' ? base.name : base;
    StyledElement.displayName = 'Styled' + (name ? '(' + name + ')' : '');
  }

  return StyledElement;
}

function core(style, base) {
  if (typeof base === 'function' && base[STYLETRON_KEY]) {
    var _base$STYLETRON_KEY = base[STYLETRON_KEY],
        tag = _base$STYLETRON_KEY.tag,
        styles = _base$STYLETRON_KEY.styles;

    return createStyledElementComponent(tag, styles.concat(style));
  }
  if (typeof base === 'string' || typeof base === 'function') {
    return createStyledElementComponent(base, [style]);
  }
  throw new Error('`styled` takes either a DOM element name or a component');
}

exports.default = function () {
  for (var _len = arguments.length, params = Array(_len), _key = 0; _key < _len; _key++) {
    params[_key] = arguments[_key];
  }

  return params.length === 2 ? core.apply(undefined, params) : function (base) {
    return core(params[0], base);
  };
};