@visactor/vtable 1.6.3-alpha.3 → 1.6.3

package/dist/vtable.js

@@ -29244,6 +29244,12 @@
                     },
                     get barToSide() {
                         return scroll.barToSide ?? false;
+                    },
+                    get horizontalPadding() {
+                        return scroll.horizontalPadding ?? 0;
+                    },
+                    get verticalPadding() {
+                        return scroll.verticalPadding ?? 0;
                     }
                 };
             }
@@ -29310,6 +29316,9 @@
                     },
                     get labelBackgroundCornerRadius() {
                         return columnResize.labelBackgroundCornerRadius ?? 5;
+                    },
+                    get labelVisible() {
+                        return columnResize.labelVisible ?? true;
                     }
                 };
             }
@@ -34978,7 +34987,7 @@
             const createTextCellGroup = Factory.getFunction('createTextCellGroup');
             cellGroup = createTextCellGroup(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, false, null, true, cellTheme, range, isAsync);
             const createProgressBarCell = Factory.getFunction('createProgressBarCell');
-            const progressBarGroup = createProgressBarCell(define, style, colWidth, value, dataValue, col, row, padding, table);
+            const progressBarGroup = createProgressBarCell(define, style, colWidth, value, dataValue, col, row, padding, table, range);
             if (cellGroup.firstChild) {
                 cellGroup.insertBefore(progressBarGroup, cellGroup.firstChild);
             }
@@ -35002,8 +35011,6 @@
     }
     function updateCell$1(col, row, table, addNew, isShadow) {
         const oldCellGroup = table.scenegraph.highPerformanceGetCell(col, row, true);
-        const cellStyle = table._getCellStyle(col, row);
-        const autoWrapText = cellStyle.autoWrapText ?? table.internalProps.autoWrapText;
         const cellLocation = table.getCellLocation(col, row);
         let value = table.getCellValue(col, row);
         let isMerge;
@@ -35057,13 +35064,15 @@
                 value = vtableMergeName;
             }
         }
+        const cellStyle = table._getCellStyle(range ? range.start.col : col, range ? range.start.row : row);
+        const autoWrapText = cellStyle.autoWrapText ?? table.internalProps.autoWrapText;
         if (!cellTheme) {
             cellTheme = getStyleTheme(cellStyle, table, isMerge ? range.start.col : col, isMerge ? range.start.row : row, getProp).theme;
         }
         cellTheme.group.cornerRadius = getCellCornerRadius(col, row, table);
         if (!addNew &&
             !isMerge &&
-            !(define.customLayout || define.customRender || define.headerCustomLayout || define.headerCustomRender) &&
+            !(define?.customLayout || define?.customRender || define?.headerCustomLayout || define?.headerCustomRender) &&
             canUseFastUpdate(col, row, oldCellGroup, autoWrapText, mayHaveIcon, table)) {
             const cellWidth = table.getColWidth(col);
             const cellHeight = table.getRowHeight(row);
@@ -36315,13 +36324,18 @@
             const value = scene.table.getCellValue(col, row);
             const dataValue = scene.table.getCellOriginValue(col, row);
             const padding = getQuadProps(getProp('padding', style, col, row, scene.table));
+            let range;
+            if (columnDefine?.mergeCell) {
+                range = scene.table.getCellRange(col, row);
+            }
             const createProgressBarCell = Factory.getFunction('createProgressBarCell');
-            const newBarCell = createProgressBarCell(columnDefine, style, cell.attribute.width, value, dataValue, col, row, padding, scene.table);
+            const newBarCell = createProgressBarCell(columnDefine, style, cell.attribute.width, value, dataValue, col, row, padding, scene.table, range);
             const oldBarCell = cell.getChildByName('progress-bar');
             cell.insertBefore(newBarCell, oldBarCell);
             cell.removeChild(oldBarCell);
             oldBarCell.removeAllChild();
             oldBarCell.release();
+            updateMergeCellContentHeight(cell, distHeight, detaY, scene.table.isAutoRowHeight(row), true, scene.table);
         }
         else if (type === 'sparkline') {
             cell.removeAllChild();
@@ -36434,7 +36448,7 @@
                         });
                     });
                     if (renderDefault) {
-                        const style = table._getCellStyle(col, row);
+                        const style = table._getCellStyle(colStart, rowStart);
                         updateCellContentHeight(singleCellGroup, distHeight, detaY, autoRowHeight, getQuadProps(style.padding), style.textAlign, style.textBaseline);
                     }
                     const rangeHeight = table.getRowHeight(row);
@@ -36649,13 +36663,19 @@
             const value = scene.table.getCellValue(col, row);
             const dataValue = scene.table.getCellOriginValue(col, row);
             const padding = getQuadProps(getProp('padding', style, col, row, scene.table));
+            let range;
+            if (columnDefine?.mergeCell) {
+                range = scene.table.getCellRange(col, row);
+            }
             const createProgressBarCell = Factory.getFunction('createProgressBarCell');
-            const newBarCell = createProgressBarCell(columnDefine, style, cellGroup.attribute.width, value, dataValue, col, row, padding, scene.table);
+            const newBarCell = createProgressBarCell(columnDefine, style, cellGroup.attribute.width, value, dataValue, col, row, padding, scene.table, range);
             const oldBarCell = cellGroup.getChildByName('progress-bar');
             cellGroup.insertBefore(newBarCell, oldBarCell);
             cellGroup.removeChild(oldBarCell);
             oldBarCell.removeAllChild();
             oldBarCell.release();
+            const cellChange = updateMergeCellContentWidth(cellGroup, distWidth, detaX, autoRowHeight, true, scene.table);
+            isHeightChange = isHeightChange || cellChange;
         }
         else if (type === 'sparkline') {
             cellGroup.removeAllChild();
@@ -36796,7 +36816,7 @@
                     });
                     let changed = false;
                     if (renderDefault) {
-                        const style = table._getCellStyle(col, row);
+                        const style = table._getCellStyle(colStart, rowStart);
                         const padding = getQuadProps(style.padding);
                         const textAlign = style.textAlign;
                         const textBaseline = style.textBaseline;
@@ -37364,6 +37384,7 @@
         rightFrozenShadowLine;
         drillIcon;
         cellMover;
+        labelVisible;
         constructor(table) {
             this.table = table;
             const theme = this.table.theme;
@@ -37372,11 +37393,13 @@
             const columnResizeWidth = theme.columnResize?.lineWidth;
             const columnResizeBgColor = theme.columnResize?.bgColor;
             const columnResizeBgWidth = theme.columnResize?.width;
+            const labelVisible = theme.columnResize?.labelVisible ?? true;
             const labelColor = theme.columnResize?.labelColor;
             const labelFontSize = theme.columnResize?.labelFontSize;
             const labelFontFamily = theme.columnResize?.labelFontFamily;
             const labelBackgroundFill = theme.columnResize?.labelBackgroundFill;
             const labelBackgroundCornerRadius = theme.columnResize?.labelBackgroundCornerRadius;
+            this.labelVisible = labelVisible;
             this.columnResizeLine = createLine({
                 visible: false,
                 pickable: false,
@@ -37564,6 +37587,8 @@
             const scrollSliderColor = theme.scrollStyle?.scrollSliderColor;
             const scrollSliderCornerRadius = theme.scrollStyle?.scrollSliderCornerRadius;
             const width = theme.scrollStyle?.width;
+            const horizontalPadding = theme.scrollStyle?.horizontalPadding;
+            const verticalPadding = theme.scrollStyle?.verticalPadding;
             let sliderStyle;
             if (isValid$3(scrollSliderCornerRadius)) {
                 sliderStyle = {
@@ -37582,7 +37607,7 @@
                 y: -this.table.tableNoFrameHeight * 2,
                 width: this.table.tableNoFrameWidth,
                 height: width,
-                padding: 0,
+                padding: horizontalPadding,
                 railStyle: {
                     fill: scrollRailColor
                 },
@@ -37598,7 +37623,7 @@
                 y: -this.table.tableNoFrameHeight * 2,
                 width,
                 height: this.table.tableNoFrameHeight - this.table.getFrozenRowsHeight(),
-                padding: 0,
+                padding: verticalPadding,
                 railStyle: {
                     fill: scrollRailColor
                 },
@@ -37727,13 +37752,15 @@
                     { x: 0, y: this.table.getRowsHeight(0, this.table.rowCount - 1) }
                 ]
             });
-            this.columnResizeLabel.showAll();
-            this.columnResizeLabel.setAttributes({
-                visible: true,
-                x: colX,
-                y
-            });
-            this.columnResizeLabel.lastChild.setAttribute('text', `${this.table.getColWidth(col)}px`);
+            if (this.labelVisible) {
+                this.columnResizeLabel.showAll();
+                this.columnResizeLabel.setAttributes({
+                    visible: true,
+                    x: colX,
+                    y
+                });
+                this.columnResizeLabel.lastChild.setAttribute('text', `${this.table.getColWidth(col)}px`);
+            }
         }
         updateResizeCol(col, y, isRightFrozen) {
             const colX = getColX(col, this.table, isRightFrozen);
@@ -37751,11 +37778,13 @@
                     { x: 0, y: this.table.getRowsHeight(0, this.table.rowCount - 1) }
                 ]
             });
-            this.columnResizeLabel.setAttributes({
-                x: colX,
-                y
-            });
-            this.columnResizeLabel.lastChild.setAttribute('text', `${Math.floor(this.table.getColWidth(col))}px`);
+            if (this.labelVisible) {
+                this.columnResizeLabel.setAttributes({
+                    x: colX,
+                    y
+                });
+                this.columnResizeLabel.lastChild.setAttribute('text', `${Math.floor(this.table.getColWidth(col))}px`);
+            }
         }
         hideResizeRow() {
             this.rowResizeLine.setAttribute('visible', false);
@@ -37781,13 +37810,15 @@
                     { y: 0, x: this.table.getColsWidth(0, this.table.colCount - 1) }
                 ]
             });
-            this.rowResizeLabel.showAll();
-            this.rowResizeLabel.setAttributes({
-                visible: true,
-                y: rowY,
-                x
-            });
-            this.rowResizeLabel.lastChild.setAttribute('text', `${this.table.getRowHeight(row)}px`);
+            if (this.labelVisible) {
+                this.rowResizeLabel.showAll();
+                this.rowResizeLabel.setAttributes({
+                    visible: true,
+                    y: rowY,
+                    x
+                });
+                this.rowResizeLabel.lastChild.setAttribute('text', `${this.table.getRowHeight(row)}px`);
+            }
         }
         updateResizeRow(row, x, isBottomFrozen) {
             const rowY = getRowY(row, this.table, isBottomFrozen);
@@ -37805,11 +37836,13 @@
                     { y: 0, x: this.table.getColsWidth(0, this.table.colCount - 1) }
                 ]
             });
-            this.rowResizeLabel.setAttributes({
-                y: rowY,
-                x
-            });
-            this.rowResizeLabel.lastChild.setAttribute('text', `${Math.floor(this.table.getRowHeight(row))}px`);
+            if (this.labelVisible) {
+                this.rowResizeLabel.setAttributes({
+                    y: rowY,
+                    x
+                });
+                this.rowResizeLabel.lastChild.setAttribute('text', `${Math.floor(this.table.getRowHeight(row))}px`);
+            }
         }
         hideMoveCol() {
             this.cellMover.hide();
@@ -37914,6 +37947,8 @@
             const scrollSliderColor = theme.scrollStyle?.scrollSliderColor;
             const scrollSliderCornerRadius = theme.scrollStyle?.scrollSliderCornerRadius;
             const width = theme.scrollStyle?.width;
+            const horizontalPadding = theme.scrollStyle?.horizontalPadding;
+            const verticalPadding = theme.scrollStyle?.verticalPadding;
             let sliderStyle;
             if (isValid$3(scrollSliderCornerRadius)) {
                 sliderStyle = {
@@ -37928,6 +37963,7 @@
             }
             this.hScrollBar.setAttributes({
                 height: width,
+                padding: horizontalPadding,
                 railStyle: {
                     fill: scrollRailColor
                 },
@@ -37935,6 +37971,7 @@
             });
             this.vScrollBar.setAttributes({
                 width,
+                padding: verticalPadding,
                 railStyle: {
                     fill: scrollRailColor
                 },
@@ -37957,6 +37994,8 @@
             const labelFontFamily = theme.columnResize?.labelFontFamily;
             const labelBackgroundFill = theme.columnResize?.labelBackgroundFill;
             const labelBackgroundCornerRadius = theme.columnResize?.labelBackgroundCornerRadius;
+            const labelVisible = theme.columnResize?.labelVisible ?? true;
+            this.labelVisible = labelVisible;
             this.columnResizeLabel.lastChild.setAttributes({
                 fontSize: labelFontSize,
                 fill: labelColor,
@@ -40624,6 +40663,9 @@
                 colForDefine = range.start.col;
                 rowForDefine = range.start.row;
             }
+            if ((cellLocation === 'columnHeader' || cellLocation === 'cornerHeader') && row >= table.columnHeaderLevelCount) {
+                cellLocation = 'body';
+            }
             const define = cellLocation !== 'body'
                 ? table.getHeaderDefine(colForDefine, rowForDefine)
                 : table.getBodyColumnDefine(colForDefine, rowForDefine);
@@ -40653,7 +40695,7 @@
                     value = vtableMergeName;
                 }
             }
-            const cellStyle = customStyle || table._getCellStyle(col, row);
+            const cellStyle = customStyle || table._getCellStyle(range ? range.start.col : col, range ? range.start.row : row);
             const cellTheme = getStyleTheme(cellStyle, table, range ? range.start.col : col, range ? range.start.row : row, getProp).theme;
             cellTheme.group.cornerRadius = getCellCornerRadius(col, row, table);
             cellTheme.group.width = colWidth;
@@ -45838,7 +45880,7 @@
                     ? this.table.getColsWidth(this.table.frozenColCount ?? 0, this.bodyGroup.firstChild.col - 1)
                     : 0)
                 : 0;
-            const rightX = updateContainerChildrenX(this.rightFrozenGroup, 0);
+            const 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
@@ -47051,6 +47093,7 @@
                 delete state.columnMove.colTarget;
                 delete state.columnMove.rowTarget;
                 state.table.scenegraph.component.hideMoveCol();
+                state.table.scenegraph.updateNextFrame();
                 return false;
             }
         }
@@ -48035,7 +48078,7 @@
         checkCellRangeInSelect(cellPosStart, cellPosEnd) {
             return checkMultiCellInSelect(cellPosStart, cellPosEnd, this.select.ranges, this.select.highlightScope);
         }
-        updateHoverIcon(col, row, target, cellGroup, event) {
+        updateHoverIcon(col, row, target, cellGroup) {
             if (this.residentHoverIcon?.icon && target === this.residentHoverIcon?.icon) {
                 return;
             }
@@ -48306,6 +48349,7 @@
             this.table.scenegraph.proxy.deltaY = 0;
             this.updateHoverPos(-1, -1);
             this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+                event: undefined,
                 scrollTop: this.scroll.verticalBarPos,
                 scrollLeft: this.scroll.horizontalBarPos,
                 scrollHeight: this.table.theme.scrollStyle?.width,
@@ -48331,6 +48375,7 @@
             this.table.scenegraph.proxy.deltaX = 0;
             this.updateHoverPos(-1, -1);
             this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+                event: undefined,
                 scrollTop: this.scroll.verticalBarPos,
                 scrollLeft: this.scroll.horizontalBarPos,
                 scrollHeight: this.table.theme.scrollStyle?.width,
@@ -48344,7 +48389,7 @@
                 this.checkHorizontalScrollBarEnd();
             }
         }
-        setScrollTop(top) {
+        setScrollTop(top, event) {
             const totalHeight = this.table.getAllRowsHeight();
             const sizeTolerance = this.table.options.customConfig?._disableColumnAndRowSizeRound ? 1 : 0;
             top = Math.max(0, Math.min(top, totalHeight - this.table.scenegraph.height - sizeTolerance));
@@ -48362,6 +48407,7 @@
             this.table.scenegraph.component.updateVerticalScrollBarPos(yRatio);
             if (oldVerticalBarPos !== top) {
                 this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+                    event: event?.nativeEvent,
                     scrollTop: this.scroll.verticalBarPos,
                     scrollLeft: this.scroll.horizontalBarPos,
                     scrollHeight: this.table.theme.scrollStyle?.width,
@@ -48374,7 +48420,7 @@
                 this.checkVerticalScrollBarEnd();
             }
         }
-        setScrollLeft(left) {
+        setScrollLeft(left, event) {
             this.table.scrollLeft;
             const totalWidth = this.table.getAllColsWidth();
             this.table.getFrozenColsWidth();
@@ -48394,6 +48440,7 @@
             this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio);
             if (oldHorizontalBarPos !== left) {
                 this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+                    event: event?.nativeEvent,
                     scrollTop: this.scroll.verticalBarPos,
                     scrollLeft: this.scroll.horizontalBarPos,
                     scrollHeight: this.table.theme.scrollStyle?.width,
@@ -48727,7 +48774,9 @@
                     else {
                         return;
                     }
-                    window.open(url);
+                    const linkTarget = columnDefine.linkTarget;
+                    const linkWindowFeatures = columnDefine.linkWindowFeatures;
+                    window.open(url, linkTarget, linkWindowFeatures);
                 }
                 else if (cellType === 'image') {
                     const { clickToPreview } = columnDefine;
@@ -48866,6 +48915,132 @@
         });
     }
 
+    function handleWhell(event, state, isWheelEvent = true) {
+        let { deltaX, deltaY } = event;
+        if (event.shiftKey && event.deltaY) {
+            deltaX = deltaY;
+            deltaY = 0;
+        }
+        const [optimizedDeltaX, optimizedDeltaY] = optimizeScrollXY(deltaX, deltaY, { horizontal: 1, vertical: 1 });
+        if (optimizedDeltaX || optimizedDeltaY) {
+            if (state.interactionState !== InteractionState.scrolling) {
+                state.updateInteractionState(InteractionState.scrolling);
+            }
+        }
+        if (optimizedDeltaX) {
+            state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX, event);
+            state.showHorizontalScrollBar(true);
+        }
+        if (optimizedDeltaY) {
+            state.setScrollTop(state.scroll.verticalBarPos + optimizedDeltaY, event);
+            state.showVerticalScrollBar(true);
+        }
+        isWheelEvent && state.resetInteractionState();
+        if (event.cancelable &&
+            (state.table.internalProps.overscrollBehavior === 'none' ||
+                (Math.abs(deltaY) >= Math.abs(deltaX) && deltaY !== 0 && isVerticalScrollable(deltaY, state)) ||
+                (Math.abs(deltaY) <= Math.abs(deltaX) && deltaX !== 0 && isHorizontalScrollable(deltaX, state)))) {
+            event.preventDefault();
+        }
+    }
+    function optimizeScrollXY(x, y, ratio) {
+        const ANGLE = 2;
+        const angle = Math.abs(x / y);
+        const deltaX = angle <= 1 / ANGLE ? 0 : x;
+        const deltaY = angle > ANGLE ? 0 : y;
+        return [Math.ceil(deltaX * (ratio.horizontal ?? 0)), Math.ceil(deltaY * (ratio.vertical ?? 0))];
+    }
+    function isVerticalScrollable(deltaY, state) {
+        const totalHeight = state.table.getAllRowsHeight() - state.table.scenegraph.height;
+        if (totalHeight === 0) {
+            return false;
+        }
+        return !isScrollToTop(deltaY, state) && !isScrollToBottom(deltaY, state);
+    }
+    function isHorizontalScrollable(deltaX, state) {
+        const totalWidth = state.table.getAllColsWidth() - state.table.scenegraph.width;
+        if (totalWidth === 0) {
+            return false;
+        }
+        return !isScrollToLeft(deltaX, state) && !isScrollToRight(deltaX, state);
+    }
+    function isScrollToTop(deltaY, state) {
+        const totalHeight = state.table.getAllRowsHeight() - state.table.scenegraph.height;
+        return totalHeight !== 0 && deltaY <= 0 && state.scroll.verticalBarPos < 1;
+    }
+    function isScrollToBottom(deltaY, state) {
+        const sizeTolerance = state.table.options.customConfig?._disableColumnAndRowSizeRound ? 1 : 0;
+        const totalHeight = state.table.getAllRowsHeight() - state.table.scenegraph.height;
+        return totalHeight !== 0 && deltaY >= 0 && Math.abs(state.scroll.verticalBarPos - totalHeight) < 1 + sizeTolerance;
+    }
+    function isScrollToLeft(deltaX, state) {
+        const totalWidth = state.table.getAllColsWidth() - state.table.scenegraph.width;
+        return totalWidth !== 0 && deltaX <= 0 && state.scroll.horizontalBarPos < 1;
+    }
+    function isScrollToRight(deltaX, state) {
+        const sizeTolerance = state.table.options.customConfig?._disableColumnAndRowSizeRound ? 1 : 0;
+        const totalWidth = state.table.getAllColsWidth() - state.table.scenegraph.width;
+        return totalWidth !== 0 && deltaX >= 0 && Math.abs(state.scroll.horizontalBarPos - totalWidth) < 1 + sizeTolerance;
+    }
+    class InertiaScroll {
+        friction;
+        lastTime;
+        speedX;
+        speedY;
+        stateManager;
+        runingId;
+        scrollHandle;
+        constructor(stateManager) {
+            this.stateManager = stateManager;
+        }
+        setScrollHandle(scrollHandle) {
+            this.scrollHandle = scrollHandle;
+        }
+        startInertia(speedX, speedY, friction) {
+            this.lastTime = Date.now();
+            this.speedX = speedX;
+            this.speedY = speedY;
+            this.friction = friction;
+            if (!this.runingId) {
+                this.runingId = requestAnimationFrame(this.inertia.bind(this));
+            }
+        }
+        inertia() {
+            const now = Date.now();
+            const dffTime = now - this.lastTime;
+            let stopped = true;
+            const f = Math.pow(this.friction, dffTime / 16);
+            const newSpeedX = f * this.speedX;
+            const newSpeedY = f * this.speedY;
+            let dx = 0;
+            let dy = 0;
+            if (Math.abs(newSpeedX) > 0.05) {
+                stopped = false;
+                dx = ((this.speedX + newSpeedX) / 2) * dffTime;
+            }
+            if (Math.abs(newSpeedY) > 0.05) {
+                stopped = false;
+                dy = ((this.speedY + newSpeedY) / 2) * dffTime;
+            }
+            this.scrollHandle?.(dx, dy);
+            if (stopped) {
+                this.runingId = null;
+                return;
+            }
+            this.lastTime = now;
+            this.speedX = newSpeedX;
+            this.speedY = newSpeedY;
+            this.runingId = requestAnimationFrame(this.inertia.bind(this));
+        }
+        endInertia() {
+            cancelAnimationFrame(this.runingId);
+            this.runingId = null;
+        }
+        isInertiaScrolling() {
+            return !!this.runingId;
+        }
+    }
+
     function bindTableGroupListener(eventManager) {
         const table = eventManager.table;
         const stateManager = table.stateManager;
@@ -48889,7 +49064,7 @@
                         eventManager.dealFillSelect(eventArgsSet, true);
                     }
                     else {
-                        eventManager.dealTableSelect(eventArgsSet, true);
+                        table.options.select?.disableDragSelect || eventManager.dealTableSelect(eventArgsSet, true);
                     }
                 }
                 return;
@@ -49569,6 +49744,12 @@
             table.fireListeners(TABLE_EVENT_TYPE.RADIO_STATE_CHANGE, cellsEvent);
             table.scenegraph.updateNextFrame();
         });
+        table.scenegraph.stage.addEventListener('wheel', (e) => {
+            table.editorManager?.completeEdit();
+            if (table.eventManager._enableTableScroll) {
+                handleWhell(e, stateManager);
+            }
+        });
     }
     function bindGesture(eventManager) {
         const table = eventManager.table;
@@ -49773,132 +49954,6 @@
         });
     }
 
-    function handleWhell(event, state, isWheelEvent = true) {
-        let { deltaX, deltaY } = event;
-        if (event.shiftKey && event.deltaY) {
-            deltaX = deltaY;
-            deltaY = 0;
-        }
-        const [optimizedDeltaX, optimizedDeltaY] = optimizeScrollXY(deltaX, deltaY, { horizontal: 1, vertical: 1 });
-        if (optimizedDeltaX || optimizedDeltaY) {
-            if (state.interactionState !== InteractionState.scrolling) {
-                state.updateInteractionState(InteractionState.scrolling);
-            }
-        }
-        if (optimizedDeltaX) {
-            state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX);
-            state.showHorizontalScrollBar(true);
-        }
-        if (optimizedDeltaY) {
-            state.setScrollTop(state.scroll.verticalBarPos + optimizedDeltaY);
-            state.showVerticalScrollBar(true);
-        }
-        isWheelEvent && state.resetInteractionState();
-        if (event.cancelable &&
-            (state.table.internalProps.overscrollBehavior === 'none' ||
-                (Math.abs(deltaY) >= Math.abs(deltaX) && deltaY !== 0 && isVerticalScrollable(deltaY, state)) ||
-                (Math.abs(deltaY) <= Math.abs(deltaX) && deltaX !== 0 && isHorizontalScrollable(deltaX, state)))) {
-            event.preventDefault();
-        }
-    }
-    function optimizeScrollXY(x, y, ratio) {
-        const ANGLE = 2;
-        const angle = Math.abs(x / y);
-        const deltaX = angle <= 1 / ANGLE ? 0 : x;
-        const deltaY = angle > ANGLE ? 0 : y;
-        return [Math.ceil(deltaX * (ratio.horizontal ?? 0)), Math.ceil(deltaY * (ratio.vertical ?? 0))];
-    }
-    function isVerticalScrollable(deltaY, state) {
-        const totalHeight = state.table.getAllRowsHeight() - state.table.scenegraph.height;
-        if (totalHeight === 0) {
-            return false;
-        }
-        return !isScrollToTop(deltaY, state) && !isScrollToBottom(deltaY, state);
-    }
-    function isHorizontalScrollable(deltaX, state) {
-        const totalWidth = state.table.getAllColsWidth() - state.table.scenegraph.width;
-        if (totalWidth === 0) {
-            return false;
-        }
-        return !isScrollToLeft(deltaX, state) && !isScrollToRight(deltaX, state);
-    }
-    function isScrollToTop(deltaY, state) {
-        const totalHeight = state.table.getAllRowsHeight() - state.table.scenegraph.height;
-        return totalHeight !== 0 && deltaY <= 0 && state.scroll.verticalBarPos < 1;
-    }
-    function isScrollToBottom(deltaY, state) {
-        const sizeTolerance = state.table.options.customConfig?._disableColumnAndRowSizeRound ? 1 : 0;
-        const totalHeight = state.table.getAllRowsHeight() - state.table.scenegraph.height;
-        return totalHeight !== 0 && deltaY >= 0 && Math.abs(state.scroll.verticalBarPos - totalHeight) < 1 + sizeTolerance;
-    }
-    function isScrollToLeft(deltaX, state) {
-        const totalWidth = state.table.getAllColsWidth() - state.table.scenegraph.width;
-        return totalWidth !== 0 && deltaX <= 0 && state.scroll.horizontalBarPos < 1;
-    }
-    function isScrollToRight(deltaX, state) {
-        const sizeTolerance = state.table.options.customConfig?._disableColumnAndRowSizeRound ? 1 : 0;
-        const totalWidth = state.table.getAllColsWidth() - state.table.scenegraph.width;
-        return totalWidth !== 0 && deltaX >= 0 && Math.abs(state.scroll.horizontalBarPos - totalWidth) < 1 + sizeTolerance;
-    }
-    class InertiaScroll {
-        friction;
-        lastTime;
-        speedX;
-        speedY;
-        stateManager;
-        runingId;
-        scrollHandle;
-        constructor(stateManager) {
-            this.stateManager = stateManager;
-        }
-        setScrollHandle(scrollHandle) {
-            this.scrollHandle = scrollHandle;
-        }
-        startInertia(speedX, speedY, friction) {
-            this.lastTime = Date.now();
-            this.speedX = speedX;
-            this.speedY = speedY;
-            this.friction = friction;
-            if (!this.runingId) {
-                this.runingId = requestAnimationFrame(this.inertia.bind(this));
-            }
-        }
-        inertia() {
-            const now = Date.now();
-            const dffTime = now - this.lastTime;
-            let stopped = true;
-            const f = Math.pow(this.friction, dffTime / 16);
-            const newSpeedX = f * this.speedX;
-            const newSpeedY = f * this.speedY;
-            let dx = 0;
-            let dy = 0;
-            if (Math.abs(newSpeedX) > 0.05) {
-                stopped = false;
-                dx = ((this.speedX + newSpeedX) / 2) * dffTime;
-            }
-            if (Math.abs(newSpeedY) > 0.05) {
-                stopped = false;
-                dy = ((this.speedY + newSpeedY) / 2) * dffTime;
-            }
-            this.scrollHandle?.(dx, dy);
-            if (stopped) {
-                this.runingId = null;
-                return;
-            }
-            this.lastTime = now;
-            this.speedX = newSpeedX;
-            this.speedY = newSpeedY;
-            this.runingId = requestAnimationFrame(this.inertia.bind(this));
-        }
-        endInertia() {
-            cancelAnimationFrame(this.runingId);
-            this.runingId = null;
-        }
-        isInertiaScrolling() {
-            return !!this.runingId;
-        }
-    }
-
     let defaultPixelRatio = 1;
     function getPixelRatio() {
         if (isNode) {
@@ -49921,12 +49976,6 @@
         handler.on(table.getElement(), 'blur', (e) => {
             eventManager.dealTableHover();
         });
-        handler.on(table.getElement(), 'wheel', (e) => {
-            table.editorManager?.completeEdit();
-            if (table.eventManager._enableTableScroll) {
-                handleWhell(e, stateManager);
-            }
-        });
         handler.on(table.getElement(), 'keydown', (e) => {
             if (e.key === 'a' && (e.ctrlKey || e.metaKey)) {
                 if (table.keyboardOptions?.selectAllOnCtrlA) {
@@ -50922,7 +50971,7 @@
         dealIconHover(eventArgsSet) {
             const { eventArgs } = eventArgsSet;
             if (eventArgs) {
-                this.table.stateManager.updateHoverIcon(eventArgs.col, eventArgs.row, eventArgs.target, eventArgs.targetCell, eventArgs.event);
+                this.table.stateManager.updateHoverIcon(eventArgs.col, eventArgs.row, eventArgs.target, eventArgs.targetCell);
             }
             else {
                 this.table.stateManager.updateHoverIcon(-1, -1, undefined, undefined);
@@ -53645,29 +53694,38 @@
     function dealHeaderForTreeMode(hd, _headerCellIds, results, roots, row, totalLevel, show, dimensions, layoutMap) {
         const id = hd.id;
         const dimensionInfo = dimensions.find(dimension => typeof dimension === 'string' ? false : dimension.dimensionKey === hd.dimensionKey);
+        const indicatorInfo = layoutMap.indicatorsDefine?.find(indicator => {
+            if (typeof indicator === 'string') {
+                return false;
+            }
+            if (hd.indicatorKey) {
+                return indicator.indicatorKey === hd.indicatorKey;
+            }
+            return indicator.title === hd.value;
+        });
         const cell = {
             id,
-            title: hd.value,
+            title: hd.value ?? indicatorInfo.title,
             field: hd.dimensionKey,
-            style: hd.level + 1 === totalLevel || typeof dimensionInfo?.headerStyle === 'function'
-                ? dimensionInfo?.headerStyle
-                : Object.assign({}, dimensionInfo?.headerStyle, { textAlign: 'left' }),
-            headerType: dimensionInfo?.headerType ?? 'text',
-            headerIcon: dimensionInfo?.headerIcon,
+            style: hd.level + 1 === totalLevel || typeof (indicatorInfo ?? dimensionInfo)?.headerStyle === 'function'
+                ? (indicatorInfo ?? dimensionInfo)?.headerStyle
+                : Object.assign({}, (indicatorInfo ?? dimensionInfo)?.headerStyle, { textAlign: 'left' }),
+            headerType: indicatorInfo?.headerType ?? dimensionInfo?.headerType ?? 'text',
+            headerIcon: indicatorInfo?.headerIcon ?? dimensionInfo?.headerIcon,
             define: Object.assign(hd, {
-                linkJump: dimensionInfo?.linkJump,
-                linkDetect: dimensionInfo?.linkDetect,
-                templateLink: dimensionInfo?.templateLink,
-                keepAspectRatio: dimensionInfo?.keepAspectRatio ?? false,
-                imageAutoSizing: dimensionInfo?.imageAutoSizing,
-                headerCustomRender: dimensionInfo?.headerCustomRender,
-                headerCustomLayout: dimensionInfo?.headerCustomLayout,
+                linkJump: (indicatorInfo ?? dimensionInfo)?.linkJump,
+                linkDetect: (indicatorInfo ?? dimensionInfo)?.linkDetect,
+                templateLink: (indicatorInfo ?? dimensionInfo)?.templateLink,
+                keepAspectRatio: (indicatorInfo ?? dimensionInfo)?.keepAspectRatio ?? false,
+                imageAutoSizing: (indicatorInfo ?? dimensionInfo)?.imageAutoSizing,
+                headerCustomRender: (indicatorInfo ?? dimensionInfo)?.headerCustomRender,
+                headerCustomLayout: (indicatorInfo ?? dimensionInfo)?.headerCustomLayout,
                 dragHeader: dimensionInfo?.dragHeader,
-                disableHeaderHover: !!dimensionInfo?.disableHeaderHover,
-                disableHeaderSelect: !!dimensionInfo?.disableHeaderSelect
+                disableHeaderHover: !!(indicatorInfo ?? dimensionInfo)?.disableHeaderHover,
+                disableHeaderSelect: !!(indicatorInfo ?? dimensionInfo)?.disableHeaderSelect
             }),
-            fieldFormat: dimensionInfo?.headerFormat,
-            dropDownMenu: dimensionInfo?.dropDownMenu,
+            fieldFormat: indicatorInfo?.headerFormat ?? dimensionInfo?.headerFormat,
+            dropDownMenu: indicatorInfo?.dropDownMenu ?? dimensionInfo?.dropDownMenu,
             pivotInfo: {
                 value: hd.value,
                 dimensionKey: hd.dimensionKey,
@@ -53681,6 +53739,43 @@
             maxWidth: dimensionInfo?.maxWidth,
             parentCellId: roots[roots.length - 1]
         };
+        if (indicatorInfo) {
+            if (indicatorInfo.customRender) {
+                hd.customRender = indicatorInfo.customRender;
+            }
+            if (!isValid$3(layoutMap._indicators?.find(indicator => indicator.indicatorKey === indicatorInfo.indicatorKey))) {
+                layoutMap._indicators?.push({
+                    id: ++layoutMap.sharedVar.seqId,
+                    indicatorKey: indicatorInfo.indicatorKey,
+                    field: indicatorInfo.indicatorKey,
+                    fieldFormat: indicatorInfo?.format,
+                    cellType: indicatorInfo?.cellType ?? indicatorInfo?.columnType ?? 'text',
+                    chartModule: 'chartModule' in indicatorInfo ? indicatorInfo.chartModule : null,
+                    chartSpec: 'chartSpec' in indicatorInfo ? indicatorInfo.chartSpec : null,
+                    sparklineSpec: 'sparklineSpec' in indicatorInfo ? indicatorInfo.sparklineSpec : null,
+                    style: indicatorInfo?.style,
+                    icon: indicatorInfo?.icon,
+                    define: Object.assign({}, hd, indicatorInfo, {
+                        dragHeader: dimensionInfo?.dragHeader
+                    }),
+                    width: indicatorInfo?.width,
+                    minWidth: indicatorInfo?.minWidth,
+                    maxWidth: indicatorInfo?.maxWidth,
+                    disableColumnResize: indicatorInfo?.disableColumnResize
+                });
+            }
+        }
+        else if (hd.indicatorKey) {
+            if (!isValid$3(layoutMap._indicators?.find(indicator => indicator.indicatorKey === hd.indicatorKey))) {
+                layoutMap._indicators?.push({
+                    id: ++layoutMap.sharedVar.seqId,
+                    indicatorKey: hd.indicatorKey,
+                    field: hd.indicatorKey,
+                    cellType: 'text',
+                    define: Object.assign({}, hd)
+                });
+            }
+        }
         results[id] = cell;
         layoutMap._headerObjects[id] = cell;
         _headerCellIds[row][layoutMap.colIndex] = id;
@@ -55172,7 +55267,7 @@
             return TABLE_EVENT_TYPE;
         }
         options;
-        version = "1.6.3-alpha.3";
+        version = "1.6.3";
         pagination;
         id = `VTable${Date.now()}`;
         headerStyleCache;
@@ -55349,6 +55444,7 @@
                 }
             }
             internalProps.tooltip = Object.assign({
+                parentElement: this.getElement(),
                 renderMode: 'html',
                 isShowOverflowTextTooltip: false,
                 confine: true
@@ -56559,6 +56655,7 @@
                 }
             }
             internalProps.tooltip = Object.assign({
+                parentElement: this.getElement(),
                 renderMode: 'html',
                 isShowOverflowTextTooltip: false,
                 confine: true
@@ -56682,9 +56779,9 @@
         clearSelected() {
             this.stateManager.updateSelectPos(-1, -1);
         }
-        selectCell(col, row, isShift, isCtrl) {
+        selectCell(col, row, isShift, isCtrl, makeSelectCellVisible = true) {
             const isHasSelected = !!this.stateManager.select.ranges?.length;
-            this.stateManager.updateSelectPos(col, row, isShift, isCtrl);
+            this.stateManager.updateSelectPos(col, row, isShift, isCtrl, false, !makeSelectCellVisible);
             this.stateManager.endSelectCells(true, isHasSelected);
         }
         selectCells(cellRanges) {
@@ -60417,7 +60514,7 @@
         }
         getHeaderCellAddressByField(field) {
             const hd = this.headerObjects.find((col) => col && col.field === field);
-            return this.getHeaderCellAdressById(hd.id);
+            return hd && this.getHeaderCellAdressById(hd.id);
         }
         getBody(col, _row) {
             if (this.isSeriesNumber(col, _row)) {
@@ -60437,7 +60534,7 @@
                 }
             }
             else {
-                for (let col = 0; col < (this.colCount ?? 0); col++) {
+                for (let col = this.leftRowSeriesNumberColumnCount; col < (this.colCount ?? 0); col++) {
                     if (id === this._columns[col - this.leftRowSeriesNumberColumnCount].id) {
                         return {
                             start: { col, row: 0 },
@@ -60446,7 +60543,10 @@
                     }
                 }
             }
-            throw new Error(`can not found body layout @id=${id}`);
+            return {
+                start: { col: -1, row: -1 },
+                end: { col: -1, row: -1 }
+            };
         }
         getCellRange(col, row) {
             return getCellRange(col, row, this);
@@ -61251,7 +61351,7 @@
             if (order && field && order !== 'normal') {
                 const sortFunc = table._getSortFuncFromHeaderOption(undefined, field);
                 const hd = table.internalProps.layoutMap.headerObjects.find((col) => col && col.field === field);
-                table.dataSource.sort(hd.field, order, sortFunc ?? defaultOrderFn);
+                hd && table.dataSource.sort(hd.field, order, sortFunc ?? defaultOrderFn);
             }
         }
     }
@@ -61805,6 +61905,9 @@
         }
         getTableIndexByField(field) {
             const colObj = this.internalProps.layoutMap.columnObjects.find((col) => col.field === field);
+            if (!colObj) {
+                return -1;
+            }
             const layoutRange = this.internalProps.layoutMap.getBodyLayoutRangeById(colObj.id);
             if (this.transpose) {
                 return layoutRange.start.row;
@@ -61862,6 +61965,7 @@
                 : options.header
                     ? cloneDeepSpec(options.header, ['children'])
                     : [];
+            internalProps.enableTreeNodeMerge = options.enableTreeNodeMerge ?? isValid$3(options.groupBy) ?? false;
             this.internalProps.headerHelper.setTableColumnsEditor();
             this.transpose = options.transpose ?? false;
             this.refreshHeader();
@@ -62217,7 +62321,7 @@
             if (field && executeSort) {
                 const sortFunc = this._getSortFuncFromHeaderOption(this.internalProps.columns, field);
                 const hd = this.internalProps.layoutMap.headerObjects.find((col) => col && col.field === field);
-                if (hd.define.sort !== false) {
+                if (hd && hd.define.sort !== false) {
                     this.dataSource.sort(hd.field, order, sortFunc);
                     this.internalProps.layoutMap.clearCellRangeMap();
                     this.internalProps.useOneRowHeightFillAll = false;
@@ -62313,7 +62417,7 @@
                     if (order && field && order !== 'normal') {
                         const sortFunc = this._getSortFuncFromHeaderOption(undefined, field);
                         const hd = this.internalProps.layoutMap.headerObjectsIncludeHided.find((col) => col && col.field === field);
-                        if (hd.define.sort !== false) {
+                        if (hd && hd.define.sort !== false) {
                             this.dataSource.sort(hd.field, order, sortFunc ?? defaultOrderFn);
                         }
                     }
@@ -65818,7 +65922,7 @@
         _bindToCell(table, col, row, position, referencePosition, confine, arrowMark) {
             const rootElement = this._rootElement;
             const rect = table.getCellRangeRelativeRect({ col, row });
-            const element = table.getElement();
+            const element = table.internalProps.tooltip.parentElement;
             const containerWidth = table.internalProps.element.offsetWidth;
             const { width } = rect;
             if (rootElement) {
@@ -65864,7 +65968,8 @@
         getComputedPosition(table, col, row, position, referencePosition, confine, arrowMark) {
             const rootElement = this._rootElement;
             const rect = table.getCellRangeRelativeRect({ col, row });
-            const { width: containerWidth, height: containerHeight } = table.internalProps.element.getBoundingClientRect();
+            const { x: parentX, y: parentY } = table.internalProps.tooltip.parentElement.getBoundingClientRect();
+            const { width: containerWidth, height: containerHeight, x, y } = table.internalProps.element.getBoundingClientRect();
             const { width } = rect;
             let tooltipY;
             let tooltipX;
@@ -65951,8 +66056,8 @@
                 }
             }
             return {
-                x: tooltipX,
-                y: tooltipY
+                x: tooltipX + x - parentX,
+                y: tooltipY + y - parentY
             };
         }
         removeStyleFromTriangle() {
@@ -67458,7 +67563,7 @@
         return cellGroup;
     }
 
-    function createProgressBarCell(progressBarDefine, style, width, value, dataValue, col, row, padding, table) {
+    function createProgressBarCell(progressBarDefine, style, width, value, dataValue, col, row, padding, table, range) {
         if (progressBarDefine.dependField) {
             dataValue = table.getCellOriginRecord(col, row)?.[progressBarDefine.dependField] ?? dataValue;
         }
@@ -67481,7 +67586,13 @@
                 dataValue,
                 cellHeaderPaths: undefined
             }) ?? progressBarDefine.min + 100;
-        const height = table.getRowHeight(row);
+        let height = 0;
+        if (range) {
+            height = table.getRowsHeight(range.start.row, range.end.row);
+        }
+        else {
+            height = table.getRowHeight(row);
+        }
         let contentWidth = width;
         let contentHeight = height;
         let _contentOffset = 0;
@@ -69412,7 +69523,7 @@
         }
         getHeaderCellAddressByField(field) {
             const hd = this.headerObjects.find((col) => col && col.field === field);
-            return this.getHeaderCellAdressById(hd.id);
+            return hd && this.getHeaderCellAdressById(hd.id);
         }
         getBody(_col, _row) {
             const cache = this.getBodyWidthCache(_col, _row);
@@ -70122,7 +70233,24 @@
                 }
             });
             if (isCornerCell) {
-                if (this.cornerSetting.titleOnDimension === 'row') {
+                if (this.cornerSetting.titleOnDimension === 'all' && this.indicatorsAsCol && colHeaderPaths.length === 0) {
+                    for (let i = 0; i < this.rowDimensionKeys.length; i++) {
+                        if (rowHeaderPaths[0]?.dimensionKey === this.rowDimensionKeys[i]) {
+                            return { col: i + this.leftRowSeriesNumberColumnCount, row: this.columnHeaderLevelCount - 1 };
+                        }
+                    }
+                }
+                else if (this.cornerSetting.titleOnDimension === 'all' &&
+                    !this.indicatorsAsCol &&
+                    rowHeaderPaths.length === 0) {
+                    for (let i = 0; i < this.colDimensionKeys.length; i++) {
+                        if (colHeaderPaths[0]?.dimensionKey === this.colDimensionKeys[i]) {
+                            return { col: this.rowHeaderLevelCount - 1, row: i };
+                        }
+                    }
+                }
+                else if (this.cornerSetting.titleOnDimension === 'row' ||
+                    (this.cornerSetting.titleOnDimension === 'all' && !this.indicatorsAsCol)) {
                     for (let i = 0; i < this.rowDimensionKeys.length; i++) {
                         if (rowHeaderPaths[0]?.dimensionKey === this.rowDimensionKeys[i]) {
                             return { col: i + this.leftRowSeriesNumberColumnCount, row: 0 };
@@ -72540,6 +72668,10 @@
                 this.changedTree[flatRowKey][flatColKey] = [];
                 this.changedTree[flatRowKey][flatColKey][indicatorIndex] = newValue;
             }
+            const cellAggregator = this.tree[flatRowKey][flatColKey][indicatorIndex];
+            if (cellAggregator.records.length === 1) {
+                cellAggregator.records[0][this.indicatorKeys[indicatorIndex]] = newValue;
+            }
         }
         changeRecordFieldValue(fieldName, oldValue, value) {
             let isIndicatorName = false;
@@ -75670,7 +75802,7 @@
     }
 
     registerForVrender();
-    const version = "1.6.3-alpha.3";
+    const version = "1.6.3";
     function getIcons() {
         return get$2();
     }