'use strict';

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

var vue = require('vue');
var useBaseProps = require('../../../vc-select/src/hooks/useBaseProps.cjs');
var commonUtil = require('../utils/commonUtil.cjs');
var treeUtil = require('../utils/treeUtil.cjs');
var context = require('../context.cjs');
var useKeyboard = require('./useKeyboard.cjs');
var useActive = require('./useActive.cjs');
var Column = require('./Column.cjs');

var OptionList = /* @__PURE__ */ vue.defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "OptionList",
  inheritAttrs: false,
  setup(_props, context$1) {
    const {
      attrs,
      slots
    } = context$1;
    const baseProps = useBaseProps.default();
    const containerRef = vue.ref();
    const rtl = vue.computed(() => baseProps.direction === "rtl");
    const {
      options,
      values,
      halfValues,
      fieldNames,
      changeOnSelect,
      onSelect,
      searchOptions,
      dropdownPrefixCls,
      loadData,
      expandTrigger,
      customSlots
    } = context.useInjectCascader();
    const mergedPrefixCls = vue.computed(() => dropdownPrefixCls.value || baseProps.prefixCls);
    const loadingKeys = vue.shallowRef([]);
    const internalLoadData = (valueCells) => {
      if (!loadData.value || baseProps.searchValue)
        return;
      const optionList = treeUtil.toPathOptions(valueCells, options.value, fieldNames.value);
      const rawOptions = optionList.map(({
        option
      }) => option);
      const lastOption = rawOptions[rawOptions.length - 1];
      if (lastOption && !commonUtil.isLeaf(lastOption, fieldNames.value)) {
        const pathKey = commonUtil.toPathKey(valueCells);
        loadingKeys.value = [...loadingKeys.value, pathKey];
        loadData.value(rawOptions);
      }
    };
    vue.watchEffect(() => {
      if (loadingKeys.value.length) {
        loadingKeys.value.forEach((loadingKey) => {
          const valueStrCells = commonUtil.toPathValueStr(loadingKey);
          const optionList = treeUtil.toPathOptions(valueStrCells, options.value, fieldNames.value, true).map(({
            option
          }) => option);
          const lastOption = optionList[optionList.length - 1];
          if (!lastOption || lastOption[fieldNames.value.children] || commonUtil.isLeaf(lastOption, fieldNames.value))
            loadingKeys.value = loadingKeys.value.filter((key) => key !== loadingKey);
        });
      }
    });
    const checkedSet = vue.computed(() => new Set(commonUtil.toPathKeys(values.value)));
    const halfCheckedSet = vue.computed(() => new Set(commonUtil.toPathKeys(halfValues.value)));
    const [activeValueCells, setActiveValueCells] = useActive.default();
    const onPathOpen = (nextValueCells) => {
      setActiveValueCells(nextValueCells);
      internalLoadData(nextValueCells);
    };
    const isSelectable = (option) => {
      const {
        disabled
      } = option;
      const isMergedLeaf = commonUtil.isLeaf(option, fieldNames.value);
      return !disabled && (isMergedLeaf || changeOnSelect.value || baseProps.multiple);
    };
    const onPathSelect = (valuePath, leaf, fromKeyboard = false) => {
      onSelect(valuePath);
      if (!baseProps.multiple && (leaf || changeOnSelect.value && (expandTrigger.value === "hover" || fromKeyboard)))
        baseProps.toggleOpen(false);
    };
    const mergedOptions = vue.computed(() => {
      if (baseProps.searchValue)
        return searchOptions.value;
      return options.value;
    });
    const optionColumns = vue.computed(() => {
      const optionList = [{
        options: mergedOptions.value
      }];
      let currentList = mergedOptions.value;
      for (let i = 0; i < activeValueCells.value.length; i += 1) {
        const activeValueCell = activeValueCells.value[i];
        const currentOption = currentList.find((option) => option[fieldNames.value.value] === activeValueCell);
        const subOptions = currentOption == null ? void 0 : currentOption[fieldNames.value.children];
        if (!(subOptions == null ? void 0 : subOptions.length))
          break;
        currentList = subOptions;
        optionList.push({
          options: subOptions
        });
      }
      return optionList;
    });
    const onKeyboardSelect = (selectValueCells, option) => {
      if (isSelectable(option))
        onPathSelect(selectValueCells, commonUtil.isLeaf(option, fieldNames.value), true);
    };
    useKeyboard.default(context$1, mergedOptions, fieldNames, activeValueCells, onPathOpen, onKeyboardSelect);
    const onListMouseDown = (event) => {
      event.preventDefault();
    };
    vue.onMounted(() => {
      vue.watch(activeValueCells, (cells) => {
        var _a;
        for (let i = 0; i < cells.length; i += 1) {
          const cellPath = cells.slice(0, i + 1);
          const cellKeyPath = commonUtil.toPathKey(cellPath);
          const ele = (_a = containerRef.value) == null ? void 0 : _a.querySelector(
            `li[data-path-key="${cellKeyPath.replace(/\\{0,2}"/g, '\\"')}"]`
          );
          if (ele)
            commonUtil.scrollIntoParentView(ele);
        }
      }, {
        flush: "post",
        immediate: true
      });
    });
    return () => {
      var _a, _b, _c, _d, _e;
      const {
        notFoundContent = ((_a = slots.notFoundContent) == null ? void 0 : _a.call(slots)) || ((_c = (_b = customSlots.value).notFoundContent) == null ? void 0 : _c.call(_b)),
        multiple,
        toggleOpen
      } = baseProps;
      const isEmpty = !((_e = (_d = optionColumns.value[0]) == null ? void 0 : _d.options) == null ? void 0 : _e.length);
      const emptyList = [{
        [fieldNames.value.value]: "__EMPTY__",
        [Column.FIX_LABEL]: notFoundContent,
        disabled: true
      }];
      const columnProps = {
        ...attrs,
        multiple: !isEmpty && multiple,
        onSelect: onPathSelect,
        onActive: onPathOpen,
        onToggleOpen: toggleOpen,
        checkedSet: checkedSet.value,
        halfCheckedSet: halfCheckedSet.value,
        loadingKeys: loadingKeys.value,
        isSelectable
      };
      const mergedOptionColumns = isEmpty ? [{
        options: emptyList
      }] : optionColumns.value;
      const columnNodes = mergedOptionColumns.map((col, index) => {
        const prevValuePath = activeValueCells.value.slice(0, index);
        const activeValue = activeValueCells.value[index];
        return vue.createVNode(Column.default, {
          "key": index,
          ...columnProps,
          "prefixCls": mergedPrefixCls.value,
          "options": col.options,
          "prevValuePath": prevValuePath,
          "activeValue": activeValue
        }, null);
      });
      return vue.createVNode("div", {
        "class": [`${mergedPrefixCls.value}-menus`, {
          [`${mergedPrefixCls.value}-menu-empty`]: isEmpty,
          [`${mergedPrefixCls.value}-rtl`]: rtl.value
        }],
        "onMousedown": onListMouseDown,
        "ref": containerRef
      }, [columnNodes]);
    };
  }
});

exports.default = OptionList;
//# sourceMappingURL=index.cjs.map
