'use strict';

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

var vue = require('vue');
require('../../vc-trigger/index.js');
var raf = require('../../_util/raf.js');
var classNames = require('../../_util/classNames.js');
var transition = require('../../_util/components/transition.js');
var useMenuContext = require('./hooks/useMenuContext.js');
var placements = require('./placements.js');
var Trigger = require('../../vc-trigger/Trigger.js');

const popupPlacementMap = {
  "horizontal": "bottomLeft",
  "vertical": "rightTop",
  "vertical-left": "rightTop",
  "vertical-right": "leftTop"
};
var PopupTrigger = /* @__PURE__ */ vue.defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "PopupTrigger",
  inheritAttrs: false,
  props: {
    prefixCls: String,
    mode: String,
    visible: Boolean,
    // popup: React.ReactNode;
    popupClassName: String,
    popupOffset: Array,
    disabled: Boolean,
    onVisibleChange: Function
  },
  slots: Object,
  emits: ["visibleChange"],
  setup(props, {
    slots,
    emit
  }) {
    const innerVisible = vue.shallowRef(false);
    const {
      getPopupContainer,
      rtl,
      subMenuOpenDelay,
      subMenuCloseDelay,
      builtinPlacements,
      triggerSubMenuAction,
      forceSubMenuRender,
      motion,
      defaultMotions,
      rootClassName
    } = useMenuContext.useInjectMenu();
    const forceRender = useMenuContext.useInjectForceRender();
    const placement = vue.computed(() => rtl.value ? {
      ...placements.placementsRtl,
      ...builtinPlacements.value
    } : {
      ...placements.placements,
      ...builtinPlacements.value
    });
    const popupPlacement = vue.computed(() => popupPlacementMap[props.mode]);
    const visibleRef = vue.shallowRef();
    vue.watch(() => props.visible, (visible) => {
      raf.default.cancel(visibleRef.value);
      visibleRef.value = raf.default(() => {
        innerVisible.value = visible;
      });
    }, {
      immediate: true
    });
    vue.onBeforeUnmount(() => {
      raf.default.cancel(visibleRef.value);
    });
    const onVisibleChange = (visible) => {
      emit("visibleChange", visible);
    };
    const mergedMotion = vue.computed(() => {
      var _a, _b;
      const m = motion.value || ((_a = defaultMotions.value) == null ? void 0 : _a[props.mode]) || ((_b = defaultMotions.value) == null ? void 0 : _b.other);
      const res = typeof m === "function" ? m() : m;
      return res ? transition.getTransitionProps(res.name, {
        css: true
      }) : void 0;
    });
    return () => {
      const {
        prefixCls,
        popupClassName,
        mode,
        popupOffset,
        disabled
      } = props;
      return vue.createVNode(Trigger.default, {
        "prefixCls": prefixCls,
        "popupClassName": classNames.default(`${prefixCls}-popup`, {
          [`${prefixCls}-rtl`]: rtl.value
        }, popupClassName, rootClassName.value),
        "stretch": mode === "horizontal" ? "minWidth" : null,
        "getPopupContainer": getPopupContainer.value,
        "builtinPlacements": placement.value,
        "popupPlacement": popupPlacement.value,
        "popupVisible": innerVisible.value,
        "popupAlign": popupOffset && {
          offset: popupOffset
        },
        "action": disabled ? [] : [triggerSubMenuAction.value],
        "mouseEnterDelay": subMenuOpenDelay.value,
        "mouseLeaveDelay": subMenuCloseDelay.value,
        "onPopupVisibleChange": onVisibleChange,
        "forceRender": forceRender || forceSubMenuRender.value,
        "popupAnimation": mergedMotion.value
      }, {
        popup: slots.popup,
        default: slots.default
      });
    };
  }
});

exports.default = PopupTrigger;
//# sourceMappingURL=PopupTrigger.js.map
