@visactor/vtable-gantt 1.24.0 → 1.25.0

package/dist/vtable-gantt.js

@@ -36255,6 +36255,7 @@
         gantt.parsedOptions.baselineEndDateField = options.taskBar?.baselineEndDateField;
         gantt.parsedOptions.baselinePosition = options.taskBar?.baselinePosition ?? 'bottom';
         gantt.parsedOptions.taskBarClip = options?.taskBar?.clip ?? true;
+        gantt.parsedOptions.taskBarLocateIcon = options?.taskBar?.locateIcon ?? false;
         gantt.parsedOptions.projectSubTasksExpandable = options?.projectSubTasksExpandable ?? true;
         const { unit: minTimeUnit, startOfWeek, step } = gantt.parsedOptions.reverseSortedTimelineScales[0];
         gantt.parsedOptions.minDate = options?.minDate
@@ -43420,12 +43421,14 @@
       return limits ? limits.min && limits.min > orgWidth ? limits.min : limits.max && limits.max < orgWidth ? limits.max : orgWidth : orgWidth;
     }
     function _getScrollableVisibleRect(table) {
+      var _a, _b;
       let frozenColsWidth = 0,
+        frozenColsContentWidth = 0,
         rightFrozenColsWidth = 0;
-      table.frozenColCount > 0 && (frozenColsWidth = table.getFrozenColsWidth()), table.rightFrozenColCount > 0 && (rightFrozenColsWidth = table.getRightFrozenColsWidth());
+      table.frozenColCount > 0 && (frozenColsWidth = table.getFrozenColsWidth(), frozenColsContentWidth = null !== (_b = null === (_a = table.getFrozenColsContentWidth) || void 0 === _a ? void 0 : _a.call(table)) && void 0 !== _b ? _b : frozenColsWidth), table.rightFrozenColCount > 0 && (rightFrozenColsWidth = table.getRightFrozenColsWidth());
       let frozenRowsHeight = 0,
         bottomFrozenRowsHeight = 0;
-      return table.frozenRowCount > 0 && (frozenRowsHeight = table.getFrozenRowsHeight()), table.bottomFrozenRowCount > 0 && (bottomFrozenRowsHeight = table.getBottomFrozenRowsHeight()), new Rect$1(table.scrollLeft + frozenColsWidth, table.scrollTop + frozenRowsHeight, table.tableNoFrameWidth - frozenColsWidth - rightFrozenColsWidth, table.tableNoFrameHeight - frozenRowsHeight - bottomFrozenRowsHeight);
+      return table.frozenRowCount > 0 && (frozenRowsHeight = table.getFrozenRowsHeight()), table.bottomFrozenRowCount > 0 && (bottomFrozenRowsHeight = table.getBottomFrozenRowsHeight()), new Rect$1(table.scrollLeft + frozenColsContentWidth, table.scrollTop + frozenRowsHeight, table.tableNoFrameWidth - frozenColsWidth - rightFrozenColsWidth, table.tableNoFrameHeight - frozenRowsHeight - bottomFrozenRowsHeight);
     }
     function getStyleTheme(headerStyle, table, col, row, getProp, needGetTheme = !0) {
       const padding = getQuadProps(getProp("padding", headerStyle, col, row, table)),
@@ -44076,6 +44079,32 @@
         target: e.target
       }), tableEvent;
     }
+    function getCellEventArgsSetWithTable(e, table) {
+      var _a;
+      const eventArgsSet = getCellEventArgsSet(e);
+      if (!eventArgsSet.eventArgs) return eventArgsSet;
+      if (!table.options.scrollFrozenCols || 0 === (null === (_a = table.getFrozenColsOffset) || void 0 === _a ? void 0 : _a.call(table))) return eventArgsSet;
+      const xInTable = e.x - table.tableX,
+        yInTable = e.y - table.tableY;
+      if (xInTable < 0 || yInTable < 0 || xInTable > table.tableNoFrameWidth || yInTable > table.tableNoFrameHeight) return eventArgsSet;
+      const frozenViewportWidth = table.getFrozenColsWidth(),
+        pickedCol = eventArgsSet.eventArgs.col,
+        pickedRow = eventArgsSet.eventArgs.row;
+      if (pickedCol >= 0 && pickedCol < table.frozenColCount && !table.isRightFrozenColumn(pickedCol, pickedRow) && xInTable >= frozenViewportWidth) {
+        const cell = table.getCellAtRelativePosition(e.x, e.y);
+        if (-1 === cell.col || -1 === cell.row) return eventArgsSet;
+        const targetCell = table.scenegraph.getCell(cell.col, cell.row);
+        eventArgsSet.eventArgs = {
+          col: cell.col,
+          row: cell.row,
+          event: e,
+          targetCell: targetCell,
+          mergeInfo: getMergeCellInfo(targetCell),
+          target: targetCell
+        };
+      }
+      return eventArgsSet;
+    }
     function getTargetCell(target) {
       for (; target && target.parent;) {
         if ("cell" === target.role) return target;
@@ -47041,9 +47070,12 @@
     }
 
     function getColX(col, table, isRightFrozen) {
-      if (isRightFrozen) return Math.min(table.tableNoFrameWidth, table.getAllColsWidth()) - table.getColsWidth(col, table.colCount - 1);
+      var _a, _b, _c, _d, _e, _f;
+      if (isRightFrozen) return Math.min(table.tableNoFrameWidth, table.getAllColsWidth()) - table.getColsWidth(col, table.colCount - 1) + (null !== (_b = null === (_a = table.getRightFrozenColsScrollLeft) || void 0 === _a ? void 0 : _a.call(table)) && void 0 !== _b ? _b : 0);
+      const frozenOffset = null !== (_d = null === (_c = table.getFrozenColsOffset) || void 0 === _c ? void 0 : _c.call(table)) && void 0 !== _d ? _d : 0,
+        frozenScrollLeft = null !== (_f = null === (_e = table.getFrozenColsScrollLeft) || void 0 === _e ? void 0 : _e.call(table)) && void 0 !== _f ? _f : 0;
       let colX = table.getColsWidth(0, col);
-      return col >= table.frozenColCount && (colX -= table.scrollLeft), colX;
+      return col >= table.frozenColCount ? colX -= table.scrollLeft + frozenOffset : colX -= frozenScrollLeft, colX;
     }
     function getRowY(row, table, isBottomFrozen) {
       if (isBottomFrozen) return Math.min(table.tableNoFrameWidth, table.getAllRowsHeight()) - table.getRowsHeight(row, table.rowCount - 1);
@@ -47236,7 +47268,7 @@
       }
       addToGroup(componentGroup) {
         componentGroup.addChild(this.frozenShadowLine), componentGroup.addChild(this.rightFrozenShadowLine), componentGroup.addChild(this.columnResizeBgLine), componentGroup.addChild(this.columnResizeLine), componentGroup.addChild(this.columnResizeLabel), componentGroup.addChild(this.rowResizeBgLine), componentGroup.addChild(this.rowResizeLine), componentGroup.addChild(this.rowResizeLabel);
-        this.table.theme.scrollStyle.hoverOn && !this.table.theme.scrollStyle.barToSide ? (componentGroup.addChild(this.hScrollBar), componentGroup.addChild(this.vScrollBar)) : (componentGroup.stage.defaultLayer.addChild(this.hScrollBar), componentGroup.stage.defaultLayer.addChild(this.vScrollBar)), this.menu.bindTableComponent(componentGroup), this.drillIcon.appand(componentGroup), this.cellMover.appand(componentGroup);
+        this.table.theme.scrollStyle.hoverOn && !this.table.theme.scrollStyle.barToSide ? (componentGroup.addChild(this.hScrollBar), componentGroup.addChild(this.frozenHScrollBar), componentGroup.addChild(this.rightFrozenHScrollBar), componentGroup.addChild(this.vScrollBar)) : (componentGroup.stage.defaultLayer.addChild(this.hScrollBar), componentGroup.stage.defaultLayer.addChild(this.frozenHScrollBar), componentGroup.stage.defaultLayer.addChild(this.rightFrozenHScrollBar), componentGroup.stage.defaultLayer.addChild(this.vScrollBar)), this.menu.bindTableComponent(componentGroup), this.drillIcon.appand(componentGroup), this.cellMover.appand(componentGroup);
       }
       createScrollBar() {
         var _a, _b, _c, _d, _e, _f;
@@ -47266,7 +47298,33 @@
           sliderStyle: sliderStyle,
           range: [0, .1],
           visible: !1
-        }), this.hScrollBar.render(), this.hScrollBar.hideAll(), this.vScrollBar = new ScrollBar({
+        }), this.hScrollBar.render(), this.hScrollBar.hideAll(), this.frozenHScrollBar = new ScrollBar({
+          direction: "horizontal",
+          x: 2 * -this.table.tableNoFrameWidth,
+          y: 2 * -this.table.tableNoFrameHeight,
+          width: this.table.tableNoFrameWidth,
+          height: width,
+          padding: horizontalPadding,
+          railStyle: {
+            fill: scrollRailColor
+          },
+          sliderStyle: sliderStyle,
+          range: [0, .1],
+          visible: !1
+        }), this.frozenHScrollBar.render(), this.frozenHScrollBar.hideAll(), this.rightFrozenHScrollBar = new ScrollBar({
+          direction: "horizontal",
+          x: 2 * -this.table.tableNoFrameWidth,
+          y: 2 * -this.table.tableNoFrameHeight,
+          width: this.table.tableNoFrameWidth,
+          height: width,
+          padding: horizontalPadding,
+          railStyle: {
+            fill: scrollRailColor
+          },
+          sliderStyle: sliderStyle,
+          range: [0, .1],
+          visible: !1
+        }), this.rightFrozenHScrollBar.render(), this.rightFrozenHScrollBar.hideAll(), this.vScrollBar = new ScrollBar({
           direction: "vertical",
           x: 2 * -this.table.tableNoFrameWidth,
           y: 2 * -this.table.tableNoFrameHeight,
@@ -47282,9 +47340,11 @@
         }), this.vScrollBar.render(), this.vScrollBar.hideAll();
       }
       updateScrollBar() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
         const oldHorizontalBarPos = this.table.stateManager.scroll.horizontalBarPos,
           oldVerticalBarPos = this.table.stateManager.scroll.verticalBarPos,
+          oldFrozenHorizontalBarPos = this.table.stateManager.scroll.frozenHorizontalBarPos,
+          oldRightFrozenHorizontalBarPos = this.table.stateManager.scroll.rightFrozenHorizontalBarPos,
           theme = this.table.theme,
           width = null === (_a = theme.scrollStyle) || void 0 === _a ? void 0 : _a.width,
           visible1 = null === (_b = theme.scrollStyle) || void 0 === _b ? void 0 : _b.visible,
@@ -47296,18 +47356,23 @@
           totalWidth = this.table.getAllColsWidth(),
           frozenRowsHeight = this.table.getFrozenRowsHeight(),
           frozenColsWidth = this.table.getFrozenColsWidth(),
+          frozenColsContentWidth = null !== (_j = null === (_h = (_g = this.table).getFrozenColsContentWidth) || void 0 === _h ? void 0 : _h.call(_g)) && void 0 !== _j ? _j : frozenColsWidth,
           bottomFrozenRowsHeight = this.table.getBottomFrozenRowsHeight(),
           rightFrozenColsWidth = this.table.getRightFrozenColsWidth(),
+          rightFrozenColsContentWidth = null !== (_m = null === (_l = (_k = this.table).getRightFrozenColsContentWidth) || void 0 === _l ? void 0 : _l.call(_k)) && void 0 !== _m ? _m : rightFrozenColsWidth,
           hoverOn = this.table.theme.scrollStyle.hoverOn,
-          sizeTolerance = (null === (_g = this.table.options.customConfig) || void 0 === _g ? void 0 : _g._disableColumnAndRowSizeRound) ? 1 : 0;
+          sizeTolerance = (null === (_o = this.table.options.customConfig) || void 0 === _o ? void 0 : _o._disableColumnAndRowSizeRound) ? 1 : 0;
         if (totalWidth > tableWidth + sizeTolerance) {
           const y = Math.min(tableHeight, totalHeight),
-            rangeEnd = Math.max(.05, (tableWidth - frozenColsWidth) / (totalWidth - frozenColsWidth));
+            bodyViewportWidth = tableWidth - frozenColsWidth - rightFrozenColsWidth,
+            bodyContentWidth = totalWidth - frozenColsContentWidth - rightFrozenColsContentWidth,
+            rangeEnd = bodyContentWidth > 0 ? Math.max(.05, bodyViewportWidth / bodyContentWidth) : 1;
           let attrY = 0;
           attrY = this.table.theme.scrollStyle.barToSide ? this.table.tableNoFrameHeight - (hoverOn ? width : -this.table.scenegraph.tableGroup.attribute.y) + this.table.tableY : y - (hoverOn ? width : -this.table.scenegraph.tableGroup.attribute.y);
           let hScrollBarx = frozenColsWidth + (hoverOn ? 0 : this.table.scenegraph.tableGroup.attribute.x),
             hScrollBarWidth = tableWidth - frozenColsWidth - rightFrozenColsWidth;
-          null !== (_j = null === (_h = this.table.theme.scrollStyle) || void 0 === _h ? void 0 : _h.ignoreFrozenCols) && void 0 !== _j && _j ? (hScrollBarx = hoverOn ? 0 : this.table.scenegraph.tableGroup.attribute.x, hScrollBarWidth = tableWidth) : (hScrollBarx = frozenColsWidth + (hoverOn ? 0 : this.table.scenegraph.tableGroup.attribute.x), hScrollBarWidth = tableWidth - frozenColsWidth - rightFrozenColsWidth), this.hScrollBar.setAttributes({
+          const ignoreFrozenCols = null !== (_q = null === (_p = this.table.theme.scrollStyle) || void 0 === _p ? void 0 : _p.ignoreFrozenCols) && void 0 !== _q && _q;
+          ignoreFrozenCols ? (hScrollBarx = hoverOn ? 0 : this.table.scenegraph.tableGroup.attribute.x, hScrollBarWidth = tableWidth) : (hScrollBarx = frozenColsWidth + (hoverOn ? 0 : this.table.scenegraph.tableGroup.attribute.x), hScrollBarWidth = tableWidth - frozenColsWidth - rightFrozenColsWidth), this.hScrollBar.setAttributes({
             x: hScrollBarx,
             y: attrY,
             width: hScrollBarWidth,
@@ -47319,11 +47384,65 @@
             x: bounds.x1,
             y: bounds.y1
           }, "always" === horizontalVisible && this.hScrollBar.showAll();
+          const frozenScrollable = this.table.options.scrollFrozenCols && this.table.getFrozenColsOffset() > 0;
+          if (!ignoreFrozenCols && frozenScrollable) {
+            const frozenRangeEnd = Math.max(.05, frozenColsWidth / frozenColsContentWidth),
+              x = hoverOn ? 0 : this.table.scenegraph.tableGroup.attribute.x;
+            this.frozenHScrollBar.setAttributes({
+              x: x,
+              y: attrY,
+              width: frozenColsWidth,
+              range: [0, frozenRangeEnd],
+              visible: "always" === horizontalVisible
+            });
+            const bounds = this.frozenHScrollBar.AABBBounds && this.frozenHScrollBar.globalAABBBounds;
+            this.frozenHScrollBar._viewPosition = {
+              x: bounds.x1,
+              y: bounds.y1
+            }, "always" === horizontalVisible && this.frozenHScrollBar.showAll();
+          } else this.frozenHScrollBar.setAttributes({
+            x: 2 * -this.table.tableNoFrameWidth,
+            y: 2 * -this.table.tableNoFrameHeight,
+            width: 0,
+            visible: !1
+          });
+          const rightFrozenScrollable = this.table.options.scrollRightFrozenCols && this.table.getRightFrozenColsOffset() > 0;
+          if (!ignoreFrozenCols && rightFrozenScrollable) {
+            const rightFrozenRangeEnd = Math.max(.05, rightFrozenColsWidth / rightFrozenColsContentWidth),
+              x = tableWidth - rightFrozenColsWidth + (hoverOn ? 0 : this.table.scenegraph.tableGroup.attribute.x);
+            this.rightFrozenHScrollBar.setAttributes({
+              x: x,
+              y: attrY,
+              width: rightFrozenColsWidth,
+              range: [0, rightFrozenRangeEnd],
+              visible: "always" === horizontalVisible
+            });
+            const bounds = this.rightFrozenHScrollBar.AABBBounds && this.rightFrozenHScrollBar.globalAABBBounds;
+            this.rightFrozenHScrollBar._viewPosition = {
+              x: bounds.x1,
+              y: bounds.y1
+            }, "always" === horizontalVisible && this.rightFrozenHScrollBar.showAll();
+          } else this.rightFrozenHScrollBar.setAttributes({
+            x: 2 * -this.table.tableNoFrameWidth,
+            y: 2 * -this.table.tableNoFrameHeight,
+            width: 0,
+            visible: !1
+          });
         } else this.hScrollBar.setAttributes({
           x: 2 * -this.table.tableNoFrameWidth,
           y: 2 * -this.table.tableNoFrameHeight,
           width: 0,
           visible: !1
+        }), this.frozenHScrollBar.setAttributes({
+          x: 2 * -this.table.tableNoFrameWidth,
+          y: 2 * -this.table.tableNoFrameHeight,
+          width: 0,
+          visible: !1
+        }), this.rightFrozenHScrollBar.setAttributes({
+          x: 2 * -this.table.tableNoFrameWidth,
+          y: 2 * -this.table.tableNoFrameHeight,
+          width: 0,
+          visible: !1
         });
         if (totalHeight > tableHeight + sizeTolerance) {
           const x = Math.min(tableWidth, totalWidth),
@@ -47347,7 +47466,7 @@
           height: 0,
           visible: !1
         });
-        this.table.stateManager.setScrollLeft(oldHorizontalBarPos), this.table.stateManager.setScrollTop(oldVerticalBarPos);
+        this.table.stateManager.setScrollLeft(oldHorizontalBarPos), this.table.stateManager.setFrozenColsScrollLeft(oldFrozenHorizontalBarPos, !1), this.table.stateManager.setRightFrozenColsScrollLeft(oldRightFrozenHorizontalBarPos, !1), this.table.stateManager.setScrollTop(oldVerticalBarPos);
       }
       hideResizeCol() {
         this.columnResizeLine.setAttribute("visible", !1), this.columnResizeBgLine.setAttribute("visible", !1), this.columnResizeLabel.setAttribute("visible", !1), this.columnResizeLabel.hideAll();
@@ -47471,9 +47590,9 @@
         this.cellMover.update(backX, lineX, backY, lineY);
       }
       setFrozenColumnShadow(col, isRightFrozen) {
-        var _a, _b;
-        const colX = getColX(col, this.table, isRightFrozen);
-        col < 0 || "always" !== (null === (_b = null === (_a = this.table.theme.frozenColumnLine) || void 0 === _a ? void 0 : _a.shadow) || void 0 === _b ? void 0 : _b.visible) ? this.frozenShadowLine.setAttributes({
+        var _a, _b, _c, _d, _e;
+        const colX = !isRightFrozen && col === this.table.frozenColCount - 1 && (null !== (_c = null === (_b = (_a = this.table).getFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0) > 0 ? this.table.getFrozenColsWidth() : getColX(col, this.table, isRightFrozen);
+        col < 0 || "always" !== (null === (_e = null === (_d = this.table.theme.frozenColumnLine) || void 0 === _d ? void 0 : _d.shadow) || void 0 === _e ? void 0 : _e.visible) ? this.frozenShadowLine.setAttributes({
           visible: !1,
           x: colX,
           height: this.table.getDrawRange().height
@@ -47484,9 +47603,9 @@
         });
       }
       setRightFrozenColumnShadow(col) {
-        var _a, _b;
-        const colX = getColX(col, this.table, !0);
-        col >= this.table.colCount || "always" !== (null === (_b = null === (_a = this.table.theme.frozenColumnLine) || void 0 === _a ? void 0 : _a.shadow) || void 0 === _b ? void 0 : _b.visible) ? this.rightFrozenShadowLine.setAttributes({
+        var _a, _b, _c, _d, _e;
+        const colX = this.table.options.scrollRightFrozenCols && (null !== (_c = null === (_b = (_a = this.table).getRightFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0) > 0 ? this.table.tableNoFrameWidth - this.table.getRightFrozenColsWidth() : getColX(col, this.table, !0);
+        col >= this.table.colCount || "always" !== (null === (_e = null === (_d = this.table.theme.frozenColumnLine) || void 0 === _d ? void 0 : _d.shadow) || void 0 === _e ? void 0 : _e.visible) ? this.rightFrozenShadowLine.setAttributes({
           visible: !1,
           x: colX - this.rightFrozenShadowLine.attribute.width,
           height: this.table.getDrawRange().height
@@ -47522,13 +47641,23 @@
         var _a;
         const visible1 = this.table.theme.scrollStyle.visible,
           horizontalVisible = null !== (_a = this.table.theme.scrollStyle.horizontalVisible) && void 0 !== _a ? _a : visible1;
-        "focus" !== horizontalVisible && "scrolling" !== horizontalVisible || (this.hScrollBar.setAttribute("visible", !1), this.hScrollBar.hideAll(), this.table.scenegraph.updateNextFrame());
+        "focus" !== horizontalVisible && "scrolling" !== horizontalVisible || (this.hScrollBar.setAttribute("visible", !1), this.hScrollBar.hideAll(), this.frozenHScrollBar.setAttribute("visible", !1), this.frozenHScrollBar.hideAll(), this.rightFrozenHScrollBar.setAttribute("visible", !1), this.rightFrozenHScrollBar.hideAll(), this._horizontalScrollBarTarget = void 0, this.table.scenegraph.updateNextFrame());
       }
-      showHorizontalScrollBar() {
+      showHorizontalScrollBar(target = "all") {
         var _a;
         const visible1 = this.table.theme.scrollStyle.visible,
           horizontalVisible = null !== (_a = this.table.theme.scrollStyle.horizontalVisible) && void 0 !== _a ? _a : visible1;
-        "focus" !== horizontalVisible && "scrolling" !== horizontalVisible || (this.hScrollBar.setAttribute("visible", !0), this.hScrollBar.showAll(), this.table.scenegraph.updateNextFrame());
+        if ("focus" !== horizontalVisible && "scrolling" !== horizontalVisible) return;
+        if (this._horizontalScrollBarTarget === target) return;
+        this._horizontalScrollBarTarget = target;
+        const showFrozen = "all" === target || "frozen" === target,
+          showRightFrozen = "all" === target || "rightFrozen" === target,
+          bodyVisible = ("all" === target || "body" === target) && this.hScrollBar.attribute.width > 0;
+        this.hScrollBar.setAttribute("visible", bodyVisible), bodyVisible ? this.hScrollBar.showAll() : this.hScrollBar.hideAll();
+        const frozenVisible = showFrozen && this.frozenHScrollBar.attribute.width > 0;
+        this.frozenHScrollBar.setAttribute("visible", frozenVisible), frozenVisible ? this.frozenHScrollBar.showAll() : this.frozenHScrollBar.hideAll();
+        const rightFrozenVisible = showRightFrozen && this.rightFrozenHScrollBar.attribute.width > 0;
+        this.rightFrozenHScrollBar.setAttribute("visible", rightFrozenVisible), rightFrozenVisible ? this.rightFrozenHScrollBar.showAll() : this.rightFrozenHScrollBar.hideAll(), this.table.scenegraph.updateNextFrame();
       }
       updateVerticalScrollBarPos(topRatio) {
         const range = this.vScrollBar.attribute.range,
@@ -47552,6 +47681,28 @@
           y: bounds.y1
         };
       }
+      updateFrozenHorizontalScrollBarPos(leftRatio) {
+        const range = this.frozenHScrollBar.attribute.range,
+          size = range[1] - range[0],
+          range0 = leftRatio * (1 - size);
+        this.frozenHScrollBar.setAttribute("range", [range0, range0 + size]);
+        const bounds = this.frozenHScrollBar.AABBBounds && this.frozenHScrollBar.globalAABBBounds;
+        this.frozenHScrollBar._viewPosition = {
+          x: bounds.x1,
+          y: bounds.y1
+        };
+      }
+      updateRightFrozenHorizontalScrollBarPos(leftRatio) {
+        const range = this.rightFrozenHScrollBar.attribute.range,
+          size = range[1] - range[0],
+          range0 = leftRatio * (1 - size);
+        this.rightFrozenHScrollBar.setAttribute("range", [range0, range0 + size]);
+        const bounds = this.rightFrozenHScrollBar.AABBBounds && this.rightFrozenHScrollBar.globalAABBBounds;
+        this.rightFrozenHScrollBar._viewPosition = {
+          x: bounds.x1,
+          y: bounds.y1
+        };
+      }
       updateStyle() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
         const theme = this.table.theme,
@@ -47581,6 +47732,20 @@
             fill: scrollRailColor
           },
           sliderStyle: sliderStyle
+        }), this.frozenHScrollBar.setAttributes({
+          height: width,
+          padding: horizontalPadding,
+          railStyle: {
+            fill: scrollRailColor
+          },
+          sliderStyle: sliderStyle
+        }), this.rightFrozenHScrollBar.setAttributes({
+          height: width,
+          padding: horizontalPadding,
+          railStyle: {
+            fill: scrollRailColor
+          },
+          sliderStyle: sliderStyle
         });
         const columnResizeColor = null === (_g = theme.columnResize) || void 0 === _g ? void 0 : _g.lineColor,
           columnResizeWidth = null === (_h = theme.columnResize) || void 0 === _h ? void 0 : _h.lineWidth,
@@ -49694,29 +49859,50 @@
       drawShape(group, context, xOrigin, yOrigin, doFill, doStroke, fVisible, sVisible, groupAttribute, drawContext, fillCb, strokeCb, doFillOrStroke) {
         var _a, _b, _c, _d, _e, _f;
         const table = group.stage.table;
-        if (table) if ("body" === group.role) {
-          drawClipRect(context, -(null !== (_a = group.attribute.x) && void 0 !== _a ? _a : 0) + table.getFrozenColsWidth(), -(null !== (_b = group.attribute.y) && void 0 !== _b ? _b : 0) + table.getFrozenRowsHeight(), group.parent.attribute.width - table.getFrozenColsWidth() - table.getRightFrozenColsWidth(), group.parent.attribute.height - table.getFrozenRowsHeight() - table.getBottomFrozenRowsHeight());
+        if (!table) return;
+        const clipInflate = getSelectOverlayClipInflate(group, table);
+        if ("body" === group.role) {
+          drawClipRect(context, -(null !== (_a = group.attribute.x) && void 0 !== _a ? _a : 0) + table.getFrozenColsWidth() - clipInflate.left, -(null !== (_b = group.attribute.y) && void 0 !== _b ? _b : 0) + table.getFrozenRowsHeight() - clipInflate.top, group.parent.attribute.width - table.getFrozenColsWidth() - table.getRightFrozenColsWidth() + clipInflate.left + clipInflate.right, group.parent.attribute.height - table.getFrozenRowsHeight() - table.getBottomFrozenRowsHeight() + clipInflate.top + clipInflate.bottom);
         } else if ("row-header" === group.role) {
-          drawClipRect(context, 0, -(null !== (_c = group.attribute.y) && void 0 !== _c ? _c : 0) + table.getFrozenRowsHeight(), table.getFrozenColsWidth(), group.parent.attribute.height - table.getFrozenRowsHeight() - table.getBottomFrozenRowsHeight());
+          drawClipRect(context, 0 - clipInflate.left, -(null !== (_c = group.attribute.y) && void 0 !== _c ? _c : 0) + table.getFrozenRowsHeight() - clipInflate.top, table.getFrozenColsWidth() + clipInflate.left + clipInflate.right, group.parent.attribute.height - table.getFrozenRowsHeight() - table.getBottomFrozenRowsHeight() + clipInflate.top + clipInflate.bottom);
         } else if ("col-header" === group.role) {
-          drawClipRect(context, -(null !== (_d = group.attribute.x) && void 0 !== _d ? _d : 0) + table.getFrozenColsWidth(), 0, group.parent.attribute.width - table.getFrozenColsWidth() - table.getRightFrozenColsWidth(), table.getFrozenRowsHeight());
+          drawClipRect(context, -(null !== (_d = group.attribute.x) && void 0 !== _d ? _d : 0) + table.getFrozenColsWidth() - clipInflate.left, 0 - clipInflate.top, group.parent.attribute.width - table.getFrozenColsWidth() - table.getRightFrozenColsWidth() + clipInflate.left + clipInflate.right, table.getFrozenRowsHeight() + clipInflate.top + clipInflate.bottom);
         } else if ("right-frozen" === group.role) {
-          drawClipRect(context, 0, -(null !== (_e = group.attribute.y) && void 0 !== _e ? _e : 0) + table.getFrozenRowsHeight(), table.getRightFrozenColsWidth(), group.parent.attribute.height - table.getFrozenRowsHeight() - table.getBottomFrozenRowsHeight());
+          drawClipRect(context, 0 - clipInflate.left, -(null !== (_e = group.attribute.y) && void 0 !== _e ? _e : 0) + table.getFrozenRowsHeight() - clipInflate.top, table.getRightFrozenColsWidth() + clipInflate.left + clipInflate.right, group.parent.attribute.height - table.getFrozenRowsHeight() - table.getBottomFrozenRowsHeight() + clipInflate.top + clipInflate.bottom);
         } else if ("bottom-frozen" === group.role) {
-          drawClipRect(context, -(null !== (_f = group.attribute.x) && void 0 !== _f ? _f : 0) + table.getFrozenColsWidth(), 0, group.parent.attribute.width - table.getFrozenColsWidth() - table.getRightFrozenColsWidth(), table.getBottomFrozenRowsHeight());
+          drawClipRect(context, -(null !== (_f = group.attribute.x) && void 0 !== _f ? _f : 0) + table.getFrozenColsWidth() - clipInflate.left, 0 - clipInflate.top, group.parent.attribute.width - table.getFrozenColsWidth() - table.getRightFrozenColsWidth() + clipInflate.left + clipInflate.right, table.getBottomFrozenRowsHeight() + clipInflate.top + clipInflate.bottom);
         } else if ("corner-header" === group.role) {
-          drawClipRect(context, 0, 0, table.getFrozenColsWidth(), table.getFrozenRowsHeight());
+          drawClipRect(context, 0 - clipInflate.left, 0 - clipInflate.top, table.getFrozenColsWidth() + clipInflate.left + clipInflate.right, table.getFrozenRowsHeight() + clipInflate.top + clipInflate.bottom);
         } else if ("corner-right-top-header" === group.role) {
-          drawClipRect(context, 0, 0, table.getRightFrozenColsWidth(), table.getFrozenRowsHeight());
+          drawClipRect(context, 0 - clipInflate.left, 0 - clipInflate.top, table.getRightFrozenColsWidth() + clipInflate.left + clipInflate.right, table.getFrozenRowsHeight() + clipInflate.top + clipInflate.bottom);
         } else if ("corner-right-bottom-header" === group.role) {
-          drawClipRect(context, 0, 0, table.getRightFrozenColsWidth(), table.getBottomFrozenRowsHeight());
+          drawClipRect(context, 0 - clipInflate.left, 0 - clipInflate.top, table.getRightFrozenColsWidth() + clipInflate.left + clipInflate.right, table.getBottomFrozenRowsHeight() + clipInflate.top + clipInflate.bottom);
         } else if ("corner-left-bottom-header" === group.role) {
-          drawClipRect(context, 0, 0, table.getFrozenColsWidth(), table.getBottomFrozenRowsHeight());
+          drawClipRect(context, 0 - clipInflate.left, 0 - clipInflate.top, table.getFrozenColsWidth() + clipInflate.left + clipInflate.right, table.getBottomFrozenRowsHeight() + clipInflate.top + clipInflate.bottom);
         }
       }
     };
     ClipBodyGroupBeforeRenderContribution = __decorate$5([injectable()], ClipBodyGroupBeforeRenderContribution);
     const precision = Math.pow(2, 24);
+    function getSelectOverlayClipInflate(group, table) {
+      var _a, _b, _c;
+      if (!("select-overlay" === group.name)) return {
+        left: 0,
+        top: 0,
+        right: 0,
+        bottom: 0
+      };
+      const lineWidth = null === (_a = table.theme.selectionStyle) || void 0 === _a ? void 0 : _a.cellBorderLineWidth,
+        maxLineWidth = Array.isArray(lineWidth) ? Math.max(...lineWidth.filter(v => "number" == typeof v)) : "number" == typeof lineWidth ? lineWidth : 0,
+        baseInflate = Math.max(1, Math.ceil(maxLineWidth / 2) + 1),
+        handleInflate = !!(null === (_b = table.options.excelOptions) || void 0 === _b ? void 0 : _b.fillHandle) && 1 === (null === (_c = table.stateManager.select.ranges) || void 0 === _c ? void 0 : _c.length) ? 3 : 0;
+      return {
+        left: baseInflate,
+        top: baseInflate,
+        right: Math.max(baseInflate, handleInflate),
+        bottom: Math.max(baseInflate, handleInflate)
+      };
+    }
     function drawClipRect(context, x, y, width, height) {
       context.beginPath();
       const matrix = context.applyedMatrix;
@@ -51441,10 +51627,11 @@
         });
       }
       setX(x, isEnd = !1) {
+        var _a, _b, _c;
         return __awaiter$3(this, void 0, void 0, function* () {
           const xLimitLeft = this.table.getColsWidth(this.bodyLeftCol, this.bodyLeftCol + (this.colEnd - this.colStart + 1)) / 2,
             xLimitRight = this.table.getAllColsWidth() - xLimitLeft,
-            screenLeft = this.table.getTargetColAt(x + this.table.scenegraph.rowHeaderGroup.attribute.width);
+            screenLeft = this.table.getTargetColAt(x + this.table.scenegraph.rowHeaderGroup.attribute.width + (null !== (_c = null === (_b = (_a = this.table).getFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0));
           screenLeft && (this.screenLeftCol = screenLeft.col), x < xLimitLeft && this.colStart === this.bodyLeftCol || x > xLimitRight && this.colEnd === this.bodyRightCol || this.table.scenegraph.bodyGroup.firstChild && "group" === this.table.scenegraph.bodyGroup.firstChild.type && 0 === this.table.scenegraph.bodyGroup.firstChild.childrenCount ? (this.updateDeltaX(x), this.table.scenegraph.setBodyAndColHeaderX(-x + this.deltaX)) : this.dynamicSetX(x, screenLeft, isEnd);
         });
       }
@@ -51546,6 +51733,7 @@
         }
       }
       updateDeltaX(x, screenLeftX, screenLeftCol) {
+        var _a, _b, _c, _d, _e, _f;
         if (this.colStart === this.bodyLeftCol) {
           const colGroup = this.table.scenegraph.getColGroup(this.colStart);
           if (colGroup) {
@@ -51555,7 +51743,7 @@
         } else if (this.colEnd === this.bodyRightCol) {
           const colGroup = this.table.scenegraph.getColGroup(this.colEnd);
           if (colGroup) {
-            const deltaX = colGroup.attribute.x + colGroup.attribute.width - (this.table.getAllColsWidth() - this.table.getFrozenColsWidth() - this.table.getRightFrozenColsWidth());
+            const deltaX = colGroup.attribute.x + colGroup.attribute.width - (this.table.getAllColsWidth() - (null !== (_c = null === (_b = (_a = this.table).getFrozenColsContentWidth) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : this.table.getFrozenColsWidth()) - (null !== (_f = null === (_e = (_d = this.table).getRightFrozenColsContentWidth) || void 0 === _e ? void 0 : _e.call(_d)) && void 0 !== _f ? _f : this.table.getRightFrozenColsWidth()));
             this.deltaX = -deltaX;
           }
         } else if (isValid$1(screenLeftX) && isValid$1(screenLeftCol)) {
@@ -51634,7 +51822,7 @@
       });
     }
     function updateComponent(selectComp, key, scene) {
-      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+      var _a, _b, _c, _d, _e, _f, _g, _h;
       const table = scene.table,
         [startColStr, startRowStr, endColStr, endRowStr] = key.split("-"),
         startCol = parseInt(startColStr, 10),
@@ -51667,10 +51855,13 @@
       }
       const colsWidth = table.getColsWidth(computeRectCellRangeStartCol, computeRectCellRangeEndCol),
         rowsHeight = table.getRowsHeight(computeRectCellRangeStartRow, computeRectCellRangeEndRow),
+        overlayGroup = scene.getSelectOverlayGroup(selectComp.role),
+        offsetX = scene.tableGroup.attribute.x + (null !== (_a = overlayGroup.attribute.x) && void 0 !== _a ? _a : 0),
+        offsetY = scene.tableGroup.attribute.y + (null !== (_b = overlayGroup.attribute.y) && void 0 !== _b ? _b : 0),
         firstCellBound = scene.highPerformanceGetCell(computeRectCellRangeStartCol, computeRectCellRangeStartRow).globalAABBBounds;
       if (selectComp.rect.setAttributes({
-        x: firstCellBound.x1 - scene.tableGroup.attribute.x,
-        y: firstCellBound.y1 - scene.tableGroup.attribute.y,
+        x: firstCellBound.x1 - offsetX,
+        y: firstCellBound.y1 - offsetY,
         width: colsWidth,
         height: rowsHeight,
         visible: !0
@@ -51680,16 +51871,16 @@
         currentHeight: rowsHeight,
         selectComp: selectComp
       }), selectComp.fillhandle) {
-        const fillHandle = null === (_a = scene.table.options.excelOptions) || void 0 === _a ? void 0 : _a.fillHandle;
+        const fillHandle = null === (_c = scene.table.options.excelOptions) || void 0 === _c ? void 0 : _c.fillHandle;
         let lastCellBound,
           handlerX,
           visible = !0;
         "function" == typeof fillHandle && (visible = fillHandle({
           selectRanges: scene.table.stateManager.select.ranges,
           table: scene.table
-        })), endCol < table.colCount - 1 ? (lastCellBound = scene.highPerformanceGetCell(endCol, endRow).globalAABBBounds, handlerX = lastCellBound.x2 - scene.tableGroup.attribute.x - 3) : 0 === startCol ? (lastCellBound = scene.highPerformanceGetCell(0, endRow).globalAABBBounds, handlerX = lastCellBound.x1 - scene.tableGroup.attribute.x) : (lastCellBound = scene.highPerformanceGetCell(startCol - 1, endRow).globalAABBBounds, handlerX = lastCellBound.x2 - scene.tableGroup.attribute.x - 3), lastCellBound = endRow < table.rowCount - 1 ? scene.highPerformanceGetCell(endCol, endRow).globalAABBBounds : scene.highPerformanceGetCell(endCol, startRow - 1).globalAABBBounds;
-        const handlerY = lastCellBound.y2 - scene.tableGroup.attribute.y - 3;
-        null === (_b = selectComp.fillhandle) || void 0 === _b || _b.setAttributes({
+        })), endCol < table.colCount - 1 ? (lastCellBound = scene.highPerformanceGetCell(endCol, endRow).globalAABBBounds, handlerX = lastCellBound.x2 - offsetX - 3) : 0 === startCol ? (lastCellBound = scene.highPerformanceGetCell(0, endRow).globalAABBBounds, handlerX = lastCellBound.x1 - offsetX) : (lastCellBound = scene.highPerformanceGetCell(startCol - 1, endRow).globalAABBBounds, handlerX = lastCellBound.x2 - offsetX - 3), lastCellBound = endRow < table.rowCount - 1 ? scene.highPerformanceGetCell(endCol, endRow).globalAABBBounds : scene.highPerformanceGetCell(endCol, startRow - 1).globalAABBBounds;
+        const handlerY = lastCellBound.y2 - offsetY - 3;
+        null === (_d = selectComp.fillhandle) || void 0 === _d || _d.setAttributes({
           x: handlerX,
           y: handlerY,
           width: 6,
@@ -51697,72 +51888,15 @@
           visible: visible
         });
       }
-      let isNearRowHeader = !!table.frozenColCount && startCol === table.frozenColCount;
-      if (!isNearRowHeader && table.frozenColCount && table.scrollLeft > 0 && startCol >= table.frozenColCount) {
-        table.getColsWidth(0, startCol - 1) - table.scrollLeft < table.getFrozenColsWidth() && (isNearRowHeader = !0);
-      }
-      let isNearRightRowHeader = !!table.rightFrozenColCount && table.rightFrozenColCount > 0 && endCol === table.colCount - table.rightFrozenColCount - 1;
-      if (!isNearRightRowHeader && table.rightFrozenColCount && endCol < table.colCount - table.rightFrozenColCount) {
-        table.getColsWidth(0, endCol) - table.scrollLeft > table.tableNoFrameWidth - table.getRightFrozenColsWidth() && (isNearRightRowHeader = !0);
-      }
-      let isNearColHeader = !table.frozenRowCount || startRow === table.frozenRowCount;
-      if (!isNearColHeader && table.frozenRowCount && table.scrollTop > 0 && startRow >= table.frozenRowCount) {
-        table.getRowsHeight(0, startRow - 1) - table.scrollTop < table.getFrozenRowsHeight() && (isNearColHeader = !0);
-      }
-      let isNearBottomColHeader = !!table.bottomFrozenRowCount && endRow === table.rowCount - table.bottomFrozenRowCount - 1;
-      if (!isNearBottomColHeader && table.bottomFrozenRowCount && endRow < table.rowCount - table.bottomFrozenRowCount) {
-        table.getRowsHeight(0, endRow) - table.scrollTop > table.tableNoFrameHeight - table.getBottomFrozenRowsHeight() && (isNearBottomColHeader = !0);
-      }
-      const {
-        dynamicUpdateSelectionSize: dynamicUpdateSelectionSize
-      } = table.theme.selectionStyle;
-      if (isNearRowHeader && (selectComp.rect.attribute.stroke[3] || dynamicUpdateSelectionSize) || isNearRightRowHeader && (selectComp.rect.attribute.stroke[1] || dynamicUpdateSelectionSize) || isNearColHeader && (selectComp.rect.attribute.stroke[0] || dynamicUpdateSelectionSize) || isNearBottomColHeader && (selectComp.rect.attribute.stroke[2] || dynamicUpdateSelectionSize)) {
-        if (isNearRowHeader && selectComp.rect.attribute.stroke[3] && scene.tableGroup.insertAfter(selectComp.rect, "columnHeader" === selectComp.role ? scene.cornerHeaderGroup : "bottomFrozen" === selectComp.role ? scene.leftBottomCornerGroup : scene.rowHeaderGroup), isNearBottomColHeader && selectComp.rect.attribute.stroke[2] && scene.tableGroup.insertAfter(selectComp.rect, "rowHeader" === selectComp.role ? scene.leftBottomCornerGroup : "rightFrozen" === selectComp.role ? scene.rightBottomCornerGroup : scene.bottomFrozenGroup), isNearColHeader && selectComp.rect.attribute.stroke[0] && scene.tableGroup.insertAfter(selectComp.rect, "rowHeader" === selectComp.role ? scene.cornerHeaderGroup : "rightFrozen" === selectComp.role ? scene.rightTopCornerGroup : scene.colHeaderGroup), isNearRightRowHeader && selectComp.rect.attribute.stroke[1] && scene.tableGroup.insertAfter(selectComp.rect, "columnHeader" === selectComp.role ? scene.rightTopCornerGroup : "bottomFrozen" === selectComp.role ? scene.rightBottomCornerGroup : scene.rightFrozenGroup), selectComp.rect.attribute.x < table.getFrozenColsWidth() && table.scrollLeft > 0 && ("body" === selectComp.role || "columnHeader" === selectComp.role || "bottomFrozen" === selectComp.role)) {
-          const width = selectComp.rect.attribute.width - (table.getFrozenColsWidth() - selectComp.rect.attribute.x);
-          selectComp.rect.setAttributes({
-            x: selectComp.rect.attribute.x + (table.getFrozenColsWidth() - selectComp.rect.attribute.x),
-            width: width > 0 ? width : 0
-          }), null === (_c = selectComp.fillhandle) || void 0 === _c || _c.setAttributes({
-            visible: width > 0
-          });
-        }
-        if (table.getRightFrozenColsWidth() > 0 && scene.rightFrozenGroup.attribute.height > 0 && selectComp.rect.attribute.x + selectComp.rect.attribute.width > scene.rightFrozenGroup.attribute.x && ("body" === selectComp.role || "columnHeader" === selectComp.role || "bottomFrozen" === selectComp.role)) {
-          const width = scene.rightFrozenGroup.attribute.x - selectComp.rect.attribute.x;
-          selectComp.rect.setAttributes({
-            x: selectComp.rect.attribute.x,
-            width: width > 0 ? width : 0
-          }), null === (_d = selectComp.fillhandle) || void 0 === _d || _d.setAttributes({
-            visible: width - colsWidth > 0
-          });
-        }
-        if (selectComp.rect.attribute.y < scene.colHeaderGroup.attribute.height && table.scrollTop > 0 && ("body" === selectComp.role || "rowHeader" === selectComp.role || "rightFrozen" === selectComp.role)) {
-          const height = selectComp.rect.attribute.height - (scene.colHeaderGroup.attribute.height - selectComp.rect.attribute.y);
-          selectComp.rect.setAttributes({
-            y: selectComp.rect.attribute.y + (scene.colHeaderGroup.attribute.height - selectComp.rect.attribute.y),
-            height: height > 0 ? height : 0
-          }), null === (_e = selectComp.fillhandle) || void 0 === _e || _e.setAttributes({
-            visible: height > 0
-          });
-        }
-        if (scene.bottomFrozenGroup.attribute.width > 0 && scene.bottomFrozenGroup.attribute.height > 0 && selectComp.rect.attribute.y + selectComp.rect.attribute.height > scene.bottomFrozenGroup.attribute.y && ("body" === selectComp.role || "rowHeader" === selectComp.role || "rightFrozen" === selectComp.role)) {
-          const height = scene.bottomFrozenGroup.attribute.y - selectComp.rect.attribute.y;
-          selectComp.rect.setAttributes({
-            y: selectComp.rect.attribute.y,
-            height: height > 0 ? height : 0
-          }), null === (_f = selectComp.fillhandle) || void 0 === _f || _f.setAttributes({
-            visible: height - rowsHeight > 0
-          });
-        }
-      } else scene.tableGroup.insertAfter(selectComp.rect, "body" === selectComp.role ? scene.bodyGroup : "columnHeader" === selectComp.role ? scene.colHeaderGroup : "rowHeader" === selectComp.role ? scene.rowHeaderGroup : "cornerHeader" === selectComp.role ? scene.cornerHeaderGroup : "rightTopCorner" === selectComp.role ? scene.rightTopCornerGroup : "rightFrozen" === selectComp.role ? scene.rightFrozenGroup : "leftBottomCorner" === selectComp.role ? scene.leftBottomCornerGroup : "bottomFrozen" === selectComp.role ? scene.bottomFrozenGroup : scene.rightBottomCornerGroup);
       let diffSize = 0;
-      "number" == typeof selectComp.rect.attribute.lineWidth && (diffSize = Math.ceil(selectComp.rect.attribute.lineWidth / 2)), endCol === table.colCount - 1 && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_g = selectComp.rect.attribute.lineWidth[1]) && void 0 !== _g ? _g : 0) / 2)), selectComp.rect.setAttributes({
+      "number" == typeof selectComp.rect.attribute.lineWidth && (diffSize = Math.ceil(selectComp.rect.attribute.lineWidth / 2)), endCol === table.colCount - 1 && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_e = selectComp.rect.attribute.lineWidth[1]) && void 0 !== _e ? _e : 0) / 2)), selectComp.rect.setAttributes({
         width: selectComp.rect.attribute.width - diffSize
-      })), 0 === startCol && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_h = selectComp.rect.attribute.lineWidth[3]) && void 0 !== _h ? _h : 0) / 2)), selectComp.rect.setAttributes({
+      })), 0 === startCol && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_f = selectComp.rect.attribute.lineWidth[3]) && void 0 !== _f ? _f : 0) / 2)), selectComp.rect.setAttributes({
         x: selectComp.rect.attribute.x + diffSize,
         width: selectComp.rect.attribute.width - diffSize
-      })), endRow === table.rowCount - 1 && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_j = selectComp.rect.attribute.lineWidth[2]) && void 0 !== _j ? _j : 0) / 2)), selectComp.rect.setAttributes({
+      })), endRow === table.rowCount - 1 && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_g = selectComp.rect.attribute.lineWidth[2]) && void 0 !== _g ? _g : 0) / 2)), selectComp.rect.setAttributes({
         height: selectComp.rect.attribute.height - diffSize
-      })), 0 === startRow && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_k = selectComp.rect.attribute.lineWidth[0]) && void 0 !== _k ? _k : 0) / 2)), selectComp.rect.setAttributes({
+      })), 0 === startRow && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_h = selectComp.rect.attribute.lineWidth[0]) && void 0 !== _h ? _h : 0) / 2)), selectComp.rect.setAttributes({
         y: selectComp.rect.attribute.y + diffSize,
         height: selectComp.rect.attribute.height - diffSize
       }));
@@ -51912,7 +52046,7 @@
     }
 
     function createCellSelectBorder(scene, start_Col, start_Row, end_Col, end_Row, selectRangeType, selectId, strokes) {
-      var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
       let isHasFillHandleRect = !!(null === (_a = scene.table.options.excelOptions) || void 0 === _a ? void 0 : _a.fillHandle);
       if ((null === (_b = scene.table.stateManager.select.ranges) || void 0 === _b ? void 0 : _b.length) > 1) isHasFillHandleRect = !1, scene.removeFillHandleFromSelectComponents();else if (1 === (null === (_c = scene.table.stateManager.select.ranges) || void 0 === _c ? void 0 : _c.length)) {
         const maxRow = Math.max(scene.table.stateManager.select.ranges[0].start.row, scene.table.stateManager.select.ranges[0].end.row),
@@ -51924,30 +52058,33 @@
         startRow = Math.min(start_Row, end_Row),
         endCol = Math.max(start_Col, end_Col),
         endRow = Math.max(start_Row, end_Row),
+        overlayGroup = scene.getSelectOverlayGroup(selectRangeType),
+        offsetX = scene.tableGroup.attribute.x + (null !== (_d = overlayGroup.attribute.x) && void 0 !== _d ? _d : 0),
+        offsetY = scene.tableGroup.attribute.y + (null !== (_e = overlayGroup.attribute.y) && void 0 !== _e ? _e : 0),
         firstCellBound = scene.highPerformanceGetCell(startCol, startRow).globalAABBBounds,
         lastCellBound = scene.highPerformanceGetCell(endCol, endRow).globalAABBBounds,
         theme = scene.table.theme,
-        bodyClickBorderColor = null === (_d = theme.selectionStyle) || void 0 === _d ? void 0 : _d.cellBorderColor,
-        bodyClickLineWidth = null === (_e = theme.selectionStyle) || void 0 === _e ? void 0 : _e.cellBorderLineWidth,
+        bodyClickBorderColor = null === (_f = theme.selectionStyle) || void 0 === _f ? void 0 : _f.cellBorderColor,
+        bodyClickLineWidth = null === (_g = theme.selectionStyle) || void 0 === _g ? void 0 : _g.cellBorderLineWidth,
         rect = createRect({
           pickable: !1,
-          fill: "replace" !== (null === (_f = theme.selectionStyle) || void 0 === _f ? void 0 : _f.selectionFillMode) && (null !== (_h = null === (_g = theme.selectionStyle) || void 0 === _g ? void 0 : _g.cellBgColor) && void 0 !== _h ? _h : "rgba(0, 0, 255,0.1)"),
+          fill: "replace" !== (null === (_h = theme.selectionStyle) || void 0 === _h ? void 0 : _h.selectionFillMode) && (null !== (_k = null === (_j = theme.selectionStyle) || void 0 === _j ? void 0 : _j.cellBgColor) && void 0 !== _k ? _k : "rgba(0, 0, 255,0.1)"),
           lineWidth: bodyClickLineWidth,
           stroke: strokes.map(stroke => !!stroke && bodyClickBorderColor),
-          x: firstCellBound.x1 - scene.tableGroup.attribute.x,
-          y: firstCellBound.y1 - scene.tableGroup.attribute.y,
+          x: firstCellBound.x1 - offsetX,
+          y: firstCellBound.y1 - offsetY,
           width: 0,
           height: 0,
           visible: !0,
-          cornerRadius: getCornerRadius(selectRangeType, null === (_j = scene.table.theme.frameStyle) || void 0 === _j ? void 0 : _j.cornerRadius, start_Col, start_Row, end_Col, end_Row, scene.table)
+          cornerRadius: getCornerRadius(selectRangeType, null === (_l = scene.table.theme.frameStyle) || void 0 === _l ? void 0 : _l.cornerRadius, start_Col, start_Row, end_Col, end_Row, scene.table)
         });
       let fillhandle;
       isHasFillHandleRect && (fillhandle = createRect({
         pickable: !1,
         fill: bodyClickBorderColor,
         stroke: bodyClickBorderColor,
-        x: lastCellBound.x2 - 3,
-        y: lastCellBound.y2 - 3,
+        x: lastCellBound.x2 - offsetX - 3,
+        y: lastCellBound.y2 - offsetY - 3,
         width: 6,
         height: 6,
         visible: !0
@@ -51955,7 +52092,7 @@
         rect: rect,
         fillhandle: fillhandle,
         role: selectRangeType
-      }), scene.tableGroup.insertAfter(rect, "body" === selectRangeType ? scene.bodyGroup : "columnHeader" === selectRangeType ? scene.colHeaderGroup : "rowHeader" === selectRangeType ? scene.rowHeaderGroup : "cornerHeader" === selectRangeType ? scene.cornerHeaderGroup : "rightTopCorner" === selectRangeType ? scene.rightTopCornerGroup : "rightFrozen" === selectRangeType ? scene.rightFrozenGroup : "leftBottomCorner" === selectRangeType ? scene.leftBottomCornerGroup : "bottomFrozen" === selectRangeType ? scene.bottomFrozenGroup : scene.rightBottomCornerGroup), isHasFillHandleRect && scene.tableGroup.insertAfter(fillhandle, "body" === selectRangeType ? scene.bodyGroup : "columnHeader" === selectRangeType ? scene.colHeaderGroup : "rowHeader" === selectRangeType ? scene.rowHeaderGroup : "cornerHeader" === selectRangeType ? scene.cornerHeaderGroup : "rightTopCorner" === selectRangeType ? scene.rightTopCornerGroup : "rightFrozen" === selectRangeType ? scene.rightFrozenGroup : "leftBottomCorner" === selectRangeType ? scene.leftBottomCornerGroup : "bottomFrozen" === selectRangeType ? scene.bottomFrozenGroup : scene.rightBottomCornerGroup);
+      }), overlayGroup.addChild(rect), isHasFillHandleRect && overlayGroup.addChild(fillhandle);
     }
     function getCornerRadius(selectRangeType, cornerRadius, start_Col, start_Row, end_Col, end_Row, table) {
       if (!cornerRadius) return;
@@ -52836,7 +52973,25 @@
       const rightBottomCornerGroup = createContainerGroup(0, 0, !0);
       rightBottomCornerGroup.role = "corner-right-bottom-header", scene.rightBottomCornerGroup = rightBottomCornerGroup;
       const leftBottomCornerGroup = createContainerGroup(0, 0, !0);
-      leftBottomCornerGroup.role = "corner-left-bottom-header", scene.leftBottomCornerGroup = leftBottomCornerGroup, scene.tableGroup.addChild(bodyGroup), scene.tableGroup.addChild(rowHeaderGroup), scene.tableGroup.addChild(bottomFrozenGroup), scene.tableGroup.addChild(colHeaderGroup), scene.tableGroup.addChild(rightFrozenGroup), scene.tableGroup.addChild(rightBottomCornerGroup), scene.tableGroup.addChild(rightTopCornerGroup), scene.tableGroup.addChild(leftBottomCornerGroup), scene.tableGroup.addChild(cornerHeaderGroup), scene.tableGroup.addChild(componentGroup);
+      leftBottomCornerGroup.role = "corner-left-bottom-header", scene.leftBottomCornerGroup = leftBottomCornerGroup;
+      const bodySelectGroup = createContainerGroup(width, 0, !0);
+      bodySelectGroup.role = "body", bodySelectGroup.name = "select-overlay", scene.bodySelectGroup = bodySelectGroup;
+      const rowHeaderSelectGroup = createContainerGroup(0, 0, !0);
+      rowHeaderSelectGroup.role = "row-header", rowHeaderSelectGroup.name = "select-overlay", scene.rowHeaderSelectGroup = rowHeaderSelectGroup;
+      const bottomFrozenSelectGroup = createContainerGroup(0, 0, !0);
+      bottomFrozenSelectGroup.role = "bottom-frozen", bottomFrozenSelectGroup.name = "select-overlay", scene.bottomFrozenSelectGroup = bottomFrozenSelectGroup;
+      const colHeaderSelectGroup = createContainerGroup(0, 0, !0);
+      colHeaderSelectGroup.role = "col-header", colHeaderSelectGroup.name = "select-overlay", scene.colHeaderSelectGroup = colHeaderSelectGroup;
+      const rightFrozenSelectGroup = createContainerGroup(0, 0, !0);
+      rightFrozenSelectGroup.role = "right-frozen", rightFrozenSelectGroup.name = "select-overlay", scene.rightFrozenSelectGroup = rightFrozenSelectGroup;
+      const rightTopCornerSelectGroup = createContainerGroup(0, 0, !0);
+      rightTopCornerSelectGroup.role = "corner-right-top-header", rightTopCornerSelectGroup.name = "select-overlay", scene.rightTopCornerSelectGroup = rightTopCornerSelectGroup;
+      const rightBottomCornerSelectGroup = createContainerGroup(0, 0, !0);
+      rightBottomCornerSelectGroup.role = "corner-right-bottom-header", rightBottomCornerSelectGroup.name = "select-overlay", scene.rightBottomCornerSelectGroup = rightBottomCornerSelectGroup;
+      const leftBottomCornerSelectGroup = createContainerGroup(0, 0, !0);
+      leftBottomCornerSelectGroup.role = "corner-left-bottom-header", leftBottomCornerSelectGroup.name = "select-overlay", scene.leftBottomCornerSelectGroup = leftBottomCornerSelectGroup;
+      const cornerHeaderSelectGroup = createContainerGroup(0, 0, !0);
+      cornerHeaderSelectGroup.role = "corner-header", cornerHeaderSelectGroup.name = "select-overlay", scene.cornerHeaderSelectGroup = cornerHeaderSelectGroup, scene.tableGroup.addChild(bodyGroup), scene.tableGroup.addChild(rowHeaderGroup), scene.tableGroup.addChild(bottomFrozenGroup), scene.tableGroup.addChild(colHeaderGroup), scene.tableGroup.addChild(rightFrozenGroup), scene.tableGroup.addChild(rightBottomCornerGroup), scene.tableGroup.addChild(rightTopCornerGroup), scene.tableGroup.addChild(leftBottomCornerGroup), scene.tableGroup.addChild(cornerHeaderGroup), scene.tableGroup.addChild(bodySelectGroup), scene.tableGroup.addChild(rowHeaderSelectGroup), scene.tableGroup.addChild(bottomFrozenSelectGroup), scene.tableGroup.addChild(colHeaderSelectGroup), scene.tableGroup.addChild(rightFrozenSelectGroup), scene.tableGroup.addChild(rightBottomCornerSelectGroup), scene.tableGroup.addChild(rightTopCornerSelectGroup), scene.tableGroup.addChild(leftBottomCornerSelectGroup), scene.tableGroup.addChild(cornerHeaderSelectGroup), scene.tableGroup.addChild(componentGroup);
     }
     function createContainerGroup(width, height, clip) {
       return new Group$1({
@@ -53351,10 +53506,10 @@
         });
       }
       clearCells() {
-        var _a, _b;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
         this.table.animationManager.clear(), (this.table.isPivotChart() || this.table._hasCustomRenderOrLayout()) && this.stage.pluginService.findPluginsByName("poptipForText").forEach(plugin => {
           plugin.deactivate(this.stage.pluginService);
-        }), this.clear = !0, this.hasFrozen = !1, this.mergeMap.clear(), this.colHeaderGroup.clear(), delete this.colHeaderGroup.border, this.rowHeaderGroup.clear(), delete this.rowHeaderGroup.border, this.cornerHeaderGroup.clear(), delete this.cornerHeaderGroup.border, this.bodyGroup.clear(), delete this.bodyGroup.border, this.bottomFrozenGroup.clear(), delete this.bottomFrozenGroup.border, this.rightFrozenGroup.clear(), delete this.rightFrozenGroup.border, this.rightTopCornerGroup.clear(), delete this.rightTopCornerGroup.border, this.rightBottomCornerGroup.clear(), delete this.rightBottomCornerGroup.border, this.leftBottomCornerGroup.clear(), delete this.leftBottomCornerGroup.border, this.colHeaderGroup.setAttributes({
+        }), this.clear = !0, this.hasFrozen = !1, this.mergeMap.clear(), this.colHeaderGroup.clear(), delete this.colHeaderGroup.border, this.rowHeaderGroup.clear(), delete this.rowHeaderGroup.border, this.cornerHeaderGroup.clear(), delete this.cornerHeaderGroup.border, this.bodyGroup.clear(), delete this.bodyGroup.border, this.bottomFrozenGroup.clear(), delete this.bottomFrozenGroup.border, this.rightFrozenGroup.clear(), delete this.rightFrozenGroup.border, this.rightTopCornerGroup.clear(), delete this.rightTopCornerGroup.border, this.rightBottomCornerGroup.clear(), delete this.rightBottomCornerGroup.border, this.leftBottomCornerGroup.clear(), delete this.leftBottomCornerGroup.border, null === (_a = this.bodySelectGroup) || void 0 === _a || _a.clear(), null === (_b = this.rowHeaderSelectGroup) || void 0 === _b || _b.clear(), null === (_c = this.bottomFrozenSelectGroup) || void 0 === _c || _c.clear(), null === (_d = this.colHeaderSelectGroup) || void 0 === _d || _d.clear(), null === (_e = this.rightFrozenSelectGroup) || void 0 === _e || _e.clear(), null === (_f = this.rightTopCornerSelectGroup) || void 0 === _f || _f.clear(), null === (_g = this.leftBottomCornerSelectGroup) || void 0 === _g || _g.clear(), null === (_h = this.rightBottomCornerSelectGroup) || void 0 === _h || _h.clear(), null === (_j = this.cornerHeaderSelectGroup) || void 0 === _j || _j.clear(), this.colHeaderGroup.setAttributes({
           x: 0,
           y: 0,
           width: 0,
@@ -53402,12 +53557,62 @@
           width: 0,
           height: 0,
           visible: !1
+        }), null === (_k = this.bodySelectGroup) || void 0 === _k || _k.setAttributes({
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0
+        }), null === (_l = this.rowHeaderSelectGroup) || void 0 === _l || _l.setAttributes({
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0
+        }), null === (_m = this.bottomFrozenSelectGroup) || void 0 === _m || _m.setAttributes({
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0,
+          visible: !1
+        }), null === (_o = this.colHeaderSelectGroup) || void 0 === _o || _o.setAttributes({
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0
+        }), null === (_p = this.rightFrozenSelectGroup) || void 0 === _p || _p.setAttributes({
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0,
+          visible: !1
+        }), null === (_q = this.rightTopCornerSelectGroup) || void 0 === _q || _q.setAttributes({
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0,
+          visible: !1
+        }), null === (_r = this.leftBottomCornerSelectGroup) || void 0 === _r || _r.setAttributes({
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0,
+          visible: !1
+        }), null === (_s = this.rightBottomCornerSelectGroup) || void 0 === _s || _s.setAttributes({
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0,
+          visible: !1
+        }), null === (_t = this.cornerHeaderSelectGroup) || void 0 === _t || _t.setAttributes({
+          x: 0,
+          y: 0,
+          width: 0,
+          height: 0
         }), this.tableGroup.setAttributes({
           x: this.table.tableX,
           y: this.table.tableY,
           width: 0,
           height: 0
-        }), this.tableGroup.border && (this.tableGroup.parent.removeChild(this.tableGroup.border), delete this.tableGroup.border), null === (_a = this.proxy) || void 0 === _a || _a.release(), null === (_b = this.table.reactCustomLayout) || void 0 === _b || _b.clearCache();
+        }), this.tableGroup.border && (this.tableGroup.parent.removeChild(this.tableGroup.border), delete this.tableGroup.border), null === (_u = this.proxy) || void 0 === _u || _u.release(), null === (_v = this.table.reactCustomLayout) || void 0 === _v || _v.clearCache();
       }
       updateStageBackground() {
         this.stage.background = this.table.theme.underlayBackgroundColor, this.stage.renderNextFrame();
@@ -53763,16 +53968,16 @@
         var _a, _b, _c, _d, _e, _f;
         const firstBodyCell = null !== (_b = null === (_a = this.bodyGroup.firstChild) || void 0 === _a ? void 0 : _a.firstChild) && void 0 !== _b ? _b : null === (_c = this.rowHeaderGroup.firstChild) || void 0 === _c ? void 0 : _c.firstChild,
           lastBodyCell = null !== (_e = null === (_d = this.bodyGroup.firstChild) || void 0 === _d ? void 0 : _d.lastChild) && void 0 !== _e ? _e : null === (_f = this.rowHeaderGroup.firstChild) || void 0 === _f ? void 0 : _f.lastChild;
-        0 === y && firstBodyCell && firstBodyCell.row === this.table.frozenRowCount && firstBodyCell.attribute.y + y < 0 ? y = -firstBodyCell.attribute.y : lastBodyCell && this.table.tableNoFrameHeight < this.table.getAllRowsHeight() && lastBodyCell.row === this.table.rowCount - this.table.bottomFrozenRowCount - 1 && lastBodyCell.attribute.y + this.table.getRowHeight(lastBodyCell.row) + y < this.table.tableNoFrameHeight - this.table.getFrozenRowsHeight() - this.table.getBottomFrozenRowsHeight() && (y = this.table.tableNoFrameHeight - this.table.getFrozenRowsHeight() - this.table.getBottomFrozenRowsHeight() - lastBodyCell.attribute.y - this.table.getRowHeight(lastBodyCell.row)), this.colHeaderGroup.attribute.height + y !== this.bodyGroup.attribute.y && (this.bodyGroup.setAttribute("y", this.colHeaderGroup.attribute.height + y), this.rowHeaderGroup.setAttribute("y", this.cornerHeaderGroup.attribute.height + y), this.table.rightFrozenColCount > 0 && this.rightFrozenGroup.setAttribute("y", this.rightTopCornerGroup.attribute.height + y), this.updateNextFrame());
+        0 === y && firstBodyCell && firstBodyCell.row === this.table.frozenRowCount && firstBodyCell.attribute.y + y < 0 ? y = -firstBodyCell.attribute.y : lastBodyCell && this.table.tableNoFrameHeight < this.table.getAllRowsHeight() && lastBodyCell.row === this.table.rowCount - this.table.bottomFrozenRowCount - 1 && lastBodyCell.attribute.y + this.table.getRowHeight(lastBodyCell.row) + y < this.table.tableNoFrameHeight - this.table.getFrozenRowsHeight() - this.table.getBottomFrozenRowsHeight() && (y = this.table.tableNoFrameHeight - this.table.getFrozenRowsHeight() - this.table.getBottomFrozenRowsHeight() - lastBodyCell.attribute.y - this.table.getRowHeight(lastBodyCell.row)), this.colHeaderGroup.attribute.height + y !== this.bodyGroup.attribute.y && (this.bodyGroup.setAttribute("y", this.colHeaderGroup.attribute.height + y), this.rowHeaderGroup.setAttribute("y", this.cornerHeaderGroup.attribute.height + y), this.bodySelectGroup.setAttribute("y", this.bodyGroup.attribute.y), this.rowHeaderSelectGroup.setAttribute("y", this.rowHeaderGroup.attribute.y), this.colHeaderSelectGroup.setAttribute("y", this.colHeaderGroup.attribute.y), this.cornerHeaderSelectGroup.setAttribute("y", this.cornerHeaderGroup.attribute.y), this.table.rightFrozenColCount > 0 && (this.rightFrozenGroup.setAttribute("y", this.rightTopCornerGroup.attribute.height + y), this.rightFrozenSelectGroup.setAttribute("y", this.rightFrozenGroup.attribute.y), this.rightTopCornerSelectGroup.setAttribute("y", this.rightTopCornerGroup.attribute.y)), this.table.bottomFrozenRowCount > 0 && (this.bottomFrozenSelectGroup.setAttribute("y", this.bottomFrozenGroup.attribute.y), this.leftBottomCornerSelectGroup.setAttribute("y", this.leftBottomCornerGroup.attribute.y)), this.table.rightFrozenColCount > 0 && this.table.bottomFrozenRowCount > 0 && this.rightBottomCornerSelectGroup.setAttribute("y", this.rightBottomCornerGroup.attribute.y), this.updateNextFrame());
       }
       setBodyAndColHeaderX(x) {
         const firstBodyCol = this.bodyGroup.firstChild,
           lastBodyCol = this.bodyGroup.lastChild;
-        0 === x && firstBodyCol && firstBodyCol.col === this.table.frozenColCount && firstBodyCol.attribute.x + x < 0 ? x = -firstBodyCol.attribute.x : lastBodyCol && this.table.tableNoFrameWidth < this.table.getAllColsWidth() && lastBodyCol.col === this.table.colCount - this.table.rightFrozenColCount - 1 && lastBodyCol.attribute.x + lastBodyCol.attribute.width + x < this.table.tableNoFrameWidth - this.table.getFrozenColsWidth() - this.table.getRightFrozenColsWidth() && (x = this.table.tableNoFrameWidth - this.table.getFrozenColsWidth() - this.table.getRightFrozenColsWidth() - lastBodyCol.attribute.x - lastBodyCol.attribute.width), this.table.getFrozenColsWidth() + x !== this.bodyGroup.attribute.x && (this.bodyGroup.setAttribute("x", this.table.getFrozenColsWidth() + x), this.colHeaderGroup.setAttribute("x", this.table.getFrozenColsWidth() + x), this.table.bottomFrozenRowCount > 0 && this.bottomFrozenGroup.setAttribute("x", this.table.getFrozenColsWidth() + x), this.updateNextFrame());
+        0 === x && firstBodyCol && firstBodyCol.col === this.table.frozenColCount && firstBodyCol.attribute.x + x < 0 ? x = -firstBodyCol.attribute.x : lastBodyCol && this.table.tableNoFrameWidth < this.table.getAllColsWidth() && lastBodyCol.col === this.table.colCount - this.table.rightFrozenColCount - 1 && lastBodyCol.attribute.x + lastBodyCol.attribute.width + x < this.table.tableNoFrameWidth - this.table.getFrozenColsWidth() - this.table.getRightFrozenColsWidth() && (x = this.table.tableNoFrameWidth - this.table.getFrozenColsWidth() - this.table.getRightFrozenColsWidth() - lastBodyCol.attribute.x - lastBodyCol.attribute.width), this.table.getFrozenColsWidth() + x !== this.bodyGroup.attribute.x && (this.bodyGroup.setAttribute("x", this.table.getFrozenColsWidth() + x), this.colHeaderGroup.setAttribute("x", this.table.getFrozenColsWidth() + x), this.bodySelectGroup.setAttribute("x", this.bodyGroup.attribute.x), this.colHeaderSelectGroup.setAttribute("x", this.colHeaderGroup.attribute.x), this.rowHeaderSelectGroup.setAttribute("x", this.rowHeaderGroup.attribute.x), this.cornerHeaderSelectGroup.setAttribute("x", this.cornerHeaderGroup.attribute.x), this.table.bottomFrozenRowCount > 0 && (this.bottomFrozenGroup.setAttribute("x", this.table.getFrozenColsWidth() + x), this.bottomFrozenSelectGroup.setAttribute("x", this.bottomFrozenGroup.attribute.x), this.leftBottomCornerSelectGroup.setAttribute("x", this.leftBottomCornerGroup.attribute.x)), this.table.rightFrozenColCount > 0 && (this.rightFrozenSelectGroup.setAttribute("x", this.rightFrozenGroup.attribute.x), this.rightTopCornerSelectGroup.setAttribute("x", this.rightTopCornerGroup.attribute.x)), this.table.rightFrozenColCount > 0 && this.table.bottomFrozenRowCount > 0 && this.rightBottomCornerSelectGroup.setAttribute("x", this.rightBottomCornerGroup.attribute.x), this.updateNextFrame());
       }
       afterScenegraphCreated() {
-        var _a;
-        this.isPivot || this.table.transpose ? this.table.options.frozenColCount ? this.component.setFrozenColumnShadow(this.table.frozenColCount - 1) : this.table.options.rightFrozenColCount ? this.component.setRightFrozenColumnShadow(this.table.colCount - this.table.rightFrozenColCount) : this.component.setFrozenColumnShadow(-1) : (this.component.setFrozenColumnShadow(this.table.frozenColCount - 1), this.component.setRightFrozenColumnShadow(this.table.colCount - this.table.rightFrozenColCount)), this.table.stateManager.checkFrozen(), this.updateContainer(), this.createFrameBorder(), this.updateBorderSizeAndPosition(), this.component.updateScrollBar(), handleTextStick(this.table), this.table.options.animationAppear && dealWithAnimationAppear(this.table), !1 === (null === (_a = this.table.options.menu) || void 0 === _a ? void 0 : _a.contextMenuWorkOnlyCell) && this.canvasShowMenu(), this.updateNextFrame();
+        var _a, _b;
+        this.isPivot || this.table.transpose ? this.table.options.frozenColCount ? this.component.setFrozenColumnShadow(this.table.frozenColCount - 1) : this.table.options.rightFrozenColCount ? this.component.setRightFrozenColumnShadow(this.table.colCount - this.table.rightFrozenColCount) : this.component.setFrozenColumnShadow(-1) : (this.component.setFrozenColumnShadow(this.table.frozenColCount - 1), this.component.setRightFrozenColumnShadow(this.table.colCount - this.table.rightFrozenColCount)), this.table.stateManager.checkFrozen(), this.updateContainer(), this.createFrameBorder(), this.updateBorderSizeAndPosition(), this.component.updateScrollBar(), handleTextStick(this.table), this.table.options.animationAppear && dealWithAnimationAppear(this.table), !1 === (null === (_a = this.table.options.menu) || void 0 === _a ? void 0 : _a.contextMenuWorkOnlyCell) && this.canvasShowMenu(), (null === (_b = this.table.stateManager.select.ranges) || void 0 === _b ? void 0 : _b.length) && this.recreateAllSelectRangeComponents(), this.updateNextFrame();
       }
       dealWidthMode() {
         const table = this.table;
@@ -53894,13 +54099,23 @@
         moveHeaderPosition(updateColStart, updateColEnd, updateRowStart, updateRowEnd, moveType, this.table);
       }
       updateContainerAttrWidthAndX() {
-        var _a, _b, _c;
-        const cornerX = updateContainerChildrenX(this.cornerHeaderGroup, 0),
-          rowHeaderX = updateContainerChildrenX(this.rowHeaderGroup, 0),
-          colHeaderX = this.colHeaderGroup.hasChildNodes() && this.colHeaderGroup.firstChild ? updateContainerChildrenX(this.colHeaderGroup, this.colHeaderGroup.firstChild.col > 0 ? this.table.getColsWidth(null !== (_a = this.table.frozenColCount) && void 0 !== _a ? _a : 0, this.colHeaderGroup.firstChild.col - 1) : 0) : 0,
-          bodyX = this.bodyGroup.hasChildNodes() && this.bodyGroup.firstChild ? updateContainerChildrenX(this.bodyGroup, this.bodyGroup.firstChild.col > 0 ? this.table.getColsWidth(null !== (_b = this.table.frozenColCount) && void 0 !== _b ? _b : 0, this.bodyGroup.firstChild.col - 1) : 0) : 0,
-          rightX = updateContainerChildrenX(this.rightFrozenGroup.childrenCount > 0 ? this.rightFrozenGroup : this.rightTopCornerGroup, 0);
-        this.bottomFrozenGroup.hasChildNodes() && this.bottomFrozenGroup.firstChild && updateContainerChildrenX(this.bottomFrozenGroup, this.bottomFrozenGroup.firstChild.col > 0 ? this.table.getColsWidth(null !== (_c = this.table.frozenColCount) && void 0 !== _c ? _c : 0, this.bottomFrozenGroup.firstChild.col - 1) : 0), updateContainerChildrenX(this.leftBottomCornerGroup, 0), updateContainerChildrenX(this.rightTopCornerGroup, 0), updateContainerChildrenX(this.rightBottomCornerGroup, 0), this.cornerHeaderGroup.setDeltaWidth(cornerX - this.cornerHeaderGroup.attribute.width), this.leftBottomCornerGroup.setDeltaWidth(cornerX - this.leftBottomCornerGroup.attribute.width), this.colHeaderGroup.setDeltaWidth(colHeaderX - this.colHeaderGroup.attribute.width), this.rowHeaderGroup.setDeltaWidth(rowHeaderX - this.rowHeaderGroup.attribute.width), this.bottomFrozenGroup.setDeltaWidth(colHeaderX - this.bottomFrozenGroup.attribute.width), this.rightFrozenGroup.setDeltaWidth(rightX - this.rightFrozenGroup.attribute.width), this.rightTopCornerGroup.setDeltaWidth(rightX - this.rightTopCornerGroup.attribute.width), this.rightBottomCornerGroup.setDeltaWidth(rightX - this.rightBottomCornerGroup.attribute.width), this.bodyGroup.setDeltaWidth(bodyX - this.bodyGroup.attribute.width), this.colHeaderGroup.setAttribute("x", this.cornerHeaderGroup.attribute.width), this.bottomFrozenGroup.setAttribute("x", this.table.getFrozenColsWidth()), this.bodyGroup.setAttribute("x", this.rowHeaderGroup.attribute.width);
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        const frozenStartX = -(null !== (_c = null === (_b = (_a = this.table).getFrozenColsScrollLeft) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0),
+          frozenViewportWidth = this.table.getFrozenColsWidth(),
+          rightFrozenStartX = -this.table.getRightFrozenColsOffset() + (null !== (_f = null === (_e = (_d = this.table).getRightFrozenColsScrollLeft) || void 0 === _e ? void 0 : _e.call(_d)) && void 0 !== _f ? _f : 0),
+          rightFrozenContentWidth = this.table.getRightFrozenColsContentWidth();
+        updateContainerChildrenX(this.cornerHeaderGroup, frozenStartX), updateContainerChildrenX(this.rowHeaderGroup, frozenStartX);
+        const colHeaderX = this.colHeaderGroup.hasChildNodes() && this.colHeaderGroup.firstChild ? updateContainerChildrenX(this.colHeaderGroup, this.colHeaderGroup.firstChild.col > 0 ? this.table.getColsWidth(null !== (_g = this.table.frozenColCount) && void 0 !== _g ? _g : 0, this.colHeaderGroup.firstChild.col - 1) : 0) : 0,
+          bodyX = this.bodyGroup.hasChildNodes() && this.bodyGroup.firstChild ? updateContainerChildrenX(this.bodyGroup, this.bodyGroup.firstChild.col > 0 ? this.table.getColsWidth(null !== (_h = this.table.frozenColCount) && void 0 !== _h ? _h : 0, this.bodyGroup.firstChild.col - 1) : 0) : 0;
+        this.rightFrozenGroup.childrenCount > 0 && updateContainerChildrenX(this.rightFrozenGroup, rightFrozenStartX), this.bottomFrozenGroup.hasChildNodes() && this.bottomFrozenGroup.firstChild && updateContainerChildrenX(this.bottomFrozenGroup, this.bottomFrozenGroup.firstChild.col > 0 ? this.table.getColsWidth(null !== (_j = this.table.frozenColCount) && void 0 !== _j ? _j : 0, this.bottomFrozenGroup.firstChild.col - 1) : 0), updateContainerChildrenX(this.leftBottomCornerGroup, frozenStartX), updateContainerChildrenX(this.rightTopCornerGroup, rightFrozenStartX), updateContainerChildrenX(this.rightBottomCornerGroup, rightFrozenStartX), this.cornerHeaderGroup.setDeltaWidth(frozenViewportWidth - this.cornerHeaderGroup.attribute.width), this.leftBottomCornerGroup.setDeltaWidth(frozenViewportWidth - this.leftBottomCornerGroup.attribute.width), this.colHeaderGroup.setDeltaWidth(colHeaderX - this.colHeaderGroup.attribute.width), this.rowHeaderGroup.setDeltaWidth(frozenViewportWidth - this.rowHeaderGroup.attribute.width), this.bottomFrozenGroup.setDeltaWidth(colHeaderX - this.bottomFrozenGroup.attribute.width), this.rightFrozenGroup.setDeltaWidth(rightFrozenContentWidth - this.rightFrozenGroup.attribute.width), this.rightTopCornerGroup.setDeltaWidth(rightFrozenContentWidth - this.rightTopCornerGroup.attribute.width), this.rightBottomCornerGroup.setDeltaWidth(rightFrozenContentWidth - this.rightBottomCornerGroup.attribute.width), this.bodyGroup.setDeltaWidth(bodyX - this.bodyGroup.attribute.width), this.colHeaderGroup.setAttribute("x", this.cornerHeaderGroup.attribute.width), this.bottomFrozenGroup.setAttribute("x", this.table.getFrozenColsWidth()), this.bodyGroup.setAttribute("x", this.rowHeaderGroup.attribute.width);
+      }
+      setFrozenColsScrollLeft(left) {
+        const frozenStartX = -left;
+        updateContainerChildrenX(this.cornerHeaderGroup, frozenStartX), updateContainerChildrenX(this.rowHeaderGroup, frozenStartX), updateContainerChildrenX(this.leftBottomCornerGroup, frozenStartX), this.updateNextFrame();
+      }
+      setRightFrozenColsScrollLeft(left) {
+        const rightStartX = -this.table.getRightFrozenColsOffset() + left;
+        updateContainerChildrenX(this.rightFrozenGroup, rightStartX), updateContainerChildrenX(this.rightTopCornerGroup, rightStartX), updateContainerChildrenX(this.rightBottomCornerGroup, rightStartX), this.updateNextFrame();
       }
       updateContainerAttrHeightAndY() {
         var _a, _b, _c;
@@ -53925,7 +54140,82 @@
         }, 0)) : (this._needUpdateContainer = !0, this.updateContainerSync(null !== (_a = updateConfig.needUpdateCellY) && void 0 !== _a && _a));
       }
       updateContainerSync(needUpdateCellY = !1) {
-        this._needUpdateContainer && (this._needUpdateContainer = !1, this.updateContainerAttrWidthAndX(), needUpdateCellY && this.updateContainerAttrHeightAndY(), this.updateTableSize(), this.component.updateScrollBar(), this.updateNextFrame());
+        this._needUpdateContainer && (this._needUpdateContainer = !1, this.updateContainerAttrWidthAndX(), needUpdateCellY && this.updateContainerAttrHeightAndY(), this.updateTableSize(), this.syncSelectOverlayGroups(), this.component.updateScrollBar(), this.updateNextFrame());
+      }
+      syncSelectOverlayGroups() {
+        this.bodySelectGroup.setAttributes({
+          x: this.bodyGroup.attribute.x,
+          y: this.bodyGroup.attribute.y,
+          width: this.bodyGroup.attribute.width,
+          height: this.bodyGroup.attribute.height
+        }), this.rowHeaderSelectGroup.setAttributes({
+          x: this.rowHeaderGroup.attribute.x,
+          y: this.rowHeaderGroup.attribute.y,
+          width: this.rowHeaderGroup.attribute.width,
+          height: this.rowHeaderGroup.attribute.height
+        }), this.colHeaderSelectGroup.setAttributes({
+          x: this.colHeaderGroup.attribute.x,
+          y: this.colHeaderGroup.attribute.y,
+          width: this.colHeaderGroup.attribute.width,
+          height: this.colHeaderGroup.attribute.height
+        }), this.cornerHeaderSelectGroup.setAttributes({
+          x: this.cornerHeaderGroup.attribute.x,
+          y: this.cornerHeaderGroup.attribute.y,
+          width: this.cornerHeaderGroup.attribute.width,
+          height: this.cornerHeaderGroup.attribute.height
+        }), this.rightFrozenSelectGroup.setAttributes({
+          x: this.rightFrozenGroup.attribute.x,
+          y: this.rightFrozenGroup.attribute.y,
+          width: this.rightFrozenGroup.attribute.width,
+          height: this.rightFrozenGroup.attribute.height,
+          visible: this.rightFrozenGroup.attribute.visible
+        }), this.bottomFrozenSelectGroup.setAttributes({
+          x: this.bottomFrozenGroup.attribute.x,
+          y: this.bottomFrozenGroup.attribute.y,
+          width: this.bottomFrozenGroup.attribute.width,
+          height: this.bottomFrozenGroup.attribute.height,
+          visible: this.bottomFrozenGroup.attribute.visible
+        }), this.rightTopCornerSelectGroup.setAttributes({
+          x: this.rightTopCornerGroup.attribute.x,
+          y: this.rightTopCornerGroup.attribute.y,
+          width: this.rightTopCornerGroup.attribute.width,
+          height: this.rightTopCornerGroup.attribute.height,
+          visible: this.rightTopCornerGroup.attribute.visible
+        }), this.leftBottomCornerSelectGroup.setAttributes({
+          x: this.leftBottomCornerGroup.attribute.x,
+          y: this.leftBottomCornerGroup.attribute.y,
+          width: this.leftBottomCornerGroup.attribute.width,
+          height: this.leftBottomCornerGroup.attribute.height,
+          visible: this.leftBottomCornerGroup.attribute.visible
+        }), this.rightBottomCornerSelectGroup.setAttributes({
+          x: this.rightBottomCornerGroup.attribute.x,
+          y: this.rightBottomCornerGroup.attribute.y,
+          width: this.rightBottomCornerGroup.attribute.width,
+          height: this.rightBottomCornerGroup.attribute.height,
+          visible: this.rightBottomCornerGroup.attribute.visible
+        });
+      }
+      getSelectOverlayGroup(selectRangeType) {
+        switch (selectRangeType) {
+          case "body":
+            return this.bodySelectGroup;
+          case "rowHeader":
+            return this.rowHeaderSelectGroup;
+          case "bottomFrozen":
+            return this.bottomFrozenSelectGroup;
+          case "columnHeader":
+            return this.colHeaderSelectGroup;
+          case "rightFrozen":
+            return this.rightFrozenSelectGroup;
+          case "rightTopCorner":
+            return this.rightTopCornerSelectGroup;
+          case "leftBottomCorner":
+            return this.leftBottomCornerSelectGroup;
+          case "rightBottomCorner":
+            return this.rightBottomCornerSelectGroup;
+          default:
+            return this.cornerHeaderSelectGroup;
+        }
       }
       updateCellContentWhileResize(col, row) {
         var _a;
@@ -55404,29 +55694,32 @@
       }
     }
     function createCustomCellSelectBorder(scene, start_Col, start_Row, end_Col, end_Row, selectRangeType, selectId, strokes, style) {
-      var _a, _b, _c, _d;
+      var _a, _b, _c, _d, _e, _f;
       const startCol = Math.min(start_Col, end_Col),
         startRow = Math.min(start_Row, end_Row),
         endCol = Math.max(start_Col, end_Col),
         endRow = Math.max(start_Row, end_Row),
+        overlayGroup = scene.getSelectOverlayGroup(selectRangeType),
+        offsetX = scene.tableGroup.attribute.x + (null !== (_a = overlayGroup.attribute.x) && void 0 !== _a ? _a : 0),
+        offsetY = scene.tableGroup.attribute.y + (null !== (_b = overlayGroup.attribute.y) && void 0 !== _b ? _b : 0),
         firstCellBound = scene.highPerformanceGetCell(startCol, startRow).globalAABBBounds,
         rect = createRect({
           pickable: !1,
-          fill: null !== (_a = style.cellBgColor) && void 0 !== _a && _a,
-          lineWidth: null !== (_b = style.cellBorderLineWidth) && void 0 !== _b ? _b : 0,
-          lineDash: null !== (_c = style.cellBorderLineDash) && void 0 !== _c ? _c : [],
+          fill: null !== (_c = style.cellBgColor) && void 0 !== _c && _c,
+          lineWidth: null !== (_d = style.cellBorderLineWidth) && void 0 !== _d ? _d : 0,
+          lineDash: null !== (_e = style.cellBorderLineDash) && void 0 !== _e ? _e : [],
           stroke: strokes.map(stroke => !!stroke && style.cellBorderColor),
-          x: firstCellBound.x1 - scene.tableGroup.attribute.x,
-          y: firstCellBound.y1 - scene.tableGroup.attribute.y,
+          x: firstCellBound.x1 - offsetX,
+          y: firstCellBound.y1 - offsetY,
           width: 0,
           height: 0,
           visible: !0,
-          cornerRadius: getCornerRadius(selectRangeType, null === (_d = scene.table.theme.frameStyle) || void 0 === _d ? void 0 : _d.cornerRadius, start_Col, start_Row, end_Col, end_Row, scene.table)
+          cornerRadius: getCornerRadius(selectRangeType, null === (_f = scene.table.theme.frameStyle) || void 0 === _f ? void 0 : _f.cornerRadius, start_Col, start_Row, end_Col, end_Row, scene.table)
         });
       scene.customSelectedRangeComponents.set(`${startCol}-${startRow}-${endCol}-${endRow}-${selectId}`, {
         rect: rect,
         role: selectRangeType
-      }), scene.tableGroup.insertAfter(rect, "body" === selectRangeType ? scene.bodyGroup : "columnHeader" === selectRangeType ? scene.colHeaderGroup : "rowHeader" === selectRangeType ? scene.rowHeaderGroup : "cornerHeader" === selectRangeType ? scene.cornerHeaderGroup : "rightTopCorner" === selectRangeType ? scene.rightTopCornerGroup : "rightFrozen" === selectRangeType ? scene.rightFrozenGroup : "leftBottomCorner" === selectRangeType ? scene.leftBottomCornerGroup : "bottomFrozen" === selectRangeType ? scene.bottomFrozenGroup : scene.rightBottomCornerGroup);
+      }), overlayGroup.addChild(rect);
     }
 
     function deletaCustomSelectRanges(state) {
@@ -55447,7 +55740,7 @@
       constructor(table) {
         this.fastScrolling = !1, this.checkedState = new Map(), this.headerCheckedState = {}, this._checkboxCellTypeFields = [], this._headerCheckFuncs = {}, this.radioState = {}, this.resetInteractionState = debounce$1(state => {
           this.updateInteractionState(null != state ? state : InteractionState.default);
-        }, 100), this.table = table, this.initState(), this.updateVerticalScrollBar = this.updateVerticalScrollBar.bind(this), this.updateHorizontalScrollBar = this.updateHorizontalScrollBar.bind(this);
+        }, 100), this.table = table, this.initState(), this.updateVerticalScrollBar = this.updateVerticalScrollBar.bind(this), this.updateHorizontalScrollBar = this.updateHorizontalScrollBar.bind(this), this.updateFrozenHorizontalScrollBar = this.updateFrozenHorizontalScrollBar.bind(this), this.updateRightFrozenHorizontalScrollBar = this.updateRightFrozenHorizontalScrollBar.bind(this);
       }
       initState() {
         this._initState(), this.setHoverState(), this.setSelectState(), this.setFrozenState();
@@ -55564,7 +55857,9 @@
           row: -1
         }, this.scroll = {
           horizontalBarPos: 0,
-          verticalBarPos: 0
+          verticalBarPos: 0,
+          frozenHorizontalBarPos: 0,
+          rightFrozenHorizontalBarPos: 0
         }, this.tablePosition = {
           absoluteX: 0,
           absoluteY: 0
@@ -55796,13 +56091,42 @@
             }), void this._frozenObserver.observe(container);
           }
           if (this.table.getColsWidth(0, originalFrozenColCount - 1) > this.table._getMaxFrozenWidth()) {
-            if (this.table.internalProps.unfreezeAllOnExceedsMaxWidth) this.table._setFrozenColCount(0), this.setFrozenCol(-1);else {
+            if (this.table.options.scrollFrozenCols) this.table.frozenColCount !== originalFrozenColCount && (this.table._setFrozenColCount(originalFrozenColCount), this.setFrozenCol(originalFrozenColCount));else if (this.table.internalProps.unfreezeAllOnExceedsMaxWidth) this.table._setFrozenColCount(0), this.setFrozenCol(-1);else {
               const computedFrozenColCount = this.table._getComputedFrozenColCount(originalFrozenColCount);
               this.table._setFrozenColCount(computedFrozenColCount), this.setFrozenCol(computedFrozenColCount);
             }
           } else this.table.frozenColCount !== originalFrozenColCount && (this.table._setFrozenColCount(originalFrozenColCount), this.setFrozenCol(originalFrozenColCount));
+          this.table.options.scrollFrozenCols && 0 !== this.table.getFrozenColsOffset() ? this.setFrozenColsScrollLeft(this.scroll.frozenHorizontalBarPos, !1) : this.setFrozenColsScrollLeft(0, !1), this.table.options.scrollRightFrozenCols && 0 !== this.table.getRightFrozenColsOffset() ? this.setRightFrozenColsScrollLeft(this.scroll.rightFrozenHorizontalBarPos, !1) : this.setRightFrozenColsScrollLeft(0, !1);
         } else this.clearFrozenObserver();
       }
+      setFrozenColsScrollLeft(left, triggerRender = !0) {
+        if (!this.table || !this.table.scenegraph) return;
+        const maxScrollLeft = this.table.getFrozenColsOffset();
+        if (left = Math.max(0, Math.min(left, maxScrollLeft)), left = Math.ceil(left), this.scroll.frozenHorizontalBarPos === left) return;
+        this.scroll.frozenHorizontalBarPos = left;
+        const ratio = maxScrollLeft ? left / maxScrollLeft : 0;
+        this.table.scenegraph.component.updateFrozenHorizontalScrollBarPos(ratio), triggerRender && this.table.scenegraph.setFrozenColsScrollLeft(left);
+      }
+      setRightFrozenColsScrollLeft(left, triggerRender = !0) {
+        if (!this.table || !this.table.scenegraph) return;
+        const maxScrollLeft = this.table.getRightFrozenColsOffset();
+        if (left = Math.max(0, Math.min(left, maxScrollLeft)), left = Math.ceil(left), this.scroll.rightFrozenHorizontalBarPos === left) return;
+        this.scroll.rightFrozenHorizontalBarPos = left;
+        const ratio = maxScrollLeft ? 1 - left / maxScrollLeft : 1;
+        this.table.scenegraph.component.updateRightFrozenHorizontalScrollBarPos(ratio), triggerRender && this.table.scenegraph.setRightFrozenColsScrollLeft(left);
+      }
+      updateFrozenHorizontalScrollBar(xRatio) {
+        var _a, _b, _c;
+        const maxScrollLeft = null !== (_c = null === (_b = (_a = this.table).getFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0;
+        let left = Math.ceil(xRatio * maxScrollLeft);
+        isValid$1(left) && !isNaN(left) || (left = 0), this.setFrozenColsScrollLeft(left, !0);
+      }
+      updateRightFrozenHorizontalScrollBar(xRatio) {
+        var _a, _b, _c;
+        const maxScrollLeft = null !== (_c = null === (_b = (_a = this.table).getRightFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0;
+        let left = Math.ceil((1 - xRatio) * maxScrollLeft);
+        isValid$1(left) && !isNaN(left) || (left = 0), this.setRightFrozenColsScrollLeft(left, !0);
+      }
       clearFrozenObserver() {
         this._frozenObserver && (this._frozenObserver.disconnect(), this._frozenObserver = null);
       }
@@ -55875,32 +56199,35 @@
         }), oldVerticalBarPos !== this.scroll.verticalBarPos && this.checkVerticalScrollBarEnd();
       }
       updateHorizontalScrollBar(xRatio) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
         const totalWidth = this.table.getAllColsWidth(),
-          oldHorizontalBarPos = this.scroll.horizontalBarPos;
-        let horizontalBarPos = Math.ceil(xRatio * (totalWidth - this.table.scenegraph.width));
+          oldHorizontalBarPos = this.scroll.horizontalBarPos,
+          frozenOffset = null !== (_c = null === (_b = (_a = this.table).getFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0,
+          rightFrozenOffset = null !== (_f = null === (_e = (_d = this.table).getRightFrozenColsOffset) || void 0 === _e ? void 0 : _e.call(_d)) && void 0 !== _f ? _f : 0,
+          scrollRange = Math.max(0, totalWidth - this.table.scenegraph.width - frozenOffset - rightFrozenOffset);
+        let horizontalBarPos = Math.ceil(xRatio * scrollRange);
         isValid$1(horizontalBarPos) && !isNaN(horizontalBarPos) || (horizontalBarPos = 0);
         const dx = horizontalBarPos - this.table.scenegraph.proxy.deltaX - oldHorizontalBarPos;
         if (this.table.fireListeners(TABLE_EVENT_TYPE.CAN_SCROLL, {
           event: void 0,
           scrollTop: this.scroll.verticalBarPos,
           scrollLeft: horizontalBarPos - this.table.scenegraph.proxy.deltaX,
-          scrollHeight: null === (_a = this.table.theme.scrollStyle) || void 0 === _a ? void 0 : _a.width,
-          scrollWidth: null === (_b = this.table.theme.scrollStyle) || void 0 === _b ? void 0 : _b.width,
+          scrollHeight: null === (_g = this.table.theme.scrollStyle) || void 0 === _g ? void 0 : _g.width,
+          scrollWidth: null === (_h = this.table.theme.scrollStyle) || void 0 === _h ? void 0 : _h.width,
           viewHeight: this.table.tableNoFrameHeight,
           viewWidth: this.table.tableNoFrameWidth,
           scrollDirection: "horizontal",
           scrollRatioX: xRatio,
           dx: dx
         }).some(value => !1 === value)) {
-          const xRatio = this.scroll.horizontalBarPos / (totalWidth - this.table.scenegraph.width);
+          const xRatio = scrollRange ? this.scroll.horizontalBarPos / scrollRange : 0;
           this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio);
         } else this.scroll.horizontalBarPos = horizontalBarPos, this.table.scenegraph.setX(-this.scroll.horizontalBarPos, 1 === xRatio), this.scroll.horizontalBarPos -= this.table.scenegraph.proxy.deltaX, this.table.scenegraph.proxy.deltaX = 0, this.updateHoverPos(-1, -1), this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
           event: void 0,
           scrollTop: this.scroll.verticalBarPos,
           scrollLeft: this.scroll.horizontalBarPos,
-          scrollHeight: null === (_c = this.table.theme.scrollStyle) || void 0 === _c ? void 0 : _c.width,
-          scrollWidth: null === (_d = this.table.theme.scrollStyle) || void 0 === _d ? void 0 : _d.width,
+          scrollHeight: null === (_j = this.table.theme.scrollStyle) || void 0 === _j ? void 0 : _j.width,
+          scrollWidth: null === (_k = this.table.theme.scrollStyle) || void 0 === _k ? void 0 : _k.width,
           viewHeight: this.table.tableNoFrameHeight,
           viewWidth: this.table.tableNoFrameWidth,
           scrollDirection: "horizontal",
@@ -55952,15 +56279,18 @@
         }), oldVerticalBarPos !== top && triggerEvent && this.checkVerticalScrollBarEnd();
       }
       setScrollLeft(left, event, triggerEvent = !0) {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
         if (!this.table || !this.table.scenegraph) return;
         this.table.scrollLeft;
         const totalWidth = this.table.getAllColsWidth(),
-          sizeTolerance = (this.table.getFrozenColsWidth(), (null === (_a = this.table.options.customConfig) || void 0 === _a ? void 0 : _a._disableColumnAndRowSizeRound) ? 1 : 0);
-        left = Math.max(0, Math.min(left, totalWidth - this.table.scenegraph.width - sizeTolerance)), left = Math.ceil(left);
+          frozenOffset = null !== (_c = null === (_b = (_a = this.table).getFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0,
+          rightFrozenOffset = null !== (_f = null === (_e = (_d = this.table).getRightFrozenColsOffset) || void 0 === _e ? void 0 : _e.call(_d)) && void 0 !== _f ? _f : 0,
+          scrollRange = Math.max(0, totalWidth - this.table.scenegraph.width - frozenOffset - rightFrozenOffset),
+          sizeTolerance = (null === (_g = this.table.options.customConfig) || void 0 === _g ? void 0 : _g._disableColumnAndRowSizeRound) ? 1 : 0;
+        left = Math.max(0, Math.min(left, scrollRange - sizeTolerance)), left = Math.ceil(left);
         const oldHorizontalBarPos = this.scroll.horizontalBarPos,
-          xRatio = left / (totalWidth - this.table.scenegraph.width);
-        if ((oldHorizontalBarPos !== left || !0 === (null === (_c = null === (_b = this.table.options) || void 0 === _b ? void 0 : _b.customConfig) || void 0 === _c ? void 0 : _c.scrollEventAlwaysTrigger)) && triggerEvent) {
+          xRatio = scrollRange ? left / scrollRange : 0;
+        if ((oldHorizontalBarPos !== left || !0 === (null === (_j = null === (_h = this.table.options) || void 0 === _h ? void 0 : _h.customConfig) || void 0 === _j ? void 0 : _j.scrollEventAlwaysTrigger)) && triggerEvent) {
           let horizontalBarPos = left;
           isValid$1(horizontalBarPos) && !isNaN(horizontalBarPos) || (horizontalBarPos = 0);
           const dx = horizontalBarPos - oldHorizontalBarPos;
@@ -55968,15 +56298,15 @@
             event: null == event ? void 0 : event.nativeEvent,
             scrollTop: this.scroll.verticalBarPos,
             scrollLeft: horizontalBarPos,
-            scrollHeight: null === (_d = this.table.theme.scrollStyle) || void 0 === _d ? void 0 : _d.width,
-            scrollWidth: null === (_e = this.table.theme.scrollStyle) || void 0 === _e ? void 0 : _e.width,
+            scrollHeight: null === (_k = this.table.theme.scrollStyle) || void 0 === _k ? void 0 : _k.width,
+            scrollWidth: null === (_l = this.table.theme.scrollStyle) || void 0 === _l ? void 0 : _l.width,
             viewHeight: this.table.tableNoFrameHeight,
             viewWidth: this.table.tableNoFrameWidth,
             scrollDirection: "horizontal",
             scrollRatioX: xRatio,
             dx: dx
           }).some(value => !1 === value)) {
-            const xRatio = this.scroll.horizontalBarPos / (totalWidth - this.table.scenegraph.width);
+            const xRatio = scrollRange ? this.scroll.horizontalBarPos / scrollRange : 0;
             return void this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio);
           }
         }
@@ -55986,8 +56316,8 @@
           event: null == event ? void 0 : event.nativeEvent,
           scrollTop: this.scroll.verticalBarPos,
           scrollLeft: this.scroll.horizontalBarPos,
-          scrollHeight: null === (_f = this.table.theme.scrollStyle) || void 0 === _f ? void 0 : _f.width,
-          scrollWidth: null === (_g = this.table.theme.scrollStyle) || void 0 === _g ? void 0 : _g.width,
+          scrollHeight: null === (_m = this.table.theme.scrollStyle) || void 0 === _m ? void 0 : _m.width,
+          scrollWidth: null === (_o = this.table.theme.scrollStyle) || void 0 === _o ? void 0 : _o.width,
           viewHeight: this.table.tableNoFrameHeight,
           viewWidth: this.table.tableNoFrameWidth,
           scrollDirection: "horizontal",
@@ -55999,7 +56329,7 @@
         this.table.scenegraph.component.hideVerticalScrollBar();
       }
       showVerticalScrollBar(autoHide) {
-        this.table.scenegraph.component.showVerticalScrollBar(), autoHide && (clearTimeout(this._clearVerticalScrollBar), this._clearVerticalScrollBar = setTimeout(() => {
+        this.table.scenegraph.component.showVerticalScrollBar(), clearTimeout(this._clearVerticalScrollBar), autoHide && (this._clearVerticalScrollBar = setTimeout(() => {
           var _a;
           null === (_a = this.table.scenegraph) || void 0 === _a || _a.component.hideVerticalScrollBar();
         }, 1e3));
@@ -56007,9 +56337,9 @@
       hideHorizontalScrollBar() {
         this.table.scenegraph.component.hideHorizontalScrollBar();
       }
-      showHorizontalScrollBar(autoHide) {
+      showHorizontalScrollBar(autoHide, target = "all") {
         var _a;
-        this.table.scenegraph.component.showHorizontalScrollBar(), null === (_a = this.table.scenegraph) || void 0 === _a || _a.component.showFrozenColumnShadow(), autoHide && (clearTimeout(this._clearHorizontalScrollBar), this._clearHorizontalScrollBar = setTimeout(() => {
+        this.table.scenegraph.component.showHorizontalScrollBar(target), null === (_a = this.table.scenegraph) || void 0 === _a || _a.component.showFrozenColumnShadow(), clearTimeout(this._clearHorizontalScrollBar), autoHide && (this._clearHorizontalScrollBar = setTimeout(() => {
           var _a, _b;
           null === (_a = this.table.scenegraph) || void 0 === _a || _a.component.hideFrozenColumnShadow(), null === (_b = this.table.scenegraph) || void 0 === _b || _b.component.hideHorizontalScrollBar();
         }, 1e3));
@@ -56380,7 +56710,7 @@
     }
 
     function handleWhell(event, state, isWheelEvent = !0) {
-      var _a, _b, _c;
+      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
       let {
         deltaX: deltaX,
         deltaY: deltaY
@@ -56391,8 +56721,39 @@
         vertical: 1
       });
       (optimizedDeltaX || optimizedDeltaY) && state.interactionState !== InteractionState.scrolling && state.updateInteractionState(InteractionState.scrolling);
-      const autoHide = "scrolling" === (null === (_b = null === (_a = state.table.options.theme) || void 0 === _a ? void 0 : _a.scrollStyle) || void 0 === _b ? void 0 : _b.visible);
-      optimizedDeltaX && (state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX, event), state.showHorizontalScrollBar(autoHide)), optimizedDeltaY && (state.setScrollTop(state.scroll.verticalBarPos + optimizedDeltaY, event), state.showVerticalScrollBar(autoHide)), isWheelEvent && state.resetInteractionState(state.interactionStateBeforeScroll), (null === (_c = event.nativeEvent) || void 0 === _c ? void 0 : _c.cancelable) && ("none" === state.table.internalProps.overscrollBehavior && (deltaY && isVerticalExistScrollBar(state) || deltaX && isHorizontalExistScrollBar(state)) || Math.abs(deltaY) >= Math.abs(deltaX) && 0 !== deltaY && isVerticalScrollable(deltaY, state) || Math.abs(deltaY) <= Math.abs(deltaX) && 0 !== deltaX && isHorizontalScrollable(deltaX, state)) && event.nativeEvent.preventDefault();
+      const visible1 = null === (_a = state.table.theme.scrollStyle) || void 0 === _a ? void 0 : _a.visible,
+        horizontalAutoHide = "scrolling" === (null !== (_c = null === (_b = state.table.theme.scrollStyle) || void 0 === _b ? void 0 : _b.horizontalVisible) && void 0 !== _c ? _c : visible1),
+        verticalAutoHide = "scrolling" === (null !== (_e = null === (_d = state.table.theme.scrollStyle) || void 0 === _d ? void 0 : _d.verticalVisible) && void 0 !== _e ? _e : visible1);
+      let usedFrozenHorizontal = !1,
+        usedRightFrozenHorizontal = !1,
+        blockedFrozenHorizontal = !1,
+        blockedRightFrozenHorizontal = !1;
+      if (optimizedDeltaX) {
+        const pxEvent = event.x,
+          pyEvent = event.y,
+          pxFallback = null === (_g = null === (_f = state.table.eventManager) || void 0 === _f ? void 0 : _f.LastBodyPointerXY) || void 0 === _g ? void 0 : _g.x,
+          pyFallback = null === (_j = null === (_h = state.table.eventManager) || void 0 === _h ? void 0 : _h.LastBodyPointerXY) || void 0 === _j ? void 0 : _j.y,
+          px = "number" == typeof pxEvent ? pxEvent : pxFallback,
+          py = "number" == typeof pyEvent ? pyEvent : pyFallback,
+          relativeX = "number" == typeof px ? px - state.table.tableX : NaN,
+          relativeY = "number" == typeof py ? py - state.table.tableY : NaN,
+          isInTable = isFinite(relativeX) && isFinite(relativeY) && relativeX >= 0 && relativeY >= 0 && relativeX <= state.table.tableNoFrameWidth && relativeY <= state.table.tableNoFrameHeight,
+          frozenColsScrollable = state.table.options.scrollFrozenCols && state.table.getFrozenColsOffset() > 0,
+          rightFrozenColsScrollable = state.table.options.scrollRightFrozenCols && state.table.getRightFrozenColsOffset() > 0,
+          isInFrozenViewport = isInTable && relativeX > 0 && relativeX < state.table.getFrozenColsWidth(),
+          isInRightFrozenViewport = isInTable && relativeX > state.table.tableNoFrameWidth - state.table.getRightFrozenColsWidth();
+        if (frozenColsScrollable && isInFrozenViewport) {
+          const maxFrozenScrollLeft = state.table.getFrozenColsOffset(),
+            nextFrozenScrollLeft = state.scroll.frozenHorizontalBarPos + optimizedDeltaX;
+          optimizedDeltaX < 0 && state.scroll.frozenHorizontalBarPos > 0 || optimizedDeltaX > 0 && state.scroll.frozenHorizontalBarPos < maxFrozenScrollLeft ? (state.setFrozenColsScrollLeft(nextFrozenScrollLeft), usedFrozenHorizontal = !0, state.showHorizontalScrollBar(horizontalAutoHide, "frozen")) : state.table.options.scrollFrozenColsPassThroughToBody ? (state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX, event), state.showHorizontalScrollBar(horizontalAutoHide, "body")) : (blockedFrozenHorizontal = !0, state.showHorizontalScrollBar(horizontalAutoHide, "frozen"));
+        } else if (rightFrozenColsScrollable && isInRightFrozenViewport) {
+          const maxRightFrozenScrollLeft = state.table.getRightFrozenColsOffset(),
+            rightFrozenDelta = -optimizedDeltaX,
+            nextRightFrozenScrollLeft = state.scroll.rightFrozenHorizontalBarPos + rightFrozenDelta;
+          rightFrozenDelta < 0 && state.scroll.rightFrozenHorizontalBarPos > 0 || rightFrozenDelta > 0 && state.scroll.rightFrozenHorizontalBarPos < maxRightFrozenScrollLeft ? (state.setRightFrozenColsScrollLeft(nextRightFrozenScrollLeft), usedRightFrozenHorizontal = !0, state.showHorizontalScrollBar(horizontalAutoHide, "rightFrozen")) : state.table.options.scrollFrozenColsPassThroughToBody ? (state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX, event), state.showHorizontalScrollBar(horizontalAutoHide, "body")) : (blockedRightFrozenHorizontal = !0, state.showHorizontalScrollBar(horizontalAutoHide, "rightFrozen"));
+        } else state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX, event), state.showHorizontalScrollBar(horizontalAutoHide, "body");
+      }
+      optimizedDeltaY && (state.setScrollTop(state.scroll.verticalBarPos + optimizedDeltaY, event), state.showVerticalScrollBar(verticalAutoHide)), isWheelEvent && state.resetInteractionState(state.interactionStateBeforeScroll), (null === (_k = event.nativeEvent) || void 0 === _k ? void 0 : _k.cancelable) && ("none" === state.table.internalProps.overscrollBehavior && (deltaY && isVerticalExistScrollBar(state) || deltaX && isHorizontalExistScrollBar(state)) || Math.abs(deltaY) >= Math.abs(deltaX) && 0 !== deltaY && isVerticalScrollable(deltaY, state) || Math.abs(deltaY) <= Math.abs(deltaX) && 0 !== deltaX && !blockedFrozenHorizontal && !blockedRightFrozenHorizontal && (usedFrozenHorizontal ? state.table.getFrozenColsOffset() > 0 : usedRightFrozenHorizontal ? state.table.getRightFrozenColsOffset() > 0 : isHorizontalScrollable(deltaX, state))) && event.nativeEvent.preventDefault();
     }
     function optimizeScrollXY(x, y, ratio) {
       var _a, _b;
@@ -56405,13 +56766,19 @@
       return 0 != state.table.getAllRowsHeight() - state.table.scenegraph.height && !isScrollToTop(deltaY, state) && !isScrollToBottom(deltaY, state);
     }
     function isHorizontalScrollable(deltaX, state) {
-      return 0 != state.table.getAllColsWidth() - state.table.scenegraph.width && !isScrollToLeft(deltaX, state) && !isScrollToRight(deltaX, state);
+      var _a, _b, _c, _d, _e, _f;
+      const frozenOffset = null !== (_c = null === (_b = (_a = state.table).getFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0,
+        rightFrozenOffset = null !== (_f = null === (_e = (_d = state.table).getRightFrozenColsOffset) || void 0 === _e ? void 0 : _e.call(_d)) && void 0 !== _f ? _f : 0;
+      return 0 != state.table.getAllColsWidth() - state.table.scenegraph.width - frozenOffset - rightFrozenOffset && !isScrollToLeft(deltaX, state) && !isScrollToRight(deltaX, state);
     }
     function isVerticalExistScrollBar(state) {
       return !(state.table.getAllRowsHeight() - state.table.scenegraph.height <= 0);
     }
     function isHorizontalExistScrollBar(state) {
-      return !(state.table.getAllColsWidth() - state.table.scenegraph.width <= 0);
+      var _a, _b, _c, _d, _e, _f;
+      const frozenOffset = null !== (_c = null === (_b = (_a = state.table).getFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0,
+        rightFrozenOffset = null !== (_f = null === (_e = (_d = state.table).getRightFrozenColsOffset) || void 0 === _e ? void 0 : _e.call(_d)) && void 0 !== _f ? _f : 0;
+      return !(state.table.getAllColsWidth() - state.table.scenegraph.width - frozenOffset - rightFrozenOffset <= 0);
     }
     function isScrollToTop(deltaY, state) {
       return 0 !== state.table.getAllRowsHeight() - state.table.scenegraph.height && deltaY <= 0 && state.scroll.verticalBarPos < 1;
@@ -56423,12 +56790,17 @@
       return 0 !== totalHeight && deltaY >= 0 && Math.abs(state.scroll.verticalBarPos - totalHeight) < 1 + sizeTolerance;
     }
     function isScrollToLeft(deltaX, state) {
-      return 0 !== state.table.getAllColsWidth() - state.table.scenegraph.width && deltaX <= 0 && state.scroll.horizontalBarPos < 1;
+      var _a, _b, _c, _d, _e, _f;
+      const frozenOffset = null !== (_c = null === (_b = (_a = state.table).getFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(_a)) && void 0 !== _c ? _c : 0,
+        rightFrozenOffset = null !== (_f = null === (_e = (_d = state.table).getRightFrozenColsOffset) || void 0 === _e ? void 0 : _e.call(_d)) && void 0 !== _f ? _f : 0;
+      return 0 !== state.table.getAllColsWidth() - state.table.scenegraph.width - frozenOffset - rightFrozenOffset && deltaX <= 0 && state.scroll.horizontalBarPos < 1;
     }
     function isScrollToRight(deltaX, state) {
-      var _a;
+      var _a, _b, _c, _d, _e, _f, _g;
       const sizeTolerance = (null === (_a = state.table.options.customConfig) || void 0 === _a ? void 0 : _a._disableColumnAndRowSizeRound) ? 1 : 0,
-        totalWidth = state.table.getAllColsWidth() - state.table.scenegraph.width;
+        frozenOffset = null !== (_d = null === (_c = (_b = state.table).getFrozenColsOffset) || void 0 === _c ? void 0 : _c.call(_b)) && void 0 !== _d ? _d : 0,
+        rightFrozenOffset = null !== (_g = null === (_f = (_e = state.table).getRightFrozenColsOffset) || void 0 === _f ? void 0 : _f.call(_e)) && void 0 !== _g ? _g : 0,
+        totalWidth = state.table.getAllColsWidth() - state.table.scenegraph.width - frozenOffset - rightFrozenOffset;
       return 0 !== totalWidth && deltaX >= 0 && Math.abs(state.scroll.horizontalBarPos - totalWidth) < 1 + sizeTolerance;
     }
     class InertiaScroll {
@@ -56507,16 +56879,17 @@
 
     function bindTableGroupListener$1(eventManager) {
       const table = eventManager.table,
-        stateManager = table.stateManager;
+        stateManager = table.stateManager,
+        getEventArgsSet = e => getCellEventArgsSetWithTable(e, table);
       table.scenegraph.tableGroup.addEventListener("pointermove", e => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
         const lastX = null !== (_b = null === (_a = table.eventManager.LastPointerXY) || void 0 === _a ? void 0 : _a.x) && void 0 !== _b ? _b : e.x,
           lastY = null !== (_d = null === (_c = table.eventManager.LastPointerXY) || void 0 === _c ? void 0 : _c.y) && void 0 !== _d ? _d : e.y;
         table.eventManager.LastPointerXY = {
           x: e.x,
           y: e.y
         }, eventManager.touchSetTimeout && (clearTimeout(eventManager.touchSetTimeout), eventManager.touchSetTimeout = void 0);
-        const eventArgsSet = getCellEventArgsSet(e);
+        const eventArgsSet = getEventArgsSet(e);
         if (eventArgsSet.eventArgs && table.hasListeners(TABLE_EVENT_TYPE.MOUSEMOVE_TABLE) && table.fireListeners(TABLE_EVENT_TYPE.MOUSEMOVE_TABLE, {
           col: eventArgsSet.eventArgs.col,
           row: eventArgsSet.eventArgs.row,
@@ -56570,14 +56943,19 @@
             mergeCellInfo: null === (_t = eventArgsSet.eventArgs) || void 0 === _t ? void 0 : _t.mergeInfo
           });
         }
+        if (table.theme.scrollStyle.horizontalVisible && "focus" === table.theme.scrollStyle.horizontalVisible || !table.theme.scrollStyle.horizontalVisible && "focus" === table.theme.scrollStyle.visible) {
+          const relativeX = e.x - table.tableX,
+            target = table.options.scrollFrozenCols && (null === (_u = table.getFrozenColsOffset) || void 0 === _u ? void 0 : _u.call(table)) > 0 && relativeX >= 0 && relativeX < table.getFrozenColsWidth() ? "frozen" : table.options.scrollRightFrozenCols && (null === (_v = table.getRightFrozenColsOffset) || void 0 === _v ? void 0 : _v.call(table)) > 0 && relativeX > table.tableNoFrameWidth - table.getRightFrozenColsWidth() ? "rightFrozen" : "body";
+          stateManager.showHorizontalScrollBar(!1, target);
+        }
       }), table.scenegraph.tableGroup.addEventListener("pointerout", e => {
         var _a;
-        const eventArgsSet = getCellEventArgsSet(e),
+        const eventArgsSet = getEventArgsSet(e),
           cellGoup = null === (_a = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target;
         "table" === (null == cellGoup ? void 0 : cellGoup.role) && eventManager.dealTableHover();
       }), table.scenegraph.tableGroup.addEventListener("pointerover", e => {
         var _a, _b;
-        const eventArgsSet = getCellEventArgsSet(e),
+        const eventArgsSet = getEventArgsSet(e),
           cellGoup = null === (_a = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target;
         if (cellGoup && table.hasListeners(TABLE_EVENT_TYPE.MOUSEOVER_CHART_SYMBOL) && "symbol" === cellGoup.type) {
           const cellGroup = e.composedPath().find(p => "cell" === p.roll);
@@ -56606,7 +56984,13 @@
           }
         }
       }), table.scenegraph.tableGroup.addEventListener("pointerenter", e => {
-        (table.theme.scrollStyle.horizontalVisible && "focus" === table.theme.scrollStyle.horizontalVisible || !table.theme.scrollStyle.horizontalVisible && "focus" === table.theme.scrollStyle.visible) && stateManager.showHorizontalScrollBar(), (table.theme.scrollStyle.verticalVisible && "focus" === table.theme.scrollStyle.verticalVisible || !table.theme.scrollStyle.verticalVisible && "focus" === table.theme.scrollStyle.visible) && stateManager.showVerticalScrollBar(), table.hasListeners(TABLE_EVENT_TYPE.MOUSEENTER_TABLE) && table.fireListeners(TABLE_EVENT_TYPE.MOUSEENTER_TABLE, {
+        var _a, _b;
+        if (table.theme.scrollStyle.horizontalVisible && "focus" === table.theme.scrollStyle.horizontalVisible || !table.theme.scrollStyle.horizontalVisible && "focus" === table.theme.scrollStyle.visible) {
+          const relativeX = e.x - table.tableX,
+            target = table.options.scrollFrozenCols && (null === (_a = table.getFrozenColsOffset) || void 0 === _a ? void 0 : _a.call(table)) > 0 && relativeX >= 0 && relativeX < table.getFrozenColsWidth() ? "frozen" : table.options.scrollRightFrozenCols && (null === (_b = table.getRightFrozenColsOffset) || void 0 === _b ? void 0 : _b.call(table)) > 0 && relativeX > table.tableNoFrameWidth - table.getRightFrozenColsWidth() ? "rightFrozen" : "body";
+          stateManager.showHorizontalScrollBar(!1, target);
+        }
+        (table.theme.scrollStyle.verticalVisible && "focus" === table.theme.scrollStyle.verticalVisible || !table.theme.scrollStyle.verticalVisible && "focus" === table.theme.scrollStyle.visible) && stateManager.showVerticalScrollBar(), table.hasListeners(TABLE_EVENT_TYPE.MOUSEENTER_TABLE) && table.fireListeners(TABLE_EVENT_TYPE.MOUSEENTER_TABLE, {
           event: e.nativeEvent
         });
       }), table.scenegraph.tableGroup.addEventListener("pointerleave", e => {
@@ -56636,7 +57020,7 @@
           x: e.x,
           y: e.y
         }, 0 !== e.button) return;
-        const eventArgsSet = getCellEventArgsSet(e);
+        const eventArgsSet = getEventArgsSet(e);
         if (eventManager.downIcon = void 0, stateManager.interactionState !== InteractionState.default) return;
         if (table.isPivotChart() && "chart" !== (null === (_a = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target.type) && (table.scenegraph.updateChartState(null, void 0), table.scenegraph.deactivateChart(-1, -1, !0)), (null === (_b = eventArgsSet.eventArgs) || void 0 === _b ? void 0 : _b.target) !== (null === (_c = stateManager.residentHoverIcon) || void 0 === _c ? void 0 : _c.icon) && stateManager.hideMenu(), "chart" === (null === (_d = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _d ? void 0 : _d.target.type)) return;
         const isCompleteEdit = null === (_e = table.editorManager) || void 0 === _e ? void 0 : _e.completeEdit(e.nativeEvent);
@@ -56673,7 +57057,7 @@
             }
           }
           if (table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_CELL)) {
-            const eventArgsSet = getCellEventArgsSet(e);
+            const eventArgsSet = getEventArgsSet(e);
             eventArgsSet.eventArgs && table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_CELL, {
               col: eventArgsSet.eventArgs.col,
               row: eventArgsSet.eventArgs.row,
@@ -56692,7 +57076,7 @@
               fireMoveColEventListeners(table, endMoveColSuccess, e.nativeEvent);
             } else if (stateManager.isSelecting()) {
               table.stateManager.endSelectCells(), table.stateManager.isFillHandle() && table.stateManager.endFillSelect();
-              const eventArgsSet = getCellEventArgsSet(e);
+              const eventArgsSet = getEventArgsSet(e);
               if (table.eventManager.isDraging && eventArgsSet.eventArgs && table.hasListeners(TABLE_EVENT_TYPE.DRAG_SELECT_END)) {
                 const cellsEvent = {
                   event: e.nativeEvent,
@@ -56708,7 +57092,7 @@
             }
           } else stateManager.interactionState === InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.default);
           if (!table.eventManager.isDraging) {
-            const eventArgsSet = getCellEventArgsSet(e);
+            const eventArgsSet = getEventArgsSet(e);
             if (!eventManager.isTouchMove && 0 === e.button && eventArgsSet.eventArgs && table.hasListeners(TABLE_EVENT_TYPE.CLICK_CELL)) {
               const {
                   col: col,
@@ -56736,7 +57120,7 @@
             }
           }
           if (table.hasListeners(TABLE_EVENT_TYPE.MOUSEUP_CELL)) {
-            const eventArgsSet = getCellEventArgsSet(e);
+            const eventArgsSet = getEventArgsSet(e);
             eventArgsSet.eventArgs && table.fireListeners(TABLE_EVENT_TYPE.MOUSEUP_CELL, {
               col: eventArgsSet.eventArgs.col,
               row: eventArgsSet.eventArgs.row,
@@ -56751,7 +57135,7 @@
         }
       }), table.scenegraph.tableGroup.addEventListener("rightdown", e => {
         var _a, _b, _c, _d, _e, _f, _g, _h;
-        const eventArgsSet = getCellEventArgsSet(e);
+        const eventArgsSet = getEventArgsSet(e);
         if (eventArgsSet.eventArgs) {
           stateManager.triggerContextMenu(eventArgsSet.eventArgs.col, eventArgsSet.eventArgs.row, eventArgsSet.abstractPos.x, eventArgsSet.abstractPos.y);
           const {
@@ -56798,9 +57182,9 @@
       }), table.scenegraph.tableGroup.addEventListener("pointertap", e => {
         var _a;
         if (table.stateManager.columnResize.resizing) return;
-        const eventArgsSet = getCellEventArgsSet(e);
+        const eventArgsSet = getEventArgsSet(e);
         if (!table.stateManager.columnResize.resizing && !table.stateManager.columnMove.moving && (eventManager.dealIconClick(e, eventArgsSet), (null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) && eventManager.touchSetTimeout && "touch" === e.pointerType)) {
-          const eventArgsSet = getCellEventArgsSet(e);
+          const eventArgsSet = getEventArgsSet(e);
           if (eventManager.touchSetTimeout) {
             clearTimeout(eventManager.touchSetTimeout);
             const isHasSelected = !!(null === (_a = stateManager.select.ranges) || void 0 === _a ? void 0 : _a.length);
@@ -56809,7 +57193,7 @@
         }
       }), table.scenegraph.stage.addEventListener("pointerdown", e => {
         var _a, _b, _c, _d;
-        const eventArgsSet = getCellEventArgsSet(e);
+        const eventArgsSet = getCellEventArgsSetWithTable(e, table);
         (null === (_a = eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target) && (null === (_b = eventArgsSet.eventArgs) || void 0 === _b ? void 0 : _b.target) === (null === (_c = stateManager.residentHoverIcon) || void 0 === _c ? void 0 : _c.icon) || stateManager.hideMenu();
         let isCompleteEdit = !1;
         const target = e.target;
@@ -56841,11 +57225,11 @@
         }
       }), table.scenegraph.stage.addEventListener("pointermove", e => {
         var _a, _b, _c;
-        const eventArgsSet = getCellEventArgsSet(e);
+        const eventArgsSet = getCellEventArgsSetWithTable(e, table);
         null !== (_c = null === (_b = null === (_a = e.target) || void 0 === _a ? void 0 : _a.isDescendantsOf) || void 0 === _b ? void 0 : _b.call(_a, table.scenegraph.tableGroup)) && void 0 !== _c && _c && (stateManager.isResizeCol() || eventManager.checkColumnResize(eventArgsSet) ? table.stateManager.select && eventManager.checkCellFillhandle(eventArgsSet) ? stateManager.updateCursor("crosshair") : stateManager.updateCursor("col-resize") : stateManager.isResizeRow() || eventManager.checkRowResize(eventArgsSet) ? table.stateManager.select && eventManager.checkCellFillhandle(eventArgsSet) ? stateManager.updateCursor("crosshair") : stateManager.updateCursor("row-resize") : stateManager.isMoveCol() || stateManager.updateCursor());
       }), table.scenegraph.tableGroup.addEventListener("checkbox_state_change", e => {
         var _a, _b;
-        const eventArgsSet = getCellEventArgsSet(e),
+        const eventArgsSet = getEventArgsSet(e),
           {
             col: col,
             row: row
@@ -56880,7 +57264,7 @@
         table.fireListeners(TABLE_EVENT_TYPE.CHECKBOX_STATE_CHANGE, cellsEvent), table.scenegraph.updateNextFrame();
       }), table.scenegraph.tableGroup.addEventListener("radio_checked", e => {
         var _a, _b, _c;
-        const eventArgsSet = getCellEventArgsSet(e),
+        const eventArgsSet = getEventArgsSet(e),
           {
             col: col,
             row: row,
@@ -56931,7 +57315,7 @@
         table.fireListeners(TABLE_EVENT_TYPE.RADIO_STATE_CHANGE, cellsEvent), table.scenegraph.updateNextFrame();
       }), table.scenegraph.tableGroup.addEventListener("switch_state_change", e => {
         var _a, _b;
-        const eventArgsSet = getCellEventArgsSet(e),
+        const eventArgsSet = getEventArgsSet(e),
           {
             col: col,
             row: row,
@@ -56993,7 +57377,7 @@
     }
     function dblclickHandler(e, table) {
       var _a, _b, _c, _d, _e, _f;
-      const eventArgsSet = getCellEventArgsSet(e);
+      const eventArgsSet = getCellEventArgsSetWithTable(e, table);
       let col = -1,
         row = -1;
       eventArgsSet.eventArgs && (col = eventArgsSet.eventArgs.col, row = eventArgsSet.eventArgs.row);
@@ -57023,17 +57407,29 @@
     }
 
     function bindScrollBarListener(eventManager) {
+      var _a, _b, _c, _d, _e;
       const table = eventManager.table,
         stateManager = table.stateManager,
-        scenegraph = table.scenegraph;
+        scenegraph = table.scenegraph,
+        visible1 = null === (_a = table.theme.scrollStyle) || void 0 === _a ? void 0 : _a.visible,
+        horizontalVisible = null !== (_c = null === (_b = table.theme.scrollStyle) || void 0 === _b ? void 0 : _b.horizontalVisible) && void 0 !== _c ? _c : visible1,
+        verticalVisible = null !== (_e = null === (_d = table.theme.scrollStyle) || void 0 === _d ? void 0 : _d.verticalVisible) && void 0 !== _e ? _e : visible1;
       scenegraph.component.vScrollBar.addEventListener("pointerover", e => {
-        stateManager.showVerticalScrollBar();
+        "focus" !== verticalVisible && "scrolling" !== verticalVisible || stateManager.showVerticalScrollBar();
       }), scenegraph.component.hScrollBar.addEventListener("pointerover", e => {
-        stateManager.showHorizontalScrollBar();
+        "focus" !== horizontalVisible && "scrolling" !== horizontalVisible || stateManager.showHorizontalScrollBar(!1, "body");
+      }), scenegraph.component.frozenHScrollBar.addEventListener("pointerover", e => {
+        "focus" !== horizontalVisible && "scrolling" !== horizontalVisible || stateManager.showHorizontalScrollBar(!1, "frozen");
+      }), scenegraph.component.rightFrozenHScrollBar.addEventListener("pointerover", e => {
+        "focus" !== horizontalVisible && "scrolling" !== horizontalVisible || stateManager.showHorizontalScrollBar(!1, "rightFrozen");
       }), scenegraph.component.vScrollBar.addEventListener("pointerout", e => {
-        stateManager.interactionState !== InteractionState.scrolling && stateManager.hideVerticalScrollBar();
+        stateManager.interactionState !== InteractionState.scrolling && ("focus" === verticalVisible ? stateManager.hideVerticalScrollBar() : "scrolling" === verticalVisible && stateManager.showVerticalScrollBar(!0));
       }), scenegraph.component.hScrollBar.addEventListener("pointerout", e => {
-        stateManager.interactionState !== InteractionState.scrolling && stateManager.hideHorizontalScrollBar();
+        stateManager.interactionState !== InteractionState.scrolling && ("focus" === horizontalVisible ? stateManager.hideHorizontalScrollBar() : "scrolling" === horizontalVisible && stateManager.showHorizontalScrollBar(!0, "body"));
+      }), scenegraph.component.frozenHScrollBar.addEventListener("pointerout", e => {
+        stateManager.interactionState !== InteractionState.scrolling && ("focus" === horizontalVisible ? stateManager.hideHorizontalScrollBar() : "scrolling" === horizontalVisible && stateManager.showHorizontalScrollBar(!0, "frozen"));
+      }), scenegraph.component.rightFrozenHScrollBar.addEventListener("pointerout", e => {
+        stateManager.interactionState !== InteractionState.scrolling && ("focus" === horizontalVisible ? stateManager.hideHorizontalScrollBar() : "scrolling" === horizontalVisible && stateManager.showHorizontalScrollBar(!0, "rightFrozen"));
       }), scenegraph.component.vScrollBar.addEventListener("pointermove", e => {
         scenegraph.table.stateManager.updateCursor("default"), e.stopPropagation();
       }), scenegraph.component.vScrollBar.addEventListener("pointerdown", e => {
@@ -57056,10 +57452,22 @@
         scenegraph.table.eventManager.isDraging = !1;
       }), scenegraph.component.hScrollBar.addEventListener("pointermove", e => {
         scenegraph.table.stateManager.updateCursor(), e.stopPropagation();
+      }), scenegraph.component.frozenHScrollBar.addEventListener("pointermove", e => {
+        scenegraph.table.stateManager.updateCursor(), e.stopPropagation();
+      }), scenegraph.component.rightFrozenHScrollBar.addEventListener("pointermove", e => {
+        scenegraph.table.stateManager.updateCursor(), e.stopPropagation();
       }), scenegraph.component.hScrollBar.addEventListener("pointerdown", e => {
         e.stopPropagation(), scenegraph.table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE) && scenegraph.table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE, {
           event: e.nativeEvent
         });
+      }), scenegraph.component.frozenHScrollBar.addEventListener("pointerdown", e => {
+        e.stopPropagation(), scenegraph.table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE) && scenegraph.table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE, {
+          event: e.nativeEvent
+        });
+      }), scenegraph.component.rightFrozenHScrollBar.addEventListener("pointerdown", e => {
+        e.stopPropagation(), scenegraph.table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE) && scenegraph.table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE, {
+          event: e.nativeEvent
+        });
       }), scenegraph.component.hScrollBar.addEventListener("scrollDown", e => {
         var _a;
         scenegraph.table.eventManager.LastBodyPointerXY = {
@@ -57068,15 +57476,45 @@
         }, scenegraph.table.eventManager.isDown = !0, stateManager.interactionState !== InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.scrolling), scenegraph.table.stateManager.hideMenu(), null === (_a = scenegraph.table.editorManager) || void 0 === _a || _a.completeEdit(), scenegraph.table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE) && scenegraph.table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE, {
           event: e.nativeEvent
         });
+      }), scenegraph.component.frozenHScrollBar.addEventListener("scrollDown", e => {
+        var _a;
+        scenegraph.table.eventManager.LastBodyPointerXY = {
+          x: e.x,
+          y: e.y
+        }, scenegraph.table.eventManager.isDown = !0, stateManager.interactionState !== InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.scrolling), scenegraph.table.stateManager.hideMenu(), null === (_a = scenegraph.table.editorManager) || void 0 === _a || _a.completeEdit(), scenegraph.table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE) && scenegraph.table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE, {
+          event: e.nativeEvent
+        });
+      }), scenegraph.component.rightFrozenHScrollBar.addEventListener("scrollDown", e => {
+        var _a;
+        scenegraph.table.eventManager.LastBodyPointerXY = {
+          x: e.x,
+          y: e.y
+        }, scenegraph.table.eventManager.isDown = !0, stateManager.interactionState !== InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.scrolling), scenegraph.table.stateManager.hideMenu(), null === (_a = scenegraph.table.editorManager) || void 0 === _a || _a.completeEdit(), scenegraph.table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE) && scenegraph.table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE, {
+          event: e.nativeEvent
+        });
       }), scenegraph.component.hScrollBar.addEventListener("pointerup", () => {
         stateManager.fastScrolling = !1, scenegraph.table.eventManager.isDraging = !1, stateManager.interactionState === InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.default);
       }), scenegraph.component.hScrollBar.addEventListener("pointerupoutside", () => {
         stateManager.fastScrolling = !1, stateManager.interactionState === InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.default);
       }), scenegraph.component.hScrollBar.addEventListener("scrollUp", e => {
         scenegraph.table.eventManager.isDraging = !1;
+      }), scenegraph.component.frozenHScrollBar.addEventListener("pointerup", () => {
+        stateManager.fastScrolling = !1, scenegraph.table.eventManager.isDraging = !1, stateManager.interactionState === InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.default);
+      }), scenegraph.component.frozenHScrollBar.addEventListener("pointerupoutside", () => {
+        stateManager.fastScrolling = !1, stateManager.interactionState === InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.default);
+      }), scenegraph.component.frozenHScrollBar.addEventListener("scrollUp", e => {
+        scenegraph.table.eventManager.isDraging = !1;
+      }), scenegraph.component.rightFrozenHScrollBar.addEventListener("pointerup", () => {
+        stateManager.fastScrolling = !1, scenegraph.table.eventManager.isDraging = !1, stateManager.interactionState === InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.default);
+      }), scenegraph.component.rightFrozenHScrollBar.addEventListener("pointerupoutside", () => {
+        stateManager.fastScrolling = !1, stateManager.interactionState === InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.default);
+      }), scenegraph.component.rightFrozenHScrollBar.addEventListener("scrollUp", e => {
+        scenegraph.table.eventManager.isDraging = !1;
       });
       const throttleVerticalWheel = throttle(stateManager.updateVerticalScrollBar, 20),
-        throttleHorizontalWheel = throttle(stateManager.updateHorizontalScrollBar, 20);
+        throttleHorizontalWheel = throttle(stateManager.updateHorizontalScrollBar, 20),
+        throttleFrozenHorizontalWheel = throttle(stateManager.updateFrozenHorizontalScrollBar, 20),
+        throttleRightFrozenHorizontalWheel = throttle(stateManager.updateRightFrozenHorizontalScrollBar, 20);
       scenegraph.component.vScrollBar.addEventListener("scrollDrag", e => {
         var _a;
         scenegraph.table.eventManager.isDown && (scenegraph.table.eventManager.isDraging = !0), stateManager.fastScrolling = !0, stateManager.interactionState !== InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.scrolling), scenegraph.table.stateManager.hideMenu(), null === (_a = scenegraph.table.editorManager) || void 0 === _a || _a.completeEdit(), table.scenegraph.deactivateChart(-1, -1, !0);
@@ -57087,6 +57525,16 @@
         scenegraph.table.eventManager.isDown && (scenegraph.table.eventManager.isDraging = !0), stateManager.fastScrolling = !0, stateManager.interactionState !== InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.scrolling), scenegraph.table.stateManager.hideMenu(), null === (_a = scenegraph.table.editorManager) || void 0 === _a || _a.completeEdit(), table.scenegraph.deactivateChart(-1, -1, !0);
         const ratio = e.detail.value[0] / (1 - e.detail.value[1] + e.detail.value[0]);
         throttleHorizontalWheel(ratio);
+      }), scenegraph.component.frozenHScrollBar.addEventListener("scrollDrag", e => {
+        var _a;
+        scenegraph.table.eventManager.isDown && (scenegraph.table.eventManager.isDraging = !0), stateManager.fastScrolling = !0, stateManager.interactionState !== InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.scrolling), scenegraph.table.stateManager.hideMenu(), null === (_a = scenegraph.table.editorManager) || void 0 === _a || _a.completeEdit(), table.scenegraph.deactivateChart(-1, -1, !0);
+        const ratio = e.detail.value[0] / (1 - e.detail.value[1] + e.detail.value[0]);
+        throttleFrozenHorizontalWheel(ratio);
+      }), scenegraph.component.rightFrozenHScrollBar.addEventListener("scrollDrag", e => {
+        var _a;
+        scenegraph.table.eventManager.isDown && (scenegraph.table.eventManager.isDraging = !0), stateManager.fastScrolling = !0, stateManager.interactionState !== InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.scrolling), scenegraph.table.stateManager.hideMenu(), null === (_a = scenegraph.table.editorManager) || void 0 === _a || _a.completeEdit(), table.scenegraph.deactivateChart(-1, -1, !0);
+        const ratio = e.detail.value[0] / (1 - e.detail.value[1] + e.detail.value[0]);
+        throttleRightFrozenHorizontalWheel(ratio);
       });
     }
 
@@ -57321,18 +57769,20 @@
               right = !1,
               left = !1;
             y > drawRange.bottom - bottomFrozenRowHeight && canScrollY && table.scrollTop + table.tableNoFrameHeight < table.getAllRowsHeight() ? (bottom = !0, table.eventManager.scrollYSpeed = -(y - drawRange.bottom + bottomFrozenRowHeight) / 50) : y < drawRange.top + topFrozenRowHeight && canScrollY && table.scrollTop > 0 && (top = !0, table.eventManager.scrollYSpeed = -(y - drawRange.top - topFrozenRowHeight) / 50), x > drawRange.right - rightFrozenColsWidth && canScrollX && table.scrollLeft + table.tableNoFrameWidth < table.getAllColsWidth() ? (right = !0, table.eventManager.scrollXSpeed = -(x - drawRange.right + rightFrozenColsWidth) / 50) : x < drawRange.left + leftFrozenColsWidth && canScrollX && table.scrollLeft > 0 && (left = !0, table.eventManager.scrollXSpeed = -(x - drawRange.left - leftFrozenColsWidth) / 50), table.eventManager.inertiaScroll.startInertia(table.eventManager.scrollXSpeed, table.eventManager.scrollYSpeed, 1), table.eventManager.inertiaScroll.setScrollHandle((dx, dy) => {
-              var _a;
+              var _a, _b, _c;
               let selectX, selectY;
               handleWhell({
                 deltaX: -dx,
                 deltaY: -dy
-              }, table.stateManager, !1), bottom ? selectY = table.scrollTop + drawRange.height - bottomFrozenRowHeight - 20 : top && (selectY = table.scrollTop + topFrozenRowHeight + 20), right ? selectX = table.scrollLeft + drawRange.width - rightFrozenColsWidth - 20 : left && (selectX = table.scrollLeft + leftFrozenColsWidth + 20);
+              }, table.stateManager, !1);
+              const frozenOffset = null !== (_b = null === (_a = table.getFrozenColsOffset) || void 0 === _a ? void 0 : _a.call(table)) && void 0 !== _b ? _b : 0;
+              bottom ? selectY = table.scrollTop + drawRange.height - bottomFrozenRowHeight - 20 : top && (selectY = table.scrollTop + topFrozenRowHeight + 20), right ? selectX = table.scrollLeft + frozenOffset + drawRange.width - rightFrozenColsWidth - 20 : left && (selectX = table.scrollLeft + frozenOffset + leftFrozenColsWidth + 20);
               let considerFrozenY = !1,
                 considerFrozenX = !1;
-              right || left || (x > table.tableNoFrameWidth - table.getRightFrozenColsWidth() && x < table.tableNoFrameWidth || x > 0 && x < table.getFrozenColsWidth() ? (selectX = x, considerFrozenX = !0) : selectX = table.scrollLeft + x), bottom || top || (y > table.tableNoFrameHeight - table.getBottomFrozenRowsHeight() && y < table.tableNoFrameHeight || y > 0 && y < table.getFrozenRowsHeight() ? (selectY = y, considerFrozenY = !0) : selectY = table.scrollTop + y), table.stateManager.updateInteractionState(InteractionState.grabing);
+              right || left || (x > table.tableNoFrameWidth - table.getRightFrozenColsWidth() && x < table.tableNoFrameWidth || x > 0 && x < table.getFrozenColsWidth() ? (selectX = x, considerFrozenX = !0) : selectX = table.scrollLeft + frozenOffset + x), bottom || top || (y > table.tableNoFrameHeight - table.getBottomFrozenRowsHeight() && y < table.tableNoFrameHeight || y > 0 && y < table.getFrozenRowsHeight() ? (selectY = y, considerFrozenY = !0) : selectY = table.scrollTop + y), table.stateManager.updateInteractionState(InteractionState.grabing);
               const targetCol = table.getTargetColAtConsiderRightFrozen(selectX, considerFrozenX),
                 targetRow = table.getTargetRowAtConsiderBottomFrozen(selectY, considerFrozenY);
-              !(null === (_a = table.options.select) || void 0 === _a ? void 0 : _a.disableDragSelect) && isValid$1(targetCol) && isValid$1(targetRow) && table.stateManager.updateSelectPos("row" === table.stateManager.select.selectInline ? table.colCount - 1 : targetCol.col, "col" === table.stateManager.select.selectInline ? table.rowCount - 1 : targetRow.row, !1, !1, !1, !1);
+              !(null === (_c = table.options.select) || void 0 === _c ? void 0 : _c.disableDragSelect) && isValid$1(targetCol) && isValid$1(targetRow) && table.stateManager.updateSelectPos("row" === table.stateManager.select.selectInline ? table.colCount - 1 : targetCol.col, "col" === table.stateManager.select.selectInline ? table.rowCount - 1 : targetRow.row, !1, !1, !1, !1);
             });
           } else table.eventManager.inertiaScroll.isInertiaScrolling() ? table.eventManager.inertiaScroll.endInertia() : table.eventManager.scrollYSpeed = 0;
         }
@@ -59958,18 +60408,24 @@
       })(candRow, bottom);
     }
     function getTargetColAtConsiderRightFrozen(absoluteX, isConsider, _this) {
+      var _a, _b;
       if (0 === absoluteX) return {
         left: 0,
         col: 0,
         right: 0,
         width: 0
       };
-      if (absoluteX -= _this.tableX, isConsider && absoluteX > _this.tableNoFrameWidth - _this.getRightFrozenColsWidth() && absoluteX < _this.tableNoFrameWidth && absoluteX <= _this.getAllColsWidth()) for (let i = 0; i < _this.rightFrozenColCount; i++) if (absoluteX > _this.tableNoFrameWidth - _this.getColsWidth(_this.colCount - i - 1, _this.colCount - 1)) return {
-        col: _this.colCount - i - 1,
-        left: void 0,
-        right: void 0,
-        width: void 0
-      };
+      absoluteX -= _this.tableX;
+      const rightFrozenScrollLeft = null !== (_b = null === (_a = _this.getRightFrozenColsScrollLeft) || void 0 === _a ? void 0 : _a.call(_this)) && void 0 !== _b ? _b : 0;
+      if (isConsider && absoluteX > _this.tableNoFrameWidth - _this.getRightFrozenColsWidth() && absoluteX < _this.tableNoFrameWidth && absoluteX <= _this.getAllColsWidth()) {
+        absoluteX -= rightFrozenScrollLeft;
+        for (let i = 0; i < _this.rightFrozenColCount; i++) if (absoluteX > _this.tableNoFrameWidth - _this.getColsWidth(_this.colCount - i - 1, _this.colCount - 1)) return {
+          col: _this.colCount - i - 1,
+          left: void 0,
+          right: void 0,
+          width: void 0
+        };
+      }
       return getTargetColAt(absoluteX, _this);
     }
     function getTargetRowAtConsiderBottomFrozen(absoluteY, isConsider, _this) {
@@ -60007,16 +60463,20 @@
       return Math.min(Math.ceil(absoluteX / _this.internalProps.defaultColWidth), _this.colCount - 1);
     }
     function getCellAtRelativePosition(x, y, _this) {
-      x -= _this.tableX;
+      var _a, _b, _c, _d;
+      x -= _this.tableX, y -= _this.tableY;
+      const frozenColsWidth = _this.getFrozenColsWidth(),
+        frozenColsOffset = null !== (_b = null === (_a = _this.getFrozenColsOffset) || void 0 === _a ? void 0 : _a.call(_this)) && void 0 !== _b ? _b : 0,
+        frozenColsScrollLeft = null !== (_d = null === (_c = _this.getFrozenColsScrollLeft) || void 0 === _c ? void 0 : _c.call(_this)) && void 0 !== _d ? _d : 0;
       let topFrozen = !1;
-      (y -= _this.tableY) > 0 && y < _this.getFrozenRowsHeight() && (topFrozen = !0);
+      y > 0 && y < _this.getFrozenRowsHeight() && (topFrozen = !0);
       let leftFrozen = !1;
-      x > 0 && x < _this.getFrozenColsWidth() && (leftFrozen = !0);
+      x > 0 && x < frozenColsWidth && (leftFrozen = !0);
       let bottomFrozen = !1;
       y > _this.tableNoFrameHeight - _this.getBottomFrozenRowsHeight() && y < _this.tableNoFrameHeight && y <= _this.getAllRowsHeight() && (bottomFrozen = !0);
       let rightFrozen = !1;
       x > _this.tableNoFrameWidth - _this.getRightFrozenColsWidth() && x < _this.tableNoFrameWidth && x <= _this.getAllColsWidth() && (rightFrozen = !0);
-      const colInfo = getTargetColAtConsiderRightFrozen((leftFrozen || rightFrozen ? x : x + _this.scrollLeft) + _this.tableX, rightFrozen, _this),
+      const colInfo = getTargetColAtConsiderRightFrozen((leftFrozen ? x + frozenColsScrollLeft : rightFrozen ? x : x + _this.scrollLeft + frozenColsOffset) + _this.tableX, rightFrozen, _this),
         rowInfo = getTargetRowAtConsiderBottomFrozen((topFrozen || bottomFrozen ? y : y + _this.scrollTop) + _this.tableY, bottomFrozen, _this);
       if (colInfo && rowInfo) {
         const {
@@ -60050,11 +60510,16 @@
       };
     }
     function getColAtRelativePosition(x, _this) {
+      var _a, _b, _c, _d;
+      x -= _this.tableX;
+      const frozenColsWidth = _this.getFrozenColsWidth(),
+        frozenColsOffset = null !== (_b = null === (_a = _this.getFrozenColsOffset) || void 0 === _a ? void 0 : _a.call(_this)) && void 0 !== _b ? _b : 0,
+        frozenColsScrollLeft = null !== (_d = null === (_c = _this.getFrozenColsScrollLeft) || void 0 === _c ? void 0 : _c.call(_this)) && void 0 !== _d ? _d : 0;
       let leftFrozen = !1;
-      (x -= _this.tableX) > 0 && x < _this.getFrozenColsWidth() && (leftFrozen = !0);
+      x > 0 && x < frozenColsWidth && (leftFrozen = !0);
       let rightFrozen = !1;
       x > _this.tableNoFrameWidth - _this.getRightFrozenColsWidth() && x < _this.tableNoFrameWidth && x <= _this.getAllColsWidth() && (rightFrozen = !0);
-      const colInfo = getTargetColAtConsiderRightFrozen((leftFrozen || rightFrozen ? x : x + _this.scrollLeft) + _this.tableX, rightFrozen, _this);
+      const colInfo = getTargetColAtConsiderRightFrozen((leftFrozen ? x + frozenColsScrollLeft : rightFrozen ? x : x + _this.scrollLeft + frozenColsOffset) + _this.tableX, rightFrozen, _this);
       if (colInfo) {
         const {
           col: col
@@ -60439,7 +60904,7 @@
       }
       constructor(container, options = {}) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
-        if (super(), this.showFrozenIcon = !0, this._scrollToRowCorrectTimer = null, this._tableBorderWidth_left = 0, this._tableBorderWidth_right = 0, this._tableBorderWidth_top = 0, this._tableBorderWidth_bottom = 0, this.version = "1.24.0", this.id = `VTable${Date.now()}`, this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = throttle2(this.render.bind(this), 200), "node" === Env.mode ? (options = container, container = null) : container instanceof HTMLElement || (options = container, container = container.container ? container.container : null), !container && "node" !== options.mode && !options.canvas) throw new Error("vtable's container is undefined");
+        if (super(), this.showFrozenIcon = !0, this._scrollToRowCorrectTimer = null, this._tableBorderWidth_left = 0, this._tableBorderWidth_right = 0, this._tableBorderWidth_top = 0, this._tableBorderWidth_bottom = 0, this.version = "1.25.0", this.id = `VTable${Date.now()}`, this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = throttle2(this.render.bind(this), 200), "node" === Env.mode ? (options = container, container = null) : container instanceof HTMLElement || (options = container, container = container.container ? container.container : null), !container && "node" !== options.mode && !options.canvas) throw new Error("vtable's container is undefined");
         this.pluginManager = new PluginManager$1(this, options), this.fireListeners(TABLE_EVENT_TYPE.BEFORE_INIT, {
           options: options,
           container: container
@@ -60640,7 +61105,7 @@
       set frozenColCount(frozenColCount) {
         frozenColCount >= this.colCount && (frozenColCount = 0), this.internalProps.frozenColCount = frozenColCount, this.options.frozenColCount = frozenColCount;
         const maxFrozenWidth = this._getMaxFrozenWidth();
-        if (this.getColsWidth(0, frozenColCount - 1) > maxFrozenWidth) if (this.internalProps.unfreezeAllOnExceedsMaxWidth) this.internalProps.frozenColCount = 0;else {
+        if (!this.options.scrollFrozenCols && this.getColsWidth(0, frozenColCount - 1) > maxFrozenWidth) if (this.internalProps.unfreezeAllOnExceedsMaxWidth) this.internalProps.frozenColCount = 0;else {
           const computedFrozenColCount = this._getComputedFrozenColCount(frozenColCount);
           this.internalProps.frozenColCount = computedFrozenColCount;
         }
@@ -60649,7 +61114,7 @@
       setFrozenColCount(frozenColCount) {
         frozenColCount >= this.colCount && (frozenColCount = 0), this.internalProps.frozenColCount = frozenColCount, this.options.frozenColCount = frozenColCount;
         const maxFrozenWidth = this._getMaxFrozenWidth();
-        if (this.getColsWidth(0, frozenColCount - 1) > maxFrozenWidth) if (this.internalProps.unfreezeAllOnExceedsMaxWidth) this.internalProps.frozenColCount = 0;else {
+        if (!this.options.scrollFrozenCols && this.getColsWidth(0, frozenColCount - 1) > maxFrozenWidth) if (this.internalProps.unfreezeAllOnExceedsMaxWidth) this.internalProps.frozenColCount = 0;else {
           const computedFrozenColCount = this._getComputedFrozenColCount(frozenColCount);
           this.internalProps.frozenColCount = computedFrozenColCount;
         }
@@ -60803,6 +61268,11 @@
         const maxFrozenWidth = null !== (_a = this.options.maxFrozenWidth) && void 0 !== _a ? _a : "80%";
         return _toPxWidth(this, maxFrozenWidth);
       }
+      _getMaxRightFrozenWidth() {
+        var _a, _b;
+        const maxRightFrozenWidth = null !== (_b = null !== (_a = this.options.maxRightFrozenWidth) && void 0 !== _a ? _a : this.options.maxFrozenWidth) && void 0 !== _b ? _b : "80%";
+        return _toPxWidth(this, maxRightFrozenWidth);
+      }
       _getComputedFrozenColCount(frozenColCount) {
         const maxFrozenWidth = this._getMaxFrozenWidth();
         let computedfrozenColCount = frozenColCount;
@@ -61121,21 +61591,26 @@
         let relativeX = !0,
           relativeY = !0;
         (null == isFrozenCell ? void 0 : isFrozenCell.col) && (null == isFrozenCell ? void 0 : isFrozenCell.row) ? (relativeX = !1, relativeY = !1) : (null == isFrozenCell ? void 0 : isFrozenCell.col) ? relativeX = !1 : (null == isFrozenCell ? void 0 : isFrozenCell.row) && (relativeY = !1);
-        const cellRect = this.getCellRect(col, row);
-        return this._toRelativeRect(cellRect, relativeX, relativeY);
+        const cellRect = this.getCellRect(col, row),
+          rect = this._toRelativeRect(cellRect, relativeX, relativeY);
+        return (null == isFrozenCell ? void 0 : isFrozenCell.col) && !this.isRightFrozenColumn(col, row) && rect.offsetLeft(-this.getFrozenColsScrollLeft()), rect;
       }
       getCellRangeRelativeRect(range) {
         if (range.start) {
           const isFrozenCell = this.isFrozenCell(range.start.col, range.start.row);
           let relativeX = !0,
             relativeY = !0;
-          return (null == isFrozenCell ? void 0 : isFrozenCell.col) && (null == isFrozenCell ? void 0 : isFrozenCell.row) ? (relativeX = !1, relativeY = !1) : (null == isFrozenCell ? void 0 : isFrozenCell.col) ? relativeX = !1 : (null == isFrozenCell ? void 0 : isFrozenCell.row) && (relativeY = !1), this._toRelativeRect(this.getCellsRect(range.start.col, range.start.row, range.end.col, range.end.row), relativeX, relativeY);
+          (null == isFrozenCell ? void 0 : isFrozenCell.col) && (null == isFrozenCell ? void 0 : isFrozenCell.row) ? (relativeX = !1, relativeY = !1) : (null == isFrozenCell ? void 0 : isFrozenCell.col) ? relativeX = !1 : (null == isFrozenCell ? void 0 : isFrozenCell.row) && (relativeY = !1);
+          const rect = this._toRelativeRect(this.getCellsRect(range.start.col, range.start.row, range.end.col, range.end.row), relativeX, relativeY);
+          return (null == isFrozenCell ? void 0 : isFrozenCell.col) && !this.isRightFrozenColumn(range.start.col, range.start.row) && rect.offsetLeft(-this.getFrozenColsScrollLeft()), rect;
         }
         const cellRange = this.getCellRange(range.col, range.row),
           isFrozenCell = this.isFrozenCell(range.col, range.row);
         let relativeX = !0,
           relativeY = !0;
-        return (null == isFrozenCell ? void 0 : isFrozenCell.col) && (null == isFrozenCell ? void 0 : isFrozenCell.row) ? (relativeX = !1, relativeY = !1) : (null == isFrozenCell ? void 0 : isFrozenCell.col) ? relativeX = !1 : (null == isFrozenCell ? void 0 : isFrozenCell.row) && (relativeY = !1), this._toRelativeRect(this.getCellsRect(cellRange.start.col, cellRange.start.row, cellRange.end.col, cellRange.end.row), relativeX, relativeY);
+        (null == isFrozenCell ? void 0 : isFrozenCell.col) && (null == isFrozenCell ? void 0 : isFrozenCell.row) ? (relativeX = !1, relativeY = !1) : (null == isFrozenCell ? void 0 : isFrozenCell.col) ? relativeX = !1 : (null == isFrozenCell ? void 0 : isFrozenCell.row) && (relativeY = !1);
+        const rect = this._toRelativeRect(this.getCellsRect(cellRange.start.col, cellRange.start.row, cellRange.end.col, cellRange.end.row), relativeX, relativeY);
+        return (null == isFrozenCell ? void 0 : isFrozenCell.col) && !this.isRightFrozenColumn(range.col, range.row) && rect.offsetLeft(-this.getFrozenColsScrollLeft()), rect;
       }
       getVisibleCellRangeRelativeRect(range) {
         let cellRange;
@@ -61245,7 +61720,7 @@
           } = this,
           width = this.tableNoFrameWidth,
           height = this.tableNoFrameHeight;
-        return new Rect$1(scrollLeft, scrollTop, width, height);
+        return new Rect$1(scrollLeft + this.getFrozenColsOffset(), scrollTop, width, height);
       }
       get visibleRowCount() {
         const {
@@ -61274,7 +61749,8 @@
             scrollLeft: scrollLeft
           } = this,
           frozenRowsHeight = this.getFrozenRowsHeight(),
-          frozenColsWidth = this.getFrozenColsWidth(),
+          frozenColsContentWidth = this.getFrozenColsContentWidth(),
+          frozenColsOffset = this.getFrozenColsOffset(),
           bottomFrozenRowsHeight = this.getBottomFrozenRowsHeight(),
           rightFrozenColsWidth = this.getRightFrozenColsWidth(),
           {
@@ -61282,9 +61758,9 @@
           } = this.getRowAt(scrollTop + frozenRowsHeight + 1),
           {
             col: colStart
-          } = this.getColAt(scrollLeft + frozenColsWidth + 1),
+          } = this.getColAt(scrollLeft + frozenColsContentWidth + 1),
           rowEnd = this.getAllRowsHeight() > this.tableNoFrameHeight ? this.getRowAt(scrollTop + this.tableNoFrameHeight - 1 - bottomFrozenRowsHeight).row : this.rowCount - 1,
-          colEnd = this.getAllColsWidth() > this.tableNoFrameWidth ? this.getColAt(scrollLeft + this.tableNoFrameWidth - 1 - rightFrozenColsWidth).col : this.colCount - 1;
+          colEnd = this.getAllColsWidth() > this.tableNoFrameWidth ? this.getColAt(scrollLeft + frozenColsOffset + this.tableNoFrameWidth - 1 - rightFrozenColsWidth).col : this.colCount - 1;
         return colEnd < 0 || rowEnd < 0 ? null : {
           rowStart: rowStart,
           colStart: colStart,
@@ -61311,12 +61787,13 @@
         const {
             scrollLeft: scrollLeft
           } = this,
-          frozenColsWidth = this.getFrozenColsWidth(),
+          frozenColsContentWidth = this.getFrozenColsContentWidth(),
+          frozenColsOffset = this.getFrozenColsOffset(),
           rightFrozenColsWidth = this.getRightFrozenColsWidth(),
           {
             col: colStart
-          } = this.getColAt(scrollLeft + frozenColsWidth + 1 + start_deltaX),
-          colEnd = this.getAllColsWidth() > this.tableNoFrameWidth ? this.getColAt(scrollLeft + this.tableNoFrameWidth - 1 - rightFrozenColsWidth + end_deltaX).col : this.colCount - 1;
+          } = this.getColAt(scrollLeft + frozenColsContentWidth + 1 + start_deltaX),
+          colEnd = this.getAllColsWidth() > this.tableNoFrameWidth ? this.getColAt(scrollLeft + frozenColsOffset + this.tableNoFrameWidth - 1 - rightFrozenColsWidth + end_deltaX).col : this.colCount - 1;
         return colEnd < 0 ? null : {
           colStart: colStart,
           colEnd: colEnd
@@ -61327,7 +61804,7 @@
             frozenColCount: frozenColCount
           } = this,
           visibleRect = this.getVisibleRect(),
-          visibleLeft = frozenColCount > 0 ? visibleRect.left + this.getColsWidth(0, frozenColCount - 1) : visibleRect.left,
+          visibleLeft = frozenColCount > 0 ? visibleRect.left + this.getFrozenColsWidth() : visibleRect.left,
           initCol = this.getTargetColAt(visibleLeft);
         if (!initCol) return 0;
         const startCol = Math.max(initCol.left >= visibleLeft ? initCol.col : initCol.col + 1, frozenColCount);
@@ -61512,8 +61989,23 @@
         return this.getRowsHeight(0, this.frozenRowCount - 1);
       }
       getFrozenColsWidth() {
+        const contentWidth = this.getFrozenColsContentWidth();
+        if (!this.options.scrollFrozenCols) return contentWidth;
+        const maxFrozenWidth = this._getMaxFrozenWidth();
+        return Math.min(contentWidth, maxFrozenWidth);
+      }
+      getFrozenColsContentWidth() {
         return this.getColsWidth(0, this.frozenColCount - 1);
       }
+      getFrozenColsOffset() {
+        const contentWidth = this.getFrozenColsContentWidth(),
+          viewportWidth = this.getFrozenColsWidth();
+        return Math.max(0, contentWidth - viewportWidth);
+      }
+      getFrozenColsScrollLeft() {
+        var _a;
+        return null !== (_a = this.stateManager.scroll.frozenHorizontalBarPos) && void 0 !== _a ? _a : 0;
+      }
       getBottomFrozenRowsHeight() {
         if (this.bottomFrozenRowCount > 0) {
           let height = 0;
@@ -61523,6 +62015,12 @@
         return 0;
       }
       getRightFrozenColsWidth() {
+        const contentWidth = this.getRightFrozenColsContentWidth();
+        if (!this.options.scrollRightFrozenCols) return contentWidth;
+        const maxRightFrozenWidth = this._getMaxRightFrozenWidth();
+        return Math.min(contentWidth, maxRightFrozenWidth);
+      }
+      getRightFrozenColsContentWidth() {
         if (this.rightFrozenColCount > 0) {
           let width = 0;
           for (let col = this.colCount - this.rightFrozenColCount; col <= this.colCount - 1; col++) width += this.getColWidth(col);
@@ -61530,6 +62028,15 @@
         }
         return 0;
       }
+      getRightFrozenColsOffset() {
+        const contentWidth = this.getRightFrozenColsContentWidth(),
+          viewportWidth = this.getRightFrozenColsWidth();
+        return Math.max(0, contentWidth - viewportWidth);
+      }
+      getRightFrozenColsScrollLeft() {
+        var _a;
+        return null !== (_a = this.stateManager.scroll.rightFrozenHorizontalBarPos) && void 0 !== _a ? _a : 0;
+      }
       getDrawRange() {
         var _a, _b;
         const width = (null === (_a = this.containerFit) || void 0 === _a ? void 0 : _a.width) ? this.tableNoFrameWidth : Math.min(this.tableNoFrameWidth, this.getAllColsWidth()),
@@ -70326,6 +70833,12 @@
   <line x1="70" y1="10" x2="70" y2="190" stroke="black" stroke-width="4"/>
 </svg>`;
     const TASKBAR_HOVER_ICON_WIDTH = 10;
+    const LOCATE_ICON_SIZE = 22;
+    const LOCATE_ICON_PADDING = 4;
+    const LOCATE_ICON_BG = '#f2f3f5';
+    const LOCATE_ICON_BG_HOVER = '#4080ff';
+    const LOCATE_ICON_ARROW = '#4e5969';
+    const LOCATE_ICON_ARROW_HOVER = '#ffffff';
     class TaskBar {
         formatMilestoneText(text, record) {
             if (!text) {
@@ -70396,6 +70909,8 @@
         hoverBarLeftIcon;
         hoverBarRightIcon;
         hoverBarProgressHandle;
+        locateIconsGroup;
+        currentHoverLocateIcon;
         _scene;
         width;
         height;
@@ -70416,6 +70931,9 @@
             scene.ganttGroup.addChild(this.group);
             this.initBars();
             this.initHoverBarIcons();
+            if (scene._gantt.parsedOptions.taskBarLocateIcon) {
+                this.initLocateIconsGroup();
+            }
         }
         initBars() {
             this.barContainer = new Group$2({
@@ -70782,6 +71300,7 @@
             if (baselineBar) {
                 this.barContainer.insertBefore(baselineBar, barGroupBox);
             }
+            this.updateOffscreenIndicators();
         }
         initHoverBarIcons() {
             const hoverBarGroup = new Group$2({
@@ -70848,11 +71367,168 @@
             this.hoverBarProgressHandle = progressHandle;
             hoverBarGroup.appendChild(progressHandle);
         }
+        initLocateIconsGroup() {
+            const locateIconsGroup = new Group$2({
+                x: 0,
+                y: 0,
+                width: this.width,
+                height: this.height,
+                clip: true,
+                pickable: false
+            });
+            this.locateIconsGroup = locateIconsGroup;
+            locateIconsGroup.name = 'task-bar-locate-icons';
+            this.group.appendChild(locateIconsGroup);
+        }
+        applyLocateIconStyle(icon, hover) {
+            const background = icon.background;
+            const arrow = icon.arrow;
+            if (background) {
+                background.setAttribute('fill', hover ? LOCATE_ICON_BG_HOVER : LOCATE_ICON_BG);
+            }
+            if (arrow) {
+                arrow.setAttribute('fill', hover ? LOCATE_ICON_ARROW_HOVER : LOCATE_ICON_ARROW);
+            }
+        }
+        createLocateIcon(side, target) {
+            const iconGroup = new Group$2({
+                x: 0,
+                y: 0,
+                width: LOCATE_ICON_SIZE,
+                height: LOCATE_ICON_SIZE,
+                pickable: true,
+                cursor: 'pointer',
+                visibleAll: false
+            });
+            iconGroup.name = side === 'left' ? 'task-bar-locate-icon-left' : 'task-bar-locate-icon-right';
+            iconGroup.attachedToTaskBarNode = target;
+            iconGroup.side = side;
+            const background = createRect({
+                x: 0,
+                y: 0,
+                width: LOCATE_ICON_SIZE,
+                height: LOCATE_ICON_SIZE,
+                cornerRadius: 4,
+                fill: LOCATE_ICON_BG,
+                pickable: false
+            });
+            const arrowSize = 6;
+            const center = LOCATE_ICON_SIZE / 2;
+            const arrow = side === 'left'
+                ? new Polygon({
+                    points: [
+                        { x: center + arrowSize / 2, y: center - arrowSize },
+                        { x: center - arrowSize / 2, y: center },
+                        { x: center + arrowSize / 2, y: center + arrowSize }
+                    ],
+                    fill: LOCATE_ICON_ARROW,
+                    pickable: false
+                })
+                : new Polygon({
+                    points: [
+                        { x: center - arrowSize / 2, y: center - arrowSize },
+                        { x: center + arrowSize / 2, y: center },
+                        { x: center - arrowSize / 2, y: center + arrowSize }
+                    ],
+                    fill: LOCATE_ICON_ARROW,
+                    pickable: false
+                });
+            iconGroup.appendChild(background);
+            iconGroup.appendChild(arrow);
+            iconGroup.background = background;
+            iconGroup.arrow = arrow;
+            this.applyLocateIconStyle(iconGroup, false);
+            return iconGroup;
+        }
+        setLocateIconHover(icon) {
+            if (this.currentHoverLocateIcon && this.currentHoverLocateIcon !== icon) {
+                this.applyLocateIconStyle(this.currentHoverLocateIcon, false);
+            }
+            if (icon) {
+                this.applyLocateIconStyle(icon, true);
+            }
+            this.currentHoverLocateIcon = icon;
+            this._scene.updateNextFrame();
+        }
+        updateOffscreenIndicators() {
+            if (!this.locateIconsGroup) {
+                return;
+            }
+            const gantt = this._scene._gantt;
+            const scrollLeft = gantt.stateManager.scrollLeft;
+            const scrollTop = gantt.stateManager.scrollTop;
+            const viewWidth = gantt.tableNoFrameWidth;
+            const viewHeight = this.height;
+            const visibleLeft = scrollLeft;
+            const visibleRight = scrollLeft + viewWidth;
+            const visibleTop = scrollTop;
+            const visibleBottom = scrollTop + viewHeight;
+            let child = this.barContainer.firstChild;
+            while (child) {
+                if (child.name === 'task-bar') {
+                    const bar = child;
+                    const barLeft = bar.attribute.x;
+                    const barRight = barLeft + bar.attribute.width;
+                    const barTop = bar.attribute.y;
+                    const barBottom = barTop + bar.attribute.height;
+                    const verticalVisible = barBottom >= visibleTop && barTop <= visibleBottom;
+                    let side = null;
+                    if (verticalVisible) {
+                        if (barRight < visibleLeft) {
+                            side = 'left';
+                        }
+                        else if (barLeft > visibleRight) {
+                            side = 'right';
+                        }
+                    }
+                    const leftIcon = bar.locateLeftIcon;
+                    const rightIcon = bar.locateRightIcon;
+                    if (!side) {
+                        leftIcon?.setAttribute('visibleAll', false);
+                        rightIcon?.setAttribute('visibleAll', false);
+                        if (this.currentHoverLocateIcon === leftIcon || this.currentHoverLocateIcon === rightIcon) {
+                            this.setLocateIconHover(null);
+                        }
+                    }
+                    else {
+                        let icon = side === 'left' ? leftIcon : rightIcon;
+                        if (!icon) {
+                            icon = this.createLocateIcon(side, bar);
+                            if (side === 'left') {
+                                bar.locateLeftIcon = icon;
+                            }
+                            else {
+                                bar.locateRightIcon = icon;
+                            }
+                            this.locateIconsGroup.appendChild(icon);
+                        }
+                        else if (icon.parent !== this.locateIconsGroup) {
+                            this.locateIconsGroup.appendChild(icon);
+                        }
+                        const iconX = side === 'left' ? LOCATE_ICON_PADDING : viewWidth - LOCATE_ICON_SIZE - LOCATE_ICON_PADDING;
+                        const iconY = barTop - scrollTop + (bar.attribute.height - LOCATE_ICON_SIZE) / 2;
+                        icon.setAttributes({
+                            x: iconX,
+                            y: iconY,
+                            visibleAll: true
+                        });
+                        const otherIcon = side === 'left' ? rightIcon : leftIcon;
+                        otherIcon?.setAttribute('visibleAll', false);
+                        if (this.currentHoverLocateIcon === otherIcon) {
+                            this.setLocateIconHover(null);
+                        }
+                    }
+                }
+                child = child._next;
+            }
+        }
         setX(x) {
             this.barContainer.setAttribute('x', x);
+            this.updateOffscreenIndicators();
         }
         setY(y) {
             this.barContainer.setAttribute('y', y);
+            this.updateOffscreenIndicators();
         }
         refresh() {
             this.width = this._scene._gantt.tableNoFrameWidth;
@@ -70862,6 +71538,11 @@
                 width: this.width,
                 y: this._scene._gantt.getAllHeaderRowsHeight()
             });
+            this.locateIconsGroup?.setAttributes({
+                width: this.width,
+                height: this.height
+            });
+            this.locateIconsGroup?.removeAllChild();
             const x = this.barContainer.attribute.x;
             const y = this.barContainer.attribute.y;
             this.barContainer.removeAllChild();
@@ -70869,12 +71550,18 @@
             this.initBars();
             this.setX(x);
             this.setY(y);
+            this.updateOffscreenIndicators();
         }
         resize() {
             this.width = this._scene._gantt.tableNoFrameWidth;
             this.height = this._scene._gantt.gridHeight;
             this.group.setAttribute('width', this.width);
             this.group.setAttribute('height', this.height);
+            this.locateIconsGroup?.setAttributes({
+                width: this.width,
+                height: this.height
+            });
+            this.updateOffscreenIndicators();
         }
         showHoverBar(x, y, width, height, target) {
             const { startDate, endDate, taskRecord } = this._scene._gantt.getTaskInfoByTaskListIndex(target.task_index, target.sub_task_index);
@@ -73536,6 +74223,18 @@
                 event.touchSetTimeout = undefined;
             }
             if (stateManager.interactionState === InteractionState$1.default) {
+                let locateIconTarget = null;
+                if (gantt.parsedOptions.taskBarLocateIcon) {
+                    locateIconTarget = e.detailPath.find((pathNode) => {
+                        return pathNode.name === 'task-bar-locate-icon-left' || pathNode.name === 'task-bar-locate-icon-right';
+                    });
+                    if (locateIconTarget) {
+                        scene._gantt.scenegraph.taskBar.setLocateIconHover(locateIconTarget);
+                    }
+                    else if (scene._gantt.scenegraph.taskBar.currentHoverLocateIcon) {
+                        scene._gantt.scenegraph.taskBar.setLocateIconHover(null);
+                    }
+                }
                 const taskBarTarget = e.detailPath.find((pathNode) => {
                     return pathNode.name === 'task-bar';
                 });
@@ -73580,7 +74279,7 @@
                         }
                     }
                 }
-                else {
+                else if (!locateIconTarget) {
                     if (scene._gantt.stateManager.hoverTaskBar.target) {
                         if (scene._gantt.hasListeners(GANTT_EVENT_TYPE.MOUSELEAVE_TASK_BAR)) {
                             const taskIndex = scene._gantt.stateManager.hoverTaskBar.target.task_index;
@@ -73720,8 +74419,10 @@
                 let depedencyLink;
                 let isClickMarklineIcon = false;
                 let isClickMarklineContent = false;
+                let isClickLocateIcon = false;
                 let markLineContentTarget;
                 let markLineIconTarget;
+                let locateIconTarget;
                 const taskBarTarget = e.detailPath.find((pathNode) => {
                     if (pathNode.name === 'task-bar') {
                         isClickBar = true;
@@ -73754,9 +74455,27 @@
                         markLineContentTarget = pathNode;
                         return false;
                     }
+                    else if (gantt.parsedOptions.taskBarLocateIcon &&
+                        (pathNode.name === 'task-bar-locate-icon-left' || pathNode.name === 'task-bar-locate-icon-right')) {
+                        isClickLocateIcon = true;
+                        locateIconTarget = pathNode;
+                        return false;
+                    }
                     return false;
                 });
-                if (isClickBar && scene._gantt.parsedOptions.taskBarSelectable && event.poniterState === 'down') {
+                if (isClickLocateIcon && event.poniterState === 'down') {
+                    const barNode = locateIconTarget?.attachedToTaskBarNode;
+                    const side = locateIconTarget?.side;
+                    if (barNode) {
+                        const barLeft = barNode.attribute.x;
+                        const barRight = barLeft + barNode.attribute.width;
+                        const viewWidth = gantt.tableNoFrameWidth;
+                        const padding = 12;
+                        const targetLeft = side === 'left' ? barLeft - padding : barRight - viewWidth + padding;
+                        gantt.stateManager.setScrollLeft(targetLeft);
+                    }
+                }
+                else if (isClickBar && scene._gantt.parsedOptions.taskBarSelectable && event.poniterState === 'down') {
                     stateManager.hideDependencyLinkSelectedLine();
                     const taskBarNode = taskBarTarget;
                     stateManager.showTaskBarSelectedBorder(taskBarNode);
@@ -73946,6 +74665,9 @@
             }
         });
         scene.ganttGroup.addEventListener('pointerleave', (e) => {
+            if (scene._gantt.scenegraph.taskBar.currentHoverLocateIcon) {
+                scene._gantt.scenegraph.taskBar.setLocateIconHover(null);
+            }
             if ((gantt.parsedOptions.scrollStyle.horizontalVisible &&
                 gantt.parsedOptions.scrollStyle.horizontalVisible === 'focus') ||
                 (!gantt.parsedOptions.scrollStyle.horizontalVisible && gantt.parsedOptions.scrollStyle.visible === 'focus')) {
@@ -77647,7 +78369,7 @@
         PluginManager: PluginManager
     });
 
-    const version = "1.24.0";
+    const version = "1.25.0";
 
     exports.Gantt = Gantt;
     exports.TYPES = index$4;