'use strict';

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

var vue = require('vue');
require('../../../utils/index.cjs');
require('../../../vue-components/vc-overflow/index.cjs');
var index = require('../../tooltip/index.cjs');
var useMenuContext = require('./hooks/useMenuContext.cjs');
var useKeyPath = require('./hooks/useKeyPath.cjs');
var useDirectionStyle = require('./hooks/useDirectionStyle.cjs');
var props = require('./props.cjs');
var log = require('../../../utils/log.cjs');
var KeyCode = require('../../../utils/KeyCode.cjs');
var is = require('../../../utils/is.cjs');
var props$1 = require('../../../utils/vue/props.cjs');
var Overflow = require('../../../vue-components/vc-overflow/src/Overflow.cjs');
var vnode = require('../../../utils/vue/vnode.cjs');

let indexGuid = 0;
var AMenuItem = /* @__PURE__ */ vue.defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "AMenuItem",
  inheritAttrs: false,
  props: props.menuItemProps(),
  slots: Object,
  setup(props, {
    slots,
    emit,
    attrs
  }) {
    const instance = vue.getCurrentInstance();
    const isMeasure = useKeyPath.useMeasure();
    const key = typeof instance.vnode.key === "symbol" ? String(instance.vnode.key) : instance.vnode.key;
    log.devWarning(typeof instance.vnode.key !== "symbol", "MenuItem", `MenuItem \`:key="${String(key)}"\` not support Symbol type`);
    const eventKey = `menu_item_${++indexGuid}_$$_${key}`;
    const {
      parentEventKeys,
      parentKeys
    } = useKeyPath.useInjectKeyPath();
    const {
      prefixCls,
      activeKeys,
      disabled,
      changeActiveKeys,
      rtl,
      inlineCollapsed,
      siderCollapsed,
      onItemClick,
      selectedKeys,
      registerMenuInfo,
      unRegisterMenuInfo
    } = useMenuContext.useInjectMenu();
    const firstLevel = useMenuContext.useInjectFirstLevel();
    const isActive = vue.shallowRef(false);
    const keysPath = vue.computed(() => {
      return [...parentKeys.value, key];
    });
    const menuInfo = {
      eventKey,
      key,
      parentEventKeys,
      parentKeys,
      isLeaf: true
    };
    registerMenuInfo(eventKey, menuInfo);
    vue.onBeforeUnmount(() => {
      unRegisterMenuInfo(eventKey);
    });
    vue.watch(activeKeys, () => {
      isActive.value = !!activeKeys.value.find((val) => val === key);
    }, {
      immediate: true
    });
    const mergedDisabled = vue.computed(() => disabled.value || props.disabled);
    const selected = vue.computed(() => selectedKeys.value.includes(key));
    const classNames = vue.computed(() => {
      const itemCls = `${prefixCls.value}-item`;
      return {
        [`${itemCls}`]: true,
        [`${itemCls}-danger`]: props.danger,
        [`${itemCls}-active`]: isActive.value,
        [`${itemCls}-selected`]: selected.value,
        [`${itemCls}-disabled`]: mergedDisabled.value
      };
    });
    const getEventInfo = (e) => {
      return {
        key,
        eventKey,
        keyPath: keysPath.value,
        eventKeyPath: [...parentEventKeys.value, eventKey],
        domEvent: e,
        item: {
          ...props,
          ...attrs
        }
      };
    };
    const onInternalClick = (e) => {
      if (mergedDisabled.value)
        return;
      const info = getEventInfo(e);
      emit("click", e);
      onItemClick(info);
    };
    const onMouseEnter = (event) => {
      if (!mergedDisabled.value) {
        changeActiveKeys(keysPath.value);
        emit("mouseenter", event);
      }
    };
    const onMouseLeave = (event) => {
      if (!mergedDisabled.value) {
        changeActiveKeys([]);
        emit("mouseleave", event);
      }
    };
    const onInternalKeyDown = (e) => {
      emit("keydown", e);
      if (e.which === KeyCode.KeyCode.ENTER) {
        const info = getEventInfo(e);
        emit("click", e);
        onItemClick(info);
      }
    };
    const onInternalFocus = (e) => {
      changeActiveKeys(keysPath.value);
      emit("focus", e);
    };
    const renderItemChildren = (icon, children) => {
      const wrapNode = vue.createVNode("span", {
        "class": `${prefixCls.value}-title-content`
      }, [children]);
      if (!icon || is.isValidElement(children) && children.type === "span") {
        if (children && inlineCollapsed.value && firstLevel && typeof children === "string") {
          return vue.createVNode("div", {
            "class": `${prefixCls.value}-inline-collapsed-noicon`
          }, [children.charAt(0)]);
        }
      }
      return wrapNode;
    };
    const directionStyle = useDirectionStyle.default(vue.computed(() => keysPath.value.length));
    return () => {
      var _a, _b, _c, _d, _e;
      if (isMeasure)
        return null;
      const title = (_b = props.title) != null ? _b : (_a = slots.title) == null ? void 0 : _a.call(slots);
      const children = props$1.flattenChildren((_c = slots.default) == null ? void 0 : _c.call(slots));
      const childrenLength = children.length;
      let tooltipTitle = title;
      if (typeof title === "undefined")
        tooltipTitle = firstLevel && childrenLength ? children : "";
      else if (title === false)
        tooltipTitle = "";
      const tooltipProps = {
        title: tooltipTitle
      };
      if (!siderCollapsed.value && !inlineCollapsed.value) {
        tooltipProps.title = null;
        tooltipProps.open = false;
      }
      const optionRoleProps = {};
      if (props.role === "option")
        optionRoleProps["aria-selected"] = selected.value;
      const icon = (_e = props.icon) != null ? _e : (_d = slots.icon) == null ? void 0 : _d.call(slots, props);
      return vue.createVNode(index.Tooltip, {
        ...tooltipProps,
        "placement": rtl.value ? "left" : "right",
        "overlayClassName": `${prefixCls.value}-inline-collapsed-tooltip`
      }, {
        default: () => [vue.createVNode(Overflow.default.Item, {
          "component": "li",
          ...attrs,
          "id": props.id,
          "style": {
            ...attrs.style || {},
            ...directionStyle.value
          },
          "class": [classNames.value, {
            [`${attrs.class}`]: !!attrs.class,
            [`${prefixCls.value}-item-only-child`]: (icon ? childrenLength + 1 : childrenLength) === 1
          }],
          "role": props.role || "menuitem",
          "tabindex": props.disabled ? null : -1,
          "data-menu-id": key,
          "aria-disabled": props.disabled,
          ...optionRoleProps,
          "onMouseenter": onMouseEnter,
          "onMouseleave": onMouseLeave,
          "onClick": onInternalClick,
          "onKeydown": onInternalKeyDown,
          "onFocus": onInternalFocus,
          "title": typeof title === "string" ? title : void 0
        }, {
          default: () => [vnode.cloneElement(typeof icon === "function" ? icon(props.originItemValue) : icon, {
            class: `${prefixCls.value}-item-icon`
          }, false), renderItemChildren(icon, children)]
        })]
      });
    };
  }
});

exports.default = AMenuItem;
//# sourceMappingURL=MenuItem.cjs.map
