'use strict';

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

var vue = require('vue');
require('../../menu/index.js');
require('../../spin/index.js');
var MentionsContext = require('./MentionsContext.js');
var Menu = require('../../menu/src/Menu.js');
var MenuItem = require('../../menu/src/MenuItem.js');
var Spin = require('../../spin/Spin.js');

function noop() {
}
var DropdownMenu = /* @__PURE__ */ vue.defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "DropdownMenu",
  props: {
    prefixCls: String,
    options: {
      type: Array,
      default: () => []
    }
  },
  setup(props, {
    slots
  }) {
    const {
      activeIndex,
      setActiveIndex,
      selectOption,
      onFocus = noop,
      loading
    } = vue.inject(MentionsContext.default, {
      activeIndex: vue.shallowRef(),
      loading: vue.shallowRef(false)
    });
    let timeoutId;
    const onMousedown = (e) => {
      clearTimeout(timeoutId);
      timeoutId = setTimeout(() => {
        onFocus(e);
      });
    };
    vue.onBeforeUnmount(() => {
      clearTimeout(timeoutId);
    });
    return () => {
      const {
        prefixCls,
        options
      } = props;
      const activeOption = options[activeIndex.value] || {};
      return vue.createVNode(Menu.default, {
        "prefixCls": `${prefixCls}-menu`,
        "activeKey": activeOption.value,
        "onSelect": ({
          key
        }) => {
          const option = options.find(({
            value
          }) => value === key);
          selectOption(option);
        },
        "onMousedown": onMousedown
      }, {
        default: () => [!loading.value && options.map((option, index) => {
          const {
            value,
            disabled,
            label = option.value,
            class: className,
            style
          } = option;
          return vue.createVNode(MenuItem.default, {
            "key": value,
            "disabled": disabled,
            "onMouseenter": () => {
              setActiveIndex(index);
            },
            "class": className,
            "style": style
          }, {
            default: () => {
              var _a, _b;
              return [(_b = (_a = slots.option) == null ? void 0 : _a.call(slots, option)) != null ? _b : typeof label === "function" ? label(option) : label];
            }
          });
        }), !loading.value && options.length === 0 ? vue.createVNode(MenuItem.default, {
          "key": "notFoundContent",
          "disabled": true
        }, {
          default: () => {
            var _a;
            return [(_a = slots.notFoundContent) == null ? void 0 : _a.call(slots)];
          }
        }) : null, loading.value && vue.createVNode(MenuItem.default, {
          "key": "loading",
          "disabled": true
        }, {
          default: () => [vue.createVNode(Spin.default, {
            "size": "small"
          }, null)]
        })]
      });
    };
  }
});

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