vxe-pc-ui 3.19.4 → 3.19.6

package/styles/components/scrollbar.scss

@@ -77,8 +77,12 @@
   user-select: none;
 }
 .vxe-scrollbar {
+  &.overflow-x {
+    & > .vxe-scrollbar--track-x {
+      display: block;
+    }
+  }
   &.overflow-y {
-    & > .vxe-scrollbar--track-x,
     & > .vxe-scrollbar--track-y {
       display: block;
     }
@@ -87,19 +91,81 @@
 
 .vxe-scrollbar--track-x {
   width: 100%;
-  bottom: 0;
   left: 0;
   height: var(--vxe-ui-scrollbar-x-height);
   padding: var(--vxe-ui-scrollbar-track-padding) 0;
 }
-
 .vxe-scrollbar--track-y {
   height: 100%;
-  right: 0;
   top: 0;
   width: var(--vxe-ui-scrollbar-y-width);
   padding: 0 var(--vxe-ui-scrollbar-track-padding);
 }
+.vxe-scrollbar {
+  &.sx-pos--top {
+    & > .vxe-scrollbar--track-x {
+      top: 0;
+    }
+  }
+  &.sx-pos--bottom {
+    & > .vxe-scrollbar--track-x {
+      bottom: 0;
+    }
+  }
+  &.sy-pos--left {
+    & > .vxe-scrollbar--track-y {
+      left: 0;
+    }
+  }
+  &.sy-pos--right {
+    & > .vxe-scrollbar--track-y {
+      right: 0;
+    }
+  }
+  &.overflow-x {
+    &.overflow-y {
+      & > .vxe-scrollbar--track-x {
+        width: calc(100% - var(--vxe-ui-scrollbar-x-height));
+      }
+      & > .vxe-scrollbar--track-y {
+        height: calc(100% - var(--vxe-ui-scrollbar-y-width));
+      }
+      &.sx-pos--top {
+        &.sy-pos--left,
+        &.sy-pos--right {
+          & > .vxe-scrollbar--track-y {
+            top: var(--vxe-ui-scrollbar-x-height);
+          }
+        }
+      }
+      &.sy-pos--left {
+        &.sx-pos--top,
+        &.sx-pos--bottom {
+          & > .vxe-scrollbar--track-x {
+            left: var(--vxe-ui-scrollbar-y-width);
+          }
+        }
+      }
+    }
+  }
+}
+
+.vxe-scrollbar {
+  &.is--padding {
+    &.sx-pos--top {
+      padding-top: var(--vxe-ui-scrollbar-x-height);
+    }
+    &.sx-pos--bottom {
+      padding-bottom: var(--vxe-ui-scrollbar-x-height);
+    }
+    &.sy-pos--left {
+      padding-left: var(--vxe-ui-scrollbar-y-width);
+    }
+    &.sy-pos--right {
+      padding-right: var(--vxe-ui-scrollbar-y-width);
+    }
+  }
+}
 
 .vxe-scrollbar--thumb-y {
   width: 100%;

package/styles/components/tabs.scss

@@ -732,6 +732,10 @@ $scrollbarOffsetSize: 20px;
   }
 }
 
+.vxe-tabs-slots {
+  display: none;
+}
+
 .vxe-tabs {
   @include getTabsSizeStyle(var(--vxe-ui-font-size-default), var(--vxe-ui-tabs-header-height-default));
   &.size--medium {

package/types/components/scrollbar.d.ts

@@ -27,6 +27,7 @@ export namespace VxeScrollbarPropTypes {
   export type MaxHeight = number | string
   export type Loading = boolean
   export type Native = boolean
+  export type Padding = boolean
   export interface XConfig {
     height?: number | string
     // showArrows?: boolean
@@ -34,6 +35,10 @@ export namespace VxeScrollbarPropTypes {
      * 是否自动隐藏滚动条
      */
     autoHide?: boolean
+    /**
+     * 滚动条显示位置
+     */
+    position?: 'top' | 'bottom' | ''
     visible?: 'auto' | 'hidden' | 'visible' | ''
     /**
      * 滚动到边界触发的阈值会触发 scroll-boundary 事件
@@ -47,6 +52,10 @@ export namespace VxeScrollbarPropTypes {
      * 是否自动隐藏滚动条
      */
     autoHide?: boolean
+    /**
+     * 滚动条显示位置
+     */
+    position?: 'left' | 'right' | ''
     visible?: 'auto' | 'hidden' | 'visible' | ''
     /**
      * 滚动到边界触发的阈值会触发 scroll-boundary 事件
@@ -98,6 +107,10 @@ export interface VxeScrollbarProps {
    * 是否使用原生滚动条
    */
   native?: VxeScrollbarPropTypes.Native
+  /**
+   * 滚动条是否需要边距
+   */
+  padding?: VxeScrollbarPropTypes.Padding
   /**
    * 纵向滚动条宽度
    */