element-plus 1.2.0-beta.1 → 1.2.0-beta.2

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

@@ -1,6 +1,6 @@
-import Node from './node';
-import type { PropType, Ref } from 'vue';
-import type { CascaderValue, CascaderOption, RenderLabel } from './node';
+import Node, { ExpandTrigger } from './node';
+import type { PropType } from 'vue';
+import type { CascaderValue, CascaderNodeValue, CascaderOption, RenderLabel } from './node';
 declare const _default: import("vue").DefineComponent<{
     border: {
         type: BooleanConstructor;
@@ -17,13 +17,127 @@ declare const _default: import("vue").DefineComponent<{
         default: () => import("./node").CascaderProps;
     };
 }, {
-    menuList: Ref<never[]>;
-    menus: Ref<Node[][]>;
-    checkedNodes: Ref<Node[]>;
+    menuList: import("vue").Ref<any[]>;
+    menus: import("vue").Ref<{
+        readonly uid: number;
+        readonly level: number;
+        readonly value: CascaderNodeValue;
+        readonly label: string;
+        readonly pathNodes: any[];
+        readonly pathValues: CascaderNodeValue[];
+        readonly pathLabels: string[];
+        childrenData: {
+            [x: string]: unknown;
+            label?: string | undefined;
+            value?: CascaderNodeValue | undefined;
+            children?: any[] | undefined;
+            disabled?: boolean | undefined;
+            leaf?: boolean | undefined;
+        }[] | undefined;
+        children: any[];
+        text: string;
+        loaded: boolean;
+        checked: boolean;
+        indeterminate: boolean;
+        loading: boolean;
+        readonly data: {
+            [x: string]: unknown;
+            label?: string | undefined;
+            value?: CascaderNodeValue | undefined;
+            children?: any[] | undefined;
+            disabled?: boolean | undefined;
+            leaf?: boolean | undefined;
+        } | null;
+        readonly config: {
+            expandTrigger: ExpandTrigger;
+            multiple: boolean;
+            checkStrictly: boolean;
+            emitPath: boolean;
+            lazy: boolean;
+            lazyLoad: import("./node").LazyLoad;
+            value: string;
+            label: string;
+            children: string;
+            disabled: string | import("./node").isDisabled;
+            leaf: string | import("./node").isLeaf;
+            hoverThreshold: number;
+        };
+        readonly parent?: any | undefined;
+        readonly root: boolean;
+        readonly isDisabled: boolean;
+        readonly isLeaf: boolean;
+        readonly valueByOption: CascaderNodeValue | CascaderNodeValue[];
+        appendChild: (childData: CascaderOption) => Node;
+        calcText: (allLevels: boolean, separator: string) => string;
+        broadcast: (event: string, ...args: unknown[]) => void;
+        emit: (event: string, ...args: unknown[]) => void;
+        onParentCheck: (checked: boolean) => void;
+        onChildCheck: () => void;
+        setCheckState: (checked: boolean) => void;
+        doCheck: (checked: boolean) => void;
+    }[][]>;
+    checkedNodes: import("vue").Ref<{
+        readonly uid: number;
+        readonly level: number;
+        readonly value: CascaderNodeValue;
+        readonly label: string;
+        readonly pathNodes: any[];
+        readonly pathValues: CascaderNodeValue[];
+        readonly pathLabels: string[];
+        childrenData: {
+            [x: string]: unknown;
+            label?: string | undefined;
+            value?: CascaderNodeValue | undefined;
+            children?: any[] | undefined;
+            disabled?: boolean | undefined;
+            leaf?: boolean | undefined;
+        }[] | undefined;
+        children: any[];
+        text: string;
+        loaded: boolean;
+        checked: boolean;
+        indeterminate: boolean;
+        loading: boolean;
+        readonly data: {
+            [x: string]: unknown;
+            label?: string | undefined;
+            value?: CascaderNodeValue | undefined;
+            children?: any[] | undefined;
+            disabled?: boolean | undefined;
+            leaf?: boolean | undefined;
+        } | null;
+        readonly config: {
+            expandTrigger: ExpandTrigger;
+            multiple: boolean;
+            checkStrictly: boolean;
+            emitPath: boolean;
+            lazy: boolean;
+            lazyLoad: import("./node").LazyLoad;
+            value: string;
+            label: string;
+            children: string;
+            disabled: string | import("./node").isDisabled;
+            leaf: string | import("./node").isLeaf;
+            hoverThreshold: number;
+        };
+        readonly parent?: any | undefined;
+        readonly root: boolean;
+        readonly isDisabled: boolean;
+        readonly isLeaf: boolean;
+        readonly valueByOption: CascaderNodeValue | CascaderNodeValue[];
+        appendChild: (childData: CascaderOption) => Node;
+        calcText: (allLevels: boolean, separator: string) => string;
+        broadcast: (event: string, ...args: unknown[]) => void;
+        emit: (event: string, ...args: unknown[]) => void;
+        onParentCheck: (checked: boolean) => void;
+        onChildCheck: () => void;
+        setCheckState: (checked: boolean) => void;
+        doCheck: (checked: boolean) => void;
+    }[]>;
     handleKeyDown: (e: KeyboardEvent) => void;
     handleCheckChange: (node: Node, checked: boolean, emitClose?: boolean | undefined) => void;
-    getFlattedNodes: (leafOnly: boolean) => Node[];
-    getCheckedNodes: (leafOnly: boolean) => Node[];
+    getFlattedNodes: (leafOnly: boolean) => Node[] | undefined;
+    getCheckedNodes: (leafOnly: boolean) => Node[] | undefined;
     clearCheckedNodes: () => void;
     calculateCheckedValue: () => void;
     scrollToExpandingNode: () => void;

package/es/components/cascader-panel/src/index.vue_vue&type=script&lang.mjs

@@ -47,7 +47,7 @@ var script = defineComponent({
       menus.value = [store.value.getNodes()];
       if (cfg.lazy && isEmpty(props.options)) {
         initialLoaded = false;
-        lazyLoad(null, () => {
+        lazyLoad(void 0, () => {
           initialLoaded = true;
           syncCheckedValue(false, true);
         });
@@ -57,14 +57,16 @@ var script = defineComponent({
     };
     const lazyLoad = (node, cb) => {
       const cfg = config.value;
-      node = node || new Node({}, cfg, null, true);
+      node = node || new Node({}, cfg, void 0, true);
       node.loading = true;
       const resolve = (dataList) => {
-        const parent = node.root ? null : node;
-        dataList && store.value.appendNodes(dataList, parent);
-        node.loading = false;
-        node.loaded = true;
-        node.childrenData = node.childrenData || [];
+        var _a;
+        const _node = node;
+        const parent = _node.root ? null : _node;
+        dataList && ((_a = store.value) == null ? void 0 : _a.appendNodes(dataList, parent));
+        _node.loading = false;
+        _node.loaded = true;
+        _node.childrenData = _node.childrenData || [];
         cb && cb(dataList);
       };
       cfg.lazyLoad(node, resolve);
@@ -94,12 +96,22 @@ var script = defineComponent({
       node.doCheck(checked);
       calculateCheckedValue();
       emitClose && !multiple && !checkStrictly && emit("close");
+      !emitClose && !multiple && !checkStrictly && expandParentNode(node);
+    };
+    const expandParentNode = (node) => {
+      if (!node)
+        return;
+      node = node.parent;
+      expandParentNode(node);
+      node && expandNode(node);
     };
     const getFlattedNodes = (leafOnly) => {
-      return store.value.getFlattedNodes(leafOnly);
+      var _a;
+      return (_a = store.value) == null ? void 0 : _a.getFlattedNodes(leafOnly);
     };
     const getCheckedNodes = (leafOnly) => {
-      return getFlattedNodes(leafOnly).filter((node) => node.checked !== false);
+      var _a;
+      return (_a = getFlattedNodes(leafOnly)) == null ? void 0 : _a.filter((node) => node.checked !== false);
     };
     const clearCheckedNodes = () => {
       checkedNodes.value.forEach((node) => node.doCheck(false));
@@ -123,7 +135,10 @@ var script = defineComponent({
         return;
       if (lazy && !loaded) {
         const values = deduplicate(arrayFlat(coerceTruthyValueToArray(modelValue)));
-        const nodes = values.map((val) => store.value.getNodeByValue(val)).filter((node) => !!node && !node.loaded && !node.loading);
+        const nodes = values.map((val) => {
+          var _a;
+          return (_a = store.value) == null ? void 0 : _a.getNodeByValue(val);
+        }).filter((node) => !!node && !node.loaded && !node.loading);
         if (nodes.length) {
           nodes.forEach((node) => {
             lazyLoad(node, () => syncCheckedValue(false, forced));
@@ -133,16 +148,20 @@ var script = defineComponent({
         }
       } else {
         const values = multiple ? coerceTruthyValueToArray(modelValue) : [modelValue];
-        const nodes = deduplicate(values.map((val) => store.value.getNodeByValue(val, leafOnly)));
+        const nodes = deduplicate(values.map((val) => {
+          var _a;
+          return (_a = store.value) == null ? void 0 : _a.getNodeByValue(val, leafOnly);
+        }));
         syncMenuState(nodes, false);
         checkedValue.value = modelValue;
       }
     };
     const syncMenuState = (newCheckedNodes, reserveExpandingState = true) => {
+      var _a;
       const { checkStrictly } = config.value;
       const oldNodes = checkedNodes.value;
       const newNodes = newCheckedNodes.filter((node) => !!node && (checkStrictly || node.isLeaf));
-      const oldExpandingNode = store.value.getSameNode(expandingNode.value);
+      const oldExpandingNode = (_a = store.value) == null ? void 0 : _a.getSameNode(expandingNode.value);
       const newExpandingNode = reserveExpandingState && oldExpandingNode || newNodes[0];
       if (newExpandingNode) {
         newExpandingNode.pathNodes.forEach((node) => expandNode(node, true));

package/es/components/cascader-panel/src/index.vue_vue&type=script&lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue&type=script&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/index.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"['el-cascader-panel', border && 'is-bordered']\"\n    @keydown=\"handleKeyDown\"\n  >\n    <el-cascader-menu\n      v-for=\"(menu, index) in menus\"\n      :key=\"index\"\n      :ref=\"(item) => (menuList[index] = item)\"\n      :index=\"index\"\n      :nodes=\"menu\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  nextTick,\n  onBeforeUpdate,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  watch,\n} from 'vue'\nimport isEqual from 'lodash/isEqual'\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport isServer from '@element-plus/utils/isServer'\nimport scrollIntoView from '@element-plus/utils/scroll-into-view'\nimport {\n  arrayFlat,\n  coerceTruthyValueToArray,\n  deduplicate,\n  isEmpty,\n} from '@element-plus/utils/util'\n\nimport ElCascaderMenu from './menu.vue'\nimport Store from './store'\nimport Node, { ExpandTrigger } from './node'\nimport { CommonProps, useCascaderConfig } from './config'\nimport { checkNode, getMenuIndex, sortByOriginalOrder } from './utils'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { PropType, Ref } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type {\n  CascaderValue,\n  CascaderNodeValue,\n  CascaderOption,\n  RenderLabel,\n  default as CascaderNode,\n} from './node'\n\nimport type { ElCascaderPanelContext } from './types'\n\nexport default defineComponent({\n  name: 'ElCascaderPanel',\n\n  components: {\n    ElCascaderMenu,\n  },\n\n  props: {\n    ...CommonProps,\n    border: {\n      type: Boolean,\n      default: true,\n    },\n    renderLabel: Function as PropType<RenderLabel>,\n  },\n\n  emits: [UPDATE_MODEL_EVENT, CHANGE_EVENT, 'close', 'expand-change'],\n\n  setup(props, { emit, slots }) {\n    let initialLoaded = true\n    // for interrupt sync check status in lazy mode\n    let manualChecked = false\n\n    const config = useCascaderConfig(props)\n\n    const store: Ref<Store> = ref(null)\n    const menuList = ref([])\n    const checkedValue: Ref<Nullable<CascaderValue>> = ref(null)\n    const menus: Ref<CascaderNode[][]> = ref([])\n    const expandingNode: Ref<Nullable<CascaderNode>> = ref(null)\n    const checkedNodes: Ref<CascaderNode[]> = ref([])\n\n    const isHoverMenu = computed(\n      () => config.value.expandTrigger === ExpandTrigger.HOVER\n    )\n    const renderLabelFn = computed(() => props.renderLabel || slots.default)\n\n    const initStore = () => {\n      const { options } = props\n      const cfg = config.value\n\n      manualChecked = false\n      store.value = new Store(options, cfg)\n      menus.value = [store.value.getNodes()]\n\n      if (cfg.lazy && isEmpty(props.options)) {\n        initialLoaded = false\n        lazyLoad(null, () => {\n          initialLoaded = true\n          syncCheckedValue(false, true)\n        })\n      } else {\n        syncCheckedValue(false, true)\n      }\n    }\n\n    const lazyLoad: ElCascaderPanelContext['lazyLoad'] = (node, cb) => {\n      const cfg = config.value\n      node = node || new Node({}, cfg, null, true)\n      node.loading = true\n\n      const resolve = (dataList: CascaderOption[]) => {\n        const parent = node.root ? null : node\n        dataList && store.value.appendNodes(dataList, parent)\n        node.loading = false\n        node.loaded = true\n        node.childrenData = node.childrenData || []\n        cb && cb(dataList)\n      }\n\n      cfg.lazyLoad(node, resolve)\n    }\n\n    const expandNode: ElCascaderPanelContext['expandNode'] = (node, silent) => {\n      const { level } = node\n      const newMenus = menus.value.slice(0, level)\n      let newExpandingNode: Nullable<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\n    const 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    }\n\n    const getFlattedNodes = (leafOnly: boolean) => {\n      return store.value.getFlattedNodes(leafOnly)\n    }\n\n    const getCheckedNodes = (leafOnly: boolean) => {\n      return getFlattedNodes(leafOnly).filter((node) => node.checked !== false)\n    }\n\n    const clearCheckedNodes = () => {\n      checkedNodes.value.forEach((node) => node.doCheck(false))\n      calculateCheckedValue()\n    }\n\n    const 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\n    const 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 ||\n        manualChecked ||\n        (!forced && isEqual(modelValue, checkedValue.value))\n      )\n        return\n\n      if (lazy && !loaded) {\n        const values: CascaderNodeValue[] = deduplicate(\n          arrayFlat(coerceTruthyValueToArray(modelValue))\n        )\n        const nodes = values\n          .map((val) => store.value.getNodeByValue(val))\n          .filter((node) => !!node && !node.loaded && !node.loading)\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\n          ? coerceTruthyValueToArray(modelValue)\n          : [modelValue]\n        const nodes = deduplicate(\n          values.map((val) => store.value.getNodeByValue(val, leafOnly))\n        )\n        syncMenuState(nodes, false)\n        checkedValue.value = modelValue\n      }\n    }\n\n    const 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.value.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 = null\n      }\n\n      oldNodes.forEach((node) => node.doCheck(false))\n      newNodes.forEach((node) => node.doCheck(true))\n\n      checkedNodes.value = newNodes\n      nextTick(scrollToExpandingNode)\n    }\n\n    const scrollToExpandingNode = () => {\n      if (isServer) return\n\n      menuList.value.forEach((menu) => {\n        const menuElement = menu?.$el\n        if (menuElement) {\n          const container = menuElement.querySelector('.el-scrollbar__wrap')\n          const activeNode =\n            menuElement.querySelector('.el-cascader-node.is-active') ||\n            menuElement.querySelector('.el-cascader-node.in-active-path')\n          scrollIntoView(container, activeNode)\n        }\n      })\n    }\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      const target = e.target as HTMLElement\n      const { code } = e\n\n      switch (code) {\n        case EVENT_CODE.up:\n        case EVENT_CODE.down: {\n          const distance = code === EVENT_CODE.up ? -1 : 1\n          focusNode(\n            getSibling(target, distance, '.el-cascader-node[tabindex=\"-1\"]')\n          )\n          break\n        }\n        case EVENT_CODE.left: {\n          const preMenu = menuList.value[getMenuIndex(target) - 1]\n          const expandedNode = preMenu?.$el.querySelector(\n            '.el-cascader-node[aria-expanded=\"true\"]'\n          )\n          focusNode(expandedNode)\n          break\n        }\n        case EVENT_CODE.right: {\n          const nextMenu = menuList.value[getMenuIndex(target) + 1]\n          const firstNode = nextMenu?.$el.querySelector(\n            '.el-cascader-node[tabindex=\"-1\"]'\n          )\n          focusNode(firstNode)\n          break\n        }\n        case EVENT_CODE.enter:\n          checkNode(target)\n          break\n        case EVENT_CODE.esc:\n        case EVENT_CODE.tab:\n          emit('close')\n          break\n      }\n    }\n\n    provide(\n      CASCADER_PANEL_INJECTION_KEY,\n      reactive({\n        config,\n        expandingNode,\n        checkedNodes,\n        isHoverMenu,\n        renderLabelFn,\n        lazyLoad,\n        expandNode,\n        handleCheckChange,\n      })\n    )\n\n    watch([config, () => props.options], initStore, {\n      deep: true,\n      immediate: true,\n    })\n\n    watch(\n      () => props.modelValue,\n      () => {\n        manualChecked = false\n        syncCheckedValue()\n      }\n    )\n\n    watch(checkedValue, (val) => {\n      if (!isEqual(val, props.modelValue)) {\n        emit(UPDATE_MODEL_EVENT, val)\n        emit(CHANGE_EVENT, val)\n      }\n    })\n\n    onBeforeUpdate(() => (menuList.value = []))\n\n    onMounted(() => !isEmpty(props.modelValue) && syncCheckedValue())\n\n    return {\n      menuList,\n      menus,\n      checkedNodes,\n      handleKeyDown,\n      handleCheckChange,\n      getFlattedNodes,\n      getCheckedNodes,\n      clearCheckedNodes,\n      calculateCheckedValue,\n      scrollToExpandingNode,\n    }\n  },\n})\n</script>\n"],"names":["ElCascaderMenu"],"mappings":"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"}
+{"version":3,"file":"index.vue_vue&type=script&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/index.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"['el-cascader-panel', border && 'is-bordered']\"\n    @keydown=\"handleKeyDown\"\n  >\n    <el-cascader-menu\n      v-for=\"(menu, index) in menus\"\n      :key=\"index\"\n      :ref=\"(item) => (menuList[index] = item)\"\n      :index=\"index\"\n      :nodes=\"menu\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  nextTick,\n  onBeforeUpdate,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  watch,\n} from 'vue'\nimport isEqual from 'lodash/isEqual'\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport isServer from '@element-plus/utils/isServer'\nimport scrollIntoView from '@element-plus/utils/scroll-into-view'\nimport {\n  arrayFlat,\n  coerceTruthyValueToArray,\n  deduplicate,\n  isEmpty,\n} from '@element-plus/utils/util'\n\nimport ElCascaderMenu from './menu.vue'\nimport Store from './store'\nimport Node, { ExpandTrigger } from './node'\nimport { CommonProps, useCascaderConfig } from './config'\nimport { checkNode, getMenuIndex, sortByOriginalOrder } from './utils'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { PropType } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type {\n  CascaderValue,\n  CascaderNodeValue,\n  CascaderOption,\n  RenderLabel,\n  default as CascaderNode,\n} from './node'\n\nimport type { ElCascaderPanelContext } from './types'\n\nexport default defineComponent({\n  name: 'ElCascaderPanel',\n\n  components: {\n    ElCascaderMenu,\n  },\n\n  props: {\n    ...CommonProps,\n    border: {\n      type: Boolean,\n      default: true,\n    },\n    renderLabel: Function as PropType<RenderLabel>,\n  },\n\n  emits: [UPDATE_MODEL_EVENT, CHANGE_EVENT, 'close', 'expand-change'],\n\n  setup(props, { emit, slots }) {\n    let initialLoaded = true\n    // for interrupt sync check status in lazy mode\n    let manualChecked = false\n\n    const config = useCascaderConfig(props)\n\n    const store = ref<Nullable<Store>>(null)\n    const menuList = ref<any[]>([])\n    const checkedValue = ref<Nullable<CascaderValue>>(null)\n    const menus = ref<CascaderNode[][]>([])\n    const expandingNode = ref<Nullable<CascaderNode>>(null)\n    const checkedNodes = ref<CascaderNode[]>([])\n\n    const isHoverMenu = computed(\n      () => config.value.expandTrigger === ExpandTrigger.HOVER\n    )\n    const renderLabelFn = computed(() => props.renderLabel || slots.default)\n\n    const initStore = () => {\n      const { options } = props\n      const cfg = config.value\n\n      manualChecked = false\n      store.value = new Store(options, cfg)\n      menus.value = [store.value.getNodes()]\n\n      if (cfg.lazy && isEmpty(props.options)) {\n        initialLoaded = false\n        lazyLoad(undefined, () => {\n          initialLoaded = true\n          syncCheckedValue(false, true)\n        })\n      } else {\n        syncCheckedValue(false, true)\n      }\n    }\n\n    const 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        dataList && store.value?.appendNodes(dataList, parent as any)\n        _node.loading = false\n        _node.loaded = true\n        _node.childrenData = _node.childrenData || []\n        cb && cb(dataList)\n      }\n\n      cfg.lazyLoad(node, resolve as any)\n    }\n\n    const expandNode: ElCascaderPanelContext['expandNode'] = (node, silent) => {\n      const { level } = node\n      const newMenus = menus.value.slice(0, level)\n      let newExpandingNode: Nullable<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\n    const 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 && !checkStrictly && expandParentNode(node)\n    }\n\n    const expandParentNode = (node) => {\n      if (!node) return\n      node = node.parent\n      expandParentNode(node)\n      node && expandNode(node)\n    }\n\n    const getFlattedNodes = (leafOnly: boolean) => {\n      return store.value?.getFlattedNodes(leafOnly)\n    }\n\n    const getCheckedNodes = (leafOnly: boolean) => {\n      return getFlattedNodes(leafOnly)?.filter((node) => node.checked !== false)\n    }\n\n    const clearCheckedNodes = () => {\n      checkedNodes.value.forEach((node) => node.doCheck(false))\n      calculateCheckedValue()\n    }\n\n    const 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\n    const 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 ||\n        manualChecked ||\n        (!forced && isEqual(modelValue, checkedValue.value))\n      )\n        return\n\n      if (lazy && !loaded) {\n        const values: CascaderNodeValue[] = deduplicate(\n          arrayFlat(coerceTruthyValueToArray(modelValue))\n        )\n        const nodes = values\n          .map((val) => store.value?.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\n          ? coerceTruthyValueToArray(modelValue)\n          : [modelValue]\n        const nodes = deduplicate(\n          values.map((val) => store.value?.getNodeByValue(val, leafOnly))\n        ) as Node[]\n        syncMenuState(nodes, false)\n        checkedValue.value = modelValue!\n      }\n    }\n\n    const 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.value?.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 = null\n      }\n\n      oldNodes.forEach((node) => node.doCheck(false))\n      newNodes.forEach((node) => node.doCheck(true))\n\n      checkedNodes.value = newNodes\n      nextTick(scrollToExpandingNode)\n    }\n\n    const scrollToExpandingNode = () => {\n      if (isServer) return\n\n      menuList.value.forEach((menu) => {\n        const menuElement = menu?.$el\n        if (menuElement) {\n          const container = menuElement.querySelector('.el-scrollbar__wrap')\n          const activeNode =\n            menuElement.querySelector('.el-cascader-node.is-active') ||\n            menuElement.querySelector('.el-cascader-node.in-active-path')\n          scrollIntoView(container, activeNode)\n        }\n      })\n    }\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      const target = e.target as HTMLElement\n      const { code } = e\n\n      switch (code) {\n        case EVENT_CODE.up:\n        case EVENT_CODE.down: {\n          const distance = code === EVENT_CODE.up ? -1 : 1\n          focusNode(\n            getSibling(target, distance, '.el-cascader-node[tabindex=\"-1\"]')\n          )\n          break\n        }\n        case EVENT_CODE.left: {\n          const preMenu = menuList.value[getMenuIndex(target) - 1]\n          const expandedNode = preMenu?.$el.querySelector(\n            '.el-cascader-node[aria-expanded=\"true\"]'\n          )\n          focusNode(expandedNode)\n          break\n        }\n        case EVENT_CODE.right: {\n          const nextMenu = menuList.value[getMenuIndex(target) + 1]\n          const firstNode = nextMenu?.$el.querySelector(\n            '.el-cascader-node[tabindex=\"-1\"]'\n          )\n          focusNode(firstNode)\n          break\n        }\n        case EVENT_CODE.enter:\n          checkNode(target)\n          break\n        case EVENT_CODE.esc:\n        case EVENT_CODE.tab:\n          emit('close')\n          break\n      }\n    }\n\n    provide(\n      CASCADER_PANEL_INJECTION_KEY,\n      reactive({\n        config,\n        expandingNode,\n        checkedNodes,\n        isHoverMenu,\n        renderLabelFn,\n        lazyLoad,\n        expandNode,\n        handleCheckChange,\n      })\n    )\n\n    watch([config, () => props.options], initStore, {\n      deep: true,\n      immediate: true,\n    })\n\n    watch(\n      () => props.modelValue,\n      () => {\n        manualChecked = false\n        syncCheckedValue()\n      }\n    )\n\n    watch(checkedValue, (val) => {\n      if (!isEqual(val, props.modelValue)) {\n        emit(UPDATE_MODEL_EVENT, val)\n        emit(CHANGE_EVENT, val)\n      }\n    })\n\n    onBeforeUpdate(() => (menuList.value = []))\n\n    onMounted(() => !isEmpty(props.modelValue) && syncCheckedValue())\n\n    return {\n      menuList,\n      menus,\n      checkedNodes,\n      handleKeyDown,\n      handleCheckChange,\n      getFlattedNodes,\n      getCheckedNodes,\n      clearCheckedNodes,\n      calculateCheckedValue,\n      scrollToExpandingNode,\n    }\n  },\n})\n</script>\n"],"names":["ElCascaderMenu"],"mappings":"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"}

package/es/components/cascader-panel/src/index.vue_vue&type=template&id=97c48f5c&lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.vue_vue&type=template&id=97c48f5c&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/index.vue?vue&type=template&id=97c48f5c&lang.js"],"sourcesContent":["<template>\n  <div\n    :class=\"['el-cascader-panel', border && 'is-bordered']\"\n    @keydown=\"handleKeyDown\"\n  >\n    <el-cascader-menu\n      v-for=\"(menu, index) in menus\"\n      :key=\"index\"\n      :ref=\"(item) => (menuList[index] = item)\"\n      :index=\"index\"\n      :nodes=\"menu\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  nextTick,\n  onBeforeUpdate,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  watch,\n} from 'vue'\nimport isEqual from 'lodash/isEqual'\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport isServer from '@element-plus/utils/isServer'\nimport scrollIntoView from '@element-plus/utils/scroll-into-view'\nimport {\n  arrayFlat,\n  coerceTruthyValueToArray,\n  deduplicate,\n  isEmpty,\n} from '@element-plus/utils/util'\n\nimport ElCascaderMenu from './menu.vue'\nimport Store from './store'\nimport Node, { ExpandTrigger } from './node'\nimport { CommonProps, useCascaderConfig } from './config'\nimport { checkNode, getMenuIndex, sortByOriginalOrder } from './utils'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { PropType, Ref } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type {\n  CascaderValue,\n  CascaderNodeValue,\n  CascaderOption,\n  RenderLabel,\n  default as CascaderNode,\n} from './node'\n\nimport type { ElCascaderPanelContext } from './types'\n\nexport default defineComponent({\n  name: 'ElCascaderPanel',\n\n  components: {\n    ElCascaderMenu,\n  },\n\n  props: {\n    ...CommonProps,\n    border: {\n      type: Boolean,\n      default: true,\n    },\n    renderLabel: Function as PropType<RenderLabel>,\n  },\n\n  emits: [UPDATE_MODEL_EVENT, CHANGE_EVENT, 'close', 'expand-change'],\n\n  setup(props, { emit, slots }) {\n    let initialLoaded = true\n    // for interrupt sync check status in lazy mode\n    let manualChecked = false\n\n    const config = useCascaderConfig(props)\n\n    const store: Ref<Store> = ref(null)\n    const menuList = ref([])\n    const checkedValue: Ref<Nullable<CascaderValue>> = ref(null)\n    const menus: Ref<CascaderNode[][]> = ref([])\n    const expandingNode: Ref<Nullable<CascaderNode>> = ref(null)\n    const checkedNodes: Ref<CascaderNode[]> = ref([])\n\n    const isHoverMenu = computed(\n      () => config.value.expandTrigger === ExpandTrigger.HOVER\n    )\n    const renderLabelFn = computed(() => props.renderLabel || slots.default)\n\n    const initStore = () => {\n      const { options } = props\n      const cfg = config.value\n\n      manualChecked = false\n      store.value = new Store(options, cfg)\n      menus.value = [store.value.getNodes()]\n\n      if (cfg.lazy && isEmpty(props.options)) {\n        initialLoaded = false\n        lazyLoad(null, () => {\n          initialLoaded = true\n          syncCheckedValue(false, true)\n        })\n      } else {\n        syncCheckedValue(false, true)\n      }\n    }\n\n    const lazyLoad: ElCascaderPanelContext['lazyLoad'] = (node, cb) => {\n      const cfg = config.value\n      node = node || new Node({}, cfg, null, true)\n      node.loading = true\n\n      const resolve = (dataList: CascaderOption[]) => {\n        const parent = node.root ? null : node\n        dataList && store.value.appendNodes(dataList, parent)\n        node.loading = false\n        node.loaded = true\n        node.childrenData = node.childrenData || []\n        cb && cb(dataList)\n      }\n\n      cfg.lazyLoad(node, resolve)\n    }\n\n    const expandNode: ElCascaderPanelContext['expandNode'] = (node, silent) => {\n      const { level } = node\n      const newMenus = menus.value.slice(0, level)\n      let newExpandingNode: Nullable<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\n    const 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    }\n\n    const getFlattedNodes = (leafOnly: boolean) => {\n      return store.value.getFlattedNodes(leafOnly)\n    }\n\n    const getCheckedNodes = (leafOnly: boolean) => {\n      return getFlattedNodes(leafOnly).filter((node) => node.checked !== false)\n    }\n\n    const clearCheckedNodes = () => {\n      checkedNodes.value.forEach((node) => node.doCheck(false))\n      calculateCheckedValue()\n    }\n\n    const 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\n    const 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 ||\n        manualChecked ||\n        (!forced && isEqual(modelValue, checkedValue.value))\n      )\n        return\n\n      if (lazy && !loaded) {\n        const values: CascaderNodeValue[] = deduplicate(\n          arrayFlat(coerceTruthyValueToArray(modelValue))\n        )\n        const nodes = values\n          .map((val) => store.value.getNodeByValue(val))\n          .filter((node) => !!node && !node.loaded && !node.loading)\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\n          ? coerceTruthyValueToArray(modelValue)\n          : [modelValue]\n        const nodes = deduplicate(\n          values.map((val) => store.value.getNodeByValue(val, leafOnly))\n        )\n        syncMenuState(nodes, false)\n        checkedValue.value = modelValue\n      }\n    }\n\n    const 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.value.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 = null\n      }\n\n      oldNodes.forEach((node) => node.doCheck(false))\n      newNodes.forEach((node) => node.doCheck(true))\n\n      checkedNodes.value = newNodes\n      nextTick(scrollToExpandingNode)\n    }\n\n    const scrollToExpandingNode = () => {\n      if (isServer) return\n\n      menuList.value.forEach((menu) => {\n        const menuElement = menu?.$el\n        if (menuElement) {\n          const container = menuElement.querySelector('.el-scrollbar__wrap')\n          const activeNode =\n            menuElement.querySelector('.el-cascader-node.is-active') ||\n            menuElement.querySelector('.el-cascader-node.in-active-path')\n          scrollIntoView(container, activeNode)\n        }\n      })\n    }\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      const target = e.target as HTMLElement\n      const { code } = e\n\n      switch (code) {\n        case EVENT_CODE.up:\n        case EVENT_CODE.down: {\n          const distance = code === EVENT_CODE.up ? -1 : 1\n          focusNode(\n            getSibling(target, distance, '.el-cascader-node[tabindex=\"-1\"]')\n          )\n          break\n        }\n        case EVENT_CODE.left: {\n          const preMenu = menuList.value[getMenuIndex(target) - 1]\n          const expandedNode = preMenu?.$el.querySelector(\n            '.el-cascader-node[aria-expanded=\"true\"]'\n          )\n          focusNode(expandedNode)\n          break\n        }\n        case EVENT_CODE.right: {\n          const nextMenu = menuList.value[getMenuIndex(target) + 1]\n          const firstNode = nextMenu?.$el.querySelector(\n            '.el-cascader-node[tabindex=\"-1\"]'\n          )\n          focusNode(firstNode)\n          break\n        }\n        case EVENT_CODE.enter:\n          checkNode(target)\n          break\n        case EVENT_CODE.esc:\n        case EVENT_CODE.tab:\n          emit('close')\n          break\n      }\n    }\n\n    provide(\n      CASCADER_PANEL_INJECTION_KEY,\n      reactive({\n        config,\n        expandingNode,\n        checkedNodes,\n        isHoverMenu,\n        renderLabelFn,\n        lazyLoad,\n        expandNode,\n        handleCheckChange,\n      })\n    )\n\n    watch([config, () => props.options], initStore, {\n      deep: true,\n      immediate: true,\n    })\n\n    watch(\n      () => props.modelValue,\n      () => {\n        manualChecked = false\n        syncCheckedValue()\n      }\n    )\n\n    watch(checkedValue, (val) => {\n      if (!isEqual(val, props.modelValue)) {\n        emit(UPDATE_MODEL_EVENT, val)\n        emit(CHANGE_EVENT, val)\n      }\n    })\n\n    onBeforeUpdate(() => (menuList.value = []))\n\n    onMounted(() => !isEmpty(props.modelValue) && syncCheckedValue())\n\n    return {\n      menuList,\n      menus,\n      checkedNodes,\n      handleKeyDown,\n      handleCheckChange,\n      getFlattedNodes,\n      getCheckedNodes,\n      clearCheckedNodes,\n      calculateCheckedValue,\n      scrollToExpandingNode,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createBlock"],"mappings":";;;;sBACEA;IACG,4CAA6B;IAC7B,kDAAS;;sBAEVA,8CAC0B,aAAhB,MAAM;0BADhBC;QAEG,KAAK;AAAA,QACL,MAAM,SAAU,cAAS,SAAS;AAAA,QAClC;AAAA,QACA,OAAO;AAAA;;;;;;;"}
+{"version":3,"file":"index.vue_vue&type=template&id=97c48f5c&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/index.vue?vue&type=template&id=97c48f5c&lang.js"],"sourcesContent":["<template>\n  <div\n    :class=\"['el-cascader-panel', border && 'is-bordered']\"\n    @keydown=\"handleKeyDown\"\n  >\n    <el-cascader-menu\n      v-for=\"(menu, index) in menus\"\n      :key=\"index\"\n      :ref=\"(item) => (menuList[index] = item)\"\n      :index=\"index\"\n      :nodes=\"menu\"\n    />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  nextTick,\n  onBeforeUpdate,\n  onMounted,\n  provide,\n  reactive,\n  ref,\n  watch,\n} from 'vue'\nimport isEqual from 'lodash/isEqual'\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\nimport isServer from '@element-plus/utils/isServer'\nimport scrollIntoView from '@element-plus/utils/scroll-into-view'\nimport {\n  arrayFlat,\n  coerceTruthyValueToArray,\n  deduplicate,\n  isEmpty,\n} from '@element-plus/utils/util'\n\nimport ElCascaderMenu from './menu.vue'\nimport Store from './store'\nimport Node, { ExpandTrigger } from './node'\nimport { CommonProps, useCascaderConfig } from './config'\nimport { checkNode, getMenuIndex, sortByOriginalOrder } from './utils'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { PropType } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type {\n  CascaderValue,\n  CascaderNodeValue,\n  CascaderOption,\n  RenderLabel,\n  default as CascaderNode,\n} from './node'\n\nimport type { ElCascaderPanelContext } from './types'\n\nexport default defineComponent({\n  name: 'ElCascaderPanel',\n\n  components: {\n    ElCascaderMenu,\n  },\n\n  props: {\n    ...CommonProps,\n    border: {\n      type: Boolean,\n      default: true,\n    },\n    renderLabel: Function as PropType<RenderLabel>,\n  },\n\n  emits: [UPDATE_MODEL_EVENT, CHANGE_EVENT, 'close', 'expand-change'],\n\n  setup(props, { emit, slots }) {\n    let initialLoaded = true\n    // for interrupt sync check status in lazy mode\n    let manualChecked = false\n\n    const config = useCascaderConfig(props)\n\n    const store = ref<Nullable<Store>>(null)\n    const menuList = ref<any[]>([])\n    const checkedValue = ref<Nullable<CascaderValue>>(null)\n    const menus = ref<CascaderNode[][]>([])\n    const expandingNode = ref<Nullable<CascaderNode>>(null)\n    const checkedNodes = ref<CascaderNode[]>([])\n\n    const isHoverMenu = computed(\n      () => config.value.expandTrigger === ExpandTrigger.HOVER\n    )\n    const renderLabelFn = computed(() => props.renderLabel || slots.default)\n\n    const initStore = () => {\n      const { options } = props\n      const cfg = config.value\n\n      manualChecked = false\n      store.value = new Store(options, cfg)\n      menus.value = [store.value.getNodes()]\n\n      if (cfg.lazy && isEmpty(props.options)) {\n        initialLoaded = false\n        lazyLoad(undefined, () => {\n          initialLoaded = true\n          syncCheckedValue(false, true)\n        })\n      } else {\n        syncCheckedValue(false, true)\n      }\n    }\n\n    const 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        dataList && store.value?.appendNodes(dataList, parent as any)\n        _node.loading = false\n        _node.loaded = true\n        _node.childrenData = _node.childrenData || []\n        cb && cb(dataList)\n      }\n\n      cfg.lazyLoad(node, resolve as any)\n    }\n\n    const expandNode: ElCascaderPanelContext['expandNode'] = (node, silent) => {\n      const { level } = node\n      const newMenus = menus.value.slice(0, level)\n      let newExpandingNode: Nullable<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\n    const 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 && !checkStrictly && expandParentNode(node)\n    }\n\n    const expandParentNode = (node) => {\n      if (!node) return\n      node = node.parent\n      expandParentNode(node)\n      node && expandNode(node)\n    }\n\n    const getFlattedNodes = (leafOnly: boolean) => {\n      return store.value?.getFlattedNodes(leafOnly)\n    }\n\n    const getCheckedNodes = (leafOnly: boolean) => {\n      return getFlattedNodes(leafOnly)?.filter((node) => node.checked !== false)\n    }\n\n    const clearCheckedNodes = () => {\n      checkedNodes.value.forEach((node) => node.doCheck(false))\n      calculateCheckedValue()\n    }\n\n    const 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\n    const 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 ||\n        manualChecked ||\n        (!forced && isEqual(modelValue, checkedValue.value))\n      )\n        return\n\n      if (lazy && !loaded) {\n        const values: CascaderNodeValue[] = deduplicate(\n          arrayFlat(coerceTruthyValueToArray(modelValue))\n        )\n        const nodes = values\n          .map((val) => store.value?.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\n          ? coerceTruthyValueToArray(modelValue)\n          : [modelValue]\n        const nodes = deduplicate(\n          values.map((val) => store.value?.getNodeByValue(val, leafOnly))\n        ) as Node[]\n        syncMenuState(nodes, false)\n        checkedValue.value = modelValue!\n      }\n    }\n\n    const 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.value?.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 = null\n      }\n\n      oldNodes.forEach((node) => node.doCheck(false))\n      newNodes.forEach((node) => node.doCheck(true))\n\n      checkedNodes.value = newNodes\n      nextTick(scrollToExpandingNode)\n    }\n\n    const scrollToExpandingNode = () => {\n      if (isServer) return\n\n      menuList.value.forEach((menu) => {\n        const menuElement = menu?.$el\n        if (menuElement) {\n          const container = menuElement.querySelector('.el-scrollbar__wrap')\n          const activeNode =\n            menuElement.querySelector('.el-cascader-node.is-active') ||\n            menuElement.querySelector('.el-cascader-node.in-active-path')\n          scrollIntoView(container, activeNode)\n        }\n      })\n    }\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n      const target = e.target as HTMLElement\n      const { code } = e\n\n      switch (code) {\n        case EVENT_CODE.up:\n        case EVENT_CODE.down: {\n          const distance = code === EVENT_CODE.up ? -1 : 1\n          focusNode(\n            getSibling(target, distance, '.el-cascader-node[tabindex=\"-1\"]')\n          )\n          break\n        }\n        case EVENT_CODE.left: {\n          const preMenu = menuList.value[getMenuIndex(target) - 1]\n          const expandedNode = preMenu?.$el.querySelector(\n            '.el-cascader-node[aria-expanded=\"true\"]'\n          )\n          focusNode(expandedNode)\n          break\n        }\n        case EVENT_CODE.right: {\n          const nextMenu = menuList.value[getMenuIndex(target) + 1]\n          const firstNode = nextMenu?.$el.querySelector(\n            '.el-cascader-node[tabindex=\"-1\"]'\n          )\n          focusNode(firstNode)\n          break\n        }\n        case EVENT_CODE.enter:\n          checkNode(target)\n          break\n        case EVENT_CODE.esc:\n        case EVENT_CODE.tab:\n          emit('close')\n          break\n      }\n    }\n\n    provide(\n      CASCADER_PANEL_INJECTION_KEY,\n      reactive({\n        config,\n        expandingNode,\n        checkedNodes,\n        isHoverMenu,\n        renderLabelFn,\n        lazyLoad,\n        expandNode,\n        handleCheckChange,\n      })\n    )\n\n    watch([config, () => props.options], initStore, {\n      deep: true,\n      immediate: true,\n    })\n\n    watch(\n      () => props.modelValue,\n      () => {\n        manualChecked = false\n        syncCheckedValue()\n      }\n    )\n\n    watch(checkedValue, (val) => {\n      if (!isEqual(val, props.modelValue)) {\n        emit(UPDATE_MODEL_EVENT, val)\n        emit(CHANGE_EVENT, val)\n      }\n    })\n\n    onBeforeUpdate(() => (menuList.value = []))\n\n    onMounted(() => !isEmpty(props.modelValue) && syncCheckedValue())\n\n    return {\n      menuList,\n      menus,\n      checkedNodes,\n      handleKeyDown,\n      handleCheckChange,\n      getFlattedNodes,\n      getCheckedNodes,\n      clearCheckedNodes,\n      calculateCheckedValue,\n      scrollToExpandingNode,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createBlock"],"mappings":";;;;sBACEA;IACG,4CAA6B;IAC7B,kDAAS;;sBAEVA,8CAC0B,aAAhB,MAAM;0BADhBC;QAEG,KAAK;AAAA,QACL,MAAM,SAAU,cAAS,SAAS;AAAA,QAClC;AAAA,QACA,OAAO;AAAA;;;;;;;"}

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

@@ -10,8 +10,8 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
     };
 }, {
-    panel: import("./types").ElCascaderPanelContext | undefined;
-    hoverZone: import("vue").Ref<null>;
+    panel: import("./types").ElCascaderPanelContext;
+    hoverZone: import("vue").Ref<SVGSVGElement | null>;
     isEmpty: import("vue").ComputedRef<boolean>;
     menuId: import("vue").ComputedRef<string>;
     t: (...args: any[]) => string;

package/es/components/cascader-panel/src/menu.vue_vue&type=script&lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"menu.vue_vue&type=script&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/menu.vue"],"sourcesContent":["<template>\n  <el-scrollbar\n    :key=\"menuId\"\n    tag=\"ul\"\n    role=\"menu\"\n    class=\"el-cascader-menu\"\n    wrap-class=\"el-cascader-menu__wrap\"\n    :view-class=\"['el-cascader-menu__list', isEmpty && 'is-empty']\"\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=\"isEmpty\" class=\"el-cascader-menu__empty-text\">\n      {{ t('el.cascader.noData') }}\n    </div>\n    <svg\n      v-else-if=\"panel.isHoverMenu\"\n      ref=\"hoverZone\"\n      class=\"el-cascader-menu__hover-zone\"\n    />\n  </el-scrollbar>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, getCurrentInstance, inject, ref } from 'vue'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { useLocaleInject } from '@element-plus/hooks'\nimport { generateId } from '@element-plus/utils/util'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport type { default as CascaderNode } from './node'\n\nimport type { PropType } from 'vue'\nimport type { TimeoutHandle, Nullable } from '@element-plus/utils/types'\n\nexport default defineComponent({\n  name: 'ElCascaderMenu',\n\n  components: {\n    ElScrollbar,\n    ElCascaderNode,\n  },\n\n  props: {\n    nodes: {\n      type: Array as PropType<CascaderNode[]>,\n      required: true,\n    },\n    index: {\n      type: Number,\n      required: true,\n    },\n  },\n\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocaleInject()\n    const id = generateId()\n    let activeNode: Nullable<HTMLElement> = null\n    let hoverTimer: Nullable<TimeoutHandle> = null\n\n    const panel = inject(CASCADER_PANEL_INJECTION_KEY)\n\n    const hoverZone = ref(null)\n\n    const isEmpty = computed(() => !props.nodes.length)\n    const menuId = computed(() => `cascader-menu-${id}-${props.index}`)\n\n    const handleExpand = (e: MouseEvent) => {\n      activeNode = e.target as HTMLElement\n    }\n\n    const 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        hoverZone.value.innerHTML = `\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${top} L${offsetWidth} 0 V${top} Z\" />\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${bottom} L${offsetWidth} ${offsetHeight} V${bottom} Z\" />\n        `\n      } else if (!hoverTimer) {\n        hoverTimer = window.setTimeout(\n          clearHoverZone,\n          panel.config.hoverThreshold\n        )\n      }\n    }\n\n    const clearHoverTimer = () => {\n      if (!hoverTimer) return\n      clearTimeout(hoverTimer)\n      hoverTimer = null\n    }\n\n    const clearHoverZone = () => {\n      if (!hoverZone.value) return\n      hoverZone.value.innerHTML = ''\n      clearHoverTimer()\n    }\n\n    return {\n      panel,\n      hoverZone,\n      isEmpty,\n      menuId,\n      t,\n      handleExpand,\n      handleMouseMove,\n      clearHoverZone,\n    }\n  },\n})\n</script>\n"],"names":["ElScrollbar","ElCascaderNode"],"mappings":";;;;;;;;;AAyCA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,iBACVA;AAAA,oBACAC;AAAA;AAAA,EAGF,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;AAAA,IAEZ,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;AAAA;AAAA,EAId,MAAM,OAAO;AACX,UAAM,WAAW;AACjB,UAAM,EAAE,MAAM;AACd,UAAM,KAAK;AACX,QAAI,aAAoC;AACxC,QAAI,aAAsC;AAE1C,UAAM,QAAQ,OAAO;AAErB,UAAM,YAAY,IAAI;AAEtB,UAAM,UAAU,SAAS,MAAM,CAAC,MAAM,MAAM;AAC5C,UAAM,SAAS,SAAS,MAAM,iBAAiB,MAAM,MAAM;AAE3D,UAAM,eAAe,CAAC,MAAkB;AACtC,mBAAa,EAAE;AAAA;AAGjB,UAAM,kBAAkB,CAAC,MAAkB;AACzC,UAAI,CAAC,MAAM,eAAe,CAAC,cAAc,CAAC,UAAU;AAAO;AAE3D,UAAI,WAAW,SAAS,EAAE,SAAwB;AAChD;AAEA,cAAM,KAAK,SAAS,MAAM;AAC1B,cAAM,EAAE,SAAS,GAAG;AACpB,cAAM,EAAE,aAAa,iBAAiB;AACtC,cAAM,SAAS,EAAE,UAAU;AAC3B,cAAM,MAAM,WAAW;AACvB,cAAM,SAAS,MAAM,WAAW;AAEhC,kBAAU,MAAM,YAAY;AAAA,uEACmC,UAAU,QAAQ,kBAAkB;AAAA,uEACpC,UAAU,WAAW,eAAe,iBAAiB;AAAA;AAAA,iBAE3G,CAAC,YAAY;AACtB,qBAAa,OAAO,WAClB,gBACA,MAAM,OAAO;AAAA;AAAA;AAKnB,UAAM,kBAAkB,MAAM;AAC5B,UAAI,CAAC;AAAY;AACjB,mBAAa;AACb,mBAAa;AAAA;AAGf,UAAM,iBAAiB,MAAM;AAC3B,UAAI,CAAC,UAAU;AAAO;AACtB,gBAAU,MAAM,YAAY;AAC5B;AAAA;AAGF,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"menu.vue_vue&type=script&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/menu.vue"],"sourcesContent":["<template>\n  <el-scrollbar\n    :key=\"menuId\"\n    tag=\"ul\"\n    role=\"menu\"\n    class=\"el-cascader-menu\"\n    wrap-class=\"el-cascader-menu__wrap\"\n    :view-class=\"['el-cascader-menu__list', isEmpty && 'is-empty']\"\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=\"isEmpty\" class=\"el-cascader-menu__empty-text\">\n      {{ t('el.cascader.noData') }}\n    </div>\n    <svg\n      v-else-if=\"panel?.isHoverMenu\"\n      ref=\"hoverZone\"\n      class=\"el-cascader-menu__hover-zone\"\n    ></svg>\n  </el-scrollbar>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, getCurrentInstance, inject, ref } from 'vue'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { useLocaleInject } from '@element-plus/hooks'\nimport { generateId } from '@element-plus/utils/util'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport type { default as CascaderNode } from './node'\n\nimport type { PropType } from 'vue'\nimport type { TimeoutHandle, Nullable } from '@element-plus/utils/types'\n\nexport default defineComponent({\n  name: 'ElCascaderMenu',\n\n  components: {\n    ElScrollbar,\n    ElCascaderNode,\n  },\n\n  props: {\n    nodes: {\n      type: Array as PropType<CascaderNode[]>,\n      required: true,\n    },\n    index: {\n      type: Number,\n      required: true,\n    },\n  },\n\n  setup(props) {\n    const instance = getCurrentInstance()!\n    const { t } = useLocaleInject()\n    const id = generateId()\n    let activeNode: Nullable<HTMLElement> = null\n    let hoverTimer: Nullable<TimeoutHandle> = null\n\n    const panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\n    const hoverZone = ref<null | SVGSVGElement>(null)\n\n    const isEmpty = computed(() => !props.nodes.length)\n    const menuId = computed(() => `cascader-menu-${id}-${props.index}`)\n\n    const handleExpand = (e: MouseEvent) => {\n      activeNode = e.target as HTMLElement\n    }\n\n    const 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        hoverZone.value.innerHTML = `\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${top} L${offsetWidth} 0 V${top} Z\" />\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${bottom} L${offsetWidth} ${offsetHeight} V${bottom} Z\" />\n        `\n      } else if (!hoverTimer) {\n        hoverTimer = window.setTimeout(\n          clearHoverZone,\n          panel.config.hoverThreshold\n        )\n      }\n    }\n\n    const clearHoverTimer = () => {\n      if (!hoverTimer) return\n      clearTimeout(hoverTimer)\n      hoverTimer = null\n    }\n\n    const clearHoverZone = () => {\n      if (!hoverZone.value) return\n      hoverZone.value.innerHTML = ''\n      clearHoverTimer()\n    }\n\n    return {\n      panel,\n      hoverZone,\n      isEmpty,\n      menuId,\n      t,\n      handleExpand,\n      handleMouseMove,\n      clearHoverZone,\n    }\n  },\n})\n</script>\n"],"names":["ElScrollbar","ElCascaderNode"],"mappings":";;;;;;;;;AAyCA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,iBACVA;AAAA,oBACAC;AAAA;AAAA,EAGF,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;AAAA,IAEZ,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;AAAA;AAAA,EAId,MAAM,OAAO;AACX,UAAM,WAAW;AACjB,UAAM,EAAE,MAAM;AACd,UAAM,KAAK;AACX,QAAI,aAAoC;AACxC,QAAI,aAAsC;AAE1C,UAAM,QAAQ,OAAO;AAErB,UAAM,YAAY,IAA0B;AAE5C,UAAM,UAAU,SAAS,MAAM,CAAC,MAAM,MAAM;AAC5C,UAAM,SAAS,SAAS,MAAM,iBAAiB,MAAM,MAAM;AAE3D,UAAM,eAAe,CAAC,MAAkB;AACtC,mBAAa,EAAE;AAAA;AAGjB,UAAM,kBAAkB,CAAC,MAAkB;AACzC,UAAI,CAAC,MAAM,eAAe,CAAC,cAAc,CAAC,UAAU;AAAO;AAE3D,UAAI,WAAW,SAAS,EAAE,SAAwB;AAChD;AAEA,cAAM,KAAK,SAAS,MAAM;AAC1B,cAAM,EAAE,SAAS,GAAG;AACpB,cAAM,EAAE,aAAa,iBAAiB;AACtC,cAAM,SAAS,EAAE,UAAU;AAC3B,cAAM,MAAM,WAAW;AACvB,cAAM,SAAS,MAAM,WAAW;AAEhC,kBAAU,MAAM,YAAY;AAAA,uEACmC,UAAU,QAAQ,kBAAkB;AAAA,uEACpC,UAAU,WAAW,eAAe,iBAAiB;AAAA;AAAA,iBAE3G,CAAC,YAAY;AACtB,qBAAa,OAAO,WAClB,gBACA,MAAM,OAAO;AAAA;AAAA;AAKnB,UAAM,kBAAkB,MAAM;AAC5B,UAAI,CAAC;AAAY;AACjB,mBAAa;AACb,mBAAa;AAAA;AAGf,UAAM,iBAAiB,MAAM;AAC3B,UAAI,CAAC,UAAU;AAAO;AACtB,gBAAU,MAAM,YAAY;AAC5B;AAAA;AAGF,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/cascader-panel/src/menu.vue_vue&type=template&id=9c79e4e2&lang.mjs

@@ -22,17 +22,20 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     onMousemove: _ctx.handleMouseMove,
     onMouseleave: _ctx.clearHoverZone
   }, {
-    default: withCtx(() => [
-      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.nodes, (node) => {
-        return openBlock(), createBlock(_component_el_cascader_node, {
-          key: node.uid,
-          node,
-          "menu-id": _ctx.menuId,
-          onExpand: _ctx.handleExpand
-        }, null, 8, ["node", "menu-id", "onExpand"]);
-      }), 128)),
-      _ctx.isEmpty ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(_ctx.t("el.cascader.noData")), 1)) : _ctx.panel.isHoverMenu ? (openBlock(), createElementBlock("svg", _hoisted_2, null, 512)) : createCommentVNode("v-if", true)
-    ]),
+    default: withCtx(() => {
+      var _a;
+      return [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.nodes, (node) => {
+          return openBlock(), createBlock(_component_el_cascader_node, {
+            key: node.uid,
+            node,
+            "menu-id": _ctx.menuId,
+            onExpand: _ctx.handleExpand
+          }, null, 8, ["node", "menu-id", "onExpand"]);
+        }), 128)),
+        _ctx.isEmpty ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(_ctx.t("el.cascader.noData")), 1)) : ((_a = _ctx.panel) == null ? void 0 : _a.isHoverMenu) ? (openBlock(), createElementBlock("svg", _hoisted_2, null, 512)) : createCommentVNode("v-if", true)
+      ];
+    }),
     _: 1
   }, 8, ["view-class", "onMousemove", "onMouseleave"]);
 }

package/es/components/cascader-panel/src/menu.vue_vue&type=template&id=9c79e4e2&lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"menu.vue_vue&type=template&id=9c79e4e2&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/menu.vue?vue&type=template&id=9c79e4e2&lang.js"],"sourcesContent":["<template>\n  <el-scrollbar\n    :key=\"menuId\"\n    tag=\"ul\"\n    role=\"menu\"\n    class=\"el-cascader-menu\"\n    wrap-class=\"el-cascader-menu__wrap\"\n    :view-class=\"['el-cascader-menu__list', isEmpty && 'is-empty']\"\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=\"isEmpty\" class=\"el-cascader-menu__empty-text\">\n      {{ t('el.cascader.noData') }}\n    </div>\n    <svg\n      v-else-if=\"panel.isHoverMenu\"\n      ref=\"hoverZone\"\n      class=\"el-cascader-menu__hover-zone\"\n    />\n  </el-scrollbar>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, getCurrentInstance, inject, ref } from 'vue'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { useLocaleInject } from '@element-plus/hooks'\nimport { generateId } from '@element-plus/utils/util'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport type { default as CascaderNode } from './node'\n\nimport type { PropType } from 'vue'\nimport type { TimeoutHandle, Nullable } from '@element-plus/utils/types'\n\nexport default defineComponent({\n  name: 'ElCascaderMenu',\n\n  components: {\n    ElScrollbar,\n    ElCascaderNode,\n  },\n\n  props: {\n    nodes: {\n      type: Array as PropType<CascaderNode[]>,\n      required: true,\n    },\n    index: {\n      type: Number,\n      required: true,\n    },\n  },\n\n  setup(props) {\n    const instance = getCurrentInstance()\n    const { t } = useLocaleInject()\n    const id = generateId()\n    let activeNode: Nullable<HTMLElement> = null\n    let hoverTimer: Nullable<TimeoutHandle> = null\n\n    const panel = inject(CASCADER_PANEL_INJECTION_KEY)\n\n    const hoverZone = ref(null)\n\n    const isEmpty = computed(() => !props.nodes.length)\n    const menuId = computed(() => `cascader-menu-${id}-${props.index}`)\n\n    const handleExpand = (e: MouseEvent) => {\n      activeNode = e.target as HTMLElement\n    }\n\n    const 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        hoverZone.value.innerHTML = `\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${top} L${offsetWidth} 0 V${top} Z\" />\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${bottom} L${offsetWidth} ${offsetHeight} V${bottom} Z\" />\n        `\n      } else if (!hoverTimer) {\n        hoverTimer = window.setTimeout(\n          clearHoverZone,\n          panel.config.hoverThreshold\n        )\n      }\n    }\n\n    const clearHoverTimer = () => {\n      if (!hoverTimer) return\n      clearTimeout(hoverTimer)\n      hoverTimer = null\n    }\n\n    const clearHoverZone = () => {\n      if (!hoverZone.value) return\n      hoverZone.value.innerHTML = ''\n      clearHoverTimer()\n    }\n\n    return {\n      panel,\n      hoverZone,\n      isEmpty,\n      menuId,\n      t,\n      handleExpand,\n      handleMouseMove,\n      clearHoverZone,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createElementBlock"],"mappings":";;;;EAkBwB,OAAM;AAAA;;;EAKxB,KAAI;AAAA,EACJ,OAAM;AAAA;;;;sBAvBVA;IACG,KAAK;IACN,KAAI;AAAA,IACJ,MAAK;AAAA,IACL,OAAM;AAAA,IACN,cAAW;AAAA,IACV,yCAAuC;IACvC,aAAW;IACX,cAAY;;qBAGX;wBADFC,8CACiB,aAAR;4BADTD;UAEG,KAAK,KAAK;AAAA,UACV;AAAA,UACA,WAAS;UACT,UAAQ;;;MAEA,6BAAXC,0BAAA,4BACK,qCAGQ,WAAM,4BADnBA,0BAAA;;;;;;;;"}
+{"version":3,"file":"menu.vue_vue&type=template&id=9c79e4e2&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/menu.vue?vue&type=template&id=9c79e4e2&lang.js"],"sourcesContent":["<template>\n  <el-scrollbar\n    :key=\"menuId\"\n    tag=\"ul\"\n    role=\"menu\"\n    class=\"el-cascader-menu\"\n    wrap-class=\"el-cascader-menu__wrap\"\n    :view-class=\"['el-cascader-menu__list', isEmpty && 'is-empty']\"\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=\"isEmpty\" class=\"el-cascader-menu__empty-text\">\n      {{ t('el.cascader.noData') }}\n    </div>\n    <svg\n      v-else-if=\"panel?.isHoverMenu\"\n      ref=\"hoverZone\"\n      class=\"el-cascader-menu__hover-zone\"\n    ></svg>\n  </el-scrollbar>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, getCurrentInstance, inject, ref } from 'vue'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport { useLocaleInject } from '@element-plus/hooks'\nimport { generateId } from '@element-plus/utils/util'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport type { default as CascaderNode } from './node'\n\nimport type { PropType } from 'vue'\nimport type { TimeoutHandle, Nullable } from '@element-plus/utils/types'\n\nexport default defineComponent({\n  name: 'ElCascaderMenu',\n\n  components: {\n    ElScrollbar,\n    ElCascaderNode,\n  },\n\n  props: {\n    nodes: {\n      type: Array as PropType<CascaderNode[]>,\n      required: true,\n    },\n    index: {\n      type: Number,\n      required: true,\n    },\n  },\n\n  setup(props) {\n    const instance = getCurrentInstance()!\n    const { t } = useLocaleInject()\n    const id = generateId()\n    let activeNode: Nullable<HTMLElement> = null\n    let hoverTimer: Nullable<TimeoutHandle> = null\n\n    const panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\n    const hoverZone = ref<null | SVGSVGElement>(null)\n\n    const isEmpty = computed(() => !props.nodes.length)\n    const menuId = computed(() => `cascader-menu-${id}-${props.index}`)\n\n    const handleExpand = (e: MouseEvent) => {\n      activeNode = e.target as HTMLElement\n    }\n\n    const 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        hoverZone.value.innerHTML = `\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${top} L${offsetWidth} 0 V${top} Z\" />\n          <path style=\"pointer-events: auto;\" fill=\"transparent\" d=\"M${startX} ${bottom} L${offsetWidth} ${offsetHeight} V${bottom} Z\" />\n        `\n      } else if (!hoverTimer) {\n        hoverTimer = window.setTimeout(\n          clearHoverZone,\n          panel.config.hoverThreshold\n        )\n      }\n    }\n\n    const clearHoverTimer = () => {\n      if (!hoverTimer) return\n      clearTimeout(hoverTimer)\n      hoverTimer = null\n    }\n\n    const clearHoverZone = () => {\n      if (!hoverZone.value) return\n      hoverZone.value.innerHTML = ''\n      clearHoverTimer()\n    }\n\n    return {\n      panel,\n      hoverZone,\n      isEmpty,\n      menuId,\n      t,\n      handleExpand,\n      handleMouseMove,\n      clearHoverZone,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createElementBlock"],"mappings":";;;;EAkBwB,OAAM;AAAA;;;EAKxB,KAAI;AAAA,EACJ,OAAM;AAAA;;;;sBAvBVA;IACG,KAAK;IACN,KAAI;AAAA,IACJ,MAAK;AAAA,IACL,OAAM;AAAA,IACN,cAAW;AAAA,IACV,yCAAuC;IACvC,aAAW;IACX,cAAY;;qBAGX;;;0BADFC,8CACiB,aAAR;8BADTD;YAEG,KAAK,KAAK;AAAA,YACV;AAAA,YACA,WAAS;YACT,UAAQ;;;QAEA,6BAAXC,0BAAA,4BACK,qCAGQ,sBAAA,mBAAO,6BADpBA,0BAAA;;;;;;;;;"}

package/es/components/cascader-panel/src/node.vue.d.ts

@@ -7,7 +7,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     menuId: StringConstructor;
 }, {
-    panel: import("./types").ElCascaderPanelContext | undefined;
+    panel: import("./types").ElCascaderPanelContext;
     isHoverMenu: import("vue").ComputedRef<boolean>;
     multiple: import("vue").ComputedRef<boolean>;
     checkStrictly: import("vue").ComputedRef<boolean>;

package/es/components/cascader-panel/src/node.vue_vue&type=script&lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"node.vue_vue&type=script&lang.mjs","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 ? null : menuId\"\n    :aria-expanded=\"inExpandingPath\"\n    :tabindex=\"expandable ? -1 : null\"\n    :class=\"[\n      'el-cascader-node',\n      checkStrictly && 'is-selectable',\n      inExpandingPath && 'in-active-path',\n      inCheckedPath && 'in-checked-path',\n      node.checked && 'is-active',\n      !expandable && 'is-disabled',\n    ]\"\n    @mouseenter=\"handleHoverExpand\"\n    @focus=\"handleHoverExpand\"\n    @click=\"handleClick\"\n  >\n    <!-- prefix -->\n    <el-checkbox\n      v-if=\"multiple\"\n      :model-value=\"node.checked\"\n      :indeterminate=\"node.indeterminate\"\n      :disabled=\"isDisabled\"\n      @click.stop\n      @update:model-value=\"handleCheck\"\n    />\n    <el-radio\n      v-else-if=\"checkStrictly\"\n      :model-value=\"checkedNodeId\"\n      :label=\"node.uid\"\n      :disabled=\"isDisabled\"\n      @update:model-value=\"handleCheck\"\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></span>\n    </el-radio>\n    <el-icon\n      v-else-if=\"isLeaf && node.checked\"\n      class=\"el-cascader-node__prefix\"\n    >\n      <check />\n    </el-icon>\n\n    <!-- content -->\n    <node-content />\n\n    <!-- postfix -->\n    <template v-if=\"!isLeaf\">\n      <el-icon v-if=\"node.loading\" class=\"is-loading el-cascader-node__postfix\">\n        <loading />\n      </el-icon>\n      <el-icon v-else class=\"arrow-right el-cascader-node__postfix\">\n        <arrow-right />\n      </el-icon>\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, 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 { Check, Loading, ArrowRight } from '@element-plus/icons'\nimport NodeContent from './node-content'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport type { default as CascaderNode } from './node'\n\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'ElCascaderNode',\n\n  components: {\n    ElCheckbox,\n    ElRadio,\n    NodeContent,\n    ElIcon,\n    Check,\n    Loading,\n    ArrowRight,\n  },\n\n  props: {\n    node: {\n      type: Object as PropType<CascaderNode>,\n      required: true,\n    },\n    menuId: String,\n  },\n\n  emits: ['expand'],\n\n  setup(props, { emit }) {\n    const panel = inject(CASCADER_PANEL_INJECTION_KEY)\n\n    const isHoverMenu = computed(() => panel.isHoverMenu)\n    const multiple = computed(() => panel.config.multiple)\n    const checkStrictly = computed(() => panel.config.checkStrictly)\n    const checkedNodeId = computed(() => panel.checkedNodes[0]?.uid)\n    const isDisabled = computed(() => props.node.isDisabled)\n    const isLeaf = computed(() => props.node.isLeaf)\n    const expandable = computed(\n      () => (checkStrictly.value && !isLeaf.value) || !isDisabled.value\n    )\n    const inExpandingPath = computed(() => isInPath(panel.expandingNode))\n    // only useful in check-strictly mode\n    const inCheckedPath = computed(\n      () => checkStrictly.value && panel.checkedNodes.some(isInPath)\n    )\n\n    const isInPath = (node: CascaderNode) => {\n      const { level, uid } = props.node\n      return node?.pathNodes[level - 1]?.uid === uid\n    }\n\n    const doExpand = () => {\n      if (inExpandingPath.value) return\n      panel.expandNode(props.node)\n    }\n\n    const doCheck = (checked: boolean) => {\n      const { node } = props\n      if (checked === node.checked) return\n      panel.handleCheckChange(node, checked)\n    }\n\n    const doLoad = () => {\n      panel.lazyLoad(props.node, () => {\n        if (!isLeaf.value) doExpand()\n      })\n    }\n\n    const handleHoverExpand = (e: Event) => {\n      if (!isHoverMenu.value) return\n      handleExpand()\n      !isLeaf.value && emit('expand', e)\n    }\n\n    const 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\n    const handleClick = () => {\n      if (isHoverMenu.value && !isLeaf.value) return\n\n      if (\n        isLeaf.value &&\n        !isDisabled.value &&\n        !checkStrictly.value &&\n        !multiple.value\n      ) {\n        handleCheck(true)\n      } else {\n        handleExpand()\n      }\n    }\n\n    const handleCheck = (checked: boolean) => {\n      if (!props.node.loaded) {\n        doLoad()\n      } else {\n        doCheck(checked)\n        !checkStrictly.value && doExpand()\n      }\n    }\n\n    return {\n      panel,\n      isHoverMenu,\n      multiple,\n      checkStrictly,\n      checkedNodeId,\n      isDisabled,\n      isLeaf,\n      expandable,\n      inExpandingPath,\n      inCheckedPath,\n      handleHoverExpand,\n      handleExpand,\n      handleClick,\n      handleCheck,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;AA6EA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAGF,OAAO;AAAA,IACL,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA;AAAA,IAEZ,QAAQ;AAAA;AAAA,EAGV,OAAO,CAAC;AAAA,EAER,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,QAAQ,OAAO;AAErB,UAAM,cAAc,SAAS,MAAM,MAAM;AACzC,UAAM,WAAW,SAAS,MAAM,MAAM,OAAO;AAC7C,UAAM,gBAAgB,SAAS,MAAM,MAAM,OAAO;AAClD,UAAM,gBAAgB,SAAS,MAAG;;AAAG,yBAAM,aAAa,OAAnB,mBAAuB;AAAA;AAC5D,UAAM,aAAa,SAAS,MAAM,MAAM,KAAK;AAC7C,UAAM,SAAS,SAAS,MAAM,MAAM,KAAK;AACzC,UAAM,aAAa,SACjB,MAAO,cAAc,SAAS,CAAC,OAAO,SAAU,CAAC,WAAW;AAE9D,UAAM,kBAAkB,SAAS,MAAM,SAAS,MAAM;AAEtD,UAAM,gBAAgB,SACpB,MAAM,cAAc,SAAS,MAAM,aAAa,KAAK;AAGvD,UAAM,WAAW,CAAC,SAAuB;;AACvC,YAAM,EAAE,OAAO,QAAQ,MAAM;AAC7B,aAAO,oCAAM,UAAU,QAAQ,OAAxB,mBAA4B,SAAQ;AAAA;AAG7C,UAAM,WAAW,MAAM;AACrB,UAAI,gBAAgB;AAAO;AAC3B,YAAM,WAAW,MAAM;AAAA;AAGzB,UAAM,UAAU,CAAC,YAAqB;AACpC,YAAM,EAAE,SAAS;AACjB,UAAI,YAAY,KAAK;AAAS;AAC9B,YAAM,kBAAkB,MAAM;AAAA;AAGhC,UAAM,SAAS,MAAM;AACnB,YAAM,SAAS,MAAM,MAAM,MAAM;AAC/B,YAAI,CAAC,OAAO;AAAO;AAAA;AAAA;AAIvB,UAAM,oBAAoB,CAAC,MAAa;AACtC,UAAI,CAAC,YAAY;AAAO;AACxB;AACA,OAAC,OAAO,SAAS,KAAK,UAAU;AAAA;AAGlC,UAAM,eAAe,MAAM;AACzB,YAAM,EAAE,SAAS;AAEjB,UAAI,CAAC,WAAW,SAAS,KAAK;AAAS;AACvC,WAAK,SAAS,aAAa;AAAA;AAG7B,UAAM,cAAc,MAAM;AACxB,UAAI,YAAY,SAAS,CAAC,OAAO;AAAO;AAExC,UACE,OAAO,SACP,CAAC,WAAW,SACZ,CAAC,cAAc,SACf,CAAC,SAAS,OACV;AACA,oBAAY;AAAA,aACP;AACL;AAAA;AAAA;AAIJ,UAAM,cAAc,CAAC,YAAqB;AACxC,UAAI,CAAC,MAAM,KAAK,QAAQ;AACtB;AAAA,aACK;AACL,gBAAQ;AACR,SAAC,cAAc,SAAS;AAAA;AAAA;AAI5B,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"node.vue_vue&type=script&lang.mjs","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 ? null : menuId\"\n    :aria-expanded=\"inExpandingPath\"\n    :tabindex=\"expandable ? -1 : undefined\"\n    :class=\"[\n      'el-cascader-node',\n      checkStrictly && 'is-selectable',\n      inExpandingPath && 'in-active-path',\n      inCheckedPath && 'in-checked-path',\n      node.checked && 'is-active',\n      !expandable && 'is-disabled',\n    ]\"\n    @mouseenter=\"handleHoverExpand\"\n    @focus=\"handleHoverExpand\"\n    @click=\"handleClick\"\n  >\n    <!-- prefix -->\n    <el-checkbox\n      v-if=\"multiple\"\n      :model-value=\"node.checked\"\n      :indeterminate=\"node.indeterminate\"\n      :disabled=\"isDisabled\"\n      @click.stop\n      @update:model-value=\"handleCheck\"\n    />\n    <el-radio\n      v-else-if=\"checkStrictly\"\n      :model-value=\"checkedNodeId\"\n      :label=\"node.uid\"\n      :disabled=\"isDisabled\"\n      @update:model-value=\"handleCheck\"\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></span>\n    </el-radio>\n    <el-icon\n      v-else-if=\"isLeaf && node.checked\"\n      class=\"el-cascader-node__prefix\"\n    >\n      <check />\n    </el-icon>\n\n    <!-- content -->\n    <node-content />\n\n    <!-- postfix -->\n    <template v-if=\"!isLeaf\">\n      <el-icon v-if=\"node.loading\" class=\"is-loading el-cascader-node__postfix\">\n        <loading />\n      </el-icon>\n      <el-icon v-else class=\"arrow-right el-cascader-node__postfix\">\n        <arrow-right />\n      </el-icon>\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, 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 { Check, Loading, ArrowRight } from '@element-plus/icons'\nimport NodeContent from './node-content'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport type { default as CascaderNode } from './node'\n\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'ElCascaderNode',\n\n  components: {\n    ElCheckbox,\n    ElRadio,\n    NodeContent,\n    ElIcon,\n    Check,\n    Loading,\n    ArrowRight,\n  },\n\n  props: {\n    node: {\n      type: Object as PropType<CascaderNode>,\n      required: true,\n    },\n    menuId: String,\n  },\n\n  emits: ['expand'],\n\n  setup(props, { emit }) {\n    const panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\n    const isHoverMenu = computed(() => panel.isHoverMenu)\n    const multiple = computed(() => panel.config.multiple)\n    const checkStrictly = computed(() => panel.config.checkStrictly)\n    const checkedNodeId = computed(() => panel.checkedNodes[0]?.uid)\n    const isDisabled = computed(() => props.node.isDisabled)\n    const isLeaf = computed(() => props.node.isLeaf)\n    const expandable = computed(\n      () => (checkStrictly.value && !isLeaf.value) || !isDisabled.value\n    )\n    const inExpandingPath = computed(() => isInPath(panel.expandingNode!))\n    // only useful in check-strictly mode\n    const inCheckedPath = computed(\n      () => checkStrictly.value && panel.checkedNodes.some(isInPath)\n    )\n\n    const isInPath = (node: CascaderNode) => {\n      const { level, uid } = props.node\n      return node?.pathNodes[level - 1]?.uid === uid\n    }\n\n    const doExpand = () => {\n      if (inExpandingPath.value) return\n      panel.expandNode(props.node)\n    }\n\n    const doCheck = (checked: boolean) => {\n      const { node } = props\n      if (checked === node.checked) return\n      panel.handleCheckChange(node, checked)\n    }\n\n    const doLoad = () => {\n      panel.lazyLoad(props.node, () => {\n        if (!isLeaf.value) doExpand()\n      })\n    }\n\n    const handleHoverExpand = (e: Event) => {\n      if (!isHoverMenu.value) return\n      handleExpand()\n      !isLeaf.value && emit('expand', e)\n    }\n\n    const 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\n    const handleClick = () => {\n      if (isHoverMenu.value && !isLeaf.value) return\n\n      if (\n        isLeaf.value &&\n        !isDisabled.value &&\n        !checkStrictly.value &&\n        !multiple.value\n      ) {\n        handleCheck(true)\n      } else {\n        handleExpand()\n      }\n    }\n\n    const handleCheck = (checked: boolean) => {\n      if (!props.node.loaded) {\n        doLoad()\n      } else {\n        doCheck(checked)\n        !checkStrictly.value && doExpand()\n      }\n    }\n\n    return {\n      panel,\n      isHoverMenu,\n      multiple,\n      checkStrictly,\n      checkedNodeId,\n      isDisabled,\n      isLeaf,\n      expandable,\n      inExpandingPath,\n      inCheckedPath,\n      handleHoverExpand,\n      handleExpand,\n      handleClick,\n      handleCheck,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;AA6EA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,EAGF,OAAO;AAAA,IACL,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA;AAAA,IAEZ,QAAQ;AAAA;AAAA,EAGV,OAAO,CAAC;AAAA,EAER,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,QAAQ,OAAO;AAErB,UAAM,cAAc,SAAS,MAAM,MAAM;AACzC,UAAM,WAAW,SAAS,MAAM,MAAM,OAAO;AAC7C,UAAM,gBAAgB,SAAS,MAAM,MAAM,OAAO;AAClD,UAAM,gBAAgB,SAAS,MAAG;;AAAG,yBAAM,aAAa,OAAnB,mBAAuB;AAAA;AAC5D,UAAM,aAAa,SAAS,MAAM,MAAM,KAAK;AAC7C,UAAM,SAAS,SAAS,MAAM,MAAM,KAAK;AACzC,UAAM,aAAa,SACjB,MAAO,cAAc,SAAS,CAAC,OAAO,SAAU,CAAC,WAAW;AAE9D,UAAM,kBAAkB,SAAS,MAAM,SAAS,MAAM;AAEtD,UAAM,gBAAgB,SACpB,MAAM,cAAc,SAAS,MAAM,aAAa,KAAK;AAGvD,UAAM,WAAW,CAAC,SAAuB;;AACvC,YAAM,EAAE,OAAO,QAAQ,MAAM;AAC7B,aAAO,oCAAM,UAAU,QAAQ,OAAxB,mBAA4B,SAAQ;AAAA;AAG7C,UAAM,WAAW,MAAM;AACrB,UAAI,gBAAgB;AAAO;AAC3B,YAAM,WAAW,MAAM;AAAA;AAGzB,UAAM,UAAU,CAAC,YAAqB;AACpC,YAAM,EAAE,SAAS;AACjB,UAAI,YAAY,KAAK;AAAS;AAC9B,YAAM,kBAAkB,MAAM;AAAA;AAGhC,UAAM,SAAS,MAAM;AACnB,YAAM,SAAS,MAAM,MAAM,MAAM;AAC/B,YAAI,CAAC,OAAO;AAAO;AAAA;AAAA;AAIvB,UAAM,oBAAoB,CAAC,MAAa;AACtC,UAAI,CAAC,YAAY;AAAO;AACxB;AACA,OAAC,OAAO,SAAS,KAAK,UAAU;AAAA;AAGlC,UAAM,eAAe,MAAM;AACzB,YAAM,EAAE,SAAS;AAEjB,UAAI,CAAC,WAAW,SAAS,KAAK;AAAS;AACvC,WAAK,SAAS,aAAa;AAAA;AAG7B,UAAM,cAAc,MAAM;AACxB,UAAI,YAAY,SAAS,CAAC,OAAO;AAAO;AAExC,UACE,OAAO,SACP,CAAC,WAAW,SACZ,CAAC,cAAc,SACf,CAAC,SAAS,OACV;AACA,oBAAY;AAAA,aACP;AACL;AAAA;AAAA;AAIJ,UAAM,cAAc,CAAC,YAAqB;AACxC,UAAI,CAAC,MAAM,KAAK,QAAQ;AACtB;AAAA,aACK;AACL,gBAAQ;AACR,SAAC,cAAc,SAAS;AAAA;AAAA;AAI5B,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/cascader-panel/src/node.vue_vue&type=template&id=18b09cb2&lang.mjs

@@ -16,7 +16,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     "aria-haspopup": !_ctx.isLeaf,
     "aria-owns": _ctx.isLeaf ? null : _ctx.menuId,
     "aria-expanded": _ctx.inExpandingPath,
-    tabindex: _ctx.expandable ? -1 : null,
+    tabindex: _ctx.expandable ? -1 : void 0,
     class: normalizeClass([
       "el-cascader-node",
       _ctx.checkStrictly && "is-selectable",

package/es/components/cascader-panel/src/node.vue_vue&type=template&id=18b09cb2&lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"node.vue_vue&type=template&id=18b09cb2&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/node.vue?vue&type=template&id=18b09cb2&lang.js"],"sourcesContent":["<template>\n  <li\n    :id=\"`${menuId}-${node.uid}`\"\n    role=\"menuitem\"\n    :aria-haspopup=\"!isLeaf\"\n    :aria-owns=\"isLeaf ? null : menuId\"\n    :aria-expanded=\"inExpandingPath\"\n    :tabindex=\"expandable ? -1 : null\"\n    :class=\"[\n      'el-cascader-node',\n      checkStrictly && 'is-selectable',\n      inExpandingPath && 'in-active-path',\n      inCheckedPath && 'in-checked-path',\n      node.checked && 'is-active',\n      !expandable && 'is-disabled',\n    ]\"\n    @mouseenter=\"handleHoverExpand\"\n    @focus=\"handleHoverExpand\"\n    @click=\"handleClick\"\n  >\n    <!-- prefix -->\n    <el-checkbox\n      v-if=\"multiple\"\n      :model-value=\"node.checked\"\n      :indeterminate=\"node.indeterminate\"\n      :disabled=\"isDisabled\"\n      @click.stop\n      @update:model-value=\"handleCheck\"\n    />\n    <el-radio\n      v-else-if=\"checkStrictly\"\n      :model-value=\"checkedNodeId\"\n      :label=\"node.uid\"\n      :disabled=\"isDisabled\"\n      @update:model-value=\"handleCheck\"\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></span>\n    </el-radio>\n    <el-icon\n      v-else-if=\"isLeaf && node.checked\"\n      class=\"el-cascader-node__prefix\"\n    >\n      <check />\n    </el-icon>\n\n    <!-- content -->\n    <node-content />\n\n    <!-- postfix -->\n    <template v-if=\"!isLeaf\">\n      <el-icon v-if=\"node.loading\" class=\"is-loading el-cascader-node__postfix\">\n        <loading />\n      </el-icon>\n      <el-icon v-else class=\"arrow-right el-cascader-node__postfix\">\n        <arrow-right />\n      </el-icon>\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, 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 { Check, Loading, ArrowRight } from '@element-plus/icons'\nimport NodeContent from './node-content'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport type { default as CascaderNode } from './node'\n\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'ElCascaderNode',\n\n  components: {\n    ElCheckbox,\n    ElRadio,\n    NodeContent,\n    ElIcon,\n    Check,\n    Loading,\n    ArrowRight,\n  },\n\n  props: {\n    node: {\n      type: Object as PropType<CascaderNode>,\n      required: true,\n    },\n    menuId: String,\n  },\n\n  emits: ['expand'],\n\n  setup(props, { emit }) {\n    const panel = inject(CASCADER_PANEL_INJECTION_KEY)\n\n    const isHoverMenu = computed(() => panel.isHoverMenu)\n    const multiple = computed(() => panel.config.multiple)\n    const checkStrictly = computed(() => panel.config.checkStrictly)\n    const checkedNodeId = computed(() => panel.checkedNodes[0]?.uid)\n    const isDisabled = computed(() => props.node.isDisabled)\n    const isLeaf = computed(() => props.node.isLeaf)\n    const expandable = computed(\n      () => (checkStrictly.value && !isLeaf.value) || !isDisabled.value\n    )\n    const inExpandingPath = computed(() => isInPath(panel.expandingNode))\n    // only useful in check-strictly mode\n    const inCheckedPath = computed(\n      () => checkStrictly.value && panel.checkedNodes.some(isInPath)\n    )\n\n    const isInPath = (node: CascaderNode) => {\n      const { level, uid } = props.node\n      return node?.pathNodes[level - 1]?.uid === uid\n    }\n\n    const doExpand = () => {\n      if (inExpandingPath.value) return\n      panel.expandNode(props.node)\n    }\n\n    const doCheck = (checked: boolean) => {\n      const { node } = props\n      if (checked === node.checked) return\n      panel.handleCheckChange(node, checked)\n    }\n\n    const doLoad = () => {\n      panel.lazyLoad(props.node, () => {\n        if (!isLeaf.value) doExpand()\n      })\n    }\n\n    const handleHoverExpand = (e: Event) => {\n      if (!isHoverMenu.value) return\n      handleExpand()\n      !isLeaf.value && emit('expand', e)\n    }\n\n    const 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\n    const handleClick = () => {\n      if (isHoverMenu.value && !isLeaf.value) return\n\n      if (\n        isLeaf.value &&\n        !isDisabled.value &&\n        !checkStrictly.value &&\n        !multiple.value\n      ) {\n        handleCheck(true)\n      } else {\n        handleExpand()\n      }\n    }\n\n    const handleCheck = (checked: boolean) => {\n      if (!props.node.loaded) {\n        doLoad()\n      } else {\n        doCheck(checked)\n        !checkStrictly.value && doExpand()\n      }\n    }\n\n    return {\n      panel,\n      isHoverMenu,\n      multiple,\n      checkStrictly,\n      checkedNodeId,\n      isDisabled,\n      isLeaf,\n      expandable,\n      inExpandingPath,\n      inCheckedPath,\n      handleHoverExpand,\n      handleExpand,\n      handleClick,\n      handleCheck,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createCommentVNode","_createBlock","_createVNode"],"mappings":";;;;;;;;;;;;sBACEA;IACG,OAAO,eAAU,UAAK;AAAA,IACvB,MAAK;AAAA,IACJ,kBAAgB;IAChB,aAAW,qBAAgB;IAC3B,iBAAe;IACf,UAAU;IACV;;;;;;;;IAQA,qDAAY;IACZ,gDAAO;IACP,gDAAO;;IAERC;IAEQ,8BADRC;;MAEG,eAAa,UAAK;AAAA,MAClB,eAAe,UAAK;AAAA,MACpB,UAAU;MACV,iDAAD;;MACC,uBAAoB;wFAGV,mCADbA;;MAEG,eAAa;MACb,OAAO,UAAK;AAAA,MACZ,UAAU;MACV,uBAAoB;MACpB,iDAAD;;;uBAEA;QAAAD;QAIA;AAAA;AAAA;0EAGW,eAAU,UAAK,wBAD5BC;;MAEE,OAAM;AAAA;uBAEN;QAAAC;;;;IAGFF;IACAE;IAEAF;KACiB,4BAAjBD;MACiB,UAAK,wBAApBE;;QAA6B,OAAM;AAAA;yBACjC;UAAAC;;;0BAEFD;;QAAgB,OAAM;AAAA;yBACpB;UAAAC;;;;;;;;;;"}
+{"version":3,"file":"node.vue_vue&type=template&id=18b09cb2&lang.mjs","sources":["../../../../../../packages/components/cascader-panel/src/node.vue?vue&type=template&id=18b09cb2&lang.js"],"sourcesContent":["<template>\n  <li\n    :id=\"`${menuId}-${node.uid}`\"\n    role=\"menuitem\"\n    :aria-haspopup=\"!isLeaf\"\n    :aria-owns=\"isLeaf ? null : menuId\"\n    :aria-expanded=\"inExpandingPath\"\n    :tabindex=\"expandable ? -1 : undefined\"\n    :class=\"[\n      'el-cascader-node',\n      checkStrictly && 'is-selectable',\n      inExpandingPath && 'in-active-path',\n      inCheckedPath && 'in-checked-path',\n      node.checked && 'is-active',\n      !expandable && 'is-disabled',\n    ]\"\n    @mouseenter=\"handleHoverExpand\"\n    @focus=\"handleHoverExpand\"\n    @click=\"handleClick\"\n  >\n    <!-- prefix -->\n    <el-checkbox\n      v-if=\"multiple\"\n      :model-value=\"node.checked\"\n      :indeterminate=\"node.indeterminate\"\n      :disabled=\"isDisabled\"\n      @click.stop\n      @update:model-value=\"handleCheck\"\n    />\n    <el-radio\n      v-else-if=\"checkStrictly\"\n      :model-value=\"checkedNodeId\"\n      :label=\"node.uid\"\n      :disabled=\"isDisabled\"\n      @update:model-value=\"handleCheck\"\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></span>\n    </el-radio>\n    <el-icon\n      v-else-if=\"isLeaf && node.checked\"\n      class=\"el-cascader-node__prefix\"\n    >\n      <check />\n    </el-icon>\n\n    <!-- content -->\n    <node-content />\n\n    <!-- postfix -->\n    <template v-if=\"!isLeaf\">\n      <el-icon v-if=\"node.loading\" class=\"is-loading el-cascader-node__postfix\">\n        <loading />\n      </el-icon>\n      <el-icon v-else class=\"arrow-right el-cascader-node__postfix\">\n        <arrow-right />\n      </el-icon>\n    </template>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, 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 { Check, Loading, ArrowRight } from '@element-plus/icons'\nimport NodeContent from './node-content'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\nimport type { default as CascaderNode } from './node'\n\nimport type { PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'ElCascaderNode',\n\n  components: {\n    ElCheckbox,\n    ElRadio,\n    NodeContent,\n    ElIcon,\n    Check,\n    Loading,\n    ArrowRight,\n  },\n\n  props: {\n    node: {\n      type: Object as PropType<CascaderNode>,\n      required: true,\n    },\n    menuId: String,\n  },\n\n  emits: ['expand'],\n\n  setup(props, { emit }) {\n    const panel = inject(CASCADER_PANEL_INJECTION_KEY)!\n\n    const isHoverMenu = computed(() => panel.isHoverMenu)\n    const multiple = computed(() => panel.config.multiple)\n    const checkStrictly = computed(() => panel.config.checkStrictly)\n    const checkedNodeId = computed(() => panel.checkedNodes[0]?.uid)\n    const isDisabled = computed(() => props.node.isDisabled)\n    const isLeaf = computed(() => props.node.isLeaf)\n    const expandable = computed(\n      () => (checkStrictly.value && !isLeaf.value) || !isDisabled.value\n    )\n    const inExpandingPath = computed(() => isInPath(panel.expandingNode!))\n    // only useful in check-strictly mode\n    const inCheckedPath = computed(\n      () => checkStrictly.value && panel.checkedNodes.some(isInPath)\n    )\n\n    const isInPath = (node: CascaderNode) => {\n      const { level, uid } = props.node\n      return node?.pathNodes[level - 1]?.uid === uid\n    }\n\n    const doExpand = () => {\n      if (inExpandingPath.value) return\n      panel.expandNode(props.node)\n    }\n\n    const doCheck = (checked: boolean) => {\n      const { node } = props\n      if (checked === node.checked) return\n      panel.handleCheckChange(node, checked)\n    }\n\n    const doLoad = () => {\n      panel.lazyLoad(props.node, () => {\n        if (!isLeaf.value) doExpand()\n      })\n    }\n\n    const handleHoverExpand = (e: Event) => {\n      if (!isHoverMenu.value) return\n      handleExpand()\n      !isLeaf.value && emit('expand', e)\n    }\n\n    const 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\n    const handleClick = () => {\n      if (isHoverMenu.value && !isLeaf.value) return\n\n      if (\n        isLeaf.value &&\n        !isDisabled.value &&\n        !checkStrictly.value &&\n        !multiple.value\n      ) {\n        handleCheck(true)\n      } else {\n        handleExpand()\n      }\n    }\n\n    const handleCheck = (checked: boolean) => {\n      if (!props.node.loaded) {\n        doLoad()\n      } else {\n        doCheck(checked)\n        !checkStrictly.value && doExpand()\n      }\n    }\n\n    return {\n      panel,\n      isHoverMenu,\n      multiple,\n      checkStrictly,\n      checkedNodeId,\n      isDisabled,\n      isLeaf,\n      expandable,\n      inExpandingPath,\n      inCheckedPath,\n      handleHoverExpand,\n      handleExpand,\n      handleClick,\n      handleCheck,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_createCommentVNode","_createBlock","_createVNode"],"mappings":";;;;;;;;;;;;sBACEA;IACG,OAAO,eAAU,UAAK;AAAA,IACvB,MAAK;AAAA,IACJ,kBAAgB;IAChB,aAAW,qBAAgB;IAC3B,iBAAe;IACf,UAAU,uBAAkB;AAAA,IAC5B;;;;;;;;IAQA,qDAAY;IACZ,gDAAO;IACP,gDAAO;;IAERC;IAEQ,8BADRC;;MAEG,eAAa,UAAK;AAAA,MAClB,eAAe,UAAK;AAAA,MACpB,UAAU;MACV,iDAAD;;MACC,uBAAoB;wFAGV,mCADbA;;MAEG,eAAa;MACb,OAAO,UAAK;AAAA,MACZ,UAAU;MACV,uBAAoB;MACpB,iDAAD;;;uBAEA;QAAAD;QAIA;AAAA;AAAA;0EAGW,eAAU,UAAK,wBAD5BC;;MAEE,OAAM;AAAA;uBAEN;QAAAC;;;;IAGFF;IACAE;IAEAF;KACiB,4BAAjBD;MACiB,UAAK,wBAApBE;;QAA6B,OAAM;AAAA;yBACjC;UAAAC;;;0BAEFD;;QAAgB,OAAM;AAAA;yBACpB;UAAAC;;;;;;;;;;"}