@visactor/vtable 0.21.4-alpha.4 → 0.22.0

package/dist/vtable.js

@@ -21572,6 +21572,7 @@
         IconFuncTypeEnum["collapse"] = "collapse";
         IconFuncTypeEnum["drillDown"] = "drillDown";
         IconFuncTypeEnum["drillUp"] = "drillUp";
+        IconFuncTypeEnum["dragReorder"] = "dragReorder";
     })(IconFuncTypeEnum || (IconFuncTypeEnum = {}));
     var InternalIconName;
     (function (InternalIconName) {
@@ -21584,6 +21585,7 @@
         InternalIconName["dropdownIconName"] = "dropdownIcon";
         InternalIconName["expandIconName"] = "expand";
         InternalIconName["collapseIconName"] = "collapse";
+        InternalIconName["dragReorderIconName"] = "dragReorder";
     })(InternalIconName || (InternalIconName = {}));
 
     var index$1 = /*#__PURE__*/Object.freeze({
@@ -33555,12 +33557,12 @@
         static get EVENT_TYPE() {
             return EVENT_TYPE;
         }
-        treeDataHierarchyState = new Map();
+        hasHierarchyStateExpand = false;
         beforeChangedRecordsMap = [];
         registedAggregators = {};
         fieldAggregators = [];
         layoutColumnObjects = [];
-        constructor(dataSourceObj, dataConfig, pagination, columnObjs, hierarchyExpandLevel) {
+        constructor(dataSourceObj, dataConfig, pagination, columnObjs, rowHierarchyType, hierarchyExpandLevel) {
             super();
             this.registerAggregators();
             this.dataSourceObj = dataSourceObj;
@@ -33581,29 +33583,34 @@
                 this.hierarchyExpandLevel = hierarchyExpandLevel;
             }
             this.currentIndexedData = Array.from({ length: this._sourceLength }, (_, i) => i);
-            this.initTreeHierarchyState();
+            if (rowHierarchyType === 'tree') {
+                this.initTreeHierarchyState();
+            }
             this.updatePagerData();
         }
         initTreeHierarchyState() {
-            if (this.hierarchyExpandLevel) {
-                this.treeDataHierarchyState = new Map();
-                for (let i = 0; i < this._sourceLength; i++) {
-                    const nodeData = this.getOriginalRecord(i);
-                    nodeData.children && this.treeDataHierarchyState.set(i, HierarchyState.collapse);
-                }
-                this.currentIndexedData = Array.from({ length: this._sourceLength }, (_, i) => i);
-                if (this.hierarchyExpandLevel > 1) {
-                    let nodeLength = this._sourceLength;
-                    for (let i = 0; i < nodeLength; i++) {
-                        const indexKey = this.currentIndexedData[i];
-                        const nodeData = this.getOriginalRecord(indexKey);
-                        if (nodeData.children?.length > 0) {
-                            this.treeDataHierarchyState.set(Array.isArray(indexKey) ? indexKey.join(',') : indexKey, HierarchyState.expand);
-                            const childrenLength = this.initChildrenNodeHierarchy(indexKey, this.hierarchyExpandLevel, 2, nodeData);
-                            i += childrenLength;
-                            nodeLength += childrenLength;
-                        }
+            this.currentIndexedData = Array.from({ length: this._sourceLength }, (_, i) => i);
+            let nodeLength = this._sourceLength;
+            for (let i = 0; i < nodeLength; i++) {
+                const indexKey = this.currentIndexedData[i];
+                const nodeData = this.getOriginalRecord(indexKey);
+                if (nodeData.children?.length > 0) {
+                    if (this.hierarchyExpandLevel > 1) {
+                        !nodeData.hierarchyState && (nodeData.hierarchyState = HierarchyState.expand);
+                    }
+                    else {
+                        !nodeData.hierarchyState && (nodeData.hierarchyState = HierarchyState.collapse);
                     }
+                    this.hasHierarchyStateExpand = true;
+                    if (nodeData.hierarchyState === HierarchyState.collapse) {
+                        continue;
+                    }
+                    const childrenLength = this.initChildrenNodeHierarchy(indexKey, this.hierarchyExpandLevel, 2, nodeData);
+                    i += childrenLength;
+                    nodeLength += childrenLength;
+                }
+                else if (nodeData.children === true) {
+                    !nodeData.hierarchyState && (nodeData.hierarchyState = HierarchyState.collapse);
                 }
             }
         }
@@ -33678,25 +33685,29 @@
             }
         }
         initChildrenNodeHierarchy(indexKey, hierarchyExpandLevel, currentLevel, nodeData) {
-            if (currentLevel > hierarchyExpandLevel) {
-                return 0;
-            }
             let childTotalLength = 0;
             const nodeLength = nodeData.children?.length ?? 0;
             for (let j = 0; j < nodeLength; j++) {
-                childTotalLength += 1;
+                if (currentLevel <= hierarchyExpandLevel || nodeData.hierarchyState === HierarchyState.expand) {
+                    childTotalLength += 1;
+                }
                 const childNodeData = nodeData.children[j];
                 const childIndexKey = Array.isArray(indexKey) ? indexKey.concat(j) : [indexKey, j];
-                this.currentIndexedData.splice(this.currentIndexedData.indexOf(indexKey) + childTotalLength, 0, childIndexKey);
+                if (currentLevel <= hierarchyExpandLevel || nodeData.hierarchyState === HierarchyState.expand) {
+                    this.currentIndexedData.splice(this.currentIndexedData.indexOf(indexKey) + childTotalLength, 0, childIndexKey);
+                }
                 if (childNodeData.children?.length > 0) {
-                    if (currentLevel < hierarchyExpandLevel) {
-                        this.treeDataHierarchyState.set(Array.isArray(childIndexKey) ? childIndexKey.join(',') : childIndexKey, HierarchyState.expand);
+                    if (currentLevel < hierarchyExpandLevel || childNodeData.hierarchyState === HierarchyState.expand) {
+                        !childNodeData.hierarchyState && (childNodeData.hierarchyState = HierarchyState.expand);
+                        this.hasHierarchyStateExpand = true;
                     }
                     else {
-                        this.treeDataHierarchyState.set(Array.isArray(childIndexKey) ? childIndexKey.join(',') : childIndexKey, HierarchyState.collapse);
+                        !childNodeData.hierarchyState && (childNodeData.hierarchyState = HierarchyState.collapse);
                     }
                 }
-                childTotalLength += this.initChildrenNodeHierarchy(childIndexKey, hierarchyExpandLevel, currentLevel + 1, childNodeData);
+                if (childNodeData.hierarchyState === HierarchyState.expand) {
+                    childTotalLength += this.initChildrenNodeHierarchy(childIndexKey, hierarchyExpandLevel, currentLevel + 1, childNodeData);
+                }
             }
             return childTotalLength;
         }
@@ -33761,8 +33772,8 @@
             return this.hasOriginalField(_getIndex(this.currentPagerIndexedData, index), field);
         }
         getHierarchyState(index) {
-            const indexed = this.getIndexKey(index);
-            return this.treeDataHierarchyState.get(Array.isArray(indexed) ? indexed.join(',') : indexed) ?? null;
+            const record = this.getOriginalRecord(this.currentIndexedData[index]);
+            return record?.hierarchyState ?? null;
         }
         toggleHierarchyState(index) {
             const oldIndexedData = this.currentIndexedData.slice(0);
@@ -33771,8 +33782,9 @@
             const data = this.getOriginalRecord(indexed);
             this.clearSortedIndexMap();
             if (state === HierarchyState.collapse) {
-                this.treeDataHierarchyState.set(Array.isArray(indexed) ? indexed.join(',') : indexed, HierarchyState.expand);
+                data.hierarchyState = HierarchyState.expand;
                 this.pushChildrenNode(indexed, HierarchyState.expand, data);
+                this.hasHierarchyStateExpand = true;
             }
             else if (state === HierarchyState.expand) {
                 let childrenLength = 0;
@@ -33784,13 +33796,13 @@
                         for (let i = 0; i < nodeData.children.length; i++) {
                             childrenLength += 1;
                             const childIndex = Array.isArray(indexKey) ? indexKey.concat([i]) : [indexKey, i];
-                            computeChildrenNodeLength(childIndex, this.treeDataHierarchyState.get(childIndex.join(',')), nodeData.children[i]);
+                            computeChildrenNodeLength(childIndex, nodeData.children[i].hierarchyState, nodeData.children[i]);
                         }
                     }
                 };
                 computeChildrenNodeLength(indexed, state, data);
                 this.currentIndexedData.splice(this.currentIndexedData.indexOf(indexed) + 1, childrenLength);
-                this.treeDataHierarchyState.set(Array.isArray(indexed) ? indexed.join(',') : indexed, HierarchyState.collapse);
+                data.hierarchyState = HierarchyState.collapse;
             }
             this.updatePagerData();
             const newDiff = calculateArrayDiff(oldIndexedData, this.currentIndexedData);
@@ -33817,12 +33829,11 @@
                         ? indexKey.concat([subNodeSortedIndexArray[i]])
                         : [indexKey, subNodeSortedIndexArray[i]];
                     this.currentIndexedData.splice(this.currentIndexedData.indexOf(indexKey) + childrenLength, 0, childIndex);
-                    const preChildState = this.treeDataHierarchyState.get(childIndex.join(','));
                     const childData = this.getOriginalRecord(childIndex);
-                    if (!preChildState && childData.children) {
-                        this.treeDataHierarchyState.set(childIndex.join(','), HierarchyState.collapse);
+                    if (!nodeData.children[i].hierarchyState && childData.children) {
+                        nodeData.children[i].hierarchyState = HierarchyState.collapse;
                     }
-                    childrenLength += this.pushChildrenNode(childIndex, this.treeDataHierarchyState.get(childIndex.join(',')), nodeData.children[subNodeSortedIndexArray[i]]);
+                    childrenLength += this.pushChildrenNode(childIndex, nodeData.children[i].hierarchyState, nodeData.children[subNodeSortedIndexArray[i]]);
                 }
             }
             return childrenLength;
@@ -33840,20 +33851,11 @@
                 if (typeof field === 'string' || typeof field === 'number') {
                     const beforeChangedValue = this.beforeChangedRecordsMap[dataIndex][field];
                     const record = this.getOriginalRecord(dataIndex);
-                    let formatValue = value;
                     if (typeof beforeChangedValue === 'number' && isAllDigits(value)) {
-                        formatValue = parseFloat(value);
-                    }
-                    if (isPromise(record)) {
-                        record
-                            .then(record => {
-                            record[field] = formatValue;
-                        })
-                            .catch((err) => {
-                        });
+                        record[field] = parseFloat(value);
                     }
                     else {
-                        record[field] = formatValue;
+                        record[field] = value;
                     }
                 }
             }
@@ -34038,7 +34040,8 @@
                 let nodeLength = sortedIndexArray.length;
                 window.performance.now();
                 for (let i = 0; i < nodeLength; i++) {
-                    const subNodeLength = this.pushChildrenNode(sortedIndexArray[i], this.treeDataHierarchyState.get(sortedIndexArray[i]), this.getOriginalRecord(sortedIndexArray[i]));
+                    const record = this.getOriginalRecord(sortedIndexArray[i]);
+                    const subNodeLength = this.pushChildrenNode(sortedIndexArray[i], record.hierarchyState, this.getOriginalRecord(sortedIndexArray[i]));
                     nodeLength += subNodeLength;
                     i += subNodeLength;
                 }
@@ -34206,6 +34209,155 @@
             },
             length: 0
         });
+        isCanExchangeOrder(sourceIndex, targetIndex) {
+            if (this.hasHierarchyStateExpand) {
+                let sourceIndexs = this.currentPagerIndexedData[sourceIndex];
+                let targetIndexs = this.currentPagerIndexedData[targetIndex];
+                if (Array.isArray(sourceIndexs)) {
+                    sourceIndexs = [...sourceIndexs];
+                }
+                else {
+                    sourceIndexs = [sourceIndexs];
+                }
+                if (Array.isArray(targetIndexs)) {
+                    targetIndexs = [...targetIndexs];
+                }
+                else {
+                    targetIndexs = [targetIndexs];
+                }
+                if (targetIndex > sourceIndex) {
+                    if (targetIndexs.length > sourceIndexs.length) {
+                        let targetNextIndexs = this.currentPagerIndexedData[targetIndex + 1];
+                        if (Array.isArray(targetNextIndexs)) {
+                            targetNextIndexs = [...targetNextIndexs];
+                        }
+                        else {
+                            targetNextIndexs = [targetNextIndexs];
+                        }
+                        if (targetNextIndexs.length < targetIndexs.length) {
+                            targetIndexs.splice(targetIndexs.length - 1, 1);
+                        }
+                    }
+                }
+                if (sourceIndexs.length === targetIndexs.length) {
+                    for (let i = 0; i <= sourceIndexs.length - 2; i++) {
+                        if (sourceIndexs[i] !== targetIndexs[i]) {
+                            return false;
+                        }
+                    }
+                    return true;
+                }
+                return false;
+            }
+            return true;
+        }
+        reorderRecord(sourceIndex, targetIndex) {
+            if (this.lastOrder === 'asc' || this.lastOrder === 'desc') {
+                return;
+            }
+            else if (this.isCanExchangeOrder(sourceIndex, targetIndex)) {
+                if (this.hasHierarchyStateExpand) {
+                    let sourceIndexs = this.currentPagerIndexedData[sourceIndex];
+                    let targetIndexs = this.currentPagerIndexedData[targetIndex];
+                    if (Array.isArray(sourceIndexs)) {
+                        sourceIndexs = [...sourceIndexs];
+                    }
+                    else {
+                        sourceIndexs = [sourceIndexs];
+                    }
+                    if (Array.isArray(targetIndexs)) {
+                        targetIndexs = [...targetIndexs];
+                    }
+                    else {
+                        targetIndexs = [targetIndexs];
+                    }
+                    let sourceI;
+                    let targetI;
+                    if (sourceIndexs.length > 1 || targetIndexs.length > 1) {
+                        if (targetIndex > sourceIndex) {
+                            if (targetIndexs.length > sourceIndexs.length) {
+                                let targetNextIndexs = this.currentPagerIndexedData[targetIndex + 1];
+                                if (Array.isArray(targetNextIndexs)) {
+                                    targetNextIndexs = [...targetNextIndexs];
+                                }
+                                else {
+                                    targetNextIndexs = [targetNextIndexs];
+                                }
+                                if (targetNextIndexs.length < targetIndexs.length) {
+                                    targetIndexs.splice(targetIndexs.length - 1, 1);
+                                }
+                            }
+                        }
+                        sourceI = sourceIndexs.splice(sourceIndexs.length - 1, 1)[0];
+                        targetI = targetIndexs.splice(targetIndexs.length - 1, 1)[0];
+                        if (sourceIndexs.length >= 1) {
+                            const parent = this.getOriginalRecord(sourceIndexs);
+                            const sourceIds = parent.children.splice(sourceI, 1);
+                            sourceIds.unshift(targetI, 0);
+                            Array.prototype.splice.apply(parent.children, sourceIds);
+                        }
+                        else {
+                            const sourceIds = this.source.splice(sourceI, 1);
+                            sourceIds.unshift(targetI, 0);
+                            Array.prototype.splice.apply(this.source, sourceIds);
+                        }
+                    }
+                    else {
+                        sourceI = this.currentPagerIndexedData[sourceIndex];
+                        targetI = this.currentPagerIndexedData[targetIndex];
+                        const records = this.source.splice(sourceI, 1);
+                        records.unshift(targetI, 0);
+                        Array.prototype.splice.apply(this.source, records);
+                    }
+                    this.restoreTreeHierarchyState();
+                    this.updatePagerData();
+                }
+                else {
+                    const records = this.source.splice(sourceIndex, 1);
+                    records.unshift(targetIndex, 0);
+                    Array.prototype.splice.apply(this.source, records);
+                }
+            }
+        }
+        restoreTreeHierarchyState() {
+            if (this.hierarchyExpandLevel) {
+                for (let i = 0; i < this._sourceLength; i++) {
+                    const nodeData = this.getOriginalRecord(i);
+                    nodeData.children && !nodeData.hierarchyState && (nodeData.hierarchyState = HierarchyState.collapse);
+                }
+                this.currentIndexedData = Array.from({ length: this._sourceLength }, (_, i) => i);
+                let nodeLength = this._sourceLength;
+                for (let i = 0; i < nodeLength; i++) {
+                    const indexKey = this.currentIndexedData[i];
+                    const nodeData = this.getOriginalRecord(indexKey);
+                    if (nodeData.children?.length > 0 && nodeData.hierarchyState === HierarchyState.expand) {
+                        this.hasHierarchyStateExpand = true;
+                        const childrenLength = this.restoreChildrenNodeHierarchy(indexKey, nodeData);
+                        i += childrenLength;
+                        nodeLength += childrenLength;
+                    }
+                    else if (nodeData.children === true) {
+                        !nodeData.hierarchyState && (nodeData.hierarchyState = HierarchyState.collapse);
+                    }
+                }
+            }
+        }
+        restoreChildrenNodeHierarchy(indexKey, nodeData) {
+            let childTotalLength = 0;
+            const nodeLength = nodeData.children?.length ?? 0;
+            for (let j = 0; j < nodeLength; j++) {
+                if (nodeData.hierarchyState === HierarchyState.expand) {
+                    childTotalLength += 1;
+                }
+                const childNodeData = nodeData.children[j];
+                const childIndexKey = Array.isArray(indexKey) ? indexKey.concat(j) : [indexKey, j];
+                if (nodeData.hierarchyState === HierarchyState.expand) {
+                    this.currentIndexedData.splice(this.currentIndexedData.indexOf(indexKey) + childTotalLength, 0, childIndexKey);
+                }
+                childTotalLength += this.restoreChildrenNodeHierarchy(childIndexKey, childNodeData);
+            }
+            return childTotalLength;
+        }
     }
 
     function _setFieldCache(fCache, index, field, value) {
@@ -34218,7 +34370,7 @@
         static get EVENT_TYPE() {
             return DataSource.EVENT_TYPE;
         }
-        static ofArray(array, dataConfig, pagination, columnObjs, hierarchyExpandLevel) {
+        static ofArray(array, dataConfig, pagination, columnObjs, rowHierarchyType, hierarchyExpandLevel) {
             return new CachedDataSource({
                 get: (index) => {
                     if (Array.isArray(index)) {
@@ -34228,10 +34380,10 @@
                 },
                 length: array.length,
                 source: array
-            }, dataConfig, pagination, columnObjs, hierarchyExpandLevel);
+            }, dataConfig, pagination, columnObjs, rowHierarchyType, hierarchyExpandLevel);
         }
-        constructor(opt, dataConfig, pagination, columnObjs, hierarchyExpandLevel) {
-            super(opt, dataConfig, pagination, columnObjs, hierarchyExpandLevel);
+        constructor(opt, dataConfig, pagination, columnObjs, rowHierarchyType, hierarchyExpandLevel) {
+            super(opt, dataConfig, pagination, columnObjs, rowHierarchyType, hierarchyExpandLevel);
             this._recordCache = {};
             this._fieldCache = {};
         }
@@ -34751,7 +34903,7 @@
         _dealWithUpdateDataSource(table, () => {
             const data = records;
             table.internalProps.records = records;
-            const newDataSource = (table.internalProps.dataSource = CachedDataSource.ofArray(data, table.internalProps.dataConfig, table.pagination, table.internalProps.layoutMap.columnObjects, table.options.hierarchyExpandLevel ?? (table._hasHierarchyTreeHeader?.() ? 1 : undefined)));
+            const newDataSource = (table.internalProps.dataSource = CachedDataSource.ofArray(data, table.internalProps.dataConfig, table.pagination, table.internalProps.layoutMap.columnObjects, table.internalProps.layoutMap.rowHierarchyType, table.options.hierarchyExpandLevel ?? (table._hasHierarchyTreeHeader?.() ? 1 : undefined)));
             table.addReleaseObj(newDataSource);
         });
     }
@@ -35323,9 +35475,7 @@
         });
     }
     function decodeReactDom(dom) {
-        if (!dom ||
-            (!isValid$3(dom.$$typeof) &&
-                !isValid$3(dom.vtype))) {
+        if (!dom || !dom.$$typeof) {
             return dom;
         }
         const type = dom.type;
@@ -35653,6 +35803,20 @@
                 height: 13,
                 cursor: 'pointer'
             };
+        },
+        get dragReorder() {
+            return {
+                type: 'svg',
+                svg: '<svg t="1710129136961" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5166" width="200" height="200"><path d="M362.666667 192m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="#666666" p-id="5167"></path><path d="M661.333333 192m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="#666666" p-id="5168"></path><path d="M362.666667 512m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="#666666" p-id="5169"></path><path d="M661.333333 512m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="#666666" p-id="5170"></path><path d="M362.666667 832m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="#666666" p-id="5171"></path><path d="M661.333333 832m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z" fill="#666666" p-id="5172"></path></svg>',
+                width: 20,
+                height: 20,
+                funcType: IconFuncTypeEnum.dragReorder,
+                positionType: IconPosition.left,
+                name: 'dragReorder',
+                marginLeft: -10,
+                marginRight: 10,
+                cursor: 'grab'
+            };
         }
     };
     function get$2() {
@@ -38183,6 +38347,16 @@
         if (isPromise(value)) {
             value = table.getCellValue(col, row);
         }
+        let bgColorFunc;
+        if (table.internalProps?.dataConfig?.mappingRules && !table.isHeader(col, row)) {
+            table.internalProps?.dataConfig?.mappingRules?.forEach((mappingRule, i) => {
+                if (mappingRule.bgColor &&
+                    table.internalProps.layoutMap.getIndicatorKey(col, row) ===
+                        mappingRule.bgColor.indicatorKey) {
+                    bgColorFunc = mappingRule.bgColor.mapping;
+                }
+            });
+        }
         let cellGroup;
         if (type === 'text' || type === 'link') {
             if (type === 'link') {
@@ -38208,6 +38382,22 @@
                     }
                 }
             }
+            if (bgColorFunc) {
+                const cellValue = table.getCellOriginValue(col, row);
+                const bgColor = bgColorFunc(table, cellValue);
+                if (bgColor) {
+                    if (cellTheme) {
+                        cellTheme.group.fill = bgColor;
+                    }
+                    else {
+                        cellTheme = {
+                            group: {
+                                fill: bgColor
+                            }
+                        };
+                    }
+                }
+            }
             let customElementsGroup;
             let renderDefault = true;
             if (customResult) {
@@ -38404,11 +38594,23 @@
         const type = table.isHeader(col, row)
             ? table._getHeaderLayoutMap(col, row).headerType
             : table.getBodyColumnType(col, row);
-        const mayHaveIcon = cellLocation !== 'body' ? true : !!define?.icon || !!define?.tree;
+        const mayHaveIcon = cellLocation !== 'body'
+            ? true
+            : define?.dragOrder || !!define?.icon || !!define?.tree;
         const padding = cellTheme._vtable.padding;
         const textAlign = cellTheme.text.textAlign;
         const textBaseline = cellTheme.text.textBaseline;
         let newCellGroup;
+        let bgColorFunc;
+        if (table.internalProps?.dataConfig?.mappingRules && !table.isHeader(col, row)) {
+            table.internalProps?.dataConfig?.mappingRules?.forEach((mappingRule, i) => {
+                if (mappingRule.bgColor &&
+                    table.internalProps.layoutMap.getIndicatorKey(col, row) ===
+                        mappingRule.bgColor.indicatorKey) {
+                    bgColorFunc = mappingRule.bgColor.mapping;
+                }
+            });
+        }
         let cellWidth;
         let cellHeight;
         if (range) {
@@ -38421,10 +38623,10 @@
         }
         if (isPromise(value)) {
             oldCellGroup.removeAllChild();
-            dealPromiseData(value, table, updateCellContent.bind(null, type, value, define, table, col, row, cellWidth, cellHeight, oldCellGroup, padding, textAlign, textBaseline, mayHaveIcon, addNew, cellTheme, range, customResult));
+            dealPromiseData(value, table, updateCellContent.bind(null, type, value, define, table, col, row, bgColorFunc, cellWidth, cellHeight, oldCellGroup, padding, textAlign, textBaseline, mayHaveIcon, addNew, cellTheme, range, customResult));
         }
         else {
-            newCellGroup = updateCellContent(type, value, define, table, col, row, cellWidth, cellHeight, oldCellGroup, padding, textAlign, textBaseline, mayHaveIcon, addNew, cellTheme, range, customResult);
+            newCellGroup = updateCellContent(type, value, define, table, col, row, bgColorFunc, cellWidth, cellHeight, oldCellGroup, padding, textAlign, textBaseline, mayHaveIcon, addNew, cellTheme, range, customResult);
         }
         if (isMerge) {
             const { width: contentWidth } = newCellGroup.attribute;
@@ -38435,7 +38637,7 @@
         }
         return newCellGroup;
     }
-    function updateCellContent(type, value, define, table, col, row, cellWidth, cellHeight, oldCellGroup, padding, textAlign, textBaseline, mayHaveIcon, addNew, cellTheme, range, customResult) {
+    function updateCellContent(type, value, define, table, col, row, bgColorFunc, cellWidth, cellHeight, oldCellGroup, padding, textAlign, textBaseline, mayHaveIcon, addNew, cellTheme, range, customResult) {
         if (isPromise(value)) {
             value = table.getCellValue(col, row);
         }
@@ -38454,7 +38656,7 @@
     }
     function canUseFastUpdate(col, row, oldCellGroup, autoWrapText, table) {
         const define = table.getBodyColumnDefine(col, row);
-        const mayHaveIcon = !!define?.icon || !!define?.tree;
+        const mayHaveIcon = !!define?.icon || !!define?.tree || define?.dragOrder;
         const cellType = table.getBodyColumnType(col, row);
         const autoRowHeight = table.heightMode === 'autoHeight';
         const value = table.getCellValue(col, row);
@@ -38474,10 +38676,10 @@
         for (let col = range.start.col; col <= range.end.col; col++) {
             for (let row = range.start.row; row <= range.end.row; row++) {
                 const cellGroup = table.scenegraph.getCell(col, row, true);
-                if (cellGroup.role === 'cell' && range.start.row !== range.end.row && cellGroup.contentWidth !== cellWidth) {
+                if (range.start.row !== range.end.row) {
                     updateCellContentHeight(cellGroup, cellHeight, cellHeight, table.heightMode === 'autoHeight', padding, textAlign, textBaseline);
                 }
-                if (cellGroup.role === 'cell' && range.start.col !== range.end.col && cellGroup.contentHeight !== cellHeight) {
+                if (range.start.col !== range.end.col) {
                     updateCellContentWidth(cellGroup, cellWidth, cellHeight, 0, table.heightMode === 'autoHeight', padding, textAlign, textBaseline, table.scenegraph);
                 }
                 cellGroup.contentWidth = cellWidth;
@@ -39779,7 +39981,11 @@
             const cellType = table.isHeader(col, row)
                 ? table._getHeaderLayoutMap(col, row)?.headerType
                 : table.getBodyColumnType(col, row);
-            if (cellType !== 'text' && cellType !== 'link' && cellType !== 'progressbar' && cellType !== 'checkbox') {
+            if (isValid$3(cellType) &&
+                cellType !== 'text' &&
+                cellType !== 'link' &&
+                cellType !== 'progressbar' &&
+                cellType !== 'checkbox') {
                 const defaultHeight = table.getDefaultRowHeight(row);
                 maxHeight = Math.max(maxHeight, isNumber$4(defaultHeight) ? defaultHeight : table.defaultRowHeight);
                 continue;
@@ -39944,7 +40150,7 @@
         }
         else {
             const define = table.getBodyColumnDefine(col, row);
-            mayHaveIcon = !!define?.icon || !!define?.tree;
+            mayHaveIcon = !!define?.icon || !!define?.tree || define?.dragOrder;
         }
         if (mayHaveIcon) {
             const icons = table.getCellIcons(col, row);
@@ -40825,9 +41031,9 @@
                     menuInfo = contextmenu;
                 }
                 else if (typeof contextmenu === 'function') {
-                    const { field } = this._table.isHeader(col, row)
+                    const { field } = (this._table.isHeader(col, row)
                         ? this._table.getHeaderDefine(col, row)
-                        : this._table.getBodyColumnDefine(col, row);
+                        : this._table.getBodyColumnDefine(col, row));
                     menuInfo = contextmenu(field, row, col);
                 }
                 return {
@@ -41003,7 +41209,8 @@
                 linePoints.push({ x: 0, y: 0 });
                 linePoints.push({ x: 0, y: this.table.tableNoFrameHeight });
             }
-            else if (cellLocation === 'rowHeader') {
+            else if (cellLocation === 'rowHeader' ||
+                this.table.internalProps.layoutMap.isSeriesNumberInBody(col, row)) {
                 rectY = this.table.getRowsHeight(0, row - 1) - this.table.stateManager.scroll.verticalBarPos;
                 rectX = this.table.getColsWidth(0, this.table.frozenColCount - 1);
                 rectWidth = this.table.tableNoFrameWidth;
@@ -43296,7 +43503,11 @@
             const cellType = table.isHeader(col, row)
                 ? table._getHeaderLayoutMap(col, row)?.headerType
                 : table.getBodyColumnType(col, row);
-            if (cellType !== 'text' && cellType !== 'link' && cellType !== 'progressbar' && cellType !== 'checkbox') {
+            if (isValid$3(cellType) &&
+                cellType !== 'text' &&
+                cellType !== 'link' &&
+                cellType !== 'progressbar' &&
+                cellType !== 'checkbox') {
                 maxWidth = Math.max(maxWidth, table.getColWidthDefinedNumber(col) || 0);
                 continue;
             }
@@ -43308,7 +43519,8 @@
                     continue;
                 }
                 if (hd?.hierarchyLevel) {
-                    cellHierarchyIndent = (hd.hierarchyLevel ?? 0) * (layoutMap.rowHierarchyIndent ?? 0);
+                    cellHierarchyIndent =
+                        (hd.hierarchyLevel ?? 0) * (layoutMap.rowHierarchyIndent ?? 0);
                 }
             }
             else {
@@ -43411,7 +43623,7 @@
         }
         else {
             const define = table.getBodyColumnDefine(col, row);
-            mayHaveIcon = !!define?.icon || !!define?.tree;
+            mayHaveIcon = !!define?.icon || !!define?.tree || define?.dragOrder;
         }
         if (mayHaveIcon) {
             const icons = table.getCellIcons(col, row);
@@ -43579,7 +43791,9 @@
             const define = cellLocation !== 'body'
                 ? table.getHeaderDefine(colForDefine, rowForDefine)
                 : table.getBodyColumnDefine(colForDefine, rowForDefine);
-            const mayHaveIcon = cellLocation !== 'body' ? true : !!define?.icon || !!define?.tree;
+            const mayHaveIcon = cellLocation !== 'body'
+                ? true
+                : define?.dragOrder || !!define?.icon || !!define?.tree;
             if (!range && (cellLocation !== 'body' || define?.mergeCell)) {
                 range = table.getCellRange(col, row);
                 isMerge = range.start.col !== range.end.col || range.start.row !== range.end.row;
@@ -43607,8 +43821,9 @@
             if (cellLocation !== 'body' && !cellTheme.group.fill) {
                 cellTheme.group.fill = '#fff';
             }
-            const type = (table.isHeader(col, row) ? table._getHeaderLayoutMap(col, row).headerType : table.getBodyColumnType(col, row)) ||
-                'text';
+            const type = (table.isHeader(col, row)
+                ? table._getHeaderLayoutMap(col, row).headerType
+                : table.getBodyColumnType(col, row)) || 'text';
             if (isPromise(value)) {
                 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);
@@ -43621,12 +43836,12 @@
                 columnGroup.updateColumnRowNumber(row);
                 if (isMerge) {
                     const rangeHeight = table.getRowHeight(row);
-                    table.getColWidth(col);
+                    const rangeWidth = table.getColWidth(col);
                     const { width: contentWidth } = cellGroup.attribute;
                     const { height: contentHeight } = cellGroup.attribute;
                     cellGroup.contentWidth = contentWidth;
                     cellGroup.contentHeight = contentHeight;
-                    dealWithMergeCellSize(range, contentWidth, contentHeight, padding, textAlign, textBaseline, table);
+                    resizeCellGroup(cellGroup, rangeWidth, rangeHeight, range, table);
                     columnGroup.updateColumnHeight(rangeHeight);
                     y += rangeHeight;
                 }
@@ -43740,9 +43955,29 @@
         createColGroup(cornerHeaderGroup, xOrigin, yOrigin, 0, table.frozenColCount - 1, 0, table.columnHeaderLevelCount - 1, table.isListTable() ? 'columnHeader' : 'cornerHeader', table);
         distCol - table.rightFrozenColCount >= table.frozenColCount &&
             createColGroup(colHeaderGroup, xOrigin, yOrigin, table.frozenColCount, distCol - table.rightFrozenColCount, 0, table.columnHeaderLevelCount - 1, 'columnHeader', table);
-        createColGroup(rowHeaderGroup, xOrigin, yOrigin, 0, table.frozenColCount - 1, table.columnHeaderLevelCount, distRow - table.bottomFrozenRowCount, table.isListTable() && !table.internalProps.transpose ? 'body' : 'rowHeader', table);
+        if (table.frozenColCount > 0) {
+            if (table.leftRowSeriesNumberCount > 0) {
+                createColGroup(rowHeaderGroup, xOrigin, yOrigin, 0, table.leftRowSeriesNumberCount - 1, table.columnHeaderLevelCount, distRow - table.bottomFrozenRowCount, 'rowHeader', table);
+            }
+            if (table.rowHeaderLevelCount > 0) {
+                createColGroup(rowHeaderGroup, xOrigin, yOrigin, table.leftRowSeriesNumberCount, table.leftRowSeriesNumberCount + table.rowHeaderLevelCount - 1, table.columnHeaderLevelCount, distRow - table.bottomFrozenRowCount, 'rowHeader', table);
+            }
+            if (table.frozenColCount > table.rowHeaderLevelCount + table.leftRowSeriesNumberCount) {
+                createColGroup(rowHeaderGroup, xOrigin, yOrigin, table.rowHeaderLevelCount + table.leftRowSeriesNumberCount, table.frozenColCount - 1, table.columnHeaderLevelCount, distRow - table.bottomFrozenRowCount, 'body', table);
+            }
+        }
         if (table.bottomFrozenRowCount > 0) {
-            createColGroup(leftBottomCornerGroup, xOrigin, yOrigin, 0, table.frozenColCount - 1, table.rowCount - 1 - table.bottomFrozenRowCount + 1, table.rowCount - 1, table.isListTable() ? (table.transpose ? 'rowHeader' : 'body') : 'rowHeader', table);
+            if (table.frozenColCount > 0) {
+                if (table.leftRowSeriesNumberCount > 0) {
+                    createColGroup(leftBottomCornerGroup, xOrigin, yOrigin, 0, table.leftRowSeriesNumberCount - 1, table.rowCount - 1 - table.bottomFrozenRowCount + 1, table.rowCount - 1, 'rowHeader', table);
+                }
+                if (table.rowHeaderLevelCount > 0) {
+                    createColGroup(leftBottomCornerGroup, xOrigin, yOrigin, table.leftRowSeriesNumberCount, table.leftRowSeriesNumberCount + table.rowHeaderLevelCount - 1, table.rowCount - 1 - table.bottomFrozenRowCount + 1, table.rowCount - 1, 'rowHeader', table);
+                }
+                if (table.frozenColCount > table.rowHeaderLevelCount + table.leftRowSeriesNumberCount) {
+                    createColGroup(leftBottomCornerGroup, xOrigin, yOrigin, table.rowHeaderLevelCount + table.leftRowSeriesNumberCount, table.frozenColCount - 1, table.rowCount - 1 - table.bottomFrozenRowCount + 1, table.rowCount - 1, 'body', table);
+                }
+            }
             distCol - table.rightFrozenColCount >= table.frozenColCount &&
                 createColGroup(bottomFrozenGroup, xOrigin, yOrigin, table.frozenColCount, distCol - table.rightFrozenColCount, table.rowCount - 1 - table.bottomFrozenRowCount + 1, table.rowCount - 1, table.isPivotChart() ? 'rowHeader' : 'body', table);
         }
@@ -44642,7 +44877,7 @@
             computeColsWidth(this.table, this.currentCol + 1, endCol);
             for (let row = 0; row < this.table.rowCount; row++) {
                 const cellGroup = this.highPerformanceGetCell(this.currentCol, row);
-                if (cellGroup.role === 'cell' && isNumber$4(cellGroup.mergeStartCol) && cellGroup.mergeStartCol > this.currentCol) {
+                if (isNumber$4(cellGroup.mergeStartCol) && cellGroup.mergeStartCol > this.currentCol) {
                     this.table.scenegraph.updateCellContent(cellGroup.col, cellGroup.row);
                 }
             }
@@ -45203,7 +45438,7 @@
             });
         }
     }
-    function updateCellSelectBorder(scene, newStartCol, newStartRow, newEndCol, newEndRow) {
+    function updateCellSelectBorder(scene, newStartCol, newStartRow, newEndCol, newEndRow, ifExtendSelectRange = true) {
         let startCol = Math.max(Math.min(newEndCol, newStartCol), 0);
         let startRow = Math.max(Math.min(newEndRow, newStartRow), 0);
         let endCol = Math.min(Math.max(newEndCol, newStartCol), scene.table.colCount - 1);
@@ -45266,7 +45501,7 @@
                 extendSelectRange();
             }
         };
-        extendSelectRange();
+        ifExtendSelectRange && extendSelectRange();
         scene.selectingRangeComponents.forEach((selectComp, key) => {
             selectComp.rect.delete();
         });
@@ -45380,22 +45615,6 @@
             scene.createCellSelectBorder(columnHeaderStartCol, columnHeaderStartRow, columnHeaderEndCol, columnHeaderEndRow, 'body', `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
         }
     }
-    function hideCellSelectBorder(scene) {
-        scene.selectingRangeComponents.forEach((selectComp, key) => {
-            selectComp.rect.setAttribute('visible', false);
-        });
-        scene.selectedRangeComponents.forEach((selectComp, key) => {
-            selectComp.rect.setAttribute('visible', false);
-        });
-    }
-    function restoreCellSelectBorder(scene) {
-        scene.selectingRangeComponents.forEach((selectComp, key) => {
-            selectComp.rect.setAttribute('visible', false);
-        });
-        scene.selectedRangeComponents.forEach((selectComp, key) => {
-            selectComp.rect.setAttribute('visible', false);
-        });
-    }
 
     function createCellSelectBorder(scene, start_Col, start_Row, end_Col, end_Row, selectRangeType, selectId, strokes) {
         const startCol = Math.min(start_Col, end_Col);
@@ -45546,6 +45765,7 @@
             updateBottomFrozeCellGroups();
         }
         else if (removeRows.length) {
+            setRowSeriesNumberCellNeedUpdate(removeRows[removeRows.length - 1], scene);
             scene.proxy.updateCellGroups(scene.proxy.screenRowCount * 2);
             updateBottomFrozeCellGroups();
             scene.proxy.progress();
@@ -45824,6 +46044,13 @@
             }
         }
     }
+    function setRowSeriesNumberCellNeedUpdate(startUpdateRow, scene) {
+        if (scene.table.isHasSeriesNumber()) {
+            for (let row = startUpdateRow; row <= scene.table.rowCount - 1; row++) {
+                updateCell$1(0, row, scene.table, false);
+            }
+        }
+    }
 
     function handleTextStick(table) {
         const { changedCells } = table.internalProps.stick;
@@ -47633,8 +47860,8 @@
         deleteAllSelectBorder() {
             deleteAllSelectBorder(this);
         }
-        updateCellSelectBorder(newStartCol, newStartRow, newEndCol, newEndRow) {
-            updateCellSelectBorder(this, newStartCol, newStartRow, newEndCol, newEndRow);
+        updateCellSelectBorder(newStartCol, newStartRow, newEndCol, newEndRow, extendSelectRange = true) {
+            updateCellSelectBorder(this, newStartCol, newStartRow, newEndCol, newEndRow, extendSelectRange);
         }
         recreateAllSelectRangeComponents() {
             deleteAllSelectBorder(this);
@@ -48754,7 +48981,7 @@
                 end: { col: table.colCount - 1, row: table.rowCount - 1 }
             });
             const currentRange = state.select.ranges[state.select.ranges.length - 1];
-            scenegraph.updateCellSelectBorder(currentRange.start.col, currentRange.start.row, currentRange.end.col, currentRange.end.row);
+            scenegraph.updateCellSelectBorder(currentRange.start.col, currentRange.start.row, currentRange.end.col, currentRange.end.row, false);
         }
         else if (cellPos.col !== -1 && cellPos.row !== -1 && (col === -1 || row === -1)) {
             cellPos.col = -1;
@@ -48788,6 +49015,7 @@
                 scenegraph.updateCellSelectBorder(currentRange.start.col, currentRange.start.row, currentRange.end.col, currentRange.end.row);
             }
             else {
+                let extendSelectRange = true;
                 if (cellPos.col !== -1 && cellPos.row !== -1 && !isCtrl) {
                     state.select.ranges = [];
                     scenegraph.deleteAllSelectBorder();
@@ -48806,6 +49034,20 @@
                         end: { col: table.colCount - 1, row: cellRange.end.row }
                     });
                 }
+                else if (table.internalProps.layoutMap.isSeriesNumberInHeader(col, row)) {
+                    extendSelectRange = false;
+                    state.select.ranges.push({
+                        start: { col: 0, row: 0 },
+                        end: { col: table.colCount - 1, row: table.rowCount - 1 }
+                    });
+                }
+                else if (table.internalProps.layoutMap.isSeriesNumberInBody(col, row)) {
+                    extendSelectRange = false;
+                    state.select.ranges.push({
+                        start: { col, row: row },
+                        end: { col: table.colCount - 1, row: row }
+                    });
+                }
                 else if (col >= 0 && row >= 0) {
                     const cellRange = table.getCellRange(col, row);
                     state.select.ranges.push({
@@ -48817,25 +49059,36 @@
                 cellPos.row = row;
                 const currentRange = state.select.ranges?.[state.select.ranges.length - 1];
                 currentRange &&
-                    scenegraph.updateCellSelectBorder(currentRange.start.col, currentRange.start.row, currentRange.end.col, currentRange.end.row);
+                    scenegraph.updateCellSelectBorder(currentRange.start.col, currentRange.start.row, currentRange.end.col, currentRange.end.row, extendSelectRange);
             }
         }
         else if (interactionState === InteractionState.grabing && !table.stateManager.isResizeCol()) {
+            let extendSelectRange = true;
             if (cellPos.col === -1) {
                 cellPos.col = col;
             }
             if (cellPos.row === -1) {
                 cellPos.row = row;
             }
-            const currentRange = state.select.ranges[state.select.ranges.length - 1];
-            currentRange &&
-                (currentRange.end = {
-                    col,
-                    row
-                });
             cellPos.col = col;
             cellPos.row = row;
-            currentRange && scenegraph.updateCellSelectBorder(currentRange.start.col, currentRange.start.row, col, row);
+            const currentRange = state.select.ranges[state.select.ranges.length - 1];
+            if (currentRange) {
+                if (table.internalProps.layoutMap.isSeriesNumberInBody(currentRange.start.col, currentRange.start.row)) {
+                    extendSelectRange = false;
+                    currentRange.end = {
+                        col: table.colCount - 1,
+                        row
+                    };
+                }
+                else {
+                    currentRange.end = {
+                        col,
+                        row
+                    };
+                }
+                scenegraph.updateCellSelectBorder(currentRange.start.col, currentRange.start.row, currentRange.end.col, currentRange.end.row, extendSelectRange);
+            }
         }
         scenegraph.updateNextFrame();
     }
@@ -48998,11 +49251,11 @@
             }
         }
         else if (table.isRowHeader(source.col, source.row)) {
+            const layoutMap = table.internalProps.layoutMap;
             const targetCellRange = table.getCellRange(sourceCellRange.start.col, target.row);
-            if (target.col >= table.rowHeaderLevelCount) {
-                target.col = table.rowHeaderLevelCount - 1;
+            if (target.col >= table.rowHeaderLevelCount + layoutMap.leftRowSeriesNumberColumnCount) {
+                target.col = table.rowHeaderLevelCount + layoutMap.leftRowSeriesNumberColumnCount - 1;
             }
-            const layoutMap = table.internalProps.layoutMap;
             if (layoutMap.rowHierarchyType === 'tree') {
                 const sourceRowHeaderPaths = layoutMap.getCellHeaderPathsWidthTreeNode(source.col, source.row)
                     .rowHeaderPaths;
@@ -49040,7 +49293,12 @@
         state.columnMove.x = x - state.table.tableX;
         state.columnMove.y = y - state.table.tableY;
         const cellLocation = state.table.getCellLocation(col, row);
-        const delta = cellLocation === 'columnHeader' ? state.columnMove.x : cellLocation === 'rowHeader' ? state.columnMove.y : 0;
+        const delta = cellLocation === 'columnHeader'
+            ? state.columnMove.x
+            : cellLocation === 'rowHeader' ||
+                state.table.internalProps.layoutMap.isSeriesNumberInBody(col, row)
+                ? state.columnMove.y
+                : 0;
         state.table.scenegraph.component.showMoveCol(col, row, delta);
         state.table.stateManager.updateSelectPos(-1, -1);
         state.table.scenegraph.updateNextFrame();
@@ -49085,7 +49343,8 @@
                         state.table.stateManager.scroll.horizontalBarPos;
             }
         }
-        else if (cellLocation === 'rowHeader') {
+        else if (cellLocation === 'rowHeader' ||
+            state.table.internalProps.layoutMap.isSeriesNumberInBody(col, row)) {
             backY = state.columnMove.y;
             if (state.table.isFrozenRow(row)) {
                 lineY =
@@ -49114,26 +49373,45 @@
             state.columnMove.rowSource >= 0 &&
             state.columnMove.colTarget >= 0 &&
             state.columnMove.rowTarget >= 0) {
-            const sourceMergeInfo = getCellMergeInfo(state.table, state.columnMove.colSource, state.columnMove.rowSource);
-            const targetMergeInfo = getCellMergeInfo(state.table, state.columnMove.colTarget, state.columnMove.rowTarget);
+            const oldSourceMergeInfo = state.table.getCellRange(state.columnMove.colSource, state.columnMove.rowSource);
+            const oldTargetMergeInfo = state.table.getCellRange(state.columnMove.colTarget, state.columnMove.rowTarget);
             const moveContext = state.table._moveHeaderPosition({ col: state.columnMove.colSource, row: state.columnMove.rowSource }, { col: state.columnMove.colTarget, row: state.columnMove.rowTarget });
             if (moveContext) {
+                state.table.internalProps.layoutMap.clearCellRangeMap();
+                const sourceMergeInfo = state.table.getCellRange(state.columnMove.colSource, state.columnMove.rowSource);
+                const targetMergeInfo = state.table.getCellRange(state.columnMove.colTarget, state.columnMove.rowTarget);
+                const colMin = Math.min(sourceMergeInfo.start.col, targetMergeInfo.start.col, oldSourceMergeInfo.start.col, oldTargetMergeInfo.start.col);
+                const colMax = Math.max(sourceMergeInfo.end.col, targetMergeInfo.end.col, oldSourceMergeInfo.end.col, oldTargetMergeInfo.end.col);
+                const rowMin = Math.min(sourceMergeInfo.start.row, targetMergeInfo.start.row, oldSourceMergeInfo.start.row, oldTargetMergeInfo.start.row);
+                let rowMax = Math.max(sourceMergeInfo.end.row, targetMergeInfo.end.row, oldSourceMergeInfo.end.row, oldTargetMergeInfo.end.row);
+                if (moveContext.moveType === 'row' &&
+                    state.table.internalProps.layoutMap.rowHierarchyType === 'tree') {
+                    if (moveContext.targetIndex > moveContext.sourceIndex) {
+                        rowMax = rowMax + moveContext.targetSize - 1;
+                    }
+                    else {
+                        rowMax = rowMax + moveContext.sourceSize - 1;
+                    }
+                }
+                if (!state.table.transpose &&
+                    state.table.internalProps.layoutMap.isSeriesNumberInBody(state.columnMove.colSource, state.columnMove.rowSource)) {
+                    state.table.changeRecordOrder(moveContext.sourceIndex, moveContext.targetIndex);
+                }
                 if (moveContext.moveType === 'column') {
-                    clearWidthsAndHeightsCache(Math.min(sourceMergeInfo?.start?.col ?? state.columnMove.colSource, targetMergeInfo?.start?.col ?? state.columnMove.colTarget), Math.max(sourceMergeInfo?.end?.col ?? state.columnMove.colSource, targetMergeInfo?.end?.col ?? state.columnMove.colTarget), 0, -1, state.table);
+                    clearWidthsAndHeightsCache(colMin, colMax, 0, -1, state.table);
                 }
                 else {
-                    clearWidthsAndHeightsCache(0, -1, Math.min(sourceMergeInfo?.start?.row ?? state.columnMove.rowSource, targetMergeInfo?.start?.row ?? state.columnMove.rowTarget), Math.max(sourceMergeInfo?.end?.row ?? state.columnMove.rowSource, targetMergeInfo?.end?.row ?? state.columnMove.rowTarget), state.table);
+                    clearWidthsAndHeightsCache(0, -1, rowMin, rowMax, state.table);
                 }
                 state.table.clearCellStyleCache();
-                if (moveContext.moveType === 'column') {
-                    state.table.scenegraph.updateHeaderPosition(Math.min(moveContext.sourceIndex, moveContext.targetIndex), Math.min(moveContext.targetIndex > moveContext.sourceIndex
-                        ? moveContext.targetIndex + moveContext.sourceSize - 1
-                        : moveContext.sourceIndex + moveContext.sourceSize - 1, state.table.colCount - 1), 0, -1, moveContext.moveType);
+                if (state.table.internalProps.layoutMap.isSeriesNumberInBody(state.columnMove.colSource, state.columnMove.rowSource)) {
+                    state.table.scenegraph.updateHeaderPosition(state.table.scenegraph.proxy.colStart, state.table.scenegraph.proxy.colEnd, state.table.scenegraph.proxy.rowStart, state.table.scenegraph.proxy.rowEnd, moveContext.moveType);
+                }
+                else if (moveContext.moveType === 'column') {
+                    state.table.scenegraph.updateHeaderPosition(colMin, colMax, 0, -1, moveContext.moveType);
                 }
                 else {
-                    state.table.scenegraph.updateHeaderPosition(0, -1, Math.min(moveContext.sourceIndex, moveContext.targetIndex), Math.min(moveContext.targetIndex > moveContext.sourceIndex
-                        ? moveContext.targetIndex + moveContext.sourceSize - 1
-                        : moveContext.sourceIndex + moveContext.sourceSize - 1, state.table.rowCount - 1), moveContext.moveType);
+                    state.table.scenegraph.updateHeaderPosition(0, -1, rowMin, rowMax, moveContext.moveType);
                 }
                 if (state.table.internalProps.frozenColDragHeaderMode === 'adjustFrozenCount' && state.table.isListTable()) {
                     if (state.table.isFrozenColumn(state.columnMove.colTarget) &&
@@ -49738,7 +50016,9 @@
         checkFrozen() {
             const originalFrozenColCount = this.table.isListTable() && !this.table.internalProps.transpose
                 ? this.table.options.frozenColCount
-                : this.table.rowHeaderLevelCount;
+                : this.table.isPivotChart()
+                    ? this.table.rowHeaderLevelCount ?? 0
+                    : Math.max((this.table.rowHeaderLevelCount ?? 0) + this.table.internalProps.layoutMap.leftRowSeriesNumberColumnCount, this.table.options.frozenColCount ?? 0);
             if (originalFrozenColCount) {
                 if (this.table.tableNoFrameWidth - this.table.getColsWidth(0, originalFrozenColCount - 1) <= 120) {
                     this.table._setFrozenColCount(0);
@@ -50717,6 +50997,10 @@
                     }
                 }
             }
+            else if (hitIcon.attribute.funcType === IconFuncTypeEnum.dragReorder) {
+                stateManager.startMoveCol(eventArgsSet.eventArgs.col, eventArgsSet.eventArgs.row, eventArgsSet.abstractPos.x, eventArgsSet.abstractPos.y);
+                stateManager.updateInteractionState(InteractionState.grabing);
+            }
             if (table.hasListeners(TABLE_EVENT_TYPE.MOUSEDOWN_CELL)) {
                 const eventArgsSet = getCellEventArgsSet(e);
                 if (eventArgsSet.eventArgs) {
@@ -55062,6 +55346,19 @@
         return high < 0 ? 0 : high;
     }
 
+    class RowSeriesNumberHelper {
+        dragReorderIconName;
+        _table;
+        constructor(_table) {
+            this._table = _table;
+            const regedIcons = get$2();
+            this.dragReorderIconName = regedIcons[InternalIconName.dragReorderIconName];
+        }
+        getIcons(col, row) {
+            return [this.dragReorderIconName];
+        }
+    }
+
     class CustomCellStylePlugin {
         table;
         customCellStyle;
@@ -55207,7 +55504,7 @@
             return TABLE_EVENT_TYPE;
         }
         options;
-        version = "0.21.4-alpha.4";
+        version = "0.22.0";
         pagination;
         id = `VTable${Date.now()}`;
         headerStyleCache;
@@ -55222,7 +55519,7 @@
             if (!container && options.mode !== 'node') {
                 throw new Error("vtable's container is undefined");
             }
-            const { frozenColCount = 0, defaultRowHeight = 40, defaultHeaderRowHeight, defaultColWidth = 80, defaultHeaderColWidth, widthMode = 'standard', heightMode = 'standard', autoFillWidth = false, autoFillHeight = false, keyboardOptions, eventOptions, columnResizeMode, dragHeaderMode, showFrozenIcon, allowFrozenColCount, padding, hover, menu, select: click, customRender, pixelRatio = defaultPixelRatio, renderChartAsync, renderChartAsyncBatchCount, mode, modeParams, canvasWidth, canvasHeight, overscrollBehavior, limitMinWidth } = options;
+            const { frozenColCount = 0, defaultRowHeight = 40, defaultHeaderRowHeight, defaultColWidth = 80, defaultHeaderColWidth, widthMode = 'standard', heightMode = 'standard', autoFillWidth = false, autoFillHeight = false, keyboardOptions, eventOptions, rowSeriesNumber, columnResizeMode, dragHeaderMode, showFrozenIcon, allowFrozenColCount, padding, hover, menu, select: click, customRender, pixelRatio = defaultPixelRatio, renderChartAsync, renderChartAsyncBatchCount, mode, modeParams, canvasWidth, canvasHeight, overscrollBehavior, limitMinWidth } = options;
             this.container = container;
             this.options = options;
             this.options.container = container;
@@ -55274,6 +55571,7 @@
             internalProps.defaultHeaderColWidth = defaultHeaderColWidth ?? defaultColWidth;
             internalProps.keyboardOptions = keyboardOptions;
             internalProps.eventOptions = eventOptions;
+            internalProps.rowSeriesNumber = rowSeriesNumber;
             internalProps.columnResizeMode = columnResizeMode;
             internalProps.dragHeaderMode = dragHeaderMode;
             internalProps.renderChartAsync = renderChartAsync;
@@ -55312,6 +55610,7 @@
             internalProps.theme.isPivot = this.isPivotTable();
             internalProps.bodyHelper = new BodyHelper(this);
             internalProps.headerHelper = new HeaderHelper(this);
+            internalProps.rowSeriesNumberHelper = new RowSeriesNumberHelper(this);
             internalProps.autoWrapText = options.autoWrapText;
             internalProps.allowFrozenColCount = options.allowFrozenColCount ?? 0;
             internalProps.limitMaxAutoWidth = options.limitMaxAutoWidth ?? 450;
@@ -56298,7 +56597,7 @@
         }
         updateOption(options) {
             this.options = options;
-            const { frozenColCount = 0, defaultRowHeight = 40, defaultHeaderRowHeight, defaultColWidth = 80, defaultHeaderColWidth = 80, keyboardOptions, eventOptions, columnResizeMode, dragHeaderMode, showFrozenIcon, allowFrozenColCount, padding, hover, menu, select: click, pixelRatio, widthMode, heightMode, autoFillWidth, autoFillHeight, customRender, renderChartAsync, renderChartAsyncBatchCount, overscrollBehavior, limitMinWidth } = options;
+            const { frozenColCount = 0, defaultRowHeight = 40, defaultHeaderRowHeight, defaultColWidth = 80, defaultHeaderColWidth = 80, keyboardOptions, eventOptions, rowSeriesNumber, columnResizeMode, dragHeaderMode, showFrozenIcon, allowFrozenColCount, padding, hover, menu, select: click, pixelRatio, widthMode, heightMode, autoFillWidth, autoFillHeight, customRender, renderChartAsync, renderChartAsyncBatchCount, overscrollBehavior, limitMinWidth } = options;
             if (pixelRatio && pixelRatio !== this.internalProps.pixelRatio) {
                 this.internalProps.pixelRatio = pixelRatio;
             }
@@ -56336,6 +56635,7 @@
             internalProps.defaultHeaderColWidth = defaultHeaderColWidth ?? defaultColWidth;
             internalProps.keyboardOptions = keyboardOptions;
             internalProps.eventOptions = eventOptions;
+            internalProps.rowSeriesNumber = rowSeriesNumber;
             internalProps.columnResizeMode = columnResizeMode;
             internalProps.dragHeaderMode = dragHeaderMode;
             internalProps.renderChartAsync = renderChartAsync;
@@ -56689,7 +56989,10 @@
         }
         getCellType(col, row) {
             let cellType;
-            if (this.isHeader(col, row)) {
+            if (this.isSeriesNumberInHeader(col, row)) {
+                return this.internalProps.layoutMap.getSeriesNumberHeader(col, row).cellType;
+            }
+            else if (this.isHeader(col, row)) {
                 cellType = this.internalProps.layoutMap.getHeader(col, row).headerType;
             }
             else {
@@ -56817,6 +57120,14 @@
         _dropDownMenuIsHighlight(colNow, rowNow, index) {
             return this.stateManager.dropDownMenuIsHighlight(colNow, rowNow, index);
         }
+        isSeriesNumberInBody(col, row) {
+            return (this.internalProps.layoutMap &&
+                this.internalProps.layoutMap.isSeriesNumberInBody(col, row));
+        }
+        isSeriesNumberInHeader(col, row) {
+            return (this.internalProps.layoutMap &&
+                this.internalProps.layoutMap.isSeriesNumberInHeader(col, row));
+        }
         isHeader(col, row) {
             return this.internalProps.layoutMap && this.internalProps.layoutMap.isHeader(col, row);
         }
@@ -56970,19 +57281,12 @@
                 }
                 return cacheStyle;
             }
-            let bgColorFunc;
-            if (this.internalProps?.dataConfig?.mappingRules && !this.isHeader(col, row)) {
-                this.internalProps?.dataConfig?.mappingRules?.forEach((mappingRule, i) => {
-                    if (mappingRule.bgColor &&
-                        this.internalProps.layoutMap.getIndicatorKey(col, row) ===
-                            mappingRule.bgColor.indicatorKey) {
-                        bgColorFunc = mappingRule.bgColor.mapping;
-                    }
-                });
-            }
             let cacheKey;
             const cellType = this.getCellType(col, row);
-            if ((this.isListTable() && !this.transpose) ||
+            if (this.isSeriesNumberInBody(col, row)) {
+                cacheKey = `${col}-series-` + cellType;
+            }
+            else if ((this.isListTable() && !this.transpose) ||
                 (this.isPivotTable() && this.internalProps.layoutMap.indicatorsAsCol)) {
                 cacheKey = col + cellType;
             }
@@ -57017,9 +57321,6 @@
                 dataValue: this.getCellOriginValue(col, row),
                 cellHeaderPaths: this.getCellHeaderPaths(col, row)
             }, styleClass, this.options.autoWrapText, this.theme);
-            if (bgColorFunc) {
-                cacheStyle = mergeStyle(cacheStyle, { bgColor: bgColorFunc });
-            }
             if (!isFunction$3(style)) {
                 if (layoutMap.isBottomFrozenRow(row)) {
                     this.bodyBottomStyleCache.set(cacheKey, cacheStyle);
@@ -57121,6 +57422,23 @@
             if (this.isHeader(col, row)) {
                 icons = this.internalProps.headerHelper.getIcons(col, row);
             }
+            else if (this.internalProps.layoutMap.isSeriesNumber(col, row)) {
+                const dragOrder = this.internalProps.layoutMap.getSeriesNumberBody(col, row)?.define
+                    ?.dragOrder;
+                if (dragOrder) {
+                    icons = this.internalProps.rowSeriesNumberHelper.getIcons(col, row);
+                }
+                const cellValue = this.getCellValue(col, row);
+                const dataValue = this.getCellOriginValue(col, row);
+                const ctx = this.internalProps.context;
+                const cellIcon = this.internalProps.bodyHelper.getIcons(col, row, cellValue, dataValue, ctx);
+                if (icons?.length > 0) {
+                    icons = icons.concat();
+                }
+                else if (cellIcon?.length > 0) {
+                    icons = cellIcon;
+                }
+            }
             else {
                 const cellValue = this.getCellValue(col, row);
                 const dataValue = this.getCellOriginValue(col, row);
@@ -57307,7 +57625,7 @@
                                     const copyCellValue = getCopyCellValue(c, r, range);
                                     if (typeof Promise !== 'undefined' && copyCellValue instanceof Promise) ;
                                     else {
-                                        const strCellValue = isValid$3(copyCellValue) ? `${copyCellValue}` : '';
+                                        const strCellValue = `${copyCellValue}`;
                                         if (/^\[object .*\]$/.exec(strCellValue)) ;
                                         else {
                                             copyValue += strCellValue;
@@ -57481,20 +57799,11 @@
                 this.scrollToCell({ col, row });
             }
             const cellRect = this.getCellRelativeRect(col, row);
-            if (this.stateManager.select?.ranges?.length > 0) {
-                hideCellSelectBorder(this.scenegraph);
-            }
-            const { col: hoverCol, row: hoverRow } = this.stateManager.hover.cellPos;
-            this.stateManager.updateHoverPos(-1, -1);
             const c = this.scenegraph.stage.toCanvas(false, new AABBBounds$1().set(cellRect.left + this.tableX + 1, cellRect.top + this.tableY + 1, cellRect.right + this.tableX, cellRect.bottom + this.tableY));
             if (!isInView) {
                 this.setScrollTop(scrollTop);
                 this.setScrollLeft(scrollLeft);
             }
-            if (this.stateManager.select?.ranges?.length > 0) {
-                restoreCellSelectBorder(this.scenegraph);
-            }
-            this.stateManager.updateHoverPos(hoverCol, hoverRow);
             return c.toDataURL();
         }
         exportCellRangeImg(cellRange) {
@@ -57592,12 +57901,23 @@
                 }
             }
         }
+        changeRecordOrder(source, target) {
+        }
         registerCustomCellStyle(customStyleId, customStyle) {
             this.customCellStylePlugin.registerCustomCellStyle(customStyleId, customStyle);
         }
         arrangeCustomCellStyle(cellPos, customStyleId) {
             this.customCellStylePlugin.arrangeCustomCellStyle(cellPos, customStyleId);
         }
+        isSeriesNumber(col, row) {
+            return this.internalProps.layoutMap.isSeriesNumber(col, row);
+        }
+        isHasSeriesNumber() {
+            return this.internalProps.layoutMap?.leftRowSeriesNumberColumnCount > 0;
+        }
+        get leftRowSeriesNumberCount() {
+            return this.internalProps.layoutMap?.leftRowSeriesNumberColumnCount ?? 0;
+        }
     }
 
     var core = /*#__PURE__*/Object.freeze({
@@ -58090,6 +58410,16 @@
         }
         return count;
     }
+    function checkHasTreeDefine(layoutMap) {
+        const columnObjects = layoutMap.columnObjects;
+        for (let i = 0; i < columnObjects.length; i++) {
+            const column = columnObjects[i];
+            if (column?.define?.tree) {
+                return true;
+            }
+        }
+        return false;
+    }
 
     class DimensionTree {
         sharedVar;
@@ -58509,6 +58839,11 @@
         _headerObjectMap;
         _headerCellIds;
         _columns;
+        rowSeriesNumberColumn;
+        leftRowSeriesNumberColumn;
+        rightRowSeriesNumberColumn;
+        leftRowSeriesNumberColumnCount = 0;
+        rightRowSeriesNumberColumnCount = 0;
         columnTree;
         bodyRowSpanCount = 1;
         hierarchyIndent;
@@ -58519,6 +58854,7 @@
         _hasAggregation = false;
         _hasAggregationOnTopCount = 0;
         _hasAggregationOnBottomCount = 0;
+        rowHierarchyType;
         _cellRangeMap;
         constructor(table, columns, showHeader, hierarchyIndent) {
             this._cellRangeMap = new Map();
@@ -58533,9 +58869,57 @@
                 o[e.id] = e;
                 return o;
             }, {});
+            this.rowHierarchyType = checkHasTreeDefine(this) ? 'tree' : 'grid';
             this._hasAggregation = checkHasAggregation(this);
             this._hasAggregationOnBottomCount = checkHasAggregationOnBottom(this);
             this._hasAggregationOnTopCount = checkHasAggregationOnTop(this);
+            this.handleRowSeriesNumber(table.internalProps.rowSeriesNumber);
+        }
+        handleRowSeriesNumber(rowSeriesNumber) {
+            if (rowSeriesNumber) {
+                if (Array.isArray(rowSeriesNumber)) {
+                    this.rowSeriesNumberColumn = rowSeriesNumber.map(seriesNumber => {
+                        return {
+                            id: this.seqId++,
+                            title: seriesNumber.title,
+                            define: seriesNumber,
+                            cellType: seriesNumber.cellType ?? 'text',
+                            style: seriesNumber.style,
+                            width: seriesNumber.width,
+                            format: seriesNumber.format,
+                            field: seriesNumber.field,
+                            icon: seriesNumber.icon,
+                            headerIcon: seriesNumber.headerIcon,
+                            isChildNode: false
+                        };
+                    });
+                }
+                else {
+                    this.rowSeriesNumberColumn = [
+                        {
+                            id: this.seqId++,
+                            title: rowSeriesNumber.title,
+                            define: rowSeriesNumber,
+                            cellType: rowSeriesNumber.cellType ?? 'text',
+                            style: rowSeriesNumber.style,
+                            width: rowSeriesNumber.width,
+                            format: rowSeriesNumber.format,
+                            field: '',
+                            icon: rowSeriesNumber.icon,
+                            headerIcon: rowSeriesNumber.headerIcon,
+                            isChildNode: false
+                        }
+                    ];
+                }
+                this.leftRowSeriesNumberColumn = this.rowSeriesNumberColumn.filter(rowSeriesNumberItem => {
+                    return true;
+                });
+                this.rightRowSeriesNumberColumn = this.rowSeriesNumberColumn.filter(rowSeriesNumberItem => {
+                    return false;
+                });
+                this.leftRowSeriesNumberColumnCount = this.leftRowSeriesNumberColumn.length;
+                this.rightRowSeriesNumberColumnCount = this.rightRowSeriesNumberColumn.length;
+            }
         }
         get transpose() {
             return this._transpose;
@@ -58549,8 +58933,103 @@
         set showHeader(_showHeader) {
             this._showHeader = _showHeader;
         }
+        isSeriesNumberInHeader(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && row >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                if (this.transpose) {
+                    return false;
+                }
+                else if (row < this.headerLevelCount) {
+                    return true;
+                }
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 &&
+                row >= 0 &&
+                col >= this.colCount - this.rightRowSeriesNumberColumnCount) {
+                if (this.transpose) {
+                    return false;
+                }
+                else if (row < this.headerLevelCount) {
+                    return true;
+                }
+            }
+            return false;
+        }
+        isSeriesNumberInBody(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                if (this.transpose) {
+                    return true;
+                }
+                if (row >= this.headerLevelCount) {
+                    return true;
+                }
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 && col >= this.colCount - this.rightRowSeriesNumberColumnCount) {
+                if (this.transpose) {
+                    return true;
+                }
+                if (row >= this.headerLevelCount) {
+                    return true;
+                }
+            }
+            return false;
+        }
+        isSeriesNumber(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && row >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                return true;
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 &&
+                row >= 0 &&
+                col >= this.colCount - this.rightRowSeriesNumberColumnCount) {
+                return true;
+            }
+            return false;
+        }
+        getSeriesNumberHeader(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                if (this.transpose) {
+                    return undefined;
+                }
+                if (row < this.headerLevelCount) {
+                    return Object.assign({}, this.leftRowSeriesNumberColumn[col], {
+                        style: this._table.internalProps.rowSeriesNumber.headerStyle
+                    });
+                }
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 &&
+                col >= this.colCount - this.rightRowSeriesNumberColumnCount &&
+                row < this.headerLevelCount) {
+                if (this.transpose) {
+                    return undefined;
+                }
+                if (row < this.headerLevelCount) {
+                    return this.rightRowSeriesNumberColumn[col - (this.colCount - this.rightRowSeriesNumberColumnCount)];
+                }
+            }
+            return undefined;
+        }
+        getSeriesNumberBody(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                if (this.transpose) {
+                    return this.leftRowSeriesNumberColumn[col];
+                }
+                if (row >= this.headerLevelCount) {
+                    return this.leftRowSeriesNumberColumn[col];
+                }
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 && col >= this.colCount - this.rightRowSeriesNumberColumnCount) {
+                if (this.transpose) {
+                    return this.rightRowSeriesNumberColumn[col - (this.colCount - this.rightRowSeriesNumberColumnCount)];
+                }
+                if (row >= this.headerLevelCount) {
+                    return this.rightRowSeriesNumberColumn[col - (this.colCount - this.rightRowSeriesNumberColumnCount)];
+                }
+            }
+            return undefined;
+        }
         isHeader(col, row) {
-            if (this.transpose && col >= 0 && col < this.headerLevelCount) {
+            if (this.transpose &&
+                col >= this.leftRowSeriesNumberColumnCount &&
+                col < this.headerLevelCount + this.leftRowSeriesNumberColumnCount) {
                 return true;
             }
             if (!this.transpose && row >= 0 && row < this.headerLevelCount) {
@@ -58715,13 +59194,19 @@
             return 'body';
         }
         isRowHeader(col, row) {
-            if (this.transpose && col >= 0 && col <= this.headerLevelCount - 1) {
+            if (this.transpose &&
+                col >= this.leftRowSeriesNumberColumnCount &&
+                col < this.headerLevelCount + this.leftRowSeriesNumberColumnCount) {
                 return true;
             }
             return false;
         }
         isColumnHeader(col, row) {
-            if (!this.transpose && row >= 0 && row <= this.headerLevelCount - 1) {
+            if (!this.transpose &&
+                row >= 0 &&
+                row <= this.headerLevelCount - 1 &&
+                col >= this.leftRowSeriesNumberColumnCount &&
+                col < this.colCount - this.rightRowSeriesNumberColumnCount) {
                 return true;
             }
             return false;
@@ -58896,7 +59381,12 @@
             return 0;
         }
         get colCount() {
-            return this.transpose ? this.headerLevelCount + this.recordsCount : this._columns.length;
+            return this.transpose
+                ? this.headerLevelCount +
+                    this.recordsCount +
+                    this.leftRowSeriesNumberColumnCount +
+                    this.rightRowSeriesNumberColumnCount
+                : this._columns.length + this.leftRowSeriesNumberColumnCount + this.rightRowSeriesNumberColumnCount;
         }
         get rowCount() {
             return this.transpose ? this._columns.length : this.headerLevelCount + this.recordsCount;
@@ -58923,61 +59413,79 @@
             return this._columns;
         }
         getColumnWidthDefined(col) {
-            if (this.transpose) {
-                let width = 0;
-                let maxWidth;
-                let minWidth;
-                if (col >= this.rowHeaderLevelCount) {
-                    let isAuto;
-                    this.columnObjects.forEach((obj, index) => {
-                        if (typeof obj.width === 'number') {
-                            width = Math.max(obj.width, width);
-                        }
-                        else if (obj.width === 'auto') {
-                            isAuto = true;
-                        }
-                        if (typeof obj.minWidth === 'number') {
-                            minWidth = Math.max(obj.minWidth, minWidth);
-                        }
-                        if (typeof obj.maxWidth === 'number') {
-                            maxWidth = Math.max(obj.maxWidth, maxWidth);
-                        }
-                    });
-                    width = width > 0 ? width : isAuto ? 'auto' : undefined;
-                    return { width, minWidth, maxWidth };
+            if (col >= 0) {
+                if (col < this.leftRowSeriesNumberColumnCount) {
+                    return this.leftRowSeriesNumberColumn[col];
                 }
-                if (this.isRowHeader(col, 0)) {
-                    const defaultWidth = Array.isArray(this._table.defaultHeaderColWidth)
-                        ? this._table.defaultHeaderColWidth[col] ?? this._table.defaultColWidth
-                        : this._table.defaultHeaderColWidth;
-                    if (defaultWidth === 'auto') {
-                        return { width: 'auto' };
+                if (this.transpose) {
+                    let width = 0;
+                    let maxWidth;
+                    let minWidth;
+                    if (col >= this.rowHeaderLevelCount + this.leftRowSeriesNumberColumnCount) {
+                        let isAuto;
+                        this.columnObjects.forEach((obj, index) => {
+                            if (typeof obj.width === 'number') {
+                                width = Math.max(obj.width, width);
+                            }
+                            else if (obj.width === 'auto') {
+                                isAuto = true;
+                            }
+                            if (typeof obj.minWidth === 'number') {
+                                minWidth = Math.max(obj.minWidth, minWidth);
+                            }
+                            if (typeof obj.maxWidth === 'number') {
+                                maxWidth = Math.max(obj.maxWidth, maxWidth);
+                            }
+                        });
+                        width = width > 0 ? width : isAuto ? 'auto' : undefined;
+                        return { width, minWidth, maxWidth };
+                    }
+                    if (this.isRowHeader(col, 0)) {
+                        const defaultWidth = Array.isArray(this._table.defaultHeaderColWidth)
+                            ? this._table.defaultHeaderColWidth[col] ?? this._table.defaultColWidth
+                            : this._table.defaultHeaderColWidth;
+                        if (defaultWidth === 'auto') {
+                            return { width: 'auto' };
+                        }
+                        return { width: defaultWidth };
                     }
-                    return { width: defaultWidth };
                 }
+                return this._columns[col - this.leftRowSeriesNumberColumnCount];
             }
-            return this._columns[col];
+            return undefined;
         }
         getCellId(col, row) {
             if (this.transpose) {
-                if (this.headerLevelCount <= col) {
+                if (col >= this.headerLevelCount + this.leftRowSeriesNumberColumnCount) {
                     return this._columns[row]?.id;
                 }
-                return this._headerCellIds[col]?.[row];
+                if (this.isSeriesNumber(col, row)) {
+                    return row + '_series_number';
+                }
+                return this._headerCellIds[col - this.leftRowSeriesNumberColumnCount]?.[row];
+            }
+            if (this.isSeriesNumber(col, row)) {
+                return this.rowSeriesNumberColumn[col].id;
             }
             if (this.headerLevelCount <= row) {
-                return this._columns[col]?.id;
+                return this._columns[col - this.leftRowSeriesNumberColumnCount]?.id;
             }
-            return this._headerCellIds[row]?.[col];
+            return this._headerCellIds[row]?.[col - this.leftRowSeriesNumberColumnCount];
         }
         getHeader(col, row) {
+            if (this.isSeriesNumberInHeader(col, row)) {
+                return this.getSeriesNumberHeader(col, row);
+            }
             const id = this.getCellId(col, row);
             return this._headerObjectMap[id];
         }
         getHeaderField(col, row) {
             const id = this.getCellId(col, row);
             return (this._headerObjectMap[id]?.field ||
-                (this.transpose ? this._columns[row] && this._columns[row].field : this._columns[col] && this._columns[col].field));
+                (this.transpose
+                    ? this._columns[row] && this._columns[row].field
+                    : this._columns[col - this.leftRowSeriesNumberColumnCount] &&
+                        this._columns[col - this.leftRowSeriesNumberColumnCount].field));
         }
         getHeaderCellAdressById(id) {
             for (let i = 0; i < this._headerCellIds.length; i++) {
@@ -58987,7 +59495,7 @@
                         if (this.transpose) {
                             return { col: i, row: j };
                         }
-                        return { col: j, row: i };
+                        return { col: j + this.leftRowSeriesNumberColumnCount, row: i };
                     }
                 }
             }
@@ -58998,7 +59506,10 @@
             return this.getHeaderCellAdressById(hd.id);
         }
         getBody(col, _row) {
-            return this.transpose ? this._columns[_row] : this._columns[col];
+            if (this.isSeriesNumber(col, _row)) {
+                return this.getSeriesNumberBody(col, _row);
+            }
+            return this.transpose ? this._columns[_row] : this._columns[col - this.leftRowSeriesNumberColumnCount];
         }
         getBodyLayoutRangeById(id) {
             if (this.transpose) {
@@ -59013,7 +59524,7 @@
             }
             else {
                 for (let col = 0; col < (this.colCount ?? 0); col++) {
-                    if (id === this._columns[col].id) {
+                    if (id === this._columns[col - this.leftRowSeriesNumberColumnCount].id) {
                         return {
                             start: { col, row: 0 },
                             end: { col, row: 0 }
@@ -59039,17 +59550,18 @@
             }
             else {
                 if (this.headerLevelCount <= row) {
-                    if (this.headerLevelCount <= row && this.columnObjects[col]?.define?.mergeCell) {
+                    if (this.headerLevelCount <= row &&
+                        this.columnObjects[col - this.leftRowSeriesNumberColumnCount]?.define?.mergeCell) {
                         const value = this._table.getCellValue(col, row);
                         for (let r = row - 1; r >= this.headerLevelCount; r--) {
                             const last_Value = this._table.getCellValue(col, r);
-                            if (typeof this.columnObjects[col].define.mergeCell === 'boolean') {
+                            if (typeof this.columnObjects[col - this.leftRowSeriesNumberColumnCount].define.mergeCell === 'boolean') {
                                 if (value !== last_Value) {
                                     break;
                                 }
                             }
                             else {
-                                if (!this.columnObjects[col].define.mergeCell(value, last_Value)) {
+                                if (!this.columnObjects[col - this.leftRowSeriesNumberColumnCount].define.mergeCell(value, last_Value)) {
                                     break;
                                 }
                             }
@@ -59057,13 +59569,13 @@
                         }
                         for (let r = row + 1; r < this.rowCount; r++) {
                             const next_Value = this._table.getCellValue(col, r);
-                            if (typeof this.columnObjects[col].define.mergeCell === 'boolean') {
+                            if (typeof this.columnObjects[col - this.leftRowSeriesNumberColumnCount].define.mergeCell === 'boolean') {
                                 if (value !== next_Value) {
                                     break;
                                 }
                             }
                             else {
-                                if (!this.columnObjects[col].define.mergeCell(value, next_Value)) {
+                                if (!this.columnObjects[col - this.leftRowSeriesNumberColumnCount].define.mergeCell(value, next_Value)) {
                                     break;
                                 }
                             }
@@ -59104,10 +59616,11 @@
         }
         getCellRangeTranspose(col, row) {
             const result = { start: { col, row }, end: { col, row } };
-            if (this.headerLevelCount <= col || (col === -1 && row === -1)) {
-                if (this.headerLevelCount <= col && this.columnObjects[row]?.define?.mergeCell) {
+            if (this.headerLevelCount + this.leftRowSeriesNumberColumnCount <= col || (col === -1 && row === -1)) {
+                if (this.headerLevelCount + this.leftRowSeriesNumberColumnCount <= col &&
+                    this.columnObjects[row]?.define?.mergeCell) {
                     const value = this._table.getCellValue(col, row);
-                    for (let c = col - 1; c >= this.headerLevelCount; c--) {
+                    for (let c = col - 1; c >= this.headerLevelCount + this.leftRowSeriesNumberColumnCount; c--) {
                         const last_Value = this._table.getCellValue(c, row);
                         if (typeof this.columnObjects[row].define.mergeCell === 'boolean') {
                             if (value !== last_Value) {
@@ -59157,7 +59670,7 @@
                 }
                 result.start.col = c;
             }
-            for (let c = col + 1; c < this.headerLevelCount; c++) {
+            for (let c = col + 1; c < this.headerLevelCount + this.leftRowSeriesNumberColumnCount; c++) {
                 if (id !== this.getCellId(c, row)) {
                     break;
                 }
@@ -59238,7 +59751,8 @@
                         define: colDef,
                         columnWidthComputeMode: colDef.columnWidthComputeMode,
                         disableColumnResize: colDef?.disableColumnResize,
-                        aggregation: this._getAggregationForColumn(colDef, col)
+                        aggregation: this._getAggregationForColumn(colDef, col),
+                        isChildNode: row >= 1
                     });
                     for (let r = row + 1; r < this._headerCellIds.length; r++) {
                         this._headerCellIds[r][col] = id;
@@ -59300,12 +59814,15 @@
             return newRow;
         }
         getCellHeaderPaths(col, row) {
+            if (this.isSeriesNumber(col, row)) {
+                return undefined;
+            }
             let colPath = [];
             let rowPath = [];
             if (!this.transpose) {
                 colPath = [
                     {
-                        field: this._columns[col].field
+                        field: this._columns[col - this.leftRowSeriesNumberColumnCount].field
                     }
                 ];
             }
@@ -59330,11 +59847,35 @@
                 return this.getCellId(col, row - 1);
             }
             else if (this.isRowHeader(col, row)) {
+                if (this.isSeriesNumberInBody(col - 1, row)) {
+                    return undefined;
+                }
                 return this.getCellId(col - 1, row);
             }
             return undefined;
         }
         canMoveHeaderPosition(source, target) {
+            if (this.isSeriesNumberInHeader(target.col, target.row) || this.isSeriesNumberInHeader(source.col, source.row)) {
+                return false;
+            }
+            else if (!this.transpose &&
+                this.isSeriesNumberInBody(target.col, target.row) &&
+                this.isSeriesNumberInBody(source.col, source.row)) {
+                return true;
+            }
+            else if (this.transpose &&
+                this.isSeriesNumberInBody(target.col, target.row) &&
+                this.isSeriesNumberInBody(source.col, source.row)) {
+                if (this._getColumnDefine(source.col + this.leftRowSeriesNumberColumnCount, source.row).isChildNode &&
+                    this._getColumnDefine(target.col + this.leftRowSeriesNumberColumnCount, target.row).isChildNode) {
+                    source.col = source.col + this.leftRowSeriesNumberColumnCount + this.rowHeaderLevelCount - 1;
+                    target.col = target.col + this.leftRowSeriesNumberColumnCount + this.rowHeaderLevelCount - 1;
+                }
+                else {
+                    source.col = source.col + this.leftRowSeriesNumberColumnCount;
+                    target.col = target.col + this.leftRowSeriesNumberColumnCount;
+                }
+            }
             if (source.col < 0 || source.row < 0 || target.col < 0 || target.row < 0) {
                 return false;
             }
@@ -59358,7 +59899,7 @@
         }
         moveHeaderPosition(source, target) {
             if (this.canMoveHeaderPosition(source, target)) {
-                const sourceCellRange = this.getCellRange(source.col, source.row);
+                let sourceCellRange = this.getCellRange(source.col, source.row);
                 if (this.isColumnHeader(source.col, source.row)) {
                     const sourceSize = sourceCellRange.end.col - sourceCellRange.start.col + 1;
                     let targetIndex;
@@ -59373,14 +59914,14 @@
                         return null;
                     }
                     for (let row = 0; row < this._headerCellIds.length; row++) {
-                        const sourceIds = this._headerCellIds[row].splice(sourceCellRange.start.col, sourceSize);
-                        sourceIds.unshift(targetIndex, 0);
+                        const sourceIds = this._headerCellIds[row].splice(sourceCellRange.start.col - this.leftRowSeriesNumberColumnCount, sourceSize);
+                        sourceIds.unshift(targetIndex - this.leftRowSeriesNumberColumnCount, 0);
                         Array.prototype.splice.apply(this._headerCellIds[row], sourceIds);
                     }
-                    const sourceColumns = this._columns.splice(sourceCellRange.start.col, sourceSize);
-                    sourceColumns.unshift(targetIndex, 0);
+                    const sourceColumns = this._columns.splice(sourceCellRange.start.col - this.leftRowSeriesNumberColumnCount, sourceSize);
+                    sourceColumns.unshift((targetIndex - this.leftRowSeriesNumberColumnCount), 0);
                     Array.prototype.splice.apply(this._columns, sourceColumns);
-                    this.columnTree.movePosition(sourceCellRange.start.row, sourceCellRange.start.col, targetIndex);
+                    this.columnTree.movePosition(sourceCellRange.start.row, sourceCellRange.start.col - this.leftRowSeriesNumberColumnCount, targetIndex - this.leftRowSeriesNumberColumnCount);
                     this.columnTree.reset(this.columnTree.tree.children, true);
                     this._cellRangeMap = new Map();
                     return {
@@ -59391,7 +59932,11 @@
                         moveType: 'column'
                     };
                 }
-                else if (this.isRowHeader(source.col, source.row)) {
+                else if (this.isRowHeader(source.col, source.row) ||
+                    (this.isSeriesNumberInBody(source.col, source.row) && this.transpose)) {
+                    if (this.isSeriesNumberInBody(source.col, source.row)) {
+                        sourceCellRange = this.getCellRange(source.col + this.leftRowSeriesNumberColumnCount, source.row);
+                    }
                     const sourceSize = sourceCellRange.end.row - sourceCellRange.start.row + 1;
                     let targetIndex;
                     const targetCellRange = this.getCellRange(sourceCellRange.start.col, target.row);
@@ -59412,7 +59957,7 @@
                     const sourceColumns = this._columns.splice(sourceCellRange.start.row, sourceSize);
                     sourceColumns.unshift(targetIndex, 0);
                     Array.prototype.splice.apply(this._columns, sourceColumns);
-                    this.columnTree.movePosition(sourceCellRange.start.col, sourceCellRange.start.row, targetIndex);
+                    this.columnTree.movePosition(sourceCellRange.start.col - this.leftRowSeriesNumberColumnCount, sourceCellRange.start.row, targetIndex + (target.row > source.row ? sourceCellRange.end.row - sourceCellRange.start.row : 0));
                     this.columnTree.reset(this.columnTree.tree.children, true);
                     this._cellRangeMap = new Map();
                     return {
@@ -59423,6 +59968,15 @@
                         moveType: 'row'
                     };
                 }
+                else if (this.isSeriesNumberInBody(source.col, source.row)) {
+                    return {
+                        sourceIndex: source.row,
+                        targetIndex: target.row,
+                        sourceSize: 1,
+                        targetSize: 1,
+                        moveType: 'row'
+                    };
+                }
             }
             return null;
         }
@@ -59439,14 +59993,14 @@
             };
         }
         setChartInstance(_col, _row, chartInstance) {
-            const columnObj = this.transpose ? this._columns[_row] : this._columns[_col];
+            const columnObj = this.transpose ? this._columns[_row] : this._columns[_col - this.leftRowSeriesNumberColumnCount];
             if (typeof columnObj.chartSpec === 'function') {
                 return;
             }
             columnObj.chartInstance = chartInstance;
         }
         getChartInstance(_col, _row) {
-            const columnObj = this.transpose ? this._columns[_row] : this._columns[_col];
+            const columnObj = this.transpose ? this._columns[_row] : this._columns[_col - this.leftRowSeriesNumberColumnCount];
             return columnObj.chartInstance;
         }
         checkHasChart() {
@@ -59518,6 +60072,18 @@
             }, []);
             return result;
         }
+        _getColumnDefine(col, row) {
+            if (col >= 0) {
+                if (col < this.leftRowSeriesNumberColumnCount) {
+                    return this.leftRowSeriesNumberColumn[col];
+                }
+                if (this.transpose) {
+                    return this._columns[row];
+                }
+                return this._columns[col - this.leftRowSeriesNumberColumnCount];
+            }
+            return undefined;
+        }
     }
 
     class Title {
@@ -59893,7 +60459,15 @@
                 return customMergeText;
             }
             const table = this;
-            if (table.internalProps.layoutMap.isHeader(col, row)) {
+            if (table.internalProps.layoutMap.isSeriesNumber(col, row)) {
+                if (table.internalProps.layoutMap.isSeriesNumberInHeader(col, row)) {
+                    const { title } = table.internalProps.layoutMap.getSeriesNumberHeader(col, row);
+                    return title;
+                }
+                const { format } = table.internalProps.layoutMap.getSeriesNumberBody(col, row);
+                return typeof format === 'function' ? format(col, row, this) : row - this.columnHeaderLevelCount + 1;
+            }
+            else if (table.internalProps.layoutMap.isHeader(col, row)) {
                 const { title } = table.internalProps.layoutMap.getHeader(col, row);
                 return typeof title === 'function' ? title() : title;
             }
@@ -59915,7 +60489,15 @@
                 return null;
             }
             const table = this;
-            if (table.internalProps.layoutMap.isHeader(col, row)) {
+            if (table.internalProps.layoutMap.isSeriesNumber(col, row)) {
+                if (table.internalProps.layoutMap.isSeriesNumberInHeader(col, row)) {
+                    const { title } = table.internalProps.layoutMap.getSeriesNumberHeader(col, row);
+                    return title;
+                }
+                const { format } = table.internalProps.layoutMap.getSeriesNumberBody(col, row);
+                return typeof format === 'function' ? format(col, row, this) : row - this.columnHeaderLevelCount;
+            }
+            else if (table.internalProps.layoutMap.isHeader(col, row)) {
                 const { title } = table.internalProps.layoutMap.getHeader(col, row);
                 return typeof title === 'function' ? title() : title;
             }
@@ -60029,7 +60611,6 @@
             }
             else if (options.records) {
                 this.setRecords(options.records, {
-                    restoreHierarchyState: options.restoreHierarchyState,
                     sortState: options.sortState
                 });
             }
@@ -60096,9 +60677,9 @@
                     layoutMap.hasAggregationOnBottomCount;
             if (table.transpose) {
                 table.rowCount = layoutMap.rowCount ?? 0;
-                table.colCount = layoutMap.recordsCount * layoutMap.bodyRowSpanCount + layoutMap.headerLevelCount;
+                table.colCount = layoutMap.colCount ?? 0;
                 table.frozenRowCount = 0;
-                this.internalProps.frozenColCount = layoutMap.headerLevelCount ?? 0;
+                this.internalProps.frozenColCount = Math.max((layoutMap.headerLevelCount ?? 0) + layoutMap.leftRowSeriesNumberColumnCount, this.options.frozenColCount ?? 0);
                 if (table.bottomFrozenRowCount !== (this.options.bottomFrozenRowCount ?? 0)) {
                     table.bottomFrozenRowCount = this.options.bottomFrozenRowCount ?? 0;
                 }
@@ -60128,7 +60709,7 @@
             if (table.internalProps.layoutMap.isHeader(col, row)) {
                 return null;
             }
-            const index = table.getRecordShowIndexByCell(col, row);
+            const index = table.getRecordShowIndexByCell(table.transpose ? col - table.internalProps.layoutMap.leftRowSeriesNumberColumnCount : col, row);
             return table.internalProps.dataSource.getField(index, field, col, row, this);
         }
         getRawFieldData(field, col, row) {
@@ -60143,10 +60724,12 @@
             return table.internalProps.dataSource.getRawField(index, field, col, row, this);
         }
         _moveHeaderPosition(source, target) {
+            const sourceCellRange = this.getCellRange(source.col, source.row);
+            const targetCellRange = this.getCellRange(target.col, target.row);
             const moveContext = this.internalProps.layoutMap.moveHeaderPosition(source, target);
             if (moveContext) {
                 if (moveContext.moveType === 'column') {
-                    this.colWidthsMap.adjustOrder(moveContext.sourceIndex, moveContext.targetIndex, moveContext.sourceSize);
+                    this.colWidthsMap.exchangeOrder(sourceCellRange.start.col, sourceCellRange.end.col - sourceCellRange.start.col + 1, targetCellRange.start.col, targetCellRange.end.col - targetCellRange.start.col + 1, moveContext.targetIndex);
                     if (!this.transpose) {
                         this.colWidthsLimit = {};
                         for (let col = 0; col < this.internalProps.layoutMap.columnWidths.length; col++) {
@@ -60159,23 +60742,30 @@
                             }
                         }
                     }
-                    const colStart = Math.min(moveContext.sourceIndex, moveContext.targetIndex);
-                    const colEnd = Math.max(moveContext.sourceIndex, moveContext.targetIndex);
-                    for (let col = colStart; col <= colEnd; col++) {
-                        this._clearColRangeWidthsMap(col);
-                    }
                 }
                 else {
-                    const rowStart = Math.min(moveContext.sourceIndex, moveContext.targetIndex);
-                    const rowEnd = Math.max(moveContext.sourceIndex, moveContext.targetIndex);
-                    for (let row = rowStart; row <= rowEnd; row++) {
-                        this._clearRowRangeHeightsMap(row);
+                    if (moveContext.targetIndex > moveContext.sourceIndex) {
+                        this.rowHeightsMap.exchangeOrder(moveContext.sourceIndex, moveContext.sourceSize, moveContext.targetIndex + moveContext.sourceSize - moveContext.targetSize, moveContext.targetSize, moveContext.targetIndex);
+                    }
+                    else {
+                        this.rowHeightsMap.exchangeOrder(moveContext.sourceIndex, moveContext.sourceSize, moveContext.targetIndex, moveContext.targetSize, moveContext.targetIndex);
                     }
                 }
                 return moveContext;
             }
             return null;
         }
+        changeRecordOrder(sourceIndex, targetIndex) {
+            if (this.transpose) {
+                sourceIndex = this.getRecordShowIndexByCell(sourceIndex, 0);
+                targetIndex = this.getRecordShowIndexByCell(targetIndex, 0);
+            }
+            else {
+                sourceIndex = this.getRecordShowIndexByCell(0, sourceIndex);
+                targetIndex = this.getRecordShowIndexByCell(0, targetIndex);
+            }
+            this.dataSource.reorderRecord(sourceIndex, targetIndex);
+        }
         getCellAddress(findTargetRecord, field) {
             let targetRecordIndex;
             for (let i = 0; i < this.internalProps.records.length; i++) {
@@ -60426,10 +61016,6 @@
                 this.internalProps.sortState = sort;
                 this.stateManager.setSortState(this.sortState);
             }
-            const currentPagerIndexedData = this.dataSource?._currentPagerIndexedData;
-            const currentIndexedData = this.dataSource?.currentIndexedData;
-            const treeDataHierarchyState = this.dataSource?.treeDataHierarchyState;
-            const oldRecordLength = this.records?.length ?? 0;
             if (records) {
                 _setRecords(this, records);
                 if (this.sortState) {
@@ -60451,20 +61037,10 @@
                         }
                     }
                 }
-                if (option?.restoreHierarchyState && oldRecordLength === this.records?.length) {
-                    this.dataSource._currentPagerIndexedData = currentPagerIndexedData;
-                    this.dataSource.currentIndexedData = currentIndexedData;
-                    this.dataSource.treeDataHierarchyState = treeDataHierarchyState;
-                }
                 this.refreshRowColCount();
             }
             else {
                 _setRecords(this, records);
-                if (option?.restoreHierarchyState && oldRecordLength === this.records?.length) {
-                    this.dataSource._currentPagerIndexedData = currentPagerIndexedData;
-                    this.dataSource.currentIndexedData = currentIndexedData;
-                    this.dataSource.treeDataHierarchyState = treeDataHierarchyState;
-                }
             }
             this.stateManager.initCheckedState(records);
             this.clearCellStyleCache();
@@ -61083,6 +61659,11 @@
         _lastCellCol;
         _lastCellRow;
         _lastCellHeaderPath;
+        rowSeriesNumberColumn;
+        leftRowSeriesNumberColumn;
+        leftRowSeriesNumberColumnCount = 0;
+        rightRowSeriesNumberColumn;
+        rightRowSeriesNumberColumnCount = 0;
         constructor(table, dataset) {
             this.sharedVar = { seqId: 0 };
             this._table = table;
@@ -61258,8 +61839,52 @@
                     return false;
                 });
             }
+            this.handleRowSeriesNumber(table.internalProps.rowSeriesNumber);
             this.setColumnWidths();
         }
+        handleRowSeriesNumber(rowSeriesNumber) {
+            if (rowSeriesNumber) {
+                if (Array.isArray(rowSeriesNumber)) {
+                    this.rowSeriesNumberColumn = rowSeriesNumber.map(seriesNumber => {
+                        return {
+                            id: '',
+                            title: seriesNumber.title,
+                            define: seriesNumber,
+                            cellType: seriesNumber.cellType ?? 'text',
+                            width: seriesNumber.width,
+                            style: seriesNumber.style,
+                            format: seriesNumber.format,
+                            field: seriesNumber.field,
+                            icon: seriesNumber.icon
+                        };
+                    });
+                }
+                else {
+                    this.rowSeriesNumberColumn = [
+                        {
+                            id: '',
+                            title: rowSeriesNumber.title,
+                            define: rowSeriesNumber,
+                            cellType: rowSeriesNumber.cellType ?? 'text',
+                            style: rowSeriesNumber.style,
+                            width: rowSeriesNumber.width,
+                            format: rowSeriesNumber.format,
+                            field: '',
+                            icon: rowSeriesNumber.icon,
+                            isChildNode: false
+                        }
+                    ];
+                }
+                this.leftRowSeriesNumberColumn = this.rowSeriesNumberColumn.filter(rowSeriesNumberItem => {
+                    return true;
+                });
+                this.rightRowSeriesNumberColumn = this.rowSeriesNumberColumn.filter(rowSeriesNumberItem => {
+                    return false;
+                });
+                this.leftRowSeriesNumberColumnCount = this.leftRowSeriesNumberColumn.length;
+                this.rightRowSeriesNumberColumnCount = this.rightRowSeriesNumberColumn.length;
+            }
+        }
         _generateColHeaderIds() {
             if (this.columnDimensionTree.tree.children?.length >= 1) {
                 this.columnHeaderObjs = this._addHeaders(this._columnHeaderCellIds, 0, this.columnDimensionTree.tree.children, []);
@@ -61280,12 +61905,12 @@
                             return title + (title ? `/${value.title}` : `${value.title}`);
                         }, ''),
                     field: undefined,
-                    headerType: this.columnHeaderTitle.headerType ?? 'text',
-                    style: this.columnHeaderTitle.headerStyle,
+                    headerType: this.columnHeaderTitle?.headerType ?? 'text',
+                    style: this.columnHeaderTitle?.headerStyle,
                     define: {
                         id,
-                        disableHeaderHover: !!this.columnHeaderTitle.disableHeaderHover,
-                        disableHeaderSelect: !!this.columnHeaderTitle.disableHeaderSelect
+                        disableHeaderHover: !!this.columnHeaderTitle?.disableHeaderHover,
+                        disableHeaderSelect: !!this.columnHeaderTitle?.disableHeaderSelect
                     }
                 };
                 this.columnHeaderObjs.push(cell);
@@ -61315,12 +61940,12 @@
                             return title + (title ? `/${value.title}` : `${value.title}`);
                         }, ''),
                     field: undefined,
-                    headerType: this.rowHeaderTitle.headerType ?? 'text',
-                    style: this.rowHeaderTitle.headerStyle,
+                    headerType: this.rowHeaderTitle?.headerType ?? 'text',
+                    style: this.rowHeaderTitle?.headerStyle,
                     define: {
                         id,
-                        disableHeaderHover: !!this.columnHeaderTitle.disableHeaderHover,
-                        disableHeaderSelect: !!this.columnHeaderTitle.disableHeaderSelect
+                        disableHeaderHover: !!this.rowHeaderTitle?.disableHeaderHover,
+                        disableHeaderSelect: !!this.rowHeaderTitle?.disableHeaderSelect
                     }
                 };
                 this.rowHeaderObjs.push(cell);
@@ -61491,16 +62116,19 @@
         }
         setColumnWidths() {
             const returnWidths = new Array(this.colCount).fill(undefined);
+            if (this.leftRowSeriesNumberColumnCount) {
+                returnWidths[0] = this.leftRowSeriesNumberColumn[0];
+            }
             if (this.showHeader && this.showRowHeader) {
                 if (this.rowHeaderTitle) {
-                    returnWidths[0] = {};
+                    returnWidths[0 + this.leftRowSeriesNumberColumnCount] = {};
                 }
                 if (this.rowHierarchyType === 'tree') {
                     const mainDimensionFirstRowKey = this.rowDimensionKeys[0];
                     if (mainDimensionFirstRowKey) {
                         const dimension = this.rowsDefine?.find(dimension => typeof dimension === 'string' ? false : dimension.dimensionKey === mainDimensionFirstRowKey);
                         dimension &&
-                            (returnWidths[0 + (this.rowHeaderTitle ? 1 : 0)] = {
+                            (returnWidths[0 + (this.rowHeaderTitle ? 1 : 0) + this.leftRowSeriesNumberColumnCount] = {
                                 width: dimension.width,
                                 minWidth: dimension.minWidth,
                                 maxWidth: dimension.maxWidth
@@ -61511,7 +62139,7 @@
                         if (curDimensionFirstRowKey) {
                             const dimension = this.extensionRows[index].rows?.find((dimension) => typeof dimension === 'string' ? false : dimension.dimensionKey === curDimensionFirstRowKey);
                             dimension &&
-                                (returnWidths[index + 1 + (this.rowHeaderTitle ? 1 : 0)] = {
+                                (returnWidths[index + 1 + (this.rowHeaderTitle ? 1 : 0) + this.leftRowSeriesNumberColumnCount] = {
                                     width: dimension.width,
                                     minWidth: dimension.minWidth,
                                     maxWidth: dimension.maxWidth
@@ -61523,7 +62151,7 @@
                     this.rowDimensionKeys.forEach((objKey, index) => {
                         const dimension = this.rowsDefine?.find(dimension => typeof dimension === 'string' ? false : dimension.dimensionKey === objKey);
                         dimension &&
-                            (returnWidths[index + (this.rowHeaderTitle ? 1 : 0)] = {
+                            (returnWidths[index + (this.rowHeaderTitle ? 1 : 0) + this.leftRowSeriesNumberColumnCount] = {
                                 width: dimension.width,
                                 minWidth: dimension.minWidth,
                                 maxWidth: dimension.maxWidth
@@ -61617,7 +62245,8 @@
             return 'body';
         }
         isHeader(col, row) {
-            if (col >= 0 && col < this.rowHeaderLevelCount) {
+            if (col >= this.leftRowSeriesNumberColumnCount &&
+                col < this.rowHeaderLevelCount + this.leftRowSeriesNumberColumnCount) {
                 return true;
             }
             if (row >= 0 && row < this.columnHeaderLevelCount) {
@@ -61632,7 +62261,10 @@
             return false;
         }
         isCornerHeader(col, row) {
-            if (col >= 0 && col < this.rowHeaderLevelCount && row >= 0 && row < this.columnHeaderLevelCount) {
+            if (col >= 0 &&
+                col < this.rowHeaderLevelCount + this.leftRowSeriesNumberColumnCount &&
+                row >= 0 &&
+                row < this.columnHeaderLevelCount) {
                 return true;
             }
             return false;
@@ -61644,13 +62276,20 @@
             return false;
         }
         isRowHeader(col, row) {
-            if (col >= 0 && col < this.rowHeaderLevelCount && row >= this.columnHeaderLevelCount) {
+            if (col >= this.leftRowSeriesNumberColumnCount &&
+                col < this.rowHeaderLevelCount + this.leftRowSeriesNumberColumnCount &&
+                row >= this.columnHeaderLevelCount) {
                 return true;
             }
             return false;
         }
         isFrozen(col, row) {
-            return (this.isFrozenColumn(col) || this.isRightFrozenColumn(col) || this.isBottomFrozenRow(row) || this.isFrozenRow(row));
+            return (this.isFrozenColumn(col) ||
+                this.isRightFrozenColumn(col) ||
+                this.isBottomFrozenRow(row) ||
+                this.isFrozenRow(row) ||
+                this.isSeriesNumberInBody(col, row) ||
+                this.isSeriesNumberInHeader(col, row));
         }
         isFrozenColumn(col, row) {
             if (isValid$3(row)) {
@@ -61852,7 +62491,10 @@
             this._rowHeaderLevelCount = count;
         }
         get colCount() {
-            return (this.columnDimensionTree.tree.size + this.rowHeaderLevelCount + this.rightHeaderColCount);
+            return (this.columnDimensionTree.tree.size +
+                this.rowHeaderLevelCount +
+                this.rightHeaderColCount +
+                this.leftRowSeriesNumberColumnCount);
         }
         get rowCount() {
             return (((Array.isArray(this._table.records) ? this._table.records.length > 0 : true) &&
@@ -61928,25 +62570,31 @@
         }
         getCellId(col, row) {
             if (row >= 0 && col >= 0) {
-                if (this.isCornerHeader(col, row)) {
-                    return this._cornerHeaderCellIds[row][col];
+                if (this.isSeriesNumber(col, row)) {
+                    return '';
+                }
+                else if (this.isCornerHeader(col, row)) {
+                    return this._cornerHeaderCellIds[row][col - this.leftRowSeriesNumberColumnCount];
                 }
                 else if (this.isColumnHeader(col, row)) {
-                    return this._columnHeaderCellIds[row][col - this.rowHeaderLevelCount];
+                    return this._columnHeaderCellIds[row][col - this.rowHeaderLevelCount - this.leftRowSeriesNumberColumnCount];
                 }
                 else if (this.isRowHeader(col, row)) {
-                    return this._rowHeaderCellIds[row - this.columnHeaderLevelCount]?.[col];
+                    return this._rowHeaderCellIds[row - this.columnHeaderLevelCount]?.[col - this.leftRowSeriesNumberColumnCount];
                 }
                 else if (this.isRightFrozenColumn(col, row)) {
                     return this._rowHeaderCellIds[row - this.columnHeaderLevelCount][this.rowHeaderLevelCount - 1];
                 }
                 else if (this.isBottomFrozenRow(col, row)) {
-                    return this._columnHeaderCellIds[this.columnHeaderLevelCount - 1]?.[col - this.rowHeaderLevelCount];
+                    return this._columnHeaderCellIds[this.columnHeaderLevelCount - 1]?.[col - this.rowHeaderLevelCount - this.leftRowSeriesNumberColumnCount];
                 }
             }
             return undefined;
         }
         getHeader(col, row) {
+            if (this.isSeriesNumberInHeader(col, row)) {
+                return this.getSeriesNumberHeader(col, row);
+            }
             const id = this.getCellId(col, row);
             return this._headerObjectMap[id] ?? { id: undefined, field: '', headerType: 'text', define: undefined };
         }
@@ -61986,6 +62634,9 @@
             return this.getHeaderCellAdressById(hd.id);
         }
         getBody(_col, _row) {
+            if (this.isSeriesNumber(_col, _row)) {
+                return this.getSeriesNumberBody(_col, _row);
+            }
             const paths = this.getCellHeaderPaths(_col, _row);
             if (this.indicatorsAsCol) {
                 const indicatorKey = paths.colHeaderPaths?.find(colPath => colPath.indicatorKey)?.indicatorKey;
@@ -62081,7 +62732,8 @@
                     result.start.row = r;
                 }
                 for (let r = row + 1; r < (this.rowCount ?? 0); r++) {
-                    if (id !== this.getCellId(col, r)) {
+                    if (id !== this.getCellId(col, r) ||
+                        (this.isSeriesNumberInHeader(col, row) && r >= this.columnHeaderLevelCount)) {
                         break;
                     }
                     result.end.row = r;
@@ -62122,13 +62774,13 @@
             return 0;
         }
         getBodyIndexByCol(col) {
-            if (col < this.rowHeaderLevelCount) {
+            if (col < this.rowHeaderLevelCount + this.leftRowSeriesNumberColumnCount) {
                 return -1;
             }
             else if (col >= this.colCount - this.rightHeaderColCount) {
                 return -1;
             }
-            return col - this.rowHeaderLevelCount;
+            return col - this.rowHeaderLevelCount - this.leftRowSeriesNumberColumnCount;
         }
         getRecordStartRowByRecordIndex(index) {
             return this.columnHeaderLevelCount + index;
@@ -62181,7 +62833,9 @@
                     }
                 }
                 else {
-                    rowPath = this.rowDimensionTree.getTreePath(recordRow, this.showHeader && this.showRowHeader ? col - (this.rowHeaderTitle ? 1 : 0) : this.rowDimensionTree.totalLevel);
+                    rowPath = this.rowDimensionTree.getTreePath(recordRow, this.showHeader && this.showRowHeader
+                        ? col - (this.rowHeaderTitle ? 1 : 0) - this.leftRowSeriesNumberColumnCount
+                        : this.rowDimensionTree.totalLevel);
                 }
             }
             const p = { colHeaderPaths: colPath, rowHeaderPaths: rowPath, cellLocation: this.getCellLocation(col, row) };
@@ -62300,14 +62954,14 @@
                             return title + (title ? `/${value.title}` : `${value.title}`);
                         }, ''),
                     field: undefined,
-                    headerType: this.rowHeaderTitle.headerType ?? 'text',
-                    style: this.rowHeaderTitle.headerStyle,
+                    headerType: this.rowHeaderTitle?.headerType ?? 'text',
+                    style: this.rowHeaderTitle?.headerStyle,
                     define: {
                         field: '',
                         headerType: 'text',
                         cellType: 'text',
-                        disableHeaderHover: !!this.columnHeaderTitle.disableHeaderHover,
-                        disableHeaderSelect: !!this.columnHeaderTitle.disableHeaderSelect
+                        disableHeaderHover: !!this.rowHeaderTitle?.disableHeaderHover,
+                        disableHeaderSelect: !!this.rowHeaderTitle?.disableHeaderSelect
                     }
                 };
                 this.rowHeaderObjs.push(cell);
@@ -62324,7 +62978,7 @@
             }, {});
             this._CellHeaderPathMap = new Map();
             this._largeCellRangeCache.length = 0;
-            const diffCell = diffCellAddress(col, row, oldRowHeaderCellIds.map(oldCellId => oldCellId[col]), this._rowHeaderCellIds_FULL.map(newCellId => newCellId[col]), oldRowHeaderCellPositons, this);
+            const diffCell = diffCellAddress(col, row, oldRowHeaderCellIds.map(oldCellId => oldCellId[col - this.leftRowSeriesNumberColumnCount]), this._rowHeaderCellIds_FULL.map(newCellId => newCellId[col - this.leftRowSeriesNumberColumnCount]), oldRowHeaderCellPositons, this);
             this._rowHeaderCellIds = this._rowHeaderCellIds_FULL.slice();
             return diffCell;
         }
@@ -62351,10 +63005,14 @@
                         if (this.rowHierarchyType === 'grid') {
                             col = this.rowDimensionKeys.indexOf(highlightDimension.dimensionKey);
                         }
-                        return col === -1 ? undefined : { col: this.rowHeaderTitle ? col + 1 : col, row: 0 };
+                        return col === -1
+                            ? undefined
+                            : { col: (this.rowHeaderTitle ? col + 1 : col) + this.leftRowSeriesNumberColumnCount, row: 0 };
                     }
                     const row = this.colDimensionKeys.indexOf(highlightDimension.dimensionKey);
-                    return row === -1 ? undefined : { col: 0, row: this.columnHeaderTitle ? row + 1 : row };
+                    return row === -1
+                        ? undefined
+                        : { col: 0 + this.leftRowSeriesNumberColumnCount, row: this.columnHeaderTitle ? row + 1 : row };
                 }
                 let isCol = false;
                 for (let j = 0; j < colArr.length; j++) {
@@ -62389,15 +63047,15 @@
                 const { startInTotal, level } = rowDimension;
                 row += startInTotal;
                 if (this.rowHierarchyType === 'grid') {
-                    col = this.rowHeaderTitle ? level + 1 : level;
+                    col = (this.rowHeaderTitle ? level + 1 : level) + this.leftRowSeriesNumberColumnCount;
                 }
                 else {
-                    col = 0;
+                    col = 0 + this.leftRowSeriesNumberColumnCount;
                 }
                 return { col, row };
             }
             else if (colDimension) {
-                col = this.rowHeaderLevelCount;
+                col = this.rowHeaderLevelCount + this.leftRowSeriesNumberColumnCount;
                 const { startInTotal, level } = colDimension;
                 col += startInTotal;
                 row = this.columnHeaderTitle ? level + 1 : level;
@@ -62431,7 +63089,7 @@
             else if (this.isCornerHeader(col, row)) {
                 if (this?.cornerSetting?.titleOnDimension === 'row') {
                     pivotInfo.push({
-                        dimensionKey: this.rowDimensionKeys[this.rowHeaderTitle ? col - 1 : col],
+                        dimensionKey: this.rowDimensionKeys[(this.rowHeaderTitle ? col - 1 : col) - this.leftRowSeriesNumberColumnCount],
                         isPivotCorner: true
                     });
                 }
@@ -62482,9 +63140,16 @@
             return undefined;
         }
         canMoveHeaderPosition(source, target) {
+            if (this.isSeriesNumberInHeader(target.col, target.row) || this.isSeriesNumberInHeader(source.col, source.row)) {
+                return false;
+            }
             if (source.col < 0 || source.row < 0 || target.col < 0 || target.row < 0) {
                 return false;
             }
+            if (this.isSeriesNumberInBody(target.col, target.row) && this.isSeriesNumberInBody(source.col, source.row)) {
+                source.col = source.col + this.leftRowSeriesNumberColumnCount + this.rowHeaderLevelCount - 1;
+                target.col = target.col + this.leftRowSeriesNumberColumnCount + this.rowHeaderLevelCount - 1;
+            }
             const sourceCellRange = this.getCellRange(source.col, source.row);
             if (this.isColumnHeader(source.col, source.row)) {
                 const sourceTopId = this.getParentCellId(source.col, sourceCellRange.start.row);
@@ -62538,14 +63203,14 @@
                         return null;
                     }
                     for (let row = 0; row < this._columnHeaderCellIds.length; row++) {
-                        const sourceIds = this._columnHeaderCellIds[row].splice(sourceCellRange.start.col - this.rowHeaderLevelCount, sourceSize);
-                        sourceIds.unshift(targetIndex - this.rowHeaderLevelCount, 0);
+                        const sourceIds = this._columnHeaderCellIds[row].splice(sourceCellRange.start.col - this.rowHeaderLevelCount - this.leftRowSeriesNumberColumnCount, sourceSize);
+                        sourceIds.unshift(targetIndex - this.rowHeaderLevelCount - this.leftRowSeriesNumberColumnCount, 0);
                         Array.prototype.splice.apply(this._columnHeaderCellIds[row], sourceIds);
                     }
-                    const sourceColumns = this._columnWidths.splice(sourceCellRange.start.col, sourceSize);
-                    sourceColumns.unshift(targetIndex, 0);
+                    const sourceColumns = this._columnWidths.splice(sourceCellRange.start.col - this.leftRowSeriesNumberColumnCount, sourceSize);
+                    sourceColumns.unshift((targetIndex - this.leftRowSeriesNumberColumnCount), 0);
                     Array.prototype.splice.apply(this._columnWidths, sourceColumns);
-                    this.columnDimensionTree.movePosition(this.getCellHeaderPathsWidthTreeNode(source.col, source.row).colHeaderPaths.length - 1, sourceCellRange.start.col - this.rowHeaderLevelCount, targetCellRange.start.col - this.rowHeaderLevelCount);
+                    this.columnDimensionTree.movePosition(this.getCellHeaderPathsWidthTreeNode(source.col, source.row).colHeaderPaths.length - 1, sourceCellRange.start.col - this.rowHeaderLevelCount - this.leftRowSeriesNumberColumnCount, targetCellRange.start.col - this.rowHeaderLevelCount - this.leftRowSeriesNumberColumnCount);
                     this.columnDimensionTree.reset(this.columnDimensionTree.tree.children, true);
                     this._CellHeaderPathMap = new Map();
                     this._largeCellRangeCache.length = 0;
@@ -62697,7 +63362,7 @@
                                     dimension.indicatorKey === rowDimension.indicatorKey &&
                                     (!rowDimension.value || dimension.value === rowDimension.value))) {
                                 rowArr = dimension.children;
-                                if (needLowestLevel && (!rowArr || rowArr.some(row => row.dimensionKey === 'axis'))) {
+                                if (needLowestLevel && !rowArr) {
                                     rowDimensionFinded = dimension;
                                 }
                                 else if (!needLowestLevel) {
@@ -62719,7 +63384,7 @@
                 const { startInTotal, level } = rowDimensionFinded ?? defaultDimension;
                 row += startInTotal ?? 0;
                 if (this.rowHierarchyType === 'grid') {
-                    defaultCol = this.rowHeaderTitle ? level + 1 : level;
+                    defaultCol = (this.rowHeaderTitle ? level + 1 : level) + this.leftRowSeriesNumberColumnCount;
                 }
                 else {
                     defaultCol = 0;
@@ -63232,6 +63897,75 @@
             }, {});
             this.setPagination(this.pagination);
         }
+        isSeriesNumberInHeader(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && row >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                if (row < this.headerLevelCount) {
+                    return true;
+                }
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 &&
+                row >= 0 &&
+                col >= this.colCount - this.rightRowSeriesNumberColumnCount) {
+                if (row < this.headerLevelCount) {
+                    return true;
+                }
+            }
+            return false;
+        }
+        isSeriesNumberInBody(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                if (row >= this.headerLevelCount) {
+                    return true;
+                }
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 && col >= this.colCount - this.rightRowSeriesNumberColumnCount) {
+                if (row >= this.headerLevelCount) {
+                    return true;
+                }
+            }
+            return false;
+        }
+        isSeriesNumber(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && row >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                return true;
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 &&
+                row >= 0 &&
+                col >= this.colCount - this.rightRowSeriesNumberColumnCount) {
+                return true;
+            }
+            return false;
+        }
+        getSeriesNumberHeader(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                if (row < this.headerLevelCount) {
+                    return Object.assign({}, this.leftRowSeriesNumberColumn[col], {
+                        style: this._table.internalProps.rowSeriesNumber.headerStyle
+                    });
+                }
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 &&
+                col >= this.colCount - this.rightRowSeriesNumberColumnCount &&
+                row < this.headerLevelCount) {
+                if (row < this.headerLevelCount) {
+                    return this.rightRowSeriesNumberColumn[col - (this.colCount - this.rightRowSeriesNumberColumnCount)];
+                }
+            }
+            return undefined;
+        }
+        getSeriesNumberBody(col, row) {
+            if (this.leftRowSeriesNumberColumnCount > 0 && col >= 0 && col < this.leftRowSeriesNumberColumnCount) {
+                if (row >= this.headerLevelCount) {
+                    return this.leftRowSeriesNumberColumn[col];
+                }
+            }
+            if (this.rightRowSeriesNumberColumnCount > 0 && col >= this.colCount - this.rightRowSeriesNumberColumnCount) {
+                if (row >= this.headerLevelCount) {
+                    return this.rightRowSeriesNumberColumn[col - (this.colCount - this.rightRowSeriesNumberColumnCount)];
+                }
+            }
+            return undefined;
+        }
     }
     function scaleWholeRangeSize(count, bandwidth, paddingInner, paddingOuter) {
         if (paddingInner === 1) {
@@ -64769,7 +65503,7 @@
             }
             table.colCount = layoutMap.colCount ?? 0;
             table.rowCount = layoutMap.rowCount ?? 0;
-            table.internalProps.frozenColCount = layoutMap.rowHeaderLevelCount ?? 0;
+            this.internalProps.frozenColCount = Math.max((layoutMap.rowHeaderLevelCount ?? 0) + layoutMap.leftRowSeriesNumberColumnCount, this.options.frozenColCount ?? 0);
             table.frozenRowCount = layoutMap.headerLevelCount;
             if (table.bottomFrozenRowCount !== (this.options.bottomFrozenRowCount ?? 0)) {
                 table.bottomFrozenRowCount = this.options.bottomFrozenRowCount ?? 0;
@@ -64861,7 +65595,15 @@
             if (customMergeText) {
                 return customMergeText;
             }
-            if (this.internalProps.layoutMap.isHeader(col, row)) {
+            if (this.internalProps.layoutMap.isSeriesNumber(col, row)) {
+                if (this.internalProps.layoutMap.isSeriesNumberInHeader(col, row)) {
+                    const { title } = this.internalProps.layoutMap.getSeriesNumberHeader(col, row);
+                    return title;
+                }
+                const { format } = this.internalProps.layoutMap.getSeriesNumberBody(col, row);
+                return typeof format === 'function' ? format(col, row, this) : row - this.columnHeaderLevelCount + 1;
+            }
+            else if (this.internalProps.layoutMap.isHeader(col, row)) {
                 const { title, fieldFormat } = this.internalProps.layoutMap.getHeader(col, row);
                 return typeof fieldFormat === 'function' ? fieldFormat(title, col, row, this) : title;
             }
@@ -65417,6 +66159,8 @@
             }
             return false;
         }
+        changeRecordOrder(source, target) {
+        }
     }
 
     class PivotChart extends BaseTable {
@@ -66308,6 +67052,8 @@
             }
             return false;
         }
+        changeRecordOrder(source, target) {
+        }
     }
 
     class Circle extends Circle$1 {
@@ -66817,7 +67563,7 @@
     }
 
     registerForVrender();
-    const version = "0.21.4-alpha.4";
+    const version = "0.22.0";
     function getIcons() {
         return get$2();
     }