@visactor/vtable 1.17.3-alpha.7 → 1.17.3-alpha.8

package/dist/vtable.js

@@ -42702,12 +42702,14 @@
         const isWidthNumber = !Array.isArray(strokeArrayWidth);
         const isStrokeTrue = !Array.isArray(stroke);
         const isSplitDraw = Array.isArray(strokeArrayColor) || widthInfo.isSplitDraw;
+        context.stroke();
         context.setStrokeStyle(rect, rect.attribute, x, y, rectAttribute);
         const { lineDash = groupAttribute.lineDash } = group.attribute;
         let isDash = false;
         if (lineDash.length && lineDash.some((dash) => Array.isArray(dash))) {
             isDash = true;
         }
+        context.beginPath();
         context.moveTo(x, y);
         const strokeTop = (isStrokeTrue || stroke[0]) && (isWidthNumber || strokeArrayWidth[0]);
         const strokeRight = (isStrokeTrue || stroke[1]) && (isWidthNumber || strokeArrayWidth[1]);
@@ -42820,6 +42822,7 @@
         else if (i === 3) {
             context.moveTo(x, y);
         }
+        context.closePath();
         if (!isSplitDraw && !isDash) {
             if (!isWidthNumber && widthInfo.width) {
                 context.lineWidth = widthInfo.width;
@@ -42828,7 +42831,7 @@
         }
         context.lineDashOffset = 0;
         context.setLineDash([]);
-        context.closePath();
+        context.beginPath();
     }
 
     let loadingImage;
@@ -45067,9 +45070,6 @@
             if (this.table.options.maintainedDataCount) {
                 this.rowLimit = this.table.options.maintainedDataCount;
             }
-            if (this.table.options.maintainedColumnCount) {
-                this.colLimit = this.table.options.maintainedColumnCount;
-            }
         }
         get bodyLeftCol() {
             return this.table.frozenColCount;
@@ -46112,7 +46112,8 @@
             y: firstCellBound.y1 - scene.tableGroup.attribute.y,
             width: 0,
             height: 0,
-            visible: true
+            visible: true,
+            cornerRadius: getCornerRadius(selectRangeType, scene.table.theme.frameStyle?.cornerRadius, start_Col, start_Row, end_Col, end_Row, scene.table)
         });
         let fillhandle;
         if (isHasFillHandleRect) {
@@ -46169,6 +46170,40 @@
                                             ? scene.bottomFrozenGroup
                                             : scene.rightBottomCornerGroup);
     }
+    function getCornerRadius(selectRangeType, cornerRadius, start_Col, start_Row, end_Col, end_Row, table) {
+        if (!cornerRadius) {
+            return undefined;
+        }
+        const cornerRadiusArray = Array.isArray(cornerRadius)
+            ? cornerRadius
+            : [cornerRadius, cornerRadius, cornerRadius, cornerRadius];
+        const tableStartCol = 0;
+        const tableStartRow = 0;
+        const tableEndCol = table.colCount - 1;
+        const tableEndRow = table.rowCount - 1;
+        const result = [0, 0, 0, 0];
+        let changed = false;
+        if (start_Col === tableStartCol && start_Row === tableStartRow) {
+            result[0] = cornerRadiusArray[0];
+            changed = true;
+        }
+        else if (end_Col === tableEndCol && end_Row === tableEndRow) {
+            result[2] = cornerRadiusArray[2];
+            changed = true;
+        }
+        else if (start_Col === tableStartCol && end_Row === tableEndRow) {
+            result[3] = cornerRadiusArray[3];
+            changed = true;
+        }
+        else if (end_Col === tableEndCol && start_Row === tableStartRow) {
+            result[1] = cornerRadiusArray[1];
+            changed = true;
+        }
+        if (changed) {
+            return result;
+        }
+        return undefined;
+    }
 
     function moveSelectingRangeComponentsToSelectedRangeComponents(scene) {
         scene.selectingRangeComponents.forEach((rangeComponent, key) => {
@@ -46879,7 +46914,10 @@
         }
         scene.hasFrozen = true;
         scene.frozenColCount = scene.table.frozenColCount;
-        scene.frozenRowCount = scene.colHeaderGroup.firstChild?.childrenCount ?? 0;
+        scene.frozenRowCount =
+            scene.colHeaderGroup.firstChild?.childrenCount ??
+                scene.cornerHeaderGroup.firstChild?.childrenCount ??
+                scene.table.frozenRowCount;
     }
     function resetFrozen(scene) {
         if (scene.frozenColCount > scene.table.frozenColCount) {
@@ -46905,7 +46943,10 @@
         updateReactComponentContainer(scene);
         scene.recreateAllSelectRangeComponents();
         scene.frozenColCount = scene.table.frozenColCount;
-        scene.frozenRowCount = scene.colHeaderGroup.firstChild?.childrenCount ?? 0;
+        scene.frozenRowCount =
+            scene.colHeaderGroup.firstChild?.childrenCount ??
+                scene.cornerHeaderGroup.firstChild?.childrenCount ??
+                scene.table.frozenRowCount;
         scene.proxy.colStart = scene.bodyGroup.firstChild?.col ?? scene.table.frozenColCount;
         scene.bodyGroup.setAttribute('x', scene.rowHeaderGroup.attribute.width);
         scene.colHeaderGroup.setAttribute('x', scene.cornerHeaderGroup.attribute.width);
@@ -52365,25 +52406,33 @@
         updateVerticalScrollBar(yRatio) {
             const totalHeight = this.table.getAllRowsHeight();
             const oldVerticalBarPos = this.scroll.verticalBarPos;
-            this.scroll.verticalBarPos = Math.ceil(yRatio * (totalHeight - this.table.scenegraph.height));
-            if (!isValid$3(this.scroll.verticalBarPos) || isNaN(this.scroll.verticalBarPos)) {
-                this.scroll.verticalBarPos = 0;
+            let verticalBarPos = Math.ceil(yRatio * (totalHeight - this.table.scenegraph.height));
+            if (!isValid$3(verticalBarPos) || isNaN(verticalBarPos)) {
+                verticalBarPos = 0;
             }
-            this.table.scenegraph.setY(-this.scroll.verticalBarPos, yRatio === 1);
-            this.scroll.verticalBarPos -= this.table.scenegraph.proxy.deltaY;
-            this.table.scenegraph.proxy.deltaY = 0;
-            this.updateHoverPos(-1, -1);
-            this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+            const dy = verticalBarPos - this.table.scenegraph.proxy.deltaY - oldVerticalBarPos;
+            const canScroll = this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
                 event: undefined,
-                scrollTop: this.scroll.verticalBarPos,
+                scrollTop: verticalBarPos - this.table.scenegraph.proxy.deltaY,
                 scrollLeft: this.scroll.horizontalBarPos,
                 scrollHeight: this.table.theme.scrollStyle?.width,
                 scrollWidth: this.table.theme.scrollStyle?.width,
                 viewHeight: this.table.tableNoFrameHeight,
                 viewWidth: this.table.tableNoFrameWidth,
                 scrollDirection: 'vertical',
-                scrollRatioY: yRatio
+                scrollRatioY: yRatio,
+                dy
             });
+            if (canScroll.some(value => value === false)) {
+                const yRatio = this.scroll.verticalBarPos / (totalHeight - this.table.scenegraph.height);
+                this.table.scenegraph.component.updateVerticalScrollBarPos(yRatio);
+                return;
+            }
+            this.scroll.verticalBarPos = verticalBarPos;
+            this.table.scenegraph.setY(-this.scroll.verticalBarPos, yRatio === 1);
+            this.scroll.verticalBarPos -= this.table.scenegraph.proxy.deltaY;
+            this.table.scenegraph.proxy.deltaY = 0;
+            this.updateHoverPos(-1, -1);
             if (oldVerticalBarPos !== this.scroll.verticalBarPos) {
                 this.checkVerticalScrollBarEnd();
             }
@@ -52391,25 +52440,33 @@
         updateHorizontalScrollBar(xRatio) {
             const totalWidth = this.table.getAllColsWidth();
             const oldHorizontalBarPos = this.scroll.horizontalBarPos;
-            this.scroll.horizontalBarPos = Math.ceil(xRatio * (totalWidth - this.table.scenegraph.width));
-            if (!isValid$3(this.scroll.horizontalBarPos) || isNaN(this.scroll.horizontalBarPos)) {
-                this.scroll.horizontalBarPos = 0;
+            let horizontalBarPos = Math.ceil(xRatio * (totalWidth - this.table.scenegraph.width));
+            if (!isValid$3(horizontalBarPos) || isNaN(horizontalBarPos)) {
+                horizontalBarPos = 0;
             }
-            this.table.scenegraph.setX(-this.scroll.horizontalBarPos, xRatio === 1);
-            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, {
+            const dx = horizontalBarPos - this.table.scenegraph.proxy.deltaX - oldHorizontalBarPos;
+            const canScroll = this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
                 event: undefined,
                 scrollTop: this.scroll.verticalBarPos,
-                scrollLeft: this.scroll.horizontalBarPos,
+                scrollLeft: horizontalBarPos - this.table.scenegraph.proxy.deltaX,
                 scrollHeight: this.table.theme.scrollStyle?.width,
                 scrollWidth: this.table.theme.scrollStyle?.width,
                 viewHeight: this.table.tableNoFrameHeight,
                 viewWidth: this.table.tableNoFrameWidth,
                 scrollDirection: 'horizontal',
-                scrollRatioX: xRatio
+                scrollRatioX: xRatio,
+                dx: dx
             });
+            if (canScroll.some(value => value === false)) {
+                const xRatio = this.scroll.horizontalBarPos / (totalWidth - this.table.scenegraph.width);
+                this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio);
+                return;
+            }
+            this.scroll.horizontalBarPos = horizontalBarPos;
+            this.table.scenegraph.setX(-this.scroll.horizontalBarPos, xRatio === 1);
+            this.scroll.horizontalBarPos -= this.table.scenegraph.proxy.deltaX;
+            this.table.scenegraph.proxy.deltaX = 0;
+            this.updateHoverPos(-1, -1);
             if (oldHorizontalBarPos !== this.scroll.horizontalBarPos) {
                 this.checkHorizontalScrollBarEnd();
             }
@@ -52419,29 +52476,43 @@
             const sizeTolerance = this.table.options.customConfig?._disableColumnAndRowSizeRound ? 1 : 0;
             top = Math.max(0, Math.min(top, totalHeight - this.table.scenegraph.height - sizeTolerance));
             top = Math.ceil(top);
-            if (top !== this.scroll.verticalBarPos || this.table.isPivotChart()) {
-                this.updateHoverPos(-1, -1);
-            }
             const oldVerticalBarPos = this.scroll.verticalBarPos;
-            this.scroll.verticalBarPos = top;
-            if (!isValid$3(this.scroll.verticalBarPos) || isNaN(this.scroll.verticalBarPos)) {
-                this.scroll.verticalBarPos = 0;
-            }
-            this.table.scenegraph.setY(-top);
             const yRatio = top / (totalHeight - this.table.scenegraph.height);
-            this.table.scenegraph.component.updateVerticalScrollBarPos(yRatio);
-            if (oldVerticalBarPos !== top && triggerEvent) {
-                this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+            if ((oldVerticalBarPos !== top || this.table.options?.customConfig?.scrollEventAlwaysTrigger === true) &&
+                triggerEvent) {
+                let verticalBarPos = top;
+                if (!isValid$3(verticalBarPos) || isNaN(verticalBarPos)) {
+                    verticalBarPos = 0;
+                }
+                const dy = verticalBarPos - oldVerticalBarPos;
+                const canScroll = this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
                     event: event?.nativeEvent,
-                    scrollTop: this.scroll.verticalBarPos,
+                    scrollTop: verticalBarPos,
                     scrollLeft: this.scroll.horizontalBarPos,
                     scrollHeight: this.table.theme.scrollStyle?.width,
                     scrollWidth: this.table.theme.scrollStyle?.width,
                     viewHeight: this.table.tableNoFrameHeight,
                     viewWidth: this.table.tableNoFrameWidth,
                     scrollDirection: 'vertical',
-                    scrollRatioY: yRatio
+                    scrollRatioY: yRatio,
+                    dy
                 });
+                if (canScroll.some(value => value === false)) {
+                    const yRatio = this.scroll.verticalBarPos / (totalHeight - this.table.scenegraph.height);
+                    this.table.scenegraph.component.updateVerticalScrollBarPos(yRatio);
+                    return;
+                }
+            }
+            if (top !== this.scroll.verticalBarPos || this.table.isPivotChart()) {
+                this.updateHoverPos(-1, -1);
+            }
+            this.scroll.verticalBarPos = top;
+            if (!isValid$3(this.scroll.verticalBarPos) || isNaN(this.scroll.verticalBarPos)) {
+                this.scroll.verticalBarPos = 0;
+            }
+            this.table.scenegraph.setY(-top);
+            this.table.scenegraph.component.updateVerticalScrollBarPos(yRatio);
+            if (oldVerticalBarPos !== top && triggerEvent) {
                 this.checkVerticalScrollBarEnd();
             }
         }
@@ -52452,29 +52523,43 @@
             const sizeTolerance = this.table.options.customConfig?._disableColumnAndRowSizeRound ? 1 : 0;
             left = Math.max(0, Math.min(left, totalWidth - this.table.scenegraph.width - sizeTolerance));
             left = Math.ceil(left);
-            if (left !== this.scroll.horizontalBarPos) {
-                this.updateHoverPos(-1, -1);
-            }
             const oldHorizontalBarPos = this.scroll.horizontalBarPos;
-            this.scroll.horizontalBarPos = left;
-            if (!isValid$3(this.scroll.horizontalBarPos) || isNaN(this.scroll.horizontalBarPos)) {
-                this.scroll.horizontalBarPos = 0;
-            }
-            this.table.scenegraph.setX(-left);
             const xRatio = left / (totalWidth - this.table.scenegraph.width);
-            this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio);
-            if (oldHorizontalBarPos !== left && triggerEvent) {
-                this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
+            if ((oldHorizontalBarPos !== left || this.table.options?.customConfig?.scrollEventAlwaysTrigger === true) &&
+                triggerEvent) {
+                let horizontalBarPos = left;
+                if (!isValid$3(horizontalBarPos) || isNaN(horizontalBarPos)) {
+                    horizontalBarPos = 0;
+                }
+                const dx = horizontalBarPos - oldHorizontalBarPos;
+                const canScroll = this.table.fireListeners(TABLE_EVENT_TYPE.SCROLL, {
                     event: event?.nativeEvent,
                     scrollTop: this.scroll.verticalBarPos,
-                    scrollLeft: this.scroll.horizontalBarPos,
+                    scrollLeft: horizontalBarPos,
                     scrollHeight: this.table.theme.scrollStyle?.width,
                     scrollWidth: this.table.theme.scrollStyle?.width,
                     viewHeight: this.table.tableNoFrameHeight,
                     viewWidth: this.table.tableNoFrameWidth,
                     scrollDirection: 'horizontal',
-                    scrollRatioX: xRatio
+                    scrollRatioX: xRatio,
+                    dx
                 });
+                if (canScroll.some(value => value === false)) {
+                    const xRatio = this.scroll.horizontalBarPos / (totalWidth - this.table.scenegraph.width);
+                    this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio);
+                    return;
+                }
+            }
+            if (left !== this.scroll.horizontalBarPos) {
+                this.updateHoverPos(-1, -1);
+            }
+            this.scroll.horizontalBarPos = left;
+            if (!isValid$3(this.scroll.horizontalBarPos) || isNaN(this.scroll.horizontalBarPos)) {
+                this.scroll.horizontalBarPos = 0;
+            }
+            this.table.scenegraph.setX(-left);
+            this.table.scenegraph.component.updateHorizontalScrollBarPos(xRatio);
+            if (oldHorizontalBarPos !== left && triggerEvent) {
                 this.checkHorizontalScrollBarEnd();
             }
         }
@@ -60202,7 +60287,7 @@
             return TABLE_EVENT_TYPE;
         }
         options;
-        version = "1.17.3-alpha.7";
+        version = "1.17.3-alpha.8";
         pagination;
         id = `VTable${Date.now()}`;
         headerStyleCache;
@@ -60814,10 +60899,7 @@
                 const { canvas } = this.internalProps;
                 widthP = (canvas.parentElement?.offsetWidth ?? 1) - (this.options.tableSizeAntiJitter ? 1 : 0);
                 heightP = (canvas.parentElement?.offsetHeight ?? 1) - (this.options.tableSizeAntiJitter ? 1 : 0);
-                if (this?.scenegraph?.stage) {
-                    this.scenegraph.stage.resize(widthP, heightP);
-                }
-                else {
+                if (!this?.scenegraph?.stage) {
                     canvas.style.width = '';
                     canvas.style.height = '';
                     canvas.width = widthP;
@@ -60825,6 +60907,21 @@
                     canvas.style.width = `${widthP}px`;
                     canvas.style.height = `${heightP}px`;
                 }
+                else if (this.options?.viewBox && !this.options?.canvas) {
+                    this.scenegraph.stage.resize(widthP, heightP);
+                }
+                if (this.options?.viewBox) {
+                    widthP = this.options.viewBox.x2 - this.options.viewBox.x1;
+                    heightP = this.options.viewBox.y2 - this.options.viewBox.y1;
+                }
+                if (this?.scenegraph?.stage) {
+                    if (this.options.viewBox) {
+                        this.scenegraph.stage.setViewBox(this.options.viewBox, false);
+                    }
+                    else {
+                        this.scenegraph.stage.resize(widthP, heightP);
+                    }
+                }
             }
             else if (Env.mode === 'node') {
                 widthP = this.canvasWidth - 1;
@@ -60852,8 +60949,8 @@
             }
         }
         updateViewBox(newViewBox) {
-            const oldWidth = this.options?.viewBox.x2 ?? 0 - this.options?.viewBox.x1 ?? 0;
-            const oldHeight = this.options?.viewBox.y2 ?? 0 - this.options?.viewBox.y1 ?? 0;
+            const oldWidth = (this.options?.viewBox?.x2 ?? 0) - (this.options?.viewBox?.x1 ?? 0);
+            const oldHeight = (this.options?.viewBox?.y2 ?? 0) - (this.options?.viewBox?.y1 ?? 0);
             const newWidth = newViewBox.x2 - newViewBox.x1;
             const newHeight = newViewBox.y2 - newViewBox.y1;
             this.options.viewBox = newViewBox;
@@ -75201,7 +75298,7 @@
                     let tree;
                     if (typeof extensionRow.rowTree === 'function') {
                         const fullCellIds = this.findFullCellIds(row_ids);
-                        tree = extensionRow.rowTree(fullCellIds.map(id => {
+                        tree = extensionRow.rowTree(fullCellIds.map((id) => {
                             return { dimensionKey: this._headerObjects[id].field, value: this._headerObjects[id].title };
                         }));
                     }
@@ -76092,6 +76189,7 @@
                 colHeaderPath.indicatorKey = colHeader.indicatorKey;
                 colHeaderPath.value = colHeader.value ?? this.getIndicatorInfoByIndicatorKey(colHeader.indicatorKey)?.title ?? '';
                 colHeaderPath.virtual = colHeader.virtual;
+                colHeaderPath.role = colHeader.role;
                 headerPaths.colHeaderPaths.push(colHeaderPath);
             });
             headerPathsWidthNode.rowHeaderPaths?.forEach((rowHeader) => {
@@ -76102,6 +76200,7 @@
                     rowHeaderPath.value =
                         rowHeader.value ?? this.getIndicatorInfoByIndicatorKey(rowHeader.indicatorKey)?.title ?? '';
                     rowHeaderPath.virtual = rowHeader.virtual;
+                    rowHeaderPath.role = rowHeader.role;
                     headerPaths.rowHeaderPaths.push(rowHeaderPath);
                 }
             });
@@ -76983,7 +77082,7 @@
                 if (isCol) {
                     continue;
                 }
-                for (let k = 0; k < rowArr?.length ?? 0; k++) {
+                for (let k = 0; k < (rowArr?.length ?? 0); k++) {
                     const dimension = rowArr[k];
                     if ((isValid$3(highlightDimension.dimensionKey) &&
                         dimension.dimensionKey === highlightDimension.dimensionKey &&
@@ -79167,7 +79266,8 @@
                                             value: indicator.title
                                         };
                                     })
-                                    : []
+                                    : [],
+                                role: 'sub-total'
                             };
                             curChild.push(totalChild);
                             curChild = totalChild.children ?? [];
@@ -79215,7 +79315,8 @@
                             indicatorKey: indicator.indicatorKey,
                             value: indicator.title
                         };
-                    }) ?? []
+                    }) ?? [],
+                    role: 'grand-total'
                 };
                 if (showGrandTotalsOnTop) {
                     result.unshift(node);
@@ -79355,7 +79456,7 @@
         }
         getFieldMatchColDimensionPaths(record) {
             const fieldMatchDimensionPaths = [];
-            for (let i = 0; i < this.customColTreeDimensionPaths?.length ?? 0; i++) {
+            for (let i = 0; i < (this.customColTreeDimensionPaths?.length ?? 0); i++) {
                 const dimensionPath = this.customColTreeDimensionPaths[i];
                 let isMatch = true;
                 for (let j = 0; j < dimensionPath.length; j++) {
@@ -79374,7 +79475,7 @@
         }
         getFieldMatchRowDimensionPaths(record) {
             const fieldMatchDimensionPaths = [];
-            for (let i = 0; i < this.customRowTreeDimensionPaths?.length ?? 0; i++) {
+            for (let i = 0; i < (this.customRowTreeDimensionPaths?.length ?? 0); i++) {
                 const dimensionPath = this.customRowTreeDimensionPaths[i];
                 let isMatch = true;
                 for (let j = 0; j < dimensionPath.length; j++) {
@@ -81003,6 +81104,33 @@
         getFilteredRecords() {
             return this.dataset?.filterRules;
         }
+        getCellPivotRole(col, row) {
+            const path = this.getCellHeaderPaths(col, row);
+            const { cellLocation, colHeaderPaths, rowHeaderPaths } = path;
+            let colRole = colHeaderPaths.length ? 'normal' : undefined;
+            let rowRole = rowHeaderPaths.length ? 'normal' : undefined;
+            colHeaderPaths.forEach((path) => {
+                if (path.role === 'sub-total') {
+                    colRole = 'sub-total';
+                }
+                else if (path.role === 'grand-total') {
+                    colRole = 'grand-total';
+                }
+            });
+            rowHeaderPaths.forEach((path) => {
+                if (path.role === 'sub-total') {
+                    rowRole = 'sub-total';
+                }
+                else if (path.role === 'grand-total') {
+                    rowRole = 'grand-total';
+                }
+            });
+            return {
+                colRole,
+                rowRole,
+                cellLocation
+            };
+        }
         setLoadingHierarchyState(col, row) {
             this.scenegraph.setLoadingHierarchyState(col, row);
         }
@@ -82749,7 +82877,7 @@
     }
 
     registerForVrender();
-    const version = "1.17.3-alpha.7";
+    const version = "1.17.3-alpha.8";
     function getIcons() {
         return get$2();
     }