@visactor/vtable-gantt 1.7.5-alpha.0 → 1.7.5

package/dist/vtable-gantt.js

@@ -19758,7 +19758,7 @@
 
     let registed = !1;
     function registerForVrender() {
-      registed || (registed = !0, preLoadAllModule(), isBrowserEnv() ? loadBrowserEnv(container) : isNodeEnv() && loadNodeEnv(container), registerArc(), registerCircle(), registerGroup(), registerImage(), registerLine(), registerRect(), registerRichtext(), registerShadowRoot(), registerSymbol(), registerText(), registerFlexLayoutPlugin(), loadPoptip());
+      registed || (registed = !0, preLoadAllModule(), isBrowserEnv() ? loadBrowserEnv(container) : isNodeEnv() && loadNodeEnv(container), registerArc(), registerCircle(), registerGroup(), registerImage(), registerLine(), registerRect(), registerRichtext(), registerShadowRoot(), registerSymbol(), registerText(), registerFlexLayoutPlugin(), loadPoptip(), registerFlexLayoutPlugin());
     }
 
     class Grid {
@@ -19808,22 +19808,25 @@
             });
             this.group.name = 'grid-container';
             scene.tableGroup.addChild(this.group);
-            const horizontalSplitLineWidth = scene._gantt.parsedOptions.timelineHeaderHorizontalLineStyle?.lineWidth;
+            this.createVerticalLines();
+            this.createHorizontalLines();
+            const horizontalSplitLineWidth = scene._gantt.parsedOptions.horizontalSplitLine?.lineWidth ??
+                scene._gantt.parsedOptions.timelineHeaderHorizontalLineStyle?.lineWidth;
+            const bottomLineY = (horizontalSplitLineWidth & 1 ? -0.5 : 0) + horizontalSplitLineWidth / 2;
             const line = createLine({
                 pickable: false,
-                stroke: scene._gantt.parsedOptions.timelineHeaderHorizontalLineStyle?.lineColor,
-                lineWidth: horizontalSplitLineWidth,
+                stroke: scene._gantt.parsedOptions.horizontalSplitLine?.lineColor ??
+                    scene._gantt.parsedOptions.timelineHeaderHorizontalLineStyle?.lineColor,
+                lineWidth: horizontalSplitLineWidth + (horizontalSplitLineWidth & 1 ? 1 : 0),
                 points: [
-                    { x: 0, y: horizontalSplitLineWidth & 1 ? 0.5 : 0 },
+                    { x: 0, y: bottomLineY },
                     {
                         x: scene._gantt._getAllColsWidth(),
-                        y: horizontalSplitLineWidth & 1 ? 0.5 : 0
+                        y: bottomLineY
                     }
                 ]
             });
             this.group.addChild(line);
-            this.createVerticalLines();
-            this.createHorizontalLines();
         }
         createVerticalLines() {
             if (this.vertical) {
@@ -20813,30 +20816,13 @@
         return Math.round(progress);
     }
     function createSplitLineAndResizeLine(gantt) {
-        if (gantt.parsedOptions.horizontalSplitLine) {
-            gantt.horizontalSplitLine = document.createElement('div');
-            gantt.horizontalSplitLine.style.position = 'absolute';
-            gantt.horizontalSplitLine.style.top = gantt.getAllHeaderRowsHeight() + 'px';
-            gantt.horizontalSplitLine.style.left = gantt.tableY + 'px';
-            gantt.horizontalSplitLine.style.height = (gantt.parsedOptions.horizontalSplitLine.lineWidth ?? 2) + 'px';
-            gantt.horizontalSplitLine.style.width =
-                gantt.tableNoFrameWidth +
-                    (gantt.taskListTableInstance?.tableNoFrameWidth ?? 0) +
-                    +(gantt.taskListTableInstance ? gantt.parsedOptions.verticalSplitLine.lineWidth : 0) +
-                    'px';
-            gantt.horizontalSplitLine.style.backgroundColor = gantt.parsedOptions.horizontalSplitLine.lineColor;
-            gantt.horizontalSplitLine.style.zIndex = '100';
-            gantt.horizontalSplitLine.style.userSelect = 'none';
-            gantt.horizontalSplitLine.style.opacity = '1';
-            gantt.container.appendChild(gantt.horizontalSplitLine);
-        }
         if (gantt.taskListTableInstance) {
             gantt.verticalSplitResizeLine = document.createElement('div');
             gantt.verticalSplitResizeLine.style.position = 'absolute';
             gantt.verticalSplitResizeLine.style.top = gantt.tableY + 'px';
-            gantt.verticalSplitResizeLine.style.left = gantt.taskTableWidth
-                ? `${gantt.taskTableWidth - 7 + gantt.parsedOptions.verticalSplitLine.lineWidth / 2}px`
-                : '0px';
+            gantt.verticalSplitResizeLine.style.left =
+                (gantt.taskTableWidth ? gantt.taskTableWidth - 7 + gantt.parsedOptions.verticalSplitLine.lineWidth / 2 : 0) +
+                    'px';
             gantt.verticalSplitResizeLine.style.width = '14px';
             gantt.verticalSplitResizeLine.style.height = gantt.drawHeight + 'px';
             gantt.verticalSplitResizeLine.style.backgroundColor = 'rgba(0,0,0,0)';
@@ -20876,21 +20862,6 @@
         }
     }
     function updateSplitLineAndResizeLine(gantt) {
-        if (gantt.horizontalSplitLine) {
-            gantt.horizontalSplitLine.style.position = 'absolute';
-            gantt.horizontalSplitLine.style.top = gantt.getAllHeaderRowsHeight() + 'px';
-            gantt.horizontalSplitLine.style.left = gantt.tableY + 'px';
-            gantt.horizontalSplitLine.style.height = (gantt.parsedOptions.horizontalSplitLine.lineWidth ?? 2) + 'px';
-            gantt.horizontalSplitLine.style.width =
-                gantt.tableNoFrameWidth +
-                    (gantt.taskListTableInstance?.tableNoFrameWidth ?? 0) +
-                    (gantt.taskListTableInstance ? gantt.parsedOptions.verticalSplitLine.lineWidth : 0) +
-                    'px';
-            gantt.horizontalSplitLine.style.backgroundColor = gantt.parsedOptions.horizontalSplitLine.lineColor;
-            gantt.horizontalSplitLine.style.zIndex = '100';
-            gantt.horizontalSplitLine.style.userSelect = 'none';
-            gantt.horizontalSplitLine.style.opacity = '1';
-        }
         if (gantt.verticalSplitResizeLine) {
             gantt.verticalSplitResizeLine.style.position = 'absolute';
             gantt.verticalSplitResizeLine.style.top = gantt.tableY + 'px';
@@ -21493,12 +21464,10 @@
             }
         }
         resize() {
-            this._scene._gantt.parsedOptions.outerFrameStyle;
+            const { cornerRadius, borderColor, borderLineWidth, borderLineDash } = this._scene._gantt.parsedOptions.outerFrameStyle;
             this.border.setAttributes({
-                width: this._scene.tableGroup.attribute.width +
-                    this.border.attribute.lineWidth +
-                    this._scene._gantt.parsedOptions.verticalSplitLine.lineWidth,
-                height: this._scene.tableGroup.attribute.height + this.border.attribute.lineWidth
+                width: this._scene._gantt.tableNoFrameWidth + borderLineWidth,
+                height: this._scene._gantt.tableNoFrameHeight + borderLineWidth
             });
         }
     }
@@ -22420,6 +22389,9 @@
       for (let i = 0; i < array.length; i++) -1 === result.indexOf(array[i]) && result.push(array[i]);
       return result;
     }
+    function traverseObject(obj, childrenProperty, callback) {
+      callback(obj), (null == obj ? void 0 : obj[childrenProperty]) && Array.isArray(null == obj ? void 0 : obj[childrenProperty]) && obj[childrenProperty].forEach(child => traverseObject(child, childrenProperty, callback));
+    }
 
     const isNode = "undefined" == typeof window || void 0 === window.window;
     let arrayFind, arrayFindIndex;
@@ -22804,7 +22776,7 @@
       off(id) {
         var _a;
         if ("node" === Env.mode) return;
-        if (null == id) return;
+        if (null === id) return;
         const obj = null === (_a = this.listeners) || void 0 === _a ? void 0 : _a[id];
         obj && (delete this.listeners[id], obj.target.removeEventListener && obj.target.removeEventListener(obj.type, obj.listener, ...obj.options));
       }
@@ -24455,7 +24427,7 @@
       }
       value() {
         var _a;
-        return (null === (_a = this.records) || void 0 === _a ? void 0 : _a.length) >= 1 ? this.sum : 0;
+        return (null === (_a = this.records) || void 0 === _a ? void 0 : _a.length) >= 1 ? this.sum : void 0;
       }
       positiveValue() {
         return this.positiveSum;
@@ -24796,7 +24768,7 @@
         };
       }
       pushChildrenNode(indexKey, hierarchyState, nodeData) {
-        var _a;
+        var _a, _b;
         if (!hierarchyState || hierarchyState === HierarchyState.collapse || hierarchyState === HierarchyState.none) return 0;
         let childrenLength = 0;
         const children = nodeData.filteredChildren ? nodeData.filteredChildren : nodeData.children;
@@ -24804,15 +24776,17 @@
           const subNodeSortedIndexArray = Array.from({
             length: children.length
           }, (_, i) => i);
-          this.lastOrder && "normal" !== this.lastOrder && this.lastOrderField && sort(index => isValid$1(subNodeSortedIndexArray[index]) ? subNodeSortedIndexArray[index] : subNodeSortedIndexArray[index] = index, (index, rel) => {
-            subNodeSortedIndexArray[index] = rel;
-          }, children.length, this.lastOrderFn, this.lastOrder, index => this.getOriginalField(Array.isArray(indexKey) ? indexKey.concat([index]) : [indexKey, index], this.lastOrderField));
+          null === (_a = this.lastSortStates) || void 0 === _a || _a.forEach(state => {
+            "normal" !== state.order && sort(index => isValid$1(subNodeSortedIndexArray[index]) ? subNodeSortedIndexArray[index] : subNodeSortedIndexArray[index] = index, (index, rel) => {
+              subNodeSortedIndexArray[index] = rel;
+            }, children.length, state.orderFn, state.order, index => this.getOriginalField(Array.isArray(indexKey) ? indexKey.concat([index]) : [indexKey, index], state.field));
+          });
           for (let i = 0; i < subNodeSortedIndexArray.length; i++) {
             childrenLength += 1;
             const childIndex = Array.isArray(indexKey) ? indexKey.concat([subNodeSortedIndexArray[i]]) : [indexKey, subNodeSortedIndexArray[i]];
             this.currentIndexedData.splice(this.currentIndexedData.indexOf(indexKey) + childrenLength, 0, childIndex);
             const childData = this.getOriginalRecord(childIndex);
-            !childData.hierarchyState && (null !== (_a = childData.filteredChildren) && void 0 !== _a ? _a : childData.children) && (childData.hierarchyState = HierarchyState.collapse), childrenLength += this.pushChildrenNode(childIndex, childData.hierarchyState, children[subNodeSortedIndexArray[i]]);
+            !childData.hierarchyState && (null !== (_b = childData.filteredChildren) && void 0 !== _b ? _b : childData.children) && (childData.hierarchyState = HierarchyState.collapse), childrenLength += this.pushChildrenNode(childIndex, childData.hierarchyState, children[subNodeSortedIndexArray[i]]);
           }
         }
         return childrenLength;
@@ -24938,30 +24912,48 @@
         }
         this.sortedIndexMap.clear();
       }
-      sort(field, order) {
-        let orderFn = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "desc" !== order ? (v1, v2) => v1 === v2 ? 0 : v1 > v2 ? 1 : -1 : (v1, v2) => v1 === v2 ? 0 : v1 < v2 ? 1 : -1;
-        this.lastOrderField = field, this.lastOrder = order, this.lastOrderFn = orderFn;
-        let orderedData,
-          filedMap = this.sortedIndexMap.get(field);
-        if (filedMap && (orderedData = filedMap[order], orderedData && orderedData.length > 0)) return this.currentIndexedData = orderedData, this.updatePagerData(), void this.fireListeners(EVENT_TYPE$1.CHANGE_ORDER, null);
-        const sortedIndexArray = [];
-        if ("normal" === order) for (let i = 0; i < this._sourceLength; i++) sortedIndexArray[i] = i;else sort(index => isValid$1(sortedIndexArray[index]) ? sortedIndexArray[index] : sortedIndexArray[index] = index, (index, rel) => {
-          sortedIndexArray[index] = rel;
-        }, this._sourceLength, orderFn, order, index => this.getOriginalField(index, field));
-        if (this.currentIndexedData = sortedIndexArray, this.hierarchyExpandLevel) {
+      sort(states) {
+        states = (Array.isArray(states) ? states : [states]).filter(state => {
+          var _a;
+          let column = this.layoutColumnObjects.find(obj => obj.field == state.field);
+          return !1 !== (null === (_a = null == column ? void 0 : column.define) || void 0 === _a ? void 0 : _a.sort) && "normal" !== state.order;
+        }), this.lastSortStates = states;
+        let filedMapArray = states.map(state => this.sortedIndexMap.get(null == state ? void 0 : state.field) || {
+            asc: [],
+            desc: [],
+            normal: []
+          }),
+          orderedData = null;
+        if (filedMapArray.length > 0 && (orderedData = states.reduce((data, state, index) => {
+          var _a;
+          const currentData = null === (_a = filedMapArray[index]) || void 0 === _a ? void 0 : _a[state.order];
+          return currentData && currentData.length > 0 ? currentData : data;
+        }, null), orderedData && orderedData.length > 0)) return this.currentIndexedData = orderedData, this.updatePagerData(), void this.fireListeners(EVENT_TYPE$1.CHANGE_ORDER, null);
+        const sortedIndexArray = Array.from({
+          length: this._sourceLength
+        }, (_, i) => i);
+        if (sortedIndexArray.sort((indexA, indexB) => states.reduce((result, state) => {
+          if (0 !== result) return result;
+          return (state.orderFn || ("desc" !== state.order ? (v1, v2) => v1 === v2 ? 0 : v1 > v2 ? 1 : -1 : (v1, v2) => v1 === v2 ? 0 : v1 < v2 ? 1 : -1))(this.getOriginalField(indexA, state.field), this.getOriginalField(indexB, state.field), state.order);
+        }, 0)), this.currentIndexedData = sortedIndexArray, this.hierarchyExpandLevel) {
           let nodeLength = sortedIndexArray.length;
-          window.performance.now();
           for (let i = 0; i < nodeLength; i++) {
             const record = this.getOriginalRecord(sortedIndexArray[i]),
               subNodeLength = this.pushChildrenNode(sortedIndexArray[i], record.hierarchyState, this.getOriginalRecord(sortedIndexArray[i]));
             nodeLength += subNodeLength, i += subNodeLength;
           }
         }
-        filedMap || (filedMap = {
-          asc: [],
-          desc: [],
-          normal: []
-        }, this.sortedIndexMap.set(field, filedMap)), filedMap[order] = sortedIndexArray, this.updatePagerData(), this.fireListeners(EVENT_TYPE$1.CHANGE_ORDER, null);
+        if (!filedMapArray.length) {
+          filedMapArray = states.map(() => ({
+            asc: [],
+            desc: [],
+            normal: []
+          }));
+          for (let index = 0; index < states.length; index++) this.sortedIndexMap.set(states[index].field, filedMapArray[index]);
+        }
+        states.forEach((state, index) => {
+          filedMapArray[index][state.order] = sortedIndexArray.slice();
+        }), this.updatePagerData(), this.fireListeners(EVENT_TYPE$1.CHANGE_ORDER, null);
       }
       setSortedIndexMap(field, filedMap) {
         this.sortedIndexMap.set(field, filedMap);
@@ -25002,8 +24994,10 @@
         }, (_, i) => i), this.userPagination || (this.pagination.perPageCount = this._sourceLength, this.pagination.totalCount = this._sourceLength, "tree" === this.rowHierarchyType && this.initTreeHierarchyState()), this.updatePagerData();
       }
       clearSortedIndexMap() {
-        this.lastOrderField && this.lastOrder && this.sortedIndexMap.forEach((sortMap, key) => {
-          key !== this.lastOrderField ? this.sortedIndexMap.delete(key) : "asc" === this.lastOrder ? (sortMap.desc = [], sortMap.normal = []) : "desc" === this.lastOrder ? (sortMap.asc = [], sortMap.normal = []) : (sortMap.desc = [], sortMap.asc = []);
+        this.lastSortStates && this.lastSortStates.length > 0 && this.sortedIndexMap.forEach((sortMap, key) => {
+          this.lastSortStates.some(state => state.field === key) ? this.lastSortStates.forEach(state => {
+            "asc" === state.order ? (sortMap.desc = [], sortMap.normal = []) : "desc" === state.order ? (sortMap.asc = [], sortMap.normal = []) : (sortMap.asc = [], sortMap.desc = []);
+          }) : this.sortedIndexMap.delete(key);
         });
       }
       get sourceLength() {
@@ -25084,8 +25078,8 @@
         return !0;
       }
       reorderRecord(sourceIndex, targetIndex) {
-        var _a;
-        if ("asc" !== this.lastOrder && "desc" !== this.lastOrder && this.isCanExchangeOrder(sourceIndex, targetIndex)) if (this.hasHierarchyStateExpand) {
+        var _a, _b;
+        if (!(null === (_a = this.lastSortStates) || void 0 === _a ? void 0 : _a.some(state => "asc" === state.order || "desc" === state.order)) && this.isCanExchangeOrder(sourceIndex, targetIndex)) if (this.hasHierarchyStateExpand) {
           let sourceI,
             targetI,
             sourceIndexs = this.currentPagerIndexedData[sourceIndex],
@@ -25098,7 +25092,7 @@
             if (sourceI = sourceIndexs.splice(sourceIndexs.length - 1, 1)[0], targetI = targetIndexs.splice(targetIndexs.length - 1, 1)[0], sourceIndexs.length >= 1) {
               const parent = this.getOriginalRecord(sourceIndexs),
                 sourceIds = parent.filteredChildren ? parent.filteredChildren.splice(sourceI, 1) : parent.children.splice(sourceI, 1);
-              sourceIds.unshift(targetI, 0), Array.prototype.splice.apply(null !== (_a = parent.filteredChildren) && void 0 !== _a ? _a : parent.children, sourceIds);
+              sourceIds.unshift(targetI, 0), Array.prototype.splice.apply(null !== (_b = parent.filteredChildren) && void 0 !== _b ? _b : parent.children, sourceIds);
             } else {
               const sourceIds = this.records.splice(sourceI, 1);
               sourceIds.unshift(targetI, 0), Array.prototype.splice.apply(this.records, sourceIds);
@@ -25207,7 +25201,7 @@
         _setFieldCache(this._fieldCache, index, field, value);
       }
       recordPromiseCallBack(index, record) {
-        this._recordCache[index] = record;
+        this._recordCache && (this._recordCache[index] = record);
       }
       get records() {
         return Array.isArray(this._recordCache) && this._recordCache.length > 0 ? this._recordCache : super.records;
@@ -25249,8 +25243,8 @@
           length: this.sourceLength
         }, (_, i) => i), this.userPagination || (this.pagination.perPageCount = this.sourceLength, this.pagination.totalCount = this.sourceLength), this.initTreeHierarchyState(), this.updatePagerData();
       }
-      addRecordsForGroup(recordArr) {
-        isArray$1(recordArr) && 0 !== recordArr.length && (this.dataSourceObj.records.push(...recordArr), this.updateGroup());
+      addRecordsForGroup(recordArr, recordIndex) {
+        isArray$1(recordArr) && 0 !== recordArr.length && ((void 0 === recordIndex || recordIndex > this.dataSourceObj.records) && (recordIndex = this.dataSourceObj.records), this.dataSourceObj.records.splice(recordIndex, 0, ...recordArr), this.updateGroup());
       }
       deleteRecordsForGroup(recordIndexs) {
         if (!isArray$1(recordIndexs) || 0 === recordIndexs.length) return;
@@ -27304,10 +27298,14 @@
     }
 
     function createCell(type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult) {
-      var _a;
+      var _a, _b;
       let cellGroup,
         isAsync = !1;
-      if (isPromise(value) && (value = table.getCellValue(col, row), isAsync = !0), "text" === type || "link" === type || customResult) {
+      if (isPromise(value)) {
+        if ("cell" !== table.scenegraph.highPerformanceGetCell(col, row).role) return cellGroup;
+        value = table.getCellValue(col, row), isAsync = !0;
+      }
+      if ("text" === type || "link" === type || customResult) {
         if ("link" === type) {
           const cellValue = value,
             headerStyle = table._getCellStyle(col, row);
@@ -27332,7 +27330,7 @@
         cellGroup = Factory.getFunction("createTextCellGroup")(table, value, columnGroup, 0, y, col, row, colWidth, cellWidth, cellHeight, padding, textAlign, textBaseline, mayHaveIcon, customElementsGroup, renderDefault, cellTheme, range, isAsync);
         const axisConfig = table.internalProps.layoutMap.getAxisConfigInPivotChart(col, row);
         if (axisConfig) {
-          const axis = new (Factory.getComponent("axis"))(axisConfig, cellGroup.attribute.width, cellGroup.attribute.height, padding, table);
+          const axis = new (Factory.getComponent("axis"))(axisConfig, cellGroup.attribute.width, cellGroup.attribute.height, null !== (_a = axisConfig.__vtablePadding) && void 0 !== _a ? _a : padding, table);
           cellGroup.clear(), cellGroup.appendChild(axis.component), axis.overlap();
         } else table.internalProps.layoutMap.isEmpty(col, row) ? (cellGroup.setAttributes({
           fill: !1,
@@ -27344,7 +27342,7 @@
         cellGroup = Factory.getFunction("createVideoCellGroup")(columnGroup, 0, y, col, row, cellWidth, cellHeight, define.keepAspectRatio, define.imageAutoSizing, padding, textAlign, textBaseline, mayHaveIcon, table, cellTheme, range, isAsync);
       } else if ("chart" === type) {
         const chartInstance = table.internalProps.layoutMap.getChartInstance(col, row);
-        cellGroup = Factory.getFunction("createChartCellGroup")(null, columnGroup, 0, y, col, row, cellWidth, cellHeight, padding, value, define.chartModule, table.internalProps.layoutMap.getChartSpec(col, row), chartInstance, null !== (_a = table.internalProps.layoutMap.getChartDataId(col, row)) && void 0 !== _a ? _a : "data", table, cellTheme, table.internalProps.layoutMap.isShareChartSpec(col, row), isAsync);
+        cellGroup = Factory.getFunction("createChartCellGroup")(null, columnGroup, 0, y, col, row, cellWidth, cellHeight, padding, value, define.chartModule, table.internalProps.layoutMap.getChartSpec(col, row), chartInstance, null !== (_b = table.internalProps.layoutMap.getChartDataId(col, row)) && void 0 !== _b ? _b : "data", table, cellTheme, table.internalProps.layoutMap.isShareChartSpec(col, row), isAsync);
       } else if ("progressbar" === type) {
         const style = table._getCellStyle(col, row),
           dataValue = table.getCellOriginValue(col, row);
@@ -27369,7 +27367,8 @@
         cellTheme,
         customStyle,
         customResult,
-        value = table.getCellValue(col, row);
+        value = table.getCellValue(col, row),
+        isCustomMerge = !1;
       if (table.internalProps.customMergeCell) {
         const customMerge = table.getCustomMerge(col, row);
         if (customMerge) {
@@ -27380,7 +27379,7 @@
             customLayout: customLayout,
             customRender: customRender
           } = customMerge;
-          range = customMergeRange, isMerge = range.start.col !== range.end.col || range.start.row !== range.end.row, value = customMergeText, customStyle = customMergeStyle, customStyle && (cellTheme = getStyleTheme(customStyle, table, range.start.col, range.start.row, getProp).theme, cellTheme.group.cornerRadius = getCellCornerRadius(col, row, table)), (customLayout || customRender) && (customResult = dealWithCustom(customLayout, customRender, customMergeRange.start.col, customMergeRange.start.row, table.getColsWidth(customMergeRange.start.col, customMergeRange.end.col), table.getRowsHeight(customMergeRange.start.row, customMergeRange.end.row), !1, table.isAutoRowHeight(row), [0, 0, 0, 0], range, table));
+          range = customMergeRange, isMerge = range.start.col !== range.end.col || range.start.row !== range.end.row, value = customMergeText, customStyle = customMergeStyle, customStyle && (cellTheme = getStyleTheme(customStyle, table, range.start.col, range.start.row, getProp).theme, cellTheme.group.cornerRadius = getCellCornerRadius(col, row, table)), (customLayout || customRender) && (customResult = dealWithCustom(customLayout, customRender, customMergeRange.start.col, customMergeRange.start.row, table.getColsWidth(customMergeRange.start.col, customMergeRange.end.col), table.getRowsHeight(customMergeRange.start.row, customMergeRange.end.row), !1, table.isAutoRowHeight(row), [0, 0, 0, 0], range, table)), isCustomMerge = !0;
         }
       }
       let colForDefine = col,
@@ -27389,13 +27388,13 @@
       const define = "body" !== cellLocation ? table.getHeaderDefine(colForDefine, rowForDefine) : table.getBodyColumnDefine(colForDefine, rowForDefine);
       let mayHaveIcon = "body" !== cellLocation || (null == define ? void 0 : define.dragOrder) || !!(null == define ? void 0 : define.icon) || !!(null == define ? void 0 : define.tree);
       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);
-      let isvtableMerge = !1;
+      let isVtableMerge = !1;
       if (table.internalProps.enableTreeNodeMerge && isMerge) {
         const {
           vtableMergeName: vtableMergeName,
           vtableMerge: vtableMerge
         } = table.getCellRawRecord(range.start.col, range.start.row);
-        isvtableMerge = vtableMerge, vtableMerge && (mayHaveIcon = !0, table.options.groupTitleCustomLayout && (customResult = dealWithCustom(table.options.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))), vtableMergeName && (value = vtableMergeName);
+        isVtableMerge = vtableMerge, vtableMerge && (mayHaveIcon = !0, table.options.groupTitleCustomLayout && (customResult = dealWithCustom(table.options.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))), vtableMergeName && (value = vtableMergeName);
       }
       const cellStyle = table._getCellStyle(range ? range.start.col : col, range ? range.start.row : row),
         autoWrapText = null !== (_a = cellStyle.autoWrapText) && void 0 !== _a ? _a : table.internalProps.autoWrapText;
@@ -27457,7 +27456,7 @@
         return oldCellGroup;
       }
       if (!addNew && "empty" === oldCellGroup.role) return;
-      const type = isvtableMerge ? "text" : table.isHeader(col, row) ? table._getHeaderLayoutMap(col, row).headerType : table.getBodyColumnType(col, row),
+      const type = isVtableMerge || isCustomMerge ? "text" : table.isHeader(col, row) ? table._getHeaderLayoutMap(col, row).headerType : table.getBodyColumnType(col, row),
         padding = cellTheme._vtable.padding,
         textAlign = cellTheme.text.textAlign,
         textBaseline = cellTheme.text.textBaseline;
@@ -28186,7 +28185,9 @@
       var _a, _b, _c;
       if (cell.attribute.height === distHeight && !cell.needUpdateHeight) return;
       cell.needUpdateHeight = !1, cell.setAttribute("height", distHeight);
-      const type = (null === (_a = scene.table.getCellRawRecord(col, row)) || void 0 === _a ? void 0 : _a.vtableMerge) ? "text" : scene.table.isHeader(col, row) ? scene.table._getHeaderLayoutMap(col, row).headerType : scene.table.getBodyColumnType(col, row);
+      const isVtableMerge = null === (_a = scene.table.getCellRawRecord(col, row)) || void 0 === _a ? void 0 : _a.vtableMerge,
+        isCustomMerge = !!scene.table.getCustomMerge(col, row),
+        type = isVtableMerge || isCustomMerge ? "text" : scene.table.isHeader(col, row) ? scene.table._getHeaderLayoutMap(col, row).headerType : scene.table.getBodyColumnType(col, row);
       if ("progressbar" === type) {
         const columnDefine = scene.table.getBodyColumnDefine(col, row),
           style = scene.table._getCellStyle(col, row),
@@ -28373,13 +28374,15 @@
       }
     }
     function updateCellWidth(scene, cell, col, row, oldWidth, distWidth, detaX, isHeader, autoWrapText) {
-      var _a, _b, _c, _d, _e, _f;
+      var _a, _b, _c, _d, _e, _f, _g;
       if (cell.attribute.width === distWidth && !cell.needUpdateWidth) return !1;
       cell.needUpdateWidth = !1, cell.setAttribute("width", distWidth);
       const cellGroup = cell;
       if (!cellGroup) return !1;
       const autoRowHeight = scene.table.isAutoRowHeight(row),
-        type = (null === (_a = scene.table.getCellRawRecord(col, row)) || void 0 === _a ? void 0 : _a.vtableMerge) ? "text" : scene.table.isHeader(col, row) ? scene.table._getHeaderLayoutMap(col, row).headerType : scene.table.getBodyColumnType(col, row);
+        isVtableMerge = null === (_a = scene.table.getCellRawRecord(col, row)) || void 0 === _a ? void 0 : _a.vtableMerge,
+        isCustomMerge = !!scene.table.getCustomMerge(col, row),
+        type = isVtableMerge || isCustomMerge ? "text" : scene.table.isHeader(col, row) ? scene.table._getHeaderLayoutMap(col, row).headerType : scene.table.getBodyColumnType(col, row);
       let isHeightChange = !1;
       if ("progressbar" === type) {
         const columnDefine = scene.table.getBodyColumnDefine(col, row),
@@ -28404,10 +28407,10 @@
           cellStyle = scene.table._getCellStyle(col, row),
           padding = getQuadProps(getProp("padding", cellStyle, col, row, scene.table));
         if (axisConfig) {
-          const axis = new (Factory.getComponent("axis"))(axisConfig, cellGroup.attribute.width, cellGroup.attribute.height, padding, scene.table);
+          const axis = new (Factory.getComponent("axis"))(axisConfig, cellGroup.attribute.width, cellGroup.attribute.height, null !== (_c = axisConfig.__vtablePadding) && void 0 !== _c ? _c : padding, scene.table);
           cellGroup.clear(), cellGroup.appendChild(axis.component), axis.overlap();
         }
-      } else if ("axis" === (null === (_c = cell.firstChild) || void 0 === _c ? void 0 : _c.name)) null === (_d = cell.firstChild) || void 0 === _d || _d.originAxis.resize(cell.attribute.width, cell.attribute.height);else {
+      } else if ("axis" === (null === (_d = cell.firstChild) || void 0 === _d ? void 0 : _d.name)) null === (_e = cell.firstChild) || void 0 === _e || _e.originAxis.resize(cell.attribute.width, cell.attribute.height);else {
         let renderDefault = !0;
         const customContainer = cell.getChildByName(CUSTOM_CONTAINER_NAME) || cell.getChildByName(CUSTOM_MERGE_CONTAINER_NAME);
         if (customContainer) {
@@ -28439,7 +28442,7 @@
               let width = cellGroup.attribute.width,
                 height = cellGroup.attribute.height;
               isMergeCellGroup(cellGroup) && (width = scene.table.getColsWidth(cellGroup.mergeStartCol, cellGroup.mergeEndCol), height = scene.table.getRowsHeight(cellGroup.mergeStartRow, cellGroup.mergeEndRow));
-              const customResult = dealWithCustom(customLayout, customRender, null !== (_e = cellGroup.mergeStartCol) && void 0 !== _e ? _e : col, null !== (_f = cellGroup.mergeStartRow) && void 0 !== _f ? _f : row, width, height, !1, scene.table.isAutoRowHeight(row), padding, isMergeCellGroup(cellGroup) ? {
+              const customResult = dealWithCustom(customLayout, customRender, null !== (_f = cellGroup.mergeStartCol) && void 0 !== _f ? _f : col, null !== (_g = cellGroup.mergeStartRow) && void 0 !== _g ? _g : row, width, height, !1, scene.table.isAutoRowHeight(row), padding, isMergeCellGroup(cellGroup) ? {
                 start: {
                   col: cellGroup.mergeStartCol,
                   row: cellGroup.mergeStartRow
@@ -29566,6 +29569,7 @@
     }
     function updateFrameBorder(group, frameTheme, strokeArray) {
       var _a;
+      if (!frameTheme) return;
       const {
         borderColor: borderColor
       } = frameTheme;
@@ -30980,7 +30984,8 @@
           customResult,
           value = table.getCellValue(col, row),
           cellWidth = colWidth,
-          cellHeight = table.getRowHeight(row);
+          cellHeight = table.getRowHeight(row),
+          isCustomMerge = !1;
         if (table.internalProps.customMergeCell) {
           const customMerge = table.getCustomMerge(col, row);
           if (customMerge) {
@@ -30995,7 +31000,7 @@
               const mergeSize = dealMerge(range, mergeMap, table, rowStart > range.start.row);
               cellWidth = mergeSize.cellWidth, cellHeight = mergeSize.cellHeight;
             }
-            value = customMergeText, customStyle = customMergeStyle, (customLayout || customRender) && (customResult = dealWithCustom(customLayout, customRender, customMergeRange.start.col, customMergeRange.start.row, table.getColsWidth(customMergeRange.start.col, customMergeRange.end.col), table.getRowsHeight(customMergeRange.start.row, customMergeRange.end.row), !1, table.isAutoRowHeight(row), [0, 0, 0, 0], range, table));
+            value = customMergeText, customStyle = customMergeStyle, (customLayout || customRender) && (customResult = dealWithCustom(customLayout, customRender, customMergeRange.start.col, customMergeRange.start.row, table.getColsWidth(customMergeRange.start.col, customMergeRange.end.col), table.getRowsHeight(customMergeRange.start.row, customMergeRange.end.row), !1, table.isAutoRowHeight(row), [0, 0, 0, 0], range, table)), isCustomMerge = !0;
           }
         }
         let colForDefine = col,
@@ -31007,18 +31012,18 @@
           const mergeSize = dealMerge(range, mergeMap, table, rowStart > range.start.row);
           cellWidth = mergeSize.cellWidth, cellHeight = mergeSize.cellHeight;
         }
-        let isvtableMerge = !1;
+        let isVtableMerge = !1;
         if (table.internalProps.enableTreeNodeMerge && isMerge) {
           const {
             vtableMergeName: vtableMergeName,
             vtableMerge: vtableMerge
           } = table.getCellRawRecord(range.start.col, range.start.row);
-          isvtableMerge = vtableMerge, vtableMerge && (mayHaveIcon = !0, table.options.groupTitleCustomLayout && (customResult = dealWithCustom(table.options.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))), vtableMergeName && (value = vtableMergeName);
+          isVtableMerge = vtableMerge, vtableMerge && (mayHaveIcon = !0, table.options.groupTitleCustomLayout && (customResult = dealWithCustom(table.options.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))), vtableMergeName && (value = vtableMergeName);
         }
         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 type = isvtableMerge ? "text" : (table.isHeader(col, row) ? table._getHeaderLayoutMap(col, row).headerType : table.getBodyColumnType(col, row)) || "text";
+        const type = isVtableMerge || isCustomMerge ? "text" : (table.isHeader(col, row) ? table._getHeaderLayoutMap(col, row).headerType : table.getBodyColumnType(col, row)) || "text";
         if (isPromise(value)) {
           createEmptyCellGroup(col, row, 0, y, cellWidth, cellHeight, columnGroup), dealPromiseData(value, table, createCell.bind(null, type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult)), columnGroup.updateColumnRowNumber(row);
           const height = table.getRowHeight(row);
@@ -33202,7 +33207,7 @@
         scene.getCell(col, row).forEachChildren(mark => "sort" === mark.attribute.funcType && (oldIconMark = mark, !0)), oldIconMark && (dealWithIcon(iconConfig, oldIconMark), oldIconMark.name = iconConfig.name);
       } else {
         let oldIconMark;
-        oldSortCell.forEachChildren(mark => "sort" === mark.attribute.funcType && (oldIconMark = mark, !0)), oldIconMark && (dealWithIcon(iconConfig, oldIconMark), oldIconMark.name = iconConfig.name);
+        traverseObject(oldSortCell, "children", mark => "sort" === mark.attribute.funcType && (oldIconMark = mark, !0)), oldIconMark && (dealWithIcon(iconConfig, oldIconMark), oldIconMark.name = iconConfig.name);
       }
     }
     function checkSameCell(col1, row1, col2, row2, table) {
@@ -33210,8 +33215,18 @@
         range2 = table.getCellRange(col2, row2);
       return range1.start.col === range2.start.col && range1.start.row === range2.start.row && range1.end.col === range2.end.col && range1.end.row === range2.end.row;
     }
-    function updateSortIcon(col, row, iconMark, order, oldSortCol, oldSortRow, oldIconMark, scene) {
-      const icon = scene.table.internalProps.headerHelper.getSortIcon(order, scene.table, col, row);
+    function updateSortIcon(options) {
+      const {
+          col: col,
+          row: row,
+          iconMark: iconMark,
+          order: order,
+          oldSortCol: oldSortCol,
+          oldSortRow: oldSortRow,
+          oldIconMark: oldIconMark,
+          scene: scene
+        } = options,
+        icon = scene.table.internalProps.headerHelper.getSortIcon(order, scene.table, col, row);
       if (iconMark && updateIcon(iconMark, icon, col, row, scene), !checkSameCell(col, row, oldSortCol, oldSortRow, scene.table)) {
         const oldIcon = scene.table.internalProps.headerHelper.getSortIcon("normal", scene.table, oldSortCol, oldSortRow);
         oldIconMark ? updateIcon(oldIconMark, oldIcon, oldSortCol, oldSortRow, scene) : resetSortIcon(oldSortCol, oldSortRow, oldIcon, scene);
@@ -33686,8 +33701,26 @@
       setIconHoverStyle(icon, col, row, cellGroup) {
         setIconHoverStyle(icon, col, row, cellGroup, this);
       }
-      updateSortIcon(col, row, iconMark, order, oldSortCol, oldSortRow, oldIconMark) {
-        updateSortIcon(col, row, iconMark, order, oldSortCol, oldSortRow, oldIconMark, this);
+      updateSortIcon(options) {
+        const {
+          col: col,
+          row: row,
+          iconMark: iconMark,
+          order: order,
+          oldSortCol: oldSortCol,
+          oldSortRow: oldSortRow,
+          oldIconMark: oldIconMark
+        } = options;
+        updateSortIcon({
+          col: col,
+          row: row,
+          iconMark: iconMark,
+          order: order,
+          oldSortCol: oldSortCol,
+          oldSortRow: oldSortRow,
+          oldIconMark: oldIconMark,
+          scene: this
+        });
       }
       updateFrozenIcon(col, oldFrozenCol) {
         updateFrozenIcon(this);
@@ -34310,17 +34343,26 @@
         order: "normal"
       }), tableState.event = event;
       if (table.fireListeners(TABLE_EVENT_TYPE.SORT_CLICK, tableState).includes(!1)) return;
-      table.internalProps.sortState = tableState, table.stateManager.setSortState(tableState), (null == headerC ? void 0 : headerC.sort) && executeSort(tableState, table, headerC), table.internalProps.useOneRowHeightFillAll = !1, table.internalProps.layoutMap.clearCellRangeMap(), table.scenegraph.sortCell();
+      let isArraySortState = !1,
+        sortState = table.internalProps.sortState ? Array.isArray(table.internalProps.sortState) && (isArraySortState = !0) ? table.internalProps.sortState : [table.internalProps.sortState] : [];
+      if (Array.isArray(sortState)) {
+        const index = sortState.findIndex(item => item.field === tableState.field);
+        index >= 0 ? sortState[index] = tableState : sortState.push(tableState);
+      }
+      sortState = sortState.filter(item => "normal" !== item.order), sortState = table.internalProps.multipleSort && (isArraySortState = !0) ? sortState : sortState.splice(-1), sortState = isArraySortState && sortState.length ? sortState : sortState[0], table.internalProps.sortState = sortState, table.stateManager.setSortState(sortState), (null == headerC ? void 0 : headerC.sort) && executeSort(sortState, table), table.internalProps.useOneRowHeightFillAll = !1, table.internalProps.layoutMap.clearCellRangeMap(), table.scenegraph.sortCell();
       const isHasSelected = !!(null === (_a = table.stateManager.select.ranges) || void 0 === _a ? void 0 : _a.length);
       table.stateManager.updateSelectPos(-1, -1), table.stateManager.endSelectCells(!0, isHasSelected);
     }
     function executeSort(newState, table, headerDefine) {
-      const hd = table.internalProps.layoutMap.headerObjects.find(col => col && col.field === newState.field);
-      if (!hd) return;
-      const {
-        field: field
-      } = hd;
-      null !== field && ("function" == typeof headerDefine.sort ? table.dataSource.sort(field, newState.order || "asc", headerDefine.sort) : table.dataSource.sort(field, newState.order || "asc", defaultOrderFn));
+      newState = Array.isArray(newState) || !newState ? newState : [newState], table.dataSource.sort((newState || []).map(item => {
+        var _a, _b;
+        const hd = table.internalProps.layoutMap.headerObjects.find(col => col && col.field === item.field);
+        return {
+          field: item.field,
+          order: item.order || "asc",
+          orderFn: "function" == typeof (null === (_a = null == hd ? void 0 : hd.define) || void 0 === _a ? void 0 : _a.sort) ? null === (_b = null == hd ? void 0 : hd.define) || void 0 === _b ? void 0 : _b.sort : defaultOrderFn
+        };
+      }));
     }
     function isTarget(col, row, range1Col, range1Row, table) {
       return table._getLayoutCellId(col, row) === table._getLayoutCellId(range1Col, range1Row);
@@ -35108,11 +35150,11 @@
           bounds: new Bounds(),
           highlightIndex: -1,
           dropDownMenuHighlight: []
-        }, this.sort = {
+        }, this.sort = [{
           col: -1,
           row: -1,
           order: "normal"
-        }, this.frozen = {
+        }], this.frozen = {
           col: -1
         }, this.tablePosition = {
           absoluteX: 0,
@@ -35172,11 +35214,11 @@
           bounds: new Bounds(),
           highlightIndex: -1,
           dropDownMenuHighlight: []
-        }, this.sort = {
+        }, this.sort = [{
           col: -1,
           row: -1,
           order: "normal"
-        }, this.frozen = {
+        }], this.frozen = {
           col: -1
         }, this.scroll = {
           horizontalBarPos: 0,
@@ -35227,7 +35269,29 @@
         }), seled;
       }
       setSortState(sortState) {
-        this.sort.field = null == sortState ? void 0 : sortState.field, this.sort.order = null == sortState ? void 0 : sortState.order;
+        const sort = (sortState = !sortState || Array.isArray(sortState) ? sortState : [sortState]) && sortState.reduce((prev, item) => {
+          var _a;
+          const column = null === (_a = function (columns) {
+            const result = [];
+            return function flatten(cols) {
+              let parentStartIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+              cols.forEach(col => {
+                var _a;
+                const startIndex = null !== (_a = col.startInTotal) && void 0 !== _a ? _a : parentStartIndex;
+                col.columns ? flatten(col.columns, startIndex) : result.push(Object.assign(Object.assign({}, col), {
+                  startIndex: startIndex
+                }));
+              });
+            }(columns), result;
+          }(this.table.internalProps.columns)) || void 0 === _a ? void 0 : _a.find(column => (null == column ? void 0 : column.field) === (null == item ? void 0 : item.field));
+          return prev.push({
+            field: item.field,
+            order: item.order,
+            col: column.startInTotal,
+            row: column.level
+          }), prev;
+        }, []);
+        this.sort = sort || [];
       }
       setFrozenState() {
         this.frozen.col = this.table.frozenColCount - 1;
@@ -35599,20 +35663,72 @@
             event: event
           });
         }
-        const oldSortCol = this.sort.col,
-          oldSortRow = this.sort.row;
-        dealSort(col, row, this.table, event), this.sort.col = col, this.sort.row = row, this.table.scenegraph.updateSortIcon(this.sort.col, this.sort.row, iconMark, this.sort.order, oldSortCol, oldSortRow, this.sort.icon), this.sort.icon = iconMark;
+        const previousSort = [...this.sort],
+          previousSortItem = this.table.internalProps.multipleSort || !previousSort.length ? null : this.sort[this.sort.length - 1];
+        dealSort(col, row, this.table, event);
+        const currentSortItem = this.sort.find(item => item.col === col && item.row === row),
+          oldSortCol = this.table.internalProps.multipleSort || !previousSortItem ? null : previousSortItem.col,
+          oldSortRow = this.table.internalProps.multipleSort || !previousSortItem ? null : previousSortItem.row,
+          currentSortItemIndex = previousSort.findIndex(item => item.col === col && item.row === row);
+        currentSortItemIndex >= 0 && previousSort.splice(currentSortItemIndex, 1), this.table.scenegraph.updateSortIcon({
+          col: col,
+          row: row,
+          iconMark: iconMark,
+          order: null == currentSortItem ? void 0 : currentSortItem.order,
+          oldSortCol: oldSortCol,
+          oldSortRow: oldSortRow,
+          oldIconMark: null == previousSortItem ? void 0 : previousSortItem.icon
+        }), currentSortItem && (currentSortItem.icon = iconMark), this.table.internalProps.multipleSort || previousSort.forEach(sortItem => {
+          this.table.scenegraph.updateSortIcon({
+            col: null,
+            row: null,
+            iconMark: null,
+            order: "normal",
+            oldSortCol: sortItem.col,
+            oldSortRow: sortItem.row,
+            oldIconMark: null
+          });
+        });
       }
       updateSortState(sortState) {
-        if (sortState.field === this.sort.field && sortState.order === this.sort.order) return;
-        const oldSortCol = this.sort.col,
-          oldSortRow = this.sort.row,
-          name = "asc" === this.sort.order ? "sort_downward" : "desc" === this.sort.order ? "sort_upward" : "sort_normal";
-        this.setSortState(sortState);
-        const cellAddress = this.table.internalProps.layoutMap.getHeaderCellAddressByField(sortState.field);
-        this.sort.col = cellAddress.col, this.sort.row = cellAddress.row;
-        const iconMark = this.table.scenegraph.getCell(this.sort.col, this.sort.row).getChildByName(name, !0);
-        this.table.scenegraph.updateSortIcon(this.sort.col, this.sort.row, iconMark, this.sort.order, oldSortCol, oldSortRow, this.sort.icon);
+        var _a, _b, _c, _d, _e, _f, _g;
+        sortState = Array.isArray(sortState) ? sortState : [sortState];
+        for (let index = 0; index < sortState.length; index++) {
+          if (sortState[index].field === (null === (_a = this.sort[index]) || void 0 === _a ? void 0 : _a.field) && sortState[sortState.length - 1].order === (null === (_b = this.sort[index]) || void 0 === _b ? void 0 : _b.order)) return;
+          const oldSortCol = this.table.internalProps.multipleSort ? null : (null === (_c = this.sort[index]) || void 0 === _c ? void 0 : _c.col) || null,
+            oldSortRow = this.table.internalProps.multipleSort ? null : (null === (_d = this.sort[index]) || void 0 === _d ? void 0 : _d.row) || null;
+          "asc" === (null === (_e = this.sort[index]) || void 0 === _e ? void 0 : _e.order) || null === (_f = this.sort[index]) || void 0 === _f || _f.order;
+          this.setSortState(sortState);
+          const cellAddress = this.table.internalProps.layoutMap.getHeaderCellAddressByField(sortState[index].field);
+          this.sort[index].col = cellAddress.col, this.sort[index].row = cellAddress.row;
+          const cellGroup = this.table.scenegraph.getCell(this.sort[index].col, this.sort[index].row);
+          let iconMark;
+          traverseObject(cellGroup, "children", mark => "sort" === mark.attribute.funcType && (iconMark = mark, !0)), this.table.scenegraph.updateSortIcon({
+            col: this.sort[index].col,
+            row: this.sort[index].row,
+            iconMark: iconMark,
+            order: this.sort[index].order,
+            oldSortCol: oldSortCol,
+            oldSortRow: oldSortRow,
+            oldIconMark: null === (_g = this.sort[index]) || void 0 === _g ? void 0 : _g.icon
+          });
+        }
+        const normalHeaders = [];
+        this.table.internalProps.layoutMap.columnTree.tree.children.forEach(item => {
+          sortState.some(state => state.field === item.field) || normalHeaders.push(item);
+        });
+        for (let index = 0; index < normalHeaders.length; index++) {
+          const column = normalHeaders[index];
+          this.table.scenegraph.updateSortIcon({
+            col: null,
+            row: null,
+            iconMark: null,
+            order: null,
+            oldSortCol: column.startInTotal,
+            oldSortRow: column.level,
+            oldIconMark: null
+          });
+        }
       }
       triggerFreeze(col, row, iconMark) {
         this.table.isPivotTable() || this.table.transpose || (dealFreeze(col, row, this.table), this.frozen.icon = iconMark);
@@ -35769,6 +35885,7 @@
 
     function handleWhell(event, state) {
       let isWheelEvent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : !0;
+      var _a;
       let {
         deltaX: deltaX,
         deltaY: deltaY
@@ -35778,7 +35895,7 @@
         horizontal: 1,
         vertical: 1
       });
-      (optimizedDeltaX || optimizedDeltaY) && state.interactionState !== InteractionState.scrolling && state.updateInteractionState(InteractionState.scrolling), optimizedDeltaX && (state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX, event), state.showHorizontalScrollBar(!0)), optimizedDeltaY && (state.setScrollTop(state.scroll.verticalBarPos + optimizedDeltaY, event), state.showVerticalScrollBar(!0)), isWheelEvent && state.resetInteractionState(), event.nativeEvent.cancelable && ("none" === state.table.internalProps.overscrollBehavior || Math.abs(deltaY) >= Math.abs(deltaX) && 0 !== deltaY && isVerticalScrollable(deltaY, state) || Math.abs(deltaY) <= Math.abs(deltaX) && 0 !== deltaX && isHorizontalScrollable(deltaX, state)) && event.nativeEvent.preventDefault();
+      (optimizedDeltaX || optimizedDeltaY) && state.interactionState !== InteractionState.scrolling && state.updateInteractionState(InteractionState.scrolling), optimizedDeltaX && (state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX, event), state.showHorizontalScrollBar(!0)), optimizedDeltaY && (state.setScrollTop(state.scroll.verticalBarPos + optimizedDeltaY, event), state.showVerticalScrollBar(!0)), isWheelEvent && state.resetInteractionState(), (null === (_a = event.nativeEvent) || void 0 === _a ? void 0 : _a.cancelable) && ("none" === state.table.internalProps.overscrollBehavior || Math.abs(deltaY) >= Math.abs(deltaX) && 0 !== deltaY && isVerticalScrollable(deltaY, state) || Math.abs(deltaY) <= Math.abs(deltaX) && 0 !== deltaX && isHorizontalScrollable(deltaX, state)) && event.nativeEvent.preventDefault();
     }
     function optimizeScrollXY(x, y, ratio) {
       var _a, _b;
@@ -35845,7 +35962,7 @@
       const table = eventManager.table,
         stateManager = table.stateManager;
       table.scenegraph.tableGroup.addEventListener("pointermove", e => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
         const lastX = null !== (_b = null === (_a = table.eventManager.LastPointerXY) || void 0 === _a ? void 0 : _a.x) && void 0 !== _b ? _b : e.x,
           lastY = null !== (_d = null === (_c = table.eventManager.LastPointerXY) || void 0 === _c ? void 0 : _c.y) && void 0 !== _d ? _d : e.y;
         table.eventManager.LastPointerXY = {
@@ -35854,7 +35971,7 @@
         }, eventManager.touchSetTimeout && (clearTimeout(eventManager.touchSetTimeout), eventManager.touchSetTimeout = void 0);
         const eventArgsSet = getCellEventArgsSet(e);
         if (stateManager.interactionState === InteractionState.grabing && !(null === (_e = table.editorManager) || void 0 === _e ? void 0 : _e.editingEditor)) return void (Math.abs(lastX - e.x) + Math.abs(lastY - e.y) >= 1 && (stateManager.isResizeCol() || (stateManager.isMoveCol() ? eventManager.dealColumnMover(eventArgsSet) : stateManager.isFillHandle() ? eventManager.dealFillSelect(eventArgsSet, !0) : (null === (_f = table.options.select) || void 0 === _f ? void 0 : _f.disableDragSelect) || eventManager.dealTableSelect(eventArgsSet, !0))));
-        table.eventManager.isDraging && stateManager.isSelecting() && !(null === (_g = table.editorManager) || void 0 === _g ? void 0 : _g.editingEditor) && eventManager.dealTableSelect(eventArgsSet, !0);
+        !(null === (_g = table.options.select) || void 0 === _g ? void 0 : _g.disableDragSelect) && table.eventManager.isDraging && stateManager.isSelecting() && !(null === (_h = table.editorManager) || void 0 === _h ? void 0 : _h.editingEditor) && eventManager.dealTableSelect(eventArgsSet, !0);
         const cellGoup = e.path.find(node => "cell" === node.role);
         if (table.hasListeners(TABLE_EVENT_TYPE.MOUSELEAVE_CELL) && (-1 === table.stateManager.hover.cellPos.col || -1 === table.stateManager.hover.cellPos.row || (null == cellGoup ? void 0 : cellGoup.col) === table.stateManager.hover.cellPos.col && (null == cellGoup ? void 0 : cellGoup.row) === table.stateManager.hover.cellPos.row || table.fireListeners(TABLE_EVENT_TYPE.MOUSELEAVE_CELL, {
           col: table.stateManager.hover.cellPos.col,
@@ -35865,8 +35982,8 @@
           }),
           scaleRatio: table.canvas.getBoundingClientRect().width / table.canvas.offsetWidth,
           event: e.nativeEvent,
-          target: null === (_h = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _h ? void 0 : _h.target
-        })), table.hasListeners(TABLE_EVENT_TYPE.MOUSEENTER_CELL) && ("cell" !== (null == cellGoup ? void 0 : cellGoup.role) || !isValid$1(cellGoup.col) || !isValid$1(cellGoup.row) || cellGoup.col === table.stateManager.hover.cellPos.col && cellGoup.row === table.stateManager.hover.cellPos.row || cellGoup.col === (null === (_j = table.stateManager.hover.cellPosContainHeader) || void 0 === _j ? void 0 : _j.col) && cellGoup.row === (null === (_k = table.stateManager.hover.cellPosContainHeader) || void 0 === _k ? void 0 : _k.row) || table.fireListeners(TABLE_EVENT_TYPE.MOUSEENTER_CELL, {
+          target: null === (_j = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _j ? void 0 : _j.target
+        })), table.hasListeners(TABLE_EVENT_TYPE.MOUSEENTER_CELL) && ("cell" !== (null == cellGoup ? void 0 : cellGoup.role) || !isValid$1(cellGoup.col) || !isValid$1(cellGoup.row) || cellGoup.col === table.stateManager.hover.cellPos.col && cellGoup.row === table.stateManager.hover.cellPos.row || cellGoup.col === (null === (_k = table.stateManager.hover.cellPosContainHeader) || void 0 === _k ? void 0 : _k.col) && cellGoup.row === (null === (_l = table.stateManager.hover.cellPosContainHeader) || void 0 === _l ? void 0 : _l.row) || table.fireListeners(TABLE_EVENT_TYPE.MOUSEENTER_CELL, {
           col: cellGoup.col,
           row: cellGoup.row,
           cellRange: table.getCellRangeRelativeRect({
@@ -35875,12 +35992,12 @@
           }),
           scaleRatio: table.canvas.getBoundingClientRect().width / table.canvas.offsetWidth,
           event: e.nativeEvent,
-          target: null === (_l = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _l ? void 0 : _l.target,
-          mergeCellInfo: null === (_m = eventArgsSet.eventArgs) || void 0 === _m ? void 0 : _m.mergeInfo
+          target: null === (_m = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _m ? void 0 : _m.target,
+          mergeCellInfo: null === (_o = eventArgsSet.eventArgs) || void 0 === _o ? void 0 : _o.mergeInfo
         })), eventManager.dealIconHover(eventArgsSet), eventManager.dealTableHover(eventArgsSet), eventArgsSet.eventArgs && table.hasListeners(TABLE_EVENT_TYPE.MOUSEMOVE_CELL)) {
           let icon, position;
-          if (null === (_o = eventArgsSet.eventArgs) || void 0 === _o ? void 0 : _o.target) {
-            const iconInfo = getIconAndPositionFromTarget(null === (_p = eventArgsSet.eventArgs) || void 0 === _p ? void 0 : _p.target);
+          if (null === (_p = eventArgsSet.eventArgs) || void 0 === _p ? void 0 : _p.target) {
+            const iconInfo = getIconAndPositionFromTarget(null === (_q = eventArgsSet.eventArgs) || void 0 === _q ? void 0 : _q.target);
             iconInfo && (icon = iconInfo.icon, position = iconInfo.position);
           }
           table.fireListeners(TABLE_EVENT_TYPE.MOUSEMOVE_CELL, {
@@ -35894,8 +36011,8 @@
               position: position,
               funcType: icon.attribute.funcType
             } : void 0,
-            target: null === (_q = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _q ? void 0 : _q.target,
-            mergeCellInfo: null === (_r = eventArgsSet.eventArgs) || void 0 === _r ? void 0 : _r.mergeInfo
+            target: null === (_r = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _r ? void 0 : _r.target,
+            mergeCellInfo: null === (_s = eventArgsSet.eventArgs) || void 0 === _s ? void 0 : _s.mergeInfo
           });
         }
       }), table.scenegraph.tableGroup.addEventListener("pointerout", e => {
@@ -35954,7 +36071,7 @@
           event: e.nativeEvent
         });
       }), table.scenegraph.tableGroup.addEventListener("pointerupoutside", e => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        var _a, _b, _c, _d, _e, _f, _g, _h;
         const eventArgsSet = getCellEventArgsSet(e);
         if (stateManager.menu.isShow && (null === (_a = eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target) !== (null === (_b = stateManager.residentHoverIcon) || void 0 === _b ? void 0 : _b.icon) && setTimeout(() => {
           table.internalProps.menuHandler.pointInMenuElement(e.client.x, e.client.y) || stateManager.menu.isShow && stateManager.hideMenu();
@@ -35984,16 +36101,27 @@
             cellsEvent.cells = table.getSelectedCellInfos(), table.fireListeners(TABLE_EVENT_TYPE.DRAG_SELECT_END, cellsEvent);
           }
         }
-        const isCompleteEdit = null === (_j = table.editorManager) || void 0 === _j ? void 0 : _j.completeEdit(e.nativeEvent);
-        getPromiseValue(isCompleteEdit, isCompleteEdit => {
-          var _a, _b;
-          if (!1 !== isCompleteEdit && (stateManager.updateInteractionState(InteractionState.default), eventManager.dealTableHover(), null === (_a = table.options.select) || void 0 === _a ? void 0 : _a.outsideClickDeselect)) {
-            const isHasSelected = !!(null === (_b = stateManager.select.ranges) || void 0 === _b ? void 0 : _b.length);
-            eventManager.dealTableSelect(), stateManager.endSelectCells(!0, isHasSelected);
-          }
-        });
-      }), table.scenegraph.tableGroup.addEventListener("pointerdown", e => {
-        var _a, _b, _c, _d;
+      });
+      const globalPointerupCallback = e => {
+        var _a;
+        const target = e.target;
+        if (!table.getElement().contains(target)) {
+          const isCompleteEdit = null === (_a = table.editorManager) || void 0 === _a ? void 0 : _a.completeEdit(e);
+          getPromiseValue(isCompleteEdit, isCompleteEdit => {
+            var _a, _b;
+            if (!1 !== isCompleteEdit && (stateManager.updateInteractionState(InteractionState.default), eventManager.dealTableHover(), null === (_a = table.options.select) || void 0 === _a ? void 0 : _a.outsideClickDeselect)) {
+              const isHasSelected = !!(null === (_b = stateManager.select.ranges) || void 0 === _b ? void 0 : _b.length);
+              eventManager.dealTableSelect(), stateManager.endSelectCells(!0, isHasSelected);
+            }
+          });
+        }
+      };
+      eventManager.globalEventListeners.push({
+        name: "pointerup",
+        env: "document",
+        callback: globalPointerupCallback
+      }), vglobal.addEventListener("pointerup", globalPointerupCallback), table.scenegraph.tableGroup.addEventListener("pointerdown", e => {
+        var _a, _b, _c, _d, _e;
         if (table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE) && table.fireListeners(TABLE_EVENT_TYPE.MOUSEDOWN_TABLE, {
           event: e.nativeEvent
         }), table.eventManager.isDown = !0, table.eventManager.LastBodyPointerXY = {
@@ -36005,8 +36133,8 @@
         }, 0 !== e.button) return;
         const eventArgsSet = getCellEventArgsSet(e);
         if (eventManager.downIcon = void 0, stateManager.interactionState !== InteractionState.default) return;
-        table.isPivotChart() && "chart" !== (null === (_a = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target.type) && table.scenegraph.updateChartState(null), (null === (_b = eventArgsSet.eventArgs) || void 0 === _b ? void 0 : _b.target) !== (null === (_c = stateManager.residentHoverIcon) || void 0 === _c ? void 0 : _c.icon) && stateManager.hideMenu();
-        const isCompleteEdit = null === (_d = table.editorManager) || void 0 === _d ? void 0 : _d.completeEdit(e.nativeEvent);
+        if (table.isPivotChart() && "chart" !== (null === (_a = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _a ? void 0 : _a.target.type) && table.scenegraph.updateChartState(null), (null === (_b = eventArgsSet.eventArgs) || void 0 === _b ? void 0 : _b.target) !== (null === (_c = stateManager.residentHoverIcon) || void 0 === _c ? void 0 : _c.icon) && stateManager.hideMenu(), "chart" === (null === (_d = null == eventArgsSet ? void 0 : eventArgsSet.eventArgs) || void 0 === _d ? void 0 : _d.target.type)) return;
+        const isCompleteEdit = null === (_e = table.editorManager) || void 0 === _e ? void 0 : _e.completeEdit(e.nativeEvent);
         getPromiseValue(isCompleteEdit, isCompleteEdit => {
           var _a, _b, _c, _d, _e;
           if (!1 === isCompleteEdit) return;
@@ -37222,7 +37350,7 @@
           var _a, _b;
           if (void 0 !== iconOpt[k]) {
             const f = this._table.getFieldData(iconOpt[k], col, row);
-            null != f ? retIcon[k] = f : (null === (_b = (_a = this._table)._hasField) || void 0 === _b ? void 0 : _b.call(_a, iconOpt[k], col, row)) || (retIcon[k] = iconOpt[k]);
+            isValid$1(f) ? retIcon[k] = f : (null === (_b = (_a = this._table)._hasField) || void 0 === _b ? void 0 : _b.call(_a, iconOpt[k], col, row)) || (retIcon[k] = iconOpt[k]);
           }
         }), retIcon;
       }
@@ -38615,7 +38743,7 @@
       constructor(container) {
         let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-        if (super(), this.showFrozenIcon = !0, this.version = "1.7.5-alpha.0", this.id = `VTable${Date.now()}`, this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = throttle2(this.render.bind(this), 200), !container && "node" !== options.mode && !options.canvas) throw new Error("vtable's container is undefined");
+        if (super(), this.showFrozenIcon = !0, this.version = "1.7.5", this.id = `VTable${Date.now()}`, this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = throttle2(this.render.bind(this), 200), !container && "node" !== options.mode && !options.canvas) throw new Error("vtable's container is undefined");
         const {
           frozenColCount = 0,
           frozenRowCount: frozenRowCount,
@@ -39789,7 +39917,7 @@
       }
       _hasField(field, col, row) {
         var _a;
-        if (null == field) return !1;
+        if (null === field) return !1;
         if (this.internalProps.layoutMap.isHeader(col, row)) return !1;
         const index = this.getRecordShowIndexByCell(col, row);
         return null === (_a = this.internalProps.dataSource) || void 0 === _a ? void 0 : _a.hasField(index, field);
@@ -39852,15 +39980,17 @@
         return !1;
       }
       getCellIcons(col, row) {
-        var _a, _b;
+        var _a, _b, _c;
         let icons;
         if (this.isHeader(col, row)) icons = this.internalProps.headerHelper.getIcons(col, row);else if (this.internalProps.layoutMap.isSeriesNumber(col, row)) {
-          (null === (_b = null === (_a = this.internalProps.layoutMap.getSeriesNumberBody(col, row)) || void 0 === _a ? void 0 : _a.define) || void 0 === _b ? void 0 : _b.dragOrder) && (icons = this.internalProps.rowSeriesNumberHelper.getIcons(col, row));
+          if (!this.options.groupBy || !(null === (_a = this.getCellRawRecord(col, row)) || void 0 === _a ? void 0 : _a.vtableMerge)) {
+            (null === (_c = null === (_b = this.internalProps.layoutMap.getSeriesNumberBody(col, row)) || void 0 === _b ? void 0 : _b.define) || void 0 === _c ? void 0 : _c.dragOrder) && (icons = this.internalProps.rowSeriesNumberHelper.getIcons(col, row));
+          }
           const cellValue = this.getCellValue(col, row),
             dataValue = this.getCellOriginValue(col, row),
             ctx = this.internalProps.context,
             cellIcon = this.internalProps.bodyHelper.getIcons(col, row, cellValue, dataValue, ctx);
-          (null == icons ? void 0 : icons.length) > 0 ? icons = icons.concat() : (null == cellIcon ? void 0 : cellIcon.length) > 0 && (icons = cellIcon);
+          (null == icons ? void 0 : icons.length) > 0 ? icons = icons.concat(cellIcon) : (null == cellIcon ? void 0 : cellIcon.length) > 0 && (icons = cellIcon);
         } else {
           const cellValue = this.getCellValue(col, row),
             dataValue = this.getCellOriginValue(col, row),
@@ -41681,25 +41811,15 @@
       return cellUpdateType;
     }
     function sortRecords(table) {
-      var _a;
-      if (table.sortState) {
-        let order, field;
-        if (Array.isArray(table.sortState) ? 0 !== table.sortState.length && ({
-          order: order,
-          field: field
-        } = null === (_a = table.sortState) || void 0 === _a ? void 0 : _a[0]) : ({
-          order: order,
-          field: field
-        } = table.sortState), order && field && "normal" !== order) {
-          const sortFunc = table._getSortFuncFromHeaderOption(void 0, field),
-            hd = table.internalProps.layoutMap.headerObjects.find(col => col && col.field === field);
-          hd && table.dataSource.sort(hd.field, order, null != sortFunc ? sortFunc : defaultOrderFn);
-        }
-      }
+      let sortState = table.sortState;
+      sortState = !sortState || Array.isArray(sortState) ? sortState : [sortState], sortState && (sortState = sortState.map(item => {
+        var _a;
+        return item.orderFn = null !== (_a = table._getSortFuncFromHeaderOption(void 0, item.field)) && void 0 !== _a ? _a : defaultOrderFn, item;
+      }), table.dataSource.sort(sortState));
     }
     function listTableAddRecord(record, recordIndex, table) {
       var _a, _b;
-      if (table.options.groupBy) null === (_b = (_a = table.dataSource).addRecordsForGroup) || void 0 === _b || _b.call(_a, [record]), table.refreshRowColCount(), table.internalProps.layoutMap.clearCellRangeMap(), table.scenegraph.clearCells(), table.scenegraph.createSceneGraph();else if (table.sortState) table.dataSource.addRecordForSorted(record), sortRecords(table), table.refreshRowColCount(), table.scenegraph.clearCells(), table.scenegraph.createSceneGraph();else {
+      if (table.options.groupBy) null === (_b = (_a = table.dataSource).addRecordsForGroup) || void 0 === _b || _b.call(_a, [record], recordIndex), table.refreshRowColCount(), table.internalProps.layoutMap.clearCellRangeMap(), table.scenegraph.clearCells(), table.scenegraph.createSceneGraph();else if (table.sortState) table.dataSource.addRecordForSorted(record), sortRecords(table), table.refreshRowColCount(), table.scenegraph.clearCells(), table.scenegraph.createSceneGraph();else {
         (void 0 === recordIndex || recordIndex > table.dataSource.sourceLength) && (recordIndex = table.dataSource.sourceLength);
         const headerCount = table.transpose ? table.rowHeaderLevelCount : table.columnHeaderLevelCount;
         table.dataSource.addRecord(record, recordIndex);
@@ -41751,7 +41871,7 @@
     }
     function listTableAddRecords(records, recordIndex, table) {
       var _a, _b;
-      if (table.options.groupBy) null === (_b = (_a = table.dataSource).addRecordsForGroup) || void 0 === _b || _b.call(_a, records), table.refreshRowColCount(), table.internalProps.layoutMap.clearCellRangeMap(), table.scenegraph.clearCells(), table.scenegraph.createSceneGraph();else if (table.sortState) table.dataSource.addRecordsForSorted(records), sortRecords(table), table.refreshRowColCount(), table.scenegraph.clearCells(), table.scenegraph.createSceneGraph();else {
+      if (table.options.groupBy) null === (_b = (_a = table.dataSource).addRecordsForGroup) || void 0 === _b || _b.call(_a, records, recordIndex), table.refreshRowColCount(), table.internalProps.layoutMap.clearCellRangeMap(), table.scenegraph.clearCells(), table.scenegraph.createSceneGraph();else if (table.sortState) table.dataSource.addRecordsForSorted(records), sortRecords(table), table.refreshRowColCount(), table.scenegraph.clearCells(), table.scenegraph.createSceneGraph();else {
         void 0 === recordIndex || recordIndex > table.dataSource.sourceLength ? recordIndex = table.dataSource.sourceLength : recordIndex < 0 && (recordIndex = 0);
         const headerCount = table.transpose ? table.rowHeaderLevelCount : table.columnHeaderLevelCount;
         table.dataSource.addRecords(records, recordIndex);
@@ -41908,7 +42028,7 @@
         var _a, _b, _c, _d;
         "node" === Env.mode ? (options = container, container = null) : container instanceof HTMLElement || (options = container, container = container.container ? container.container : null), super(container, options), this.showHeader = !0;
         const internalProps = this.internalProps;
-        if (internalProps.frozenColDragHeaderMode = options.frozenColDragHeaderMode, this.pagination = options.pagination, internalProps.sortState = options.sortState, internalProps.dataConfig = options.groupBy ? getGroupByDataConfig(options.groupBy) : {}, internalProps.columns = options.columns ? cloneDeepSpec(options.columns, ["children"]) : options.header ? cloneDeepSpec(options.header, ["children"]) : [], internalProps.enableTreeNodeMerge = null !== (_b = null !== (_a = options.enableTreeNodeMerge) && void 0 !== _a ? _a : isValid$1(options.groupBy)) && void 0 !== _b && _b, this.internalProps.headerHelper.setTableColumnsEditor(), this.showHeader = null === (_c = options.showHeader) || void 0 === _c || _c, this.transpose = null !== (_d = options.transpose) && void 0 !== _d && _d, "node" !== Env.mode && (this.editorManager = new EditManeger(this)), this.refreshHeader(), this.internalProps.useOneRowHeightFillAll = !1, options.dataSource ? _setDataSource(this, options.dataSource) : options.records ? this.setRecords(options.records, {
+        if (internalProps.frozenColDragHeaderMode = options.frozenColDragHeaderMode, this.pagination = options.pagination, internalProps.sortState = options.sortState, internalProps.multipleSort = !!options.multipleSort, internalProps.dataConfig = options.groupBy ? getGroupByDataConfig(options.groupBy) : {}, internalProps.columns = options.columns ? cloneDeepSpec(options.columns, ["children"]) : options.header ? cloneDeepSpec(options.header, ["children"]) : [], internalProps.enableTreeNodeMerge = null !== (_b = null !== (_a = options.enableTreeNodeMerge) && void 0 !== _a ? _a : isValid$1(options.groupBy)) && void 0 !== _b && _b, this.internalProps.headerHelper.setTableColumnsEditor(), this.showHeader = null === (_c = options.showHeader) || void 0 === _c || _c, this.transpose = null !== (_d = options.transpose) && void 0 !== _d && _d, "node" !== Env.mode && (this.editorManager = new EditManeger(this)), this.refreshHeader(), this.internalProps.useOneRowHeightFillAll = !1, options.dataSource ? _setDataSource(this, options.dataSource) : options.records ? this.setRecords(options.records, {
           sortState: internalProps.sortState
         }) : this.setRecords([]), options.title) {
           const Title = Factory.getComponent("title");
@@ -41982,6 +42102,14 @@
             } = table.internalProps.layoutMap.getSeriesNumberHeader(col, row);
             return title;
           }
+          if (this.options.groupBy) {
+            const {
+              vtableMerge: vtableMerge
+            } = table.getCellRawRecord(col, row);
+            if (vtableMerge) return "";
+            const indexs = this.dataSource.currentIndexedData[row - this.columnHeaderLevelCount];
+            return indexs[indexs.length - 1] + 1;
+          }
           const {
             format: format
           } = table.internalProps.layoutMap.getSeriesNumberBody(col, row);
@@ -42279,20 +42407,17 @@
       }
       updateSortState(sortState) {
         let executeSort = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : !0;
-        var _a, _b, _c;
-        let order, field;
-        if (sortState ? this.internalProps.sortState = sortState : this.internalProps.sortState && (Array.isArray(this.internalProps.sortState) ? (sortState = null === (_a = this.internalProps.sortState) || void 0 === _a ? void 0 : _a[0]) && (sortState.order = "normal") : (this.internalProps.sortState.order = "normal", sortState = this.internalProps.sortState)), Array.isArray(this.internalProps.sortState) ? (null === (_b = this.internalProps.sortState) || void 0 === _b ? void 0 : _b[0]) && ({
-          order: order,
-          field: field
-        } = null === (_c = this.internalProps.sortState) || void 0 === _c ? void 0 : _c[0]) : this.internalProps.sortState && ({
-          order: order,
-          field: field
-        } = this.internalProps.sortState), field && executeSort) {
-          const sortFunc = this._getSortFuncFromHeaderOption(this.internalProps.columns, field),
-            hd = this.internalProps.layoutMap.headerObjects.find(col => col && col.field === field);
-          hd && !1 !== hd.define.sort && (this.dataSource.sort(hd.field, order, sortFunc), this.internalProps.layoutMap.clearCellRangeMap(), this.internalProps.useOneRowHeightFillAll = !1, this.scenegraph.sortCell());
-        }
-        sortState && this.stateManager.updateSortState(sortState);
+        var _a;
+        if (sortState) this.internalProps.sortState = sortState;else if (this.internalProps.sortState) if (Array.isArray(this.internalProps.sortState)) for (let i = 0; i < this.internalProps.sortState.length; i++) (sortState = null === (_a = this.internalProps.sortState) || void 0 === _a ? void 0 : _a[i]) && (sortState.order = "normal");else this.internalProps.sortState.order = "normal", sortState = this.internalProps.sortState;
+        (sortState = Array.isArray(sortState) ? sortState : [sortState]).some(item => item.field) && executeSort && this.internalProps.layoutMap.headerObjects.some(item => !1 !== item.define.sort) && (this.dataSource.sort(sortState.map(item => {
+          const sortFunc = this._getSortFuncFromHeaderOption(this.internalProps.columns, item.field);
+          this.internalProps.layoutMap.headerObjects.find(col => col && col.field === item.field);
+          return {
+            field: item.field,
+            order: item.order,
+            orderFn: sortFunc
+          };
+        })), this.internalProps.layoutMap.clearCellRangeMap(), this.internalProps.useOneRowHeightFillAll = !1, this.scenegraph.sortCell()), sortState.length && this.stateManager.updateSortState(sortState);
       }
       updateFilterRules(filterRules) {
         this.scenegraph.clearCells(), this.sortState ? (this.dataSource.updateFilterRulesForSorted(filterRules), sortRecords(this)) : this.dataSource.updateFilterRules(filterRules), this.refreshRowColCount(), this.scenegraph.createSceneGraph();
@@ -42327,7 +42452,7 @@
         setCellRadioState(col, row, index, this);
       }
       setRecords(records, option) {
-        var _a, _b, _c;
+        var _a, _b;
         let sort;
         null === (_a = this.internalProps.dataSource) || void 0 === _a || _a.release(), this.internalProps.releaseList = null === (_b = this.internalProps.releaseList) || void 0 === _b ? void 0 : _b.filter(item => !item.dataSourceObj), this.internalProps.dataSource = null, Array.isArray(option) || (null == option ? void 0 : option.order) ? sort = option : option ? sort = option.sortState : null === option && (sort = null);
         "undefined" != typeof window && window.performance.now();
@@ -42335,20 +42460,18 @@
           col: this.stateManager.hover.cellPos.col,
           row: this.stateManager.hover.cellPos.row
         };
-        if (this.scenegraph.clearCells(), void 0 !== sort && (this.internalProps.sortState = sort, this.stateManager.setSortState(this.sortState)), records) {
+        if (this.scenegraph.clearCells(), void 0 !== sort && (this.internalProps.sortState = this.internalProps.multipleSort ? Array.isArray(sort) ? sort : [sort] : sort, this.stateManager.setSortState(this.sortState)), records) {
           if (_setRecords(this, records), this.sortState) {
-            let order, field;
-            if (Array.isArray(this.sortState) ? 0 !== this.sortState.length && ({
-              order: order,
-              field: field
-            } = null === (_c = this.sortState) || void 0 === _c ? void 0 : _c[0]) : ({
-              order: order,
-              field: field
-            } = this.sortState), order && field && "normal" !== order) {
-              const sortFunc = this._getSortFuncFromHeaderOption(void 0, field),
-                hd = this.internalProps.layoutMap.headerObjectsIncludeHided.find(col => col && col.field === field);
-              hd && !1 !== hd.define.sort && this.dataSource.sort(hd.field, order, null != sortFunc ? sortFunc : defaultOrderFn);
-            }
+            const sortState = Array.isArray(this.sortState) ? this.sortState : [this.sortState];
+            sortState.some(item => item.order && item.field && "normal" !== item.order) && this.internalProps.layoutMap.headerObjectsIncludeHided.some(item => !1 !== item.define.sort) && this.dataSource.sort(sortState.map(item => {
+              const sortFunc = this._getSortFuncFromHeaderOption(void 0, item.field);
+              this.internalProps.layoutMap.headerObjectsIncludeHided.find(col => col && col.field === item.field);
+              return {
+                field: item.field,
+                order: item.order || "asc",
+                orderFn: null != sortFunc ? sortFunc : defaultOrderFn
+              };
+            }));
           }
           this.refreshRowColCount();
         } else _setRecords(this, records);
@@ -43580,6 +43703,7 @@
         isDown = false;
         isDraging = false;
         lastDragPointerXYOnWindow;
+        globalEventListeners = [];
         constructor(gantt) {
             this._gantt = gantt;
             this._eventHandler = new EventHandler();
@@ -43587,6 +43711,18 @@
         }
         release() {
             this._eventHandler.release();
+            this.globalEventListeners.forEach(item => {
+                if (item.env === 'document') {
+                    document.removeEventListener(item.name, item.callback);
+                }
+                else if (item.env === 'body') {
+                    document.body.removeEventListener(item.name, item.callback);
+                }
+                else if (item.env === 'window') {
+                    window.removeEventListener(item.name, item.callback);
+                }
+            });
+            this.globalEventListeners = [];
         }
         bindEvent() {
             bindTableGroupListener(this);
@@ -43717,10 +43853,16 @@
                     gantt.verticalSplitResizeLine.childNodes[1].style.opacity = '0';
                 });
         }
-        vglobal.addEventListener('mousedown', (e) => {
+        const globalMousedownCallback = (e) => {
             gantt.eventManager.lastDragPointerXYOnWindow = { x: e.x, y: e.y };
+        };
+        eventManager.globalEventListeners.push({
+            name: 'mousedown',
+            env: 'document',
+            callback: globalMousedownCallback
         });
-        vglobal.addEventListener('mousemove', (e) => {
+        vglobal.addEventListener('mousedown', globalMousedownCallback);
+        const globalMousemoveCallback = (e) => {
             if (stateManager.interactionState === InteractionState$1.grabing) {
                 const lastX = gantt.eventManager.lastDragPointerXYOnWindow?.x ?? e.x;
                 if (Math.abs(lastX - e.x) >= 1) {
@@ -43736,8 +43878,14 @@
                     gantt.eventManager.lastDragPointerXYOnWindow = { x: e.x, y: e.y };
                 }
             }
+        };
+        eventManager.globalEventListeners.push({
+            name: 'mousemove',
+            env: 'document',
+            callback: globalMousemoveCallback
         });
-        vglobal.addEventListener('mouseup', (e) => {
+        vglobal.addEventListener('mousemove', globalMousemoveCallback);
+        const globalMouseupCallback = (e) => {
             if (stateManager.interactionState === 'grabing') {
                 stateManager.updateInteractionState(InteractionState$1.default);
                 if (stateManager.isResizingTableWidth()) {
@@ -43750,7 +43898,13 @@
                     stateManager.endResizeTaskBar(e.x);
                 }
             }
+        };
+        eventManager.globalEventListeners.push({
+            name: 'mouseup',
+            env: 'document',
+            callback: globalMouseupCallback
         });
+        vglobal.addEventListener('mouseup', globalMouseupCallback);
     }
 
     function syncScrollStateToTable(gantt) {
@@ -44530,9 +44684,12 @@
             this.tableNoFrameHeight = Math.floor(heightP);
             if (this.parsedOptions.outerFrameStyle) {
                 const lineWidth = this.parsedOptions.outerFrameStyle?.borderLineWidth;
-                this.tableX = this.taskListTableInstance ? this.parsedOptions.verticalSplitLine.lineWidth ?? 0 : lineWidth;
+                this.tableX =
+                    this.taskTableColumns.length >= 1 || this.options?.rowSeriesNumber
+                        ? this.parsedOptions.verticalSplitLine.lineWidth ?? 0
+                        : lineWidth;
                 this.tableY = lineWidth;
-                this.tableNoFrameWidth = width - lineWidth - this.parsedOptions.verticalSplitLine.lineWidth;
+                this.tableNoFrameWidth = Math.min(width - lineWidth - this.tableX, this._getAllColsWidth());
                 this.tableNoFrameHeight = height - lineWidth * 2;
             }
         }
@@ -44679,6 +44836,20 @@
                     }, this.options.taskListTable?.theme?.columnResize)
                 };
             }
+            if (listTable_options.theme.bodyStyle.frameStyle) {
+                listTable_options.theme.bodyStyle.frameStyle.borderLineWidth = [
+                    this.parsedOptions.horizontalSplitLine?.lineWidth ?? 0,
+                    0,
+                    0,
+                    0
+                ];
+            }
+            else {
+                listTable_options.theme.bodyStyle.frameStyle = {
+                    borderLineWidth: [this.parsedOptions.horizontalSplitLine?.lineWidth ?? 0, 0, 0, 0],
+                    borderColor: this.parsedOptions.horizontalSplitLine?.lineColor
+                };
+            }
             listTable_options.canvasWidth = this.taskTableWidth;
             listTable_options.canvasHeight = this.canvas.height;
             listTable_options.defaultHeaderRowHeight = this.getAllHeaderRowsHeight();
@@ -44844,7 +45015,7 @@
         }
         _resize() {
             this._updateSize();
-            this.taskListTableInstance.setCanvasSize(this.taskTableWidth, this.tableNoFrameHeight + this.parsedOptions.outerFrameStyle.borderLineWidth * 2);
+            this.taskListTableInstance?.setCanvasSize(this.taskTableWidth, this.tableNoFrameHeight + this.parsedOptions.outerFrameStyle.borderLineWidth * 2);
             this._syncPropsFromTable();
             this.scenegraph.resize();
             updateSplitLineAndResizeLine(this);
@@ -44925,7 +45096,7 @@
         getWeekday: getWeekday
     });
 
-    const version = "1.7.5-alpha.0";
+    const version = "1.7.5";
 
     exports.Gantt = Gantt;
     exports.TYPES = index$1;