vft 0.0.369 → 0.0.370

package/lib/components/select/useSelect.cjs

@@ -1,788 +1 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-require("../form/index.cjs");
-const aria = require("../../constants/aria.cjs");
-const event = require("../../constants/event.cjs");
-const core = require("@vueuse/core");
-const utils = require("@vft/utils");
-const error = require("../../utils/error.cjs");
-require("../config-provider/hooks/use-global-config.cjs");
-const vue = require("vue");
-const dataHelper = require("../../utils/vue/data-helper.cjs");
-const lodashEs = require("lodash-es");
-const index = require("../../hooks/use-namespace/index.cjs");
-require("../../hooks/use-model-toggle/index.cjs");
-require("@popperjs/core");
-require("../../hooks/use-z-index/index.cjs");
-const index$2 = require("../../hooks/use-composition/index.cjs");
-const index$3 = require("../../hooks/use-focus-controller/index.cjs");
-const index$1 = require("../../hooks/use-empty-values/index.cjs");
-const useAllowCreate = require("./useAllowCreate.cjs");
-const useProps = require("./useProps.cjs");
-const useFormItem = require("../form/hooks/use-form-item.cjs");
-const useFormCommonProps = require("../form/hooks/use-form-common-props.cjs");
-const useSelect = (props, emit) => {
-  const nsSelect = index.useNamespace("select");
-  const nsInput = index.useNamespace("input");
-  const { form: elForm, formItem: elFormItem } = useFormItem.useFormItem();
-  const { inputId } = useFormItem.useFormItemInputId(props, {
-    formItemContext: elFormItem
-  });
-  const { aliasProps, getLabel, getValue, getDisabled, getOptions } = useProps.useProps(props);
-  const { valueOnClear, isEmptyValue } = index$1.useEmptyValues(props);
-  const states = vue.reactive({
-    inputValue: "",
-    cachedOptions: [],
-    createdOptions: [],
-    hoveringIndex: -1,
-    inputHovering: false,
-    selectionWidth: 0,
-    collapseItemWidth: 0,
-    previousQuery: null,
-    previousValue: void 0,
-    selectedLabel: "",
-    menuVisibleOnFocus: false,
-    isBeforeHide: false
-  });
-  const popperSize = vue.ref(-1);
-  const selectRef = vue.ref();
-  const selectionRef = vue.ref();
-  const tooltipRef = vue.ref();
-  const tagTooltipRef = vue.ref();
-  const inputRef = vue.ref();
-  const prefixRef = vue.ref();
-  const suffixRef = vue.ref();
-  const menuRef = vue.ref();
-  const tagMenuRef = vue.ref();
-  const collapseItemRef = vue.ref();
-  const {
-    isComposing,
-    handleCompositionStart,
-    handleCompositionEnd,
-    handleCompositionUpdate
-  } = index$2.useComposition({
-    afterComposition: (e) => onInput(e)
-  });
-  const selectDisabled = vue.computed(() => props.disabled || !!elForm?.disabled);
-  const { wrapperRef, isFocused, handleBlur } = index$3.useFocusController(inputRef, {
-    disabled: selectDisabled,
-    afterFocus() {
-      if (props.automaticDropdown && !expanded.value) {
-        expanded.value = true;
-        states.menuVisibleOnFocus = true;
-      }
-    },
-    beforeBlur(event2) {
-      return tooltipRef.value?.isFocusInsideContent(event2) || tagTooltipRef.value?.isFocusInsideContent(event2);
-    },
-    afterBlur() {
-      expanded.value = false;
-      states.menuVisibleOnFocus = false;
-      if (props.validateEvent) {
-        elFormItem?.validate?.("blur").catch((err) => error.debugWarn(err));
-      }
-    }
-  });
-  const allOptions = vue.computed(() => filterOptions(""));
-  const hasOptions = vue.computed(() => {
-    if (props.loading) return false;
-    return props.options.length > 0 || states.createdOptions.length > 0;
-  });
-  const filteredOptions = vue.ref([]);
-  const expanded = vue.ref(false);
-  const needStatusIcon = vue.computed(() => elForm?.statusIcon ?? false);
-  const popupHeight = vue.computed(() => {
-    const totalHeight = filteredOptions.value.length * props.itemHeight;
-    return totalHeight > props.height ? props.height : totalHeight;
-  });
-  const hasModelValue = vue.computed(() => {
-    return props.multiple ? utils.isArray(props.modelValue) && props.modelValue.length > 0 : !isEmptyValue(props.modelValue);
-  });
-  const showClearBtn = vue.computed(() => {
-    return props.clearable && !selectDisabled.value && states.inputHovering && hasModelValue.value;
-  });
-  const iconComponent = vue.computed(
-    () => props.remote && props.filterable ? "" : "icon-arrow-down"
-  );
-  const iconReverse = vue.computed(
-    () => iconComponent.value && nsSelect.is("reverse", expanded.value)
-  );
-  const validateState = vue.computed(() => elFormItem?.validateState || "");
-  const validateIcon = "validateIcon";
-  const debounce = vue.computed(() => props.remote ? 300 : 0);
-  const emptyText = vue.computed(() => {
-    if (props.loading) {
-      return props.loadingText || "加载中";
-    } else {
-      if (props.remote && !states.inputValue && !hasOptions.value) return false;
-      if (props.filterable && states.inputValue && hasOptions.value && filteredOptions.value.length === 0) {
-        return props.noMatchText || "无匹配数据";
-      }
-      if (!hasOptions.value) {
-        return props.noDataText || "暂无数据";
-      }
-    }
-    return null;
-  });
-  const filterOptions = (query) => {
-    const regexp = new RegExp(dataHelper.escapeStringRegexp(query), "i");
-    const { filterMethod, remoteMethod } = vue.toRaw(props);
-    const isFilterMethodValid = props.filterable && utils.isFunction(filterMethod);
-    const isRemoteMethodValid = props.filterable && props.remote && utils.isFunction(remoteMethod);
-    const isValidOption = (o) => {
-      if (isFilterMethodValid || isRemoteMethodValid) return true;
-      return query ? regexp.test(getLabel(o) || "") : true;
-    };
-    if (props.loading) {
-      return [];
-    }
-    return [...states.createdOptions, ...props.options].reduce((all, item) => {
-      const options = getOptions(item);
-      if (utils.isArray(options)) {
-        const filtered = options.filter(isValidOption);
-        if (filtered.length > 0) {
-          all.push(
-            {
-              label: getLabel(item),
-              type: "Group"
-            },
-            ...filtered
-          );
-        }
-      } else if (props.remote || isValidOption(item)) {
-        all.push(item);
-      }
-      return all;
-    }, []);
-  };
-  const updateOptions = () => {
-    filteredOptions.value = filterOptions(states.inputValue);
-  };
-  const allOptionsValueMap = vue.computed(() => {
-    const valueMap = /* @__PURE__ */ new Map();
-    allOptions.value.forEach((option, index2) => {
-      valueMap.set(getValueKey(getValue(option)), { option, index: index2 });
-    });
-    return valueMap;
-  });
-  const filteredOptionsValueMap = vue.computed(() => {
-    const valueMap = /* @__PURE__ */ new Map();
-    filteredOptions.value.forEach((option, index2) => {
-      valueMap.set(getValueKey(getValue(option)), { option, index: index2 });
-    });
-    return valueMap;
-  });
-  const optionsAllDisabled = vue.computed(
-    () => filteredOptions.value.every((option) => getDisabled(option))
-  );
-  const selectSize = useFormCommonProps.useFormSize();
-  const collapseTagSize = vue.computed(
-    () => "small" === selectSize.value ? "small" : "default"
-  );
-  const calculatePopperSize = () => {
-    if (utils.isNumber(props.fitInputWidth)) {
-      popperSize.value = props.fitInputWidth;
-      return;
-    }
-    const width = selectRef.value?.offsetWidth || 200;
-    if (!props.fitInputWidth && hasOptions.value) {
-      vue.nextTick(() => {
-        popperSize.value = Math.max(width, calculateLabelMaxWidth());
-      });
-    } else {
-      popperSize.value = width;
-    }
-  };
-  const calculateLabelMaxWidth = () => {
-    const canvas = document.createElement("canvas");
-    const ctx = canvas.getContext("2d");
-    const selector = nsSelect.be("dropdown", "item");
-    const dom = menuRef.value?.listRef?.innerRef || document;
-    const dropdownItemEl = dom.querySelector(`.${selector}`);
-    if (dropdownItemEl === null || ctx === null) return 0;
-    const style = getComputedStyle(dropdownItemEl);
-    const padding = Number.parseFloat(style.paddingLeft) + Number.parseFloat(style.paddingRight);
-    ctx.font = `bold ${style.font.replace(
-      new RegExp(`\\b${style.fontWeight}\\b`),
-      ""
-    )}`;
-    const maxWidth = filteredOptions.value.reduce((max, option) => {
-      const metrics = ctx.measureText(getLabel(option));
-      return Math.max(metrics.width, max);
-    }, 0);
-    return maxWidth + padding;
-  };
-  const getGapWidth = () => {
-    if (!selectionRef.value) return 0;
-    const style = window.getComputedStyle(selectionRef.value);
-    return Number.parseFloat(style.gap || "6px");
-  };
-  const tagStyle = vue.computed(() => {
-    const gapWidth = getGapWidth();
-    const maxWidth = collapseItemRef.value && props.maxCollapseTags === 1 ? states.selectionWidth - states.collapseItemWidth - gapWidth : states.selectionWidth;
-    return { maxWidth: `${maxWidth}px` };
-  });
-  const collapseTagStyle = vue.computed(() => {
-    return { maxWidth: `${states.selectionWidth}px` };
-  });
-  const shouldShowPlaceholder = vue.computed(() => {
-    if (utils.isArray(props.modelValue)) {
-      return props.modelValue.length === 0 && !states.inputValue;
-    }
-    return props.filterable ? !states.inputValue : true;
-  });
-  const currentPlaceholder = vue.computed(() => {
-    const _placeholder = props.placeholder || "请选择";
-    return props.multiple || !hasModelValue.value ? _placeholder : states.selectedLabel;
-  });
-  const popperRef = vue.computed(() => tooltipRef.value?.popperRef?.contentRef);
-  const indexRef = vue.computed(() => {
-    if (props.multiple) {
-      const len = props.modelValue.length;
-      if (props.modelValue.length > 0 && filteredOptionsValueMap.value.has(props.modelValue[len - 1])) {
-        const { index: index2 } = filteredOptionsValueMap.value.get(
-          props.modelValue[len - 1]
-        );
-        return index2;
-      }
-    } else {
-      if (!isEmptyValue(props.modelValue) && filteredOptionsValueMap.value.has(props.modelValue)) {
-        const { index: index2 } = filteredOptionsValueMap.value.get(props.modelValue);
-        return index2;
-      }
-    }
-    return -1;
-  });
-  const dropdownMenuVisible = vue.computed({
-    get() {
-      return expanded.value && emptyText.value !== false;
-    },
-    set(val) {
-      expanded.value = val;
-    }
-  });
-  const showTagList = vue.computed(() => {
-    if (!props.multiple) {
-      return [];
-    }
-    return props.collapseTags ? states.cachedOptions.slice(0, props.maxCollapseTags) : states.cachedOptions;
-  });
-  const collapseTagList = vue.computed(() => {
-    if (!props.multiple) {
-      return [];
-    }
-    return props.collapseTags ? states.cachedOptions.slice(props.maxCollapseTags) : [];
-  });
-  const {
-    createNewOption,
-    removeNewOption,
-    selectNewOption,
-    clearAllNewOption
-  } = useAllowCreate.useAllowCreate(props, states);
-  const toggleMenu = () => {
-    if (selectDisabled.value) return;
-    if (states.menuVisibleOnFocus) {
-      states.menuVisibleOnFocus = false;
-    } else {
-      expanded.value = !expanded.value;
-    }
-  };
-  const onInputChange = () => {
-    if (states.inputValue.length > 0 && !expanded.value) {
-      expanded.value = true;
-    }
-    createNewOption(states.inputValue);
-    vue.nextTick(() => {
-      handleQueryChange(states.inputValue);
-    });
-  };
-  const debouncedOnInputChange = lodashEs.debounce(onInputChange, debounce.value);
-  const handleQueryChange = (val) => {
-    if (states.previousQuery === val || isComposing.value) {
-      return;
-    }
-    states.previousQuery = val;
-    if (props.filterable && utils.isFunction(props.filterMethod)) {
-      props.filterMethod(val);
-    } else if (props.filterable && props.remote && utils.isFunction(props.remoteMethod)) {
-      props.remoteMethod(val);
-    }
-    if (props.defaultFirstOption && (props.filterable || props.remote) && filteredOptions.value.length) {
-      vue.nextTick(checkDefaultFirstOption);
-    } else {
-      vue.nextTick(updateHoveringIndex);
-    }
-  };
-  const checkDefaultFirstOption = () => {
-    const optionsInDropdown = filteredOptions.value.filter(
-      (n) => !n.disabled && n.type !== "Group"
-    );
-    const userCreatedOption = optionsInDropdown.find((n) => n.created);
-    const firstOriginOption = optionsInDropdown[0];
-    states.hoveringIndex = getValueIndex(
-      filteredOptions.value,
-      userCreatedOption || firstOriginOption
-    );
-  };
-  const emitChange = (val) => {
-    if (!lodashEs.isEqual(props.modelValue, val)) {
-      emit(event.CHANGE_EVENT, val);
-    }
-  };
-  const update = (val) => {
-    emit(event.UPDATE_MODEL_EVENT, val);
-    emitChange(val);
-    states.previousValue = props.multiple ? String(val) : val;
-    vue.nextTick(() => {
-      if (props.multiple && utils.isArray(props.modelValue)) {
-        const cachedOptions = states.cachedOptions.slice();
-        const selectedOptions = props.modelValue.map(
-          (value) => getOption(value, cachedOptions)
-        );
-        if (!lodashEs.isEqual(states.cachedOptions, selectedOptions)) {
-          states.cachedOptions = selectedOptions;
-        }
-      } else {
-        initStates(true);
-      }
-    });
-  };
-  const getValueIndex = (arr = [], value) => {
-    if (!utils.isObject(value)) {
-      return arr.indexOf(value);
-    }
-    const valueKey = props.valueKey;
-    let index2 = -1;
-    arr.some((item, i) => {
-      if (lodashEs.get(item, valueKey) === lodashEs.get(value, valueKey)) {
-        index2 = i;
-        return true;
-      }
-      return false;
-    });
-    return index2;
-  };
-  const getValueKey = (item) => {
-    return utils.isObject(item) ? lodashEs.get(item, props.valueKey) : item;
-  };
-  const handleResize = () => {
-    calculatePopperSize();
-  };
-  const resetSelectionWidth = () => {
-    states.selectionWidth = Number.parseFloat(
-      window.getComputedStyle(selectionRef.value).width
-    );
-  };
-  const resetCollapseItemWidth = () => {
-    states.collapseItemWidth = collapseItemRef.value.getBoundingClientRect().width;
-  };
-  const updateTooltip = () => {
-    tooltipRef.value?.updatePopper?.();
-  };
-  const updateTagTooltip = () => {
-    tagTooltipRef.value?.updatePopper?.();
-  };
-  const onSelect = (option) => {
-    if (props.multiple) {
-      let selectedOptions = props.modelValue.slice();
-      const index2 = getValueIndex(selectedOptions, getValue(option));
-      if (index2 > -1) {
-        selectedOptions = [
-          ...selectedOptions.slice(0, index2),
-          ...selectedOptions.slice(index2 + 1)
-        ];
-        states.cachedOptions.splice(index2, 1);
-        removeNewOption(option);
-      } else if (props.multipleLimit <= 0 || selectedOptions.length < props.multipleLimit) {
-        selectedOptions = [...selectedOptions, getValue(option)];
-        states.cachedOptions.push(option);
-        selectNewOption(option);
-      }
-      update(selectedOptions);
-      if (option.created) {
-        handleQueryChange("");
-      }
-      if (props.filterable && !props.reserveKeyword) {
-        states.inputValue = "";
-      }
-    } else {
-      states.selectedLabel = getLabel(option);
-      update(getValue(option));
-      expanded.value = false;
-      selectNewOption(option);
-      if (!option.created) {
-        clearAllNewOption();
-      }
-    }
-    focus();
-  };
-  const deleteTag = (event2, option) => {
-    let selectedOptions = props.modelValue.slice();
-    const index2 = getValueIndex(selectedOptions, getValue(option));
-    if (index2 > -1 && !selectDisabled.value) {
-      selectedOptions = [
-        ...props.modelValue.slice(0, index2),
-        ...props.modelValue.slice(index2 + 1)
-      ];
-      states.cachedOptions.splice(index2, 1);
-      update(selectedOptions);
-      emit("remove-tag", getValue(option));
-      removeNewOption(option);
-    }
-    event2.stopPropagation();
-    focus();
-  };
-  const focus = () => {
-    inputRef.value?.focus();
-  };
-  const blur = () => {
-    if (expanded.value) {
-      expanded.value = false;
-      vue.nextTick(() => inputRef.value?.blur());
-      return;
-    }
-    inputRef.value?.blur();
-  };
-  const handleEsc = () => {
-    if (states.inputValue.length > 0) {
-      states.inputValue = "";
-    } else {
-      expanded.value = false;
-    }
-  };
-  const getLastNotDisabledIndex = (value) => lodashEs.findLastIndex(
-    value,
-    (it) => !states.cachedOptions.some(
-      (option) => getValue(option) === it && getDisabled(option)
-    )
-  );
-  const handleDel = (e) => {
-    if (!props.multiple) return;
-    if (e.code === aria.EVENT_CODE.delete) return;
-    if (states.inputValue.length === 0) {
-      e.preventDefault();
-      const selected = props.modelValue.slice();
-      const lastNotDisabledIndex = getLastNotDisabledIndex(selected);
-      if (lastNotDisabledIndex < 0) return;
-      const removeTagValue = selected[lastNotDisabledIndex];
-      selected.splice(lastNotDisabledIndex, 1);
-      const option = states.cachedOptions[lastNotDisabledIndex];
-      states.cachedOptions.splice(lastNotDisabledIndex, 1);
-      removeNewOption(option);
-      update(selected);
-      emit("remove-tag", removeTagValue);
-    }
-  };
-  const handleClear = () => {
-    let emptyValue;
-    if (utils.isArray(props.modelValue)) {
-      emptyValue = [];
-    } else {
-      emptyValue = valueOnClear.value;
-    }
-    states.selectedLabel = "";
-    expanded.value = false;
-    update(emptyValue);
-    emit("clear");
-    clearAllNewOption();
-    focus();
-  };
-  const onKeyboardNavigate = (direction, hoveringIndex = void 0) => {
-    const options = filteredOptions.value;
-    if (!["forward", "backward"].includes(direction) || selectDisabled.value || options.length <= 0 || optionsAllDisabled.value || isComposing.value) {
-      return;
-    }
-    if (!expanded.value) {
-      return toggleMenu();
-    }
-    if (utils.isUndefined(hoveringIndex)) {
-      hoveringIndex = states.hoveringIndex;
-    }
-    let newIndex = -1;
-    if (direction === "forward") {
-      newIndex = hoveringIndex + 1;
-      if (newIndex >= options.length) {
-        newIndex = 0;
-      }
-    } else if (direction === "backward") {
-      newIndex = hoveringIndex - 1;
-      if (newIndex < 0 || newIndex >= options.length) {
-        newIndex = options.length - 1;
-      }
-    }
-    const option = options[newIndex];
-    if (getDisabled(option) || option.type === "Group") {
-      return onKeyboardNavigate(direction, newIndex);
-    } else {
-      states.hoveringIndex = newIndex;
-      scrollToItem(newIndex);
-    }
-  };
-  const onKeyboardSelect = () => {
-    if (!expanded.value) {
-      return toggleMenu();
-    } else if (~states.hoveringIndex && filteredOptions.value[states.hoveringIndex]) {
-      onSelect(filteredOptions.value[states.hoveringIndex]);
-    }
-  };
-  const onHoverOption = (idx) => {
-    states.hoveringIndex = idx ?? -1;
-  };
-  const updateHoveringIndex = () => {
-    if (!props.multiple) {
-      states.hoveringIndex = filteredOptions.value.findIndex((item) => {
-        return getValueKey(getValue(item)) === getValueKey(props.modelValue);
-      });
-    } else {
-      states.hoveringIndex = filteredOptions.value.findIndex(
-        (item) => props.modelValue.some(
-          (modelValue) => getValueKey(modelValue) === getValueKey(getValue(item))
-        )
-      );
-    }
-  };
-  const onInput = (event2) => {
-    states.inputValue = event2.target.value;
-    if (props.remote) {
-      debouncedOnInputChange();
-    } else {
-      return onInputChange();
-    }
-  };
-  const handleClickOutside = (event2) => {
-    expanded.value = false;
-    if (isFocused.value) {
-      const _event = new FocusEvent("focus", event2);
-      handleBlur(_event);
-    }
-  };
-  const handleMenuEnter = () => {
-    states.isBeforeHide = false;
-    return vue.nextTick(() => {
-      if (~indexRef.value) {
-        scrollToItem(states.hoveringIndex);
-      }
-    });
-  };
-  const scrollToItem = (index2) => {
-    menuRef.value.scrollToItem(index2);
-  };
-  const getOption = (value, cachedOptions) => {
-    const selectValue = getValueKey(value);
-    if (allOptionsValueMap.value.has(selectValue)) {
-      const { option } = allOptionsValueMap.value.get(selectValue);
-      return option;
-    }
-    if (cachedOptions && cachedOptions.length) {
-      const option = cachedOptions.find(
-        (option2) => getValueKey(getValue(option2)) === selectValue
-      );
-      if (option) {
-        return option;
-      }
-    }
-    return {
-      [aliasProps.value.value]: value,
-      [aliasProps.value.label]: value
-    };
-  };
-  const initStates = (needUpdateSelectedLabel = false) => {
-    if (props.multiple) {
-      if (props.modelValue.length > 0) {
-        const cachedOptions = states.cachedOptions.slice();
-        states.cachedOptions.length = 0;
-        states.previousValue = props.modelValue.toString();
-        for (const value of props.modelValue) {
-          const option = getOption(value, cachedOptions);
-          states.cachedOptions.push(option);
-        }
-      } else {
-        states.cachedOptions = [];
-        states.previousValue = void 0;
-      }
-    } else {
-      if (hasModelValue.value) {
-        states.previousValue = props.modelValue;
-        const options = filteredOptions.value;
-        const selectedItemIndex = options.findIndex(
-          (option) => getValueKey(getValue(option)) === getValueKey(props.modelValue)
-        );
-        if (~selectedItemIndex) {
-          states.selectedLabel = getLabel(options[selectedItemIndex]);
-        } else {
-          if (!states.selectedLabel || needUpdateSelectedLabel) {
-            states.selectedLabel = getValueKey(props.modelValue);
-          }
-        }
-      } else {
-        states.selectedLabel = "";
-        states.previousValue = void 0;
-      }
-    }
-    clearAllNewOption();
-    calculatePopperSize();
-  };
-  vue.watch(
-    () => props.fitInputWidth,
-    () => {
-      calculatePopperSize();
-    }
-  );
-  vue.watch(expanded, (val) => {
-    if (val) {
-      if (!props.persistent) {
-        calculatePopperSize();
-      }
-      handleQueryChange("");
-    } else {
-      states.inputValue = "";
-      states.previousQuery = null;
-      states.isBeforeHide = true;
-      createNewOption("");
-    }
-    emit("visible-change", val);
-  });
-  vue.watch(
-    () => props.modelValue,
-    (val, oldVal) => {
-      const isValEmpty = !val || utils.isArray(val) && val.length === 0;
-      if (isValEmpty || props.multiple && !lodashEs.isEqual(val.toString(), states.previousValue) || !props.multiple && getValueKey(val) !== getValueKey(states.previousValue)) {
-        initStates(true);
-      }
-      if (!lodashEs.isEqual(val, oldVal) && props.validateEvent) {
-        elFormItem?.validate?.("change").catch((err) => error.debugWarn(err));
-      }
-    },
-    {
-      deep: true
-    }
-  );
-  vue.watch(
-    () => props.options,
-    () => {
-      const input = inputRef.value;
-      if (!input || input && document.activeElement !== input) {
-        initStates();
-      }
-    },
-    {
-      deep: true,
-      flush: "post"
-    }
-  );
-  vue.watch(
-    () => filteredOptions.value,
-    () => {
-      calculatePopperSize();
-      return menuRef.value && vue.nextTick(menuRef.value.resetScrollTop);
-    }
-  );
-  vue.watchEffect(() => {
-    if (states.isBeforeHide) return;
-    updateOptions();
-  });
-  vue.watchEffect(() => {
-    const { valueKey, options } = props;
-    const duplicateValue = /* @__PURE__ */ new Map();
-    for (const item of options) {
-      const optionValue = getValue(item);
-      let v = optionValue;
-      if (utils.isObject(v)) {
-        v = lodashEs.get(optionValue, valueKey);
-      }
-      if (duplicateValue.get(v)) {
-        error.debugWarn(
-          "ElSelectV2",
-          `The option values you provided seem to be duplicated, which may cause some problems, please check.`
-        );
-        break;
-      } else {
-        duplicateValue.set(v, true);
-      }
-    }
-  });
-  vue.onMounted(() => {
-    initStates();
-  });
-  core.useResizeObserver(selectRef, handleResize);
-  core.useResizeObserver(selectionRef, resetSelectionWidth);
-  core.useResizeObserver(menuRef, updateTooltip);
-  core.useResizeObserver(wrapperRef, updateTooltip);
-  core.useResizeObserver(tagMenuRef, updateTagTooltip);
-  core.useResizeObserver(collapseItemRef, resetCollapseItemWidth);
-  return {
-    // data exports
-    inputId,
-    collapseTagSize,
-    currentPlaceholder,
-    expanded,
-    emptyText,
-    popupHeight,
-    debounce,
-    allOptions,
-    filteredOptions,
-    iconComponent,
-    iconReverse,
-    tagStyle,
-    collapseTagStyle,
-    popperSize,
-    dropdownMenuVisible,
-    hasModelValue,
-    shouldShowPlaceholder,
-    selectDisabled,
-    selectSize,
-    needStatusIcon,
-    showClearBtn,
-    states,
-    isFocused,
-    nsSelect,
-    nsInput,
-    // refs items exports
-    inputRef,
-    menuRef,
-    tagMenuRef,
-    tooltipRef,
-    tagTooltipRef,
-    selectRef,
-    wrapperRef,
-    selectionRef,
-    prefixRef,
-    suffixRef,
-    collapseItemRef,
-    popperRef,
-    validateState,
-    validateIcon,
-    showTagList,
-    collapseTagList,
-    // methods exports
-    debouncedOnInputChange,
-    deleteTag,
-    getLabel,
-    getValue,
-    getDisabled,
-    getValueKey,
-    handleClear,
-    handleClickOutside,
-    handleDel,
-    handleEsc,
-    focus,
-    blur,
-    handleMenuEnter,
-    handleResize,
-    resetSelectionWidth,
-    updateTooltip,
-    updateTagTooltip,
-    updateOptions,
-    toggleMenu,
-    scrollTo: scrollToItem,
-    onInput,
-    onKeyboardNavigate,
-    onKeyboardSelect,
-    onSelect,
-    onHover: onHoverOption,
-    handleCompositionStart,
-    handleCompositionEnd,
-    handleCompositionUpdate
-  };
-};
-exports.default = useSelect;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("../form/index.cjs");const vt=require("../../constants/aria.cjs"),Ie=require("../../constants/event.cjs"),I=require("@vueuse/core"),r=require("@vft/utils"),U=require("../../utils/error.cjs");require("../config-provider/hooks/use-global-config.cjs");const u=require("vue"),ht=require("../../utils/vue/data-helper.cjs"),v=require("lodash-es"),we=require("../../hooks/use-namespace/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../hooks/use-z-index/index.cjs");const gt=require("../../hooks/use-composition/index.cjs"),Vt=require("../../hooks/use-focus-controller/index.cjs"),bt=require("../../hooks/use-empty-values/index.cjs"),xt=require("./useAllowCreate.cjs"),Ot=require("./useProps.cjs"),ye=require("../form/hooks/use-form-item.cjs"),pt=require("../form/hooks/use-form-common-props.cjs"),It=(t,h)=>{const z=we.useNamespace("select"),Te=we.useNamespace("input"),{form:J,formItem:E}=ye.useFormItem(),{inputId:Ee}=ye.useFormItemInputId(t,{formItemContext:E}),{aliasProps:X,getLabel:g,getValue:d,getDisabled:C,getOptions:Ce}=Ot.useProps(t),{valueOnClear:Re,isEmptyValue:Y}=bt.useEmptyValues(t),l=u.reactive({inputValue:"",cachedOptions:[],createdOptions:[],hoveringIndex:-1,inputHovering:!1,selectionWidth:0,collapseItemWidth:0,previousQuery:null,previousValue:void 0,selectedLabel:"",menuVisibleOnFocus:!1,isBeforeHide:!1}),R=u.ref(-1),A=u.ref(),w=u.ref(),S=u.ref(),P=u.ref(),V=u.ref(),Se=u.ref(),Fe=u.ref(),b=u.ref(),Z=u.ref(),F=u.ref(),{isComposing:ee,handleCompositionStart:Me,handleCompositionEnd:We,handleCompositionUpdate:qe}=gt.useComposition({afterComposition:e=>Oe(e)}),x=u.computed(()=>t.disabled||!!J?.disabled),{wrapperRef:te,isFocused:le,handleBlur:Le}=Vt.useFocusController(V,{disabled:x,afterFocus(){t.automaticDropdown&&!o.value&&(o.value=!0,l.menuVisibleOnFocus=!0)},beforeBlur(e){return S.value?.isFocusInsideContent(e)||P.value?.isFocusInsideContent(e)},afterBlur(){o.value=!1,l.menuVisibleOnFocus=!1,t.validateEvent&&E?.validate?.("blur").catch(e=>U.debugWarn(e))}}),ne=u.computed(()=>oe("")),M=u.computed(()=>t.loading?!1:t.options.length>0||l.createdOptions.length>0),s=u.ref([]),o=u.ref(!1),Ne=u.computed(()=>J?.statusIcon??!1),ke=u.computed(()=>{const e=s.value.length*t.itemHeight;return e>t.height?t.height:e}),W=u.computed(()=>t.multiple?r.isArray(t.modelValue)&&t.modelValue.length>0:!Y(t.modelValue)),De=u.computed(()=>t.clearable&&!x.value&&l.inputHovering&&W.value),ue=u.computed(()=>t.remote&&t.filterable?"":"icon-arrow-down"),He=u.computed(()=>ue.value&&z.is("reverse",o.value)),ze=u.computed(()=>E?.validateState||""),Ae="validateIcon",ie=u.computed(()=>t.remote?300:0),ae=u.computed(()=>t.loading?t.loadingText||"加载中":t.remote&&!l.inputValue&&!M.value?!1:t.filterable&&l.inputValue&&M.value&&s.value.length===0?t.noMatchText||"无匹配数据":M.value?null:t.noDataText||"暂无数据"),oe=e=>{const n=new RegExp(ht.escapeStringRegexp(e),"i"),{filterMethod:i,remoteMethod:a}=u.toRaw(t),c=t.filterable&&r.isFunction(i),m=t.filterable&&t.remote&&r.isFunction(a),k=O=>c||m?!0:e?n.test(g(O)||""):!0;return t.loading?[]:[...l.createdOptions,...t.options].reduce((O,p)=>{const D=Ce(p);if(r.isArray(D)){const H=D.filter(k);H.length>0&&O.push({label:g(p),type:"Group"},...H)}else(t.remote||k(p))&&O.push(p);return O},[])},se=()=>{s.value=oe(l.inputValue)},ce=u.computed(()=>{const e=new Map;return ne.value.forEach((n,i)=>{e.set(f(d(n)),{option:n,index:i})}),e}),q=u.computed(()=>{const e=new Map;return s.value.forEach((n,i)=>{e.set(f(d(n)),{option:n,index:i})}),e}),Pe=u.computed(()=>s.value.every(e=>C(e))),re=pt.useFormSize(),Be=u.computed(()=>re.value==="small"?"small":"default"),y=()=>{if(r.isNumber(t.fitInputWidth)){R.value=t.fitInputWidth;return}const e=A.value?.offsetWidth||200;!t.fitInputWidth&&M.value?u.nextTick(()=>{R.value=Math.max(e,Ke())}):R.value=e},Ke=()=>{const n=document.createElement("canvas").getContext("2d"),i=z.be("dropdown","item"),c=(b.value?.listRef?.innerRef||document).querySelector(`.${i}`);if(c===null||n===null)return 0;const m=getComputedStyle(c),k=Number.parseFloat(m.paddingLeft)+Number.parseFloat(m.paddingRight);return n.font=`bold ${m.font.replace(new RegExp(`\\b${m.fontWeight}\\b`),"")}`,s.value.reduce((p,D)=>{const H=n.measureText(g(D));return Math.max(H.width,p)},0)+k},_e=()=>{if(!w.value)return 0;const e=window.getComputedStyle(w.value);return Number.parseFloat(e.gap||"6px")},$e=u.computed(()=>{const e=_e();return{maxWidth:`${F.value&&t.maxCollapseTags===1?l.selectionWidth-l.collapseItemWidth-e:l.selectionWidth}px`}}),Ge=u.computed(()=>({maxWidth:`${l.selectionWidth}px`})),Qe=u.computed(()=>r.isArray(t.modelValue)?t.modelValue.length===0&&!l.inputValue:t.filterable?!l.inputValue:!0),je=u.computed(()=>{const e=t.placeholder||"请选择";return t.multiple||!W.value?e:l.selectedLabel}),Ue=u.computed(()=>S.value?.popperRef?.contentRef),Je=u.computed(()=>{if(t.multiple){const e=t.modelValue.length;if(t.modelValue.length>0&&q.value.has(t.modelValue[e-1])){const{index:n}=q.value.get(t.modelValue[e-1]);return n}}else if(!Y(t.modelValue)&&q.value.has(t.modelValue)){const{index:e}=q.value.get(t.modelValue);return e}return-1}),Xe=u.computed({get(){return o.value&&ae.value!==!1},set(e){o.value=e}}),Ye=u.computed(()=>t.multiple?t.collapseTags?l.cachedOptions.slice(0,t.maxCollapseTags):l.cachedOptions:[]),Ze=u.computed(()=>t.multiple?t.collapseTags?l.cachedOptions.slice(t.maxCollapseTags):[]:[]),{createNewOption:de,removeNewOption:B,selectNewOption:fe,clearAllNewOption:K}=xt.useAllowCreate(t,l),_=()=>{x.value||(l.menuVisibleOnFocus?l.menuVisibleOnFocus=!1:o.value=!o.value)},me=()=>{l.inputValue.length>0&&!o.value&&(o.value=!0),de(l.inputValue),u.nextTick(()=>{$(l.inputValue)})},ve=v.debounce(me,ie.value),$=e=>{l.previousQuery===e||ee.value||(l.previousQuery=e,t.filterable&&r.isFunction(t.filterMethod)?t.filterMethod(e):t.filterable&&t.remote&&r.isFunction(t.remoteMethod)&&t.remoteMethod(e),t.defaultFirstOption&&(t.filterable||t.remote)&&s.value.length?u.nextTick(et):u.nextTick(dt))},et=()=>{const e=s.value.filter(a=>!a.disabled&&a.type!=="Group"),n=e.find(a=>a.created),i=e[0];l.hoveringIndex=G(s.value,n||i)},tt=e=>{v.isEqual(t.modelValue,e)||h(Ie.CHANGE_EVENT,e)},T=e=>{h(Ie.UPDATE_MODEL_EVENT,e),tt(e),l.previousValue=t.multiple?String(e):e,u.nextTick(()=>{if(t.multiple&&r.isArray(t.modelValue)){const n=l.cachedOptions.slice(),i=t.modelValue.map(a=>pe(a,n));v.isEqual(l.cachedOptions,i)||(l.cachedOptions=i)}else N(!0)})},G=(e=[],n)=>{if(!r.isObject(n))return e.indexOf(n);const i=t.valueKey;let a=-1;return e.some((c,m)=>v.get(c,i)===v.get(n,i)?(a=m,!0):!1),a},f=e=>r.isObject(e)?v.get(e,t.valueKey):e,he=()=>{y()},ge=()=>{l.selectionWidth=Number.parseFloat(window.getComputedStyle(w.value).width)},lt=()=>{l.collapseItemWidth=F.value.getBoundingClientRect().width},Q=()=>{S.value?.updatePopper?.()},Ve=()=>{P.value?.updatePopper?.()},be=e=>{if(t.multiple){let n=t.modelValue.slice();const i=G(n,d(e));i>-1?(n=[...n.slice(0,i),...n.slice(i+1)],l.cachedOptions.splice(i,1),B(e)):(t.multipleLimit<=0||n.length<t.multipleLimit)&&(n=[...n,d(e)],l.cachedOptions.push(e),fe(e)),T(n),e.created&&$(""),t.filterable&&!t.reserveKeyword&&(l.inputValue="")}else l.selectedLabel=g(e),T(d(e)),o.value=!1,fe(e),e.created||K();L()},nt=(e,n)=>{let i=t.modelValue.slice();const a=G(i,d(n));a>-1&&!x.value&&(i=[...t.modelValue.slice(0,a),...t.modelValue.slice(a+1)],l.cachedOptions.splice(a,1),T(i),h("remove-tag",d(n)),B(n)),e.stopPropagation(),L()},L=()=>{V.value?.focus()},ut=()=>{if(o.value){o.value=!1,u.nextTick(()=>V.value?.blur());return}V.value?.blur()},it=()=>{l.inputValue.length>0?l.inputValue="":o.value=!1},at=e=>v.findLastIndex(e,n=>!l.cachedOptions.some(i=>d(i)===n&&C(i))),ot=e=>{if(t.multiple&&e.code!==vt.EVENT_CODE.delete&&l.inputValue.length===0){e.preventDefault();const n=t.modelValue.slice(),i=at(n);if(i<0)return;const a=n[i];n.splice(i,1);const c=l.cachedOptions[i];l.cachedOptions.splice(i,1),B(c),T(n),h("remove-tag",a)}},st=()=>{let e;r.isArray(t.modelValue)?e=[]:e=Re.value,l.selectedLabel="",o.value=!1,T(e),h("clear"),K(),L()},xe=(e,n=void 0)=>{const i=s.value;if(!["forward","backward"].includes(e)||x.value||i.length<=0||Pe.value||ee.value)return;if(!o.value)return _();r.isUndefined(n)&&(n=l.hoveringIndex);let a=-1;e==="forward"?(a=n+1,a>=i.length&&(a=0)):e==="backward"&&(a=n-1,(a<0||a>=i.length)&&(a=i.length-1));const c=i[a];if(C(c)||c.type==="Group")return xe(e,a);l.hoveringIndex=a,j(a)},ct=()=>{if(o.value)~l.hoveringIndex&&s.value[l.hoveringIndex]&&be(s.value[l.hoveringIndex]);else return _()},rt=e=>{l.hoveringIndex=e??-1},dt=()=>{t.multiple?l.hoveringIndex=s.value.findIndex(e=>t.modelValue.some(n=>f(n)===f(d(e)))):l.hoveringIndex=s.value.findIndex(e=>f(d(e))===f(t.modelValue))},Oe=e=>{if(l.inputValue=e.target.value,t.remote)ve();else return me()},ft=e=>{if(o.value=!1,le.value){const n=new FocusEvent("focus",e);Le(n)}},mt=()=>(l.isBeforeHide=!1,u.nextTick(()=>{~Je.value&&j(l.hoveringIndex)})),j=e=>{b.value.scrollToItem(e)},pe=(e,n)=>{const i=f(e);if(ce.value.has(i)){const{option:a}=ce.value.get(i);return a}if(n&&n.length){const a=n.find(c=>f(d(c))===i);if(a)return a}return{[X.value.value]:e,[X.value.label]:e}},N=(e=!1)=>{if(t.multiple)if(t.modelValue.length>0){const n=l.cachedOptions.slice();l.cachedOptions.length=0,l.previousValue=t.modelValue.toString();for(const i of t.modelValue){const a=pe(i,n);l.cachedOptions.push(a)}}else l.cachedOptions=[],l.previousValue=void 0;else if(W.value){l.previousValue=t.modelValue;const n=s.value,i=n.findIndex(a=>f(d(a))===f(t.modelValue));~i?l.selectedLabel=g(n[i]):(!l.selectedLabel||e)&&(l.selectedLabel=f(t.modelValue))}else l.selectedLabel="",l.previousValue=void 0;K(),y()};return u.watch(()=>t.fitInputWidth,()=>{y()}),u.watch(o,e=>{e?(t.persistent||y(),$("")):(l.inputValue="",l.previousQuery=null,l.isBeforeHide=!0,de("")),h("visible-change",e)}),u.watch(()=>t.modelValue,(e,n)=>{(!e||r.isArray(e)&&e.length===0||t.multiple&&!v.isEqual(e.toString(),l.previousValue)||!t.multiple&&f(e)!==f(l.previousValue))&&N(!0),!v.isEqual(e,n)&&t.validateEvent&&E?.validate?.("change").catch(a=>U.debugWarn(a))},{deep:!0}),u.watch(()=>t.options,()=>{const e=V.value;(!e||e&&document.activeElement!==e)&&N()},{deep:!0,flush:"post"}),u.watch(()=>s.value,()=>(y(),b.value&&u.nextTick(b.value.resetScrollTop))),u.watchEffect(()=>{l.isBeforeHide||se()}),u.watchEffect(()=>{const{valueKey:e,options:n}=t,i=new Map;for(const a of n){const c=d(a);let m=c;if(r.isObject(m)&&(m=v.get(c,e)),i.get(m)){U.debugWarn("ElSelectV2","The option values you provided seem to be duplicated, which may cause some problems, please check.");break}else i.set(m,!0)}}),u.onMounted(()=>{N()}),I.useResizeObserver(A,he),I.useResizeObserver(w,ge),I.useResizeObserver(b,Q),I.useResizeObserver(te,Q),I.useResizeObserver(Z,Ve),I.useResizeObserver(F,lt),{inputId:Ee,collapseTagSize:Be,currentPlaceholder:je,expanded:o,emptyText:ae,popupHeight:ke,debounce:ie,allOptions:ne,filteredOptions:s,iconComponent:ue,iconReverse:He,tagStyle:$e,collapseTagStyle:Ge,popperSize:R,dropdownMenuVisible:Xe,hasModelValue:W,shouldShowPlaceholder:Qe,selectDisabled:x,selectSize:re,needStatusIcon:Ne,showClearBtn:De,states:l,isFocused:le,nsSelect:z,nsInput:Te,inputRef:V,menuRef:b,tagMenuRef:Z,tooltipRef:S,tagTooltipRef:P,selectRef:A,wrapperRef:te,selectionRef:w,prefixRef:Se,suffixRef:Fe,collapseItemRef:F,popperRef:Ue,validateState:ze,validateIcon:Ae,showTagList:Ye,collapseTagList:Ze,debouncedOnInputChange:ve,deleteTag:nt,getLabel:g,getValue:d,getDisabled:C,getValueKey:f,handleClear:st,handleClickOutside:ft,handleDel:ot,handleEsc:it,focus:L,blur:ut,handleMenuEnter:mt,handleResize:he,resetSelectionWidth:ge,updateTooltip:Q,updateTagTooltip:Ve,updateOptions:se,toggleMenu:_,scrollTo:j,onInput:Oe,onKeyboardNavigate:xe,onKeyboardSelect:ct,onSelect:be,onHover:rt,handleCompositionStart:Me,handleCompositionEnd:We,handleCompositionUpdate:qe}};exports.default=It;