@element-plus/nightly 0.0.20260423 → 0.0.20260425

package/lib/components/cascader-panel/src/index.vue.d.ts

@@ -1,7 +1,7 @@
 import { CascaderNodePathValue, CascaderNodeValue, CascaderOption, CascaderProps, CascaderValue, ExpandTrigger, LazyLoad, isDisabled, isLeaf } from "./types.js";
 import { Node } from "./node.js";
-import { CascaderMenuInstance } from "./instance.js";
 import { CascaderPanelProps } from "./config.js";
+import { CascaderMenuInstance } from "./instance.js";
 import "../../../index.js";
 import * as vue from "vue";
 
@@ -269,18 +269,20 @@ declare const __VLS_base: vue.DefineComponent<CascaderPanelProps, {
   scrollToExpandingNode: () => void;
   loadLazyRootNodes: () => void;
 }, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
-  "update:modelValue": (value: CascaderValue | null | undefined) => void;
   change: (value: CascaderValue | null | undefined) => void;
   close: () => void;
+  "update:modelValue": (value: CascaderValue | null | undefined) => void;
   "expand-change": (value: CascaderNodePathValue) => void;
 }, string, vue.PublicProps, Readonly<CascaderPanelProps> & Readonly<{
-  "onUpdate:modelValue"?: ((value: CascaderValue | null | undefined) => any) | undefined;
   onChange?: ((value: CascaderValue | null | undefined) => any) | undefined;
   onClose?: (() => any) | undefined;
+  "onUpdate:modelValue"?: ((value: CascaderValue | null | undefined) => any) | undefined;
   "onExpand-change"?: ((value: CascaderNodePathValue) => any) | undefined;
 }>, {
   props: CascaderProps;
   border: boolean;
+  height: number;
+  itemSize: number;
   options: CascaderOption[];
 }, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/lib/components/cascader-panel/src/index.vue_vue_type_script_setup_true_lang.js

@@ -40,6 +40,9 @@ var index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.
 		const checkedNodes = (0, vue.ref)([]);
 		const isHoverMenu = (0, vue.computed)(() => config.value.expandTrigger === "hover");
 		const renderLabelFn = (0, vue.computed)(() => props.renderLabel || slots.default);
+		const virtualScroll = (0, vue.computed)(() => props.virtualScroll);
+		const itemSize = (0, vue.computed)(() => props.itemSize);
+		const height = (0, vue.computed)(() => props.height);
 		const initStore = () => {
 			const { options } = props;
 			const cfg = config.value;
@@ -162,7 +165,10 @@ var index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.
 			if (!_vueuse_core.isClient) return;
 			menuList.value.forEach((menu) => {
 				const menuElement = menu?.$el;
-				if (menuElement) {
+				if (menuElement) if (virtualScroll.value) {
+					const activeIndex = menu?.getActiveNodeIndex?.();
+					if (activeIndex !== void 0 && activeIndex >= 0) menu?.scrollToItem?.(activeIndex);
+				} else {
 					const container = menuElement.querySelector(`.${ns.namespace.value}-scrollbar__wrap`);
 					let activeNode = menuElement.querySelector(`.${ns.b("node")}.in-active-path`);
 					if (!activeNode) {
@@ -178,10 +184,31 @@ var index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.
 			const code = require_event$1.getEventCode(e);
 			switch (code) {
 				case require_aria$1.EVENT_CODE.up:
-				case require_aria$1.EVENT_CODE.down:
+				case require_aria$1.EVENT_CODE.down: {
 					e.preventDefault();
-					require_aria.focusNode(require_aria.getSibling(target, code === require_aria$1.EVENT_CODE.up ? -1 : 1, `.${ns.b("node")}[tabindex="-1"]`));
+					const distance = code === require_aria$1.EVENT_CODE.up ? -1 : 1;
+					if (virtualScroll.value) {
+						const menuIndex = require_utils.getMenuIndex(target);
+						const menu = menuList.value[menuIndex];
+						if (menu) {
+							const currentIndex = menu.getNodeIndexById(target.id);
+							if (currentIndex >= 0) {
+								const nodesInMenu = menus.value[menuIndex] ?? [];
+								const nodesCount = nodesInMenu.length;
+								let targetIndex = currentIndex + distance;
+								while (targetIndex >= 0 && targetIndex < nodesCount) {
+									if (!nodesInMenu[targetIndex].isDisabled) {
+										menu.focusNodeAt(targetIndex);
+										return;
+									}
+									targetIndex += distance;
+								}
+							}
+						}
+					}
+					require_aria.focusNode(require_aria.getSibling(target, distance, `.${ns.b("node")}[tabindex="-1"]`));
 					break;
+				}
 				case require_aria$1.EVENT_CODE.left: {
 					e.preventDefault();
 					const expandedNode = menuList.value[require_utils.getMenuIndex(target) - 1]?.$el.querySelector(`.${ns.b("node")}[aria-expanded="true"]`);
@@ -207,6 +234,9 @@ var index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.
 			isHoverMenu,
 			initialLoaded,
 			renderLabelFn,
+			virtualScroll,
+			itemSize,
+			height,
 			lazyLoad,
 			expandNode,
 			handleCheckChange
@@ -255,11 +285,20 @@ var index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.
 					ref_for: true,
 					ref: (item) => menuList.value[index] = item,
 					index,
-					nodes: [...menu]
+					nodes: [...menu],
+					"virtual-scroll": virtualScroll.value,
+					"item-size": itemSize.value,
+					height: height.value
 				}, {
 					empty: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "empty")]),
 					_: 3
-				}, 8, ["index", "nodes"]);
+				}, 8, [
+					"index",
+					"nodes",
+					"virtual-scroll",
+					"item-size",
+					"height"
+				]);
 			}), 128))], 34);
 		};
 	}

package/lib/components/cascader-panel/src/index.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/index.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b('panel'), ns.is('bordered', border)]\"\n    @keydown=\"handleKeyDown\"\n  >\n    <el-cascader-menu\n      v-for=\"(menu, index) in menus\"\n      :key=\"index\"\n      :ref=\"(item) => (menuList[index] = item as CascaderMenuInstance)\"\n      :index=\"index\"\n      :nodes=\"[...menu]\"\n    >\n      <template #empty>\n        <slot name=\"empty\" />\n      </template>\n    </el-cascader-menu>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  nextTick,\n  onBeforeUpdate,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  useSlots,\n  watch,\n} from 'vue'\nimport { cloneDeep, flattenDeep, isEqual } from 'lodash-unified'\nimport {\n  castArray,\n  focusNode,\n  getEventCode,\n  getSibling,\n  isClient,\n  isEmpty,\n  scrollIntoView,\n  unique,\n} from '@element-plus/utils'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { useNamespace } from '@element-plus/hooks'\nimport ElCascaderMenu from './menu.vue'\nimport Store from './store'\nimport Node from './node'\nimport { cascaderPanelEmits, useCascaderConfig } from './config'\nimport { checkNode, getMenuIndex, sortByOriginalOrder } from './utils'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type {\n  CascaderNode,\n  CascaderNodeValue,\n  CascaderOption,\n  CascaderValue,\n  ElCascaderPanelContext,\n} from './types'\nimport type { CascaderMenuInstance } from './instance'\nimport type { CascaderPanelProps } from './config'\n\ndefineOptions({\n  name: 'ElCascaderPanel',\n})\n\nconst props = withDefaults(defineProps<CascaderPanelProps>(), {\n  options: () => [],\n  props: () => ({}),\n  border: true,\n})\nconst emit = defineEmits(cascaderPanelEmits)\n\n// for interrupt sync check status in lazy mode\nlet manualChecked = false\n\nconst ns = useNamespace('cascader')\nconst config = useCascaderConfig(props)\nconst slots = useSlots()\n\nlet store: Store\nconst initialLoaded = ref(true)\nconst initialLoadedOnce = ref(false)\nconst menuList = ref<CascaderMenuInstance[]>([])\nconst checkedValue = ref<CascaderValue>()\nconst menus = ref<CascaderNode[][]>([])\nconst expandingNode = ref<CascaderNode>()\nconst checkedNodes = ref<CascaderNode[]>([])\n\nconst isHoverMenu = computed(() => config.value.expandTrigger === 'hover')\nconst renderLabelFn = computed(() => props.renderLabel || slots.default)\n\nconst initStore = () => {\n  const { options } = props\n  const cfg = config.value\n\n  manualChecked = false\n  store = new Store(options, cfg)\n  menus.value = [store.getNodes()]\n\n  if (cfg.lazy && isEmpty(props.options)) {\n    initialLoaded.value = false\n    lazyLoad(undefined, (list) => {\n      if (list) {\n        store = new Store(list, cfg)\n        menus.value = [store.getNodes()]\n      }\n      initialLoaded.value = true\n      syncCheckedValue(false, true)\n    })\n  } else {\n    syncCheckedValue(false, true)\n  }\n}\n\nconst lazyLoad: ElCascaderPanelContext['lazyLoad'] = (node, cb) => {\n  const cfg = config.value\n  node! = node || new Node({}, cfg, undefined, true)\n  node.loading = true\n\n  const resolve = (dataList?: CascaderOption[]) => {\n    const _node = node as Node\n    const parent = _node.root ? null : _node\n    _node.loading = false\n    _node.loaded = true\n    _node.childrenData = _node.childrenData || []\n    dataList && store?.appendNodes(dataList, parent as Node)\n    dataList && cb?.(dataList)\n    if (node.level === 0) {\n      initialLoadedOnce.value = true\n    }\n  }\n\n  const reject = () => {\n    node!.loading = false\n    node!.loaded = false\n    if (node!.level === 0) {\n      initialLoaded.value = true\n    }\n  }\n\n  cfg.lazyLoad(node, resolve, reject)\n}\n\nconst expandNode: ElCascaderPanelContext['expandNode'] = (node, silent) => {\n  const { level } = node\n  const newMenus = menus.value.slice(0, level)\n  let newExpandingNode: CascaderNode\n\n  if (node.isLeaf) {\n    newExpandingNode = node.pathNodes[level - 2]\n  } else {\n    newExpandingNode = node\n    newMenus.push(node.children)\n  }\n\n  if (expandingNode.value?.uid !== newExpandingNode?.uid) {\n    expandingNode.value = node\n    menus.value = newMenus\n    !silent && emit('expand-change', node?.pathValues || [])\n  }\n}\n\nconst handleCheckChange: ElCascaderPanelContext['handleCheckChange'] = (\n  node,\n  checked,\n  emitClose = true\n) => {\n  const { checkStrictly, multiple } = config.value\n  const oldNode = checkedNodes.value[0]\n  manualChecked = true\n\n  !multiple && oldNode?.doCheck(false)\n  node.doCheck(checked)\n  calculateCheckedValue()\n  emitClose && !multiple && !checkStrictly && emit('close')\n  !emitClose && !multiple && expandParentNode(node)\n}\n\nconst expandParentNode = (node: Node | undefined) => {\n  if (!node) return\n  node = node.parent\n  expandParentNode(node)\n  node && expandNode(node)\n}\n\nconst getFlattedNodes = (leafOnly: boolean) => store?.getFlattedNodes(leafOnly)\n\nconst getCheckedNodes = (leafOnly: boolean) => {\n  return getFlattedNodes(leafOnly)?.filter(({ checked }) => checked !== false)\n}\n\nconst clearCheckedNodes = () => {\n  checkedNodes.value.forEach((node) => node.doCheck(false))\n  calculateCheckedValue()\n  menus.value = menus.value.slice(0, 1)\n  expandingNode.value = undefined\n  emit('expand-change', [])\n}\n\nconst calculateCheckedValue = () => {\n  const { checkStrictly, multiple } = config.value\n  const oldNodes = checkedNodes.value\n  const newNodes = getCheckedNodes(!checkStrictly)!\n  // ensure the original order\n  const nodes = sortByOriginalOrder(oldNodes, newNodes)\n  const values = nodes.map((node) => node.valueByOption)\n  checkedNodes.value = nodes\n  checkedValue.value = multiple ? values : (values[0] ?? null)\n}\n\nconst syncCheckedValue = (loaded = false, forced = false) => {\n  const { modelValue } = props\n  const { lazy, multiple, checkStrictly } = config.value\n  const leafOnly = !checkStrictly\n\n  if (\n    !initialLoaded.value ||\n    manualChecked ||\n    (!forced && isEqual(modelValue, checkedValue.value))\n  )\n    return\n\n  if (lazy && !loaded) {\n    const values: CascaderNodeValue[] = unique(\n      flattenDeep(castArray(modelValue as CascaderNodeValue[]))\n    )\n    const nodes = values\n      .map((val) => store?.getNodeByValue(val))\n      .filter((node) => !!node && !node.loaded && !node.loading) as Node[]\n\n    if (nodes.length) {\n      nodes.forEach((node) => {\n        lazyLoad(node, () => syncCheckedValue(false, forced))\n      })\n    } else {\n      syncCheckedValue(true, forced)\n    }\n  } else {\n    const values = multiple ? castArray(modelValue) : [modelValue]\n    const nodes = unique(\n      values.map((val) =>\n        store?.getNodeByValue(val as CascaderNodeValue, leafOnly)\n      )\n    ) as Node[]\n    syncMenuState(nodes, forced)\n    checkedValue.value = cloneDeep(modelValue ?? undefined)\n  }\n}\n\nconst syncMenuState = (\n  newCheckedNodes: CascaderNode[],\n  reserveExpandingState = true\n) => {\n  const { checkStrictly } = config.value\n  const oldNodes = checkedNodes.value\n  const newNodes = newCheckedNodes.filter(\n    (node) => !!node && (checkStrictly || node.isLeaf)\n  )\n  const oldExpandingNode = store?.getSameNode(expandingNode.value!)\n  const newExpandingNode =\n    (reserveExpandingState && oldExpandingNode) || newNodes[0]\n\n  if (newExpandingNode) {\n    newExpandingNode.pathNodes.forEach((node) => expandNode(node, true))\n  } else {\n    expandingNode.value = undefined\n  }\n\n  oldNodes.forEach((node) => node.doCheck(false))\n  reactive(newNodes).forEach((node) => node.doCheck(true))\n  checkedNodes.value = newNodes\n  nextTick(scrollToExpandingNode)\n}\n\nconst scrollToExpandingNode = () => {\n  if (!isClient) return\n\n  menuList.value.forEach((menu) => {\n    const menuElement = menu?.$el\n    if (menuElement) {\n      const container = menuElement.querySelector(\n        `.${ns.namespace.value}-scrollbar__wrap`\n      )\n      let activeNode = menuElement.querySelector(\n        `.${ns.b('node')}.in-active-path`\n      )\n      if (!activeNode) {\n        const activeElements = menuElement.querySelectorAll(\n          `.${ns.b('node')}.${ns.is('active')}`\n        )\n        activeNode = activeElements[activeElements.length - 1]\n      }\n      scrollIntoView(container, activeNode)\n    }\n  })\n}\n\nconst handleKeyDown = (e: KeyboardEvent) => {\n  const target = e.target as HTMLElement\n  const code = getEventCode(e)\n\n  switch (code) {\n    case EVENT_CODE.up:\n    case EVENT_CODE.down: {\n      e.preventDefault()\n      const distance = code === EVENT_CODE.up ? -1 : 1\n      focusNode(\n        getSibling(\n          target,\n          distance,\n          `.${ns.b('node')}[tabindex=\"-1\"]`\n        ) as HTMLElement\n      )\n      break\n    }\n    case EVENT_CODE.left: {\n      e.preventDefault()\n      const preMenu = menuList.value[getMenuIndex(target) - 1]\n      const expandedNode = preMenu?.$el.querySelector(\n        `.${ns.b('node')}[aria-expanded=\"true\"]`\n      )\n      focusNode(expandedNode)\n      break\n    }\n    case EVENT_CODE.right: {\n      e.preventDefault()\n      const nextMenu = menuList.value[getMenuIndex(target) + 1]\n      const firstNode = nextMenu?.$el.querySelector(\n        `.${ns.b('node')}[tabindex=\"-1\"]`\n      )\n      focusNode(firstNode)\n      break\n    }\n    case EVENT_CODE.enter:\n    case EVENT_CODE.numpadEnter:\n      checkNode(target)\n      break\n  }\n}\n\nprovide(\n  CASCADER_PANEL_INJECTION_KEY,\n  reactive({\n    config,\n    expandingNode,\n    checkedNodes,\n    isHoverMenu,\n    initialLoaded,\n    renderLabelFn,\n    lazyLoad,\n    expandNode,\n    handleCheckChange,\n  })\n)\n\nwatch(\n  config,\n  (newVal, oldVal) => {\n    if (isEqual(newVal, oldVal)) return\n    initStore()\n  },\n  {\n    immediate: true,\n  }\n)\n\nwatch(() => props.options, initStore, {\n  deep: true,\n})\n\nwatch(\n  () => props.modelValue,\n  () => {\n    manualChecked = false\n    syncCheckedValue()\n  },\n  {\n    deep: true,\n  }\n)\n\nwatch(\n  () => checkedValue.value,\n  (val) => {\n    if (!isEqual(val, props.modelValue)) {\n      emit(UPDATE_MODEL_EVENT, val)\n      emit(CHANGE_EVENT, val)\n    }\n  }\n)\n\nconst loadLazyRootNodes = () => {\n  if (initialLoadedOnce.value) return\n  initStore()\n}\n\nonBeforeUpdate(() => (menuList.value = []))\n\nonMounted(() => !isEmpty(props.modelValue) && syncCheckedValue())\n\ndefineExpose({\n  menuList,\n  menus,\n  checkedNodes,\n  handleKeyDown,\n  handleCheckChange,\n  getFlattedNodes,\n  /**\n   * @description get an array of currently selected node,(leafOnly) whether only return the leaf checked nodes, default is `false`\n   */\n  getCheckedNodes,\n  /**\n   * @description clear checked nodes\n   */\n  clearCheckedNodes,\n  calculateCheckedValue,\n  scrollToExpandingNode,\n  loadLazyRootNodes,\n})\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"index.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/index.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b('panel'), ns.is('bordered', border)]\"\n    @keydown=\"handleKeyDown\"\n  >\n    <el-cascader-menu\n      v-for=\"(menu, index) in menus\"\n      :key=\"index\"\n      :ref=\"(item) => (menuList[index] = item as CascaderMenuInstance)\"\n      :index=\"index\"\n      :nodes=\"[...menu]\"\n      :virtual-scroll=\"virtualScroll\"\n      :item-size=\"itemSize\"\n      :height=\"height\"\n    >\n      <template #empty>\n        <slot name=\"empty\" />\n      </template>\n    </el-cascader-menu>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  nextTick,\n  onBeforeUpdate,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  useSlots,\n  watch,\n} from 'vue'\nimport { cloneDeep, flattenDeep, isEqual } from 'lodash-unified'\nimport {\n  castArray,\n  focusNode,\n  getEventCode,\n  getSibling,\n  isClient,\n  isEmpty,\n  scrollIntoView,\n  unique,\n} from '@element-plus/utils'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { useNamespace } from '@element-plus/hooks'\nimport ElCascaderMenu from './menu.vue'\nimport Store from './store'\nimport Node from './node'\nimport {\n  CASCADER_PANEL_HEIGHT,\n  CASCADER_PANEL_ITEM_SIZE,\n  cascaderPanelEmits,\n  useCascaderConfig,\n} from './config'\nimport { checkNode, getMenuIndex, sortByOriginalOrder } from './utils'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type {\n  CascaderNode,\n  CascaderNodeValue,\n  CascaderOption,\n  CascaderValue,\n  ElCascaderPanelContext,\n} from './types'\nimport type { CascaderMenuInstance } from './instance'\nimport type { CascaderPanelProps } from './config'\n\ndefineOptions({\n  name: 'ElCascaderPanel',\n})\n\nconst props = withDefaults(defineProps<CascaderPanelProps>(), {\n  options: () => [],\n  props: () => ({}),\n  border: true,\n  itemSize: CASCADER_PANEL_ITEM_SIZE,\n  height: CASCADER_PANEL_HEIGHT,\n})\nconst emit = defineEmits(cascaderPanelEmits)\n\n// for interrupt sync check status in lazy mode\nlet manualChecked = false\n\nconst ns = useNamespace('cascader')\nconst config = useCascaderConfig(props)\nconst slots = useSlots()\n\nlet store: Store\nconst initialLoaded = ref(true)\nconst initialLoadedOnce = ref(false)\nconst menuList = ref<CascaderMenuInstance[]>([])\nconst checkedValue = ref<CascaderValue>()\nconst menus = ref<CascaderNode[][]>([])\nconst expandingNode = ref<CascaderNode>()\nconst checkedNodes = ref<CascaderNode[]>([])\n\nconst isHoverMenu = computed(() => config.value.expandTrigger === 'hover')\nconst renderLabelFn = computed(() => props.renderLabel || slots.default)\nconst virtualScroll = computed(() => props.virtualScroll)\nconst itemSize = computed(() => props.itemSize)\nconst height = computed(() => props.height)\n\nconst initStore = () => {\n  const { options } = props\n  const cfg = config.value\n\n  manualChecked = false\n  store = new Store(options, cfg)\n  menus.value = [store.getNodes()]\n\n  if (cfg.lazy && isEmpty(props.options)) {\n    initialLoaded.value = false\n    lazyLoad(undefined, (list) => {\n      if (list) {\n        store = new Store(list, cfg)\n        menus.value = [store.getNodes()]\n      }\n      initialLoaded.value = true\n      syncCheckedValue(false, true)\n    })\n  } else {\n    syncCheckedValue(false, true)\n  }\n}\n\nconst lazyLoad: ElCascaderPanelContext['lazyLoad'] = (node, cb) => {\n  const cfg = config.value\n  node! = node || new Node({}, cfg, undefined, true)\n  node.loading = true\n\n  const resolve = (dataList?: CascaderOption[]) => {\n    const _node = node as Node\n    const parent = _node.root ? null : _node\n    _node.loading = false\n    _node.loaded = true\n    _node.childrenData = _node.childrenData || []\n    dataList && store?.appendNodes(dataList, parent as Node)\n    dataList && cb?.(dataList)\n    if (node.level === 0) {\n      initialLoadedOnce.value = true\n    }\n  }\n\n  const reject = () => {\n    node!.loading = false\n    node!.loaded = false\n    if (node!.level === 0) {\n      initialLoaded.value = true\n    }\n  }\n\n  cfg.lazyLoad(node, resolve, reject)\n}\n\nconst expandNode: ElCascaderPanelContext['expandNode'] = (node, silent) => {\n  const { level } = node\n  const newMenus = menus.value.slice(0, level)\n  let newExpandingNode: CascaderNode\n\n  if (node.isLeaf) {\n    newExpandingNode = node.pathNodes[level - 2]\n  } else {\n    newExpandingNode = node\n    newMenus.push(node.children)\n  }\n\n  if (expandingNode.value?.uid !== newExpandingNode?.uid) {\n    expandingNode.value = node\n    menus.value = newMenus\n    !silent && emit('expand-change', node?.pathValues || [])\n  }\n}\n\nconst handleCheckChange: ElCascaderPanelContext['handleCheckChange'] = (\n  node,\n  checked,\n  emitClose = true\n) => {\n  const { checkStrictly, multiple } = config.value\n  const oldNode = checkedNodes.value[0]\n  manualChecked = true\n\n  !multiple && oldNode?.doCheck(false)\n  node.doCheck(checked)\n  calculateCheckedValue()\n  emitClose && !multiple && !checkStrictly && emit('close')\n  !emitClose && !multiple && expandParentNode(node)\n}\n\nconst expandParentNode = (node: Node | undefined) => {\n  if (!node) return\n  node = node.parent\n  expandParentNode(node)\n  node && expandNode(node)\n}\n\nconst getFlattedNodes = (leafOnly: boolean) => store?.getFlattedNodes(leafOnly)\n\nconst getCheckedNodes = (leafOnly: boolean) => {\n  return getFlattedNodes(leafOnly)?.filter(({ checked }) => checked !== false)\n}\n\nconst clearCheckedNodes = () => {\n  checkedNodes.value.forEach((node) => node.doCheck(false))\n  calculateCheckedValue()\n  menus.value = menus.value.slice(0, 1)\n  expandingNode.value = undefined\n  emit('expand-change', [])\n}\n\nconst calculateCheckedValue = () => {\n  const { checkStrictly, multiple } = config.value\n  const oldNodes = checkedNodes.value\n  const newNodes = getCheckedNodes(!checkStrictly)!\n  // ensure the original order\n  const nodes = sortByOriginalOrder(oldNodes, newNodes)\n  const values = nodes.map((node) => node.valueByOption)\n  checkedNodes.value = nodes\n  checkedValue.value = multiple ? values : (values[0] ?? null)\n}\n\nconst syncCheckedValue = (loaded = false, forced = false) => {\n  const { modelValue } = props\n  const { lazy, multiple, checkStrictly } = config.value\n  const leafOnly = !checkStrictly\n\n  if (\n    !initialLoaded.value ||\n    manualChecked ||\n    (!forced && isEqual(modelValue, checkedValue.value))\n  )\n    return\n\n  if (lazy && !loaded) {\n    const values: CascaderNodeValue[] = unique(\n      flattenDeep(castArray(modelValue as CascaderNodeValue[]))\n    )\n    const nodes = values\n      .map((val) => store?.getNodeByValue(val))\n      .filter((node) => !!node && !node.loaded && !node.loading) as Node[]\n\n    if (nodes.length) {\n      nodes.forEach((node) => {\n        lazyLoad(node, () => syncCheckedValue(false, forced))\n      })\n    } else {\n      syncCheckedValue(true, forced)\n    }\n  } else {\n    const values = multiple ? castArray(modelValue) : [modelValue]\n    const nodes = unique(\n      values.map((val) =>\n        store?.getNodeByValue(val as CascaderNodeValue, leafOnly)\n      )\n    ) as Node[]\n    syncMenuState(nodes, forced)\n    checkedValue.value = cloneDeep(modelValue ?? undefined)\n  }\n}\n\nconst syncMenuState = (\n  newCheckedNodes: CascaderNode[],\n  reserveExpandingState = true\n) => {\n  const { checkStrictly } = config.value\n  const oldNodes = checkedNodes.value\n  const newNodes = newCheckedNodes.filter(\n    (node) => !!node && (checkStrictly || node.isLeaf)\n  )\n  const oldExpandingNode = store?.getSameNode(expandingNode.value!)\n  const newExpandingNode =\n    (reserveExpandingState && oldExpandingNode) || newNodes[0]\n\n  if (newExpandingNode) {\n    newExpandingNode.pathNodes.forEach((node) => expandNode(node, true))\n  } else {\n    expandingNode.value = undefined\n  }\n\n  oldNodes.forEach((node) => node.doCheck(false))\n  reactive(newNodes).forEach((node) => node.doCheck(true))\n  checkedNodes.value = newNodes\n  nextTick(scrollToExpandingNode)\n}\n\nconst scrollToExpandingNode = () => {\n  if (!isClient) return\n\n  menuList.value.forEach((menu) => {\n    const menuElement = menu?.$el\n    if (menuElement) {\n      // virtual scroll mode, use scrollToItem method\n      if (virtualScroll.value) {\n        const activeIndex = menu?.getActiveNodeIndex?.()\n        if (activeIndex !== undefined && activeIndex >= 0) {\n          menu?.scrollToItem?.(activeIndex)\n        }\n      } else {\n        // logic for non-virtual scroll mode\n        const container = menuElement.querySelector(\n          `.${ns.namespace.value}-scrollbar__wrap`\n        )\n        let activeNode = menuElement.querySelector(\n          `.${ns.b('node')}.in-active-path`\n        )\n        if (!activeNode) {\n          const activeElements = menuElement.querySelectorAll(\n            `.${ns.b('node')}.${ns.is('active')}`\n          )\n          activeNode = activeElements[activeElements.length - 1]\n        }\n        scrollIntoView(container, activeNode)\n      }\n    }\n  })\n}\n\nconst handleKeyDown = (e: KeyboardEvent) => {\n  const target = e.target as HTMLElement\n  const code = getEventCode(e)\n\n  switch (code) {\n    case EVENT_CODE.up:\n    case EVENT_CODE.down: {\n      e.preventDefault()\n      const distance = code === EVENT_CODE.up ? -1 : 1\n\n      if (virtualScroll.value) {\n        const menuIndex = getMenuIndex(target)\n        const menu = menuList.value[menuIndex]\n        if (menu) {\n          // For virtual scroll, calculate the target index and use focusNodeAt\n          const currentIndex = menu.getNodeIndexById(target.id)\n          if (currentIndex >= 0) {\n            const nodesInMenu = menus.value[menuIndex] ?? []\n            const nodesCount = nodesInMenu.length\n            // Find the next non-disabled node\n            let targetIndex = currentIndex + distance\n            while (targetIndex >= 0 && targetIndex < nodesCount) {\n              if (!nodesInMenu[targetIndex].isDisabled) {\n                menu.focusNodeAt(targetIndex)\n                return\n              }\n              targetIndex += distance\n            }\n          }\n        }\n      }\n\n      focusNode(\n        getSibling(\n          target,\n          distance,\n          `.${ns.b('node')}[tabindex=\"-1\"]`\n        ) as HTMLElement\n      )\n      break\n    }\n    case EVENT_CODE.left: {\n      e.preventDefault()\n      const preMenu = menuList.value[getMenuIndex(target) - 1]\n      const expandedNode = preMenu?.$el.querySelector(\n        `.${ns.b('node')}[aria-expanded=\"true\"]`\n      )\n      focusNode(expandedNode)\n      break\n    }\n    case EVENT_CODE.right: {\n      e.preventDefault()\n      const nextMenu = menuList.value[getMenuIndex(target) + 1]\n      const firstNode = nextMenu?.$el.querySelector(\n        `.${ns.b('node')}[tabindex=\"-1\"]`\n      )\n      focusNode(firstNode)\n      break\n    }\n    case EVENT_CODE.enter:\n    case EVENT_CODE.numpadEnter:\n      checkNode(target)\n      break\n  }\n}\n\nprovide(\n  CASCADER_PANEL_INJECTION_KEY,\n  reactive({\n    config,\n    expandingNode,\n    checkedNodes,\n    isHoverMenu,\n    initialLoaded,\n    renderLabelFn,\n    virtualScroll,\n    itemSize,\n    height,\n    lazyLoad,\n    expandNode,\n    handleCheckChange,\n  })\n)\n\nwatch(\n  config,\n  (newVal, oldVal) => {\n    if (isEqual(newVal, oldVal)) return\n    initStore()\n  },\n  {\n    immediate: true,\n  }\n)\n\nwatch(() => props.options, initStore, {\n  deep: true,\n})\n\nwatch(\n  () => props.modelValue,\n  () => {\n    manualChecked = false\n    syncCheckedValue()\n  },\n  {\n    deep: true,\n  }\n)\n\nwatch(\n  () => checkedValue.value,\n  (val) => {\n    if (!isEqual(val, props.modelValue)) {\n      emit(UPDATE_MODEL_EVENT, val)\n      emit(CHANGE_EVENT, val)\n    }\n  }\n)\n\nconst loadLazyRootNodes = () => {\n  if (initialLoadedOnce.value) return\n  initStore()\n}\n\nonBeforeUpdate(() => (menuList.value = []))\n\nonMounted(() => !isEmpty(props.modelValue) && syncCheckedValue())\n\ndefineExpose({\n  menuList,\n  menus,\n  checkedNodes,\n  handleKeyDown,\n  handleCheckChange,\n  getFlattedNodes,\n  /**\n   * @description get an array of currently selected node,(leafOnly) whether only return the leaf checked nodes, default is `false`\n   */\n  getCheckedNodes,\n  /**\n   * @description clear checked nodes\n   */\n  clearCheckedNodes,\n  calculateCheckedValue,\n  scrollToExpandingNode,\n  loadLazyRootNodes,\n})\n</script>\n"],"mappings":"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"}

package/lib/components/cascader-panel/src/menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/menu.vue"],"sourcesContent":["<template>\n  <el-scrollbar\n    :key=\"menuId\"\n    tag=\"ul\"\n    role=\"menu\"\n    :class=\"ns.b()\"\n    :wrap-class=\"ns.e('wrap')\"\n    :view-class=\"[ns.e('list'), ns.is('empty', isEmpty)]\"\n    @mousemove=\"handleMouseMove\"\n    @mouseleave=\"clearHoverZone\"\n  >\n    <el-cascader-node\n      v-for=\"node in nodes\"\n      :key=\"node.uid\"\n      :node=\"node\"\n      :menu-id=\"menuId\"\n      @expand=\"handleExpand\"\n    />\n    <div v-if=\"isLoading\" :class=\"ns.e('empty-text')\">\n      <el-icon size=\"14\" :class=\"ns.is('loading')\">\n        <loading />\n      </el-icon>\n      {{ t('el.cascader.loading') }}\n    </div>\n    <div v-else-if=\"isEmpty\" :class=\"ns.e('empty-text')\">\n      <slot name=\"empty\">{{ t('el.cascader.noData') }}</slot>\n    </div>\n    <!-- eslint-disable vue/html-self-closing -->\n    <svg\n      v-else-if=\"panel?.isHoverMenu\"\n      ref=\"hoverZone\"\n      :class=\"ns.e('hover-zone')\"\n    ></svg>\n    <!-- eslint-enable vue/html-self-closing -->\n  </el-scrollbar>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, getCurrentInstance, inject, ref } from 'vue'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { useId, useLocale, useNamespace } from '@element-plus/hooks'\nimport { Loading } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { CascaderNode } from './types'\nimport type { PropType } from 'vue'\n\ndefineOptions({\n  name: 'ElCascaderMenu',\n})\n\nconst props = defineProps({\n  nodes: {\n    type: Array as PropType<CascaderNode[]>,\n    required: true,\n  },\n  index: {\n    type: Number,\n    required: true,\n  },\n})\n\nconst instance = getCurrentInstance()!\nconst ns = useNamespace('cascader-menu')\n\nconst { t } = useLocale()\nconst id = useId()\nlet activeNode: HTMLElement\nlet hoverTimer: number | undefined\n\nconst panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\nconst hoverZone = ref<SVGSVGElement>()\n\nconst isEmpty = computed(() => !props.nodes.length)\nconst isLoading = computed(() => !panel.initialLoaded)\nconst menuId = computed(() => `${id.value}-${props.index}`)\n\nconst handleExpand = (e: MouseEvent) => {\n  activeNode = e.target as HTMLElement\n}\n\nconst handleMouseMove = (e: MouseEvent) => {\n  if (!panel.isHoverMenu || !activeNode || !hoverZone.value) return\n\n  if (activeNode.contains(e.target as HTMLElement)) {\n    clearHoverTimer()\n\n    const el = instance.vnode.el as HTMLElement\n    const { left } = el.getBoundingClientRect()\n    const { offsetWidth, offsetHeight } = el\n    const startX = e.clientX - left\n    const top = activeNode.offsetTop\n    const bottom = top + activeNode.offsetHeight\n    const scrollTop = el.querySelector(`.${ns.e('wrap')}`)?.scrollTop || 0\n\n    hoverZone.value.innerHTML = `\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${top} L${offsetWidth} ${scrollTop} V${top} Z\" />\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${bottom} L${offsetWidth} ${offsetHeight + scrollTop} V${bottom} Z\" />\n        `\n  } else if (!hoverTimer) {\n    hoverTimer = window.setTimeout(clearHoverZone, panel.config.hoverThreshold)\n  }\n}\n\nconst clearHoverTimer = () => {\n  if (!hoverTimer) return\n  clearTimeout(hoverTimer)\n  hoverTimer = undefined\n}\n\nconst clearHoverZone = () => {\n  if (!hoverZone.value) return\n  hoverZone.value.innerHTML = ''\n  clearHoverTimer()\n}\n</script>\n"],"mappings":""}
+{"version":3,"file":"menu.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/menu.vue"],"sourcesContent":["<template>\n  <template v-if=\"virtualScroll\">\n    <div\n      :key=\"menuId\"\n      :class=\"ns.b()\"\n      @mousemove=\"handleMouseMove\"\n      @mouseleave=\"clearHoverZone\"\n    >\n      <el-fixed-size-list\n        ref=\"virtualListRef\"\n        :height=\"height\"\n        :item-size=\"itemSize\"\n        :data=\"nodes\"\n        :total=\"nodes.length\"\n        :class-name=\"ns.e('list')\"\n        inner-element=\"ul\"\n        :inner-props=\"{\n          role: 'menu',\n          class: ns.is('empty', isEmpty),\n        }\"\n      >\n        <template #default=\"{ data, index: nodeIndex, style }\">\n          <el-cascader-node\n            :key=\"data[nodeIndex].uid\"\n            :node=\"data[nodeIndex]\"\n            :menu-id=\"menuId\"\n            :style=\"style\"\n            @expand=\"handleExpand\"\n          />\n        </template>\n      </el-fixed-size-list>\n      <div v-if=\"isLoading\" :class=\"ns.e('empty-text')\">\n        <el-icon :size=\"14\" :class=\"ns.is('loading')\">\n          <Loading />\n        </el-icon>\n        {{ t('el.cascader.loading') }}\n      </div>\n      <div v-else-if=\"isEmpty\" :class=\"ns.e('empty-text')\">\n        <slot name=\"empty\">{{ t('el.cascader.noData') }}</slot>\n      </div>\n      <!-- eslint-disable vue/html-self-closing -->\n      <svg\n        v-else-if=\"panel?.isHoverMenu\"\n        ref=\"hoverZone\"\n        :class=\"ns.e('hover-zone')\"\n      ></svg>\n      <!-- eslint-enable vue/html-self-closing -->\n    </div>\n  </template>\n  <el-scrollbar\n    v-else\n    :key=\"menuId\"\n    tag=\"ul\"\n    role=\"menu\"\n    :class=\"ns.b()\"\n    :wrap-class=\"ns.e('wrap')\"\n    :view-class=\"[ns.e('list'), ns.is('empty', isEmpty)]\"\n    @mousemove=\"handleMouseMove\"\n    @mouseleave=\"clearHoverZone\"\n  >\n    <el-cascader-node\n      v-for=\"node in nodes\"\n      :key=\"node.uid\"\n      :node=\"node\"\n      :menu-id=\"menuId\"\n      @expand=\"handleExpand\"\n    />\n    <div v-if=\"isLoading\" :class=\"ns.e('empty-text')\">\n      <el-icon :size=\"14\" :class=\"ns.is('loading')\">\n        <Loading />\n      </el-icon>\n      {{ t('el.cascader.loading') }}\n    </div>\n    <div v-else-if=\"isEmpty\" :class=\"ns.e('empty-text')\">\n      <slot name=\"empty\">{{ t('el.cascader.noData') }}</slot>\n    </div>\n    <!-- eslint-disable vue/html-self-closing -->\n    <svg\n      v-else-if=\"panel?.isHoverMenu\"\n      ref=\"hoverZone\"\n      :class=\"ns.e('hover-zone')\"\n    ></svg>\n    <!-- eslint-enable vue/html-self-closing -->\n  </el-scrollbar>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, getCurrentInstance, inject, nextTick, ref } from 'vue'\nimport { clamp } from 'lodash-unified'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { FixedSizeList as ElFixedSizeList } from '@element-plus/components/virtual-list'\nimport { useId, useLocale, useNamespace } from '@element-plus/hooks'\nimport { Loading } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { focusNode } from '@element-plus/utils'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport { CASCADER_PANEL_HEIGHT, CASCADER_PANEL_ITEM_SIZE } from './config'\n\nimport type { CascaderNode } from './types'\nimport type { CascaderCommonProps } from './config'\nimport type { FixedSizeListInstance } from '@element-plus/components/virtual-list'\n\ndefineOptions({\n  name: 'ElCascaderMenu',\n})\n\nconst props = withDefaults(\n  defineProps<\n    {\n      nodes: CascaderNode[]\n      index: number\n    } & Pick<CascaderCommonProps, 'virtualScroll' | 'itemSize' | 'height'>\n  >(),\n  {\n    virtualScroll: false,\n    itemSize: CASCADER_PANEL_ITEM_SIZE,\n    height: CASCADER_PANEL_HEIGHT,\n  }\n)\n\nconst instance = getCurrentInstance()!\nconst ns = useNamespace('cascader-menu')\n\nconst { t } = useLocale()\nconst id = useId()\nlet activeNode: HTMLElement\nlet hoverTimer: number | undefined\n\nconst panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\nconst hoverZone = ref<SVGSVGElement>()\nconst virtualListRef = ref<FixedSizeListInstance>()\n\nconst isEmpty = computed(() => !props.nodes.length)\nconst isLoading = computed(() => !panel.initialLoaded)\nconst menuId = computed(() => `${id.value}-${props.index}`)\n\nconst getActiveNodeIndex = () => {\n  let activeNodeId: number | undefined\n\n  if (panel.expandingNode) {\n    const { level, pathNodes } = panel.expandingNode\n    if (props.index < level) {\n      activeNodeId = pathNodes[props.index]?.uid\n    } else if (props.index === level && panel.checkedNodes.length > 0) {\n      activeNodeId = panel.checkedNodes[0]?.pathNodes[props.index]?.uid\n    }\n  } else if (\n    panel.checkedNodes.length > 0 &&\n    props.index < panel.checkedNodes[0].pathNodes.length\n  ) {\n    activeNodeId = panel.checkedNodes[0].pathNodes[props.index]?.uid\n  }\n\n  return activeNodeId !== undefined\n    ? props.nodes.findIndex((node) => node.uid === activeNodeId)\n    : -1\n}\n\nconst getNodeIndexById = (nodeId: string | undefined) => {\n  if (!nodeId) return -1\n  return props.nodes.findIndex(\n    (node) => `${menuId.value}-${node.uid}` === nodeId\n  )\n}\n\nconst scrollToItem = (index: number) => {\n  const targetIndex = clamp(index, 0, props.nodes.length - 1)\n  virtualListRef.value?.scrollToItem(targetIndex)\n}\n\nconst focusNodeAt = (index: number) => {\n  if (!props.nodes.length) return\n  const targetIndex = clamp(index, 0, props.nodes.length - 1)\n  scrollToItem(targetIndex)\n  nextTick(() => {\n    const node = (instance.vnode.el as HTMLElement)?.querySelector<HTMLElement>(\n      `#${menuId.value}-${props.nodes[targetIndex].uid}`\n    )\n    if (node) focusNode(node)\n  })\n}\n\nconst handleExpand = (e: MouseEvent) => {\n  activeNode = e.target as HTMLElement\n}\n\nconst handleMouseMove = (e: MouseEvent) => {\n  if (!panel.isHoverMenu || !activeNode || !hoverZone.value) return\n\n  if (activeNode.contains(e.target as HTMLElement)) {\n    clearHoverTimer()\n\n    const el = instance.vnode.el as HTMLElement\n    const { left } = el.getBoundingClientRect()\n    const { offsetWidth, offsetHeight } = el\n    const startX = e.clientX - left\n    const top = activeNode.offsetTop\n    const bottom = top + activeNode.offsetHeight\n\n    const scrollTop = props.virtualScroll\n      ? virtualListRef.value?.states?.scrollOffset || 0\n      : el.querySelector(`.${ns.e('wrap')}`)?.scrollTop || 0\n\n    hoverZone.value.innerHTML = `\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${top} L${offsetWidth} ${scrollTop} V${top} Z\" />\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${bottom} L${offsetWidth} ${offsetHeight + scrollTop} V${bottom} Z\" />\n        `\n  } else if (!hoverTimer) {\n    hoverTimer = window.setTimeout(clearHoverZone, panel.config.hoverThreshold)\n  }\n}\n\nconst clearHoverTimer = () => {\n  if (!hoverTimer) return\n  clearTimeout(hoverTimer)\n  hoverTimer = undefined\n}\n\nconst clearHoverZone = () => {\n  if (!hoverZone.value) return\n  hoverZone.value.innerHTML = ''\n  clearHoverTimer()\n}\n\ndefineExpose({\n  getActiveNodeIndex,\n  getNodeIndexById,\n  scrollToItem,\n  focusNodeAt,\n  virtualListRef,\n  get $el() {\n    return instance.vnode.el as HTMLElement\n  },\n})\n</script>\n"],"mappings":""}

package/lib/components/cascader-panel/src/menu.vue.d.ts

@@ -1,32 +1,33 @@
 import "./types.js";
 import { Node } from "./node.js";
+import { CascaderCommonProps } from "./config.js";
+import { FixedSizeListInstance } from "../../virtual-list/src/components/fixed-size-list.js";
+import "../../virtual-list/index.js";
 import * as vue from "vue";
-import { PropType } from "vue";
 
 //#region ../../packages/components/cascader-panel/src/menu.vue.d.ts
-declare var __VLS_29: {};
+type __VLS_Props = {
+  nodes: Node[];
+  index: number;
+} & Pick<CascaderCommonProps, 'virtualScroll' | 'itemSize' | 'height'>;
+declare var __VLS_28: {}, __VLS_58: {};
 type __VLS_Slots = {} & {
-  empty?: (props: typeof __VLS_29) => any;
+  empty?: (props: typeof __VLS_28) => any;
+} & {
+  empty?: (props: typeof __VLS_58) => any;
 };
-declare const __VLS_base: vue.DefineComponent<vue.ExtractPropTypes<{
-  nodes: {
-    type: PropType<Node[]>;
-    required: true;
-  };
-  index: {
-    type: NumberConstructor;
-    required: true;
-  };
-}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-  nodes: {
-    type: PropType<Node[]>;
-    required: true;
-  };
-  index: {
-    type: NumberConstructor;
-    required: true;
-  };
-}>> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+declare const __VLS_base: vue.DefineComponent<__VLS_Props, {
+  getActiveNodeIndex: () => number;
+  getNodeIndexById: (nodeId: string | undefined) => number;
+  scrollToItem: (index: number) => void;
+  focusNodeAt: (index: number) => void;
+  virtualListRef: vue.Ref<FixedSizeListInstance | undefined, FixedSizeListInstance | undefined>;
+  readonly $el: HTMLElement;
+}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+  height: number;
+  itemSize: number;
+  virtualScroll: boolean;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 type __VLS_WithSlots<T, S> = T & {

package/lib/components/cascader-panel/src/menu.vue_vue_type_script_setup_true_lang.js

@@ -1,11 +1,15 @@
 const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
+const require_aria = require('../../../utils/dom/aria.js');
 const require_index = require('../../../hooks/use-locale/index.js');
 const require_index$1 = require('../../../hooks/use-namespace/index.js');
 const require_index$2 = require('../../../hooks/use-id/index.js');
 const require_index$3 = require('../../icon/index.js');
 const require_index$4 = require('../../scrollbar/index.js');
+const require_config = require('./config.js');
+const require_fixed_size_list = require('../../virtual-list/src/components/fixed-size-list.js');
 const require_types = require('./types.js');
 const require_node = require('./node2.js');
+let lodash_unified = require("lodash-unified");
 let _element_plus_icons_vue = require("@element-plus/icons-vue");
 let vue = require("vue");
 
@@ -21,9 +25,24 @@ var menu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.d
 		index: {
 			type: Number,
 			required: true
+		},
+		virtualScroll: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		itemSize: {
+			type: Number,
+			required: false,
+			default: require_config.CASCADER_PANEL_ITEM_SIZE
+		},
+		height: {
+			type: Number,
+			required: false,
+			default: require_config.CASCADER_PANEL_HEIGHT
 		}
 	},
-	setup(__props) {
+	setup(__props, { expose: __expose }) {
 		const props = __props;
 		const instance = (0, vue.getCurrentInstance)();
 		const ns = require_index$1.useNamespace("cascader-menu");
@@ -33,9 +52,36 @@ var menu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.d
 		let hoverTimer;
 		const panel = (0, vue.inject)(require_types.CASCADER_PANEL_INJECTION_KEY);
 		const hoverZone = (0, vue.ref)();
+		const virtualListRef = (0, vue.ref)();
 		const isEmpty = (0, vue.computed)(() => !props.nodes.length);
 		const isLoading = (0, vue.computed)(() => !panel.initialLoaded);
 		const menuId = (0, vue.computed)(() => `${id.value}-${props.index}`);
+		const getActiveNodeIndex = () => {
+			let activeNodeId;
+			if (panel.expandingNode) {
+				const { level, pathNodes } = panel.expandingNode;
+				if (props.index < level) activeNodeId = pathNodes[props.index]?.uid;
+				else if (props.index === level && panel.checkedNodes.length > 0) activeNodeId = panel.checkedNodes[0]?.pathNodes[props.index]?.uid;
+			} else if (panel.checkedNodes.length > 0 && props.index < panel.checkedNodes[0].pathNodes.length) activeNodeId = panel.checkedNodes[0].pathNodes[props.index]?.uid;
+			return activeNodeId !== void 0 ? props.nodes.findIndex((node) => node.uid === activeNodeId) : -1;
+		};
+		const getNodeIndexById = (nodeId) => {
+			if (!nodeId) return -1;
+			return props.nodes.findIndex((node) => `${menuId.value}-${node.uid}` === nodeId);
+		};
+		const scrollToItem = (index) => {
+			const targetIndex = (0, lodash_unified.clamp)(index, 0, props.nodes.length - 1);
+			virtualListRef.value?.scrollToItem(targetIndex);
+		};
+		const focusNodeAt = (index) => {
+			if (!props.nodes.length) return;
+			const targetIndex = (0, lodash_unified.clamp)(index, 0, props.nodes.length - 1);
+			scrollToItem(targetIndex);
+			(0, vue.nextTick)(() => {
+				const node = instance.vnode.el?.querySelector(`#${menuId.value}-${props.nodes[targetIndex].uid}`);
+				if (node) require_aria.focusNode(node);
+			});
+		};
 		const handleExpand = (e) => {
 			activeNode = e.target;
 		};
@@ -49,7 +95,7 @@ var menu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.d
 				const startX = e.clientX - left;
 				const top = activeNode.offsetTop;
 				const bottom = top + activeNode.offsetHeight;
-				const scrollTop = el.querySelector(`.${ns.e("wrap")}`)?.scrollTop || 0;
+				const scrollTop = props.virtualScroll ? virtualListRef.value?.states?.scrollOffset || 0 : el.querySelector(`.${ns.e("wrap")}`)?.scrollTop || 0;
 				hoverZone.value.innerHTML = `
           <path style="pointer-events: auto;" fill="transparent" d="M${startX} ${top} L${offsetWidth} ${scrollTop} V${top} Z" />
           <path style="pointer-events: auto;" fill="transparent" d="M${startX} ${bottom} L${offsetWidth} ${offsetHeight + scrollTop} V${bottom} Z" />
@@ -66,8 +112,76 @@ var menu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.d
 			hoverZone.value.innerHTML = "";
 			clearHoverTimer();
 		};
+		__expose({
+			getActiveNodeIndex,
+			getNodeIndexById,
+			scrollToItem,
+			focusNodeAt,
+			virtualListRef,
+			get $el() {
+				return instance.vnode.el;
+			}
+		});
 		return (_ctx, _cache) => {
-			return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_index$4.ElScrollbar), {
+			return __props.virtualScroll ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+				key: menuId.value,
+				class: (0, vue.normalizeClass)((0, vue.unref)(ns).b()),
+				onMousemove: handleMouseMove,
+				onMouseleave: clearHoverZone
+			}, [
+				(0, vue.createVNode)((0, vue.unref)(require_fixed_size_list.default), {
+					ref_key: "virtualListRef",
+					ref: virtualListRef,
+					height: __props.height,
+					"item-size": __props.itemSize,
+					data: __props.nodes,
+					total: __props.nodes.length,
+					"class-name": (0, vue.unref)(ns).e("list"),
+					"inner-element": "ul",
+					"inner-props": {
+						role: "menu",
+						class: (0, vue.unref)(ns).is("empty", isEmpty.value)
+					}
+				}, {
+					default: (0, vue.withCtx)(({ data, index: nodeIndex, style }) => [((0, vue.openBlock)(), (0, vue.createBlock)(require_node.default, {
+						key: data[nodeIndex].uid,
+						node: data[nodeIndex],
+						"menu-id": menuId.value,
+						style: (0, vue.normalizeStyle)(style),
+						onExpand: handleExpand
+					}, null, 8, [
+						"node",
+						"menu-id",
+						"style"
+					]))]),
+					_: 1
+				}, 8, [
+					"height",
+					"item-size",
+					"data",
+					"total",
+					"class-name",
+					"inner-props"
+				]),
+				isLoading.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+					key: 0,
+					class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("empty-text"))
+				}, [(0, vue.createVNode)((0, vue.unref)(require_index$3.ElIcon), {
+					size: 14,
+					class: (0, vue.normalizeClass)((0, vue.unref)(ns).is("loading"))
+				}, {
+					default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_element_plus_icons_vue.Loading))]),
+					_: 1
+				}, 8, ["class"]), (0, vue.createTextVNode)(" " + (0, vue.toDisplayString)((0, vue.unref)(t)("el.cascader.loading")), 1)], 2)) : isEmpty.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+					key: 1,
+					class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("empty-text"))
+				}, [(0, vue.renderSlot)(_ctx.$slots, "empty", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("el.cascader.noData")), 1)])], 2)) : (0, vue.unref)(panel)?.isHoverMenu ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, [(0, vue.createCommentVNode)(" eslint-disable vue/html-self-closing "), ((0, vue.openBlock)(), (0, vue.createElementBlock)("svg", {
+					ref_key: "hoverZone",
+					ref: hoverZone,
+					class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("hover-zone"))
+				}, null, 2))], 2112)) : (0, vue.createCommentVNode)("v-if", true),
+				(0, vue.createCommentVNode)(" eslint-enable vue/html-self-closing ")
+			], 34)) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_index$4.ElScrollbar), {
 				key: menuId.value,
 				tag: "ul",
 				role: "menu",
@@ -90,7 +204,7 @@ var menu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.d
 						key: 0,
 						class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("empty-text"))
 					}, [(0, vue.createVNode)((0, vue.unref)(require_index$3.ElIcon), {
-						size: "14",
+						size: 14,
 						class: (0, vue.normalizeClass)((0, vue.unref)(ns).is("loading"))
 					}, {
 						default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_element_plus_icons_vue.Loading))]),
@@ -110,7 +224,7 @@ var menu_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.d
 				"class",
 				"wrap-class",
 				"view-class"
-			]);
+			]));
 		};
 	}
 });

package/lib/components/cascader-panel/src/menu.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/menu.vue"],"sourcesContent":["<template>\n  <el-scrollbar\n    :key=\"menuId\"\n    tag=\"ul\"\n    role=\"menu\"\n    :class=\"ns.b()\"\n    :wrap-class=\"ns.e('wrap')\"\n    :view-class=\"[ns.e('list'), ns.is('empty', isEmpty)]\"\n    @mousemove=\"handleMouseMove\"\n    @mouseleave=\"clearHoverZone\"\n  >\n    <el-cascader-node\n      v-for=\"node in nodes\"\n      :key=\"node.uid\"\n      :node=\"node\"\n      :menu-id=\"menuId\"\n      @expand=\"handleExpand\"\n    />\n    <div v-if=\"isLoading\" :class=\"ns.e('empty-text')\">\n      <el-icon size=\"14\" :class=\"ns.is('loading')\">\n        <loading />\n      </el-icon>\n      {{ t('el.cascader.loading') }}\n    </div>\n    <div v-else-if=\"isEmpty\" :class=\"ns.e('empty-text')\">\n      <slot name=\"empty\">{{ t('el.cascader.noData') }}</slot>\n    </div>\n    <!-- eslint-disable vue/html-self-closing -->\n    <svg\n      v-else-if=\"panel?.isHoverMenu\"\n      ref=\"hoverZone\"\n      :class=\"ns.e('hover-zone')\"\n    ></svg>\n    <!-- eslint-enable vue/html-self-closing -->\n  </el-scrollbar>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, getCurrentInstance, inject, ref } from 'vue'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { useId, useLocale, useNamespace } from '@element-plus/hooks'\nimport { Loading } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { CascaderNode } from './types'\nimport type { PropType } from 'vue'\n\ndefineOptions({\n  name: 'ElCascaderMenu',\n})\n\nconst props = defineProps({\n  nodes: {\n    type: Array as PropType<CascaderNode[]>,\n    required: true,\n  },\n  index: {\n    type: Number,\n    required: true,\n  },\n})\n\nconst instance = getCurrentInstance()!\nconst ns = useNamespace('cascader-menu')\n\nconst { t } = useLocale()\nconst id = useId()\nlet activeNode: HTMLElement\nlet hoverTimer: number | undefined\n\nconst panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\nconst hoverZone = ref<SVGSVGElement>()\n\nconst isEmpty = computed(() => !props.nodes.length)\nconst isLoading = computed(() => !panel.initialLoaded)\nconst menuId = computed(() => `${id.value}-${props.index}`)\n\nconst handleExpand = (e: MouseEvent) => {\n  activeNode = e.target as HTMLElement\n}\n\nconst handleMouseMove = (e: MouseEvent) => {\n  if (!panel.isHoverMenu || !activeNode || !hoverZone.value) return\n\n  if (activeNode.contains(e.target as HTMLElement)) {\n    clearHoverTimer()\n\n    const el = instance.vnode.el as HTMLElement\n    const { left } = el.getBoundingClientRect()\n    const { offsetWidth, offsetHeight } = el\n    const startX = e.clientX - left\n    const top = activeNode.offsetTop\n    const bottom = top + activeNode.offsetHeight\n    const scrollTop = el.querySelector(`.${ns.e('wrap')}`)?.scrollTop || 0\n\n    hoverZone.value.innerHTML = `\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${top} L${offsetWidth} ${scrollTop} V${top} Z\" />\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${bottom} L${offsetWidth} ${offsetHeight + scrollTop} V${bottom} Z\" />\n        `\n  } else if (!hoverTimer) {\n    hoverTimer = window.setTimeout(clearHoverZone, panel.config.hoverThreshold)\n  }\n}\n\nconst clearHoverTimer = () => {\n  if (!hoverTimer) return\n  clearTimeout(hoverTimer)\n  hoverTimer = undefined\n}\n\nconst clearHoverZone = () => {\n  if (!hoverZone.value) return\n  hoverZone.value.innerHTML = ''\n  clearHoverTimer()\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAqDA,MAAM,QAAQ;EAWd,MAAM,wCAA+B;EACrC,MAAM,KAAK,6BAAa,gBAAe;EAEvC,MAAM,EAAE,MAAM,yBAAU;EACxB,MAAM,KAAK,uBAAM;EACjB,IAAI;EACJ,IAAI;EAEJ,MAAM,wBAAe,2CAA6B;EAElD,MAAM,0BAA+B;EAErC,MAAM,kCAAyB,CAAC,MAAM,MAAM,OAAM;EAClD,MAAM,oCAA2B,CAAC,MAAM,cAAa;EACrD,MAAM,iCAAwB,GAAG,GAAG,MAAM,GAAG,MAAM,QAAO;EAE1D,MAAM,gBAAgB,MAAkB;AACtC,gBAAa,EAAE;;EAGjB,MAAM,mBAAmB,MAAkB;AACzC,OAAI,CAAC,MAAM,eAAe,CAAC,cAAc,CAAC,UAAU,MAAO;AAE3D,OAAI,WAAW,SAAS,EAAE,OAAsB,EAAE;AAChD,qBAAgB;IAEhB,MAAM,KAAK,SAAS,MAAM;IAC1B,MAAM,EAAE,SAAS,GAAG,uBAAsB;IAC1C,MAAM,EAAE,aAAa,iBAAiB;IACtC,MAAM,SAAS,EAAE,UAAU;IAC3B,MAAM,MAAM,WAAW;IACvB,MAAM,SAAS,MAAM,WAAW;IAChC,MAAM,YAAY,GAAG,cAAc,IAAI,GAAG,EAAE,OAAO,GAAG,EAAE,aAAa;AAErE,cAAU,MAAM,YAAY;uEACuC,OAAO,GAAG,IAAI,IAAI,YAAY,GAAG,UAAU,IAAI,IAAI;uEACnD,OAAO,GAAG,OAAO,IAAI,YAAY,GAAG,eAAe,UAAU,IAAI,OAAO;;cAElI,CAAC,WACV,cAAa,OAAO,WAAW,gBAAgB,MAAM,OAAO,eAAc;;EAI9E,MAAM,wBAAwB;AAC5B,OAAI,CAAC,WAAY;AACjB,gBAAa,WAAU;AACvB,gBAAa;;EAGf,MAAM,uBAAuB;AAC3B,OAAI,CAAC,UAAU,MAAO;AACtB,aAAU,MAAM,YAAY;AAC5B,oBAAgB;;;oEAlFD,4BAAA,EAAA;IAhCZ,KAAK,OAAA;IACN,KAAI;IACJ,MAAK;IACJ,8CAAO,GAAE,CAAC,GAAC,CAAA;IACX,6BAAY,GAAE,CAAC,EAAC,OAAA;IAChB,cAAU,gBAAG,GAAE,CAAC,EAAC,OAAA,iBAAU,GAAE,CAAC,GAAE,SAAU,QAAA,MAAO,CAAA;IACjD,aAAW;IACX,cAAY;;oCAGU;4DAKrB,cAAA,0BALe,QAAA,QAAR,SAAI;wDAKX,sBAAA;OAJC,KAAK,KAAK;OACJ;OACN,WAAS,OAAA;OACT,UAAQ;;;KAEA,UAAA,2DAKL,OAAA;;MALiB,8CAAO,GAAE,CAAC,EAAC,aAAA,CAAA;6CAGtB,uBAAA,EAAA;MAFD,MAAK;MAAM,8CAAO,GAAE,CAAC,GAAE,UAAA,CAAA;;sCACnB,qCAAA,gCAAA,CAAA;;gDACH,8CACP,EAAC,CAAA,sBAAA,CAAA,EAAA,EAAA,SAEU,QAAA,2DAEV,OAAA;;MAFoB,8CAAO,GAAE,CAAC,EAAC,aAAA,CAAA;6BACoB,KAAA,QAAA,SAAA,EAAA,QAAA,kEAAjC,EAAC,CAAA,qBAAA,CAAA,EAAA,EAAA,0BAIZ,MAAK,EAAE,iEAGb,cAAA,EAAA,KAAA,GAAA,EAAA,6BALP,yCAA6C,qDAKtC,OAAA;eAFD;MAAJ,KAAI;MACH,8CAAO,GAAE,CAAC,EAAC,aAAA,CAAA;;iCAEd,wCAA4C"}
+{"version":3,"file":"menu.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/menu.vue"],"sourcesContent":["<template>\n  <template v-if=\"virtualScroll\">\n    <div\n      :key=\"menuId\"\n      :class=\"ns.b()\"\n      @mousemove=\"handleMouseMove\"\n      @mouseleave=\"clearHoverZone\"\n    >\n      <el-fixed-size-list\n        ref=\"virtualListRef\"\n        :height=\"height\"\n        :item-size=\"itemSize\"\n        :data=\"nodes\"\n        :total=\"nodes.length\"\n        :class-name=\"ns.e('list')\"\n        inner-element=\"ul\"\n        :inner-props=\"{\n          role: 'menu',\n          class: ns.is('empty', isEmpty),\n        }\"\n      >\n        <template #default=\"{ data, index: nodeIndex, style }\">\n          <el-cascader-node\n            :key=\"data[nodeIndex].uid\"\n            :node=\"data[nodeIndex]\"\n            :menu-id=\"menuId\"\n            :style=\"style\"\n            @expand=\"handleExpand\"\n          />\n        </template>\n      </el-fixed-size-list>\n      <div v-if=\"isLoading\" :class=\"ns.e('empty-text')\">\n        <el-icon :size=\"14\" :class=\"ns.is('loading')\">\n          <Loading />\n        </el-icon>\n        {{ t('el.cascader.loading') }}\n      </div>\n      <div v-else-if=\"isEmpty\" :class=\"ns.e('empty-text')\">\n        <slot name=\"empty\">{{ t('el.cascader.noData') }}</slot>\n      </div>\n      <!-- eslint-disable vue/html-self-closing -->\n      <svg\n        v-else-if=\"panel?.isHoverMenu\"\n        ref=\"hoverZone\"\n        :class=\"ns.e('hover-zone')\"\n      ></svg>\n      <!-- eslint-enable vue/html-self-closing -->\n    </div>\n  </template>\n  <el-scrollbar\n    v-else\n    :key=\"menuId\"\n    tag=\"ul\"\n    role=\"menu\"\n    :class=\"ns.b()\"\n    :wrap-class=\"ns.e('wrap')\"\n    :view-class=\"[ns.e('list'), ns.is('empty', isEmpty)]\"\n    @mousemove=\"handleMouseMove\"\n    @mouseleave=\"clearHoverZone\"\n  >\n    <el-cascader-node\n      v-for=\"node in nodes\"\n      :key=\"node.uid\"\n      :node=\"node\"\n      :menu-id=\"menuId\"\n      @expand=\"handleExpand\"\n    />\n    <div v-if=\"isLoading\" :class=\"ns.e('empty-text')\">\n      <el-icon :size=\"14\" :class=\"ns.is('loading')\">\n        <Loading />\n      </el-icon>\n      {{ t('el.cascader.loading') }}\n    </div>\n    <div v-else-if=\"isEmpty\" :class=\"ns.e('empty-text')\">\n      <slot name=\"empty\">{{ t('el.cascader.noData') }}</slot>\n    </div>\n    <!-- eslint-disable vue/html-self-closing -->\n    <svg\n      v-else-if=\"panel?.isHoverMenu\"\n      ref=\"hoverZone\"\n      :class=\"ns.e('hover-zone')\"\n    ></svg>\n    <!-- eslint-enable vue/html-self-closing -->\n  </el-scrollbar>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, getCurrentInstance, inject, nextTick, ref } from 'vue'\nimport { clamp } from 'lodash-unified'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { FixedSizeList as ElFixedSizeList } from '@element-plus/components/virtual-list'\nimport { useId, useLocale, useNamespace } from '@element-plus/hooks'\nimport { Loading } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { focusNode } from '@element-plus/utils'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport { CASCADER_PANEL_HEIGHT, CASCADER_PANEL_ITEM_SIZE } from './config'\n\nimport type { CascaderNode } from './types'\nimport type { CascaderCommonProps } from './config'\nimport type { FixedSizeListInstance } from '@element-plus/components/virtual-list'\n\ndefineOptions({\n  name: 'ElCascaderMenu',\n})\n\nconst props = withDefaults(\n  defineProps<\n    {\n      nodes: CascaderNode[]\n      index: number\n    } & Pick<CascaderCommonProps, 'virtualScroll' | 'itemSize' | 'height'>\n  >(),\n  {\n    virtualScroll: false,\n    itemSize: CASCADER_PANEL_ITEM_SIZE,\n    height: CASCADER_PANEL_HEIGHT,\n  }\n)\n\nconst instance = getCurrentInstance()!\nconst ns = useNamespace('cascader-menu')\n\nconst { t } = useLocale()\nconst id = useId()\nlet activeNode: HTMLElement\nlet hoverTimer: number | undefined\n\nconst panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\nconst hoverZone = ref<SVGSVGElement>()\nconst virtualListRef = ref<FixedSizeListInstance>()\n\nconst isEmpty = computed(() => !props.nodes.length)\nconst isLoading = computed(() => !panel.initialLoaded)\nconst menuId = computed(() => `${id.value}-${props.index}`)\n\nconst getActiveNodeIndex = () => {\n  let activeNodeId: number | undefined\n\n  if (panel.expandingNode) {\n    const { level, pathNodes } = panel.expandingNode\n    if (props.index < level) {\n      activeNodeId = pathNodes[props.index]?.uid\n    } else if (props.index === level && panel.checkedNodes.length > 0) {\n      activeNodeId = panel.checkedNodes[0]?.pathNodes[props.index]?.uid\n    }\n  } else if (\n    panel.checkedNodes.length > 0 &&\n    props.index < panel.checkedNodes[0].pathNodes.length\n  ) {\n    activeNodeId = panel.checkedNodes[0].pathNodes[props.index]?.uid\n  }\n\n  return activeNodeId !== undefined\n    ? props.nodes.findIndex((node) => node.uid === activeNodeId)\n    : -1\n}\n\nconst getNodeIndexById = (nodeId: string | undefined) => {\n  if (!nodeId) return -1\n  return props.nodes.findIndex(\n    (node) => `${menuId.value}-${node.uid}` === nodeId\n  )\n}\n\nconst scrollToItem = (index: number) => {\n  const targetIndex = clamp(index, 0, props.nodes.length - 1)\n  virtualListRef.value?.scrollToItem(targetIndex)\n}\n\nconst focusNodeAt = (index: number) => {\n  if (!props.nodes.length) return\n  const targetIndex = clamp(index, 0, props.nodes.length - 1)\n  scrollToItem(targetIndex)\n  nextTick(() => {\n    const node = (instance.vnode.el as HTMLElement)?.querySelector<HTMLElement>(\n      `#${menuId.value}-${props.nodes[targetIndex].uid}`\n    )\n    if (node) focusNode(node)\n  })\n}\n\nconst handleExpand = (e: MouseEvent) => {\n  activeNode = e.target as HTMLElement\n}\n\nconst handleMouseMove = (e: MouseEvent) => {\n  if (!panel.isHoverMenu || !activeNode || !hoverZone.value) return\n\n  if (activeNode.contains(e.target as HTMLElement)) {\n    clearHoverTimer()\n\n    const el = instance.vnode.el as HTMLElement\n    const { left } = el.getBoundingClientRect()\n    const { offsetWidth, offsetHeight } = el\n    const startX = e.clientX - left\n    const top = activeNode.offsetTop\n    const bottom = top + activeNode.offsetHeight\n\n    const scrollTop = props.virtualScroll\n      ? virtualListRef.value?.states?.scrollOffset || 0\n      : el.querySelector(`.${ns.e('wrap')}`)?.scrollTop || 0\n\n    hoverZone.value.innerHTML = `\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${top} L${offsetWidth} ${scrollTop} V${top} Z\" />\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${bottom} L${offsetWidth} ${offsetHeight + scrollTop} V${bottom} Z\" />\n        `\n  } else if (!hoverTimer) {\n    hoverTimer = window.setTimeout(clearHoverZone, panel.config.hoverThreshold)\n  }\n}\n\nconst clearHoverTimer = () => {\n  if (!hoverTimer) return\n  clearTimeout(hoverTimer)\n  hoverTimer = undefined\n}\n\nconst clearHoverZone = () => {\n  if (!hoverZone.value) return\n  hoverZone.value.innerHTML = ''\n  clearHoverTimer()\n}\n\ndefineExpose({\n  getActiveNodeIndex,\n  getNodeIndexById,\n  scrollToItem,\n  focusNodeAt,\n  virtualListRef,\n  get $el() {\n    return instance.vnode.el as HTMLElement\n  },\n})\n</script>\n"],"mappings":"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"}

package/lib/components/cascader-panel/src/node.vue_vue_type_script_setup_true_lang.js

@@ -24,7 +24,10 @@ var node_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.d
 			type: Object,
 			required: true
 		},
-		menuId: String
+		menuId: {
+			type: String,
+			required: false
+		}
 	},
 	emits: ["expand"],
 	setup(__props, { emit: __emit }) {

package/lib/components/cascader-panel/src/node.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"node.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/node.vue"],"sourcesContent":["<template>\n  <li\n    :id=\"`${menuId}-${node.uid}`\"\n    role=\"menuitem\"\n    :aria-haspopup=\"!isLeaf\"\n    :aria-owns=\"isLeaf ? undefined : menuId\"\n    :aria-expanded=\"inExpandingPath\"\n    :tabindex=\"expandable ? -1 : undefined\"\n    :class=\"[\n      ns.b(),\n      ns.is('selectable', checkStrictly),\n      ns.is('active', node.checked),\n      ns.is('disabled', !expandable),\n      inExpandingPath && 'in-active-path',\n      inCheckedPath && 'in-checked-path',\n    ]\"\n    @mouseenter=\"handleHoverExpand\"\n    @focus=\"handleHoverExpand\"\n    @click=\"handleClick\"\n  >\n    <!-- prefix -->\n    <el-checkbox\n      v-if=\"multiple && showPrefix\"\n      :model-value=\"node.checked\"\n      :indeterminate=\"node.indeterminate\"\n      :disabled=\"isDisabled\"\n      @click.stop\n      @update:model-value=\"handleSelectCheck\"\n    />\n    <el-radio\n      v-else-if=\"checkStrictly && showPrefix\"\n      :model-value=\"checkedNodeId\"\n      :label=\"node.uid\"\n      :disabled=\"isDisabled\"\n      @update:model-value=\"handleSelectCheck\"\n      @click.stop\n    >\n      <!--\n        Add an empty element to avoid render label,\n        do not use empty fragment here for https://github.com/vuejs/vue-next/pull/2485\n      -->\n      <span />\n    </el-radio>\n    <el-icon v-else-if=\"isLeaf && node.checked\" :class=\"ns.e('prefix')\">\n      <check />\n    </el-icon>\n\n    <!-- content -->\n    <node-content :node=\"node\" />\n    <!-- postfix -->\n    <template v-if=\"!isLeaf\">\n      <el-icon v-if=\"node.loading\" :class=\"[ns.is('loading'), ns.e('postfix')]\">\n        <loading />\n      </el-icon>\n      <el-icon v-else :class=\"['arrow-right', ns.e('postfix')]\">\n        <arrow-right />\n      </el-icon>\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport ElRadio from '@element-plus/components/radio'\nimport ElIcon from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { ArrowRight, Check, Loading } from '@element-plus/icons-vue'\nimport NodeContent from './node-content'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { CascaderNode } from './types'\nimport type { PropType } from 'vue'\nimport type { CheckboxValueType } from '@element-plus/components/checkbox'\n\ndefineOptions({\n  name: 'ElCascaderNode',\n})\n\nconst props = defineProps({\n  node: {\n    type: Object as PropType<CascaderNode>,\n    required: true,\n  },\n  menuId: String,\n})\nconst emit = defineEmits(['expand'])\n\nconst panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\nconst ns = useNamespace('cascader-node')\nconst isHoverMenu = computed(() => panel.isHoverMenu)\nconst multiple = computed(() => panel.config.multiple)\nconst checkStrictly = computed(() => panel.config.checkStrictly)\nconst showPrefix = computed(() => panel.config.showPrefix)\nconst checkedNodeId = computed(() => panel.checkedNodes[0]?.uid)\nconst isDisabled = computed(() => props.node.isDisabled)\nconst isLeaf = computed(() => props.node.isLeaf)\nconst expandable = computed(\n  () => (checkStrictly.value && !isLeaf.value) || !isDisabled.value\n)\nconst inExpandingPath = computed(() => isInPath(panel.expandingNode!))\n\n// only useful in check-strictly mode\nconst inCheckedPath = computed(\n  () => checkStrictly.value && panel.checkedNodes.some(isInPath)\n)\n\nconst isInPath = (node: CascaderNode) => {\n  const { level, uid } = props.node\n  return node?.pathNodes[level - 1]?.uid === uid\n}\n\nconst doExpand = () => {\n  if (inExpandingPath.value) return\n  panel.expandNode(props.node)\n}\n\nconst doCheck = (checked: boolean) => {\n  const { node } = props\n  if (checked === node.checked) return\n  panel.handleCheckChange(node, checked)\n}\n\nconst doLoad = () => {\n  panel.lazyLoad(props.node, () => {\n    if (!isLeaf.value) doExpand()\n  })\n}\n\nconst handleHoverExpand = (e: Event) => {\n  if (!isHoverMenu.value) return\n  handleExpand()\n  !isLeaf.value && emit('expand', e)\n}\n\nconst handleExpand = () => {\n  const { node } = props\n  // do not exclude leaf node because the menus expanded might have to reset\n  if (!expandable.value || node.loading) return\n  node.loaded ? doExpand() : doLoad()\n}\n\nconst handleClick = () => {\n  if (\n    isLeaf.value &&\n    !isDisabled.value &&\n    !checkStrictly.value &&\n    !multiple.value\n  ) {\n    handleCheck(true)\n  } else if (\n    ((panel.config.checkOnClickNode &&\n      (multiple.value || checkStrictly.value)) ||\n      (isLeaf.value && panel.config.checkOnClickLeaf)) &&\n    !isDisabled.value\n  ) {\n    handleSelectCheck(!props.node.checked)\n  } else if (!isHoverMenu.value) {\n    handleExpand()\n  }\n}\n\nconst handleSelectCheck = (checked: CheckboxValueType | undefined) => {\n  if (checkStrictly.value) {\n    doCheck(checked as boolean)\n    if (props.node.loaded) {\n      doExpand()\n    }\n  } else {\n    handleCheck(checked as boolean)\n  }\n}\n\nconst handleCheck = (checked: boolean) => {\n  if (!props.node.loaded) {\n    doLoad()\n  } else {\n    doCheck(checked)\n    !checkStrictly.value && doExpand()\n  }\n}\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"node.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/node.vue"],"sourcesContent":["<template>\n  <li\n    :id=\"`${menuId}-${node.uid}`\"\n    role=\"menuitem\"\n    :aria-haspopup=\"!isLeaf\"\n    :aria-owns=\"isLeaf ? undefined : menuId\"\n    :aria-expanded=\"inExpandingPath\"\n    :tabindex=\"expandable ? -1 : undefined\"\n    :class=\"[\n      ns.b(),\n      ns.is('selectable', checkStrictly),\n      ns.is('active', node.checked),\n      ns.is('disabled', !expandable),\n      inExpandingPath && 'in-active-path',\n      inCheckedPath && 'in-checked-path',\n    ]\"\n    @mouseenter=\"handleHoverExpand\"\n    @focus=\"handleHoverExpand\"\n    @click=\"handleClick\"\n  >\n    <!-- prefix -->\n    <el-checkbox\n      v-if=\"multiple && showPrefix\"\n      :model-value=\"node.checked\"\n      :indeterminate=\"node.indeterminate\"\n      :disabled=\"isDisabled\"\n      @click.stop\n      @update:model-value=\"handleSelectCheck\"\n    />\n    <el-radio\n      v-else-if=\"checkStrictly && showPrefix\"\n      :model-value=\"checkedNodeId\"\n      :label=\"node.uid\"\n      :disabled=\"isDisabled\"\n      @update:model-value=\"handleSelectCheck\"\n      @click.stop\n    >\n      <!--\n        Add an empty element to avoid render label,\n        do not use empty fragment here for https://github.com/vuejs/vue-next/pull/2485\n      -->\n      <span />\n    </el-radio>\n    <el-icon v-else-if=\"isLeaf && node.checked\" :class=\"ns.e('prefix')\">\n      <check />\n    </el-icon>\n\n    <!-- content -->\n    <node-content :node=\"node\" />\n    <!-- postfix -->\n    <template v-if=\"!isLeaf\">\n      <el-icon v-if=\"node.loading\" :class=\"[ns.is('loading'), ns.e('postfix')]\">\n        <loading />\n      </el-icon>\n      <el-icon v-else :class=\"['arrow-right', ns.e('postfix')]\">\n        <arrow-right />\n      </el-icon>\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport ElRadio from '@element-plus/components/radio'\nimport ElIcon from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { ArrowRight, Check, Loading } from '@element-plus/icons-vue'\nimport NodeContent from './node-content'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { CascaderNode } from './types'\nimport type { CheckboxValueType } from '@element-plus/components/checkbox'\n\ndefineOptions({\n  name: 'ElCascaderNode',\n})\n\nconst props = defineProps<{\n  node: CascaderNode\n  menuId?: string\n}>()\nconst emit = defineEmits(['expand'])\n\nconst panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\nconst ns = useNamespace('cascader-node')\nconst isHoverMenu = computed(() => panel.isHoverMenu)\nconst multiple = computed(() => panel.config.multiple)\nconst checkStrictly = computed(() => panel.config.checkStrictly)\nconst showPrefix = computed(() => panel.config.showPrefix)\nconst checkedNodeId = computed(() => panel.checkedNodes[0]?.uid)\nconst isDisabled = computed(() => props.node.isDisabled)\nconst isLeaf = computed(() => props.node.isLeaf)\nconst expandable = computed(\n  () => (checkStrictly.value && !isLeaf.value) || !isDisabled.value\n)\nconst inExpandingPath = computed(() => isInPath(panel.expandingNode!))\n\n// only useful in check-strictly mode\nconst inCheckedPath = computed(\n  () => checkStrictly.value && panel.checkedNodes.some(isInPath)\n)\n\nconst isInPath = (node: CascaderNode) => {\n  const { level, uid } = props.node\n  return node?.pathNodes[level - 1]?.uid === uid\n}\n\nconst doExpand = () => {\n  if (inExpandingPath.value) return\n  panel.expandNode(props.node)\n}\n\nconst doCheck = (checked: boolean) => {\n  const { node } = props\n  if (checked === node.checked) return\n  panel.handleCheckChange(node, checked)\n}\n\nconst doLoad = () => {\n  panel.lazyLoad(props.node, () => {\n    if (!isLeaf.value) doExpand()\n  })\n}\n\nconst handleHoverExpand = (e: Event) => {\n  if (!isHoverMenu.value) return\n  handleExpand()\n  !isLeaf.value && emit('expand', e)\n}\n\nconst handleExpand = () => {\n  const { node } = props\n  // do not exclude leaf node because the menus expanded might have to reset\n  if (!expandable.value || node.loading) return\n  node.loaded ? doExpand() : doLoad()\n}\n\nconst handleClick = () => {\n  if (\n    isLeaf.value &&\n    !isDisabled.value &&\n    !checkStrictly.value &&\n    !multiple.value\n  ) {\n    handleCheck(true)\n  } else if (\n    ((panel.config.checkOnClickNode &&\n      (multiple.value || checkStrictly.value)) ||\n      (isLeaf.value && panel.config.checkOnClickLeaf)) &&\n    !isDisabled.value\n  ) {\n    handleSelectCheck(!props.node.checked)\n  } else if (!isHoverMenu.value) {\n    handleExpand()\n  }\n}\n\nconst handleSelectCheck = (checked: CheckboxValueType | undefined) => {\n  if (checkStrictly.value) {\n    doCheck(checked as boolean)\n    if (props.node.loaded) {\n      doExpand()\n    }\n  } else {\n    handleCheck(checked as boolean)\n  }\n}\n\nconst handleCheck = (checked: boolean) => {\n  if (!props.node.loaded) {\n    doLoad()\n  } else {\n    doCheck(checked)\n    !checkStrictly.value && doExpand()\n  }\n}\n</script>\n"],"mappings":"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"}

package/lib/components/cascader-panel/src/node2.js.map

@@ -1 +1 @@
-{"version":3,"file":"node2.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/node.vue"],"sourcesContent":["<template>\n  <li\n    :id=\"`${menuId}-${node.uid}`\"\n    role=\"menuitem\"\n    :aria-haspopup=\"!isLeaf\"\n    :aria-owns=\"isLeaf ? undefined : menuId\"\n    :aria-expanded=\"inExpandingPath\"\n    :tabindex=\"expandable ? -1 : undefined\"\n    :class=\"[\n      ns.b(),\n      ns.is('selectable', checkStrictly),\n      ns.is('active', node.checked),\n      ns.is('disabled', !expandable),\n      inExpandingPath && 'in-active-path',\n      inCheckedPath && 'in-checked-path',\n    ]\"\n    @mouseenter=\"handleHoverExpand\"\n    @focus=\"handleHoverExpand\"\n    @click=\"handleClick\"\n  >\n    <!-- prefix -->\n    <el-checkbox\n      v-if=\"multiple && showPrefix\"\n      :model-value=\"node.checked\"\n      :indeterminate=\"node.indeterminate\"\n      :disabled=\"isDisabled\"\n      @click.stop\n      @update:model-value=\"handleSelectCheck\"\n    />\n    <el-radio\n      v-else-if=\"checkStrictly && showPrefix\"\n      :model-value=\"checkedNodeId\"\n      :label=\"node.uid\"\n      :disabled=\"isDisabled\"\n      @update:model-value=\"handleSelectCheck\"\n      @click.stop\n    >\n      <!--\n        Add an empty element to avoid render label,\n        do not use empty fragment here for https://github.com/vuejs/vue-next/pull/2485\n      -->\n      <span />\n    </el-radio>\n    <el-icon v-else-if=\"isLeaf && node.checked\" :class=\"ns.e('prefix')\">\n      <check />\n    </el-icon>\n\n    <!-- content -->\n    <node-content :node=\"node\" />\n    <!-- postfix -->\n    <template v-if=\"!isLeaf\">\n      <el-icon v-if=\"node.loading\" :class=\"[ns.is('loading'), ns.e('postfix')]\">\n        <loading />\n      </el-icon>\n      <el-icon v-else :class=\"['arrow-right', ns.e('postfix')]\">\n        <arrow-right />\n      </el-icon>\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport ElRadio from '@element-plus/components/radio'\nimport ElIcon from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { ArrowRight, Check, Loading } from '@element-plus/icons-vue'\nimport NodeContent from './node-content'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { CascaderNode } from './types'\nimport type { PropType } from 'vue'\nimport type { CheckboxValueType } from '@element-plus/components/checkbox'\n\ndefineOptions({\n  name: 'ElCascaderNode',\n})\n\nconst props = defineProps({\n  node: {\n    type: Object as PropType<CascaderNode>,\n    required: true,\n  },\n  menuId: String,\n})\nconst emit = defineEmits(['expand'])\n\nconst panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\nconst ns = useNamespace('cascader-node')\nconst isHoverMenu = computed(() => panel.isHoverMenu)\nconst multiple = computed(() => panel.config.multiple)\nconst checkStrictly = computed(() => panel.config.checkStrictly)\nconst showPrefix = computed(() => panel.config.showPrefix)\nconst checkedNodeId = computed(() => panel.checkedNodes[0]?.uid)\nconst isDisabled = computed(() => props.node.isDisabled)\nconst isLeaf = computed(() => props.node.isLeaf)\nconst expandable = computed(\n  () => (checkStrictly.value && !isLeaf.value) || !isDisabled.value\n)\nconst inExpandingPath = computed(() => isInPath(panel.expandingNode!))\n\n// only useful in check-strictly mode\nconst inCheckedPath = computed(\n  () => checkStrictly.value && panel.checkedNodes.some(isInPath)\n)\n\nconst isInPath = (node: CascaderNode) => {\n  const { level, uid } = props.node\n  return node?.pathNodes[level - 1]?.uid === uid\n}\n\nconst doExpand = () => {\n  if (inExpandingPath.value) return\n  panel.expandNode(props.node)\n}\n\nconst doCheck = (checked: boolean) => {\n  const { node } = props\n  if (checked === node.checked) return\n  panel.handleCheckChange(node, checked)\n}\n\nconst doLoad = () => {\n  panel.lazyLoad(props.node, () => {\n    if (!isLeaf.value) doExpand()\n  })\n}\n\nconst handleHoverExpand = (e: Event) => {\n  if (!isHoverMenu.value) return\n  handleExpand()\n  !isLeaf.value && emit('expand', e)\n}\n\nconst handleExpand = () => {\n  const { node } = props\n  // do not exclude leaf node because the menus expanded might have to reset\n  if (!expandable.value || node.loading) return\n  node.loaded ? doExpand() : doLoad()\n}\n\nconst handleClick = () => {\n  if (\n    isLeaf.value &&\n    !isDisabled.value &&\n    !checkStrictly.value &&\n    !multiple.value\n  ) {\n    handleCheck(true)\n  } else if (\n    ((panel.config.checkOnClickNode &&\n      (multiple.value || checkStrictly.value)) ||\n      (isLeaf.value && panel.config.checkOnClickLeaf)) &&\n    !isDisabled.value\n  ) {\n    handleSelectCheck(!props.node.checked)\n  } else if (!isHoverMenu.value) {\n    handleExpand()\n  }\n}\n\nconst handleSelectCheck = (checked: CheckboxValueType | undefined) => {\n  if (checkStrictly.value) {\n    doCheck(checked as boolean)\n    if (props.node.loaded) {\n      doExpand()\n    }\n  } else {\n    handleCheck(checked as boolean)\n  }\n}\n\nconst handleCheck = (checked: boolean) => {\n  if (!props.node.loaded) {\n    doLoad()\n  } else {\n    doCheck(checked)\n    !checkStrictly.value && doExpand()\n  }\n}\n</script>\n"],"mappings":""}
+{"version":3,"file":"node2.js","names":[],"sources":["../../../../../../packages/components/cascader-panel/src/node.vue"],"sourcesContent":["<template>\n  <li\n    :id=\"`${menuId}-${node.uid}`\"\n    role=\"menuitem\"\n    :aria-haspopup=\"!isLeaf\"\n    :aria-owns=\"isLeaf ? undefined : menuId\"\n    :aria-expanded=\"inExpandingPath\"\n    :tabindex=\"expandable ? -1 : undefined\"\n    :class=\"[\n      ns.b(),\n      ns.is('selectable', checkStrictly),\n      ns.is('active', node.checked),\n      ns.is('disabled', !expandable),\n      inExpandingPath && 'in-active-path',\n      inCheckedPath && 'in-checked-path',\n    ]\"\n    @mouseenter=\"handleHoverExpand\"\n    @focus=\"handleHoverExpand\"\n    @click=\"handleClick\"\n  >\n    <!-- prefix -->\n    <el-checkbox\n      v-if=\"multiple && showPrefix\"\n      :model-value=\"node.checked\"\n      :indeterminate=\"node.indeterminate\"\n      :disabled=\"isDisabled\"\n      @click.stop\n      @update:model-value=\"handleSelectCheck\"\n    />\n    <el-radio\n      v-else-if=\"checkStrictly && showPrefix\"\n      :model-value=\"checkedNodeId\"\n      :label=\"node.uid\"\n      :disabled=\"isDisabled\"\n      @update:model-value=\"handleSelectCheck\"\n      @click.stop\n    >\n      <!--\n        Add an empty element to avoid render label,\n        do not use empty fragment here for https://github.com/vuejs/vue-next/pull/2485\n      -->\n      <span />\n    </el-radio>\n    <el-icon v-else-if=\"isLeaf && node.checked\" :class=\"ns.e('prefix')\">\n      <check />\n    </el-icon>\n\n    <!-- content -->\n    <node-content :node=\"node\" />\n    <!-- postfix -->\n    <template v-if=\"!isLeaf\">\n      <el-icon v-if=\"node.loading\" :class=\"[ns.is('loading'), ns.e('postfix')]\">\n        <loading />\n      </el-icon>\n      <el-icon v-else :class=\"['arrow-right', ns.e('postfix')]\">\n        <arrow-right />\n      </el-icon>\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject } from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport ElRadio from '@element-plus/components/radio'\nimport ElIcon from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { ArrowRight, Check, Loading } from '@element-plus/icons-vue'\nimport NodeContent from './node-content'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { CascaderNode } from './types'\nimport type { CheckboxValueType } from '@element-plus/components/checkbox'\n\ndefineOptions({\n  name: 'ElCascaderNode',\n})\n\nconst props = defineProps<{\n  node: CascaderNode\n  menuId?: string\n}>()\nconst emit = defineEmits(['expand'])\n\nconst panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\nconst ns = useNamespace('cascader-node')\nconst isHoverMenu = computed(() => panel.isHoverMenu)\nconst multiple = computed(() => panel.config.multiple)\nconst checkStrictly = computed(() => panel.config.checkStrictly)\nconst showPrefix = computed(() => panel.config.showPrefix)\nconst checkedNodeId = computed(() => panel.checkedNodes[0]?.uid)\nconst isDisabled = computed(() => props.node.isDisabled)\nconst isLeaf = computed(() => props.node.isLeaf)\nconst expandable = computed(\n  () => (checkStrictly.value && !isLeaf.value) || !isDisabled.value\n)\nconst inExpandingPath = computed(() => isInPath(panel.expandingNode!))\n\n// only useful in check-strictly mode\nconst inCheckedPath = computed(\n  () => checkStrictly.value && panel.checkedNodes.some(isInPath)\n)\n\nconst isInPath = (node: CascaderNode) => {\n  const { level, uid } = props.node\n  return node?.pathNodes[level - 1]?.uid === uid\n}\n\nconst doExpand = () => {\n  if (inExpandingPath.value) return\n  panel.expandNode(props.node)\n}\n\nconst doCheck = (checked: boolean) => {\n  const { node } = props\n  if (checked === node.checked) return\n  panel.handleCheckChange(node, checked)\n}\n\nconst doLoad = () => {\n  panel.lazyLoad(props.node, () => {\n    if (!isLeaf.value) doExpand()\n  })\n}\n\nconst handleHoverExpand = (e: Event) => {\n  if (!isHoverMenu.value) return\n  handleExpand()\n  !isLeaf.value && emit('expand', e)\n}\n\nconst handleExpand = () => {\n  const { node } = props\n  // do not exclude leaf node because the menus expanded might have to reset\n  if (!expandable.value || node.loading) return\n  node.loaded ? doExpand() : doLoad()\n}\n\nconst handleClick = () => {\n  if (\n    isLeaf.value &&\n    !isDisabled.value &&\n    !checkStrictly.value &&\n    !multiple.value\n  ) {\n    handleCheck(true)\n  } else if (\n    ((panel.config.checkOnClickNode &&\n      (multiple.value || checkStrictly.value)) ||\n      (isLeaf.value && panel.config.checkOnClickLeaf)) &&\n    !isDisabled.value\n  ) {\n    handleSelectCheck(!props.node.checked)\n  } else if (!isHoverMenu.value) {\n    handleExpand()\n  }\n}\n\nconst handleSelectCheck = (checked: CheckboxValueType | undefined) => {\n  if (checkStrictly.value) {\n    doCheck(checked as boolean)\n    if (props.node.loaded) {\n      doExpand()\n    }\n  } else {\n    handleCheck(checked as boolean)\n  }\n}\n\nconst handleCheck = (checked: boolean) => {\n  if (!props.node.loaded) {\n    doLoad()\n  } else {\n    doCheck(checked)\n    !checkStrictly.value && doExpand()\n  }\n}\n</script>\n"],"mappings":""}

package/lib/components/cascader-panel/src/types.d.ts

@@ -56,6 +56,9 @@ interface ElCascaderPanelContext {
   isHoverMenu: boolean;
   initialLoaded: boolean;
   renderLabelFn?: RenderLabel;
+  virtualScroll: boolean;
+  itemSize: number;
+  height: number;
   lazyLoad: (node?: Node, cb?: (dataList: CascaderOption[]) => void) => void;
   expandNode: (node: Node, silent?: boolean) => void;
   handleCheckChange: (node: Node, checked: boolean, emitClose?: boolean) => void;