"use strict";

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

var _tslib = require("tslib");

var _consoleComponents = require("@alicloud/console-components");

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

var _balloonIcon = _interopRequireDefault(require("./balloonIcon"));

var _balloonConfirm = _interopRequireDefault(require("./balloonConfirm"));

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

var enumTriggerType;

(function (enumTriggerType) {
  enumTriggerType["hover"] = "hover";
  enumTriggerType["focus"] = "focus";
  enumTriggerType["cllick"] = "click";
})(enumTriggerType || (enumTriggerType = {}));

var LPBalloon =
/** @class */
function (_super) {
  (0, _tslib.__extends)(LPBalloon, _super);

  function LPBalloon(props) {
    var _this = _super.call(this, props) || this;

    _this.state = {
      showCollapse: false,
      needAnalyse: true
    };
    _this.triggerBoxId = "triggerBox" + Math.random();
    return _this;
  }

  LPBalloon.prototype.componentDidMount = function () {
    if (this.props.overShowBalloon) {
      var maxLine = this.props.maxLine;
      var triggerBox = document.getElementById(this.triggerBoxId);
      var height = triggerBox.offsetHeight;
      var lineHeight = window.getComputedStyle(triggerBox, null).getPropertyValue('line-height');
      this.setState({
        showCollapse: height > maxLine * parseFloat(lineHeight),
        needAnalyse: false
      }); // window.addEventListener('resize', this.handleResize) //【后期】实现浏览器大小变化组件重算重叠值
    }
  };

  LPBalloon.prototype.componentWillReceiveProps = function (nextProps) {
    //如果没有设置只计算那么每次更新重新计算
    if (!this.props.onlyOnce && !nextProps.onlyOnce) {
      this.setState({
        showCollapse: false,
        needAnalyse: true
      });
    }
  }; //【后期】实现浏览器大小变化组件重算重叠值
  // componentWillUnmount() {
  //   window.removeEventListener('resize', this.handleResize)
  // }


  LPBalloon.prototype.componentDidUpdate = function () {
    if (this.props.overShowBalloon && this.state.needAnalyse) {
      var maxLine = this.props.maxLine;
      var triggerBox = document.getElementById(this.triggerBoxId);
      var height = triggerBox.offsetHeight;
      var lineHeight = window.getComputedStyle(triggerBox, null).getPropertyValue('line-height');
      var flag = height > maxLine * parseFloat(lineHeight);

      if (flag != this.state.showCollapse) {
        this.setState({
          showCollapse: flag,
          needAnalyse: false
        });
      }
    }
  };

  LPBalloon.prototype.render = function () {
    var _a = this.props,
        trigger = _a.trigger,
        children = _a.children,
        maxLine = _a.maxLine,
        triggerWidth = _a.triggerWidth,
        overShowBalloon = _a.overShowBalloon,
        onlyOnce = _a.onlyOnce,
        other = (0, _tslib.__rest)(_a, ["trigger", "children", "maxLine", "triggerWidth", "overShowBalloon", "onlyOnce"]);
    var dom = {};

    if (overShowBalloon) {
      dom = /*#__PURE__*/_react["default"].createElement("div", {
        id: this.triggerBoxId,
        style: {
          maxWidth: triggerWidth,
          wordBreak: "break-all",
          whiteSpace: "normal"
        }
      }, trigger);
    }

    if (this.state.showCollapse || !overShowBalloon) {
      //如果是字符串则可以控制显示几行；reactDom则没有该功能
      var triggerContent = typeof trigger === 'string' && overShowBalloon ? /*#__PURE__*/_react["default"].createElement("div", {
        style: triggerWidth ? {
          maxWidth: triggerWidth
        } : undefined,
        className: "lp-text-overflow lp-line-clamp-" + maxLine + " lp-balloon-trigger",
        id: this.triggerBoxId
      }, trigger) : triggerWidth ? /*#__PURE__*/_react["default"].createElement("div", {
        style: {
          maxWidth: triggerWidth
        }
      }, trigger) : trigger;
      dom = /*#__PURE__*/_react["default"].createElement(_consoleComponents.Balloon, (0, _tslib.__assign)({
        trigger: triggerContent
      }, other), children);
    }

    return dom;
  };

  return LPBalloon;
}(_react["default"].Component);

var _default = LPBalloon;
exports["default"] = _default;
LPBalloon.defaultProps = {
  align: "t",
  triggerType: enumTriggerType.hover,
  maxLine: 1,
  overShowBalloon: false,
  closable: false,
  autoFocus: false,
  onlyOnce: false
};
LPBalloon.Icon = _balloonIcon["default"];
LPBalloon.Confirm = _balloonConfirm["default"];