/**
 * tdesign v0.41.7
 * (c) 2022 tdesign
 * @license MIT
 */

'use strict';

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

var _typeof = require('@babel/runtime/helpers/typeof');
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var Vue = require('vue');
var core = require('@popperjs/core');
var config = require('../config.js');
var utils_classnames = require('../utils/classnames.js');
var utils_dom = require('../utils/dom.js');
var utils_renderTnode = require('../utils/render-tnode.js');
var utils_helper = require('../utils/helper.js');
var _common_js_utils_setStyle = require('../_common/js/utils/set-style.js');
var popup_props = require('./props.js');
var popup_container = require('./container.js');
require('raf');
require('lodash/isString');
require('../utils/easing.js');
require('@babel/runtime/helpers/objectWithoutProperties');
require('@babel/runtime/helpers/slicedToArray');
require('lodash/camelCase');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var _typeof__default = /*#__PURE__*/_interopDefaultLegacy(_typeof);
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
var Vue__default = /*#__PURE__*/_interopDefaultLegacy(Vue);

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
var name = "".concat(config.prefix, "-popup");
var showTimeout = 250;
var hideTimeout = 150;
var triggers = ["click", "hover", "focus", "context-menu"];

function getPopperPlacement(placement) {
  return placement.replace(/-(left|top)$/, "-start").replace(/-(right|bottom)$/, "-end");
}

var Popup = Vue__default["default"].extend({
  name: "TPopup",
  provide: function provide() {
    return {
      popup: this
    };
  },
  inject: {
    popup: {
      "default": void 0
    }
  },
  props: _objectSpread(_objectSpread({}, popup_props["default"]), {}, {
    expandAnimation: {
      type: Boolean
    }
  }),
  data: function data() {
    return {
      name: name,
      popper: null,
      timeout: null,
      hasDocumentEvent: false,
      visibleState: 0,
      mouseInRange: false,
      contentClicked: false,
      triggerClicked: false
    };
  },
  computed: {
    overlayClasses: function overlayClasses() {
      var _ref;

      return ["".concat(name, "__content"), (_ref = {}, _defineProperty__default["default"](_ref, "".concat(name, "__content--text"), this.content === "string"), _defineProperty__default["default"](_ref, "".concat(name, "__content--arrow"), this.showArrow), _defineProperty__default["default"](_ref, utils_classnames["default"].STATUS.disabled, this.disabled), _ref), this.overlayClassName];
    },
    hasTrigger: function hasTrigger() {
      var _this = this;

      return triggers.reduce(function (map, trigger) {
        return _objectSpread(_objectSpread({}, map), {}, _defineProperty__default["default"]({}, trigger, _this.trigger.includes(trigger)));
      }, {});
    }
  },
  watch: {
    visible: function visible(_visible) {
      var _this2 = this;

      var hasTrigger = this.hasTrigger,
          triggerEl = this.$el;

      if (_visible) {
        this.preventClosing(true);

        if (!this.hasDocumentEvent) {
          utils_dom.on(document, "click", this.handleDocumentClick);
          this.hasDocumentEvent = true;
        }

        if (triggerEl && hasTrigger.focus) {
          utils_dom.once(triggerEl, "keydown", function (ev) {
            if (ev.code === "Escape") {
              _this2.handleClose({
                trigger: "keydown-esc"
              });
            }
          });
        }
      } else {
        this.preventClosing(false);
        utils_dom.off(document, "click", this.handleDocumentClick);
        this.hasDocumentEvent = false;
        this.mouseInRange = false;
      }
    },
    overlayStyle: function overlayStyle() {
      if (this.popper) {
        this.popper.update();
        this.updateOverlayStyle();
      }
    },
    contentClicked: function contentClicked(clicked) {
      if (this.popup) {
        this.popup.contentClicked = clicked;
      }
    }
  },
  mounted: function mounted() {
    var _this3 = this;

    var hasTrigger = this.hasTrigger,
        triggerEl = this.$el;

    if (hasTrigger.hover) {
      utils_dom.on(triggerEl, "mouseenter", function () {
        return _this3.handleOpen({
          trigger: "trigger-element-hover"
        });
      });
      utils_dom.on(triggerEl, "mouseleave", function () {
        return _this3.handleClose({
          trigger: "trigger-element-hover"
        });
      });
    } else if (hasTrigger.focus) {
      utils_dom.on(triggerEl, "focusin", function () {
        return _this3.handleOpen({
          trigger: "trigger-element-focus"
        });
      });
      utils_dom.on(triggerEl, "focusout", function () {
        return _this3.handleClose({
          trigger: "trigger-element-blur"
        });
      });
    } else if (hasTrigger.click) {
      utils_dom.on(triggerEl, "click", function (e) {
        _this3.visibleState = 0;

        _this3.handleToggle({
          e: e,
          trigger: "trigger-element-click"
        });

        if (utils_helper.getIEVersion() < 11) {
          _this3.handleDocumentClick();
        }
      });
    } else if (hasTrigger["context-menu"]) {
      utils_dom.on(triggerEl, "contextmenu", function (e) {
        e.preventDefault();
        e.button === 2 && _this3.handleToggle({
          trigger: "context-menu"
        });
      });
    }

    if (!hasTrigger["context-menu"]) {
      utils_dom.on(triggerEl, "click", function () {
        _this3.triggerClicked = true;
      });
    }
  },
  updated: function updated() {
    var _this$$refs$container;

    (_this$$refs$container = this.$refs.container) === null || _this$$refs$container === void 0 ? void 0 : _this$$refs$container.updateContent();
  },
  destroyed: function destroyed() {
    this.destroyPopper();
  },
  methods: {
    createPopper: function createPopper() {
      var _this$popper,
          _this4 = this;

      var triggerEl = this.$el;
      var popperEl = this.$refs.popper;
      if (!popperEl) return;
      (_this$popper = this.popper) === null || _this$popper === void 0 ? void 0 : _this$popper.destroy();
      this.popper = core.createPopper(triggerEl, popperEl, {
        modifiers: utils_helper.getIEVersion() > 9 ? [] : [{
          name: "computeStyles",
          options: {
            gpuAcceleration: false
          }
        }],
        placement: getPopperPlacement(this.placement),
        onFirstUpdate: function onFirstUpdate() {
          _this4.$nextTick(_this4.updatePopper);
        }
      });
    },
    updatePopper: function updatePopper() {
      if (this.popper) {
        this.popper.update();
        return;
      }

      this.createPopper();
    },
    updateOverlayStyle: function updateOverlayStyle() {
      var _this$$refs;

      var overlayStyle = this.overlayStyle;
      var triggerEl = this.$el;
      var overlayEl = (_this$$refs = this.$refs) === null || _this$$refs === void 0 ? void 0 : _this$$refs.overlay;
      if (!triggerEl || !overlayEl) return;

      if (typeof overlayStyle === "function") {
        _common_js_utils_setStyle["default"](overlayEl, overlayStyle(triggerEl, overlayEl));
      } else if (_typeof__default["default"](overlayStyle) === "object") {
        _common_js_utils_setStyle["default"](overlayEl, overlayStyle);
      }
    },
    destroyPopper: function destroyPopper() {
      var _this$popper2;

      (_this$popper2 = this.popper) === null || _this$popper2 === void 0 ? void 0 : _this$popper2.destroy();
      this.popper = null;

      if (this.destroyOnClose) {
        var _this$$refs$container2;

        (_this$$refs$container2 = this.$refs.container) === null || _this$$refs$container2 === void 0 ? void 0 : _this$$refs$container2.unmountContent();
      }
    },
    handleToggle: function handleToggle(context) {
      this.emitPopVisible(!this.visible, context);
    },
    handleOpen: function handleOpen(context) {
      var _this5 = this;

      clearTimeout(this.timeout);
      this.timeout = setTimeout(function () {
        _this5.emitPopVisible(true, context);
      }, this.hasTrigger.click ? 0 : showTimeout);
    },
    handleClose: function handleClose(context) {
      var _this6 = this;

      clearTimeout(this.timeout);
      this.timeout = setTimeout(function () {
        _this6.emitPopVisible(false, context);
      }, this.hasTrigger.click ? 0 : hideTimeout);
    },
    handleDocumentClick: function handleDocumentClick() {
      var _this7 = this;

      if (this.contentClicked || this.triggerClicked) {
        this.triggerClicked = false;
        setTimeout(function () {
          _this7.contentClicked = false;
        });
        return;
      }

      this.visibleState = 0;
      this.emitPopVisible(false, {
        trigger: "document"
      });
    },
    emitPopVisible: function emitPopVisible(visible, context) {
      if (this.disabled || visible === this.visible) return;
      if (!visible && this.visibleState > 1) return;
      if (visible && this.mouseInRange) return;
      this.$emit("visible-change", visible, context);

      if (typeof this.onVisibleChange === "function") {
        this.onVisibleChange(visible, context);
      }
    },
    onMouseEnter: function onMouseEnter() {
      this.mouseInRange = true;
      this.handleOpen({});
    },
    onMouseLeave: function onMouseLeave(ev) {
      if (this.visibleState > 1) {
        var rect = this.$refs.popper.getBoundingClientRect();
        if (ev.x > rect.x && ev.x < rect.x + rect.width && ev.y > rect.y && ev.y < rect.y + rect.height) return;
      }

      this.mouseInRange = false;
      this.handleClose({});
      var parent = this.popup;

      if (parent !== null && parent !== void 0 && parent.mouseInRange) {
        parent.onMouseLeave(ev);
      }
    },
    onBeforeEnter: function onBeforeEnter() {
      if (this.visible) {
        this.updatePopper();
      }
    },
    onAfterEnter: function onAfterEnter() {
      if (this.visible) {
        this.updatePopper();
      }
    },
    preventClosing: function preventClosing(preventing) {
      var parent = this.popup;
      parent === null || parent === void 0 ? void 0 : parent.preventClosing(preventing);

      if (preventing) {
        this.visibleState += 1;
      } else if (this.visibleState) {
        this.visibleState -= 1;

        if (!this.visibleState) {
          this.emitPopVisible(false, {});

          if (parent !== null && parent !== void 0 && parent.hasTrigger.hover && !(parent !== null && parent !== void 0 && parent.mouseInRange)) {
            parent.emitPopVisible(false, {});
          }
        }
      }
    }
  },
  render: function render(h) {
    var _this8 = this;

    var visible = this.visible,
        destroyOnClose = this.destroyOnClose,
        hasTrigger = this.hasTrigger,
        onScroll = this.onScroll;
    var ref = utils_renderTnode.renderContent(this, "default", "triggerElement");
    var content = utils_renderTnode.renderTNodeJSX(this, "content");
    var hidePopup = this.hideEmptyPopup && ["", void 0, null].includes(content);
    var overlay = visible || !destroyOnClose ? h("div", {
      "class": name,
      ref: "popper",
      style: destroyOnClose && hidePopup ? {
        display: "none"
      } : void 0,
      directives: destroyOnClose ? void 0 : [{
        name: "show",
        rawName: "v-show",
        value: visible && !hidePopup,
        expression: "visible"
      }],
      on: _objectSpread({
        mousedown: function mousedown() {
          _this8.contentClicked = true;
        },
        mouseup: function mouseup() {
          setTimeout(function () {
            _this8.contentClicked = false;
          });
        }
      }, hasTrigger.hover && {
        mouseenter: this.onMouseEnter,
        mouseleave: this.onMouseLeave
      })
    }, [h("div", {
      "class": this.overlayClasses,
      ref: "overlay",
      on: onScroll ? {
        scroll: function scroll(e) {
          onScroll({
            e: e
          });
        }
      } : void 0
    }, [content, this.showArrow && h("div", {
      "class": "".concat(name, "__arrow")
    })])]) : null;
    return h(popup_container["default"], {
      "ref": "container",
      "on": {
        "contentMounted": function contentMounted() {
          if (visible) {
            _this8.updatePopper();

            _this8.updateOverlayStyle();
          }
        },
        "resize": function resize() {
          if (visible) {
            _this8.updatePopper();
          }
        }
      },
      "attrs": {
        "parent": this,
        "visible": visible,
        "attach": this.attach
      }
    }, [h("transition", {
      "slot": "content",
      "attrs": {
        "name": this.expandAnimation ? "".concat(name, "--animation-expand") : "".concat(name, "--animation"),
        "appear": true
      },
      "on": {
        "beforeEnter": this.onBeforeEnter,
        "afterEnter": this.onAfterEnter,
        "afterLeave": this.destroyPopper
      }
    }, [overlay]), ref]);
  }
});

exports["default"] = Popup;
//# sourceMappingURL=popup.js.map
