@visactor/vtable-calendar 1.26.3 → 1.26.4-alpha.0

package/dist/vtable-calendar.js

@@ -38981,6 +38981,20 @@
         var _a, _b, _c;
         return null !== (_c = null === (_b = null === (_a = this.dataConfig) || void 0 === _a ? void 0 : _a.groupByRules) || void 0 === _b ? void 0 : _b.length) && void 0 !== _c ? _c : 0;
       }
+      refreshRecords(records = [], dataConfig, pagination, columns, rowHierarchyType, hierarchyExpandLevel) {
+        var _a;
+        this.clearCache(), this.beforeChangedRecordsMap.clear(), this.groupAggregator = null, this.addRecordRule = (null == dataConfig ? void 0 : dataConfig.addRecordRule) || "Object", this.dataConfig = dataConfig, this.columns = columns, this._isGrouped = isArray$5(null == dataConfig ? void 0 : dataConfig.groupByRules), this.rowHierarchyType = rowHierarchyType, this.dataSourceObj = {
+          get: index => records[index],
+          length: records.length,
+          records: records
+        }, this._source = this.processRecords(records), this.sourceLength = (null === (_a = this.source) || void 0 === _a ? void 0 : _a.length) || 0, this.sortedIndexMap.clear(), this._currentPagerIndexedData = [], this.userPagination = pagination, this.pagination = pagination || {
+          totalCount: this.sourceLength,
+          perPageCount: this.sourceLength,
+          currentPage: 0
+        }, this.hierarchyExpandLevel = hierarchyExpandLevel >= 1 ? hierarchyExpandLevel : 0, this.currentIndexedData = Array.from({
+          length: this.sourceLength
+        }, (_, i) => i), this.userPagination || (this.pagination.perPageCount = this.sourceLength, this.pagination.totalCount = this.sourceLength), "tree" === rowHierarchyType && this.initTreeHierarchyState(), this.updatePagerData();
+      }
       updateGroup() {
         var _a, _b, _c;
         this.clearCache();
@@ -39539,14 +39553,17 @@
         table.dataSource.hierarchyExpandLevel && table.refreshRowColCount(), table.render();
       })];
     }
-    function _setRecords(table, records = []) {
+    function getListTableRowHierarchyType(table) {
+      var _a, _b;
       const tableWithPlugins = table;
+      let rowHierarchyType = table.internalProps.layoutMap.rowHierarchyType;
+      return isArray$5(null === (_a = table.internalProps.dataConfig) || void 0 === _a ? void 0 : _a.groupByRules) && (rowHierarchyType = "tree"), (null === (_b = tableWithPlugins.pluginManager) || void 0 === _b ? void 0 : _b.getPluginByName("Master Detail Plugin")) && (rowHierarchyType = "grid"), rowHierarchyType;
+    }
+    function _setRecords(table, records = []) {
       _dealWithUpdateDataSource(table, () => {
-        var _a;
         table.internalProps.records = records;
-        let rowHierarchyType = table.internalProps.layoutMap.rowHierarchyType;
-        isArray$5(null === (_a = table.internalProps.dataConfig) || void 0 === _a ? void 0 : _a.groupByRules) && (rowHierarchyType = "tree"), tableWithPlugins.pluginManager.getPluginByName("Master Detail Plugin") && (rowHierarchyType = "grid");
-        const newDataSource = table.internalProps.dataSource = CachedDataSource.ofArray(records, table.internalProps.dataConfig, table.pagination, table.internalProps.columns, rowHierarchyType, getHierarchyExpandLevel(table));
+        const rowHierarchyType = getListTableRowHierarchyType(table),
+          newDataSource = table.internalProps.dataSource = CachedDataSource.ofArray(records, table.internalProps.dataConfig, table.pagination, table.internalProps.columns, rowHierarchyType, getHierarchyExpandLevel(table));
         table.addReleaseObj(newDataSource);
       });
     }
@@ -40336,7 +40353,7 @@
           col: null !== (_b = null == range ? void 0 : range.start.col) && void 0 !== _b ? _b : col,
           row: null !== (_c = null == range ? void 0 : range.start.row) && void 0 !== _c ? _c : row,
           dataValue: table.getCellOriginValue(col, row),
-          value: table.getCellValue(col, row),
+          value: table.getCellValue(col, row) || "",
           rect: {
             left: 0,
             top: 0,
@@ -40358,7 +40375,7 @@
           col: col,
           row: row,
           dataValue: table.getCellOriginValue(col, row),
-          value: table.getCellValue(col, row),
+          value: table.getCellValue(col, row) || "",
           rect: {
             left: 0,
             top: 0,
@@ -40922,7 +40939,7 @@
 
     function createCellContent(cellGroup, icons, textStr, padding, autoColWidth, autoRowHeight, autoWrapText, lineClamp, cellWidth, cellHeight, textAlign, textBaseline, table, cellTheme, range) {
       var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-      let contentWidth,
+      let contentWidth = 0,
         leftIconWidth = 0,
         rightIconWidth = 0,
         absoluteRightIconWidth = 0;
@@ -41002,8 +41019,8 @@
           }), contentRightIcons.forEach(icon => {
             const iconMark = dealWithIcon(icon, void 0, cellGroup.col, cellGroup.row, range, table, dealWithIconComputeVar);
             iconMark.role = "icon-content-right", iconMark.name = icon.name, cellContent.addRightOccupyingIcon(iconMark);
-          }), cellContent.addContent(textMark), cellGroup.appendChild(cellContent), cellContent.layout(), contentWidth = cellContent.AABBBounds.width(), cellContent.AABBBounds.height();
-        } else cellGroup.firstChild ? cellGroup.insertBefore(textMark, cellGroup.firstChild) : cellGroup.appendChild(textMark), contentWidth = textMark.AABBBounds.width(), textMark.AABBBounds.height();
+          }), cellContent.addContent(textMark), cellGroup.appendChild(cellContent), cellContent.layout(), autoColWidth && (contentWidth = cellContent.AABBBounds.width());
+        } else cellGroup.firstChild ? cellGroup.insertBefore(textMark, cellGroup.firstChild) : cellGroup.appendChild(textMark), autoColWidth && (contentWidth = textMark.AABBBounds.width());
       } else if (isValid$1(textStr)) {
         const {
             text: text,
@@ -41027,7 +41044,7 @@
             keepCenterInLine: !0
           },
           wrapText = new Text(cellTheme.text ? Object.assign({}, cellTheme.text, attribute) : attribute);
-        wrapText.name = "text", wrapText.textBaseline = textBaseline, cellGroup.appendChild(wrapText), contentWidth = wrapText.AABBBounds.width(), wrapText.AABBBounds.height();
+        wrapText.name = "text", wrapText.textBaseline = textBaseline, cellGroup.appendChild(wrapText), autoColWidth && (contentWidth = wrapText.AABBBounds.width());
       }
       const width = autoColWidth ? leftIconWidth + contentWidth + rightIconWidth : cellWidth - (padding[1] + padding[3]),
         height = cellHeight - (padding[0] + padding[2]);
@@ -41485,7 +41502,7 @@
       }
     }
 
-    function createCell(type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult) {
+    function createCell(type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult, headerStyle) {
       var _a, _b;
       let cellGroup,
         isAsync = !1;
@@ -41520,7 +41537,7 @@
           customElementsGroup: customElementsGroup,
           renderDefault: renderDefault
         } = _generateCustomElementsGroup(table, define, col, row, cellWidth, cellHeight, padding, range, customResult);
-        cellGroup = Factory.getFunction("createTextCellGroup")(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, mayHaveIcon, customElementsGroup, renderDefault, cellTheme, range, isAsync);
+        cellGroup = Factory.getFunction("createTextCellGroup")(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, mayHaveIcon, customElementsGroup, renderDefault, cellTheme, range, isAsync, headerStyle);
         const axisConfig = table.internalProps.layoutMap.getAxisConfigInPivotChart(col, row);
         if (axisConfig) {
           const axis = new (Factory.getComponent("axis"))(axisConfig, cellGroup.attribute.width, cellGroup.attribute.height, null !== (_a = axisConfig.__vtableBodyChartCellPadding) && void 0 !== _a ? _a : padding, table);
@@ -41543,20 +41560,20 @@
           } = _generateCustomElementsGroup(table, define, col, row, cellWidth, cellHeight, padding, range, customResult),
           style = table._getCellStyle(col, row),
           dataValue = table.getCellOriginValue(col, row);
-        cellGroup = Factory.getFunction("createTextCellGroup")(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, mayHaveIcon, customElementsGroup, renderDefault, cellTheme, range, isAsync);
+        cellGroup = Factory.getFunction("createTextCellGroup")(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, mayHaveIcon, customElementsGroup, renderDefault, cellTheme, range, isAsync, headerStyle);
         const progressBarGroup = Factory.getFunction("createProgressBarCell")(define, style, colWidth, value, dataValue, col, row, padding, table, range);
         cellGroup.firstChild ? cellGroup.insertBefore(progressBarGroup, cellGroup.firstChild) : cellGroup.appendChild(progressBarGroup);
       } else if ("sparkline" === type) {
         cellGroup = Factory.getFunction("createSparkLineCellGroup")(null, columnGroup, 0, y, col, row, cellWidth, cellHeight, padding, table, cellTheme, isAsync);
       } else if ("checkbox" === type) {
         if ("isAggregation" in table.internalProps.layoutMap && table.internalProps.layoutMap.isAggregation(col, row)) {
-          cellGroup = Factory.getFunction("createTextCellGroup")(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, !1, void 0, !0, cellTheme, range, isAsync);
+          cellGroup = Factory.getFunction("createTextCellGroup")(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, !1, void 0, !0, cellTheme, range, isAsync, headerStyle);
         } else {
           cellGroup = Factory.getFunction("createCheckboxCellGroup")(null, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, mayHaveIcon, table, cellTheme, define, range, isAsync, !1);
         }
       } else if ("radio" === type) {
         if ("isAggregation" in table.internalProps.layoutMap && table.internalProps.layoutMap.isAggregation(col, row)) {
-          cellGroup = Factory.getFunction("createTextCellGroup")(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, !1, void 0, !0, cellTheme, range, isAsync);
+          cellGroup = Factory.getFunction("createTextCellGroup")(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, !1, void 0, !0, cellTheme, range, isAsync, headerStyle);
         } else {
           cellGroup = Factory.getFunction("createRadioCellGroup")(null, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, table, cellTheme, define, range);
         }
@@ -42347,7 +42364,7 @@
           col: null !== (_b = null == cellRange ? void 0 : cellRange.start.col) && void 0 !== _b ? _b : col,
           row: null !== (_c = null == cellRange ? void 0 : cellRange.start.row) && void 0 !== _c ? _c : row,
           dataValue: table.getCellOriginValue(col, row),
-          value: table.getCellValue(col, row),
+          value: table.getCellValue(col, row) || "",
           rect: getCellRect$1(col, row, table),
           table: table,
           originCol: col,
@@ -46528,7 +46545,7 @@
           col: null !== (_b = null == cellRange ? void 0 : cellRange.start.col) && void 0 !== _b ? _b : col,
           row: null !== (_c = null == cellRange ? void 0 : cellRange.start.row) && void 0 !== _c ? _c : row,
           dataValue: table.getCellOriginValue(col, row),
-          value: table.getCellValue(col, row),
+          value: table.getCellValue(col, row) || "",
           rect: getCellRect(col, row, table),
           table: table,
           originCol: col,
@@ -46768,6 +46785,7 @@
           isMerge,
           customStyle,
           customResult,
+          rawRecord,
           cellLocation = table.getCellLocation(col, row),
           value = table.getCellValue(col, row),
           cellWidth = colWidth,
@@ -46797,17 +46815,17 @@
         const isAggregation = "isAggregation" in table.internalProps.layoutMap && table.internalProps.layoutMap.isAggregation(col, row),
           isSeriesNumber = table.internalProps.layoutMap.isSeriesNumber(col, row);
         let mayHaveIcon = "body" !== cellLocation || ((null == define ? void 0 : define.dragOrder) || !!(null == define ? void 0 : define.icon) || !!(null == define ? void 0 : define.tree)) && !(isAggregation && isSeriesNumber);
-        if (!range && (table.internalProps.enableTreeNodeMerge || "body" !== cellLocation || (null == define ? void 0 : define.mergeCell)) && (range = table.getCellRange(col, row), isMerge = range.start.col !== range.end.col || range.start.row !== range.end.row, isMerge)) {
+        if (!range && (table.internalProps.enableTreeNodeMerge || "body" !== cellLocation || (null == define ? void 0 : define.mergeCell)) && (table.internalProps.enableTreeNodeMerge && "body" === cellLocation && !(null == define ? void 0 : define.mergeCell) ? (rawRecord = table.getCellRawRecord(col, row), (null == rawRecord ? void 0 : rawRecord.vtableMerge) && (range = table.getCellRange(col, row), isMerge = range.start.col !== range.end.col || range.start.row !== range.end.row)) : (range = table.getCellRange(col, row), isMerge = range.start.col !== range.end.col || range.start.row !== range.end.row), isMerge)) {
           const mergeSize = dealMerge(range, mergeMap, table, rowStart > range.start.row);
           cellWidth = mergeSize.cellWidth, cellHeight = mergeSize.cellHeight;
         }
         let isVtableMerge = !1;
         if (table.internalProps.enableTreeNodeMerge && isMerge) {
-          const rawRecord = table.getCellRawRecord(range.start.col, range.start.row),
-            {
-              vtableMergeName: vtableMergeName,
-              vtableMerge: vtableMerge
-            } = null != rawRecord ? rawRecord : {};
+          rawRecord = null != rawRecord ? rawRecord : table.getCellRawRecord(range.start.col, range.start.row);
+          const {
+            vtableMergeName: vtableMergeName,
+            vtableMerge: vtableMerge
+          } = null != rawRecord ? rawRecord : {};
           isVtableMerge = vtableMerge, vtableMerge && (mayHaveIcon = !0, table.internalProps.groupTitleCustomLayout && (customResult = dealWithCustom(table.internalProps.groupTitleCustomLayout, void 0, range.start.col, range.start.row, table.getColsWidth(range.start.col, range.end.col), table.getRowsHeight(range.start.row, range.end.row), !1, table.isAutoRowHeight(row), [0, 0, 0, 0], range, table)), table.internalProps.groupTitleFieldFormat ? value = table.internalProps.groupTitleFieldFormat(rawRecord, col, row, table) : void 0 !== vtableMergeName && (value = vtableMergeName));
         }
         const type = isVtableMerge || isCustomMerge ? "text" : table.getCellType(col, row);
@@ -46837,7 +46855,7 @@
           const cellStyle = customStyle || table._getCellStyle(range ? range.start.col : col, range ? range.start.row : row),
             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, cellTheme.group.height = Array.isArray(defaultRowHeight) ? defaultRowHeight[row] : defaultRowHeight, cellTheme._vtable.padding && (padding = cellTheme._vtable.padding), cellTheme.text.textAlign && (textAlign = cellTheme.text.textAlign), cellTheme.text.textBaseline && (textBaseline = cellTheme.text.textBaseline), "body" === cellLocation || cellTheme.group.fill || (cellTheme.group.fill = "#fff");
-          const cellGroup = createCell(type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult);
+          const cellGroup = createCell(type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult, cellStyle);
           if (columnGroup.updateColumnRowNumber(row), isMerge) {
             const rangeHeight = table.getRowHeight(row),
               {
@@ -46879,7 +46897,7 @@
         } = createCellArgs,
         cellStyle = customStyle || table._getCellStyle(range ? range.start.col : col, range ? range.start.row : row),
         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, cellTheme.group.height = Array.isArray(defaultRowHeight) ? defaultRowHeight[row] : defaultRowHeight, cellTheme._vtable.padding && (padding = cellTheme._vtable.padding), cellTheme.text.textAlign && (textAlign = cellTheme.text.textAlign), cellTheme.text.textBaseline && (textBaseline = cellTheme.text.textBaseline), "body" === cellLocation || cellTheme.group.fill || (cellTheme.group.fill = "#fff"), createCell(type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult);
+      cellTheme.group.cornerRadius = getCellCornerRadius(col, row, table), cellTheme.group.width = colWidth, cellTheme.group.height = Array.isArray(defaultRowHeight) ? defaultRowHeight[row] : defaultRowHeight, cellTheme._vtable.padding && (padding = cellTheme._vtable.padding), cellTheme.text.textAlign && (textAlign = cellTheme.text.textAlign), cellTheme.text.textBaseline && (textBaseline = cellTheme.text.textBaseline), "body" === cellLocation || cellTheme.group.fill || (cellTheme.group.fill = "#fff"), createCell(type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult, cellStyle);
     }
     function dealMerge(range, mergeMap, table, forceUpdate) {
       let cellWidth = 0,
@@ -50329,16 +50347,28 @@
         updateContainerChildrenX(this.rightFrozenGroup, rightStartX), updateContainerChildrenX(this.rightTopCornerGroup, rightStartX), updateContainerChildrenX(this.rightBottomCornerGroup, rightStartX), this.updateNextFrame();
       }
       updateContainerAttrHeightAndY() {
-        var _a, _b, _c;
-        for (let i = 0; i < this.cornerHeaderGroup.children.length; i++) updateContainerChildrenY(this.cornerHeaderGroup.children[i], 0);
-        for (let i = 0; i < this.colHeaderGroup.children.length; i++) updateContainerChildrenY(this.colHeaderGroup.children[i], 0);
-        for (let i = 0; i < this.rightTopCornerGroup.children.length; i++) updateContainerChildrenY(this.rightTopCornerGroup.children[i], 0);
-        for (let i = 0; i < this.rowHeaderGroup.children.length; i++) this.rowHeaderGroup.children[i].firstChild && updateContainerChildrenY(this.rowHeaderGroup.children[i], this.rowHeaderGroup.children[i].firstChild.row > 0 ? this.table.getRowsHeight(null !== (_a = this.table.frozenRowCount) && void 0 !== _a ? _a : 0, this.rowHeaderGroup.children[i].firstChild.row - 1) : 0);
-        for (let i = 0; i < this.bodyGroup.children.length; i++) this.bodyGroup.children[i].firstChild && updateContainerChildrenY(this.bodyGroup.children[i], this.bodyGroup.children[i].firstChild.row > 0 ? this.table.getRowsHeight(null !== (_b = this.table.frozenRowCount) && void 0 !== _b ? _b : 0, this.bodyGroup.children[i].firstChild.row - 1) : 0);
-        for (let i = 0; i < this.rightFrozenGroup.children.length; i++) this.rightFrozenGroup.children[i].firstChild && updateContainerChildrenY(this.rightFrozenGroup.children[i], this.rightFrozenGroup.children[i].firstChild.row > 0 ? this.table.getRowsHeight(null !== (_c = this.table.frozenRowCount) && void 0 !== _c ? _c : 0, this.rightFrozenGroup.children[i].firstChild.row - 1) : 0);
-        for (let i = 0; i < this.leftBottomCornerGroup.children.length; i++) updateContainerChildrenY(this.leftBottomCornerGroup.children[i], 0);
-        for (let i = 0; i < this.bottomFrozenGroup.children.length; i++) updateContainerChildrenY(this.bottomFrozenGroup.children[i], 0);
-        for (let i = 0; i < this.rightBottomCornerGroup.children.length; i++) updateContainerChildrenY(this.rightBottomCornerGroup.children[i], 0);
+        this.cornerHeaderGroup.forEachChildrenSkipChild(column => {
+          updateContainerChildrenY(column, 0);
+        }), this.colHeaderGroup.forEachChildrenSkipChild(column => {
+          updateContainerChildrenY(column, 0);
+        }), this.rightTopCornerGroup.forEachChildrenSkipChild(column => {
+          updateContainerChildrenY(column, 0);
+        }), this.rowHeaderGroup.forEachChildrenSkipChild(column => {
+          var _a;
+          column.firstChild && updateContainerChildrenY(column, column.firstChild.row > 0 ? this.table.getRowsHeight(null !== (_a = this.table.frozenRowCount) && void 0 !== _a ? _a : 0, column.firstChild.row - 1) : 0);
+        }), this.bodyGroup.forEachChildrenSkipChild(column => {
+          var _a;
+          column.firstChild && updateContainerChildrenY(column, column.firstChild.row > 0 ? this.table.getRowsHeight(null !== (_a = this.table.frozenRowCount) && void 0 !== _a ? _a : 0, column.firstChild.row - 1) : 0);
+        }), this.rightFrozenGroup.forEachChildrenSkipChild(column => {
+          var _a;
+          column.firstChild && updateContainerChildrenY(column, column.firstChild.row > 0 ? this.table.getRowsHeight(null !== (_a = this.table.frozenRowCount) && void 0 !== _a ? _a : 0, column.firstChild.row - 1) : 0);
+        }), this.leftBottomCornerGroup.forEachChildrenSkipChild(column => {
+          updateContainerChildrenY(column, 0);
+        }), this.bottomFrozenGroup.forEachChildrenSkipChild(column => {
+          updateContainerChildrenY(column, 0);
+        }), this.rightBottomCornerGroup.forEachChildrenSkipChild(column => {
+          updateContainerChildrenY(column, 0);
+        });
       }
       updateContainer(updateConfig = {
         async: !1,
@@ -53285,73 +53315,70 @@
         });
       }), table.scenegraph.tableGroup.addEventListener("pointerup", e => {
         var _a, _b, _c, _d, _e, _f, _g, _h;
-        if (0 !== e.button) return;
-        const endedResizeCol = stateManager.isResizeCol(),
-          endedResizeRow = stateManager.isResizeRow(),
-          endedMoveCol = stateManager.isMoveCol(),
-          shouldSkipClickCell = endedResizeCol || endedResizeRow;
-        if ("grabing" === stateManager.interactionState) {
-          if (stateManager.updateInteractionState(InteractionState.default), endedResizeCol) endResizeCol(table);else if (endedResizeRow) endResizeRow(table);else if (endedMoveCol) {
-            const endMoveColSuccess = table.stateManager.endMoveCol();
-            fireMoveColEventListeners(table, endMoveColSuccess, e.nativeEvent);
-          } else if (stateManager.isSelecting()) {
-            table.stateManager.endSelectCells(), table.stateManager.isFillHandle() && table.stateManager.endFillSelect();
+        if (0 === e.button) {
+          if ("grabing" === stateManager.interactionState) {
+            if (stateManager.updateInteractionState(InteractionState.default), stateManager.isResizeCol()) endResizeCol(table);else if (stateManager.isResizeRow()) endResizeRow(table);else if (stateManager.isMoveCol()) {
+              const endMoveColSuccess = table.stateManager.endMoveCol();
+              fireMoveColEventListeners(table, endMoveColSuccess, e.nativeEvent);
+            } else if (stateManager.isSelecting()) {
+              table.stateManager.endSelectCells(), table.stateManager.isFillHandle() && table.stateManager.endFillSelect();
+              const eventArgsSet = getEventArgsSet(e);
+              if (table.eventManager.isDraging && eventArgsSet.eventArgs && table.hasListeners(TABLE_EVENT_TYPE.DRAG_SELECT_END)) {
+                const cellsEvent = {
+                  event: e.nativeEvent,
+                  cells: [],
+                  col: eventArgsSet.eventArgs.target.col,
+                  row: eventArgsSet.eventArgs.target.row,
+                  scaleRatio: table.canvas.getBoundingClientRect().width / table.canvas.offsetWidth,
+                  target: null === (_a = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target,
+                  mergeCellInfo: null === (_b = eventArgsSet.eventArgs) || void 0 === _b ? void 0 : _b.mergeInfo
+                };
+                cellsEvent.cells = table.getSelectedCellInfos(), table.fireListeners(TABLE_EVENT_TYPE.DRAG_SELECT_END, cellsEvent);
+              }
+            }
+          } else stateManager.interactionState === InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.default);
+          if (!table.eventManager.isDraging) {
             const eventArgsSet = getEventArgsSet(e);
-            if (table.eventManager.isDraging && eventArgsSet.eventArgs && table.hasListeners(TABLE_EVENT_TYPE.DRAG_SELECT_END)) {
-              const cellsEvent = {
+            if (!eventManager.isTouchMove && 0 === e.button && eventArgsSet.eventArgs && table.hasListeners(TABLE_EVENT_TYPE.CLICK_CELL)) {
+              const {
+                  col: col,
+                  row: row
+                } = eventArgsSet.eventArgs,
+                cellInfo = table.getCellInfo(col, row);
+              let icon, position;
+              if (null === (_c = eventArgsSet.eventArgs) || void 0 === _c ? void 0 : _c.target) {
+                const iconInfo = getIconAndPositionFromTarget(null === (_d = eventArgsSet.eventArgs) || void 0 === _d ? void 0 : _d.target);
+                iconInfo && (icon = iconInfo.icon, position = iconInfo.position);
+              }
+              const cellsEvent = Object.assign(Object.assign({}, cellInfo), {
                 event: e.nativeEvent,
+                federatedEvent: e,
                 cells: [],
-                col: eventArgsSet.eventArgs.target.col,
-                row: eventArgsSet.eventArgs.target.row,
-                scaleRatio: table.canvas.getBoundingClientRect().width / table.canvas.offsetWidth,
-                target: null === (_a = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target,
-                mergeCellInfo: null === (_b = eventArgsSet.eventArgs) || void 0 === _b ? void 0 : _b.mergeInfo
-              };
-              cellsEvent.cells = table.getSelectedCellInfos(), table.fireListeners(TABLE_EVENT_TYPE.DRAG_SELECT_END, cellsEvent);
+                targetIcon: icon ? {
+                  name: icon.name,
+                  position: position,
+                  funcType: icon.attribute.funcType
+                } : void 0,
+                target: null === (_e = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _e ? void 0 : _e.target,
+                mergeCellInfo: null === (_f = eventArgsSet.eventArgs) || void 0 === _f ? void 0 : _f.mergeInfo
+              });
+              table.fireListeners(TABLE_EVENT_TYPE.CLICK_CELL, cellsEvent);
             }
           }
-        } else stateManager.interactionState === InteractionState.scrolling && stateManager.updateInteractionState(InteractionState.default);
-        if (!table.eventManager.isDraging && !shouldSkipClickCell) {
-          const eventArgsSet = getEventArgsSet(e);
-          if (!eventManager.isTouchMove && 0 === e.button && eventArgsSet.eventArgs && table.hasListeners(TABLE_EVENT_TYPE.CLICK_CELL)) {
-            const {
-                col: col,
-                row: row
-              } = eventArgsSet.eventArgs,
-              cellInfo = table.getCellInfo(col, row);
-            let icon, position;
-            if (null === (_c = eventArgsSet.eventArgs) || void 0 === _c ? void 0 : _c.target) {
-              const iconInfo = getIconAndPositionFromTarget(null === (_d = eventArgsSet.eventArgs) || void 0 === _d ? void 0 : _d.target);
-              iconInfo && (icon = iconInfo.icon, position = iconInfo.position);
-            }
-            const cellsEvent = Object.assign(Object.assign({}, cellInfo), {
+          if (table.hasListeners(TABLE_EVENT_TYPE.MOUSEUP_CELL)) {
+            const eventArgsSet = getEventArgsSet(e);
+            eventArgsSet.eventArgs && table.fireListeners(TABLE_EVENT_TYPE.MOUSEUP_CELL, {
+              col: eventArgsSet.eventArgs.col,
+              row: eventArgsSet.eventArgs.row,
               event: e.nativeEvent,
-              federatedEvent: e,
-              cells: [],
-              targetIcon: icon ? {
-                name: icon.name,
-                position: position,
-                funcType: icon.attribute.funcType
-              } : void 0,
-              target: null === (_e = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _e ? void 0 : _e.target,
-              mergeCellInfo: null === (_f = eventArgsSet.eventArgs) || void 0 === _f ? void 0 : _f.mergeInfo
+              target: null === (_g = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _g ? void 0 : _g.target,
+              mergeCellInfo: null === (_h = eventArgsSet.eventArgs) || void 0 === _h ? void 0 : _h.mergeInfo
             });
-            table.fireListeners(TABLE_EVENT_TYPE.CLICK_CELL, cellsEvent);
           }
+          setTimeout(() => {
+            eventManager.isDown = !1, eventManager.isTouchdown = !1, eventManager.isTouchMove = !1, eventManager.isDraging = !1, eventManager.touchMovePoints = [];
+          }, 0);
         }
-        if (table.hasListeners(TABLE_EVENT_TYPE.MOUSEUP_CELL)) {
-          const eventArgsSet = getEventArgsSet(e);
-          eventArgsSet.eventArgs && table.fireListeners(TABLE_EVENT_TYPE.MOUSEUP_CELL, {
-            col: eventArgsSet.eventArgs.col,
-            row: eventArgsSet.eventArgs.row,
-            event: e.nativeEvent,
-            target: null === (_g = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _g ? void 0 : _g.target,
-            mergeCellInfo: null === (_h = eventArgsSet.eventArgs) || void 0 === _h ? void 0 : _h.mergeInfo
-          });
-        }
-        setTimeout(() => {
-          eventManager.isDown = !1, eventManager.isTouchdown = !1, eventManager.isTouchMove = !1, eventManager.isDraging = !1, eventManager.touchMovePoints = [];
-        }, 0);
       }), table.scenegraph.tableGroup.addEventListener("rightdown", e => {
         var _a, _b, _c, _d, _e, _f, _g, _h;
         const eventArgsSet = getEventArgsSet(e);
@@ -57169,7 +57196,7 @@
       }
       constructor(container, options = {}) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
-        if (super(), this.showFrozenIcon = !0, this._scrollToRowCorrectTimer = null, this._tableBorderWidth_left = 0, this._tableBorderWidth_right = 0, this._tableBorderWidth_top = 0, this._tableBorderWidth_bottom = 0, this.version = "1.26.3", this.id = `VTable${Date.now()}`, this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = throttle2(this.render.bind(this), 200), "undefined" != typeof window) {
+        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.26.2", 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__ = {
@@ -58228,7 +58255,7 @@
         const internalProps = this.internalProps;
         if ("node" === Env.mode || options.canvas || updateRootElementPadding(internalProps.element, this.padding), this.columnWidthComputeMode = null !== (_d = options.columnWidthComputeMode) && void 0 !== _d ? _d : "normal", internalProps.frozenColCount = frozenColCount, 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 === (_e = null != enableCheckboxCascade ? enableCheckboxCascade : null == rowSeriesNumber ? void 0 : rowSeriesNumber.enableTreeCheckbox) || void 0 === _e || _e, internalProps.enableHeaderCheckboxCascade = enableCheckboxCascade || null == enableHeaderCheckboxCascade || enableHeaderCheckboxCascade, internalProps.columnResizeMode = null !== (_f = null == resize ? void 0 : resize.columnResizeMode) && void 0 !== _f ? _f : columnResizeMode, internalProps.canResizeColumn = null == resize ? void 0 : resize.canResizeColumn, internalProps.rowResizeMode = null !== (_g = null == resize ? void 0 : resize.rowResizeMode) && void 0 !== _g ? _g : rowResizeMode, internalProps.dragHeaderMode = null !== (_j = null !== (_h = null == dragOrder ? void 0 : dragOrder.dragHeaderMode) && void 0 !== _h ? _h : dragHeaderMode) && void 0 !== _j ? _j : "none", internalProps.renderChartAsync = renderChartAsync, setBatchRenderChartCount(renderChartAsyncBatchCount), internalProps.overscrollBehavior = null != overscrollBehavior ? overscrollBehavior : "auto", internalProps.cellTextOverflows = {}, internalProps.groupBy = null !== (_k = null == groupConfig ? void 0 : groupConfig.groupBy) && void 0 !== _k ? _k : groupBy, internalProps.groupTitleCheckbox = null == groupConfig ? void 0 : groupConfig.titleCheckbox, internalProps.groupTitleFieldFormat = null !== (_l = null == groupConfig ? void 0 : groupConfig.titleFieldFormat) && void 0 !== _l ? _l : groupTitleFieldFormat, internalProps.groupTitleCustomLayout = null !== (_m = null == groupConfig ? void 0 : groupConfig.titleCustomLayout) && void 0 !== _m ? _m : groupTitleCustomLayout, internalProps.enableTreeStickCell = null !== (_o = null == groupConfig ? void 0 : groupConfig.enableTreeStickCell) && void 0 !== _o ? _o : enableTreeStickCell, (null == updateConfig ? void 0 : updateConfig.clearColWidthCache) && (internalProps._widthResizedColMap.clear(), this.colWidthsMap = new NumberMap(), this.colContentWidthsMap = new NumberMap(), this.colWidthsLimit = {}), (null == updateConfig ? void 0 : updateConfig.clearRowHeightCache) && (internalProps._heightResizedRowMap.clear(), internalProps._rowHeightsMap = new NumberRangeMap(this), internalProps._rowRangeHeightsMap = new Map(), internalProps._colRangeWidthsMap = new Map()), internalProps.stick.changedCells.clear(), internalProps.theme = themes.of(null !== (_p = options.theme) && void 0 !== _p ? _p : themes.DEFAULT), internalProps.theme.isPivot = this.isPivotTable(), setIconColor(internalProps.theme.functionalIconsStyle), this.scenegraph.updateStageBackground(), internalProps.autoWrapText = options.autoWrapText, internalProps.enableLineBreak = options.enableLineBreak, internalProps.allowFrozenColCount = null !== (_q = options.allowFrozenColCount) && void 0 !== _q ? _q : 0, internalProps.limitMaxAutoWidth = null !== (_r = options.limitMaxAutoWidth) && void 0 !== _r ? _r : 450, internalProps.limitMinWidth = null != limitMinWidth ? "number" == typeof limitMinWidth ? limitMinWidth : limitMinWidth ? 10 : 0 : 10, internalProps.limitMinHeight = null != limitMinHeight ? "number" == typeof limitMinHeight ? limitMinHeight : limitMinHeight ? 10 : 0 : 10, null === (_s = internalProps.legends) || void 0 === _s || _s.forEach(legend => {
           null == legend || legend.release();
-        }), null === (_t = internalProps.title) || void 0 === _t || _t.release(), internalProps.title = null, null === (_u = internalProps.emptyTip) || void 0 === _u || _u.release(), internalProps.emptyTip = null, internalProps.layoutMap.release(), clearChartRenderQueue(), this.scenegraph.clearCells(), this.scenegraph.updateComponent(), this.stateManager.updateOptionSetState(), this._updateSize(), this.eventManager.updateEventBinder(), options.legends) {
+        }), null === (_t = internalProps.title) || void 0 === _t || _t.release(), internalProps.title = null, null === (_u = internalProps.emptyTip) || void 0 === _u || _u.release(), internalProps.emptyTip = null, internalProps.layoutMap.release(), clearChartRenderQueue(), (null == updateConfig ? void 0 : updateConfig.skipClearCells) || this.scenegraph.clearCells(), this.scenegraph.updateComponent(), this.stateManager.updateOptionSetState(), this._updateSize(), this.eventManager.updateEventBinder(), options.legends) {
           internalProps.legends = [];
           const createLegend = Factory.getFunction("createLegend");
           if (Array.isArray(options.legends)) {
@@ -62254,14 +62281,19 @@
         clearRowHeightCache: !0
       }) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-        const internalProps = this.internalProps;
-        if (this.pluginManager.removeOrAddPlugins(options.plugins), super.updateOption(options, updateConfig), internalProps.frozenColDragHeaderMode = null !== (_b = null === (_a = options.dragOrder) || void 0 === _a ? void 0 : _a.frozenColDragHeaderMode) && void 0 !== _b ? _b : options.frozenColDragHeaderMode, this.pagination = options.pagination, internalProps.sortState = options.sortState, internalProps.dataConfig = this.internalProps.groupBy ? getGroupByDataConfig(this.internalProps.groupBy, options.addRecordRule) : {
+        const internalProps = this.internalProps,
+          prevSortState = internalProps.sortState,
+          hasActiveSortState = (Array.isArray(options.sortState) ? options.sortState : options.sortState ? [options.sortState] : []).some(item => (null == item ? void 0 : item.field) && (null == item ? void 0 : item.order) && "normal" !== item.order),
+          shouldSkipInitialClearCells = Boolean(options.records) || !!options.dataSource && this.dataSource !== options.dataSource;
+        if (this.pluginManager.removeOrAddPlugins(options.plugins), super.updateOption(options, Object.assign(Object.assign({}, updateConfig), {
+          skipClearCells: shouldSkipInitialClearCells
+        })), internalProps.frozenColDragHeaderMode = null !== (_b = null === (_a = options.dragOrder) || void 0 === _a ? void 0 : _a.frozenColDragHeaderMode) && void 0 !== _b ? _b : options.frozenColDragHeaderMode, this.pagination = options.pagination, internalProps.sortState = options.sortState, internalProps.dataConfig = this.internalProps.groupBy ? getGroupByDataConfig(this.internalProps.groupBy, options.addRecordRule) : {
           addRecordRule: options.addRecordRule
         }, this.showHeader = null === (_c = options.showHeader) || void 0 === _c || _c, internalProps.columns = options.columns ? cloneDeepSpec(options.columns, ["children"]) : options.header ? cloneDeepSpec(options.header, ["children"]) : [], generateAggregationForColumn(this), internalProps.enableTreeNodeMerge = null !== (_e = null !== (_d = options.enableTreeNodeMerge) && void 0 !== _d ? _d : isValid$1(this.internalProps.groupBy)) && void 0 !== _e && _e, this.internalProps.headerHelper.setTableColumnsEditor(), this.transpose = null !== (_f = options.transpose) && void 0 !== _f && _f, this.refreshHeader(), this.internalProps.useOneRowHeightFillAll = !1, this.internalProps.columnWidthConfig = options.columnWidthConfig, this.internalProps.rowHeightConfig = options.rowHeightConfig, internalProps.releaseList) for (let i = internalProps.releaseList.length - 1; i >= 0; i--) {
           const releaseObj = internalProps.releaseList[i];
           releaseObj instanceof DataSource ? releaseObj.updateColumns(this.internalProps.columns) : (null === (_g = null == releaseObj ? void 0 : releaseObj.release) || void 0 === _g || _g.call(releaseObj), internalProps.releaseList.splice(i, 1));
         }
-        if (options.dataSource && this.dataSource !== options.dataSource ? this.dataSource = options.dataSource : options.records ? this.setRecords(options.records, {
+        if (options.dataSource && this.dataSource !== options.dataSource ? this.dataSource = options.dataSource : options.records && options.records === internalProps.records && options.sortState === prevSortState && !hasActiveSortState && this.dataSource instanceof CachedDataSource ? this._refreshCurrentRecordsForOptionUpdate(options.records) : options.records ? this.setRecords(options.records, {
           sortState: options.sortState
         }) : (this.refreshRowColCount(), this._resetFrozenColCount(), this.scenegraph.createSceneGraph(), this.render()), options.title) {
           const Title = Factory.getComponent("title");
@@ -62277,6 +62309,22 @@
           setTimeout(resolve, 0);
         });
       }
+      _refreshCurrentRecordsForOptionUpdate(records) {
+        var _a;
+        const dataSource = this.dataSource;
+        this.stateManager.endResizeIfResizing(), clearChartRenderQueue();
+        const oldHoverState = {
+          col: this.stateManager.hover.cellPos.col,
+          row: this.stateManager.hover.cellPos.row
+        };
+        this.scenegraph.clearCells(), this.internalProps.records = records, dataSource.refreshRecords(records, this.internalProps.dataConfig, this.pagination, this.internalProps.columns, getListTableRowHierarchyType(this), getHierarchyExpandLevel(this)), this.refreshRowColCount(), this.stateManager.initCheckedState(records), this.clearCellStyleCache(), this.scenegraph.createSceneGraph(), this.stateManager.updateHoverPos(oldHoverState.col, oldHoverState.row), this._updateSize();
+        (null !== (_a = this.options.componentLayoutOrder) && void 0 !== _a ? _a : ["legend", "title"]).forEach(component => {
+          var _a, _b;
+          "legend" === component ? null === (_a = this.internalProps.legends) || void 0 === _a || _a.forEach(legend => {
+            null == legend || legend.resize();
+          }) : "title" === component && (null === (_b = this.internalProps.title) || void 0 === _b || _b.resize());
+        }), this.scenegraph.resize(), this.render();
+      }
       updatePagination(pagination) {
         this.pagination && ("number" == typeof pagination.currentPage && pagination.currentPage >= 0 && (this.pagination.currentPage = pagination.currentPage), pagination.perPageCount && (this.pagination.perPageCount = pagination.perPageCount || this.pagination.perPageCount), this.internalProps.layoutMap.clearCellRangeMap(), this.internalProps.useOneRowHeightFillAll = !1, this.scenegraph.clearCells(), this.dataSource.updatePagination(this.pagination), this.refreshRowColCount(), this.stateManager.initCheckedState(this.records), this.scenegraph.createSceneGraph(), this.renderAsync());
       }
@@ -66182,10 +66230,10 @@
       }
     }
 
-    function createCellGroup(table, value, columnGroup, xOrigin, yOrigin, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, mayHaveIcon, customElementsGroup, renderDefault, cellTheme, range, isAsync) {
+    function createCellGroup(table, value, columnGroup, xOrigin, yOrigin, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, mayHaveIcon, customElementsGroup, renderDefault, cellTheme, range, isAsync, headerStyle) {
       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, _5, _6, _7, _8;
-      const headerStyle = table._getCellStyle(col, row),
-        functionalPadding = getFunctionalProp("padding", headerStyle, col, row, table);
+      headerStyle = headerStyle || table._getCellStyle(col, row);
+      const functionalPadding = getFunctionalProp("padding", headerStyle, col, row, table);
       isValid$1(functionalPadding) && (padding = functionalPadding), (null === (_a = null == cellTheme ? void 0 : cellTheme.text) || void 0 === _a ? void 0 : _a.textAlign) && (textAlign = null === (_b = null == cellTheme ? void 0 : cellTheme.text) || void 0 === _b ? void 0 : _b.textAlign), (null === (_c = null == cellTheme ? void 0 : cellTheme.text) || void 0 === _c ? void 0 : _c.textBaseline) && (textBaseline = null === (_d = null == cellTheme ? void 0 : cellTheme.text) || void 0 === _d ? void 0 : _d.textBaseline);
       const autoRowHeight = table.isAutoRowHeight(row),
         autoColWidth = "auto" === colWidth,