"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

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

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.TopbarExtra = exports.TopbarMain = exports.Topbar = exports.default = exports.Extra = exports.Main = exports.SubTitle = exports.Title = exports.headerHeight = void 0;

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

var _styledComponents = _interopRequireWildcard(require("styled-components"));

var _Partial = _interopRequireDefault(require("./Partial"));

var _utils = require("./utils");

function _templateObject9() {
  var data = (0, _taggedTemplateLiteral2.default)(["\n  ", ";\n"]);

  _templateObject9 = function _templateObject9() {
    return data;
  };

  return data;
}

function _templateObject8() {
  var data = (0, _taggedTemplateLiteral2.default)(["\n  ", ";\n  /* widget-normalize use class selector to reset css */\n  && {\n    a {\n      color: #333;\n    }\n  }\n"]);

  _templateObject8 = function _templateObject8() {
    return data;
  };

  return data;
}

function _templateObject7() {
  var data = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n"]);

  _templateObject7 = function _templateObject7() {
    return data;
  };

  return data;
}

function _templateObject6() {
  var data = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  height: ", "px;\n  line-height: ", "px;\n"]);

  _templateObject6 = function _templateObject6() {
    return data;
  };

  return data;
}

function _templateObject5() {
  var data = (0, _taggedTemplateLiteral2.default)(["\n  ", ";\n"]);

  _templateObject5 = function _templateObject5() {
    return data;
  };

  return data;
}

function _templateObject4() {
  var data = (0, _taggedTemplateLiteral2.default)(["\n  ", ";\n  ", "\n  overflow: hidden;\n  ", " {\n    flex-grow: ", ";\n  }\n"]);

  _templateObject4 = function _templateObject4() {
    return data;
  };

  return data;
}

function _templateObject3() {
  var data = (0, _taggedTemplateLiteral2.default)(["\n  /* widget-normalize use class selector to reset css */\n  && {\n    ", ";\n    font-size: 14px;\n    font-weight: 400;\n    color: #9b9ea0;\n    padding: 0 16px;\n    ", ";\n  }\n"]);

  _templateObject3 = function _templateObject3() {
    return data;
  };

  return data;
}

function _templateObject2() {
  var data = (0, _taggedTemplateLiteral2.default)(["\n  /* widget-normalize use class selector to reset css */\n  && {\n    ", ";\n    color: blue;\n    font-size: 28px;\n    font-weight: 500;\n    ", ";\n    /* \u8BBE\u7F6Eoverflow: hidden\u5BF9\u4E8Eflex\u5BBD\u5EA6\u7684\u8BA1\u7B97\u5F88\u91CD\u8981\uFF0C\u5C24\u5176\u662F\u5728title\u5F88\u957F\u7684\u60C5\u51B5\u4E0B\u3002\n    \u5B83\u8BA9\u6B64\u5BB9\u5668\u5728\u8BA1\u7B97flex\u5BBD\u5EA6\u7684\u65F6\u5019\u4E0D\u8003\u8651\u5176\u5B50\u8282\u70B9\uFF0C\u4EC5\u4EC5\u8003\u8651\u5269\u4F59\u5BBD\u5EA6\u3002 */\n    overflow-x: hidden;\n  }\n"]);

  _templateObject2 = function _templateObject2() {
    return data;
  };

  return data;
}

function _templateObject() {
  var data = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n  height: ", "px;\n  line-height: ", "px;\n  box-sizing: border-box;\n  vertical-align: middle;\n  margin: 0;\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

var headerHeight = 40;
exports.headerHeight = headerHeight;
var titleStyles = (0, _styledComponents.css)(_templateObject(), headerHeight, headerHeight);

var Title = _styledComponents.default.h3(_templateObject2(), titleStyles, (0, _utils.flexItem)());

exports.Title = Title;

var SubTitle = _styledComponents.default.h4(_templateObject3(), titleStyles, (0, _utils.flexItem)({
  flexShrink: 0
}));
/**
 * 仅当Title被截断时，我们允许Main和Title区域grow。
 * 如果在Title没被截断时，我们允许它们grow：
 * - Extra会永远靠右
 * - SubTitle就无法紧挨Title
 */


exports.SubTitle = SubTitle;

var Main = _styledComponents.default.div(_templateObject4(), function (_ref) {
  var shouldGrow = _ref.shouldGrow;
  return (0, _utils.flexItem)({
    flexGrow: shouldGrow ? 1 : 0
  });
}, (0, _utils.flexContainer)({
  flexWrap: 'nowrap',
  alignItems: 'center'
}), Title, function (_ref2) {
  var shouldGrow = _ref2.shouldGrow;
  return shouldGrow ? 1 : 0;
});

exports.Main = Main;

var Extra = _styledComponents.default.div(_templateObject5(), (0, _utils.flexItem)({
  flexShrink: 0
}));

exports.Extra = Extra;
var Header = (0, _styledComponents.default)(_Partial.default)(_templateObject6(), function (_ref3) {
  var alignLeft = _ref3.alignLeft;
  return (0, _utils.flexContainer)({
    justifyContent: alignLeft ? 'flex-start' : 'space-between'
  });
}, headerHeight, headerHeight);
var _default = Header;
exports.default = _default;
var Topbar = (0, _styledComponents.default)(_Partial.default)(_templateObject7(), function (_ref4) {
  var alignLeft = _ref4.alignLeft;
  return (0, _utils.flexContainer)({
    justifyContent: alignLeft ? 'flex-start' : 'space-between',
    alignItems: 'center'
  });
});
exports.Topbar = Topbar;

var TopbarMain = _styledComponents.default.div(_templateObject8(), (0, _utils.flexItem)());

exports.TopbarMain = TopbarMain;

var TopbarExtra = _styledComponents.default.div(_templateObject9(), (0, _utils.flexItem)());

exports.TopbarExtra = TopbarExtra;