'use strict';

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var React = require('react');
var isPropValid = _interopDefault(require('@emotion/is-prop-valid'));
var core = require('@emotion/core');
var utils = require('@emotion/utils');
var serialize = require('@emotion/serialize');

var testOmitPropsOnStringTag = isPropValid;
var testOmitPropsOnComponent = function testOmitPropsOnComponent(key) {
  return key !== 'theme' && key !== 'innerRef';
};
var testAlwaysTrue = function testAlwaysTrue() {
  return true;
};
var pickAssign = function pickAssign(testFn, target) {
  var i = 2;
  var length = arguments.length;

  for (; i < length; i++) {
    var source = arguments[i];

    var _key = void 0;

    for (_key in source) {
      if (testFn(_key)) {
        target[_key] = source[_key];
      }
    }
  }

  return target;
};

var createStyled = function createStyled(tag, options) {
  if (process.env.NODE_ENV !== 'production') {
    if (tag === undefined) {
      throw new Error('You are trying to create a styled element with an undefined component.\nYou may have forgotten to import it.');
    }
  }

  var identifierName;
  var shouldForwardProp;
  var targetClassName;

  if (options !== undefined) {
    identifierName = options.label;
    targetClassName = options.target;
    shouldForwardProp = tag.__emotion_forwardProp && options.shouldForwardProp ? function (propName) {
      return tag.__emotion_forwardProp(propName) && // $FlowFixMe
      options.shouldForwardProp(propName);
    } : options.shouldForwardProp;
  }

  var isReal = tag.__emotion_real === tag;
  var baseTag = isReal && tag.__emotion_base || tag;
  var isStringTag = typeof baseTag === 'string';

  if (typeof shouldForwardProp !== 'function') {
    shouldForwardProp = isStringTag && // 96 is one less than the char code
    // for "a" so this is checking that
    // it's a lowercase character
    baseTag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;
  }

  return function () {
    var args = arguments;
    var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : [];

    if (identifierName !== undefined) {
      styles.push("label:" + identifierName + ";");
    }

    if (args[0] == null || args[0].raw === undefined) {
      styles.push.apply(styles, args);
    } else {
      styles.push(args[0][0]);
      var len = args.length;
      var i = 1;

      for (; i < len; i++) {
        styles.push(args[i], args[0][i]);
      }
    }

    var Styled = core.withCSSContext(function (props, context) {
      var className = '';
      var classInterpolations = [];
      var mergedProps = pickAssign(testAlwaysTrue, {}, props, {
        theme: props.theme || context.theme
      });

      if (typeof props.className === 'string') {
        className += utils.getRegisteredStyles(context.registered, classInterpolations, props.className);
      }

      var serialized = serialize.serializeStyles(context.registered, styles.concat(classInterpolations), mergedProps);
      var rules = utils.insertStyles(context, serialized, isStringTag);
      className += context.key + "-" + serialized.name;

      if (targetClassName !== undefined) {
        className += " " + targetClassName;
      }

      var ele = React.createElement(baseTag, // $FlowFixMe
      pickAssign(shouldForwardProp, {}, props, {
        className: className,
        ref: props.innerRef
      }));

      if (!utils.isBrowser && rules !== undefined) {
        var _ref;

        return React.createElement(React.Fragment, null, React.createElement("style", (_ref = {}, _ref["data-emotion-" + context.key] = serialized.name, _ref.dangerouslySetInnerHTML = {
          __html: rules
        }, _ref.nonce = context.sheet.nonce, _ref)), ele);
      }

      return ele;
    });
    Styled.displayName = identifierName !== undefined ? identifierName : "Styled(" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + ")";
    var FinalStyled = React.forwardRef(function (props, ref) {
      // this avoids creating a new object if there's no ref
      return React.createElement(Styled, ref === null ? props : pickAssign(testAlwaysTrue, {
        innerRef: ref
      }, props));
    });
    FinalStyled.__emotion_real = FinalStyled;
    FinalStyled.__emotion_base = baseTag;
    FinalStyled.__emotion_styles = styles;
    FinalStyled.__emotion_forwardProp = shouldForwardProp;
    Object.defineProperty(FinalStyled, 'toString', {
      value: function value() {
        if (targetClassName === undefined && process.env.NODE_ENV !== 'production') {
          return 'NO_COMPONENT_SELECTOR';
        } // $FlowFixMe


        return "." + targetClassName;
      }
    });

    FinalStyled.withComponent = function (nextTag, nextOptions) {
      return createStyled(nextTag, nextOptions !== undefined ? pickAssign(testAlwaysTrue, {}, options || {}, nextOptions) : options).apply(void 0, styles);
    };

    return FinalStyled;
  };
};

module.exports = createStyled;