@visactor/vtable-sheet 1.24.0 → 1.25.1-alpha.0

package/dist/vtable-sheet.js

@@ -43643,12 +43643,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)),
@@ -44299,6 +44301,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;
@@ -47264,9 +47292,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);
@@ -47459,7 +47490,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;
@@ -47489,7 +47520,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,
@@ -47505,9 +47562,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,
@@ -47519,18 +47578,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,
@@ -47542,11 +47606,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),
@@ -47570,7 +47688,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();
@@ -47694,9 +47812,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
@@ -47707,9 +47825,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
@@ -47745,13 +47863,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,
@@ -47775,6 +47903,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,
@@ -47804,6 +47954,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,
@@ -49917,29 +50081,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$4([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;
@@ -51664,10 +51849,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);
         });
       }
@@ -51769,6 +51955,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) {
@@ -51778,7 +51965,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$2(screenLeftX) && isValid$2(screenLeftCol)) {
@@ -51857,7 +52044,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),
@@ -51890,10 +52077,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
@@ -51903,16 +52093,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,
@@ -51920,72 +52110,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
       }));
@@ -52135,7 +52268,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),
@@ -52147,30 +52280,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
@@ -52178,7 +52314,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;
@@ -53059,7 +53195,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({
@@ -53574,10 +53728,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,
@@ -53625,12 +53779,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();
@@ -53986,16 +54190,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;
@@ -54117,13 +54321,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;
@@ -54148,7 +54362,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;
@@ -55627,29 +55916,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) {
@@ -55670,7 +55962,7 @@
       constructor(table) {
         this.fastScrolling = !1, this.checkedState = new Map(), this.headerCheckedState = {}, this._checkboxCellTypeFields = [], this._headerCheckFuncs = {}, this.radioState = {}, this.resetInteractionState = debounce(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();
@@ -55787,7 +56079,9 @@
           row: -1
         }, this.scroll = {
           horizontalBarPos: 0,
-          verticalBarPos: 0
+          verticalBarPos: 0,
+          frozenHorizontalBarPos: 0,
+          rightFrozenHorizontalBarPos: 0
         }, this.tablePosition = {
           absoluteX: 0,
           absoluteY: 0
@@ -56019,13 +56313,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$2(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$2(left) && !isNaN(left) || (left = 0), this.setRightFrozenColsScrollLeft(left, !0);
+      }
       clearFrozenObserver() {
         this._frozenObserver && (this._frozenObserver.disconnect(), this._frozenObserver = null);
       }
@@ -56098,32 +56421,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$2(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",
@@ -56175,15 +56501,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$2(horizontalBarPos) && !isNaN(horizontalBarPos) || (horizontalBarPos = 0);
           const dx = horizontalBarPos - oldHorizontalBarPos;
@@ -56191,15 +56520,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);
           }
         }
@@ -56209,8 +56538,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",
@@ -56222,7 +56551,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));
@@ -56230,9 +56559,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));
@@ -56603,7 +56932,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
@@ -56614,8 +56943,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;
@@ -56628,13 +56988,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;
@@ -56646,12 +57012,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 {
@@ -56730,16 +57101,17 @@
 
     function bindTableGroupListener(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,
@@ -56793,14 +57165,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);
@@ -56829,7 +57206,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 => {
@@ -56859,7 +57242,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);
@@ -56896,7 +57279,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,
@@ -56915,7 +57298,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,
@@ -56931,7 +57314,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,
@@ -56959,7 +57342,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,
@@ -56974,7 +57357,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 {
@@ -57021,9 +57404,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);
@@ -57032,7 +57415,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;
@@ -57064,11 +57447,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
@@ -57103,7 +57486,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,
@@ -57154,7 +57537,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,
@@ -57216,7 +57599,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);
@@ -57246,17 +57629,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 => {
@@ -57279,10 +57674,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 = {
@@ -57291,15 +57698,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);
@@ -57310,6 +57747,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);
       });
     }
 
@@ -57544,18 +57991,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$2(targetCol) && isValid$2(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$2(targetCol) && isValid$2(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;
         }
@@ -60181,18 +60630,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) {
@@ -60230,16 +60685,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 {
@@ -60273,11 +60732,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
@@ -60662,7 +61126,17 @@
       }
       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$1.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.1-alpha.0", this.id = `VTable${Date.now()}`, this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = throttle2(this.render.bind(this), 200), "undefined" != typeof window) {
+          const g = window;
+          g[this.id] = this;
+          const registry = g.__vtable__ || (g.__vtable__ = {
+            byId: Object.create(null),
+            list: [],
+            last: null
+          });
+          registry.byId[this.id] = this, registry.list.push(this), registry.last = this, g.__vtable_last_id__ = this.id;
+        }
+        if ("node" === Env$1.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(this, options), this.fireListeners(TABLE_EVENT_TYPE.BEFORE_INIT, {
           options: options,
           container: container
@@ -60739,7 +61213,7 @@
           bottom: 0
         }, padding && ("number" == typeof padding ? (this.padding.top = padding, this.padding.left = padding, this.padding.bottom = padding, this.padding.right = padding) : (padding.top && (this.padding.top = padding.top), padding.bottom && (this.padding.bottom = padding.bottom), padding.left && (this.padding.left = padding.left), padding.right && (this.padding.right = padding.right))), (isValid$2(canvasHeight) || isValid$2(canvasWidth)) && (this.canvasSizeSeted = !0), this.tableNoFrameWidth = 0, this.tableNoFrameHeight = 0, this.contentOffsetX = null != translateX ? translateX : 0, this.contentOffsetY = null != translateY ? translateY : 0, this.canvasWidth = isNumber$2(canvasWidth) ? canvasWidth : void 0, this.canvasHeight = isNumber$2(canvasHeight) ? canvasHeight : void 0, this.columnWidthComputeMode = null !== (_d = options.columnWidthComputeMode) && void 0 !== _d ? _d : "normal";
         const internalProps = this.internalProps = {};
-        void 0 !== showFrozenIcon && (this.showFrozenIcon = showFrozenIcon), "number" == typeof allowFrozenColCount && allowFrozenColCount <= 0 && (this.showFrozenIcon = !1), this.options.canvas ? ("node" !== Env$1.mode && (internalProps.element = this.options.canvas.parentElement, internalProps.element.style.position = "relative"), internalProps.focusControl = new FocusInput(this, internalProps.element), internalProps.canvas = this.options.canvas, internalProps.context = internalProps.canvas.getContext("2d")) : "node" !== Env$1.mode && (internalProps.element = createRootElement(this.padding), internalProps.focusControl = new FocusInput(this, internalProps.element), internalProps.canvas = document.createElement("canvas"), internalProps.element.appendChild(internalProps.canvas), internalProps.context = internalProps.canvas.getContext("2d"), (null === (_e = options.customConfig) || void 0 === _e ? void 0 : _e.createReactContainer) && createReactContainer(this)), internalProps.handler = new EventHandler(), isNumber$2(this.options.resizeTime) && (internalProps.handler.resizeTime = this.options.resizeTime), internalProps.pixelRatio = pixelRatio, internalProps.frozenColCount = frozenColCount, internalProps.frozenRowCount = frozenRowCount, internalProps.unfreezeAllOnExceedsMaxWidth = null == unfreezeAllOnExceedsMaxWidth || unfreezeAllOnExceedsMaxWidth, internalProps.defaultRowHeight = defaultRowHeight, internalProps.defaultHeaderRowHeight = null != defaultHeaderRowHeight ? defaultHeaderRowHeight : defaultRowHeight, internalProps.defaultColWidth = defaultColWidth, internalProps.defaultHeaderColWidth = null != defaultHeaderColWidth ? defaultHeaderColWidth : defaultColWidth, internalProps.keyboardOptions = keyboardOptions, internalProps.eventOptions = eventOptions, internalProps.rowSeriesNumber = rowSeriesNumber, internalProps.enableCheckboxCascade = null === (_f = null != enableCheckboxCascade ? enableCheckboxCascade : null == rowSeriesNumber ? void 0 : rowSeriesNumber.enableTreeCheckbox) || void 0 === _f || _f, internalProps.enableHeaderCheckboxCascade = enableCheckboxCascade || null == enableHeaderCheckboxCascade || enableHeaderCheckboxCascade, internalProps.columnResizeMode = null !== (_g = null == resize ? void 0 : resize.columnResizeMode) && void 0 !== _g ? _g : columnResizeMode, internalProps.canResizeColumn = null == resize ? void 0 : resize.canResizeColumn, internalProps.rowResizeMode = null !== (_h = null == resize ? void 0 : resize.rowResizeMode) && void 0 !== _h ? _h : rowResizeMode, internalProps.dragHeaderMode = null !== (_k = null !== (_j = null == dragOrder ? void 0 : dragOrder.dragHeaderMode) && void 0 !== _j ? _j : dragHeaderMode) && void 0 !== _k ? _k : "none", internalProps.renderChartAsync = renderChartAsync, setBatchRenderChartCount(renderChartAsyncBatchCount), internalProps.overscrollBehavior = null != overscrollBehavior ? overscrollBehavior : "auto", internalProps.groupBy = null !== (_l = null == groupConfig ? void 0 : groupConfig.groupBy) && void 0 !== _l ? _l : groupBy, internalProps.groupTitleCheckbox = null !== (_m = null == groupConfig ? void 0 : groupConfig.titleCheckbox) && void 0 !== _m ? _m : !!(null == rowSeriesNumber ? void 0 : rowSeriesNumber.enableTreeCheckbox), internalProps.groupTitleFieldFormat = null !== (_o = null == groupConfig ? void 0 : groupConfig.titleFieldFormat) && void 0 !== _o ? _o : groupTitleFieldFormat, internalProps.groupTitleCustomLayout = null !== (_p = null == groupConfig ? void 0 : groupConfig.titleCustomLayout) && void 0 !== _p ? _p : groupTitleCustomLayout, internalProps.enableTreeStickCell = null !== (_q = null == groupConfig ? void 0 : groupConfig.enableTreeStickCell) && void 0 !== _q ? _q : enableTreeStickCell, internalProps._rowHeightsMap = new NumberRangeMap(this), internalProps._rowRangeHeightsMap = new Map(), internalProps._colRangeWidthsMap = new Map(), internalProps._widthResizedColMap = new Set(), internalProps._heightResizedRowMap = new Set(), this.colWidthsMap = new NumberMap(), this.colContentWidthsMap = new NumberMap(), this.colWidthsLimit = {};
+        void 0 !== showFrozenIcon && (this.showFrozenIcon = showFrozenIcon), "number" == typeof allowFrozenColCount && allowFrozenColCount <= 0 && (this.showFrozenIcon = !1), this.options.canvas ? ("node" !== Env$1.mode && (internalProps.element = this.options.canvas.parentElement, internalProps.element.style.position = "relative"), internalProps.focusControl = new FocusInput(this, internalProps.element), internalProps.canvas = this.options.canvas, internalProps.context = internalProps.canvas.getContext("2d"), internalProps.canvas.__vtable__ = this, internalProps.canvas.__vtable_id__ = this.id, internalProps.element && (internalProps.element.__vtable__ = this, internalProps.element.__vtable_id__ = this.id)) : "node" !== Env$1.mode && (internalProps.element = createRootElement(this.padding), internalProps.focusControl = new FocusInput(this, internalProps.element), internalProps.canvas = document.createElement("canvas"), internalProps.element.appendChild(internalProps.canvas), internalProps.context = internalProps.canvas.getContext("2d"), internalProps.canvas.__vtable__ = this, internalProps.canvas.__vtable_id__ = this.id, internalProps.element.__vtable__ = this, internalProps.element.__vtable_id__ = this.id, (null === (_e = options.customConfig) || void 0 === _e ? void 0 : _e.createReactContainer) && createReactContainer(this)), internalProps.handler = new EventHandler(), isNumber$2(this.options.resizeTime) && (internalProps.handler.resizeTime = this.options.resizeTime), internalProps.pixelRatio = pixelRatio, internalProps.frozenColCount = frozenColCount, internalProps.frozenRowCount = frozenRowCount, internalProps.unfreezeAllOnExceedsMaxWidth = null == unfreezeAllOnExceedsMaxWidth || unfreezeAllOnExceedsMaxWidth, internalProps.defaultRowHeight = defaultRowHeight, internalProps.defaultHeaderRowHeight = null != defaultHeaderRowHeight ? defaultHeaderRowHeight : defaultRowHeight, internalProps.defaultColWidth = defaultColWidth, internalProps.defaultHeaderColWidth = null != defaultHeaderColWidth ? defaultHeaderColWidth : defaultColWidth, internalProps.keyboardOptions = keyboardOptions, internalProps.eventOptions = eventOptions, internalProps.rowSeriesNumber = rowSeriesNumber, internalProps.enableCheckboxCascade = null === (_f = null != enableCheckboxCascade ? enableCheckboxCascade : null == rowSeriesNumber ? void 0 : rowSeriesNumber.enableTreeCheckbox) || void 0 === _f || _f, internalProps.enableHeaderCheckboxCascade = enableCheckboxCascade || null == enableHeaderCheckboxCascade || enableHeaderCheckboxCascade, internalProps.columnResizeMode = null !== (_g = null == resize ? void 0 : resize.columnResizeMode) && void 0 !== _g ? _g : columnResizeMode, internalProps.canResizeColumn = null == resize ? void 0 : resize.canResizeColumn, internalProps.rowResizeMode = null !== (_h = null == resize ? void 0 : resize.rowResizeMode) && void 0 !== _h ? _h : rowResizeMode, internalProps.dragHeaderMode = null !== (_k = null !== (_j = null == dragOrder ? void 0 : dragOrder.dragHeaderMode) && void 0 !== _j ? _j : dragHeaderMode) && void 0 !== _k ? _k : "none", internalProps.renderChartAsync = renderChartAsync, setBatchRenderChartCount(renderChartAsyncBatchCount), internalProps.overscrollBehavior = null != overscrollBehavior ? overscrollBehavior : "auto", internalProps.groupBy = null !== (_l = null == groupConfig ? void 0 : groupConfig.groupBy) && void 0 !== _l ? _l : groupBy, internalProps.groupTitleCheckbox = null !== (_m = null == groupConfig ? void 0 : groupConfig.titleCheckbox) && void 0 !== _m ? _m : !!(null == rowSeriesNumber ? void 0 : rowSeriesNumber.enableTreeCheckbox), internalProps.groupTitleFieldFormat = null !== (_o = null == groupConfig ? void 0 : groupConfig.titleFieldFormat) && void 0 !== _o ? _o : groupTitleFieldFormat, internalProps.groupTitleCustomLayout = null !== (_p = null == groupConfig ? void 0 : groupConfig.titleCustomLayout) && void 0 !== _p ? _p : groupTitleCustomLayout, internalProps.enableTreeStickCell = null !== (_q = null == groupConfig ? void 0 : groupConfig.enableTreeStickCell) && void 0 !== _q ? _q : enableTreeStickCell, internalProps._rowHeightsMap = new NumberRangeMap(this), internalProps._rowRangeHeightsMap = new Map(), internalProps._colRangeWidthsMap = new Map(), internalProps._widthResizedColMap = new Set(), internalProps._heightResizedRowMap = new Set(), this.colWidthsMap = new NumberMap(), this.colContentWidthsMap = new NumberMap(), this.colWidthsLimit = {};
         const that = this;
         if (internalProps.calcWidthContext = {
           _: internalProps,
@@ -60863,7 +61337,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;
         }
@@ -60872,7 +61346,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;
         }
@@ -61026,6 +61500,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;
@@ -61344,21 +61823,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;
@@ -61468,7 +61952,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 {
@@ -61497,7 +61981,8 @@
             scrollLeft: scrollLeft
           } = this,
           frozenRowsHeight = this.getFrozenRowsHeight(),
-          frozenColsWidth = this.getFrozenColsWidth(),
+          frozenColsContentWidth = this.getFrozenColsContentWidth(),
+          frozenColsOffset = this.getFrozenColsOffset(),
           bottomFrozenRowsHeight = this.getBottomFrozenRowsHeight(),
           rightFrozenColsWidth = this.getRightFrozenColsWidth(),
           {
@@ -61505,9 +61990,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,
@@ -61534,12 +62019,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
@@ -61550,7 +62036,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);
@@ -61604,18 +62090,30 @@
         this._scrollToRowCorrectTimer && (clearTimeout(this._scrollToRowCorrectTimer), this._scrollToRowCorrectTimer = null);
       }
       release() {
-        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, _0, _1;
-        null === (_c = null === (_b = null === (_a = this.scenegraph) || void 0 === _a ? void 0 : _a.component) || void 0 === _b ? void 0 : _b.vScrollBar) || void 0 === _c || _c.release(), null === (_f = null === (_e = null === (_d = this.scenegraph) || void 0 === _d ? void 0 : _d.component) || void 0 === _e ? void 0 : _e.hScrollBar) || void 0 === _f || _f.release(), this.animationManager.clear(), this.animationManager.ticker.release(), null === (_j = null === (_h = null === (_g = this.scenegraph) || void 0 === _g ? void 0 : _g.stage) || void 0 === _h ? void 0 : _h.ticker) || void 0 === _j || _j.release();
-        const internalProps = this.internalProps;
+        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, _0, _1, _2, _3, _4;
+        if ("undefined" != typeof window) {
+          const g = window;
+          (null == g ? void 0 : g[this.id]) === this ? delete g[this.id] : (null == g ? void 0 : g[this.id]) && (g[this.id] = null);
+          const registry = null == g ? void 0 : g.__vtable__;
+          (null === (_a = null == registry ? void 0 : registry.byId) || void 0 === _a ? void 0 : _a[this.id]) === this && delete registry.byId[this.id];
+          const list = null == registry ? void 0 : registry.list;
+          if (Array.isArray(list) && list.length) for (let i = list.length - 1; i >= 0; i--) list[i] === this && list.splice(i, 1);
+          (null == registry ? void 0 : registry.last) === this && (registry.last = Array.isArray(list) && list.length ? list[list.length - 1] : null), (null == g ? void 0 : g.__vtable_last_id__) === this.id && (g.__vtable_last_id__ = null !== (_c = null === (_b = null == registry ? void 0 : registry.last) || void 0 === _b ? void 0 : _b.id) && void 0 !== _c ? _c : null);
+        }
         if (this.isReleased) return;
-        this.clearCorrectTimer(), null === (_l = null === (_k = internalProps.tooltipHandler) || void 0 === _k ? void 0 : _k.release) || void 0 === _l || _l.call(_k), null === (_o = null === (_m = internalProps.menuHandler) || void 0 === _m ? void 0 : _m.release) || void 0 === _o || _o.call(_m), null === (_p = super.release) || void 0 === _p || _p.call(this), this.pluginManager.release(), null === (_r = null === (_q = internalProps.handler) || void 0 === _q ? void 0 : _q.release) || void 0 === _r || _r.call(_q), this.eventManager.release(), null === (_t = null === (_s = internalProps.focusControl) || void 0 === _s ? void 0 : _s.release) || void 0 === _t || _t.call(_s), null === (_u = internalProps.legends) || void 0 === _u || _u.forEach(legend => {
+        null === (_f = null === (_e = null === (_d = this.scenegraph) || void 0 === _d ? void 0 : _d.component) || void 0 === _e ? void 0 : _e.vScrollBar) || void 0 === _f || _f.release(), null === (_j = null === (_h = null === (_g = this.scenegraph) || void 0 === _g ? void 0 : _g.component) || void 0 === _h ? void 0 : _h.hScrollBar) || void 0 === _j || _j.release(), this.animationManager.clear(), this.animationManager.ticker.release(), null === (_m = null === (_l = null === (_k = this.scenegraph) || void 0 === _k ? void 0 : _k.stage) || void 0 === _l ? void 0 : _l.ticker) || void 0 === _m || _m.release();
+        const internalProps = this.internalProps,
+          canvas = null == internalProps ? void 0 : internalProps.canvas;
+        (null == canvas ? void 0 : canvas.__vtable__) === this && (delete canvas.__vtable__, delete canvas.__vtable_id__);
+        const element = null == internalProps ? void 0 : internalProps.element;
+        (null == element ? void 0 : element.__vtable__) === this && (delete element.__vtable__, delete element.__vtable_id__), this.clearCorrectTimer(), null === (_p = null === (_o = internalProps.tooltipHandler) || void 0 === _o ? void 0 : _o.release) || void 0 === _p || _p.call(_o), null === (_r = null === (_q = internalProps.menuHandler) || void 0 === _q ? void 0 : _q.release) || void 0 === _r || _r.call(_q), null === (_s = super.release) || void 0 === _s || _s.call(this), this.pluginManager.release(), null === (_u = null === (_t = internalProps.handler) || void 0 === _t ? void 0 : _t.release) || void 0 === _u || _u.call(_t), this.eventManager.release(), null === (_w = null === (_v = internalProps.focusControl) || void 0 === _v ? void 0 : _v.release) || void 0 === _w || _w.call(_v), null === (_x = internalProps.legends) || void 0 === _x || _x.forEach(legend => {
           null == legend || legend.release();
-        }), null === (_v = internalProps.title) || void 0 === _v || _v.release(), internalProps.title = null, null === (_w = internalProps.emptyTip) || void 0 === _w || _w.release(), internalProps.emptyTip = null, internalProps.layoutMap.release(), internalProps.releaseList && (internalProps.releaseList.forEach(releaseObj => {
+        }), null === (_y = internalProps.title) || void 0 === _y || _y.release(), internalProps.title = null, null === (_z = internalProps.emptyTip) || void 0 === _z || _z.release(), internalProps.emptyTip = null, internalProps.layoutMap.release(), internalProps.releaseList && (internalProps.releaseList.forEach(releaseObj => {
           var _a;
           return null === (_a = null == releaseObj ? void 0 : releaseObj.release) || void 0 === _a ? void 0 : _a.call(releaseObj);
         }), internalProps.releaseList = null), this.scenegraph.stage.release(), this.scenegraph.proxy.release();
-        const parentElement = null === (_x = internalProps.element) || void 0 === _x ? void 0 : _x.parentElement;
-        parentElement && !this.options.canvas && parentElement.removeChild(internalProps.element), null === (_0 = null === (_z = null === (_y = this.editorManager) || void 0 === _y ? void 0 : _y.editingEditor) || void 0 === _z ? void 0 : _z.onEnd) || void 0 === _0 || _0.call(_z), this.isReleased = !0, this.scenegraph = null, this.internalProps = null, null === (_1 = this.reactCustomLayout) || void 0 === _1 || _1.clearCache(), clearChartRenderQueue();
+        const parentElement = null === (_0 = internalProps.element) || void 0 === _0 ? void 0 : _0.parentElement;
+        parentElement && !this.options.canvas && parentElement.removeChild(internalProps.element), null === (_3 = null === (_2 = null === (_1 = this.editorManager) || void 0 === _1 ? void 0 : _1.editingEditor) || void 0 === _2 ? void 0 : _2.onEnd) || void 0 === _3 || _3.call(_2), this.isReleased = !0, this.scenegraph = null, this.internalProps = null, null === (_4 = this.reactCustomLayout) || void 0 === _4 || _4.clearCache(), clearChartRenderQueue();
       }
       fireListeners(type, event) {
         return super.fireListeners(type, event);
@@ -61735,8 +62233,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;
@@ -61746,6 +62259,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);
@@ -61753,6 +62272,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()),
@@ -95188,7 +95716,7 @@
         importStyle();
     }
 
-    const version = "1.24.0";
+    const version = "1.25.1-alpha.0";
     importStyles();
 
     exports.TYPES = index;