vxe-pc-ui 4.14.39 → 4.14.40

package/lib/index.umd.js

@@ -4646,7 +4646,7 @@ function checkDynamic() {
 }
 ;// ./packages/ui/src/log.ts
 
-const log_version = `ui v${"4.14.39"}`;
+const log_version = `ui v${"4.14.40"}`;
 const warnLog = log.create('warn', log_version);
 const errLog = log.create('error', log_version);
 ;// ./packages/ui/index.ts
@@ -4654,7 +4654,7 @@ const errLog = log.create('error', log_version);
 
 
 
-const ui_version = "4.14.39";
+const ui_version = "4.14.40";
 VxeUI.uiVersion = ui_version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -4714,7 +4714,10 @@ setConfig({
   },
   carouselItem: {},
   cascader: {
-    autoClose: true
+    showFullLabel: true,
+    treeConfig: {
+      showIcon: true
+    }
   },
   checkbox: {},
   checkboxButton: {},
@@ -5068,7 +5071,6 @@ setConfig({
     }
   },
   treeSelect: {
-    autoClose: null,
     // separator: '/',
     virtualYConfig: {
       enabled: true,
@@ -5306,7 +5308,11 @@ setIcon({
   BACKTOP_TOP: iconPrefix + 'top',
   // context-menu
   CONTEXT_MENU_OPTION_LOADING: iconPrefix + 'spinner roll',
-  CONTEXT_MENU_CHILDREN: iconPrefix + 'arrow-right'
+  CONTEXT_MENU_CHILDREN: iconPrefix + 'arrow-right',
+  // cascader
+  CASCADER_NODE_OPEN: iconPrefix + 'arrow-right',
+  CASCADER_NODE_CLOSE: iconPrefix + 'arrow-right',
+  CASCADER_NODE_LOADED: iconPrefix + 'spinner roll'
 });
 
 /* harmony default export */ var ui = ((/* unused pure expression or super */ null && (ui_VxeUI)));
@@ -5664,6 +5670,13 @@ setIcon({
       yearLabel: '{0} 年',
       monthLabel: '{0} 月'
     },
+    cascader: {
+      clearChecked: '清除',
+      allChecked: '全选',
+      total: '已选 {0} 项',
+      close: '关闭',
+      search: '搜索'
+    },
     numberInput: {
       currencySymbol: '¥'
     },
@@ -6474,10 +6487,12 @@ function updatePanelPlacement(targetElem, panelElem, options) {
     placement,
     defaultPlacement,
     teleportTo,
-    marginSize
+    marginSize,
+    isMinWidth
   } = Object.assign({
     teleportTo: false,
-    marginSize: 18
+    marginSize: 18,
+    isMinWidth: true
   }, options);
   let panelPlacement = 'bottom';
   let top = '';
@@ -6571,7 +6586,7 @@ function updatePanelPlacement(targetElem, panelElem, options) {
     if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(right)) {
       stys.right = toCssUnit(right);
     }
-    if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(minWidth)) {
+    if (isMinWidth && external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(minWidth)) {
       stys.minWidth = toCssUnit(minWidth);
     }
   }
@@ -11837,7 +11852,7 @@ dynamicApp.use(VxeCarouselItem);
 VxeUI.component(carousel_item);
 const CarouselItem = VxeCarouselItem;
 /* harmony default export */ var packages_carousel_item = (VxeCarouselItem);
-;// ./packages/tree/src/util.ts
+;// ./packages/cascader/src/util.ts
 
 function enNodeValue(nodeid) {
   return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(nodeid) ? '' : encodeURIComponent(`${nodeid}`);
@@ -11845,58 +11860,467 @@ function enNodeValue(nodeid) {
 function deNodeValue(nodeid) {
   return nodeid ? decodeURIComponent(`${nodeid}`) : nodeid;
 }
-function countTreeExpand($xeTree, prevNode) {
-  let count = 1;
-  if (!prevNode) {
-    return count;
-  }
-  const props = $xeTree.props;
-  const {
-    transform
-  } = props;
-  const reactData = $xeTree.reactData;
-  const {
-    updateExpandedFlag
-  } = reactData;
-  const internalData = $xeTree.internalData;
-  const {
-    treeExpandedMaps
-  } = internalData;
-  const {
-    computeChildrenField,
-    computeMapChildrenField
-  } = $xeTree.getComputeMaps();
-  const childrenField = computeChildrenField.value;
-  const mapChildrenField = computeMapChildrenField.value;
-  const nodeChildren = prevNode[transform ? mapChildrenField : childrenField];
-  if (nodeChildren && updateExpandedFlag && treeExpandedMaps[$xeTree.getNodeId(prevNode)]) {
-    for (let index = 0; index < nodeChildren.length; index++) {
-      count += countTreeExpand($xeTree, nodeChildren[index]);
+;// ./packages/list/src/list.ts
+
+
+
+
+
+
+function list_createReactData() {
+  return {
+    scrollYLoad: false,
+    bodyHeight: 0,
+    customHeight: 0,
+    customMaxHeight: 0,
+    parentHeight: 0,
+    topSpaceHeight: 0,
+    items: []
+  };
+}
+function list_createInternalData() {
+  return {
+    resizeObserver: undefined,
+    fullData: [],
+    lastScrollLeft: 0,
+    lastScrollTop: 0,
+    scrollYStore: {
+      startIndex: 0,
+      endIndex: 0,
+      visibleSize: 0,
+      offsetSize: 0,
+      rowHeight: 0
     }
-  }
-  return count;
+  };
 }
-function calcTreeLine($xeTree, node, prevNode) {
-  const internalData = $xeTree.internalData;
-  const {
-    scrollYStore
-  } = internalData;
-  const {
-    rowHeight
-  } = scrollYStore;
-  let expandSize = 1;
-  if (prevNode) {
-    expandSize = countTreeExpand($xeTree, prevNode);
+/* harmony default export */ var list = (defineVxeComponent({
+  name: 'VxeList',
+  props: {
+    data: Array,
+    height: [Number, String],
+    maxHeight: [Number, String],
+    loading: Boolean,
+    className: [String, Function],
+    size: {
+      type: String,
+      default: () => getConfig().list.size || getConfig().size
+    },
+    autoResize: {
+      type: Boolean,
+      default: () => getConfig().list.autoResize
+    },
+    syncResize: [Boolean, String, Number],
+    virtualYConfig: Object,
+    scrollY: Object
+  },
+  emits: ['scroll'],
+  setup(props, context) {
+    const {
+      slots,
+      emit
+    } = context;
+    const xID = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId();
+    const browseObj = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().browse();
+    const {
+      computeSize
+    } = useSize(props);
+    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(list_createReactData());
+    const internalData = list_createInternalData();
+    const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
+    const refVirtualWrapper = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
+    const refVirtualBody = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
+    const refMaps = {
+      refElem
+    };
+    const $xeList = {
+      xID,
+      props,
+      context,
+      reactData,
+      internalData,
+      getRefMaps: () => refMaps
+    };
+    const computeSYOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      return Object.assign({}, getConfig().list.virtualYConfig || getConfig().list.scrollY, props.virtualYConfig || props.scrollY);
+    });
+    const computeStyles = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const {
+        height,
+        maxHeight
+      } = props;
+      const {
+        customHeight,
+        customMaxHeight
+      } = reactData;
+      const style = {};
+      if (height) {
+        style.height = `${customHeight}px`;
+      } else if (maxHeight) {
+        style.height = 'auto';
+        style.maxHeight = `${customMaxHeight}px`;
+      }
+      return style;
+    });
+    const dispatchEvent = (type, params, evnt) => {
+      emit(type, createEvent(evnt, {
+        $list: $xeList
+      }, params));
+    };
+    const calcTableHeight = key => {
+      const {
+        parentHeight
+      } = reactData;
+      const val = props[key];
+      let num = 0;
+      if (val) {
+        if (val === '100%' || val === 'auto') {
+          num = parentHeight;
+        } else {
+          if (isScale(val)) {
+            num = Math.floor((external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toInteger(val) || 1) / 100 * parentHeight);
+          } else {
+            num = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(val);
+          }
+          num = Math.max(40, num);
+        }
+      }
+      return num;
+    };
+    const updateHeight = () => {
+      reactData.customHeight = calcTableHeight('height');
+      reactData.customMaxHeight = calcTableHeight('maxHeight');
+    };
+    const updateYSpace = () => {
+      const {
+        scrollYLoad
+      } = reactData;
+      const {
+        scrollYStore,
+        fullData
+      } = internalData;
+      reactData.bodyHeight = scrollYLoad ? fullData.length * scrollYStore.rowHeight : 0;
+      reactData.topSpaceHeight = scrollYLoad ? Math.max(scrollYStore.startIndex * scrollYStore.rowHeight, 0) : 0;
+    };
+    const handleData = () => {
+      const {
+        scrollYLoad
+      } = reactData;
+      const {
+        fullData,
+        scrollYStore
+      } = internalData;
+      reactData.items = scrollYLoad ? fullData.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullData.slice(0);
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+    };
+    const updateYData = () => {
+      handleData();
+      updateYSpace();
+    };
+    const computeScrollLoad = () => {
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
+        const {
+          scrollYLoad
+        } = reactData;
+        const {
+          scrollYStore
+        } = internalData;
+        const virtualBodyElem = refVirtualBody.value;
+        const sYOpts = computeSYOpts.value;
+        let rowHeight = 0;
+        let firstItemElem;
+        if (virtualBodyElem) {
+          if (sYOpts.sItem) {
+            firstItemElem = virtualBodyElem.querySelector(sYOpts.sItem);
+          }
+          if (!firstItemElem) {
+            firstItemElem = virtualBodyElem.children[0];
+          }
+        }
+        if (firstItemElem) {
+          rowHeight = firstItemElem.offsetHeight;
+        }
+        rowHeight = Math.max(12, rowHeight);
+        scrollYStore.rowHeight = rowHeight;
+        // 计算 Y 逻辑
+        if (scrollYLoad) {
+          const scrollBodyElem = refVirtualWrapper.value;
+          const visibleYSize = Math.max(8, Math.ceil(scrollBodyElem.clientHeight / rowHeight));
+          const offsetYSize = sYOpts.oSize ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(sYOpts.oSize) : browseObj.edge ? 10 : 0;
+          scrollYStore.offsetSize = offsetYSize;
+          scrollYStore.visibleSize = visibleYSize;
+          scrollYStore.endIndex = Math.max(scrollYStore.startIndex + visibleYSize + offsetYSize, scrollYStore.endIndex);
+          updateYData();
+        } else {
+          updateYSpace();
+        }
+      });
+    };
+    /**
+     * 清除滚动条
+     */
+    const clearScroll = () => {
+      const scrollBodyElem = refVirtualWrapper.value;
+      if (scrollBodyElem) {
+        scrollBodyElem.scrollTop = 0;
+      }
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+    };
+    /**
+     * 如果有滚动条，则滚动到对应的位置
+     */
+    const scrollTo = (scrollLeft, scrollTop) => {
+      const scrollBodyElem = refVirtualWrapper.value;
+      if (scrollLeft) {
+        if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(scrollLeft)) {
+          scrollTop = scrollLeft.top;
+          scrollLeft = scrollLeft.left;
+        }
+      }
+      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(scrollLeft)) {
+        scrollBodyElem.scrollLeft = scrollLeft;
+      }
+      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(scrollTop)) {
+        scrollBodyElem.scrollTop = scrollTop;
+      }
+      if (reactData.scrollYLoad) {
+        return new Promise(resolve => {
+          setTimeout(() => {
+            (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+              resolve();
+            });
+          }, 50);
+        });
+      }
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+    };
+    /**
+     * 刷新滚动条
+     */
+    const refreshScroll = () => {
+      const {
+        lastScrollLeft,
+        lastScrollTop
+      } = internalData;
+      return clearScroll().then(() => {
+        if (lastScrollLeft || lastScrollTop) {
+          internalData.lastScrollLeft = 0;
+          internalData.lastScrollTop = 0;
+          return scrollTo(lastScrollLeft, lastScrollTop);
+        }
+      });
+    };
+    /**
+     * 重新计算列表
+     */
+    const recalculate = () => {
+      const el = refElem.value;
+      if (el) {
+        const parentEl = el.parentElement;
+        reactData.parentHeight = parentEl ? parentEl.clientHeight : 0;
+        updateHeight();
+        if (el.clientWidth && el.clientHeight) {
+          return computeScrollLoad();
+        }
+      }
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+    };
+    const loadYData = evnt => {
+      const {
+        scrollYStore
+      } = internalData;
+      const {
+        startIndex,
+        endIndex,
+        visibleSize,
+        offsetSize,
+        rowHeight
+      } = scrollYStore;
+      const scrollBodyElem = evnt.target;
+      const scrollTop = scrollBodyElem.scrollTop;
+      const toVisibleIndex = Math.floor(scrollTop / rowHeight);
+      const offsetStartIndex = Math.max(0, toVisibleIndex - 1 - offsetSize);
+      const offsetEndIndex = toVisibleIndex + visibleSize + offsetSize;
+      if (toVisibleIndex <= startIndex || toVisibleIndex >= endIndex - visibleSize - 1) {
+        if (startIndex !== offsetStartIndex || endIndex !== offsetEndIndex) {
+          scrollYStore.startIndex = offsetStartIndex;
+          scrollYStore.endIndex = offsetEndIndex;
+          updateYData();
+        }
+      }
+    };
+    const scrollEvent = evnt => {
+      const scrollBodyElem = evnt.target;
+      const scrollTop = scrollBodyElem.scrollTop;
+      const scrollLeft = scrollBodyElem.scrollLeft;
+      const isX = scrollLeft !== internalData.lastScrollLeft;
+      const isY = scrollTop !== internalData.lastScrollTop;
+      internalData.lastScrollTop = scrollTop;
+      internalData.lastScrollLeft = scrollLeft;
+      if (reactData.scrollYLoad) {
+        loadYData(evnt);
+      }
+      dispatchEvent('scroll', {
+        scrollLeft,
+        scrollTop,
+        isX,
+        isY
+      }, evnt);
+    };
+    /**
+     * 加载数据
+     * @param {Array} datas 数据
+     */
+    const loadData = datas => {
+      const {
+        scrollYStore
+      } = internalData;
+      const sYOpts = computeSYOpts.value;
+      const fullData = datas || [];
+      Object.assign(scrollYStore, {
+        startIndex: 0,
+        endIndex: 1,
+        visibleSize: 0
+      });
+      internalData.fullData = fullData;
+      // 如果gt为0，则总是启用
+      reactData.scrollYLoad = !!sYOpts.enabled && sYOpts.gt > -1 && (sYOpts.gt === 0 || sYOpts.gt <= fullData.length);
+      handleData();
+      return computeScrollLoad().then(() => {
+        refreshScroll();
+      });
+    };
+    const listMethods = {
+      dispatchEvent,
+      loadData,
+      /**
+       * 重新加载数据
+       * @param {Array} datas 数据
+       */
+      reloadData(datas) {
+        clearScroll();
+        return loadData(datas);
+      },
+      recalculate,
+      scrollTo,
+      refreshScroll,
+      clearScroll
+    };
+    Object.assign($xeList, listMethods);
+    const renderVN = () => {
+      const {
+        className,
+        loading
+      } = props;
+      const {
+        bodyHeight,
+        topSpaceHeight,
+        items
+      } = reactData;
+      const defaultSlot = slots.default;
+      const vSize = computeSize.value;
+      const styles = computeStyles.value;
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        ref: refElem,
+        class: ['vxe-list', className ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(className) ? className({
+          $list: $xeList
+        }) : className : '', {
+          [`size--${vSize}`]: vSize,
+          'is--loading': loading
+        }]
+      }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        ref: refVirtualWrapper,
+        class: 'vxe-list--virtual-wrapper',
+        style: styles,
+        onScroll: scrollEvent
+      }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-list--y-space',
+        style: {
+          height: bodyHeight ? `${bodyHeight}px` : ''
+        }
+      }), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        ref: refVirtualBody,
+        class: 'vxe-list--body',
+        style: {
+          marginTop: topSpaceHeight ? `${topSpaceHeight}px` : ''
+        }
+      }, defaultSlot ? defaultSlot({
+        items,
+        $list: $xeList
+      }) : [])]),
+      /**
+       * 加载中
+       */
+      (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(src_loading, {
+        class: 'vxe-list--loading',
+        modelValue: loading
+      })]);
+    };
+    const dataFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.data ? props.data.length : -1, () => {
+      dataFlag.value++;
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.data, () => {
+      dataFlag.value++;
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(dataFlag, () => {
+      loadData(props.data || []);
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.height, () => {
+      recalculate();
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.maxHeight, () => {
+      recalculate();
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.syncResize, value => {
+      if (value) {
+        recalculate();
+        (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => setTimeout(() => recalculate()));
+      }
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onActivated)(() => {
+      recalculate().then(() => refreshScroll());
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+      loadData(props.data || []);
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
+      recalculate();
+      if (props.autoResize) {
+        const el = refElem.value;
+        const resizeObserver = globalResize.create(() => recalculate());
+        resizeObserver.observe(el);
+        if (el) {
+          resizeObserver.observe(el.parentElement);
+        }
+        internalData.resizeObserver = resizeObserver;
+      }
+      globalEvents.on($xeList, 'resize', recalculate);
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onBeforeUnmount)(() => {
+      const {
+        resizeObserver
+      } = internalData;
+      if (resizeObserver) {
+        resizeObserver.disconnect();
+      }
+      globalEvents.off($xeList, 'resize');
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(reactData, list_createReactData());
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(internalData, list_createInternalData());
+    });
+    $xeList.renderVN = renderVN;
+    return $xeList;
+  },
+  render() {
+    return this.renderVN();
   }
-  return (rowHeight || 28) * expandSize - (prevNode ? 1 : 12);
-}
+}));
 ;// ./packages/number-input/src/util.ts
 
 function handleNumber(val) {
   return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isString(val) ? val.replace(/[^0-9e.-]/g, '') : val;
 }
-function toFloatValueFixed(inputValue, digitsValue, roundingMode) {
-  if (!roundingMode || roundingMode === 'default') {
+function toFloatValueFixed(inputValue, type, digitsValue, roundingMode) {
+  if (type !== 'integer' && (!roundingMode || roundingMode === 'default')) {
     // 默认截取忽略
     if (/^-/.test('' + inputValue)) {
       return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toFixed(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().ceil(inputValue, digitsValue), digitsValue);
@@ -12730,7 +13154,7 @@ function toFloatValueFixed(inputValue, digitsValue, roundingMode) {
       } = props;
       const inpMaxLength = computeInpMaxLength.value;
       const digitsValue = computeDigitsValue.value;
-      const restVal = type === 'float' ? toFloatValueFixed(val, digitsValue, '') : external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toValueString(val);
+      const restVal = type === 'float' ? toFloatValueFixed(val, type, digitsValue, '') : external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toValueString(val);
       if (exponential && (val === restVal || external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toValueString(val).toLowerCase() === external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(restVal).toExponential())) {
         return val;
       }
@@ -12955,7 +13379,7 @@ function toFloatValueFixed(inputValue, digitsValue, roundingMode) {
         changeValue();
       } else if (type === 'float') {
         if (inputValue) {
-          const validValue = toFloatValueFixed(inputValue, digitsValue, '');
+          const validValue = toFloatValueFixed(inputValue, type, digitsValue, '');
           if (inputValue !== validValue) {
             handleChange(validValue, {
               type: 'init'
@@ -14741,14 +15165,51 @@ function toFloatValueFixed(inputValue, digitsValue, roundingMode) {
 
 
 
-function getOptUniqueId() {
+
+
+
+/**
+ * 生成节点的唯一主键
+ */
+function getNodeUniqueId() {
   return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId('node_');
 }
+function cascader_createReactData() {
+  return {
+    initialized: false,
+    searchValue: '',
+    searchLoading: false,
+    currentCunkList: [],
+    currentItems: [],
+    currentNode: null,
+    panelIndex: 0,
+    panelStyle: {},
+    panelPlacement: null,
+    triggerFocusPanel: false,
+    visiblePanel: false,
+    isAniVisible: false,
+    isActivated: false,
+    selectRadioKey: null,
+    treeList: [],
+    updateExpandedFlag: 1,
+    updateCheckboxFlag: 1,
+    fullOptFlag: 1,
+    lazyOptFlag: 1
+  };
+}
 function cascader_createInternalData() {
   return {
     // hpTimeout: undefined,
-    fullOptionList: [],
-    fullNodeMaps: {}
+    afterTreeList: [],
+    treeFullData: [],
+    afterVisibleList: [],
+    nodeMaps: {},
+    fullNodeMaps: {},
+    lazyNodeMaps: {},
+    indeterminateRowMaps: {},
+    selectCheckboxMaps: {},
+    treeExpandedMaps: {},
+    treeExpandLazyLoadedMaps: {}
   };
 }
 /* harmony default export */ var cascader = (defineVxeComponent({
@@ -14771,25 +15232,41 @@ function cascader_createInternalData() {
     },
     filterable: Boolean,
     filterConfig: Object,
+    showFullLabel: {
+      type: Boolean,
+      default: getConfig().cascader.showFullLabel
+    },
+    separator: {
+      type: String,
+      default: getConfig().cascader.separator
+    },
     multiple: Boolean,
     className: [String, Function],
     prefixIcon: String,
-    placement: String,
-    transform: Boolean,
     lazyOptions: Array,
     options: Array,
     optionProps: Object,
-    zIndex: Number,
     size: {
       type: String,
       default: () => getConfig().cascader.size || getConfig().size
     },
+    treeConfig: Object,
+    radioConfig: Object,
+    checkboxConfig: Object,
     remote: Boolean,
     remoteConfig: Function,
     popupConfig: Object,
-    autoClose: {
+    checkedClosable: {
       type: Boolean,
-      default: () => getConfig().cascader.autoClose
+      default: () => getConfig().cascader.checkedClosable
+    },
+    clearClosable: {
+      type: Boolean,
+      default: () => getConfig().cascader.clearClosable
+    },
+    showCloseButton: {
+      type: Boolean,
+      default: () => getConfig().cascader.showCloseButton
     },
     showTotalButton: {
       type: Boolean,
@@ -14802,18 +15279,9 @@ function cascader_createInternalData() {
     showClearButton: {
       type: Boolean,
       default: () => getConfig().cascader.showClearButton
-    },
-    transfer: {
-      type: Boolean,
-      default: null
-    },
-    /**
-     * 已废弃，被 remote-config.queryMethod 替换
-     * @deprecated
-     */
-    remoteMethod: Function
+    }
   },
-  emits: ['update:modelValue', 'change', 'all-change', 'clear', 'blur', 'focus', 'click', 'node-click'],
+  emits: ['update:modelValue', 'change', 'all-change', 'clear', 'blur', 'focus', 'click', 'node-click', 'node-expand', 'current-change', 'radio-change', 'checkbox-change', 'load-success', 'load-error', 'visible-change'],
   setup(props, context) {
     const {
       emit,
@@ -14831,21 +15299,9 @@ function cascader_createInternalData() {
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refInput = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refInpSearch = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const refTreeWrapper = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
+    const refChunkWrapper = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refOptionPanel = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const refTree = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({
-      initialized: false,
-      searchValue: '',
-      searchLoading: false,
-      panelIndex: 0,
-      panelStyle: {},
-      panelPlacement: null,
-      triggerFocusPanel: false,
-      visiblePanel: false,
-      isAniVisible: false,
-      isActivated: false
-    });
+    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(cascader_createReactData());
     const internalData = cascader_createInternalData();
     const refMaps = {
       refElem
@@ -14875,19 +15331,26 @@ function cascader_createInternalData() {
       return disabled;
     });
     const computeBtnTransfer = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const popupOpts = computePopupOpts.value;
       const {
         transfer
-      } = props;
-      if (transfer === null) {
-        const globalTransfer = getConfig().select.transfer;
-        if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(globalTransfer)) {
-          return globalTransfer;
-        }
-        if ($xeTable || $xeModal || $xeDrawer || $xeForm) {
-          return true;
-        }
+      } = popupOpts;
+      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(transfer)) {
+        return transfer;
       }
-      return transfer;
+      if ($xeTable || $xeModal || $xeDrawer || $xeForm) {
+        return true;
+      }
+      return false;
+    });
+    const computeTreeOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      return Object.assign({}, getConfig().cascader.treeConfig, props.treeConfig);
+    });
+    const computeRadioOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      return Object.assign({}, getConfig().cascader.radioConfig, props.radioConfig);
+    });
+    const computeCheckboxOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      return Object.assign({}, getConfig().cascader.checkboxConfig, props.checkboxConfig);
     });
     const computePopupOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       return Object.assign({}, getConfig().cascader.popupConfig, props.popupConfig);
@@ -14895,10 +15358,6 @@ function cascader_createInternalData() {
     const computePropsOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       return props.optionProps || {};
     });
-    const computeNodeKeyField = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
-      const valueField = computeValueField.value;
-      return valueField;
-    });
     const computeLabelField = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       const propsOpts = computePropsOpts.value;
       return propsOpts.label || 'label';
@@ -14907,54 +15366,92 @@ function cascader_createInternalData() {
       const propsOpts = computePropsOpts.value;
       return propsOpts.value || 'value';
     });
+    const computeKeyField = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const treeOpts = computeTreeOpts.value;
+      return treeOpts.keyField || 'id';
+    });
+    const computeParentField = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const treeOpts = computeTreeOpts.value;
+      return treeOpts.parentField || 'parentId';
+    });
     const computeChildrenField = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
-      const propsOpts = computePropsOpts.value;
-      return propsOpts.children || 'children';
+      const treeOpts = computeTreeOpts.value;
+      return treeOpts.childrenField || 'children';
+    });
+    const computeMapChildrenField = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const treeOpts = computeTreeOpts.value;
+      return treeOpts.mapChildrenField || 'mapChildren';
+    });
+    const computeHasChildField = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const treeOpts = computeTreeOpts.value;
+      return treeOpts.hasChildField || 'hasChild';
     });
     const computeRemoteOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       return Object.assign({}, getConfig().cascader.remoteConfig, props.remoteConfig);
     });
+    const computeSelectVals = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const {
+        modelValue
+      } = props;
+      return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(modelValue) ? [] : external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(modelValue) ? modelValue : [modelValue];
+    });
     const computeSelectLabel = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       const {
-        modelValue,
-        lazyOptions
+        showFullLabel
       } = props;
       const {
-        fullNodeMaps
+        fullOptFlag,
+        lazyOptFlag
+      } = reactData;
+      const {
+        fullNodeMaps,
+        lazyNodeMaps
       } = internalData;
-      const valueField = computeValueField.value;
       const labelField = computeLabelField.value;
-      const selectVals = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(modelValue) ? [] : external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(modelValue) ? modelValue : [modelValue];
+      const selectVals = computeSelectVals.value;
       return selectVals.map(val => {
         const cacheItem = fullNodeMaps[val];
-        if (cacheItem) {
-          return cacheItem.item[labelField];
+        if (fullOptFlag && cacheItem) {
+          return showFullLabel ? cacheItem.fullLabel : cacheItem.item[labelField];
         }
-        if (lazyOptions) {
-          const lazyItem = lazyOptions.find(item => item[valueField] === val);
-          if (lazyItem) {
-            return lazyItem[labelField];
+        if (lazyOptFlag) {
+          const lazyCacheItem = lazyNodeMaps[val];
+          if (lazyCacheItem) {
+            return showFullLabel ? lazyCacheItem.fullLabel : lazyCacheItem.item[labelField];
           }
         }
         return val;
       }).join(', ');
     });
     const computePopupWrapperStyle = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const {
+        currentCunkList,
+        panelStyle
+      } = reactData;
       const popupOpts = computePopupOpts.value;
       const {
         height,
-        width
+        nodeWidth,
+        nodeHeight
       } = popupOpts;
-      const stys = {};
-      if (width) {
-        stys.width = toCssUnit(width);
-      }
+      const stys = {
+        ...panelStyle,
+        '--vxe-ui-cascader-chunk-size': currentCunkList.length
+      };
       if (height) {
-        stys.height = toCssUnit(height);
-        stys.maxHeight = toCssUnit(height);
+        stys['--vxe-ui-cascader-chunk-height'] = toCssUnit(height);
+      }
+      if (nodeWidth) {
+        stys['--vxe-ui-cascader-node-width'] = toCssUnit(nodeWidth);
+      }
+      if (nodeHeight) {
+        stys['--vxe-ui-cascader-node-height'] = toCssUnit(nodeHeight);
       }
       return stys;
     });
+    const computeFilterOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      return Object.assign({}, getConfig().cascader.filterConfig, props.filterConfig);
+    });
     const computeMaps = {};
     const $xeCascader = {
       xID,
@@ -14976,60 +15473,388 @@ function cascader_createInternalData() {
     const cascaderMethods = {
       dispatchEvent
     };
-    const getNodeid = option => {
-      const nodeKeyField = computeNodeKeyField.value;
-      const nodeid = option[nodeKeyField];
-      return nodeid ? encodeURIComponent(nodeid) : '';
+    const getNodeId = node => {
+      if (!node) {
+        return '';
+      }
+      const valueField = computeValueField.value;
+      const nodeKey = node[valueField];
+      return enNodeValue(nodeKey);
     };
-    const cacheDataMap = () => {
+    const isCheckedByCheckboxNodeId = nodeid => {
       const {
-        transform,
-        options
-      } = props;
-      const nodeKeyField = computeNodeKeyField.value;
+        updateCheckboxFlag
+      } = reactData;
+      const {
+        selectCheckboxMaps
+      } = internalData;
+      return !!(updateCheckboxFlag && selectCheckboxMaps[nodeid]);
+    };
+    const handleCheckedCheckboxNode = (nodeList, checked) => {
+      const {
+        selectCheckboxMaps
+      } = internalData;
+      const mapChildrenField = computeMapChildrenField.value;
       const childrenField = computeChildrenField.value;
+      const checkboxOpts = computeCheckboxOpts.value;
+      const {
+        checkStrictly
+      } = checkboxOpts;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        transform
+      } = treeOpts;
+      const handleSelect = node => {
+        const nodeid = getNodeId(node);
+        if (checked) {
+          if (!selectCheckboxMaps[nodeid]) {
+            selectCheckboxMaps[nodeid] = node;
+          }
+        } else {
+          if (selectCheckboxMaps[nodeid]) {
+            delete selectCheckboxMaps[nodeid];
+          }
+        }
+      };
+      if (checkStrictly) {
+        nodeList.forEach(handleSelect);
+      } else {
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(nodeList, handleSelect, {
+          children: transform ? mapChildrenField : childrenField
+        });
+      }
+      reactData.updateCheckboxFlag++;
+      updateCheckboxStatus();
+    };
+    const createNode = records => {
       const valueField = computeValueField.value;
-      const nodeMaps = {};
-      const keyMaps = {};
-      const handleOptNode = (item, index, items, path, parent, nodes) => {
-        let nodeid = getNodeid(item);
+      return Promise.resolve(records.map(obj => {
+        const item = {
+          ...obj
+        };
+        let nodeid = getNodeId(item);
         if (!nodeid) {
-          nodeid = getOptUniqueId();
-        }
-        if (keyMaps[nodeid]) {
-          errLog('vxe.error.repeatKey', [`[tree-select] ${nodeKeyField}`, nodeid]);
+          nodeid = getNodeUniqueId();
+          external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(item, valueField, nodeid);
         }
-        keyMaps[nodeid] = true;
-        const value = item[valueField];
-        if (nodeMaps[value]) {
-          errLog('vxe.error.repeatKey', [`[tree-select] ${valueField}`, value]);
+        return item;
+      }));
+    };
+    const cacheNodeMap = () => {
+      const {
+        separator
+      } = props;
+      const {
+        treeFullData
+      } = internalData;
+      const valueField = computeValueField.value;
+      const labelField = computeLabelField.value;
+      const childrenField = computeChildrenField.value;
+      const keyMaps = {};
+      const fullMaps = {};
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(treeFullData, (item, index, items, path, parenItem, nodes) => {
+        let nodeid = getNodeId(item);
+        if (!nodeid) {
+          nodeid = getNodeUniqueId();
+          item[valueField] = nodeid;
         }
-        nodeMaps[value] = {
+        const nodeVal = item[valueField];
+        const itemRest = {
           item,
           index,
+          $index: -1,
+          _index: -1,
           items,
-          parent,
-          nodes
+          parent: parenItem,
+          nodes,
+          level: nodes.length - 1,
+          treeIndex: index,
+          lineCount: 0,
+          treeLoaded: false,
+          fullLabel: nodes.map(item => item[labelField]).join(separator || ' / ')
         };
-      };
-      if (options) {
+        keyMaps[nodeid] = itemRest;
+        fullMaps[nodeVal] = itemRest;
+      }, {
+        children: childrenField
+      });
+      internalData.nodeMaps = keyMaps;
+      internalData.fullNodeMaps = fullMaps;
+      reactData.fullOptFlag++;
+    };
+    const updateAfterDataIndex = () => {
+      const {
+        separator
+      } = props;
+      const {
+        afterTreeList,
+        nodeMaps
+      } = internalData;
+      const labelField = computeLabelField.value;
+      const childrenField = computeChildrenField.value;
+      const mapChildrenField = computeMapChildrenField.value;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        transform
+      } = treeOpts;
+      let vtIndex = 0;
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterTreeList, (item, index, items, path, parenItem, nodes) => {
+        const nodeid = getNodeId(item);
+        const nodeItem = nodeMaps[nodeid];
+        if (nodeItem) {
+          nodeItem.items = items;
+          nodeItem.treeIndex = index;
+          nodeItem._index = vtIndex;
+        } else {
+          const rest = {
+            item,
+            index,
+            $index: -1,
+            _index: vtIndex,
+            items,
+            parent: parenItem,
+            nodes,
+            level: nodes.length - 1,
+            treeIndex: index,
+            lineCount: 0,
+            treeLoaded: false,
+            fullLabel: nodes.map(item => item[labelField]).join(separator || ' / ')
+          };
+          nodeMaps[nodeid] = rest;
+        }
+        vtIndex++;
+      }, {
+        children: transform ? mapChildrenField : childrenField
+      });
+    };
+    const updateAfterFullData = () => {
+      const {
+        searchValue
+      } = reactData;
+      const {
+        treeFullData,
+        lastFilterValue
+      } = internalData;
+      const labelField = computeLabelField.value;
+      const childrenField = computeChildrenField.value;
+      const mapChildrenField = computeMapChildrenField.value;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        transform
+      } = treeOpts;
+      const filterOpts = computeFilterOpts.value;
+      const {
+        beforeFilterMethod,
+        filterMethod,
+        afterFilterMethod
+      } = filterOpts;
+      let fullList = treeFullData;
+      let treeList = fullList;
+      let filterStr = '';
+      if (searchValue) {
+        filterStr = `${searchValue}`;
+        const handleSearch = filterMethod ? item => {
+          return filterMethod({
+            $cascader: $xeCascader,
+            node: item,
+            filterValue: filterStr
+          });
+        } : item => {
+          return String(item[labelField]).toLowerCase().indexOf(filterStr.toLowerCase()) > -1;
+        };
+        const bafParams = {
+          $cascader: $xeCascader,
+          filterValue: filterStr
+        };
+        if (beforeFilterMethod) {
+          beforeFilterMethod(bafParams);
+        }
         if (transform) {
-          options.forEach((item, index, items) => {
-            handleOptNode(item, index, items, [], null, []);
+          treeList = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().searchTree(treeFullData, handleSearch, {
+            original: true,
+            isEvery: true,
+            children: childrenField,
+            mapChildren: mapChildrenField
           });
+          fullList = treeList;
         } else {
-          external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(options, handleOptNode, {
-            children: childrenField
+          fullList = treeFullData.filter(handleSearch);
+        }
+        internalData.lastFilterValue = filterStr;
+        (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+          if (afterFilterMethod) {
+            afterFilterMethod(bafParams);
+          }
+        });
+      } else {
+        if (transform) {
+          treeList = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().searchTree(treeFullData, () => true, {
+            original: true,
+            isEvery: true,
+            children: childrenField,
+            mapChildren: mapChildrenField
           });
+          fullList = treeList;
+          if (lastFilterValue) {
+            const bafParams = {
+              $cascader: $xeCascader,
+              filterValue: filterStr
+            };
+            if (beforeFilterMethod) {
+              beforeFilterMethod(bafParams);
+            }
+            // 取消筛选时自动收起
+            (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+              if (afterFilterMethod) {
+                afterFilterMethod(bafParams);
+              }
+            });
+          }
         }
+        internalData.lastFilterValue = '';
       }
-      internalData.fullOptionList = options || [];
-      internalData.fullNodeMaps = nodeMaps;
+      internalData.afterVisibleList = fullList;
+      internalData.afterTreeList = treeList;
+      updateAfterDataIndex();
+    };
+    /**
+     * 如果为虚拟树、则将树结构拍平
+     */
+    const handleTreeToList = () => {
+      const {
+        afterTreeList,
+        treeExpandedMaps
+      } = internalData;
+      const mapChildrenField = computeMapChildrenField.value;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        transform
+      } = treeOpts;
+      const expandMaps = {};
+      if (transform) {
+        const fullData = [];
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterTreeList, (item, index, items, path, parentRow) => {
+          const nodeid = getNodeId(item);
+          const parentNodeid = getNodeId(parentRow);
+          if (!parentRow || expandMaps[parentNodeid] && treeExpandedMaps[parentNodeid]) {
+            expandMaps[nodeid] = 1;
+            fullData.push(item);
+          }
+        }, {
+          children: mapChildrenField
+        });
+        internalData.afterVisibleList = fullData;
+        return fullData;
+      }
+      return internalData.afterVisibleList;
+    };
+    const handleData = force => {
+      const {
+        nodeMaps
+      } = internalData;
+      let fullList = internalData.afterVisibleList;
+      if (force) {
+        // 更新数据，处理筛选和排序
+        updateAfterFullData();
+        // 如果为虚拟树，将树结构拍平
+        fullList = handleTreeToList();
+      }
+      const treeList = fullList.slice(0);
+      treeList.forEach((item, $index) => {
+        const nodeid = getNodeId(item);
+        const itemRest = nodeMaps[nodeid];
+        if (itemRest) {
+          itemRest.$index = $index;
+        }
+      });
+      reactData.treeList = treeList;
+    };
+    const triggerSearchEvent = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().debounce(() => handleData(true), 350, {
+      trailing: true
+    });
+    const loadData = list => {
+      const treeOpts = computeTreeOpts.value;
+      const keyField = computeKeyField.value;
+      const parentField = computeParentField.value;
+      const childrenField = computeChildrenField.value;
+      const {
+        rootParentValue,
+        rootValues
+      } = treeOpts;
+      const {
+        transform
+      } = treeOpts;
+      const fullData = transform ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toArrayTree(list, {
+        key: keyField,
+        parentKey: parentField,
+        mapChildren: childrenField,
+        rootParentValue,
+        rootValues
+      }) : list ? list.slice(0) : [];
+      internalData.treeFullData = fullData;
+      cacheNodeMap();
+      handleData(true);
+      handleCurrentItems();
+      updateCurrentChunk();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+    };
+    const updateCurrentChunk = () => {
+      const {
+        currentItems
+      } = reactData;
+      const {
+        treeFullData
+      } = internalData;
+      const childrenField = computeChildrenField.value;
+      const currentCunkList = [treeFullData];
+      if (currentItems.length) {
+        let chunkIndex = 0;
+        let stNodeid = currentItems[chunkIndex];
+        let optList = treeFullData;
+        while (stNodeid && optList && optList.length) {
+          stNodeid = currentItems[chunkIndex++];
+          const currOption = optList.find(item => stNodeid === getNodeId(item));
+          optList = currOption ? currOption[childrenField] : [];
+          if (!optList || !optList.length) {
+            break;
+          }
+          currentCunkList.push(optList);
+        }
+      }
+      reactData.currentCunkList = currentCunkList;
+    };
+    const handleCurrentItems = () => {
+      const {
+        treeFullData
+      } = internalData;
+      const selectVals = computeSelectVals.value;
+      const childrenField = computeChildrenField.value;
+      const stItems = [];
+      const expandedMaps = {};
+      if (selectVals.length) {
+        const lastVal = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().last(selectVals);
+        const stRest = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().findTree(treeFullData, item => lastVal === getNodeId(item), {
+          children: childrenField
+        });
+        if (stRest) {
+          const {
+            nodes
+          } = stRest;
+          nodes.forEach(item => {
+            const nodeid = getNodeId(item);
+            expandedMaps[nodeid] = true;
+            stItems.push(nodeid);
+          });
+        }
+      }
+      internalData.treeExpandedMaps = expandedMaps;
+      reactData.currentItems = stItems;
     };
     const updateZindex = () => {
+      const popupOpts = computePopupOpts.value;
       const {
         zIndex
-      } = props;
+      } = popupOpts;
       if (zIndex) {
         reactData.panelIndex = zIndex;
       } else if (reactData.panelIndex < getLastZIndex()) {
@@ -15037,9 +15862,6 @@ function cascader_createInternalData() {
       }
     };
     const updatePlacement = () => {
-      const {
-        placement
-      } = props;
       const {
         panelIndex
       } = reactData;
@@ -15049,9 +15871,10 @@ function cascader_createInternalData() {
       const popupOpts = computePopupOpts.value;
       const handleStyle = () => {
         const ppObj = updatePanelPlacement(targetElem, panelElem, {
-          placement: popupOpts.placement || placement,
+          placement: popupOpts.placement,
           defaultPlacement: popupOpts.defaultPlacement,
-          teleportTo: btnTransfer
+          teleportTo: btnTransfer,
+          isMinWidth: false
         });
         const panelStyle = Object.assign(ppObj.style, {
           zIndex: panelIndex
@@ -15062,14 +15885,14 @@ function cascader_createInternalData() {
       handleStyle();
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
-    const showOptionPanel = () => {
+    const showOptionPanel = evnt => {
       const {
         loading,
         remote,
         filterable
       } = props;
       const {
-        fullOptionList
+        treeFullData
       } = internalData;
       const isDisabled = computeIsDisabled.value;
       const remoteOpts = computeRemoteOpts.value;
@@ -15081,7 +15904,7 @@ function cascader_createInternalData() {
         reactData.isActivated = true;
         reactData.isAniVisible = true;
         if (filterable) {
-          if (remote && remoteOpts.enabled && remoteOpts.autoLoad && !fullOptionList.length) {
+          if (remote && remoteOpts.enabled && remoteOpts.autoLoad && !treeFullData.length) {
             handleSearchEvent();
           }
         }
@@ -15091,13 +15914,66 @@ function cascader_createInternalData() {
         }, 10);
         updateZindex();
         updatePlacement();
+        dispatchEvent('visible-change', {
+          visible: true
+        }, evnt || null);
       }
     };
-    const hideOptionPanel = () => {
+    const hideOptionPanel = evnt => {
       reactData.visiblePanel = false;
       internalData.hpTimeout = setTimeout(() => {
         reactData.isAniVisible = false;
       }, 350);
+      dispatchEvent('visible-change', {
+        visible: false
+      }, evnt || null);
+    };
+    const setCurrentNode = node => {
+      reactData.currentNode = node;
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+    };
+    const setAllCheckboxNode = checked => {
+      const selectMaps = {};
+      const childrenField = computeChildrenField.value;
+      const mapChildrenField = computeMapChildrenField.value;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        transform
+      } = treeOpts;
+      const checkKeys = [];
+      const checkNodes = [];
+      if (checked) {
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(internalData.afterTreeList, node => {
+          const nodeid = getNodeId(node);
+          checkKeys.push(nodeid);
+          checkNodes.push(node);
+          selectMaps[nodeid] = true;
+        }, {
+          children: transform ? mapChildrenField : childrenField
+        });
+      }
+      internalData.indeterminateRowMaps = {};
+      internalData.selectCheckboxMaps = selectMaps;
+      reactData.updateCheckboxFlag++;
+      updateCheckboxStatus();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
+        return {
+          checkNodeKeys: checkKeys,
+          checkNodes
+        };
+      });
+    };
+    const clearCheckboxNode = () => {
+      internalData.indeterminateRowMaps = {};
+      internalData.selectCheckboxMaps = {};
+      reactData.updateCheckboxFlag++;
+      updateCheckboxStatus();
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
+        return {
+          checkNodeKeys: [],
+          checkNodes: []
+        };
+      });
     };
     const changeEvent = (evnt, selectValue, node) => {
       const value = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(selectValue) ? selectValue.map(deNodeValue) : deNodeValue(selectValue);
@@ -15122,7 +15998,7 @@ function cascader_createInternalData() {
     };
     const clearEvent = (params, evnt) => {
       clearValueEvent(evnt, null);
-      hideOptionPanel();
+      hideOptionPanel(evnt);
     };
     const allCheckedPanelEvent = params => {
       const {
@@ -15130,120 +16006,544 @@ function cascader_createInternalData() {
       } = params;
       const {
         multiple,
-        autoClose
+        checkedClosable
       } = props;
-      const $tree = refTree.value;
       if (multiple) {
-        if ($tree) {
-          $tree.setAllCheckboxNode(true).then(({
-            checkNodeKeys,
-            checkNodes
-          }) => {
-            changeEvent($event, checkNodeKeys, checkNodes[0]);
-            dispatchEvent('all-change', {
-              value: checkNodeKeys
-            }, $event);
-            if (autoClose) {
-              hideOptionPanel();
+        setAllCheckboxNode(true).then(({
+          checkNodeKeys,
+          checkNodes
+        }) => {
+          changeEvent($event, checkNodeKeys, checkNodes[0]);
+          dispatchEvent('all-change', {
+            value: checkNodeKeys
+          }, $event);
+          if (checkedClosable) {
+            hideOptionPanel($event);
+          }
+        });
+      }
+    };
+    const clearCheckedPanelEvent = params => {
+      const {
+        $event
+      } = params;
+      const {
+        multiple,
+        checkedClosable
+      } = props;
+      const value = multiple ? [] : null;
+      clearCheckboxNode().then(() => {
+        if (checkedClosable) {
+          hideOptionPanel($event);
+        }
+      });
+      changeEvent($event, value, null);
+      dispatchEvent('clear', {
+        value
+      }, $event);
+    };
+    const closePanelEvent = params => {
+      const {
+        $event
+      } = params;
+      hideOptionPanel($event);
+    };
+    const handleGlobalMousewheelEvent = evnt => {
+      const {
+        visiblePanel
+      } = reactData;
+      const isDisabled = computeIsDisabled.value;
+      if (!isDisabled) {
+        if (visiblePanel) {
+          const panelElem = refOptionPanel.value;
+          if (getEventTargetNode(evnt, panelElem).flag) {
+            updatePlacement();
+          } else {
+            hideOptionPanel(evnt);
+          }
+        }
+      }
+    };
+    const handleGlobalMousedownEvent = evnt => {
+      const {
+        visiblePanel
+      } = reactData;
+      const isDisabled = computeIsDisabled.value;
+      if (!isDisabled) {
+        const el = refElem.value;
+        const panelElem = refOptionPanel.value;
+        reactData.isActivated = getEventTargetNode(evnt, el).flag || getEventTargetNode(evnt, panelElem).flag;
+        if (visiblePanel && !reactData.isActivated) {
+          hideOptionPanel(evnt);
+        }
+      }
+    };
+    const handleGlobalBlurEvent = evnt => {
+      const {
+        visiblePanel,
+        isActivated
+      } = reactData;
+      if (visiblePanel) {
+        hideOptionPanel(evnt);
+      }
+      if (isActivated) {
+        reactData.isActivated = false;
+      }
+      if (visiblePanel || isActivated) {
+        const $input = refInput.value;
+        if ($input) {
+          $input.blur();
+        }
+      }
+    };
+    const handleGlobalResizeEvent = () => {
+      const {
+        visiblePanel
+      } = reactData;
+      if (visiblePanel) {
+        updatePlacement();
+      }
+    };
+    const handleFocusSearch = () => {
+      if (props.filterable) {
+        (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
+          const inpSearch = refInpSearch.value;
+          if (inpSearch) {
+            inpSearch.focus();
+          }
+        });
+      }
+    };
+    const changeCurrentEvent = (evnt, node) => {
+      evnt.preventDefault();
+      const isChecked = true;
+      reactData.currentNode = node;
+      dispatchEvent('current-change', {
+        node,
+        checked: isChecked
+      }, evnt);
+    };
+    const changeRadioEvent = (evnt, node) => {
+      evnt.preventDefault();
+      evnt.stopPropagation();
+      const {
+        nodeMaps
+      } = internalData;
+      const radioOpts = computeRadioOpts.value;
+      const childrenField = computeChildrenField.value;
+      const {
+        checkMode,
+        checkMethod
+      } = radioOpts;
+      const nodeid = getNodeId(node);
+      const childList = node[childrenField];
+      const isExistChild = childList && childList.length > 0;
+      const nodeItem = nodeMaps[nodeid] || {};
+      const nLevel = nodeItem.level;
+      const isDisabled = checkMethod ? !checkMethod({
+        $cascader: $xeCascader,
+        node
+      }) : !handleVisibleOrCheckMode(checkMode, isExistChild, nLevel);
+      if (isDisabled) {
+        return;
+      }
+      const value = nodeid;
+      reactData.selectRadioKey = value;
+      changeEvent(evnt, value, node);
+      hideOptionPanel(evnt);
+    };
+    const handleAsyncTreeExpandChilds = node => {
+      const checkboxOpts = computeCheckboxOpts.value;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        loadMethod
+      } = treeOpts;
+      const {
+        checkStrictly
+      } = checkboxOpts;
+      return new Promise(resolve => {
+        if (loadMethod) {
+          const {
+            nodeMaps
+          } = internalData;
+          const nodeid = getNodeId(node);
+          const nodeItem = nodeMaps[nodeid];
+          internalData.treeExpandLazyLoadedMaps[nodeid] = true;
+          Promise.resolve(loadMethod({
+            $cascader: $xeCascader,
+            node
+          })).then(childRecords => {
+            const {
+              treeExpandLazyLoadedMaps
+            } = internalData;
+            nodeItem.treeLoaded = true;
+            if (treeExpandLazyLoadedMaps[nodeid]) {
+              treeExpandLazyLoadedMaps[nodeid] = false;
             }
+            if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(childRecords)) {
+              childRecords = [];
+            }
+            if (childRecords) {
+              return $xeCascader.loadChildrenNode(node, childRecords).then(childRows => {
+                const {
+                  treeExpandedMaps
+                } = internalData;
+                if (childRows.length && !treeExpandedMaps[nodeid]) {
+                  treeExpandedMaps[nodeid] = true;
+                }
+                reactData.updateExpandedFlag++;
+                // 如果当前节点已选中，则展开后子节点也被选中
+                if (!checkStrictly && $xeCascader.isCheckedByCheckboxNodeId(nodeid)) {
+                  handleCheckedCheckboxNode(childRows, true);
+                }
+                dispatchEvent('load-success', {
+                  node,
+                  data: childRecords
+                }, new Event('load-success'));
+                return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+              });
+            } else {
+              dispatchEvent('load-success', {
+                node,
+                data: childRecords
+              }, new Event('load-success'));
+            }
+          }).catch(e => {
+            const {
+              treeExpandLazyLoadedMaps
+            } = internalData;
+            nodeItem.treeLoaded = false;
+            if (treeExpandLazyLoadedMaps[nodeid]) {
+              treeExpandLazyLoadedMaps[nodeid] = false;
+            }
+            dispatchEvent('load-error', {
+              node,
+              data: e
+            }, new Event('load-error'));
+          }).finally(() => {
+            handleTreeToList();
+            handleData();
           });
+        } else {
+          resolve();
         }
+      });
+    };
+    /**
+     * 展开与收起树节点
+     * @param nodeList
+     * @param expanded
+     * @returns
+     */
+    const handleBaseTreeExpand = (nodeList, expanded) => {
+      const {
+        treeExpandLazyLoadedMaps,
+        treeExpandedMaps
+      } = internalData;
+      const {
+        nodeMaps
+      } = internalData;
+      const childrenField = computeChildrenField.value;
+      const hasChildField = computeHasChildField.value;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        lazy,
+        toggleMethod
+      } = treeOpts;
+      const result = [];
+      let validNodes = toggleMethod ? nodeList.filter(node => toggleMethod({
+        $cascader: $xeCascader,
+        expanded,
+        node
+      })) : nodeList;
+      validNodes = validNodes.length ? [validNodes[validNodes.length - 1]] : [];
+      // 同一级只能展开一个
+      const nodeid = getNodeId(validNodes[0]);
+      const nodeItem = nodeMaps[nodeid];
+      if (nodeItem) {
+        nodeItem.items.forEach(item => {
+          const itemNodeId = getNodeId(item);
+          if (treeExpandedMaps[itemNodeId]) {
+            delete treeExpandedMaps[itemNodeId];
+          }
+        });
+      }
+      const expandNodes = [];
+      if (expanded) {
+        validNodes.forEach(item => {
+          const itemNodeId = getNodeId(item);
+          if (!treeExpandedMaps[itemNodeId]) {
+            const nodeItem = nodeMaps[itemNodeId];
+            const isLoad = lazy && item[hasChildField] && !nodeItem.treeLoaded && !treeExpandLazyLoadedMaps[itemNodeId];
+            // 是否使用懒加载
+            if (isLoad) {
+              result.push(handleAsyncTreeExpandChilds(item));
+            } else {
+              if (item[childrenField] && item[childrenField].length) {
+                treeExpandedMaps[itemNodeId] = true;
+                expandNodes.push(item);
+              }
+            }
+          }
+        });
+      } else {
+        validNodes.forEach(item => {
+          const itemNodeId = getNodeId(item);
+          if (treeExpandedMaps[itemNodeId]) {
+            delete treeExpandedMaps[itemNodeId];
+            expandNodes.push(item);
+          }
+        });
       }
+      reactData.updateExpandedFlag++;
+      handleTreeToList();
+      handleData();
+      return Promise.all(result);
     };
-    const clearCheckedPanelEvent = params => {
+    const toggleExpandEvent = (evnt, node, chunks, chunkIndex) => {
       const {
-        $event
-      } = params;
+        currentItems
+      } = reactData;
       const {
-        multiple,
-        autoClose
-      } = props;
-      const $tree = refTree.value;
-      if ($tree) {
-        const value = multiple ? [] : null;
-        $tree.clearCheckboxNode().then(() => {
-          if (autoClose) {
-            hideOptionPanel();
-          }
-        });
-        changeEvent($event, value, null);
-        dispatchEvent('clear', {
-          value
-        }, $event);
+        treeExpandLazyLoadedMaps
+      } = internalData;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        lazy
+      } = treeOpts;
+      const stItems = currentItems.slice(0, chunkIndex);
+      const nodeid = getNodeId(node);
+      const expanded = true;
+      evnt.stopPropagation();
+      stItems.push(nodeid);
+      reactData.currentItems = stItems;
+      if (!lazy || !treeExpandLazyLoadedMaps[nodeid]) {
+        handleBaseTreeExpand([node], expanded);
       }
+      setCurrentNode(node);
+      updateCurrentChunk();
+      dispatchEvent('node-expand', {
+        node,
+        expanded
+      }, evnt);
     };
-    const handleGlobalMousewheelEvent = evnt => {
+    const updateCheckboxStatus = () => {
       const {
-        visiblePanel
-      } = reactData;
-      const isDisabled = computeIsDisabled.value;
-      if (!isDisabled) {
-        if (visiblePanel) {
-          const panelElem = refOptionPanel.value;
-          if (getEventTargetNode(evnt, panelElem).flag) {
-            updatePlacement();
+        selectCheckboxMaps,
+        indeterminateRowMaps,
+        afterTreeList
+      } = internalData;
+      const childrenField = computeChildrenField.value;
+      const mapChildrenField = computeMapChildrenField.value;
+      const checkboxOpts = computeCheckboxOpts.value;
+      const {
+        checkStrictly,
+        checkMethod
+      } = checkboxOpts;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        transform
+      } = treeOpts;
+      if (!checkStrictly) {
+        const childRowMaps = {};
+        const childRowList = [];
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterTreeList, node => {
+          const nodeid = getNodeId(node);
+          const childList = node[childrenField];
+          if (childList && childList.length && !childRowMaps[nodeid]) {
+            childRowMaps[nodeid] = 1;
+            childRowList.unshift([node, nodeid, childList]);
+          }
+        }, {
+          children: transform ? mapChildrenField : childrenField
+        });
+        childRowList.forEach(vals => {
+          const node = vals[0];
+          const nodeid = vals[1];
+          const childList = vals[2];
+          let sLen = 0; // 已选
+          let hLen = 0; // 半选
+          let vLen = 0; // 有效子行
+          const cLen = childList.length; // 子行
+          childList.forEach(checkMethod ? item => {
+            const childNodeid = getNodeId(item);
+            const isSelect = selectCheckboxMaps[childNodeid];
+            if (checkMethod({
+              $cascader: $xeCascader,
+              node: item
+            })) {
+              if (isSelect) {
+                sLen++;
+              } else if (indeterminateRowMaps[childNodeid]) {
+                hLen++;
+              }
+              vLen++;
+            } else {
+              if (isSelect) {
+                sLen++;
+              } else if (indeterminateRowMaps[childNodeid]) {
+                hLen++;
+              }
+            }
+          } : item => {
+            const childNodeid = getNodeId(item);
+            const isSelect = selectCheckboxMaps[childNodeid];
+            if (isSelect) {
+              sLen++;
+            } else if (indeterminateRowMaps[childNodeid]) {
+              hLen++;
+            }
+            vLen++;
+          });
+          let isSelected = false;
+          if (cLen > 0) {
+            if (vLen > 0) {
+              isSelected = (sLen > 0 || hLen > 0) && sLen >= vLen;
+            } else {
+              // 如果存在子项禁用
+              if (sLen > 0 && sLen >= vLen) {
+                isSelected = true;
+              } else if (selectCheckboxMaps[nodeid]) {
+                isSelected = true;
+              } else {
+                isSelected = false;
+              }
+            }
           } else {
-            hideOptionPanel();
+            // 如果无子项
+            isSelected = selectCheckboxMaps[nodeid];
           }
-        }
+          const halfSelect = !isSelected && (sLen > 0 || hLen > 0);
+          if (isSelected) {
+            selectCheckboxMaps[nodeid] = node;
+            if (indeterminateRowMaps[nodeid]) {
+              delete indeterminateRowMaps[nodeid];
+            }
+          } else {
+            if (selectCheckboxMaps[nodeid]) {
+              delete selectCheckboxMaps[nodeid];
+            }
+            if (halfSelect) {
+              indeterminateRowMaps[nodeid] = node;
+            } else {
+              if (indeterminateRowMaps[nodeid]) {
+                delete indeterminateRowMaps[nodeid];
+              }
+            }
+          }
+        });
+        reactData.updateCheckboxFlag++;
       }
     };
-    const handleGlobalMousedownEvent = evnt => {
+    const changeCheckboxEvent = (evnt, node) => {
+      evnt.preventDefault();
+      evnt.stopPropagation();
       const {
-        visiblePanel
-      } = reactData;
-      const isDisabled = computeIsDisabled.value;
-      if (!isDisabled) {
-        const el = refElem.value;
-        const panelElem = refOptionPanel.value;
-        reactData.isActivated = getEventTargetNode(evnt, el).flag || getEventTargetNode(evnt, panelElem).flag;
-        if (visiblePanel && !reactData.isActivated) {
-          hideOptionPanel();
-        }
-      }
-    };
-    const handleGlobalBlurEvent = () => {
+        selectCheckboxMaps,
+        nodeMaps
+      } = internalData;
+      const childrenField = computeChildrenField.value;
+      const mapChildrenField = computeMapChildrenField.value;
+      const checkboxOpts = computeCheckboxOpts.value;
       const {
-        visiblePanel,
-        isActivated
-      } = reactData;
-      if (visiblePanel) {
-        hideOptionPanel();
+        checkStrictly,
+        checkMode,
+        checkMethod
+      } = checkboxOpts;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        transform
+      } = treeOpts;
+      const nodeid = getNodeId(node);
+      const childList = node[childrenField];
+      const isExistChild = childList && childList.length > 0;
+      const nodeItem = nodeMaps[nodeid] || {};
+      const nLevel = nodeItem.level;
+      const isDisabled = checkMethod ? !checkMethod({
+        $cascader: $xeCascader,
+        node
+      }) : !handleVisibleOrCheckMode(checkMode, isExistChild, nLevel);
+      if (isDisabled) {
+        return;
       }
-      if (isActivated) {
-        reactData.isActivated = false;
+      let isChecked = false;
+      if (selectCheckboxMaps[nodeid]) {
+        delete selectCheckboxMaps[nodeid];
+      } else {
+        isChecked = true;
+        selectCheckboxMaps[nodeid] = node;
       }
-      if (visiblePanel || isActivated) {
-        const $input = refInput.value;
-        if ($input) {
-          $input.blur();
-        }
+      if (!checkStrictly) {
+        external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(node, transform ? mapChildrenField : childrenField), childNode => {
+          const childNodeid = getNodeId(childNode);
+          if (isChecked) {
+            if (!selectCheckboxMaps[childNodeid]) {
+              selectCheckboxMaps[childNodeid] = true;
+            }
+          } else {
+            if (selectCheckboxMaps[childNodeid]) {
+              delete selectCheckboxMaps[childNodeid];
+            }
+          }
+        }, {
+          children: transform ? mapChildrenField : childrenField
+        });
       }
+      reactData.updateCheckboxFlag++;
+      updateCheckboxStatus();
+      const nodeids = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().keys(selectCheckboxMaps);
+      const value = nodeids;
+      changeEvent(evnt, value, node);
     };
-    const handleGlobalResizeEvent = () => {
+    const handleNodeClickEvent = (evnt, node, chunks, chunkIndex) => {
       const {
-        visiblePanel
-      } = reactData;
-      if (visiblePanel) {
-        updatePlacement();
+        multiple
+      } = props;
+      const treeOpts = computeTreeOpts.value;
+      const radioOpts = computeRadioOpts.value;
+      const checkboxOpts = computeCheckboxOpts.value;
+      const childrenField = computeChildrenField.value;
+      const mapChildrenField = computeMapChildrenField.value;
+      const {
+        transform,
+        trigger
+      } = treeOpts;
+      const childList = node[transform ? mapChildrenField : childrenField];
+      let triggerCurrent = false;
+      let triggerRadio = false;
+      let triggerCheckbox = false;
+      let triggerExpand = false;
+      triggerCurrent = true;
+      changeCurrentEvent(evnt, node);
+      if (trigger !== 'icon') {
+        triggerExpand = true;
+        toggleExpandEvent(evnt, node, chunks, chunkIndex);
       }
-    };
-    const handleFocusSearch = () => {
-      if (props.filterable) {
-        (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
-          const inpSearch = refInpSearch.value;
-          if (inpSearch) {
-            inpSearch.focus();
-          }
-        });
+      if (multiple) {
+        if (checkboxOpts.trigger === 'node' || !checkboxOpts.showIcon && (!childList || !childList.length)) {
+          triggerCheckbox = true;
+          changeCheckboxEvent(evnt, node);
+        }
+      } else {
+        if (radioOpts.trigger === 'node' || !radioOpts.showIcon && (!childList || !childList.length)) {
+          triggerRadio = true;
+          changeRadioEvent(evnt, node);
+        }
       }
+      dispatchEvent('node-click', {
+        node,
+        triggerCurrent,
+        triggerRadio,
+        triggerCheckbox,
+        triggerExpand
+      }, evnt);
     };
     const focusEvent = evnt => {
       const isDisabled = computeIsDisabled.value;
       if (!isDisabled) {
         if (!reactData.visiblePanel) {
           reactData.triggerFocusPanel = true;
-          showOptionPanel();
+          showOptionPanel(evnt);
           setTimeout(() => {
             reactData.triggerFocusPanel = false;
           }, 150);
@@ -15252,7 +16552,14 @@ function cascader_createInternalData() {
       dispatchEvent('focus', {}, evnt);
     };
     const clickEvent = evnt => {
-      togglePanelEvent(evnt);
+      evnt.preventDefault();
+      if (reactData.triggerFocusPanel) {
+        reactData.triggerFocusPanel = false;
+      } else {
+        if (!reactData.visiblePanel) {
+          showOptionPanel(evnt);
+        }
+      }
       dispatchEvent('click', {}, evnt);
     };
     const blurEvent = evnt => {
@@ -15261,18 +16568,18 @@ function cascader_createInternalData() {
     };
     const modelSearchEvent = value => {
       reactData.searchValue = value;
+      triggerSearchEvent(new Event('filter'));
     };
     const handleSearchEvent = () => {
       const {
         modelValue,
-        remote,
-        remoteMethod
+        remote
       } = props;
       const {
         searchValue
       } = reactData;
       const remoteOpts = computeRemoteOpts.value;
-      const queryMethod = remoteOpts.queryMethod || remoteMethod;
+      const queryMethod = remoteOpts.queryMethod;
       if (remote && queryMethod && remoteOpts.enabled) {
         reactData.searchLoading = true;
         Promise.resolve(queryMethod({
@@ -15293,14 +16600,240 @@ function cascader_createInternalData() {
         reactData.triggerFocusPanel = false;
       } else {
         if (reactData.visiblePanel) {
-          hideOptionPanel();
+          hideOptionPanel($event);
         } else {
-          showOptionPanel();
+          showOptionPanel($event);
+        }
+      }
+    };
+    const cascaderPrivateMethods = {
+      isCheckedByCheckboxNodeId,
+      /**
+       * 用于树结构，给行数据加载子节点
+       */
+      loadChildrenNode(node, childRecords) {
+        const {
+          separator
+        } = props;
+        const {
+          nodeMaps
+        } = internalData;
+        const treeOpts = computeTreeOpts.value;
+        const labelField = computeLabelField.value;
+        const {
+          lazy,
+          transform
+        } = treeOpts;
+        if (!lazy) {
+          return Promise.resolve([]);
         }
+        const childrenField = computeChildrenField.value;
+        const mapChildrenField = computeMapChildrenField.value;
+        const parentNodeItem = nodeMaps[getNodeId(node)];
+        const parentLevel = parentNodeItem ? parentNodeItem.level : 0;
+        const parentNodes = parentNodeItem ? parentNodeItem.nodes : [];
+        return createNode(childRecords).then(nodeList => {
+          external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(nodeList, (childRow, index, items, path, parent, nodes) => {
+            const itemNodeId = getNodeId(childRow);
+            nodeMaps[itemNodeId] = {
+              item: childRow,
+              index: -1,
+              $index: -1,
+              _index: -1,
+              items,
+              parent: parent || parentNodeItem.item,
+              nodes: parentNodes.concat(nodes),
+              level: parentLevel + nodes.length,
+              treeIndex: -1,
+              lineCount: 0,
+              treeLoaded: false,
+              fullLabel: nodes.map(item => item[labelField]).join(separator || ' / ')
+            };
+          }, {
+            children: childrenField
+          });
+          node[childrenField] = nodeList;
+          if (transform) {
+            node[mapChildrenField] = nodeList;
+          }
+          updateAfterDataIndex();
+          return nodeList;
+        });
       }
     };
-    const cascaderPrivateMethods = {};
     Object.assign($xeCascader, cascaderMethods, cascaderPrivateMethods);
+    const handleVisibleOrCheckMode = (mode, isExistChild, nLevel) => {
+      if (mode) {
+        if (mode === 'first') {
+          return !nLevel;
+        }
+        if (mode === 'last') {
+          return !isExistChild;
+        }
+      }
+      return true;
+    };
+    const renderRadio = (node, isExistChild, nLevel, isChecked) => {
+      const radioOpts = computeRadioOpts.value;
+      const {
+        showIcon,
+        checkMode,
+        checkMethod,
+        visibleMode,
+        visibleMethod
+      } = radioOpts;
+      const isVisible = visibleMethod ? visibleMethod({
+        $cascader: $xeCascader,
+        node
+      }) : handleVisibleOrCheckMode(visibleMode, isExistChild, nLevel);
+      if (showIcon && isVisible) {
+        const isDisabled = checkMethod ? !checkMethod({
+          $cascader: $xeCascader,
+          node
+        }) : !handleVisibleOrCheckMode(checkMode, isExistChild, nLevel);
+        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+          class: ['vxe-tree--radio-option', {
+            'is--checked': isChecked,
+            'is--disabled': isDisabled
+          }],
+          onClick: evnt => {
+            if (!isDisabled) {
+              changeRadioEvent(evnt, node);
+            }
+          }
+        }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
+          class: ['vxe-radio--icon', isChecked ? getIcon().RADIO_CHECKED : getIcon().RADIO_UNCHECKED]
+        })]);
+      }
+      return renderEmptyElement($xeCascader);
+    };
+    const renderCheckbox = (node, isExistChild, nLevel, isChecked, isIndeterminate) => {
+      const checkboxOpts = computeCheckboxOpts.value;
+      const {
+        showIcon,
+        checkMode,
+        checkMethod,
+        visibleMode,
+        visibleMethod
+      } = checkboxOpts;
+      const isVisible = visibleMethod ? visibleMethod({
+        $cascader: $xeCascader,
+        node
+      }) : handleVisibleOrCheckMode(visibleMode, isExistChild, nLevel);
+      if (showIcon && isVisible) {
+        const isDisabled = checkMethod ? !checkMethod({
+          $cascader: $xeCascader,
+          node
+        }) : !handleVisibleOrCheckMode(checkMode, isExistChild, nLevel);
+        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+          class: ['vxe-cascader--checkbox-option', {
+            'is--checked': isChecked,
+            'is--indeterminate': isIndeterminate,
+            'is--disabled': isDisabled
+          }],
+          onClick: evnt => {
+            if (!isDisabled) {
+              changeCheckboxEvent(evnt, node);
+            }
+          }
+        }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
+          class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().CHECKBOX_INDETERMINATE : isChecked ? getIcon().CHECKBOX_CHECKED : getIcon().CHECKBOX_UNCHECKED]
+        })]);
+      }
+      return renderEmptyElement($xeCascader);
+    };
+    const renderNode = (node, nodeid, nodeIndex, chunks, chunkIndex) => {
+      const {
+        multiple
+      } = props;
+      const {
+        currentNode,
+        selectRadioKey,
+        updateCheckboxFlag,
+        updateExpandedFlag
+      } = reactData;
+      const {
+        nodeMaps,
+        selectCheckboxMaps,
+        indeterminateRowMaps,
+        treeExpandedMaps,
+        treeExpandLazyLoadedMaps
+      } = internalData;
+      const treeOpts = computeTreeOpts.value;
+      const {
+        lazy,
+        iconLoaded,
+        iconOpen,
+        iconClose
+      } = treeOpts;
+      const childrenField = computeChildrenField.value;
+      const labelField = computeLabelField.value;
+      const hasChildField = computeHasChildField.value;
+      const childList = node[childrenField];
+      const isExistChild = childList && childList.length > 0;
+      const iconSlot = slots.icon;
+      const titleSlot = slots.title;
+      const isExpand = updateExpandedFlag && treeExpandedMaps[nodeid];
+      const nodeItem = nodeMaps[nodeid] || {};
+      const nodeTitle = node[labelField];
+      const nLevel = nodeItem.level;
+      let isRadioChecked = false;
+      if (!multiple) {
+        isRadioChecked = nodeid === selectRadioKey;
+      }
+      let isCheckboxChecked = false;
+      let isIndeterminate = false;
+      if (multiple) {
+        isCheckboxChecked = !!(updateCheckboxFlag && selectCheckboxMaps[nodeid]);
+        isIndeterminate = !!(updateCheckboxFlag && indeterminateRowMaps[nodeid]);
+      }
+      let hasLazyChilds = false;
+      let isLazyLoading = false;
+      let isLazyLoaded = false;
+      if (lazy) {
+        isLazyLoading = !!treeExpandLazyLoadedMaps[nodeid];
+        hasLazyChilds = node[hasChildField];
+        isLazyLoaded = !!nodeItem.treeLoaded;
+      }
+      const nParams = {
+        node
+      };
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        key: `${chunkIndex}_${nodeIndex}`,
+        class: ['vxe-cascader-chunk--node-item', {
+          'is--current': currentNode && (currentNode === node || getNodeId(currentNode) === nodeid),
+          'is-radio--checked': isRadioChecked,
+          'is-checkbox--checked': isCheckboxChecked,
+          'is-checkbox--indeterminate': isIndeterminate,
+          'is--expand': isExpand
+        }],
+        title: nodeTitle,
+        onMousedown: evnt => {
+          const isLeftBtn = evnt.button === 0;
+          if (isLeftBtn) {
+            evnt.stopPropagation();
+          }
+        },
+        onClick(evnt) {
+          handleNodeClickEvent(evnt, node, chunks, chunkIndex);
+        }
+      }, [multiple ? renderCheckbox(node, isExistChild, nLevel, isCheckboxChecked, isIndeterminate) : renderRadio(node, isExistChild, nLevel, isRadioChecked), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-cascader-chunk--node-item-inner'
+      }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-cascader-chunk--node-item-title'
+      }, titleSlot ? getSlotVNs(titleSlot(nParams)) : nodeTitle)]), treeOpts.showIcon && (lazy ? isLazyLoaded ? isExistChild : hasLazyChilds : isExistChild) ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-cascader-chunk--node-item-switcher'
+      }, [[(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-cascader--node-item-icon',
+        onClick(evnt) {
+          if (treeOpts.trigger === 'icon') {
+            toggleExpandEvent(evnt, node, chunks, chunkIndex);
+          }
+        }
+      }, iconSlot ? getSlotVNs(iconSlot(nParams)) : [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('i', {
+        class: isLazyLoading ? iconLoaded || getIcon().CASCADER_NODE_LOADED : isExpand ? iconOpen || getIcon().CASCADER_NODE_OPEN : iconClose || getIcon().CASCADER_NODE_CLOSE
+      })])]]) : renderEmptyElement($xeCascader)]);
+    };
     const renderVN = () => {
       const {
         className,
@@ -15310,14 +16843,16 @@ function cascader_createInternalData() {
         filterable,
         showTotalButton,
         showCheckedButton,
-        showClearButton
+        showClearButton,
+        showCloseButton
       } = props;
       const {
         initialized,
         isActivated,
         isAniVisible,
         visiblePanel,
-        searchValue
+        searchValue,
+        currentCunkList
       } = reactData;
       const vSize = computeSize.value;
       const isDisabled = computeIsDisabled.value;
@@ -15383,7 +16918,7 @@ function cascader_createInternalData() {
           'ani--enter': !loading && visiblePanel
         }],
         placement: reactData.panelPlacement,
-        style: reactData.panelStyle
+        style: popupWrapperStyle
       }, initialized ? [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-cascader--panel-wrapper'
       }, [filterable ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
@@ -15398,37 +16933,80 @@ function cascader_createInternalData() {
         placeholder: getI18n('vxe.cascader.search'),
         prefixIcon: getIcon().INPUT_SEARCH,
         'onUpdate:modelValue': modelSearchEvent
-      })]) : renderEmptyElement($xeCascader), showTotalButton || showCheckedButton && multiple || showClearButton || headerSlot ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        class: 'vxe-cascader--panel-header'
+      })]) : renderEmptyElement($xeCascader), showCheckedButton && multiple || showClearButton || headerSlot ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-tree-select--panel-header'
       }, headerSlot ? headerSlot({}) : [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        class: 'vxe-cascader--header-button'
-      }, [showTotalButton ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        class: 'vxe-cascader--header-total'
-      }, getI18n('vxe.cascader.total', [selectVals.length])) : renderEmptyElement($xeCascader), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        class: 'vxe-cascader--header-btns'
+        class: 'vxe-tree-select--header-button'
+      }, [showCheckedButton && showClearButton ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-tree-select--selected-btns'
       }, [showCheckedButton && multiple ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(src_button, {
-        content: getI18n('vxe.cascader.allChecked'),
+        content: getI18n('vxe.treeSelect.allChecked'),
         mode: 'text',
         onClick: allCheckedPanelEvent
       }) : renderEmptyElement($xeCascader), showClearButton ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(src_button, {
-        content: getI18n('vxe.cascader.clearChecked'),
+        content: getI18n('vxe.treeSelect.clearChecked'),
         mode: 'text',
         onClick: clearCheckedPanelEvent
-      }) : renderEmptyElement($xeCascader)])])]) : renderEmptyElement($xeCascader), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+      }) : renderEmptyElement($xeCascader)]) : renderEmptyElement($xeCascader)])]) : renderEmptyElement($xeCascader), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-cascader--panel-body'
       }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        ref: refTreeWrapper,
-        class: 'vxe-cascader-tree--wrapper',
-        style: popupWrapperStyle
-      }, [])]), footerSlot ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        ref: refChunkWrapper,
+        class: 'vxe-cascader-chunk--wrapper'
+      }, [currentCunkList.map((chunks, chunkIndex) => {
+        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+          key: chunkIndex,
+          class: 'vxe-cascader-chunk--item-wrapper'
+        }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(list, {
+          data: chunks
+        }, {
+          default(slotParams) {
+            const {
+              items
+            } = slotParams;
+            return items.map((node, nodeIndex) => {
+              const nodeid = getNodeId(node);
+              return renderNode(node, nodeid, nodeIndex, chunks, chunkIndex);
+            });
+          }
+        })]);
+      })])]), footerSlot || showTotalButton || showCloseButton && multiple ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-cascader--panel-footer'
-      }, footerSlot({})) : renderEmptyElement($xeCascader)])] : [])])]);
+      }, footerSlot ? footerSlot({}) : [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-cascader--footer-button'
+      }, [showTotalButton ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-cascader--total-btns'
+      }, getI18n('vxe.treeSelect.total', [selectVals.length])) : renderEmptyElement($xeCascader), showCloseButton && multiple ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+        class: 'vxe-cascader--oper-btns'
+      }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(src_button, {
+        content: getI18n('vxe.select.close'),
+        mode: 'text',
+        onClick: closePanelEvent
+      })]) : renderEmptyElement($xeCascader)])]) : renderEmptyElement($xeCascader)])] : [])])]);
     };
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.modelValue, () => {
+      if (!reactData.visiblePanel) {
+        handleCurrentItems();
+        updateCurrentChunk();
+      }
+    });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.options, () => {
-      cacheDataMap();
+      cacheNodeMap();
     });
-    cacheDataMap();
+    const dataFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.options ? props.options.length : 0, () => {
+      dataFlag.value++;
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.options, () => {
+      dataFlag.value++;
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(dataFlag, () => {
+      loadData(props.options || []);
+    });
+    loadData(props.options || []);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
+      if (props.filterable) {
+        errLog('vxe.error.notProp', ['filterable']);
+      }
       globalEvents.on($xeCascader, 'mousewheel', handleGlobalMousewheelEvent);
       globalEvents.on($xeCascader, 'mousedown', handleGlobalMousedownEvent);
       globalEvents.on($xeCascader, 'blur', handleGlobalBlurEvent);
@@ -16899,7 +18477,7 @@ function hexToRgb(str) {
     // float
     roundingMode: {
       type: String,
-      default: null
+      default: () => getConfig().numberInput.roundingMode
     },
     // float
     digits: {
@@ -17176,6 +18754,7 @@ function hexToRgb(str) {
     };
     const getNumberValue = val => {
       const {
+        type,
         exponential,
         roundingMode,
         autoFill
@@ -17185,7 +18764,7 @@ function hexToRgb(str) {
       const decimalsType = computeDecimalsType.value;
       let restVal = '';
       if (decimalsType) {
-        restVal = toFloatValueFixed(val, digitsValue, roundingMode);
+        restVal = toFloatValueFixed(val, type, digitsValue, roundingMode);
         if (!autoFill) {
           restVal = handleNumberString(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(restVal));
         }
@@ -17302,6 +18881,7 @@ function hexToRgb(str) {
     };
     const updateModel = val => {
       const {
+        type,
         roundingMode,
         autoFill
       } = props;
@@ -17315,7 +18895,7 @@ function hexToRgb(str) {
       } else {
         let textValue = '' + val;
         if (decimalsType) {
-          textValue = toFloatValueFixed(val, digitsValue, roundingMode);
+          textValue = toFloatValueFixed(val, type, digitsValue, roundingMode);
           if (!autoFill) {
             textValue = '' + external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(textValue);
           }
@@ -17330,6 +18910,7 @@ function hexToRgb(str) {
      */
     const initValue = () => {
       const {
+        type,
         roundingMode,
         autoFill
       } = props;
@@ -17343,7 +18924,7 @@ function hexToRgb(str) {
           let textValue = '';
           let validValue = null;
           if (inputValue) {
-            textValue = toFloatValueFixed(inputValue, digitsValue, roundingMode);
+            textValue = toFloatValueFixed(inputValue, type, digitsValue, roundingMode);
             validValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(textValue);
             if (!autoFill) {
               textValue = `${validValue}`;
@@ -30600,666 +32181,212 @@ const LayoutFooter = VxeLayoutFooter;
     const computeMaps = {};
     const $xeLayoutHeader = {
       xID,
-      props,
-      context,
-      reactData,
-      getRefMaps: () => refMaps,
-      getComputeMaps: () => computeMaps
-    };
-    const dispatchEvent = (type, params, evnt) => {
-      emit(type, createEvent(evnt, {
-        $layoutHeader: $xeLayoutHeader
-      }, params));
-    };
-    const layoutHeaderMethods = {
-      dispatchEvent
-    };
-    const layoutHeaderPrivateMethods = {};
-    Object.assign($xeLayoutHeader, layoutHeaderMethods, layoutHeaderPrivateMethods);
-    const renderVN = () => {
-      const {
-        fixed
-      } = props;
-      const defaultSlot = slots.default;
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('header', {
-        ref: refElem,
-        class: ['vxe-layout-header', {
-          'is--fixed': fixed
-        }]
-      }, defaultSlot ? defaultSlot({}) : []);
-    };
-    $xeLayoutHeader.renderVN = renderVN;
-    return $xeLayoutHeader;
-  },
-  render() {
-    return this.renderVN();
-  }
-}));
-;// ./packages/layout-header/index.ts
-
-
-
-const VxeLayoutHeader = Object.assign({}, layout_header, {
-  install(app) {
-    app.component(layout_header.name, layout_header);
-  }
-});
-dynamicApp.use(VxeLayoutHeader);
-VxeUI.component(layout_header);
-const LayoutHeader = VxeLayoutHeader;
-/* harmony default export */ var packages_layout_header = (VxeLayoutHeader);
-;// ./packages/link/src/link.ts
-
-
-
-
-
-/* harmony default export */ var src_link = (defineVxeComponent({
-  name: 'VxeLink',
-  props: {
-    href: String,
-    target: String,
-    status: String,
-    title: [String, Number],
-    disabled: Boolean,
-    icon: String,
-    routerLink: Object,
-    underline: {
-      type: Boolean,
-      default: () => getConfig().link.underline
-    },
-    /**
-     * 权限码
-     */
-    permissionCode: [String, Number],
-    content: [String, Number],
-    size: {
-      type: String,
-      default: () => getConfig().link.size || getConfig().size
-    }
-  },
-  emits: ['click'],
-  setup(props, context) {
-    const {
-      slots,
-      emit
-    } = context;
-    const xID = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId();
-    const {
-      computeSize
-    } = useSize(props);
-    const {
-      computePermissionInfo
-    } = usePermission(props);
-    const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({});
-    const refMaps = {
-      refElem
-    };
-    const computeMaps = {};
-    const $xeLink = {
-      xID,
-      props,
-      context,
-      reactData,
-      getRefMaps: () => refMaps,
-      getComputeMaps: () => computeMaps
-    };
-    const dispatchEvent = (type, params, evnt) => {
-      emit(type, createEvent(evnt, {
-        $link: $xeLink
-      }, params));
-    };
-    const linkMethods = {
-      dispatchEvent
-    };
-    const linkPrivateMethods = {};
-    const clickEvent = evnt => {
-      const {
-        disabled
-      } = props;
-      if (!disabled) {
-        dispatchEvent('click', {}, evnt);
-      }
-    };
-    Object.assign($xeLink, linkMethods, linkPrivateMethods);
-    const renderContent = () => {
-      const {
-        icon,
-        content
-      } = props;
-      const defaultSlot = slots.default;
-      const iconSlot = slots.icon;
-      const textContent = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toValueString(content);
-      return [iconSlot || icon ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
-        class: 'vxe-link--icon'
-      }, iconSlot ? vn_getSlotVNs(iconSlot({})) : [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('i', {
-        class: icon
-      })]) : renderEmptyElement($xeLink), defaultSlot || textContent ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
-        class: 'vxe-link--content'
-      }, defaultSlot ? defaultSlot({}) : textContent) : renderEmptyElement($xeLink)];
-    };
-    const renderVN = () => {
-      const {
-        status,
-        target,
-        href,
-        title,
-        underline,
-        disabled,
-        routerLink
-      } = props;
-      const permissionInfo = computePermissionInfo.value;
-      const vSize = computeSize.value;
-      if (!permissionInfo.visible) {
-        return renderEmptyElement($xeLink);
-      }
-      if (routerLink && !disabled) {
-        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)((0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)('router-link'), {
-          class: ['vxe-link', {
-            [`size--${vSize}`]: vSize,
-            [`theme--${status}`]: status,
-            'is--disabled': disabled,
-            'is--underline': underline
-          }],
-          title,
-          target,
-          to: disabled ? null : routerLink,
-          onClick: clickEvent
-        }, {
-          default() {
-            return renderContent();
-          }
-        });
-      }
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('a', {
-        ref: refElem,
-        class: ['vxe-link', {
-          [`size--${vSize}`]: vSize,
-          [`theme--${status}`]: status,
-          'is--disabled': disabled,
-          'is--underline': underline
-        }],
-        href: disabled ? null : href,
-        target,
-        title,
-        onClick: clickEvent
-      }, renderContent());
-    };
-    $xeLink.renderVN = renderVN;
-    return $xeLink;
-  },
-  render() {
-    return this.renderVN();
-  }
-}));
-;// ./packages/link/index.ts
-
-
-
-const VxeLink = Object.assign({}, src_link, {
-  install(app) {
-    app.component(src_link.name, src_link);
-  }
-});
-dynamicApp.use(VxeLink);
-VxeUI.component(src_link);
-const Link = VxeLink;
-/* harmony default export */ var packages_link = (VxeLink);
-;// ./packages/list/src/list.ts
-
-
-
-
-
-
-function list_createReactData() {
-  return {
-    scrollYLoad: false,
-    bodyHeight: 0,
-    customHeight: 0,
-    customMaxHeight: 0,
-    parentHeight: 0,
-    topSpaceHeight: 0,
-    items: []
-  };
-}
-function list_createInternalData() {
-  return {
-    resizeObserver: undefined,
-    fullData: [],
-    lastScrollLeft: 0,
-    lastScrollTop: 0,
-    scrollYStore: {
-      startIndex: 0,
-      endIndex: 0,
-      visibleSize: 0,
-      offsetSize: 0,
-      rowHeight: 0
-    }
-  };
-}
-/* harmony default export */ var list = (defineVxeComponent({
-  name: 'VxeList',
-  props: {
-    data: Array,
-    height: [Number, String],
-    maxHeight: [Number, String],
-    loading: Boolean,
-    className: [String, Function],
-    size: {
-      type: String,
-      default: () => getConfig().list.size || getConfig().size
-    },
-    autoResize: {
-      type: Boolean,
-      default: () => getConfig().list.autoResize
-    },
-    syncResize: [Boolean, String, Number],
-    virtualYConfig: Object,
-    scrollY: Object
-  },
-  emits: ['scroll'],
-  setup(props, context) {
-    const {
-      slots,
-      emit
-    } = context;
-    const xID = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId();
-    const browseObj = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().browse();
-    const {
-      computeSize
-    } = useSize(props);
-    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(list_createReactData());
-    const internalData = list_createInternalData();
-    const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const refVirtualWrapper = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const refVirtualBody = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const refMaps = {
-      refElem
-    };
-    const $xeList = {
-      xID,
-      props,
-      context,
-      reactData,
-      internalData,
-      getRefMaps: () => refMaps
-    };
-    const computeSYOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
-      return Object.assign({}, getConfig().list.virtualYConfig || getConfig().list.scrollY, props.virtualYConfig || props.scrollY);
-    });
-    const computeStyles = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
-      const {
-        height,
-        maxHeight
-      } = props;
-      const {
-        customHeight,
-        customMaxHeight
-      } = reactData;
-      const style = {};
-      if (height) {
-        style.height = `${customHeight}px`;
-      } else if (maxHeight) {
-        style.height = 'auto';
-        style.maxHeight = `${customMaxHeight}px`;
-      }
-      return style;
-    });
-    const dispatchEvent = (type, params, evnt) => {
-      emit(type, createEvent(evnt, {
-        $list: $xeList
-      }, params));
-    };
-    const calcTableHeight = key => {
-      const {
-        parentHeight
-      } = reactData;
-      const val = props[key];
-      let num = 0;
-      if (val) {
-        if (val === '100%' || val === 'auto') {
-          num = parentHeight;
-        } else {
-          if (isScale(val)) {
-            num = Math.floor((external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toInteger(val) || 1) / 100 * parentHeight);
-          } else {
-            num = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(val);
-          }
-          num = Math.max(40, num);
-        }
-      }
-      return num;
-    };
-    const updateHeight = () => {
-      reactData.customHeight = calcTableHeight('height');
-      reactData.customMaxHeight = calcTableHeight('maxHeight');
-    };
-    const updateYSpace = () => {
-      const {
-        scrollYLoad
-      } = reactData;
-      const {
-        scrollYStore,
-        fullData
-      } = internalData;
-      reactData.bodyHeight = scrollYLoad ? fullData.length * scrollYStore.rowHeight : 0;
-      reactData.topSpaceHeight = scrollYLoad ? Math.max(scrollYStore.startIndex * scrollYStore.rowHeight, 0) : 0;
-    };
-    const handleData = () => {
-      const {
-        scrollYLoad
-      } = reactData;
-      const {
-        fullData,
-        scrollYStore
-      } = internalData;
-      reactData.items = scrollYLoad ? fullData.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullData.slice(0);
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
-    };
-    const updateYData = () => {
-      handleData();
-      updateYSpace();
-    };
-    const computeScrollLoad = () => {
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(() => {
-        const {
-          scrollYLoad
-        } = reactData;
-        const {
-          scrollYStore
-        } = internalData;
-        const virtualBodyElem = refVirtualBody.value;
-        const sYOpts = computeSYOpts.value;
-        let rowHeight = 0;
-        let firstItemElem;
-        if (virtualBodyElem) {
-          if (sYOpts.sItem) {
-            firstItemElem = virtualBodyElem.querySelector(sYOpts.sItem);
-          }
-          if (!firstItemElem) {
-            firstItemElem = virtualBodyElem.children[0];
-          }
-        }
-        if (firstItemElem) {
-          rowHeight = firstItemElem.offsetHeight;
-        }
-        rowHeight = Math.max(12, rowHeight);
-        scrollYStore.rowHeight = rowHeight;
-        // 计算 Y 逻辑
-        if (scrollYLoad) {
-          const scrollBodyElem = refVirtualWrapper.value;
-          const visibleYSize = Math.max(8, Math.ceil(scrollBodyElem.clientHeight / rowHeight));
-          const offsetYSize = sYOpts.oSize ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(sYOpts.oSize) : browseObj.edge ? 10 : 0;
-          scrollYStore.offsetSize = offsetYSize;
-          scrollYStore.visibleSize = visibleYSize;
-          scrollYStore.endIndex = Math.max(scrollYStore.startIndex + visibleYSize + offsetYSize, scrollYStore.endIndex);
-          updateYData();
-        } else {
-          updateYSpace();
-        }
-      });
+      props,
+      context,
+      reactData,
+      getRefMaps: () => refMaps,
+      getComputeMaps: () => computeMaps
     };
-    /**
-     * 清除滚动条
-     */
-    const clearScroll = () => {
-      const scrollBodyElem = refVirtualWrapper.value;
-      if (scrollBodyElem) {
-        scrollBodyElem.scrollTop = 0;
-      }
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+    const dispatchEvent = (type, params, evnt) => {
+      emit(type, createEvent(evnt, {
+        $layoutHeader: $xeLayoutHeader
+      }, params));
     };
-    /**
-     * 如果有滚动条，则滚动到对应的位置
-     */
-    const scrollTo = (scrollLeft, scrollTop) => {
-      const scrollBodyElem = refVirtualWrapper.value;
-      if (scrollLeft) {
-        if (!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(scrollLeft)) {
-          scrollTop = scrollLeft.top;
-          scrollLeft = scrollLeft.left;
-        }
-      }
-      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(scrollLeft)) {
-        scrollBodyElem.scrollLeft = scrollLeft;
-      }
-      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isNumber(scrollTop)) {
-        scrollBodyElem.scrollTop = scrollTop;
-      }
-      if (reactData.scrollYLoad) {
-        return new Promise(resolve => {
-          setTimeout(() => {
-            (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
-              resolve();
-            });
-          }, 50);
-        });
-      }
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+    const layoutHeaderMethods = {
+      dispatchEvent
     };
-    /**
-     * 刷新滚动条
-     */
-    const refreshScroll = () => {
+    const layoutHeaderPrivateMethods = {};
+    Object.assign($xeLayoutHeader, layoutHeaderMethods, layoutHeaderPrivateMethods);
+    const renderVN = () => {
       const {
-        lastScrollLeft,
-        lastScrollTop
-      } = internalData;
-      return clearScroll().then(() => {
-        if (lastScrollLeft || lastScrollTop) {
-          internalData.lastScrollLeft = 0;
-          internalData.lastScrollTop = 0;
-          return scrollTo(lastScrollLeft, lastScrollTop);
-        }
-      });
+        fixed
+      } = props;
+      const defaultSlot = slots.default;
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('header', {
+        ref: refElem,
+        class: ['vxe-layout-header', {
+          'is--fixed': fixed
+        }]
+      }, defaultSlot ? defaultSlot({}) : []);
     };
+    $xeLayoutHeader.renderVN = renderVN;
+    return $xeLayoutHeader;
+  },
+  render() {
+    return this.renderVN();
+  }
+}));
+;// ./packages/layout-header/index.ts
+
+
+
+const VxeLayoutHeader = Object.assign({}, layout_header, {
+  install(app) {
+    app.component(layout_header.name, layout_header);
+  }
+});
+dynamicApp.use(VxeLayoutHeader);
+VxeUI.component(layout_header);
+const LayoutHeader = VxeLayoutHeader;
+/* harmony default export */ var packages_layout_header = (VxeLayoutHeader);
+;// ./packages/link/src/link.ts
+
+
+
+
+
+/* harmony default export */ var src_link = (defineVxeComponent({
+  name: 'VxeLink',
+  props: {
+    href: String,
+    target: String,
+    status: String,
+    title: [String, Number],
+    disabled: Boolean,
+    icon: String,
+    routerLink: Object,
+    underline: {
+      type: Boolean,
+      default: () => getConfig().link.underline
+    },
     /**
-     * 重新计算列表
+     * 权限码
      */
-    const recalculate = () => {
-      const el = refElem.value;
-      if (el) {
-        const parentEl = el.parentElement;
-        reactData.parentHeight = parentEl ? parentEl.clientHeight : 0;
-        updateHeight();
-        if (el.clientWidth && el.clientHeight) {
-          return computeScrollLoad();
-        }
-      }
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
+    permissionCode: [String, Number],
+    content: [String, Number],
+    size: {
+      type: String,
+      default: () => getConfig().link.size || getConfig().size
+    }
+  },
+  emits: ['click'],
+  setup(props, context) {
+    const {
+      slots,
+      emit
+    } = context;
+    const xID = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId();
+    const {
+      computeSize
+    } = useSize(props);
+    const {
+      computePermissionInfo
+    } = usePermission(props);
+    const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
+    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({});
+    const refMaps = {
+      refElem
     };
-    const loadYData = evnt => {
-      const {
-        scrollYStore
-      } = internalData;
-      const {
-        startIndex,
-        endIndex,
-        visibleSize,
-        offsetSize,
-        rowHeight
-      } = scrollYStore;
-      const scrollBodyElem = evnt.target;
-      const scrollTop = scrollBodyElem.scrollTop;
-      const toVisibleIndex = Math.floor(scrollTop / rowHeight);
-      const offsetStartIndex = Math.max(0, toVisibleIndex - 1 - offsetSize);
-      const offsetEndIndex = toVisibleIndex + visibleSize + offsetSize;
-      if (toVisibleIndex <= startIndex || toVisibleIndex >= endIndex - visibleSize - 1) {
-        if (startIndex !== offsetStartIndex || endIndex !== offsetEndIndex) {
-          scrollYStore.startIndex = offsetStartIndex;
-          scrollYStore.endIndex = offsetEndIndex;
-          updateYData();
-        }
-      }
+    const computeMaps = {};
+    const $xeLink = {
+      xID,
+      props,
+      context,
+      reactData,
+      getRefMaps: () => refMaps,
+      getComputeMaps: () => computeMaps
     };
-    const scrollEvent = evnt => {
-      const scrollBodyElem = evnt.target;
-      const scrollTop = scrollBodyElem.scrollTop;
-      const scrollLeft = scrollBodyElem.scrollLeft;
-      const isX = scrollLeft !== internalData.lastScrollLeft;
-      const isY = scrollTop !== internalData.lastScrollTop;
-      internalData.lastScrollTop = scrollTop;
-      internalData.lastScrollLeft = scrollLeft;
-      if (reactData.scrollYLoad) {
-        loadYData(evnt);
-      }
-      dispatchEvent('scroll', {
-        scrollLeft,
-        scrollTop,
-        isX,
-        isY
-      }, evnt);
+    const dispatchEvent = (type, params, evnt) => {
+      emit(type, createEvent(evnt, {
+        $link: $xeLink
+      }, params));
     };
-    /**
-     * 加载数据
-     * @param {Array} datas 数据
-     */
-    const loadData = datas => {
+    const linkMethods = {
+      dispatchEvent
+    };
+    const linkPrivateMethods = {};
+    const clickEvent = evnt => {
       const {
-        scrollYStore
-      } = internalData;
-      const sYOpts = computeSYOpts.value;
-      const fullData = datas || [];
-      Object.assign(scrollYStore, {
-        startIndex: 0,
-        endIndex: 1,
-        visibleSize: 0
-      });
-      internalData.fullData = fullData;
-      // 如果gt为0，则总是启用
-      reactData.scrollYLoad = !!sYOpts.enabled && sYOpts.gt > -1 && (sYOpts.gt === 0 || sYOpts.gt <= fullData.length);
-      handleData();
-      return computeScrollLoad().then(() => {
-        refreshScroll();
-      });
+        disabled
+      } = props;
+      if (!disabled) {
+        dispatchEvent('click', {}, evnt);
+      }
     };
-    const listMethods = {
-      dispatchEvent,
-      loadData,
-      /**
-       * 重新加载数据
-       * @param {Array} datas 数据
-       */
-      reloadData(datas) {
-        clearScroll();
-        return loadData(datas);
-      },
-      recalculate,
-      scrollTo,
-      refreshScroll,
-      clearScroll
+    Object.assign($xeLink, linkMethods, linkPrivateMethods);
+    const renderContent = () => {
+      const {
+        icon,
+        content
+      } = props;
+      const defaultSlot = slots.default;
+      const iconSlot = slots.icon;
+      const textContent = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toValueString(content);
+      return [iconSlot || icon ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
+        class: 'vxe-link--icon'
+      }, iconSlot ? vn_getSlotVNs(iconSlot({})) : [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('i', {
+        class: icon
+      })]) : renderEmptyElement($xeLink), defaultSlot || textContent ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('span', {
+        class: 'vxe-link--content'
+      }, defaultSlot ? defaultSlot({}) : textContent) : renderEmptyElement($xeLink)];
     };
-    Object.assign($xeList, listMethods);
     const renderVN = () => {
       const {
-        className,
-        loading
+        status,
+        target,
+        href,
+        title,
+        underline,
+        disabled,
+        routerLink
       } = props;
-      const {
-        bodyHeight,
-        topSpaceHeight,
-        items
-      } = reactData;
-      const defaultSlot = slots.default;
+      const permissionInfo = computePermissionInfo.value;
       const vSize = computeSize.value;
-      const styles = computeStyles.value;
-      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+      if (!permissionInfo.visible) {
+        return renderEmptyElement($xeLink);
+      }
+      if (routerLink && !disabled) {
+        return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)((0,external_commonjs_vue_commonjs2_vue_root_Vue_.resolveComponent)('router-link'), {
+          class: ['vxe-link', {
+            [`size--${vSize}`]: vSize,
+            [`theme--${status}`]: status,
+            'is--disabled': disabled,
+            'is--underline': underline
+          }],
+          title,
+          target,
+          to: disabled ? null : routerLink,
+          onClick: clickEvent
+        }, {
+          default() {
+            return renderContent();
+          }
+        });
+      }
+      return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('a', {
         ref: refElem,
-        class: ['vxe-list', className ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(className) ? className({
-          $list: $xeList
-        }) : className : '', {
+        class: ['vxe-link', {
           [`size--${vSize}`]: vSize,
-          'is--loading': loading
-        }]
-      }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        ref: refVirtualWrapper,
-        class: 'vxe-list--virtual-wrapper',
-        style: styles,
-        onScroll: scrollEvent
-      }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        class: 'vxe-list--y-space',
-        style: {
-          height: bodyHeight ? `${bodyHeight}px` : ''
-        }
-      }), (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
-        ref: refVirtualBody,
-        class: 'vxe-list--body',
-        style: {
-          marginTop: topSpaceHeight ? `${topSpaceHeight}px` : ''
-        }
-      }, defaultSlot ? defaultSlot({
-        items,
-        $list: $xeList
-      }) : [])]),
-      /**
-       * 加载中
-       */
-      (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)(src_loading, {
-        class: 'vxe-list--loading',
-        modelValue: loading
-      })]);
+          [`theme--${status}`]: status,
+          'is--disabled': disabled,
+          'is--underline': underline
+        }],
+        href: disabled ? null : href,
+        target,
+        title,
+        onClick: clickEvent
+      }, renderContent());
     };
-    const dataFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.data ? props.data.length : -1, () => {
-      dataFlag.value++;
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.data, () => {
-      dataFlag.value++;
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(dataFlag, () => {
-      loadData(props.data || []);
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.height, () => {
-      recalculate();
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.maxHeight, () => {
-      recalculate();
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.syncResize, value => {
-      if (value) {
-        recalculate();
-        (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => setTimeout(() => recalculate()));
-      }
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onActivated)(() => {
-      recalculate().then(() => refreshScroll());
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(() => {
-      loadData(props.data || []);
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
-      recalculate();
-      if (props.autoResize) {
-        const el = refElem.value;
-        const resizeObserver = globalResize.create(() => recalculate());
-        resizeObserver.observe(el);
-        if (el) {
-          resizeObserver.observe(el.parentElement);
-        }
-        internalData.resizeObserver = resizeObserver;
-      }
-      globalEvents.on($xeList, 'resize', recalculate);
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onBeforeUnmount)(() => {
-      const {
-        resizeObserver
-      } = internalData;
-      if (resizeObserver) {
-        resizeObserver.disconnect();
-      }
-      globalEvents.off($xeList, 'resize');
-      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(reactData, list_createReactData());
-      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(internalData, list_createInternalData());
-    });
-    $xeList.renderVN = renderVN;
-    return $xeList;
+    $xeLink.renderVN = renderVN;
+    return $xeLink;
   },
   render() {
     return this.renderVN();
   }
 }));
+;// ./packages/link/index.ts
+
+
+
+const VxeLink = Object.assign({}, src_link, {
+  install(app) {
+    app.component(src_link.name, src_link);
+  }
+});
+dynamicApp.use(VxeLink);
+VxeUI.component(src_link);
+const Link = VxeLink;
+/* harmony default export */ var packages_link = (VxeLink);
 ;// ./packages/list/index.ts
 
 
@@ -33917,7 +35044,7 @@ const Option = VxeOption;
 function isOptionVisible(option) {
   return option.visible !== false;
 }
-function select_getOptUniqueId() {
+function getOptUniqueId() {
   return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId('opt_');
 }
 function select_createInternalData() {
@@ -34394,7 +35521,7 @@ function select_createInternalData() {
         list.push(item);
         let optid = getOptId(item);
         if (!optid) {
-          optid = select_getOptUniqueId();
+          optid = getOptUniqueId();
           item[key] = optid;
         }
         fullKeyMaps[item[valueField]] = {
@@ -44437,6 +45564,59 @@ dynamicApp.use(VxeTour);
 VxeUI.component(tour);
 const Tour = VxeTour;
 /* harmony default export */ var packages_tour = (VxeTour);
+;// ./packages/tree/src/util.ts
+
+function util_enNodeValue(nodeid) {
+  return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(nodeid) ? '' : encodeURIComponent(`${nodeid}`);
+}
+function util_deNodeValue(nodeid) {
+  return nodeid ? decodeURIComponent(`${nodeid}`) : nodeid;
+}
+function countTreeExpand($xeTree, prevNode) {
+  let count = 1;
+  if (!prevNode) {
+    return count;
+  }
+  const props = $xeTree.props;
+  const {
+    transform
+  } = props;
+  const reactData = $xeTree.reactData;
+  const {
+    updateExpandedFlag
+  } = reactData;
+  const internalData = $xeTree.internalData;
+  const {
+    treeExpandedMaps
+  } = internalData;
+  const {
+    computeChildrenField,
+    computeMapChildrenField
+  } = $xeTree.getComputeMaps();
+  const childrenField = computeChildrenField.value;
+  const mapChildrenField = computeMapChildrenField.value;
+  const nodeChildren = prevNode[transform ? mapChildrenField : childrenField];
+  if (nodeChildren && updateExpandedFlag && treeExpandedMaps[$xeTree.getNodeId(prevNode)]) {
+    for (let index = 0; index < nodeChildren.length; index++) {
+      count += countTreeExpand($xeTree, nodeChildren[index]);
+    }
+  }
+  return count;
+}
+function calcTreeLine($xeTree, node, prevNode) {
+  const internalData = $xeTree.internalData;
+  const {
+    scrollYStore
+  } = internalData;
+  const {
+    rowHeight
+  } = scrollYStore;
+  let expandSize = 1;
+  if (prevNode) {
+    expandSize = countTreeExpand($xeTree, prevNode);
+  }
+  return (rowHeight || 28) * expandSize - (prevNode ? 1 : 12);
+}
 ;// ./packages/tree/src/store.ts
 
 // 跨树拖拽
@@ -44525,7 +45705,7 @@ const {
 /**
  * 生成节点的唯一主键
  */
-function getNodeUniqueId() {
+function tree_getNodeUniqueId() {
   return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().uniqueId('node_');
 }
 function tree_createInternalData() {
@@ -44858,9 +46038,12 @@ function tree_createReactData() {
       getComputeMaps: () => computeMaps
     };
     const getNodeId = node => {
+      if (!node) {
+        return '';
+      }
       const valueField = computeValueField.value;
       const nodeKey = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(node, valueField);
-      return enNodeValue(nodeKey);
+      return util_enNodeValue(nodeKey);
     };
     const isExpandByNode = node => {
       const {
@@ -44921,7 +46104,7 @@ function tree_createReactData() {
         }
         const nodeList = [];
         nodeKeys.forEach(nodeKey => {
-          const nodeid = enNodeValue(nodeKey);
+          const nodeid = util_enNodeValue(nodeKey);
           const nodeItem = nodeMaps[nodeid];
           if (nodeItem) {
             nodeList.push(nodeItem.item);
@@ -45027,7 +46210,7 @@ function tree_createReactData() {
         };
         let nodeid = getNodeId(item);
         if (!nodeid) {
-          nodeid = getNodeUniqueId();
+          nodeid = tree_getNodeUniqueId();
           external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(item, valueField, nodeid);
         }
         return item;
@@ -45040,10 +46223,10 @@ function tree_createReactData() {
       const valueField = computeValueField.value;
       const childrenField = computeChildrenField.value;
       const keyMaps = {};
-      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(treeFullData, (item, index, items, path, parent, nodes) => {
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(treeFullData, (item, index, items, path, parenItem, nodes) => {
         let nodeid = getNodeId(item);
         if (!nodeid) {
-          nodeid = getNodeUniqueId();
+          nodeid = tree_getNodeUniqueId();
           external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().set(item, valueField, nodeid);
         }
         keyMaps[nodeid] = {
@@ -45052,7 +46235,7 @@ function tree_createReactData() {
           $index: -1,
           _index: -1,
           items,
-          parent,
+          parent: parenItem,
           nodes,
           level: nodes.length - 1,
           treeIndex: index,
@@ -45075,7 +46258,7 @@ function tree_createReactData() {
       const childrenField = computeChildrenField.value;
       const mapChildrenField = computeMapChildrenField.value;
       let vtIndex = 0;
-      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterTreeList, (item, index, items) => {
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(afterTreeList, (item, index, items, path, parenItem, nodes) => {
         const nodeid = getNodeId(item);
         const nodeItem = nodeMaps[nodeid];
         if (nodeItem) {
@@ -45089,9 +46272,9 @@ function tree_createReactData() {
             $index: -1,
             _index: vtIndex,
             items,
-            parent,
-            nodes: [],
-            level: 0,
+            parent: parenItem,
+            nodes,
+            level: nodes.length - 1,
             treeIndex: index,
             lineCount: 0,
             treeLoaded: false
@@ -45977,7 +47160,7 @@ function tree_createReactData() {
       reactData.updateCheckboxFlag++;
       updateCheckboxStatus();
       const nodeids = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().keys(selectCheckboxMaps);
-      const value = nodeids.map(deNodeValue);
+      const value = nodeids.map(util_deNodeValue);
       emitCheckboxMode(value);
       dispatchEvent('checkbox-change', {
         node,
@@ -46045,7 +47228,7 @@ function tree_createReactData() {
         return;
       }
       const isChecked = true;
-      const value = deNodeValue(nodeid);
+      const value = util_deNodeValue(nodeid);
       reactData.selectRadioKey = nodeid;
       emitRadioMode(value);
       dispatchEvent('radio-change', {
@@ -46091,7 +47274,7 @@ function tree_createReactData() {
           currentNode
         } = reactData;
         if (currentNode) {
-          return deNodeValue(getNodeId(currentNode));
+          return util_deNodeValue(getNodeId(currentNode));
         }
         return null;
       },
@@ -46114,7 +47297,7 @@ function tree_createReactData() {
         const {
           nodeMaps
         } = internalData;
-        const nodeItem = nodeMaps[enNodeValue(nodeKey)];
+        const nodeItem = nodeMaps[util_enNodeValue(nodeKey)];
         reactData.currentNode = nodeItem ? nodeItem.item : null;
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
       },
@@ -46146,7 +47329,7 @@ function tree_createReactData() {
         return null;
       },
       setRadioNodeId(nodeKey) {
-        reactData.selectRadioKey = enNodeValue(nodeKey);
+        reactData.selectRadioKey = util_enNodeValue(nodeKey);
         emitRadioMode(nodeKey);
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
       },
@@ -46154,7 +47337,7 @@ function tree_createReactData() {
         if (node) {
           const nodeid = getNodeId(node);
           reactData.selectRadioKey = nodeid;
-          emitRadioMode(deNodeValue(nodeid));
+          emitRadioMode(util_deNodeValue(nodeid));
         } else {
           emitRadioMode(null);
         }
@@ -46181,7 +47364,7 @@ function tree_createReactData() {
         } = internalData;
         const nodeKeys = [];
         external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(selectCheckboxMaps, (item, nodeId) => {
-          nodeKeys.push(deNodeValue(nodeId));
+          nodeKeys.push(util_deNodeValue(nodeId));
         });
         return nodeKeys;
       },
@@ -46279,7 +47462,7 @@ function tree_createReactData() {
             nodeKeys = [nodeKeys];
           }
           nodeKeys.forEach(nodeKey => {
-            const nodeid = enNodeValue(nodeKey);
+            const nodeid = util_enNodeValue(nodeKey);
             handleSetExpand(nodeid, expanded, treeExpandedMaps);
           });
           reactData.updateExpandedFlag++;
@@ -46294,7 +47477,7 @@ function tree_createReactData() {
         } = internalData;
         const nodeKeys = [];
         external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().each(treeExpandedMaps, (item, nodeId) => {
-          nodeKeys.push(deNodeValue(nodeId));
+          nodeKeys.push(util_deNodeValue(nodeId));
         });
         return nodeKeys;
       },
@@ -46339,7 +47522,7 @@ function tree_createReactData() {
             nodeKeys = [nodeKeys];
           }
           nodeKeys.forEach(nodeKey => {
-            const nodeid = enNodeValue(nodeKey);
+            const nodeid = util_enNodeValue(nodeKey);
             handleSetExpand(nodeid, !treeExpandedMaps[`${nodeid}`], treeExpandedMaps);
           });
           reactData.updateExpandedFlag++;
@@ -47263,7 +48446,7 @@ function tree_createReactData() {
       const extraSlot = slots.extra;
       const isExpand = updateExpandedFlag && treeExpandedMaps[nodeid];
       const nodeItem = nodeMaps[nodeid] || {};
-      const nodeValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(node, titleField);
+      const nodeTitle = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(node, titleField);
       const nLevel = nodeItem.level;
       let isRadioChecked = false;
       if (showRadio) {
@@ -47341,7 +48524,7 @@ function tree_createReactData() {
         class: 'vxe-tree--node-item-inner'
       }, [(0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-tree--node-item-title'
-      }, titleSlot ? vn_getSlotVNs(titleSlot(nParams)) : `${nodeValue}`), extraSlot ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
+      }, titleSlot ? vn_getSlotVNs(titleSlot(nParams)) : `${nodeTitle}`), extraSlot ? (0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('div', {
         class: 'vxe-tree--node-item-extra'
       }, vn_getSlotVNs(extraSlot(nParams))) : renderEmptyElement($xeTree)])])]);
     };
@@ -47493,11 +48676,20 @@ function tree_createReactData() {
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.data, () => {
       dataFlag.value++;
     });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.rootParentValue, () => {
+      dataFlag.value++;
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.rootValues ? props.rootValues.length : 0, () => {
+      dataFlag.value++;
+    });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.rootValues, () => {
+      dataFlag.value++;
+    });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(dataFlag, () => {
       loadData(props.data || []);
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.checkNodeKey, nodeKey => {
-      reactData.selectRadioKey = enNodeValue(nodeKey);
+      reactData.selectRadioKey = util_enNodeValue(nodeKey);
     });
     const checkboxFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.checkNodeKeys ? props.checkNodeKeys.length : 0, () => {
@@ -47525,19 +48717,6 @@ function tree_createReactData() {
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(hFlag, () => {
       recalculate();
     });
-    const rootConf = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.rootParentValue, () => {
-      rootConf.value++;
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.rootValues ? props.rootValues.length : 0, () => {
-      rootConf.value++;
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => props.rootValues, () => {
-      rootConf.value++;
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(rootConf, () => {
-      loadData(props.data || []);
-    });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
       const {
         transform,
@@ -47551,6 +48730,9 @@ function tree_createReactData() {
       if (dragOpts.isCrossTreeDrag) {
         errLog('vxe.error.notProp', ['drag-config.isCrossTreeDrag']);
       }
+      // if (valueField) {
+      //   errLog('vxe.error.delProp', ['value-field', 'value-field'])
+      // }
       const VxeUIContextMenu = VxeUI.getComponent('VxeContextMenu');
       if (menuConfig && !VxeUIContextMenu) {
         errLog('vxe.error.reqComp', ['vxe-context-menu']);
@@ -47584,7 +48766,7 @@ function tree_createReactData() {
       external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(reactData, tree_createReactData());
       external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(internalData, tree_createInternalData());
     });
-    reactData.selectRadioKey = enNodeValue(props.checkNodeKey);
+    reactData.selectRadioKey = util_enNodeValue(props.checkNodeKey);
     loadData(props.data || []);
     $xeTree.renderVN = renderVN;
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.provide)('$xeTree', $xeTree);
@@ -47804,14 +48986,14 @@ function tree_select_createInternalData() {
       return disabled;
     });
     const computeBtnTransfer = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const popupOpts = computePopupOpts.value;
       const {
         transfer
-      } = props;
-      const popupOpts = computePopupOpts.value;
-      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(popupOpts.transfer)) {
-        return popupOpts.transfer;
+      } = popupOpts;
+      if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(transfer)) {
+        return transfer;
       }
-      if (transfer === null) {
+      if (props.transfer === null) {
         const globalTransfer = getConfig().treeSelect.transfer;
         if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(globalTransfer)) {
           return globalTransfer;
@@ -47820,7 +49002,7 @@ function tree_select_createInternalData() {
           return true;
         }
       }
-      return transfer;
+      return props.transfer;
     });
     const computePopupOpts = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       return Object.assign({}, getConfig().treeSelect.popupConfig, props.popupConfig);
@@ -47893,9 +49075,14 @@ function tree_select_createInternalData() {
       const treeOpts = computeTreeOpts.value;
       return Object.assign({}, treeOpts.filterConfig, props.filterConfig);
     });
+    const computeSelectVals = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
+      const {
+        modelValue
+      } = props;
+      return external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(modelValue) ? [] : external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(modelValue) ? modelValue : [modelValue];
+    });
     const computeSelectLabel = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.computed)(() => {
       const {
-        modelValue,
         showFullLabel
       } = props;
       const {
@@ -47907,7 +49094,7 @@ function tree_select_createInternalData() {
         lazyNodeMaps
       } = internalData;
       const labelField = computeLabelField.value;
-      const selectVals = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eqNull(modelValue) ? [] : external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(modelValue) ? modelValue : [modelValue];
+      const selectVals = computeSelectVals.value;
       return selectVals.map(val => {
         const cacheItem = fullNodeMaps[val];
         if (fullOptFlag && cacheItem) {
@@ -47996,12 +49183,12 @@ function tree_select_createInternalData() {
           nodeid = tree_select_getOptUniqueId();
         }
         if (keyMaps[nodeid]) {
-          errLog('vxe.error.repeatKey', [`[tree-select] ${nodeKeyField}`, nodeid]);
+          errLog('vxe.error.repeatKey', [nodeKeyField, nodeid]);
         }
         keyMaps[nodeid] = true;
         const value = item[valueField];
         if (nodeMaps[value]) {
-          errLog('vxe.error.repeatKey', [`[tree-select] ${valueField}`, value]);
+          errLog('vxe.error.repeatKey', [valueField, value]);
         }
         nodeMaps[value] = {
           item,
@@ -48009,7 +49196,7 @@ function tree_select_createInternalData() {
           items,
           parent: parentItem,
           nodes,
-          fullLabel: nodes.map(item => item[labelField]).join((separator || '/') + ' ')
+          fullLabel: nodes.map(item => item[labelField]).join(separator || ' / ')
         };
       };
       if (optList) {
@@ -48088,7 +49275,7 @@ function tree_select_createInternalData() {
       handleStyle();
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)().then(handleStyle);
     };
-    const showOptionPanel = () => {
+    const showOptionPanel = evnt => {
       const {
         loading,
         remote,
@@ -48120,7 +49307,7 @@ function tree_select_createInternalData() {
         updatePlacement();
         dispatchEvent('visible-change', {
           visible: true
-        }, null);
+        }, evnt || null);
       }
     };
     const hideOptionPanel = evnt => {
@@ -48133,7 +49320,7 @@ function tree_select_createInternalData() {
       }, evnt || null);
     };
     const changeEvent = (evnt, selectValue, node) => {
-      const value = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(selectValue) ? selectValue.map(deNodeValue) : deNodeValue(selectValue);
+      const value = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isArray(selectValue) ? selectValue.map(util_deNodeValue) : util_deNodeValue(selectValue);
       emitModel(value);
       if (value !== props.modelValue) {
         dispatchEvent('change', {
@@ -48180,7 +49367,7 @@ function tree_select_createInternalData() {
             dispatchEvent('all-change', {
               value: checkNodeKeys
             }, $event);
-            if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(autoClose) ? autoClose : checkedClosable) {
+            if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(checkedClosable) ? checkedClosable : autoClose) {
               hideOptionPanel($event);
             }
           });
@@ -48200,7 +49387,7 @@ function tree_select_createInternalData() {
       if ($tree) {
         const value = multiple ? [] : null;
         $tree.clearCheckboxNode().then(() => {
-          if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(autoClose) ? autoClose : clearClosable) {
+          if (external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isBoolean(clearClosable) ? clearClosable : autoClose) {
             hideOptionPanel($event);
           }
         });
@@ -48299,7 +49486,7 @@ function tree_select_createInternalData() {
       if (!isDisabled) {
         if (!reactData.visiblePanel) {
           reactData.triggerFocusPanel = true;
-          showOptionPanel();
+          showOptionPanel(evnt);
           setTimeout(() => {
             reactData.triggerFocusPanel = false;
           }, 150);
@@ -48351,7 +49538,7 @@ function tree_select_createInternalData() {
         if (reactData.visiblePanel) {
           hideOptionPanel($event);
         } else {
-          showOptionPanel();
+          showOptionPanel($event);
         }
       }
     };