e-virt-table 1.4.2 → 1.4.3

package/dist/lib/Row.js

@@ -158,5 +158,15 @@ export default class Row {
             cell.drawContainer();
         });
     }
+    drawHorizontalBorder() {
+        this.noFixedCells.forEach((cell) => {
+            cell.drawHorizontalBorder();
+        });
+    }
+    drawFixedHorizontalBorder() {
+        this.fixedCells.forEach((cell) => {
+            cell.drawHorizontalBorder();
+        });
+    }
 }
 //# sourceMappingURL=Row.js.map

package/dist/lib/Row.js.map

@@ -1 +1 @@
-{"version":3,"file":"Row.js","sourceRoot":"","sources":["../../src/Row.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Row.js","sourceRoot":"","sources":["../../src/Row.ts"],"names":[],"mappings":"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"}

package/dist/lib/ScrollbarMode.d.ts

@@ -0,0 +1,21 @@
+export type ScrollbarMode = 'outer' | 'inner';
+export type ScrollbarModeConfig = {
+    scrollbarMode?: unknown;
+    SCROLLBAR_MODE?: unknown;
+    SCROLLER_TRACK_SIZE?: number;
+};
+export declare function getScrollbarMode(config: ScrollbarModeConfig): ScrollbarMode;
+export declare function isInnerScrollbarMode(config: ScrollbarModeConfig): boolean;
+export declare function getLayoutScrollerTrackSize(config: ScrollbarModeConfig): number;
+export declare function getOverlayScrollerTrackSize(config: ScrollbarModeConfig): number;
+export declare function getScrollbarCornerOffset(config: ScrollbarModeConfig, hasOppositeScrollbar: boolean): number;
+export declare function getScrollbarThumbEndInset(config: ScrollbarModeConfig): number;
+export declare function shouldDrawScrollbarTrackBorder(config: ScrollbarModeConfig): boolean;
+export declare function shouldDrawScrollbarTrackBackground(config: ScrollbarModeConfig): boolean;
+export type ScrollbarVisibilityState = {
+    innerVisible: boolean;
+    isFocus: boolean;
+    isDragging: boolean;
+};
+export declare function shouldStartInnerScrollbarShowTimer(config: ScrollbarModeConfig, isPointerInsideTable: boolean): boolean;
+export declare function shouldDrawScrollbar(config: ScrollbarModeConfig, state: ScrollbarVisibilityState): boolean;

package/dist/lib/ScrollbarMode.js

@@ -0,0 +1,38 @@
+export function getScrollbarMode(config) {
+    const mode = config.scrollbarMode ?? config.SCROLLBAR_MODE;
+    return mode === 'inner' ? 'inner' : 'outer';
+}
+export function isInnerScrollbarMode(config) {
+    return getScrollbarMode(config) === 'inner';
+}
+export function getLayoutScrollerTrackSize(config) {
+    return isInnerScrollbarMode(config) ? 0 : config.SCROLLER_TRACK_SIZE || 0;
+}
+export function getOverlayScrollerTrackSize(config) {
+    return config.SCROLLER_TRACK_SIZE || 0;
+}
+export function getScrollbarCornerOffset(config, hasOppositeScrollbar) {
+    if (!isInnerScrollbarMode(config) || !hasOppositeScrollbar) {
+        return 0;
+    }
+    return getOverlayScrollerTrackSize(config);
+}
+export function getScrollbarThumbEndInset(config) {
+    return isInnerScrollbarMode(config) ? 1 : 0;
+}
+export function shouldDrawScrollbarTrackBorder(config) {
+    return !isInnerScrollbarMode(config);
+}
+export function shouldDrawScrollbarTrackBackground(config) {
+    return !isInnerScrollbarMode(config);
+}
+export function shouldStartInnerScrollbarShowTimer(config, isPointerInsideTable) {
+    return isInnerScrollbarMode(config) && isPointerInsideTable;
+}
+export function shouldDrawScrollbar(config, state) {
+    if (!isInnerScrollbarMode(config)) {
+        return true;
+    }
+    return state.innerVisible || state.isFocus || state.isDragging;
+}
+//# sourceMappingURL=ScrollbarMode.js.map

package/dist/lib/ScrollbarMode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollbarMode.js","sourceRoot":"","sources":["../../src/ScrollbarMode.ts"],"names":[],"mappings":"AAQA,MAAM,UAAU,gBAAgB,CAAC,MAA2B;IACxD,MAAM,IAAI,GAAG,MAAM,CAAC,aAAa,IAAI,MAAM,CAAC,cAAc,CAAC;IAC3D,OAAO,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;AAChD,CAAC;AAED,MAAM,UAAU,oBAAoB,CAAC,MAA2B;IAC5D,OAAO,gBAAgB,CAAC,MAAM,CAAC,KAAK,OAAO,CAAC;AAChD,CAAC;AAED,MAAM,UAAU,0BAA0B,CAAC,MAA2B;IAClE,OAAO,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,mBAAmB,IAAI,CAAC,CAAC;AAC9E,CAAC;AAED,MAAM,UAAU,2BAA2B,CAAC,MAA2B;IACnE,OAAO,MAAM,CAAC,mBAAmB,IAAI,CAAC,CAAC;AAC3C,CAAC;AAED,MAAM,UAAU,wBAAwB,CAAC,MAA2B,EAAE,oBAA6B;IAC/F,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC,IAAI,CAAC,oBAAoB,EAAE,CAAC;QACzD,OAAO,CAAC,CAAC;IACb,CAAC;IACD,OAAO,2BAA2B,CAAC,MAAM,CAAC,CAAC;AAC/C,CAAC;AAED,MAAM,UAAU,yBAAyB,CAAC,MAA2B;IACjE,OAAO,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAChD,CAAC;AAED,MAAM,UAAU,8BAA8B,CAAC,MAA2B;IACtE,OAAO,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC;AACzC,CAAC;AAED,MAAM,UAAU,kCAAkC,CAAC,MAA2B;IAC1E,OAAO,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC;AACzC,CAAC;AAQD,MAAM,UAAU,kCAAkC,CAC9C,MAA2B,EAC3B,oBAA6B;IAE7B,OAAO,oBAAoB,CAAC,MAAM,CAAC,IAAI,oBAAoB,CAAC;AAChE,CAAC;AAED,MAAM,UAAU,mBAAmB,CAAC,MAA2B,EAAE,KAA+B;IAC5F,IAAI,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,CAAC;QAChC,OAAO,IAAI,CAAC;IAChB,CAAC;IACD,OAAO,KAAK,CAAC,YAAY,IAAI,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,UAAU,CAAC;AACnE,CAAC"}

package/dist/lib/Scroller.d.ts

@@ -16,6 +16,7 @@ export default class Scroller {
     onMouseDown(e: MouseEvent): void;
     onMouseMove(e: MouseEvent): void;
     onMouseUp(): void;
+    onMouseOut(e: MouseEvent): void;
     draw(): void;
     setScroll(x: number, y: number): void;
     setScrollX(scrollX: number): void;

package/dist/lib/Scroller.js

@@ -1,3 +1,18 @@
+import { shouldDrawRightBoundaryBorder, shouldDrawScrollerBorder, shouldDrawScrollerTrack } from './BorderStyle';
+import { getLayoutScrollerTrackSize, getOverlayScrollerTrackSize, getScrollbarCornerOffset, getScrollbarThumbEndInset, isInnerScrollbarMode, shouldDrawScrollbar, shouldDrawScrollbarTrackBackground, shouldDrawScrollbarTrackBorder, shouldStartInnerScrollbarShowTimer, } from './ScrollbarMode';
+function getScrollbarThumbSize(distance, visibleDistance, contentDistance, trackDistance = visibleDistance, minSize = 30) {
+    if (distance <= 0 || visibleDistance <= 0 || contentDistance <= 0 || trackDistance <= 0) {
+        return 0;
+    }
+    const size = Math.floor((visibleDistance / contentDistance) * trackDistance);
+    if (size < minSize) {
+        return Math.min(minSize, trackDistance);
+    }
+    if (size > trackDistance) {
+        return 0;
+    }
+    return size;
+}
 class Scrollbar {
     constructor(ctx, type) {
         Object.defineProperty(this, "ctx", {
@@ -84,6 +99,18 @@ class Scrollbar {
             writable: true,
             value: 0
         }); //可见区域的长度
+        Object.defineProperty(this, "thumbTrackDistance", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: 0
+        });
+        Object.defineProperty(this, "thumbTravelDistance", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: 0
+        });
         Object.defineProperty(this, "clientX", {
             enumerable: true,
             configurable: true,
@@ -102,6 +129,18 @@ class Scrollbar {
             writable: true,
             value: 0
         }); // 拖拽开始的位置
+        Object.defineProperty(this, "innerVisible", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: false
+        });
+        Object.defineProperty(this, "innerShowTimer", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: 0
+        });
         Object.defineProperty(this, "isDragging", {
             enumerable: true,
             configurable: true,
@@ -172,6 +211,11 @@ class Scrollbar {
         const offsetY = this.ctx.zoomScale.toLogical(e.offsetY);
         if (clientX == this.clientX && clientY == this.clientY)
             return;
+        if (this.isInnerMode()) {
+            if (!this.canInteractWithScrollbar()) {
+                return;
+            }
+        }
         if (this.isOnScrollbar(offsetX, offsetY)) {
             this.clientX = clientX;
             this.clientY = clientY;
@@ -188,11 +232,11 @@ class Scrollbar {
                 // 滚动条位置=（鼠标位置-滚动条的高度/2-头部的高度）/（可见区域的长度-滚动条的高度）*滚动条的长度
                 // 滚动到中间所以减去滚动条的高度/2
                 const offset = offsetY - this.ctx.header.height - this.barHeight / 2;
-                scroll = (offset / (this.visibleDistance - this.barHeight)) * this.distance;
+                scroll = (offset / this.thumbTravelDistance) * this.distance;
             }
             else {
                 const offset = offsetX - this.barWidth / 2;
-                scroll = (offset / (this.visibleDistance - this.barWidth)) * this.distance;
+                scroll = (offset / this.thumbTravelDistance) * this.distance;
             }
             this.scroll = Math.max(0, Math.min(scroll, this.distance));
         }
@@ -203,24 +247,33 @@ class Scrollbar {
         this.clientX = 0;
         this.clientY = 0;
     }
-    onMouseMove(e) {
+    onMouseMove(e, isPointerInsideTable) {
         const { clientX, clientY, buttons } = e;
         const offsetX = this.ctx.zoomScale.toLogical(e.offsetX);
         const offsetY = this.ctx.zoomScale.toLogical(e.offsetY);
+        let needsFullRedraw = false;
+        if (shouldStartInnerScrollbarShowTimer(this.ctx.config, isPointerInsideTable)) {
+            this.startInnerShowTimer();
+        }
+        else {
+            needsFullRedraw = this.hideInnerScrollbar();
+        }
         // 没有鼠标按下时不处理，要重置抬起事件
         // 悬浮提示
-        if (this.isOnScrollbar(offsetX, offsetY) && e.target === this.ctx.canvasElement) {
+        const isScrollbarHover = this.canInteractWithScrollbar() && (this.isOnScrollbar(offsetX, offsetY) || this.isOnTrack(offsetX, offsetY));
+        if (isScrollbarHover && e.target === this.ctx.canvasElement) {
             this.isFocus = true;
+            this.ctx.stageElement.style.cursor = 'pointer';
         }
         else {
             this.isFocus = false;
         }
         if (buttons === 0) {
-            return;
+            return needsFullRedraw;
         }
         // 拖拽移动滚动条
         if (clientX == this.clientX && clientY == this.clientY)
-            return;
+            return needsFullRedraw;
         let offset = 0;
         if (this.type === 'horizontal') {
             offset = clientX - this.clientX;
@@ -234,13 +287,14 @@ class Scrollbar {
             // scroll= 开始滚动条位置+（鼠标移动的距离/可见区域的长度）*滚动条的长度
             let scroll = 0;
             if (this.type === 'vertical') {
-                scroll = this.dragStart + (offset / (this.visibleDistance - this.barHeight)) * this.distance;
+                scroll = this.dragStart + (offset / this.thumbTravelDistance) * this.distance;
             }
             else {
-                scroll = this.dragStart + (offset / (this.visibleDistance - this.barWidth)) * this.distance;
+                scroll = this.dragStart + (offset / this.thumbTravelDistance) * this.distance;
             }
             this.scroll = Math.max(0, Math.min(scroll, this.distance));
         }
+        return needsFullRedraw;
     }
     isPointInElement(pointX, pointY, elementX, elementY, elementWidth, elementHeight) {
         return (pointX >= elementX &&
@@ -263,6 +317,47 @@ class Scrollbar {
     isOnTrack(x, y) {
         return this.isPointInElement(x, y, this.trackX, this.trackY, this.trackWidth, this.trackHeight);
     }
+    isInnerMode() {
+        return isInnerScrollbarMode(this.ctx.config);
+    }
+    shouldDrawInnerScrollbar() {
+        return shouldDrawScrollbar(this.ctx.config, {
+            innerVisible: this.innerVisible,
+            isFocus: this.isFocus,
+            isDragging: this.isDragging,
+        });
+    }
+    canInteractWithScrollbar() {
+        return !this.isInnerMode() || this.shouldDrawInnerScrollbar();
+    }
+    startInnerShowTimer() {
+        if (!this.isInnerMode() || this.innerVisible || this.innerShowTimer) {
+            return;
+        }
+        const delay = Math.max(0, this.ctx.config.SCROLLBAR_SHOW_DELAY || 0);
+        this.innerShowTimer = window.setTimeout(() => {
+            this.innerVisible = true;
+            this.innerShowTimer = 0;
+            this.ctx.emit('draw');
+        }, delay);
+    }
+    cancelInnerShowTimer() {
+        if (!this.innerShowTimer) {
+            return;
+        }
+        clearTimeout(this.innerShowTimer);
+        this.innerShowTimer = 0;
+    }
+    hideInnerScrollbar() {
+        if (!this.isInnerMode() || this.isDragging) {
+            return false;
+        }
+        const needsFullRedraw = this.innerVisible || this.isFocus;
+        this.cancelInnerShowTimer();
+        this.innerVisible = false;
+        this.isFocus = false;
+        return needsFullRedraw;
+    }
     updateScroll(e) {
         const deltaX = e.deltaX;
         const deltaY = e.deltaY;
@@ -284,67 +379,66 @@ class Scrollbar {
         }
     }
     updatedSize() {
-        const { body, header, stageHeight, stageWidth, config: { SCROLLER_TRACK_SIZE = 0, SCROLLER_SIZE = 0, BORDER }, } = this.ctx;
+        const { body, header, stageHeight, stageWidth, config: { SCROLLER_SIZE = 0, BORDER }, } = this.ctx;
+        const layoutScrollerTrackSize = getLayoutScrollerTrackSize(this.ctx.config);
+        const overlayScrollerTrackSize = getOverlayScrollerTrackSize(this.ctx.config);
         const visibleWidth = stageWidth;
         const visibleHeight = stageHeight;
         const headerHeight = header.height;
         const headerWidth = header.width;
         const bodyHeight = body.height;
         const footerHeight = this.ctx.footer.height;
+        const verticalVisibleDistance = visibleHeight - layoutScrollerTrackSize - headerHeight;
+        const horizontalVisibleDistance = visibleWidth - layoutScrollerTrackSize;
+        const verticalDistance = Math.max(0, bodyHeight - verticalVisibleDistance + footerHeight);
+        const horizontalDistance = Math.max(0, headerWidth - horizontalVisibleDistance);
+        const thumbEndInset = getScrollbarThumbEndInset(this.ctx.config);
         if (this.type === 'vertical') {
-            this.visibleDistance = visibleHeight - SCROLLER_TRACK_SIZE - headerHeight;
-            this.distance = bodyHeight - this.visibleDistance + footerHeight;
-            this.trackX = visibleWidth - SCROLLER_TRACK_SIZE;
+            this.visibleDistance = verticalVisibleDistance;
+            this.distance = verticalDistance;
+            const cornerOffset = getScrollbarCornerOffset(this.ctx.config, horizontalDistance > 0);
+            this.thumbTrackDistance = Math.max(0, this.visibleDistance - cornerOffset);
+            this.trackX = visibleWidth - overlayScrollerTrackSize;
             this.trackY = 0;
             // 分割线
-            this.splitPoints = [this.trackX, headerHeight, this.trackX + SCROLLER_TRACK_SIZE, headerHeight];
-            this.trackWidth = SCROLLER_TRACK_SIZE;
-            this.trackHeight = visibleHeight;
+            this.splitPoints = [this.trackX, headerHeight, this.trackX + overlayScrollerTrackSize, headerHeight];
+            this.trackWidth = overlayScrollerTrackSize;
+            this.trackHeight = Math.max(0, visibleHeight - cornerOffset);
             // 滚动条的X位置=轨道的X位置+（轨道的宽度-滚动条的宽度）/2
-            this.barX = this.trackX - 1 + (SCROLLER_TRACK_SIZE - SCROLLER_SIZE) / 2;
+            this.barX = this.trackX - 1 + (overlayScrollerTrackSize - SCROLLER_SIZE) / 2;
             this.barWidth = SCROLLER_SIZE;
-            const ratio = this.distance ? this.visibleDistance / (bodyHeight + footerHeight) : 0;
-            let _barHeight = Math.floor(ratio * this.visibleDistance);
+            this.barHeight = getScrollbarThumbSize(this.distance, this.visibleDistance, bodyHeight + footerHeight, this.thumbTrackDistance);
+            this.thumbTravelDistance = Math.max(0, this.thumbTrackDistance - this.barHeight - thumbEndInset);
             // 最小30,超出可见区域则隐藏
-            if (_barHeight < 30) {
-                _barHeight = 30;
-            }
-            else if (_barHeight > this.visibleDistance) {
-                _barHeight = 0;
-            }
-            this.barHeight = _barHeight;
-            this.barY = headerHeight + (this.scroll / this.distance) * (this.visibleDistance - this.barHeight);
+            const progress = this.distance ? this.scroll / this.distance : 0;
+            this.barY = headerHeight + progress * this.thumbTravelDistance;
             // 范围限制
             this.scroll = Math.max(0, Math.min(this.scroll, this.distance));
         }
         else {
-            this.visibleDistance = visibleWidth - SCROLLER_TRACK_SIZE;
-            this.distance = headerWidth - this.visibleDistance;
+            this.visibleDistance = horizontalVisibleDistance;
+            this.distance = horizontalDistance;
+            const cornerOffset = getScrollbarCornerOffset(this.ctx.config, verticalDistance > 0);
+            this.thumbTrackDistance = Math.max(0, this.visibleDistance - cornerOffset);
             // 分割线
             this.splitPoints = [
-                visibleWidth - SCROLLER_TRACK_SIZE,
-                visibleHeight - SCROLLER_TRACK_SIZE,
-                visibleWidth - SCROLLER_TRACK_SIZE,
+                visibleWidth - overlayScrollerTrackSize,
+                visibleHeight - overlayScrollerTrackSize,
+                visibleWidth - overlayScrollerTrackSize,
                 visibleHeight,
             ];
-            const offset = BORDER ? 0 : 0.5; // 解决边框问题，补偿0.5px
+            const offset = shouldDrawScrollerBorder(BORDER) ? 0 : 0.5; // 解决边框问题，补偿0.5px
             this.trackX = 0;
-            this.trackY = visibleHeight - SCROLLER_TRACK_SIZE + offset;
-            this.trackWidth = visibleWidth;
-            this.trackHeight = SCROLLER_TRACK_SIZE;
-            const ratio = this.distance ? this.visibleDistance / headerWidth : 0;
-            let _barWidth = Math.floor(ratio * this.visibleDistance);
-            this.barY = this.trackY - 1 + (SCROLLER_TRACK_SIZE - SCROLLER_SIZE) / 2;
+            this.trackY = visibleHeight - overlayScrollerTrackSize + offset;
+            this.trackWidth = Math.max(0, visibleWidth - cornerOffset);
+            this.trackHeight = overlayScrollerTrackSize;
+            this.barWidth = getScrollbarThumbSize(this.distance, this.visibleDistance, headerWidth, this.thumbTrackDistance);
+            this.thumbTravelDistance = Math.max(0, this.thumbTrackDistance - this.barWidth - thumbEndInset);
+            this.barY = this.trackY - 1 + (overlayScrollerTrackSize - SCROLLER_SIZE) / 2;
             // 最小30,超出可见区域则隐藏
-            if (_barWidth < 30) {
-                _barWidth = 30;
-            }
-            else if (_barWidth >= this.visibleDistance) {
-                _barWidth = 0;
-            }
-            this.barWidth = _barWidth;
             this.barHeight = SCROLLER_SIZE;
-            this.barX = (this.scroll / this.distance) * (this.visibleDistance - this.barWidth);
+            const progress = this.distance ? this.scroll / this.distance : 0;
+            this.barX = progress * this.thumbTravelDistance;
             // 范围限制
             this.scroll = Math.max(0, Math.min(this.scroll, this.distance));
         }
@@ -352,29 +446,103 @@ class Scrollbar {
     draw() {
         const { config: { SCROLLER_FOCUS_COLOR, SCROLLER_COLOR, BORDER_COLOR, BORDER, SCROLLER_TRACK_COLOR }, } = this.ctx;
         this.updatedSize();
-        let borderColor = BORDER_COLOR;
-        if (!BORDER) {
-            borderColor = 'transparent';
-        }
+        if (this.isInnerMode() && !this.shouldDrawInnerScrollbar()) {
+            return this.isFocus || this.isDragging;
+        }
+        const drawTrackBorder = shouldDrawScrollbarTrackBorder(this.ctx.config);
+        const drawTrackBackground = shouldDrawScrollbarTrackBackground(this.ctx.config);
+        const borderColor = drawTrackBorder && shouldDrawScrollerBorder(BORDER) ? BORDER_COLOR : 'transparent';
+        const hasScrollbar = this.hasScrollbar();
+        const drawTrack = shouldDrawScrollerTrack(BORDER, hasScrollbar);
         // 轨道
-        this.ctx.paint.drawRect(this.trackX, this.trackY, this.trackWidth, this.trackHeight, {
-            borderColor,
-            fillColor: SCROLLER_TRACK_COLOR,
-        });
+        if (drawTrackBackground && drawTrack) {
+            this.ctx.paint.drawRect(this.trackX, this.trackY, this.trackWidth, this.trackHeight, {
+                fillColor: SCROLLER_TRACK_COLOR,
+            });
+            this.drawTrackHeaderBackground();
+            if (drawTrackBorder) {
+                this.ctx.paint.drawRect(this.trackX, this.trackY, this.trackWidth, this.trackHeight, {
+                    borderColor,
+                });
+                this.drawRightBoundaryBorder();
+            }
+        }
+        else if (drawTrackBackground) {
+            this.drawInactiveTrackBackground();
+        }
         // 滚动条
-        this.ctx.paint.drawRect(this.barX, this.barY, this.barWidth, this.barHeight, {
-            fillColor: this.isFocus || this.isDragging ? SCROLLER_FOCUS_COLOR : SCROLLER_COLOR,
-            radius: 4,
-        });
+        if (hasScrollbar) {
+            this.ctx.paint.drawRect(this.barX, this.barY, this.barWidth, this.barHeight, {
+                fillColor: this.isFocus || this.isDragging ? SCROLLER_FOCUS_COLOR : SCROLLER_COLOR,
+                radius: 4,
+            });
+        }
         // 分割线范围外
-        if (this.splitPoints.length > 0) {
+        if (drawTrackBorder && drawTrack && this.splitPoints.length > 0) {
             this.ctx.paint.drawLine(this.splitPoints, {
                 borderColor,
                 borderWidth: 1,
             });
         }
-        // 悬浮状态
-        this.ctx.scrollerFocus = this.isFocus;
+        return this.isFocus || this.isDragging;
+    }
+    drawTrackHeaderBackground() {
+        if (this.type !== 'vertical' || this.trackWidth <= 0) {
+            return;
+        }
+        const { header, config: { HEADER_BG_COLOR }, } = this.ctx;
+        const height = Math.max(0, Math.min(header.height, this.trackHeight));
+        if (height <= 0) {
+            return;
+        }
+        this.ctx.paint.drawRect(this.trackX, this.trackY, this.trackWidth, height, {
+            fillColor: HEADER_BG_COLOR,
+        });
+    }
+    drawInactiveTrackBackground() {
+        if (this.type !== 'vertical') {
+            return;
+        }
+        const { footer, header, scrollY, stageHeight, config: { BODY_BG_COLOR, FOOTER_BG_COLOR, FOOTER_FIXED, FOOTER_POSITION, HEADER_BG_COLOR, SCROLLER_TRACK_SIZE = 0, }, } = this.ctx;
+        const bottom = Math.max(0, stageHeight - SCROLLER_TRACK_SIZE);
+        if (bottom <= 0 || this.trackWidth <= 0) {
+            return;
+        }
+        this.ctx.paint.drawRect(this.trackX, 0, this.trackWidth, bottom, {
+            fillColor: BODY_BG_COLOR,
+        });
+        this.ctx.paint.drawRect(this.trackX, 0, this.trackWidth, header.height, {
+            fillColor: HEADER_BG_COLOR,
+        });
+        if (!footer.height) {
+            return;
+        }
+        const footerY = FOOTER_FIXED
+            ? FOOTER_POSITION === 'top'
+                ? header.height
+                : bottom - footer.height
+            : footer.y - scrollY;
+        const y = Math.max(header.height, Math.min(footerY, bottom));
+        const height = Math.max(0, Math.min(footer.height, bottom - y));
+        if (height > 0) {
+            this.ctx.paint.drawRect(this.trackX, y, this.trackWidth, height, {
+                fillColor: FOOTER_BG_COLOR,
+            });
+        }
+    }
+    drawRightBoundaryBorder() {
+        const { stageHeight, config: { BORDER, BORDER_COLOR, SCROLLER_TRACK_SIZE = 0 }, } = this.ctx;
+        if (this.type !== 'vertical' || !shouldDrawRightBoundaryBorder(BORDER) || SCROLLER_TRACK_SIZE <= 0) {
+            return;
+        }
+        const bottom = stageHeight - SCROLLER_TRACK_SIZE;
+        if (bottom <= 0) {
+            return;
+        }
+        this.ctx.paint.drawLine([this.trackX, 0, this.trackX, bottom], {
+            borderColor: BORDER_COLOR,
+            borderWidth: 1,
+        });
     }
 }
 export default class Scroller {
@@ -434,6 +602,7 @@ export default class Scroller {
         this.ctx.on('mousedown', (e) => this.onMouseDown(e));
         this.ctx.on('mousemove', (e) => this.onMouseMove(e));
         this.ctx.on('mouseup', () => this.onMouseUp());
+        this.ctx.on('mouseout', (e) => this.onMouseOut(e));
         this.ctx.on('touchmove', (e) => this.onTouchmove(e));
         this.ctx.on('touchstart', (e) => {
             this.onTouchstart(e);
@@ -481,9 +650,16 @@ export default class Scroller {
         this.draw();
     }
     onMouseMove(e) {
-        this.verticalScrollbar.onMouseMove(e);
-        this.horizontalScrollbar.onMouseMove(e);
-        this.draw();
+        const rect = this.ctx.containerElement.getBoundingClientRect();
+        const isPointerInsideTable = e.clientX >= rect.left && e.clientX <= rect.right && e.clientY >= rect.top && e.clientY <= rect.bottom;
+        const verticalNeedsFullRedraw = this.verticalScrollbar.onMouseMove(e, isPointerInsideTable);
+        const horizontalNeedsFullRedraw = this.horizontalScrollbar.onMouseMove(e, isPointerInsideTable);
+        if (verticalNeedsFullRedraw || horizontalNeedsFullRedraw) {
+            this.ctx.emit('draw');
+        }
+        else {
+            this.draw();
+        }
     }
     onMouseUp() {
         this.mousedownHeader = false;
@@ -491,9 +667,18 @@ export default class Scroller {
         this.horizontalScrollbar.onMouseUp();
         this.ctx.scrollerMove = false;
     }
+    onMouseOut(e) {
+        if (this.ctx.containerElement.contains(e.relatedTarget)) {
+            return;
+        }
+        this.verticalScrollbar.hideInnerScrollbar();
+        this.horizontalScrollbar.hideInnerScrollbar();
+        this.ctx.emit('draw');
+    }
     draw() {
-        this.verticalScrollbar.draw();
-        this.horizontalScrollbar.draw();
+        const verticalFocus = this.verticalScrollbar.draw();
+        const horizontalFocus = this.horizontalScrollbar.draw();
+        this.ctx.scrollerFocus = verticalFocus || horizontalFocus;
         const scrollX = Math.floor(this.horizontalScrollbar.scroll);
         const scrollY = Math.floor(this.verticalScrollbar.scroll);
         // 只有滚动条发生变化才触发绘制