vxe-pc-ui 4.20.11 → 4.20.13

package/dist/all.esm.js

@@ -101,7 +101,7 @@ function checkDynamic() {
 }
 
 const { log } = VxeUI;
-const uiVersion = `ui v${"4.20.11"}`;
+const uiVersion = `ui v${"4.20.13"}`;
 function createComponentLog(name) {
     const tableVersion = VxeUI.tableVersion ? `table v${VxeUI.tableVersion}` : '';
     const ganttVersion = VxeUI.ganttVersion ? `gantt v${VxeUI.ganttVersion}` : '';
@@ -115,7 +115,7 @@ function createComponentLog(name) {
 const warnLog$j = log.create('warn', uiVersion);
 log.create('error', uiVersion);
 
-const version = "4.20.11";
+const version = "4.20.13";
 VxeUI.uiVersion = version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -2889,6 +2889,10 @@ var VxeScrollbarComponent = defineVxeComponent({
             type: Boolean,
             default: () => getConfig$9().scrollbar.native
         },
+        fluentOverlay: {
+            type: Boolean,
+            default: () => getConfig$9().scrollbar.fluentOverlay
+        },
         padding: {
             type: Boolean,
             default: () => getConfig$9().scrollbar.padding
@@ -3012,7 +3016,7 @@ var VxeScrollbarComponent = defineVxeComponent({
             return getDefaultConfig(yOpts.autoHide, autoHide);
         });
         const computeWrapperClss = computed(() => {
-            const { native, theme, className, padding } = props;
+            const { native, theme, className, padding, fluentOverlay } = props;
             const { yThumbHeight, xThumbWidth } = reactData;
             const vSize = computeSize.value;
             const xToTop = computeXToTop.value;
@@ -3025,6 +3029,7 @@ var VxeScrollbarComponent = defineVxeComponent({
                 'vxe-scrollbar',
                 vSize ? `size--${vSize}` : '',
                 theme ? `theme--${theme}` : '',
+                fluentOverlay ? 'is--fluent-overlay' : 'is--default-mode',
                 `ov-x--${xVisible === false ? 'hidden' : 'visible'}`,
                 `ov-y--${yVisible === false ? 'hidden' : 'visible'}`,
                 `sx-pos--${xToTop ? 'top' : 'bottom'}`,
@@ -7960,12 +7965,14 @@ var VxeListComponent = defineVxeComponent({
         });
         const computeScrollbarWrapperClss = computed(() => {
             const { yThumbHeight, xThumbWidth } = reactData;
+            const scrollbarOpts = computeScrollbarOpts.value;
             const scrollbarXToTop = computeScrollbarXToTop.value;
             const scrollbarYToLeft = computeScrollbarYToLeft.value;
             const scrollXVisible = computeScrollXVisible.value;
             const scrollYVisible = computeScrollYVisible.value;
             return domUtils$1.buildClass([
                 'vxe-scrollbar is--virtual',
+                scrollbarOpts.fluentOverlay ? 'is--fluent-overlay' : 'is--default-mode',
                 `ov-x--${scrollXVisible === false ? 'hidden' : 'visible'}`,
                 `ov-y--${scrollYVisible === false ? 'hidden' : 'visible'}`,
                 `sx-pos--${scrollbarXToTop ? 'top' : 'bottom'}`,
@@ -9519,13 +9526,17 @@ var VxeListComponent = defineVxeComponent({
             if (isVScrollbar) {
                 if (!scrollObserver) {
                     const el = refElem.value;
-                    const viewInnerEl = refVirtualSpaceElem.value;
+                    const viewSpaceEl = refVirtualSpaceElem.value;
+                    const viewInnerEl = refVirtualBody.value;
                     const scrollObserver = globalResize$1.create(() => {
                         reScrollFlag.value++;
                     });
                     if (el) {
                         scrollObserver.observe(el);
                     }
+                    if (viewSpaceEl) {
+                        scrollObserver.observe(viewSpaceEl);
+                    }
                     if (viewInnerEl) {
                         scrollObserver.observe(viewInnerEl);
                     }
@@ -33585,12 +33596,14 @@ var VxeSelectComponent = defineVxeComponent({
         });
         const computeScrollbarWrapperClss = computed(() => {
             const { yThumbHeight, xThumbWidth } = reactData;
+            const scrollbarOpts = computeScrollbarOpts.value;
             const scrollbarXToTop = computeScrollbarXToTop.value;
             const scrollbarYToLeft = computeScrollbarYToLeft.value;
             const scrollXVisible = computeScrollXVisible.value;
             const scrollYVisible = computeScrollYVisible.value;
             return domUtils.buildClass([
                 'vxe-scrollbar is--virtual',
+                scrollbarOpts.fluentOverlay ? 'is--fluent-overlay' : 'is--default-mode',
                 `ov-x--${scrollXVisible === false ? 'hidden' : 'visible'}`,
                 `ov-y--${scrollYVisible === false ? 'hidden' : 'visible'}`,
                 `sx-pos--${scrollbarXToTop ? 'top' : 'bottom'}`,
@@ -34581,13 +34594,17 @@ var VxeSelectComponent = defineVxeComponent({
             if (isVScrollbar) {
                 if (!scrollObserver) {
                     const el = refElem.value;
-                    const viewInnerEl = refVirtualSpaceElem.value;
+                    const viewSpaceEl = refVirtualSpaceElem.value;
+                    const viewInnerEl = refVirtualBody.value;
                     const scrollObserver = globalResize.create(() => {
                         reScrollFlag.value++;
                     });
                     if (el) {
                         scrollObserver.observe(el);
                     }
+                    if (viewSpaceEl) {
+                        scrollObserver.observe(viewSpaceEl);
+                    }
                     if (viewInnerEl) {
                         scrollObserver.observe(viewInnerEl);
                     }
@@ -41778,7 +41795,7 @@ var VxeTabsComponent = defineVxeComponent({
                         if (index > -1) {
                             const tabEl = children[index];
                             if (tabEl) {
-                                const tabHeight = tabEl.clientHeight;
+                                let tabHeight = tabEl.clientHeight;
                                 const tabWidth = tabEl.clientWidth;
                                 if (tabType === 'card') {
                                     lintWidth = tabWidth;
@@ -41791,8 +41808,12 @@ var VxeTabsComponent = defineVxeComponent({
                                     lintTop = tabEl.offsetTop - 1;
                                 }
                                 else {
-                                    lintHeight = Math.max(4, Math.floor(tabHeight * 0.6));
-                                    lintTop = tabEl.offsetTop + Math.floor((tabHeight - lintHeight) / 2);
+                                    const tabStyle = getComputedStyle(tabEl);
+                                    const paddingTop = XEUtils.toNumber(tabStyle.paddingTop);
+                                    const paddingBottom = XEUtils.toNumber(tabStyle.paddingBottom);
+                                    tabHeight -= (paddingTop + paddingBottom);
+                                    lintHeight = Math.max(4, tabHeight);
+                                    lintTop = tabEl.offsetTop + paddingTop + Math.floor((tabHeight - lintHeight) / 2);
                                 }
                             }
                         }
@@ -41802,7 +41823,7 @@ var VxeTabsComponent = defineVxeComponent({
                         if (index > -1) {
                             const tabEl = children[index];
                             if (tabEl) {
-                                const tabWidth = tabEl.clientWidth;
+                                let tabWidth = tabEl.clientWidth;
                                 if (tabType === 'card') {
                                     lintWidth = tabWidth + 1;
                                     lintLeft = tabEl.offsetLeft;
@@ -41812,8 +41833,12 @@ var VxeTabsComponent = defineVxeComponent({
                                     lintLeft = tabEl.offsetLeft - 1;
                                 }
                                 else {
-                                    lintWidth = Math.max(4, Math.floor(tabWidth * 0.6));
-                                    lintLeft = tabEl.offsetLeft + Math.floor((tabWidth - lintWidth) / 2);
+                                    const tabStyle = getComputedStyle(tabEl);
+                                    const paddingLeft = XEUtils.toNumber(tabStyle.paddingLeft);
+                                    const paddingRight = XEUtils.toNumber(tabStyle.paddingRight);
+                                    tabWidth -= (paddingLeft + paddingRight);
+                                    lintWidth = Math.max(4, tabWidth);
+                                    lintLeft = tabEl.offsetLeft + paddingLeft + Math.floor((tabWidth - lintWidth) / 2);
                                 }
                             }
                         }
@@ -44168,12 +44193,14 @@ var VxeTreeComponent = defineVxeComponent({
         });
         const computeScrollbarWrapperClss = computed(() => {
             const { yThumbHeight, xThumbWidth } = reactData;
+            const scrollbarOpts = computeScrollbarOpts.value;
             const scrollbarXToTop = computeScrollbarXToTop.value;
             const scrollbarYToLeft = computeScrollbarYToLeft.value;
             const scrollXVisible = computeScrollXVisible.value;
             const scrollYVisible = computeScrollYVisible.value;
             return domUtils$3.buildClass([
                 'vxe-scrollbar is--virtual',
+                scrollbarOpts.fluentOverlay ? 'is--fluent-overlay' : 'is--default-mode',
                 `ov-x--${scrollXVisible === false ? 'hidden' : 'visible'}`,
                 `ov-y--${scrollYVisible === false ? 'hidden' : 'visible'}`,
                 `sx-pos--${scrollbarXToTop ? 'top' : 'bottom'}`,
@@ -46765,13 +46792,17 @@ var VxeTreeComponent = defineVxeComponent({
             if (isVScrollbar) {
                 if (!scrollObserver) {
                     const el = refElem.value;
-                    const viewInnerEl = refVirtualSpaceElem.value;
+                    const viewSpaceEl = refVirtualSpaceElem.value;
+                    const viewInnerEl = refVirtualBody.value;
                     const scrollObserver = globalResize$3.create(() => {
                         reScrollFlag.value++;
                     });
                     if (el) {
                         scrollObserver.observe(el);
                     }
+                    if (viewSpaceEl) {
+                        scrollObserver.observe(viewSpaceEl);
+                    }
                     if (viewInnerEl) {
                         scrollObserver.observe(viewInnerEl);
                     }