vxe-pc-ui 4.15.16 → 4.15.18

package/dist/all.esm.js

@@ -81,7 +81,7 @@ function checkDynamic() {
 }
 
 const { log } = VxeUI;
-const uiVersion = `ui v${"4.15.16"}`;
+const uiVersion = `ui v${"4.15.18"}`;
 function createComponentLog(name) {
     const tableVersion = VxeUI.tableVersion ? `table v${VxeUI.tableVersion}` : '';
     const ganttVersion = VxeUI.ganttVersion ? `gantt v${VxeUI.ganttVersion}` : '';
@@ -95,7 +95,7 @@ function createComponentLog(name) {
 const warnLog$c = log.create('warn', uiVersion);
 log.create('error', uiVersion);
 
-const version = "4.15.16";
+const version = "4.15.18";
 VxeUI.uiVersion = version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -512,9 +512,16 @@ setConfig$1({
         // autoResize: false,
         indent: 20,
         minHeight: 60,
+        showOverflow: true,
         radioConfig: {
             strict: true
         },
+        tooltipConfig: {
+            mode: 'tooltip',
+            enterable: true,
+            leaveDelay: 300,
+            defaultPlacement: 'top'
+        },
         dragConfig: {
             showIcon: true,
             animation: true,
@@ -1066,7 +1073,8 @@ var zhCN = {
             cancelFixed: '取消冻结列'
         },
         iconPicker: {
-            search: '搜索'
+            search: '搜索',
+            emptyText: '暂无数据'
         },
         datePicker: {
             yearTitle: '{0} 年'
@@ -8341,6 +8349,15 @@ var VxeListComponent = defineVxeComponent({
     }
 });
 
+const VxeList = Object.assign(VxeListComponent, {
+    install(app) {
+        app.component(VxeListComponent.name, VxeListComponent);
+    }
+});
+dynamicApp.use(VxeList);
+VxeUI.component(VxeListComponent);
+const List = VxeList;
+
 function handleNumber(val) {
     return XEUtils.isString(val) ? val.replace(/[^0-9e.-]/g, '') : val;
 }
@@ -11038,6 +11055,15 @@ var VxeInputComponent = defineVxeComponent({
     }
 });
 
+const VxeInput = Object.assign(VxeInputComponent, {
+    install(app) {
+        app.component(VxeInputComponent.name, VxeInputComponent);
+    }
+});
+dynamicApp.use(VxeInput);
+VxeUI.component(VxeInputComponent);
+const Input = VxeInput;
+
 /**
  * 生成节点的唯一主键
  */
@@ -12584,7 +12610,7 @@ var VxeCascaderComponent = defineVxeComponent({
                         'is--active': isActivated
                     }]
             }, [
-                h(VxeInputComponent, {
+                h(VxeInput, {
                     ref: refInput,
                     clearable: props.clearable,
                     placeholder: loading ? getI18n$2('vxe.select.loadingText') : props.placeholder,
@@ -12628,7 +12654,7 @@ var VxeCascaderComponent = defineVxeComponent({
                                     ? h('div', {
                                         class: 'vxe-cascader--panel-search'
                                     }, [
-                                        h(VxeInputComponent, {
+                                        h(VxeInput, {
                                             ref: refInpSearch,
                                             class: 'vxe-cascader-search--input',
                                             modelValue: searchValue,
@@ -12655,14 +12681,14 @@ var VxeCascaderComponent = defineVxeComponent({
                                                         class: 'vxe-cascader--selected-btns'
                                                     }, [
                                                         (showCheckedButton && multiple)
-                                                            ? h(VxeButtonComponent, {
+                                                            ? h(VxeButton, {
                                                                 content: getI18n$2('vxe.treeSelect.allChecked'),
                                                                 mode: 'text',
                                                                 onClick: allCheckedPanelEvent
                                                             })
                                                             : renderEmptyElement($xeCascader),
                                                         showClearButton
-                                                            ? h(VxeButtonComponent, {
+                                                            ? h(VxeButton, {
                                                                 content: getI18n$2('vxe.treeSelect.clearChecked'),
                                                                 mode: 'text',
                                                                 onClick: clearCheckedPanelEvent
@@ -12685,7 +12711,7 @@ var VxeCascaderComponent = defineVxeComponent({
                                                 key: chunkIndex,
                                                 class: 'vxe-cascader-chunk--item-wrapper'
                                             }, [
-                                                h(VxeListComponent, {
+                                                h(VxeList, {
                                                     data: chunks,
                                                     virtualYConfig: listVirtualYOpts
                                                 }, {
@@ -12719,7 +12745,7 @@ var VxeCascaderComponent = defineVxeComponent({
                                                     ? h('div', {
                                                         class: 'vxe-cascader--oper-btns'
                                                     }, [
-                                                        h(VxeButtonComponent, {
+                                                        h(VxeButton, {
                                                             content: getI18n$2('vxe.select.close'),
                                                             mode: 'text',
                                                             onClick: closePanelEvent
@@ -15110,6 +15136,15 @@ var VxeNumberInputComponent = defineVxeComponent({
     }
 });
 
+const VxeNumberInput = Object.assign({}, VxeNumberInputComponent, {
+    install(app) {
+        app.component(VxeNumberInputComponent.name, VxeNumberInputComponent);
+    }
+});
+dynamicApp.use(VxeNumberInput);
+VxeUI.component(VxeNumberInputComponent);
+const NumberInput = VxeNumberInput;
+
 var VxeColorPickerComponent = defineVxeComponent({
     name: 'VxeColorPicker',
     props: {
@@ -15882,7 +15917,7 @@ var VxeColorPickerComponent = defineVxeComponent({
                             h('div', {
                                 class: 'vxe-color-picker--input-wrapper'
                             }, [
-                                h(VxeNumberInputComponent, {
+                                h(VxeNumberInput, {
                                     type: 'integer',
                                     size: 'mini',
                                     align: 'center',
@@ -15899,7 +15934,7 @@ var VxeColorPickerComponent = defineVxeComponent({
                                     },
                                     onChange: handleInputRgbEvent
                                 }),
-                                h(VxeNumberInputComponent, {
+                                h(VxeNumberInput, {
                                     type: 'integer',
                                     size: 'mini',
                                     align: 'center',
@@ -15916,7 +15951,7 @@ var VxeColorPickerComponent = defineVxeComponent({
                                     },
                                     onChange: handleInputRgbEvent
                                 }),
-                                h(VxeNumberInputComponent, {
+                                h(VxeNumberInput, {
                                     type: 'integer',
                                     size: 'mini',
                                     align: 'center',
@@ -15933,7 +15968,7 @@ var VxeColorPickerComponent = defineVxeComponent({
                                     },
                                     onChange: handleInputRgbEvent
                                 }),
-                                h(VxeNumberInputComponent, {
+                                h(VxeNumberInput, {
                                     type: 'number',
                                     size: 'mini',
                                     align: 'center',
@@ -15965,7 +16000,7 @@ var VxeColorPickerComponent = defineVxeComponent({
                             h('div', {
                                 class: 'vxe-color-picker--input-wrapper'
                             }, [
-                                h(VxeInputComponent, {
+                                h(VxeInput, {
                                     type: 'text',
                                     size: 'mini',
                                     align: 'center',
@@ -16089,13 +16124,13 @@ var VxeColorPickerComponent = defineVxeComponent({
                                     class: 'vxe-color-picker--footer-wrapper'
                                 }, [
                                     clearable
-                                        ? h(VxeButtonComponent, {
+                                        ? h(VxeButton, {
                                             content: getI18n$2('vxe.colorPicker.clear'),
                                             size: 'mini',
                                             onClick: clearEvent
                                         })
                                         : renderEmptyElement($xeColorPicker),
-                                    h(VxeButtonComponent, {
+                                    h(VxeButton, {
                                         content: getI18n$2('vxe.colorPicker.confirm'),
                                         size: 'mini',
                                         status: 'primary',
@@ -21575,7 +21610,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                 return h('div', {
                     class: `vxe-date-range-picker--layout-${pos}-wrapper`
                 }, [
-                    h(VxeButtonGroupComponent, {
+                    h(VxeButtonGroup, {
                         options: shortcutList,
                         mode,
                         align,
@@ -21667,7 +21702,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                                     h('div', {
                                         class: 'vxe-date-range-picker--layout-body-wrapper'
                                     }, [
-                                        h(VxeDatePanelComponent, {
+                                        h(VxeDatePanel, {
                                             ref: refStartDatePanel,
                                             modelValue: startValue,
                                             type: props.type,
@@ -21691,7 +21726,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                                             onDateToday: startPanelDateBtnChangeEvent,
                                             onDateNext: startPanelDateBtnChangeEvent
                                         }),
-                                        h(VxeDatePanelComponent, {
+                                        h(VxeDatePanel, {
                                             ref: refEndDatePanel,
                                             modelValue: endValue,
                                             type: props.type,
@@ -21735,7 +21770,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                                             class: 'vxe-date-range-picker--layout-footer-btns'
                                         }, [
                                             showClearBtn
-                                                ? h(VxeButtonComponent, {
+                                                ? h(VxeButton, {
                                                     size: 'mini',
                                                     disabled: !(startValue || endValue),
                                                     content: getI18n$2('vxe.button.clear'),
@@ -21743,7 +21778,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                                                 })
                                                 : renderEmptyElement($xeDateRangePicker),
                                             showConfirmBtn
-                                                ? h(VxeButtonComponent, {
+                                                ? h(VxeButton, {
                                                     size: 'mini',
                                                     status: 'primary',
                                                     content: getI18n$2('vxe.button.confirm'),
@@ -22437,7 +22472,7 @@ var VxeDrawerComponent = defineVxeComponent({
             const rfSlot = slots.rightfoot || propSlots.rightfoot;
             const btnVNs = [];
             if (showCancelButton) {
-                btnVNs.push(h(VxeButtonComponent, {
+                btnVNs.push(h(VxeButton, {
                     key: 1,
                     ref: refCancelBtn,
                     content: props.cancelButtonText || getI18n$2('vxe.button.cancel'),
@@ -22445,7 +22480,7 @@ var VxeDrawerComponent = defineVxeComponent({
                 }));
             }
             if (showConfirmButton) {
-                btnVNs.push(h(VxeButtonComponent, {
+                btnVNs.push(h(VxeButton, {
                     key: 2,
                     ref: refConfirmBtn,
                     loading: loading,
@@ -22923,11 +22958,20 @@ var VxeIconComponent = defineVxeComponent({
     }
 });
 
+const VxeIcon = Object.assign({}, VxeIconComponent, {
+    install(app) {
+        app.component(VxeIconComponent.name, VxeIconComponent);
+    }
+});
+dynamicApp.use(VxeIcon);
+VxeUI.component(VxeIconComponent);
+const Icon = VxeIcon;
+
 function renderPrefixIcon(titlePrefix) {
     return h('span', {
         class: 'vxe-form--item-title-tip-prefix'
     }, [
-        h(VxeIconComponent, {
+        h(VxeIcon, {
             class: titlePrefix.icon || getIcon$2().FORM_PREFIX,
             status: titlePrefix.iconStatus
         })
@@ -22937,7 +22981,7 @@ function renderSuffixIcon(titleSuffix) {
     return h('span', {
         class: 'vxe-form--item-title-tip-suffix'
     }, [
-        h(VxeIconComponent, {
+        h(VxeIcon, {
             class: titleSuffix.icon || getIcon$2().FORM_SUFFIX,
             status: titleSuffix.iconStatus
         })
@@ -23055,7 +23099,7 @@ function renderTitle($xeForm, item, isGroup) {
     }
     if (titlePrefix) {
         titVNs.push((titlePrefix.content || titlePrefix.message)
-            ? h(VxeTooltipComponent, Object.assign(Object.assign(Object.assign({ key: 'pm' }, tooltipOpts), titlePrefix), { content: getFuncText(titlePrefix.content || titlePrefix.message) }), {
+            ? h(VxeTooltip, Object.assign(Object.assign(Object.assign({ key: 'pm' }, tooltipOpts), titlePrefix), { content: getFuncText(titlePrefix.content || titlePrefix.message) }), {
                 default: () => renderPrefixIcon(titlePrefix)
             })
             : renderPrefixIcon(titlePrefix));
@@ -23068,7 +23112,7 @@ function renderTitle($xeForm, item, isGroup) {
     const fixVNs = [];
     if (titleSuffix) {
         fixVNs.push((titleSuffix.content || titleSuffix.message)
-            ? h(VxeTooltipComponent, Object.assign(Object.assign(Object.assign({ key: 'sm' }, tooltipOpts), titleSuffix), { content: getFuncText(titleSuffix.content || titleSuffix.message) }), {
+            ? h(VxeTooltip, Object.assign(Object.assign(Object.assign({ key: 'sm' }, tooltipOpts), titleSuffix), { content: getFuncText(titleSuffix.content || titleSuffix.message) }), {
                 default: () => renderSuffixIcon(titleSuffix)
             })
             : renderSuffixIcon(titleSuffix));
@@ -25040,15 +25084,6 @@ dynamicApp.use(VxeFormItem);
 VxeUI.component(VxeFormItemComponent);
 const FormItem = VxeFormItem;
 
-const VxeIcon = Object.assign({}, VxeIconComponent, {
-    install(app) {
-        app.component(VxeIconComponent.name, VxeIconComponent);
-    }
-});
-dynamicApp.use(VxeIcon);
-VxeUI.component(VxeIconComponent);
-const Icon = VxeIcon;
-
 function createReactData$b() {
     return {
         initialized: false,
@@ -25199,7 +25234,7 @@ var VxeIconPickerComponent = defineVxeComponent({
             if (height) {
                 stys['--vxe-ui-icon-picker-panel-height'] = toCssUnit(height);
             }
-            else if (maxHeight) {
+            if (maxHeight) {
                 stys['--vxe-ui-icon-picker-panel-max-height'] = toCssUnit(maxHeight);
             }
             return stys;
@@ -25283,6 +25318,7 @@ var VxeIconPickerComponent = defineVxeComponent({
                 reactData.isAniVisible = true;
                 setTimeout(() => {
                     reactData.visiblePanel = true;
+                    handleFocusSearch();
                     updatePlacement();
                 }, 10);
                 updateZindex();
@@ -25295,6 +25331,16 @@ var VxeIconPickerComponent = defineVxeComponent({
                 reactData.isAniVisible = false;
             }, 350);
         };
+        const handleFocusSearch = () => {
+            if (props.filterable) {
+                nextTick(() => {
+                    const inpSearch = refInpSearch.value;
+                    if (inpSearch) {
+                        inpSearch.focus();
+                    }
+                });
+            }
+        };
         const handleData = () => {
             const { modelValue } = props;
             const { searchValue } = reactData;
@@ -25513,6 +25559,11 @@ var VxeIconPickerComponent = defineVxeComponent({
         const renderIconWrapper = () => {
             const { showIconTitle } = props;
             const { selectIcon, iconGroups } = reactData;
+            if (!iconGroups.length) {
+                return h('div', {
+                    class: 'vxe-ico-picker--empty-placeholder'
+                }, getI18n$2('vxe.iconPicker.emptyText'));
+            }
             return h('div', {
                 class: 'vxe-ico-picker--list-wrapper'
             }, iconGroups.map(list => {
@@ -26836,15 +26887,6 @@ dynamicApp.use(VxeImagePreview);
 VxeUI.component(VxeImagePreviewComponent);
 const ImagePreview = VxeImagePreview;
 
-const VxeInput = Object.assign(VxeInputComponent, {
-    install(app) {
-        app.component(VxeInputComponent.name, VxeInputComponent);
-    }
-});
-dynamicApp.use(VxeInput);
-VxeUI.component(VxeInputComponent);
-const Input = VxeInput;
-
 var VxeLayoutAsideComponent = defineVxeComponent({
     name: 'VxeLayoutAside',
     props: {
@@ -26933,7 +26975,7 @@ var VxeLayoutAsideComponent = defineVxeComponent({
                 /**
                  * 加载中
                  */
-                h(VxeLoadingComponent, {
+                h(VxeLoading, {
                     class: 'vxe-list-view--loading',
                     modelValue: loading
                 })
@@ -27401,15 +27443,6 @@ dynamicApp.use(VxeLink);
 VxeUI.component(VxeLinkComponent);
 const Link = VxeLink;
 
-const VxeList = Object.assign(VxeListComponent, {
-    install(app) {
-        app.component(VxeListComponent.name, VxeListComponent);
-    }
-});
-dynamicApp.use(VxeList);
-VxeUI.component(VxeListComponent);
-const List = VxeList;
-
 const { errLog: errLog$9 } = createComponentLog('menu');
 const { menus: menus$1, getConfig: getConfig$1, getIcon: getIcon$1 } = VxeUI;
 var VxeMenuComponent = defineVxeComponent({
@@ -29187,7 +29220,7 @@ var VxeModalComponent = defineVxeComponent({
             const rfSlot = slots.rightfoot || propSlots.rightfoot;
             const btnVNs = [];
             if (XEUtils.isBoolean(showCancelButton) ? showCancelButton : type === 'confirm') {
-                btnVNs.push(h(VxeButtonComponent, {
+                btnVNs.push(h(VxeButton, {
                     key: 1,
                     ref: refCancelBtn,
                     content: props.cancelButtonText || getI18n$2('vxe.button.cancel'),
@@ -29195,7 +29228,7 @@ var VxeModalComponent = defineVxeComponent({
                 }));
             }
             if (XEUtils.isBoolean(showConfirmButton) ? showConfirmButton : (type === 'confirm' || type === 'alert')) {
-                btnVNs.push(h(VxeButtonComponent, {
+                btnVNs.push(h(VxeButton, {
                     key: 2,
                     ref: refConfirmBtn,
                     loading: loading,
@@ -29621,15 +29654,6 @@ dynamicApp.use(VxeNoticeBar);
 VxeUI.component(VxeNoticeBarComponent);
 const NoticeBar = VxeNoticeBar;
 
-const VxeNumberInput = Object.assign({}, VxeNumberInputComponent, {
-    install(app) {
-        app.component(VxeNumberInputComponent.name, VxeNumberInputComponent);
-    }
-});
-dynamicApp.use(VxeNumberInput);
-VxeUI.component(VxeNumberInputComponent);
-const NumberInput = VxeNumberInput;
-
 class OptionInfo {
     constructor($xeselect, _vm) {
         Object.assign(this, {
@@ -31512,6 +31536,15 @@ var VxeSelectComponent = defineVxeComponent({
     }
 });
 
+const VxeSelect = Object.assign(VxeSelectComponent, {
+    install: function (app) {
+        app.component(VxeSelectComponent.name, VxeSelectComponent);
+    }
+});
+dynamicApp.use(VxeSelect);
+VxeUI.component(VxeSelectComponent);
+const Select = VxeSelect;
+
 const { warnLog: warnLog$6, errLog: errLog$6 } = createComponentLog('pager');
 var VxePagerComponent = defineVxeComponent({
     name: 'VxePager',
@@ -31960,7 +31993,7 @@ var VxePagerComponent = defineVxeComponent({
                     class: 'vxe-pager--custom-sizes'
                 }, sizesSlot({ $pager: $xePager, total, currentPage, pageCount, pageSize, options: sizeList }));
             }
-            return h(VxeSelectComponent, {
+            return h(VxeSelect, {
                 class: 'vxe-pager--sizes',
                 modelValue: pageSize,
                 placement: pageSizePlacement,
@@ -31988,7 +32021,7 @@ var VxePagerComponent = defineVxeComponent({
                         class: 'vxe-pager--goto-text'
                     }, getI18n$2('vxe.pager.goto'))
                     : null,
-                h(VxeNumberInputComponent, {
+                h(VxeNumberInput, {
                     class: 'vxe-pager--goto',
                     modelValue: reactData.inpCurrPage,
                     placeholder: getI18n$2('vxe.pager.gotoTitle'),
@@ -34747,15 +34780,6 @@ dynamicApp.use(VxeSegmented);
 VxeUI.component(VxeSegmentedComponent);
 const Segmented = VxeSegmented;
 
-const VxeSelect = Object.assign(VxeSelectComponent, {
-    install: function (app) {
-        app.component(VxeSelectComponent.name, VxeSelectComponent);
-    }
-});
-dynamicApp.use(VxeSelect);
-VxeUI.component(VxeSelectComponent);
-const Select = VxeSelect;
-
 const { warnLog: warnLog$5, errLog: errLog$5 } = createComponentLog('splitter');
 var VxeSplitComponent = defineVxeComponent({
     name: 'VxeSplitter',
@@ -39518,7 +39542,11 @@ function createReactData$2() {
         removeNodeFlag: 1,
         dragNode: null,
         dragTipText: '',
-        isCrossDragNode: false
+        isCrossDragNode: false,
+        tooltipStore: {
+            visible: false,
+            node: null
+        }
     };
 }
 let crossTreeDragNodeObj = null;
@@ -39605,6 +39633,11 @@ var VxeTreeComponent = defineVxeComponent({
         lazy: Boolean,
         toggleMethod: Function,
         loadMethod: Function,
+        showOverflow: {
+            type: Boolean,
+            default: () => getConfig().tree.showOverflow
+        },
+        tooltipConfig: Object,
         drag: {
             type: Boolean,
             default: () => getConfig().tree.drag
@@ -39675,6 +39708,7 @@ var VxeTreeComponent = defineVxeComponent({
         const refVirtualBody = ref();
         const refDragNodeLineElem = ref();
         const refDragTipElem = ref();
+        const refTooltip = ref();
         const crossTreeDragNodeInfo = getCrossTreeDragNodeInfo();
         const internalData = createInternalData$2();
         const reactData = reactive(createReactData$2());
@@ -39737,6 +39771,9 @@ var VxeTreeComponent = defineVxeComponent({
         const computeDragOpts = computed(() => {
             return Object.assign({}, getConfig().tree.dragConfig, props.dragConfig);
         });
+        const computeTooltipOpts = computed(() => {
+            return Object.assign({}, getConfig().tree.tooltipConfig, props.tooltipConfig);
+        });
         const computeMenuOpts = computed(() => {
             return Object.assign({}, getConfig().tree.menuConfig, props.menuConfig);
         });
@@ -40410,6 +40447,101 @@ var VxeTreeComponent = defineVxeComponent({
         const handleNodeDblclickEvent = (evnt, node) => {
             dispatchEvent('node-dblclick', { node }, evnt);
         };
+        const handleNodeMouseenterEvent = (evnt, node) => {
+            const $tooltip = refTooltip.value;
+            if (!$tooltip) {
+                return;
+            }
+            const { tooltipStore } = reactData;
+            const { tipTimeout } = internalData;
+            const nodeEl = evnt.currentTarget;
+            const tooltipOpts = computeTooltipOpts.value;
+            const { showAll, contentMethod } = tooltipOpts;
+            if (tipTimeout) {
+                clearTimeout(tipTimeout);
+                internalData.tipTimeout = undefined;
+            }
+            const titleEl = nodeEl.querySelector('.vxe-tree--node-item-title');
+            const tipOverEl = nodeEl.querySelector('.vxe-tree--node-item-wrapper');
+            if (!tipOverEl) {
+                return;
+            }
+            const cellText = XEUtils.toString(tipOverEl.textContent).trim();
+            const isOver = tipOverEl.scrollWidth > tipOverEl.clientWidth;
+            let isShow = false;
+            let customContent = null;
+            let content = '';
+            if (contentMethod) {
+                customContent = contentMethod({ node, $event: evnt, $tree: $xeTree });
+            }
+            // 是否全部展示
+            if (showAll) {
+                // 如果为 null 默认显示
+                if (XEUtils.eqNull(customContent)) {
+                    isShow = true;
+                    content = cellText;
+                }
+                else if (customContent !== '' && customContent !== false) {
+                    // 如果为 '' | false 则不显示
+                    isShow = true;
+                    content = '' + customContent;
+                }
+            }
+            else {
+                // 如果为 null 使用默认逻辑
+                if (XEUtils.eqNull(customContent)) {
+                    isShow = isOver;
+                    content = cellText;
+                }
+                else if (customContent !== '' && customContent !== false) {
+                    // 如果为 '' | false 则不显示
+                    isShow = true;
+                    content = '' + customContent;
+                }
+                else {
+                    content = cellText;
+                }
+            }
+            if (isShow && content) {
+                const tipContent = getText(content);
+                tooltipStore.visible = true;
+                tooltipStore.node = node;
+                if ($tooltip.open) {
+                    $tooltip.open((isOver ? tipOverEl : titleEl) || tipOverEl, tipContent);
+                }
+            }
+        };
+        const handleNodeMouseleaveEvent = () => {
+            let $tooltip = refTooltip.value;
+            const tooltipOpts = computeTooltipOpts.value;
+            if ($tooltip && $tooltip.setActived) {
+                $tooltip.setActived(false);
+            }
+            if (tooltipOpts.enterable) {
+                internalData.tipTimeout = setTimeout(() => {
+                    $tooltip = refTooltip.value;
+                    if ($tooltip && $tooltip.isActived && !$tooltip.isActived()) {
+                        closeTooltip();
+                    }
+                    internalData.tipTimeout = undefined;
+                }, tooltipOpts.leaveDelay);
+            }
+            else {
+                closeTooltip();
+            }
+        };
+        const closeTooltip = () => {
+            const { tooltipStore } = reactData;
+            if (tooltipStore.visible) {
+                tooltipStore.visible = false;
+                tooltipStore.node = null;
+                const $tooltip = refTooltip.value;
+                if ($tooltip) {
+                    $tooltip.close();
+                }
+            }
+            return nextTick();
+        };
         const handleContextmenuEvent = (evnt, node) => {
             const { menuConfig } = props;
             const isNodeCurrent = computeIsNodeCurrent.value;
@@ -41480,7 +41612,8 @@ var VxeTreeComponent = defineVxeComponent({
             isRemoveByNode(node) {
                 const nodeid = getNodeId(node);
                 return !!reactData.removeNodeFlag && !!internalData.removeNodeMaps[nodeid];
-            }
+            },
+            closeTooltip
         };
         const handleNodeDragEndClearStatus = () => {
             clearNodeDragData();
@@ -42309,6 +42442,8 @@ var VxeTreeComponent = defineVxeComponent({
             const { lazy, drag, transform, showRadio, showCheckbox, showLine, iconOpen, iconClose, iconLoaded, showIcon } = props;
             const { currentNode, selectRadioKey, updateExpandedFlag } = reactData;
             const { afterTreeList, nodeMaps, treeExpandedMaps, treeExpandLazyLoadedMaps } = internalData;
+            const tooltipOpts = computeTooltipOpts.value;
+            const { mode: tipMode } = tooltipOpts;
             const childrenField = computeChildrenField.value;
             const titleField = computeTitleField.value;
             const hasChildField = computeHasChildField.value;
@@ -42319,7 +42454,7 @@ var VxeTreeComponent = defineVxeComponent({
             const extraSlot = slots.extra;
             const isExpand = updateExpandedFlag && treeExpandedMaps[nodeid];
             const nodeItem = nodeMaps[nodeid] || {};
-            const nodeTitle = XEUtils.get(node, titleField);
+            const nodeTitle = getText(XEUtils.get(node, titleField));
             const nLevel = nodeItem.level;
             let isRadioChecked = false;
             if (showRadio) {
@@ -42341,7 +42476,7 @@ var VxeTreeComponent = defineVxeComponent({
             }
             const prevNode = nodeItem.items[nodeItem.treeIndex - 1];
             const nParams = { node, isExpand };
-            const itemOn = {
+            const itemOns = {
                 onMousedown(evnt) {
                     handleNodeMousedownEvent(evnt, node);
                 },
@@ -42356,13 +42491,19 @@ var VxeTreeComponent = defineVxeComponent({
                     handleContextmenuEvent(evnt, node);
                 }
             };
+            if (tipMode === 'tooltip') {
+                itemOns.onMouseenter = (evnt) => {
+                    handleNodeMouseenterEvent(evnt, node);
+                };
+                itemOns.onMouseleave = handleNodeMouseleaveEvent;
+            }
             // 拖拽行事件
             if (drag && transform) {
-                itemOn.onDragstart = handleNodeDragDragstartEvent;
-                itemOn.onDragend = handleNodeDragDragendEvent;
-                itemOn.onDragover = handleNodeDragDragoverEvent;
+                itemOns.onDragstart = handleNodeDragDragstartEvent;
+                itemOns.onDragend = handleNodeDragDragendEvent;
+                itemOns.onDragover = handleNodeDragDragoverEvent;
             }
-            return h('div', Object.assign({ key: nodeid, class: ['vxe-tree--node-wrapper', `node--level-${nLevel}`], nodeid }, itemOn), [
+            return h('div', Object.assign({ key: nodeid, class: ['vxe-tree--node-wrapper', `node--level-${nLevel}`], nodeid, title: tipMode === 'title' ? nodeTitle : '' }, itemOns), [
                 h('div', {
                     class: ['vxe-tree--node-item', {
                             'is--current': currentNode && nodeid === getNodeId(currentNode),
@@ -42408,8 +42549,12 @@ var VxeTreeComponent = defineVxeComponent({
                         class: 'vxe-tree--node-item-inner'
                     }, [
                         h('div', {
-                            class: 'vxe-tree--node-item-title'
-                        }, titleSlot ? getSlotVNs(titleSlot(nParams)) : `${nodeTitle}`),
+                            class: 'vxe-tree--node-item-wrapper'
+                        }, [
+                            h('span', {
+                                class: 'vxe-tree--node-item-title'
+                            }, titleSlot ? getSlotVNs(titleSlot(nParams)) : nodeTitle)
+                        ]),
                         extraSlot
                             ? h('div', {
                                 class: 'vxe-tree--node-item-extra'
@@ -42495,7 +42640,7 @@ var VxeTreeComponent = defineVxeComponent({
         };
         const renderVN = () => {
             const { loading, trigger, showLine } = props;
-            const { bodyHeight, topSpaceHeight, treeList } = reactData;
+            const { bodyHeight, topSpaceHeight, treeList, tooltipStore } = reactData;
             const vSize = computeSize.value;
             const radioOpts = computeRadioOpts.value;
             const checkboxOpts = computeCheckboxOpts.value;
@@ -42503,9 +42648,11 @@ var VxeTreeComponent = defineVxeComponent({
             const isNodeHover = computeIsNodeHover.value;
             const treeStyle = computeTreeStyle.value;
             const dragOpts = computeDragOpts.value;
+            const tooltipOpts = computeTooltipOpts.value;
             const loadingSlot = slots.loading;
             const headerSlot = slots.header;
             const footerSlot = slots.footer;
+            const tooltipSlot = slots.tooltip;
             const teOns = {};
             if (dragOpts.isCrossTreeDrag && !treeList.length) {
                 teOns.onDragover = $xeTree.handleCrossTreeNodeDragoverEmptyEvent;
@@ -42555,6 +42702,35 @@ var VxeTreeComponent = defineVxeComponent({
                  * 拖拽提示
                  */
                 renderDragTip(),
+                /**
+                  * 工具提示
+                  */
+                tooltipOpts.mode === 'tooltip'
+                    ? h(VxeTooltip, {
+                        ref: refTooltip,
+                        theme: tooltipOpts.theme,
+                        enterable: tooltipOpts.enterable,
+                        enterDelay: tooltipOpts.enterDelay,
+                        leaveDelay: tooltipOpts.leaveDelay,
+                        useHtml: tooltipOpts.useHtml,
+                        width: tooltipOpts.width,
+                        height: tooltipOpts.height,
+                        minWidth: tooltipOpts.minWidth,
+                        minHeight: tooltipOpts.minHeight,
+                        maxWidth: tooltipOpts.maxWidth,
+                        maxHeight: tooltipOpts.maxHeight,
+                        placement: tooltipOpts.placement,
+                        defaultPlacement: tooltipOpts.defaultPlacement,
+                        popupClassName: tooltipOpts.popupClassName
+                    }, tooltipSlot
+                        ? {
+                            content: () => {
+                                const { node } = tooltipStore;
+                                return tooltipSlot({ node, $tree: $xeTree });
+                            }
+                        }
+                        : undefined)
+                    : renderEmptyElement($xeTree),
                 /**
                  * 加载中
                  */
@@ -42567,7 +42743,7 @@ var VxeTreeComponent = defineVxeComponent({
                     ? {
                         default: () => loadingSlot({ $tree: $xeTree })
                     }
-                    : {})
+                    : undefined)
             ]);
         };
         const dataFlag = ref(0);
@@ -42619,8 +42795,11 @@ var VxeTreeComponent = defineVxeComponent({
             recalculate();
         });
         onMounted(() => {
-            const { transform, drag, menuConfig } = props;
+            const { transform, drag, menuConfig, showOverflow } = props;
             const dragOpts = computeDragOpts.value;
+            if (!showOverflow) {
+                errLog$2('vxe.error.errProp', ['show-overflow=false', 'show-overflow=true']);
+            }
             if (drag && !transform) {
                 errLog$2('vxe.error.notSupportProp', ['drag', 'transform=false', 'transform=true']);
             }