"use strict";

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

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

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

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

var _react = _interopRequireWildcard(require("react"));

var _consoleComponentsTruncate = _interopRequireDefault(require("@alicloud/console-components-truncate"));

var PropTypes = _interopRequireWildcard(require("prop-types"));

var S = _interopRequireWildcard(require("./styles"));

var _BackArrow = _interopRequireDefault(require("./BackArrow"));

/**
 * @public
 */
var Header = function Header(_ref) {
  var breadcrumb = _ref.breadcrumb,
      className = _ref.className,
      style = _ref.style,
      childrenAlign = _ref.childrenAlign,
      children = _ref.children,
      title = _ref.title,
      subTitle = _ref.subTitle,
      hasBackArrow = _ref.hasBackArrow,
      renderBackArrow = _ref.renderBackArrow,
      onBackArrowClick = _ref.onBackArrowClick,
      breadcrumbExtra = _ref.breadcrumbExtra,
      breadcrumbExtraAlign = _ref.breadcrumbExtraAlign;

  var _useState = (0, _react.useState)(false),
      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
      isTitleOverflow = _useState2[0],
      setIsTitleOverflow = _useState2[1];

  return _react.default.createElement(_react.default.Fragment, null, (breadcrumb || breadcrumbExtra) && _react.default.createElement(S.HeaderTopbar, {
    alignLeft: breadcrumbExtraAlign === 'left'
  }, _react.default.createElement(S.HeaderTopbarMain, null, breadcrumb), _react.default.createElement(S.HeaderTopbarExtra, null, breadcrumbExtra)), (hasBackArrow || title || subTitle || children) && _react.default.createElement(S.Header, {
    className: className,
    style: style,
    alignLeft: childrenAlign === 'left'
  }, _react.default.createElement(S.HeaderMain, {
    shouldGrow: isTitleOverflow
  }, hasBackArrow && _react.default.createElement(_BackArrow.default, {
    render: renderBackArrow,
    onClick: onBackArrowClick
  }), title && _react.default.createElement(S.HeaderTitle, null, _react.default.createElement(_consoleComponentsTruncate.default // 充满弹性容器
  , {
    style: {
      width: '100%'
    },
    type: "width",
    threshold: "auto",
    align: "b",
    tooltipMaxWidth: 500,
    isOverflowChange: function isOverflowChange(newIsOverflow) {
      setIsTitleOverflow(newIsOverflow);
    }
  }, title)), subTitle && _react.default.createElement(S.HeaderSubTitle, null, subTitle)), children && _react.default.createElement(S.HeaderExtra, null, children)));
};

Header.propTypes = {
  className: PropTypes.string,
  style: PropTypes.objectOf(PropTypes.any),
  children: PropTypes.node,
  hasBackArrow: PropTypes.bool,
  renderBackArrow: PropTypes.func,
  onBackArrowClick: PropTypes.func,
  title: PropTypes.node,
  subTitle: PropTypes.node,
  breadcrumb: PropTypes.node,
  childrenAlign: PropTypes.oneOf(['left', 'right'])
};
var _default = Header;
exports.default = _default;