npm - @element-plus/nightly - Versions diffs - 0.0.20220107 → 0.0.20220108 - Mend

@element-plus/nightly 0.0.20220107 → 0.0.20220108

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (192) hide show

package/lib/components/cascader-panel/src/index.vue_vue_type_script_lang.js CHANGED Viewed

@@ -36,10 +36,10 @@ var script = vue.defineComponent({
   },
   emits: [constants.UPDATE_MODEL_EVENT, constants.CHANGE_EVENT, "close", "expand-change"],
   setup(props, { emit, slots }) {
-    let initialLoaded = true;
     let manualChecked = false;
     const config$1 = config.useCascaderConfig(props);
     let store$1 = null;
+    const initialLoaded = vue.ref(true);
     const menuList = vue.ref([]);
     const checkedValue = vue.ref(null);
     const menus = vue.ref([]);
@@ -54,13 +54,13 @@ var script = vue.defineComponent({
       store$1 = new store["default"](options, cfg);
       menus.value = [store$1.getNodes()];
       if (cfg.lazy && util.isEmpty(props.options)) {
-        initialLoaded = false;
+        initialLoaded.value = false;
         lazyLoad(void 0, (list) => {
           if (list) {
             store$1 = new store["default"](list, cfg);
             menus.value = [store$1.getNodes()];
           }
-          initialLoaded = true;
+          initialLoaded.value = true;
           syncCheckedValue(false, true);
         });
       } else {
@@ -141,7 +141,7 @@ var script = vue.defineComponent({
       const { modelValue } = props;
       const { lazy, multiple, checkStrictly } = config$1.value;
       const leafOnly = !checkStrictly;
-      if (!initialLoaded || manualChecked || !forced && isEqual__default["default"](modelValue, checkedValue.value))
+      if (!initialLoaded.value || manualChecked || !forced && isEqual__default["default"](modelValue, checkedValue.value))
         return;
       if (lazy && !loaded) {
         const values = util.deduplicate(util.arrayFlat(util.coerceTruthyValueToArray(modelValue)));
@@ -227,6 +227,7 @@ var script = vue.defineComponent({
       expandingNode,
       checkedNodes,
       isHoverMenu,
+      initialLoaded,
       renderLabelFn,
       lazyLoad,
       expandNode,

package/lib/components/cascader-panel/src/index.vue_vue_type_script_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue_vue_type_script_lang.js","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 { isClient } from '@vueuse/core'\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\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 let store: 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 = new Store(options, cfg)\n menus.value = [store.getNodes()]\n\n if (cfg.lazy && isEmpty(props.options)) {\n initialLoaded = false\n lazyLoad(undefined, (list) => {\n if (list) {\n store = new Store(list, cfg)\n menus.value = [store.getNodes()]\n }\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?.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?.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?.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?.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?.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 (!isClient) 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 e.preventDefault()\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 e.preventDefault()\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 e.preventDefault()\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":["defineComponent","ElCascaderMenu","CommonProps","UPDATE_MODEL_EVENT","CHANGE_EVENT","store","config","Store","node","Node","deduplicate","nextTick","isClient","EVENT_CODE","focusNode","getSibling","checkNode","provide","isEqual"],"mappings":"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"}
1	+ {"version":3,"file":"index.vue_vue_type_script_lang.js","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 { isClient } from '@vueuse/core'\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\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 // for interrupt sync check status in lazy mode\n let manualChecked = false\n\n const config = useCascaderConfig(props)\n\n let store: Nullable<Store> = null\n const initialLoaded = ref(true)\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 = new Store(options, cfg)\n menus.value = [store.getNodes()]\n\n if (cfg.lazy && isEmpty(props.options)) {\n initialLoaded.value = false\n lazyLoad(undefined, (list) => {\n if (list) {\n store = new Store(list, cfg)\n menus.value = [store.getNodes()]\n }\n initialLoaded.value = true\n syncCheckedValue(false, true)\n })\n } else {\n syncCheckedValue(false, true)\n }\n }\n\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?.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?.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.value \|\|\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?.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?.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?.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 (!isClient) 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 e.preventDefault()\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 e.preventDefault()\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 e.preventDefault()\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 initialLoaded,\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":["defineComponent","ElCascaderMenu","CommonProps","UPDATE_MODEL_EVENT","CHANGE_EVENT","config","useCascaderConfig","store","node","Node","deduplicate","nextTick","isClient","EVENT_CODE","focusNode","getSibling","checkNode","provide","isEqual","isEmpty"],"mappings":"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"}

package/lib/components/cascader-panel/src/index.vue_vue_type_template_id_97c48f5c_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue_vue_type_template_id_97c48f5c_lang.js","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 { isClient } from '@vueuse/core'\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\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 let store: 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 = new Store(options, cfg)\n menus.value = [store.getNodes()]\n\n if (cfg.lazy && isEmpty(props.options)) {\n initialLoaded = false\n lazyLoad(undefined, (list) => {\n if (list) {\n store = new Store(list, cfg)\n menus.value = [store.getNodes()]\n }\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?.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?.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?.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?.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?.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 (!isClient) 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 e.preventDefault()\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 e.preventDefault()\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 e.preventDefault()\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":[],"mappings":";;;;;;;;;;wBACE;;;;;;QAMK,GAAG,EAAE,KAAK;;QACV;aACK,EAAE;QACP;;;;;;"}
1	+ {"version":3,"file":"index.vue_vue_type_template_id_97c48f5c_lang.js","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 { isClient } from '@vueuse/core'\nimport { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'\nimport { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'\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 // for interrupt sync check status in lazy mode\n let manualChecked = false\n\n const config = useCascaderConfig(props)\n\n let store: Nullable<Store> = null\n const initialLoaded = ref(true)\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 = new Store(options, cfg)\n menus.value = [store.getNodes()]\n\n if (cfg.lazy && isEmpty(props.options)) {\n initialLoaded.value = false\n lazyLoad(undefined, (list) => {\n if (list) {\n store = new Store(list, cfg)\n menus.value = [store.getNodes()]\n }\n initialLoaded.value = true\n syncCheckedValue(false, true)\n })\n } else {\n syncCheckedValue(false, true)\n }\n }\n\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?.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?.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.value \|\|\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?.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?.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?.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 (!isClient) 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 e.preventDefault()\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 e.preventDefault()\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 e.preventDefault()\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 initialLoaded,\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":[],"mappings":";;;;;;;;;;wBACE;;;;;;QAMK,GAAG,EAAE,KAAK;;QACV;aACK,EAAE;QACP;;;;;;"}

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

@@ -13,6 +13,7 @@ declare const _default: import("vue").DefineComponent<{
     panel: import("./types").ElCascaderPanelContext;
     hoverZone: import("vue").Ref<SVGSVGElement | null>;
     isEmpty: import("vue").ComputedRef<boolean>;
+    isLoading: import("vue").ComputedRef<boolean>;
     menuId: import("vue").ComputedRef<string>;
     t: import("element-plus/es/hooks").Translator;
     handleExpand: (e: MouseEvent) => void;

package/lib/components/cascader-panel/src/menu.vue_vue_type_script_lang.js CHANGED Viewed

@@ -3,18 +3,22 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 var vue = require('vue');
-var index = require('../../scrollbar/index.js');
+var index$1 = require('../../scrollbar/index.js');
 require('../../../hooks/index.js');
 var util = require('../../../utils/util.js');
+var iconsVue = require('@element-plus/icons-vue');
+var index = require('../../icon/index.js');
 require('./node2.js');
 var types = require('./types.js');
 var node_vue_vue_type_script_lang = require('./node.vue_vue_type_script_lang.js');
-var index$1 = require('../../../hooks/use-locale/index.js');
+var index$2 = require('../../../hooks/use-locale/index.js');
 var script = vue.defineComponent({
   name: "ElCascaderMenu",
   components: {
-    ElScrollbar: index.ElScrollbar,
+    Loading: iconsVue.Loading,
+    ElIcon: index.ElIcon,
+    ElScrollbar: index$1.ElScrollbar,
     ElCascaderNode: node_vue_vue_type_script_lang["default"]
   },
   props: {
@@ -29,13 +33,14 @@ var script = vue.defineComponent({
   },
   setup(props) {
     const instance = vue.getCurrentInstance();
-    const { t } = index$1.useLocale();
+    const { t } = index$2.useLocale();
     const id = util.generateId();
     let activeNode = null;
     let hoverTimer = null;
     const panel = vue.inject(types.CASCADER_PANEL_INJECTION_KEY);
     const hoverZone = vue.ref(null);
     const isEmpty = vue.computed(() => !props.nodes.length);
+    const isLoading = vue.computed(() => !panel.initialLoaded);
     const menuId = vue.computed(() => `cascader-menu-${id}-${props.index}`);
     const handleExpand = (e) => {
       activeNode = e.target;
@@ -75,6 +80,7 @@ var script = vue.defineComponent({
       panel,
       hoverZone,
       isEmpty,
+      isLoading,
       menuId,
       t,
       handleExpand,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"menu.vue_vue_type_script_lang.js","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 { useLocale } 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 } = useLocale()\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":["defineComponent","~~ElScrollbar~~","ElCascaderNode"],"mappings":"~~;;;;;;;;;;;;;AAmCA~~,aAAeA,mBAAe,CAAC~~;AAC~~/B,EAAE,~~MAAM;;AAER~~,~~iBAAIC~~,~~iBAAW~~;~~AACf~~,oBAAIC,wCAAc;;~~AAElB~~,~~EAAE,~~KAAK,EAAE;~~IACL~~,~~KAAK,EAAE;;MAEL,QAAQ~~;~~KACT~~;IACD,KAAK,EAAE;;;KAGN;;OAEE,CAAC,KAAK,EAAE;UACL,QAAQ;IACd;IACA;QACI,UAAU;QACV,UAAU;IACd;;;IAGA,MAAM;IACN,MAAM,YAAY,GAAG,CAAC,CAAC~~,KAAK~~;~~MAC1B~~,UAAU,GAAG,CAAC,CAAC~~,MAAM,CAAC~~;~~KACvB~~,CAAC;IACF,MAAM,eAAe,GAAG,CAAC,CAAC,KAAK~~;MAC7B~~,~~IAAI~~,~~CAAC~~,~~KAAK,~~CAAC,~~WAAW~~,~~IAAI~~,~~CAAC,cAAc,CAAC;;MAE1C,~~IAAI,~~UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,~~EAAE~~;;QAEjC~~,~~MAAM~~,EAAE,~~WAAW,~~CAAC,~~KAAK~~,~~CAAC,~~EAAE,CAAC~~;;QAE7B~~,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,EAAE,CAAC;QACzC,MAAM,MAAM,GAAG,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC;;QAEhC,MAAM,MAAM,GAAG,GAAG,GAAG,UAAU;QAC/B,SAAS,MAAM,CAAC,SAAS,GAAG,CAAC;;;QAG7B,EAAE;OACH,MAAM,IAAI,CAAC,YAAY;;OAEvB;;;UAGG,CAAC,UAAU;QACb;kBACU,CAAC,UAAU,CAAC,CAAC;gBACf,GAAG,IAAI,CAAC;;UAEd,cAAc,GAAG,MAAM;;QAEzB,OAAO;gBACC,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;qBAChB,EAAE,CAAC;;WAEb;WACA;eACI;aACF;;MAEP;;;MAGA,cAAc;MACd;;;;;;"}
1	+ {"version":3,"file":"menu.vue_vue_type_script_lang.js","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=\"isLoading\" class=\"el-cascader-menu__empty-text\">\n <el-icon size=\"14\" class=\"is-loading\">\n <loading />\n </el-icon>\n {{ t('el.cascader.loading') }}\n </div>\n <div v-else-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 { useLocale } from '@element-plus/hooks'\nimport { generateId } from '@element-plus/utils/util'\nimport { Loading } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { default as CascaderNode } from './node'\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 Loading,\n ElIcon,\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 } = useLocale()\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 isLoading = computed(() => !panel.initialLoaded)\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 return {\n panel,\n hoverZone,\n isEmpty,\n isLoading,\n menuId,\n t,\n handleExpand,\n handleMouseMove,\n clearHoverZone,\n }\n },\n})\n</script>\n"],"names":["defineComponent","Loading","ElIcon","ElCascaderNode","computed"],"mappings":";;;;;;;;;;;;;;;AA2CA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,UAAU,EAAE;AACd,aAAIC;AACJ,YAAIC,YAAM;;AAEV,oBAAIC,wCAAc;GACf;;IAEC,KAAK,EAAE;MACL,IAAI;MACJ;KACD;IACD,KAAK,EAAE;;;KAGN;;OAEE,CAAC,KAAK,EAAE;UACL,QAAQ;IACd;IACA;QACI,UAAU;QACV,UAAU;IACd;;;IAGA,MAAM;IACN,MAAM,MAAM,GAAGC,YAAQ,CAAC,MAAM,CAAC;IAC/B,MAAM,YAAY,GAAG,CAAC,CAAC;MACrB,UAAU,GAAG,CAAC,CAAC;KAChB,CAAC;IACF,MAAM,eAAe,GAAG,CAAC,CAAC,KAAK;;QAE3B;;QAEA,eAAe,EAAE,CAAC;;QAElB,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC,qBAAqB,EAAE,CAAC;QAC5C,MAAM,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,EAAE,CAAC;QACzC,MAAM,MAAM,GAAG,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC;;QAEhC,MAAM,MAAM,GAAG,GAAG,GAAG,UAAU;QAC/B,SAAS,MAAM,CAAC,SAAS,GAAG,CAAC;;;QAG7B,EAAE;OACH,MAAM,IAAI,CAAC,YAAY;;OAEvB;;;UAGG,CAAC,UAAU;QACb;kBACU,CAAC,UAAU,CAAC,CAAC;gBACf,GAAG,IAAI,CAAC;;UAEd,cAAc,GAAG,MAAM;;QAEzB,OAAO;gBACC,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;qBAChB,EAAE,CAAC;;WAEb;WACA;eACI;aACF;;MAEP;;;MAGA,eAAe;MACf,cAAc;MACd;;;;;;"}

package/lib/components/cascader-panel/src/menu.vue_vue_type_template_id_9c79e4e2_lang.js CHANGED Viewed

@@ -10,11 +10,17 @@ const _hoisted_1 = {
 };
 const _hoisted_2 = {
   key: 1,
+  class: "el-cascader-menu__empty-text"
+};
+const _hoisted_3 = {
+  key: 2,
   ref: "hoverZone",
   class: "el-cascader-menu__hover-zone"
 };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_el_cascader_node = vue.resolveComponent("el-cascader-node");
+  const _component_loading = vue.resolveComponent("loading");
+  const _component_el_icon = vue.resolveComponent("el-icon");
   const _component_el_scrollbar = vue.resolveComponent("el-scrollbar");
   return vue.openBlock(), vue.createBlock(_component_el_scrollbar, {
     key: _ctx.menuId,
@@ -37,7 +43,18 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             onExpand: _ctx.handleExpand
           }, null, 8, ["node", "menu-id", "onExpand"]);
         }), 128)),
-        _ctx.isEmpty ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, vue.toDisplayString(_ctx.t("el.cascader.noData")), 1)) : ((_a = _ctx.panel) == null ? void 0 : _a.isHoverMenu) ? (vue.openBlock(), vue.createElementBlock("svg", _hoisted_2, null, 512)) : vue.createCommentVNode("v-if", true)
+        _ctx.isLoading ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+          vue.createVNode(_component_el_icon, {
+            size: "14",
+            class: "is-loading"
+          }, {
+            default: vue.withCtx(() => [
+              vue.createVNode(_component_loading)
+            ]),
+            _: 1
+          }),
+          vue.createTextVNode(" " + vue.toDisplayString(_ctx.t("el.cascader.loading")), 1)
+        ])) : _ctx.isEmpty ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, vue.toDisplayString(_ctx.t("el.cascader.noData")), 1)) : ((_a = _ctx.panel) == null ? void 0 : _a.isHoverMenu) ? (vue.openBlock(), vue.createElementBlock("svg", _hoisted_3, null, 512)) : vue.createCommentVNode("v-if", true)
       ];
     }),
     _: 1

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

	@@ -1 +1 @@
1	- {"version":3,"file":"menu.vue_vue_type_template_id_9c79e4e2_lang.js","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 { useLocale } 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 } = useLocale()\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":[],"mappings":";;;;;;;;;~~EAkBwB~~;;;;~~EAKlB~~,KAAI;EACJ~~;;;;;;;;IAtBD~~,KAAK;IACN;IACA;IACA;IACA,YAAU,EAAC;;IAEV;;;;;;;;;oBAQU;;;~~OAEA;;;sDAGX~~;;;;;"}
1	+ {"version":3,"file":"menu.vue_vue_type_template_id_9c79e4e2_lang.js","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=\"isLoading\" class=\"el-cascader-menu__empty-text\">\n <el-icon size=\"14\" class=\"is-loading\">\n <loading />\n </el-icon>\n {{ t('el.cascader.loading') }}\n </div>\n <div v-else-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 { useLocale } from '@element-plus/hooks'\nimport { generateId } from '@element-plus/utils/util'\nimport { Loading } from '@element-plus/icons-vue'\nimport ElIcon from '@element-plus/components/icon'\nimport ElCascaderNode from './node.vue'\nimport { CASCADER_PANEL_INJECTION_KEY } from './types'\n\nimport type { default as CascaderNode } from './node'\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 Loading,\n ElIcon,\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 } = useLocale()\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 isLoading = computed(() => !panel.initialLoaded)\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 return {\n panel,\n hoverZone,\n isEmpty,\n isLoading,\n menuId,\n t,\n handleExpand,\n handleMouseMove,\n clearHoverZone,\n }\n },\n})\n</script>\n"],"names":["_withCtx"],"mappings":";;;;;;;;;EAkB0B;;;;EAMG;;;;EAKvB,KAAI;EACJ;;;;;;;;;;IA5BD,KAAK;IACN;IACA;IACA;IACA,YAAU,EAAC;;IAEV;;;;;;;;;oBAQU;;;;;YAGT;;mBAAwB,EAACA;;;gBACvB;;;;;;;sDAIJ;;;;;"}

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

@@ -51,6 +51,7 @@ export interface ElCascaderPanelContext {
     expandingNode: Nullable<CascaderNode>;
     checkedNodes: CascaderNode[];
     isHoverMenu: boolean;
+    initialLoaded: boolean;
     renderLabelFn: RenderLabel;
     lazyLoad: (node?: CascaderNode, cb?: (dataList: CascaderOption[]) => void) => void;
     expandNode: (node: CascaderNode, silent?: boolean) => void;

package/lib/components/cascader-panel/src/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sources":["../../../../../../packages/components/cascader-panel/src/types.ts"],"sourcesContent":["import type { VNode, InjectionKey } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type { default as CascaderNode } from './node'\n\nexport type { CascaderNode }\n\nexport type CascaderNodeValue = string \| number\nexport type CascaderNodePathValue = CascaderNodeValue[]\nexport type CascaderValue =\n \| CascaderNodeValue\n \| CascaderNodePathValue\n \| (CascaderNodeValue \| CascaderNodePathValue)[]\nexport type CascaderConfig = Required<CascaderProps>\nexport type isDisabled = (data: CascaderOption, node: CascaderNode) => boolean\nexport type isLeaf = (data: CascaderOption, node: CascaderNode) => boolean\nexport type Resolve = (dataList?: CascaderOption[]) => void\nexport type LazyLoad = (node: CascaderNode, resolve: Resolve) => void\nexport type RenderLabel = ({\n node: CascaderNode,\n data: CascaderOption,\n}) => VNode \| VNode[]\n\nexport enum ExpandTrigger {\n CLICK = 'click',\n HOVER = 'hover',\n}\n\nexport interface CascaderOption extends Record<string, unknown> {\n label?: string\n value?: CascaderNodeValue\n children?: CascaderOption[]\n disabled?: boolean\n leaf?: boolean\n}\n\nexport interface CascaderProps {\n expandTrigger?: ExpandTrigger\n multiple?: boolean\n checkStrictly?: boolean\n emitPath?: boolean\n lazy?: boolean\n lazyLoad?: LazyLoad\n value?: string\n label?: string\n children?: string\n disabled?: string \| isDisabled\n leaf?: string \| isLeaf\n hoverThreshold?: number\n}\n\nexport interface Tag {\n node?: CascaderNode\n key: number\n text: string\n hitState?: boolean\n closable: boolean\n}\n\nexport interface ElCascaderPanelContext {\n config: CascaderConfig\n expandingNode: Nullable<CascaderNode>\n checkedNodes: CascaderNode[]\n isHoverMenu: boolean\n renderLabelFn: RenderLabel\n lazyLoad: (\n node?: CascaderNode,\n cb?: (dataList: CascaderOption[]) => void\n ) => void\n expandNode: (node: CascaderNode, silent?: boolean) => void\n handleCheckChange: (\n node: CascaderNode,\n checked: boolean,\n emitClose?: boolean\n ) => void\n}\n\nexport const CASCADER_PANEL_INJECTION_KEY: InjectionKey<ElCascaderPanelContext> =\n Symbol()\n"],"names":[],"mappings":";;;;AAAU,IAAC,aAAa,mBAAmB,CAAC,CAAC,cAAc,KAAK;AAChE,EAAE,cAAc,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC;AACpC,EAAE,cAAc,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC;AACpC,EAAE,OAAO,cAAc,CAAC;AACxB,CAAC,EAAE,aAAa,IAAI,EAAE,EAAE;AACZ,MAAC,4BAA4B,GAAG,MAAM;;;;;"}
1	+ {"version":3,"file":"types.js","sources":["../../../../../../packages/components/cascader-panel/src/types.ts"],"sourcesContent":["import type { VNode, InjectionKey } from 'vue'\nimport type { Nullable } from '@element-plus/utils/types'\nimport type { default as CascaderNode } from './node'\n\nexport type { CascaderNode }\n\nexport type CascaderNodeValue = string \| number\nexport type CascaderNodePathValue = CascaderNodeValue[]\nexport type CascaderValue =\n \| CascaderNodeValue\n \| CascaderNodePathValue\n \| (CascaderNodeValue \| CascaderNodePathValue)[]\nexport type CascaderConfig = Required<CascaderProps>\nexport type isDisabled = (data: CascaderOption, node: CascaderNode) => boolean\nexport type isLeaf = (data: CascaderOption, node: CascaderNode) => boolean\nexport type Resolve = (dataList?: CascaderOption[]) => void\nexport type LazyLoad = (node: CascaderNode, resolve: Resolve) => void\nexport type RenderLabel = ({\n node: CascaderNode,\n data: CascaderOption,\n}) => VNode \| VNode[]\n\nexport enum ExpandTrigger {\n CLICK = 'click',\n HOVER = 'hover',\n}\n\nexport interface CascaderOption extends Record<string, unknown> {\n label?: string\n value?: CascaderNodeValue\n children?: CascaderOption[]\n disabled?: boolean\n leaf?: boolean\n}\n\nexport interface CascaderProps {\n expandTrigger?: ExpandTrigger\n multiple?: boolean\n checkStrictly?: boolean\n emitPath?: boolean\n lazy?: boolean\n lazyLoad?: LazyLoad\n value?: string\n label?: string\n children?: string\n disabled?: string \| isDisabled\n leaf?: string \| isLeaf\n hoverThreshold?: number\n}\n\nexport interface Tag {\n node?: CascaderNode\n key: number\n text: string\n hitState?: boolean\n closable: boolean\n}\n\nexport interface ElCascaderPanelContext {\n config: CascaderConfig\n expandingNode: Nullable<CascaderNode>\n checkedNodes: CascaderNode[]\n isHoverMenu: boolean\n initialLoaded: boolean\n renderLabelFn: RenderLabel\n lazyLoad: (\n node?: CascaderNode,\n cb?: (dataList: CascaderOption[]) => void\n ) => void\n expandNode: (node: CascaderNode, silent?: boolean) => void\n handleCheckChange: (\n node: CascaderNode,\n checked: boolean,\n emitClose?: boolean\n ) => void\n}\n\nexport const CASCADER_PANEL_INJECTION_KEY: InjectionKey<ElCascaderPanelContext> =\n Symbol()\n"],"names":[],"mappings":";;;;AAAU,IAAC,aAAa,mBAAmB,CAAC,CAAC,cAAc,KAAK;AAChE,EAAE,cAAc,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC;AACpC,EAAE,cAAc,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC;AACpC,EAAE,OAAO,cAAc,CAAC;AACxB,CAAC,EAAE,aAAa,IAAI,EAAE,EAAE;AACZ,MAAC,4BAA4B,GAAG,MAAM;;;;;"}

package/lib/components/checkbox/index.d.ts CHANGED Viewed

@@ -64,9 +64,9 @@ export declare const ElCheckbox: import("../../utils/types").SFCWithInstall<impo
     checked: boolean;
 } & {
     size?: import("../../utils/types").ComponentSize | undefined;
-    name?: string | undefined;
     modelValue?: string | number | boolean | undefined;
     label?: string | number | boolean | Record<string, any> | undefined;
+    name?: string | undefined;
     id?: string | undefined;
     tabindex?: string | number | undefined;
     trueLabel?: string | number | undefined;
@@ -77,8 +77,8 @@ export declare const ElCheckbox: import("../../utils/types").SFCWithInstall<impo
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
-    name: string;
     modelValue: string | number | boolean;
+    name: string;
     border: boolean;
     id: string;
     indeterminate: boolean;
@@ -142,9 +142,9 @@ export declare const ElCheckbox: import("../../utils/types").SFCWithInstall<impo
         checked: boolean;
     } & {
         size?: string | undefined;
-        name?: string | undefined;
         modelValue?: string | number | boolean | undefined;
         label?: string | number | boolean | Record<string, any> | undefined;
+        name?: string | undefined;
         tabindex?: string | number | undefined;
         trueLabel?: string | number | undefined;
         falseLabel?: string | number | undefined;
@@ -153,8 +153,8 @@ export declare const ElCheckbox: import("../../utils/types").SFCWithInstall<impo
         "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     }, {
         disabled: boolean;
-        name: string;
         modelValue: string | number | boolean;
+        name: string;
         indeterminate: boolean;
         checked: boolean;
         trueLabel: string | number;
@@ -280,9 +280,9 @@ export declare const ElCheckboxButton: import("../../utils/types").SFCWithInstal
     checked: boolean;
 } & {
     size?: string | undefined;
-    name?: string | undefined;
     modelValue?: string | number | boolean | undefined;
     label?: string | number | boolean | Record<string, any> | undefined;
+    name?: string | undefined;
     tabindex?: string | number | undefined;
     trueLabel?: string | number | undefined;
     falseLabel?: string | number | undefined;
@@ -291,8 +291,8 @@ export declare const ElCheckboxButton: import("../../utils/types").SFCWithInstal
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
-    name: string;
     modelValue: string | number | boolean;
+    name: string;
     indeterminate: boolean;
     checked: boolean;
     trueLabel: string | number;

package/lib/components/checkbox/src/checkbox-button.vue.d.ts CHANGED Viewed

@@ -53,9 +53,9 @@ declare const _default: import("vue").DefineComponent<{
     checked: boolean;
 } & {
     size?: string | undefined;
-    name?: string | undefined;
     modelValue?: string | number | boolean | undefined;
     label?: string | number | boolean | Record<string, any> | undefined;
+    name?: string | undefined;
     tabindex?: string | number | undefined;
     trueLabel?: string | number | undefined;
     falseLabel?: string | number | undefined;
@@ -64,8 +64,8 @@ declare const _default: import("vue").DefineComponent<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
-    name: string;
     modelValue: string | number | boolean;
+    name: string;
     indeterminate: boolean;
     checked: boolean;
     trueLabel: string | number;

package/lib/components/checkbox/src/checkbox.vue.d.ts CHANGED Viewed

@@ -66,9 +66,9 @@ declare const _default: import("vue").DefineComponent<{
     checked: boolean;
 } & {
     size?: ComponentSize | undefined;
-    name?: string | undefined;
     modelValue?: string | number | boolean | undefined;
     label?: string | number | boolean | Record<string, any> | undefined;
+    name?: string | undefined;
     id?: string | undefined;
     tabindex?: string | number | undefined;
     trueLabel?: string | number | undefined;
@@ -79,8 +79,8 @@ declare const _default: import("vue").DefineComponent<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
-    name: string;
     modelValue: string | number | boolean;
+    name: string;
     border: boolean;
     id: string;
     indeterminate: boolean;

package/lib/components/config-provider/index.d.ts CHANGED Viewed

@@ -1,24 +1,28 @@
 export declare const ElConfigProvider: import("../../utils/types").SFCWithInstall<import("vue").DefineComponent<{
+    readonly locale: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<import("../../locale").Language>, unknown, unknown, unknown, unknown>;
     readonly size: import("../../utils/props").BuildPropReturn<StringConstructor, unknown, unknown, "small" | "default" | "large", unknown>;
     readonly button: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<import("..").ButtonConfigContext>, unknown, unknown, unknown, unknown>;
+    readonly message: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<import("..").MessageConfigContext>, unknown, unknown, unknown, unknown>;
     readonly zIndex: import("../../utils/props").BuildPropReturn<NumberConstructor, unknown, unknown, unknown, unknown>;
-    readonly locale: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<import("../../locale").Language>, unknown, unknown, unknown, unknown>;
 }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    readonly locale?: unknown;
     readonly size?: unknown;
     readonly button?: unknown;
+    readonly message?: unknown;
     readonly zIndex?: unknown;
-    readonly locale?: unknown;
 } & {} & {
     button?: import("..").ButtonConfigContext | undefined;
     size?: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", unknown> | undefined;
     locale?: import("../../locale").Language | undefined;
+    message?: import("..").MessageConfigContext | undefined;
     zIndex?: number | undefined;
 }>, {
     button: import("..").ButtonConfigContext;
     size: import("../../utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", unknown>;
     locale: import("../../locale").Language;
+    message: import("..").MessageConfigContext;
     zIndex: number;
 }>> & Record<string, any>;
 export default ElConfigProvider;

package/lib/components/config-provider/index.js CHANGED Viewed

@@ -8,6 +8,7 @@ var configProvider = require('./src/config-provider.js');
 const ElConfigProvider = withInstall.withInstall(configProvider["default"]);
 exports.configProviderProps = configProvider.configProviderProps;
+exports.messageConfig = configProvider.messageConfig;
 exports.ElConfigProvider = ElConfigProvider;
 exports["default"] = ElConfigProvider;
 //# sourceMappingURL=index.js.map

package/lib/components/config-provider/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../../packages/components/config-provider/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils/with-install'\n\nimport ConfigProvider from './src/config-provider'\n\nexport const ElConfigProvider = withInstall(ConfigProvider)\nexport default ElConfigProvider\n\nexport * from './src/config-provider'\n"],"names":["withInstall","ConfigProvider"],"mappings":";;;;;;;AAEY,MAAC,gBAAgB,GAAGA,uBAAW,CAACC,yBAAc~~;;;;;;~~"}
1	+ {"version":3,"file":"index.js","sources":["../../../../../packages/components/config-provider/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils/with-install'\n\nimport ConfigProvider from './src/config-provider'\n\nexport const ElConfigProvider = withInstall(ConfigProvider)\nexport default ElConfigProvider\n\nexport * from './src/config-provider'\n"],"names":["withInstall","ConfigProvider"],"mappings":";;;;;;;AAEY,MAAC,gBAAgB,GAAGA,uBAAW,CAACC,yBAAc;;;;;;;"}

package/lib/components/config-provider/src/config-provider.d.ts CHANGED Viewed

@@ -1,31 +1,39 @@
+import type { Language } from 'element-plus/es/locale';
 import type { ButtonConfigContext } from 'element-plus/es/components/button';
+import type { MessageConfigContext } from 'element-plus/es/components/message';
+export declare const messageConfig: MessageConfigContext;
 export declare const configProviderProps: {
+    readonly locale: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<Language>, unknown, unknown, unknown, unknown>;
     readonly size: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, unknown, unknown, "small" | "default" | "large", unknown>;
     readonly button: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<ButtonConfigContext>, unknown, unknown, unknown, unknown>;
+    readonly message: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<MessageConfigContext>, unknown, unknown, unknown, unknown>;
     readonly zIndex: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, unknown, unknown, unknown, unknown>;
-    readonly locale: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<import("../../../locale").Language>, unknown, unknown, unknown, unknown>;
 };
 declare const _default: import("vue").DefineComponent<{
+    readonly locale: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<Language>, unknown, unknown, unknown, unknown>;
     readonly size: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, unknown, unknown, "small" | "default" | "large", unknown>;
     readonly button: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<ButtonConfigContext>, unknown, unknown, unknown, unknown>;
+    readonly message: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<MessageConfigContext>, unknown, unknown, unknown, unknown>;
     readonly zIndex: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, unknown, unknown, unknown, unknown>;
-    readonly locale: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<import("../../../locale").Language>, unknown, unknown, unknown, unknown>;
 }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
+    readonly locale?: unknown;
     readonly size?: unknown;
     readonly button?: unknown;
+    readonly message?: unknown;
     readonly zIndex?: unknown;
-    readonly locale?: unknown;
 } & {} & {
     button?: ButtonConfigContext | undefined;
     size?: import("element-plus/es/utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", unknown> | undefined;
-    locale?: import("../../../locale").Language | undefined;
+    locale?: Language | undefined;
+    message?: MessageConfigContext | undefined;
     zIndex?: number | undefined;
 }>, {
     button: ButtonConfigContext;
     size: import("element-plus/es/utils/props").BuildPropType<StringConstructor, "small" | "default" | "large", unknown>;
-    locale: import("../../../locale").Language;
+    locale: Language;
+    message: MessageConfigContext;
     zIndex: number;
 }>;
 export default _default;

package/lib/components/config-provider/src/config-provider.js CHANGED Viewed

@@ -5,11 +5,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var vue = require('vue');
 var props = require('../../../utils/props.js');
 require('../../../hooks/index.js');
-var index = require('../../../hooks/use-locale/index.js');
-var index$1 = require('../../../hooks/use-global-config/index.js');
+var index = require('../../../hooks/use-global-config/index.js');
+const messageConfig = {};
 const configProviderProps = props.buildProps({
-  ...index.useLocaleProps,
+  locale: {
+    type: props.definePropType(Object)
+  },
   size: {
     type: String,
     values: ["large", "default", "small"]
@@ -17,6 +19,9 @@ const configProviderProps = props.buildProps({
   button: {
     type: props.definePropType(Object)
   },
+  message: {
+    type: props.definePropType(Object)
+  },
   zIndex: {
     type: Number
   }
@@ -25,12 +30,15 @@ var ConfigProvider = vue.defineComponent({
   name: "ElConfigProvider",
   props: configProviderProps,
   setup(props, { slots }) {
-    index.provideLocale();
-    const config = index$1.provideGlobalConfig(props);
+    vue.watch(() => props.message, (val) => {
+      Object.assign(messageConfig, val != null ? val : {});
+    }, { immediate: true, deep: true });
+    const config = index.provideGlobalConfig(props);
     return () => vue.renderSlot(slots, "default", { config: config == null ? void 0 : config.value });
   }
 });
 exports.configProviderProps = configProviderProps;
 exports["default"] = ConfigProvider;
+exports.messageConfig = messageConfig;
 //# sourceMappingURL=config-provider.js.map