"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const form = require("../../../constants/form.js");
const shared_esmBundler = require("../../../../../@vue/shared/dist/shared.esm-bundler.js");
const index$4 = require("../../../hooks/use-calc-input-width/index.js");
const index$5 = require("../../../hooks/use-id/index.js");
const index$1 = require("../../icon/index.js");
const index$2 = require("../../tooltip/index.js");
const index = require("../../../directives/click-outside/index.js");
const index$3 = require("../../tag/index.js");
const defaults = require("./defaults.js");
const token = require("./token.js");
const selectDropdown = require("./select-dropdown.js");
const useSelect = require("./useSelect.js");
const vue = require("vue");
var select_vue_vue_type_script_lang_default = vue.defineComponent({
  name: "ElSelectV2",
  components: {
    ElSelectMenu: selectDropdown.default,
    ElTag: index$3.ElTag,
    ElTooltip: index$2.ElTooltip,
    ElIcon: index$1.ElIcon
  },
  directives: { ClickOutside: index.default },
  props: defaults.selectV2Props,
  emits: defaults.selectV2Emits,
  setup(props, { emit }) {
    const modelValue = vue.computed(() => {
      const { modelValue: rawModelValue, multiple } = props;
      const fallback = multiple ? [] : void 0;
      if (shared_esmBundler.isArray(rawModelValue)) return multiple ? rawModelValue : fallback;
      return multiple ? fallback : rawModelValue;
    });
    const API = useSelect.default(vue.reactive({
      ...vue.toRefs(props),
      modelValue
    }), emit);
    const { calculatorRef, inputStyle } = index$4.useCalcInputWidth();
    const contentId = index$5.useId();
    vue.provide(token.selectV2InjectionKey, {
      props: vue.reactive({
        ...vue.toRefs(props),
        height: API.popupHeight,
        modelValue
      }),
      expanded: API.expanded,
      tooltipRef: API.tooltipRef,
      contentId,
      onSelect: API.onSelect,
      onHover: API.onHover,
      onKeyboardNavigate: API.onKeyboardNavigate,
      onKeyboardSelect: API.onKeyboardSelect
    });
    const selectedLabel = vue.computed(() => {
      if (!props.multiple) return API.states.selectedLabel;
      return API.states.cachedOptions.map((i) => API.getLabel(i));
    });
    return {
      ...API,
      modelValue,
      selectedLabel,
      calculatorRef,
      inputStyle,
      contentId,
      BORDER_HORIZONTAL_WIDTH: form.BORDER_HORIZONTAL_WIDTH
    };
  }
});
exports.default = select_vue_vue_type_script_lang_default;
