@visactor/vtable 1.2.1-alpha.1 → 1.3.0

package/dist/vtable.js

@@ -22113,6 +22113,7 @@
     };
     let Style$1 = class Style extends EventTarget$1 {
         _color;
+        _strokeColor;
         _fontSize;
         _fontFamily;
         _fontWeight;
@@ -22151,6 +22152,7 @@
             this._textAlign = style?.textAlign ?? bodyStyle?.textAlign;
             this._textBaseline = style?.textBaseline ?? bodyStyle?.textBaseline;
             this._color = style?.color ?? bodyStyle?.color;
+            this._strokeColor = style?.strokeColor ?? bodyStyle?.strokeColor;
             this._fontSize = style.fontSize ?? bodyStyle?.fontSize;
             this._fontFamily = style.fontFamily ?? bodyStyle?.fontFamily;
             this._fontWeight = style.fontWeight ?? bodyStyle?.fontWeight;
@@ -22182,6 +22184,12 @@
         set color(color) {
             this._color = color;
         }
+        get strokeColor() {
+            return this._strokeColor;
+        }
+        set strokeColor(strokeColor) {
+            this._strokeColor = strokeColor;
+        }
         get fontSize() {
             return this._fontSize;
         }
@@ -22642,6 +22650,7 @@
     };
     class Style extends EventTarget$1 {
         _color;
+        _strokeColor;
         _fontSize;
         _fontFamily;
         _fontWeight;
@@ -22678,6 +22687,7 @@
         constructor(style = {}, headerStyle = {}) {
             super();
             this._color = style.color ?? headerStyle?.color;
+            this._strokeColor = style?.strokeColor ?? headerStyle?.strokeColor;
             this._fontSize = style.fontSize ?? headerStyle?.fontSize;
             this._fontFamily = style.fontFamily ?? headerStyle?.fontFamily;
             this._fontWeight = style.fontWeight ?? headerStyle?.fontWeight;
@@ -22717,6 +22727,12 @@
         set color(color) {
             this._color = color;
         }
+        get strokeColor() {
+            return this._strokeColor;
+        }
+        set strokeColor(strokeColor) {
+            this._strokeColor = strokeColor;
+        }
         get fontSize() {
             return this._fontSize;
         }
@@ -25045,12 +25061,6 @@
                     },
                     get color() {
                         return tooltip.color ?? '#FFF';
-                    },
-                    get maxWidth() {
-                        return tooltip.maxWidth;
-                    },
-                    get maxHeight() {
-                        return tooltip.maxHeight;
                     }
                 };
             }
@@ -25241,6 +25251,9 @@
                 get color() {
                     return style.color;
                 },
+                get strokeColor() {
+                    return style.strokeColor;
+                },
                 get borderColor() {
                     return style.borderColor;
                 },
@@ -35071,6 +35084,7 @@
         const textAlign = getProp('textAlign', headerStyle, col, row, table);
         const textBaseline = getProp('textBaseline', headerStyle, col, row, table);
         const color = getProp('color', headerStyle, col, row, table);
+        const strokeColor = getProp('strokeColor', headerStyle, col, row, table);
         const lineHeight = getProp('lineHeight', headerStyle, col, row, table);
         const underline = getProp('underline', headerStyle, col, row, table);
         const underlineDash = getProp('underlineDash', headerStyle, col, row, table);
@@ -35107,6 +35121,7 @@
                 fontStyle,
                 fontVariant,
                 fill: color,
+                stroke: strokeColor ?? false,
                 textAlign,
                 textBaseline,
                 lineHeight: lineHeight ?? fontSize,
@@ -37878,7 +37893,7 @@
                     wordBreak: 'break-word',
                     heightLimit: autoRowHeight && !table.options.customConfig?.multilinesForXTable
                         ? -1
-                        : cellHeight - (padding[0] + padding[2]),
+                        : cellHeight - Math.floor(padding[0] + padding[2]),
                     pickable: false,
                     dx: (textAlign === 'left' ? hierarchyOffset : 0) + _contentOffset,
                     whiteSpace: text.length === 1 && !autoWrapText ? 'no-wrap' : 'normal'
@@ -37979,7 +37994,7 @@
                     textBaseline: 'top',
                     heightLimit: autoRowHeight && !table.options.customConfig?.multilinesForXTable
                         ? -1
-                        : cellHeight - (padding[0] + padding[2]),
+                        : cellHeight - Math.floor(padding[0] + padding[2]),
                     pickable: false,
                     autoWrapText,
                     lineClamp,
@@ -38192,6 +38207,9 @@
         return config;
     }
     function updateCellContentWidth(cellGroup, distWidth, cellHeight, detaX, autoRowHeight, padding, textAlign, textBaseline, scene) {
+        if (isValidNumber$1(cellGroup.contentWidth)) {
+            detaX = distWidth - (cellGroup.contentWidth ?? cellGroup.attribute.width);
+        }
         let leftIconWidth = 0;
         let leftIconHeight = 0;
         let rightIconWidth = 0;
@@ -38239,7 +38257,7 @@
             else if (child.role === 'icon-absolute-right') {
                 child.setAttribute('x', child.attribute.x + detaX);
             }
-            else if (child.name === 'content' || child.name === 'text') {
+            else if (child.name === 'content' || (child.name === 'text' && child.type !== 'richtext')) {
                 const childTextAlign = child.attribute.textAlign ?? textAlign;
                 if (childTextAlign === 'center') {
                     child.setAttribute('x', padding[3] + leftIconWidth + (distWidth - (padding[1] + padding[3]) - leftIconWidth - rightIconWidth) / 2);
@@ -38299,7 +38317,7 @@
         return false;
     }
     function updateCellContentHeight(cellGroup, distHeight, detaY, autoRowHeight, padding, textAlign, textBaseline) {
-        const newHeight = distHeight - (padding[0] + padding[2]);
+        const newHeight = distHeight - Math.floor(padding[0] + padding[2]);
         const textMark = cellGroup.getChildByName('text');
         if (textMark instanceof Text$1 && !autoRowHeight) {
             textMark.setAttributes({
@@ -38737,7 +38755,7 @@
             autoWrapText,
             lineClamp,
             wordBreak: 'break-word',
-            heightLimit: autoRowHeight ? -1 : cellHeight - (padding[0] + padding[2]),
+            heightLimit: autoRowHeight ? -1 : cellHeight - Math.floor(padding[0] + padding[2]),
             pickable: false,
             dx: hierarchyOffset,
             whiteSpace: text.length === 1 && !autoWrapText ? 'no-wrap' : 'normal'
@@ -38868,7 +38886,7 @@
             autoWrapText,
             lineClamp,
             wordBreak: 'break-word',
-            heightLimit: autoRowHeight ? -1 : cellHeight - (padding[0] + padding[2]),
+            heightLimit: autoRowHeight ? -1 : cellHeight - Math.floor(padding[0] + padding[2]),
             pickable: false,
             dx: hierarchyOffset
         };
@@ -39183,7 +39201,7 @@
                     autoWrapText,
                     lineClamp,
                     wordBreak: 'break-word',
-                    heightLimit: cellHeight - (padding[0] + padding[2]),
+                    heightLimit: cellHeight - Math.floor(padding[0] + padding[2]),
                     pickable: false,
                     dx: textAlign === 'left' ? hierarchyOffset : 0,
                     x
@@ -45007,6 +45025,8 @@
     function getAdaptiveWidth(totalDrawWidth, startCol, endColPlus1, update, newWidths, table, fromScenegraph) {
         let actualWidth = 0;
         const adaptiveColumns = [];
+        const sparklineColumns = [];
+        let totalSparklineAbleWidth = 0;
         for (let col = startCol; col < endColPlus1; col++) {
             const width = update ? newWidths[col] : table.getColWidth(col);
             const maxWidth = table.getMaxColWidth(col);
@@ -45018,8 +45038,34 @@
             else {
                 totalDrawWidth -= width;
             }
+            if (table.options.customConfig?.shrinkSparklineFirst) {
+                const bodyCellType = table.getBodyColumnType(col, 0);
+                if (bodyCellType === 'sparkline') {
+                    sparklineColumns.push({ col, width });
+                    totalSparklineAbleWidth += width - table.defaultColWidth;
+                }
+            }
         }
         const factor = totalDrawWidth / actualWidth;
+        if (table.options.customConfig?.shrinkSparklineFirst &&
+            factor < 1 &&
+            totalDrawWidth - actualWidth < totalSparklineAbleWidth) {
+            for (let i = 0; i < sparklineColumns.length; i++) {
+                const { col, width } = sparklineColumns[i];
+                const deltaWidth = (actualWidth - totalDrawWidth) / sparklineColumns.length;
+                const colWidth = Math.floor(width - deltaWidth);
+                if (update) {
+                    newWidths[col] = table._adjustColWidth(col, colWidth);
+                }
+                else if (fromScenegraph) {
+                    table.scenegraph.setColWidth(col, table._adjustColWidth(col, colWidth));
+                }
+                else {
+                    table._setColWidth(col, table._adjustColWidth(col, colWidth), false, true);
+                }
+            }
+            return;
+        }
         for (let i = 0; i < adaptiveColumns.length; i++) {
             const col = adaptiveColumns[i];
             let colWidth;
@@ -48446,7 +48492,6 @@
                     if (iconBack) {
                         iconBack.setAttributes({
                             x: (icon.attribute.x ?? 0) +
-                                (icon.attribute.dx ?? 0) +
                                 (icon.AABBBounds.width() - icon.backgroundWidth) / 2,
                             y: (icon.attribute.y ?? 0) + (icon.AABBBounds.height() - icon.backgroundHeight) / 2,
                             dx: icon.attribute.dx ?? 0,
@@ -48461,7 +48506,6 @@
                     else {
                         iconBack = createRect({
                             x: (icon.attribute.x ?? 0) +
-                                (icon.attribute.dx ?? 0) +
                                 (icon.AABBBounds.width() - icon.backgroundWidth) / 2,
                             y: (icon.attribute.y ?? 0) + (icon.AABBBounds.height() - icon.backgroundHeight) / 2,
                             dx: icon.attribute.dx ?? 0,
@@ -50685,6 +50729,10 @@
             !table.stateManager.isResizeCol()) {
             const currentRange = state.select.ranges[state.select.ranges.length - 1];
             if (isShift && currentRange) {
+                if (!isCtrl) {
+                    cellPos.col = col;
+                    cellPos.row = row;
+                }
                 if (state.select.headerSelectMode !== 'cell' && table.isColumnHeader(col, row)) {
                     const startCol = Math.min(currentRange.start.col, currentRange.end.col, col);
                     const endCol = Math.max(currentRange.start.col, currentRange.end.col, col);
@@ -52379,12 +52427,15 @@
             endMoveCol(this);
         }
         checkFrozen() {
-            const originalFrozenColCount = this.table.isListTable() && !this.table.internalProps.transpose
+            let originalFrozenColCount = this.table.isListTable() && !this.table.internalProps.transpose
                 ? this.table.options.frozenColCount
                 : 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 (originalFrozenColCount > this.table.colCount) {
+                    originalFrozenColCount = this.table.colCount;
+                }
                 if (this.table.tableNoFrameWidth - this.table.getColsWidth(0, originalFrozenColCount - 1) <= 120) {
                     this.table._setFrozenColCount(0);
                     this.setFrozenCol(-1);
@@ -52713,7 +52764,10 @@
         }
         triggerSort(col, row, iconMark, event) {
             if (this.table.isPivotTable()) {
-                const order = this.table.getPivotSortState(col, row);
+                const sortState = this.table.getPivotSortState(col, row);
+                const order = sortState ? sortState.toUpperCase() : 'DESC';
+                const new_order = order === 'ASC' ? 'DESC' : 'ASC';
+                this.table.sort(col, row, new_order);
                 this.table.fireListeners(PIVOT_TABLE_EVENT_TYPE.PIVOT_SORT_CLICK, {
                     col: col,
                     row: row,
@@ -52969,6 +53023,9 @@
     }
 
     function bindSparklineHoverEvent(table) {
+        if (table.eventManager.bindSparklineHoverEvent) {
+            return;
+        }
         let hasSparkLine = false;
         if (table.isPivotTable()) {
             const layoutMap = table.internalProps.layoutMap;
@@ -52985,6 +53042,7 @@
         if (!hasSparkLine) {
             return;
         }
+        table.eventManager.bindSparklineHoverEvent = true;
         table.on(TABLE_EVENT_TYPE.MOUSEMOVE_CELL, (e) => {
             const { col, row, x, y } = e;
             const type = table.getBodyColumnType(col, row);
@@ -53259,7 +53317,9 @@
             table.editorManager?.completeEdit(e.nativeEvent);
             const hitIcon = eventArgsSet?.eventArgs?.target?.role?.startsWith('icon')
                 ? eventArgsSet.eventArgs.target
-                : undefined;
+                : e.target.role?.startsWith('icon')
+                    ? e.target
+                    : undefined;
             eventManager.downIcon = hitIcon;
             if (!hitIcon || hitIcon.attribute.interactive === false) {
                 if (e.pointerType === 'touch') {
@@ -53479,7 +53539,11 @@
                 stateManager.hideMenu();
             }
             table.editorManager?.completeEdit(e.nativeEvent);
-            if (!eventManager.checkCellFillhandle(eventArgsSet) && eventManager.checkColumnResize(eventArgsSet, true)) {
+            const hitIcon = e.target.role?.startsWith('icon') ? e.target : undefined;
+            eventManager.downIcon = hitIcon;
+            if (!hitIcon &&
+                !eventManager.checkCellFillhandle(eventArgsSet) &&
+                eventManager.checkColumnResize(eventArgsSet, true)) {
                 table.scenegraph.updateChartState(null);
                 stateManager.updateInteractionState(InteractionState.grabing);
                 const { eventArgs } = eventArgsSet;
@@ -54035,22 +54099,62 @@
                 let targetCol;
                 let targetRow;
                 if (e.key === 'ArrowUp') {
-                    targetCol = stateManager.select.cellPos.col;
-                    targetRow = Math.min(table.rowCount - 1, Math.max(0, stateManager.select.cellPos.row - 1));
+                    if (e.ctrlKey || e.metaKey) {
+                        targetCol = stateManager.select.cellPos.col;
+                        targetRow = 0;
+                    }
+                    else if (e.shiftKey) {
+                        targetCol = stateManager.select.cellPos.col;
+                        targetRow = Math.min(table.rowCount - 1, Math.max(0, stateManager.select.cellPos.row - 1));
+                    }
+                    else {
+                        targetCol = stateManager.select.cellPos.col;
+                        targetRow = Math.min(table.rowCount - 1, Math.max(0, stateManager.select.cellPos.row - 1));
+                    }
                 }
                 else if (e.key === 'ArrowDown') {
-                    targetCol = stateManager.select.cellPos.col;
-                    targetRow = Math.min(table.rowCount - 1, Math.max(0, stateManager.select.cellPos.row + 1));
+                    if (e.ctrlKey || e.metaKey) {
+                        targetCol = stateManager.select.cellPos.col;
+                        targetRow = table.rowCount - 1;
+                    }
+                    else if (e.shiftKey) {
+                        targetCol = stateManager.select.cellPos.col;
+                        targetRow = Math.min(table.rowCount - 1, Math.max(0, stateManager.select.cellPos.row + 1));
+                    }
+                    else {
+                        targetCol = stateManager.select.cellPos.col;
+                        targetRow = Math.min(table.rowCount - 1, Math.max(0, stateManager.select.cellPos.row + 1));
+                    }
                 }
                 else if (e.key === 'ArrowLeft') {
-                    targetRow = stateManager.select.cellPos.row;
-                    targetCol = Math.min(table.colCount - 1, Math.max(0, stateManager.select.cellPos.col - 1));
+                    if (e.ctrlKey || e.metaKey) {
+                        targetCol = 0;
+                        targetRow = stateManager.select.cellPos.row;
+                    }
+                    else if (e.shiftKey) {
+                        targetRow = stateManager.select.cellPos.row;
+                        targetCol = Math.min(table.colCount - 1, Math.max(0, stateManager.select.cellPos.col - 1));
+                    }
+                    else {
+                        targetRow = stateManager.select.cellPos.row;
+                        targetCol = Math.min(table.colCount - 1, Math.max(0, stateManager.select.cellPos.col - 1));
+                    }
                 }
                 else if (e.key === 'ArrowRight') {
-                    targetRow = stateManager.select.cellPos.row;
-                    targetCol = Math.min(table.colCount - 1, Math.max(0, stateManager.select.cellPos.col + 1));
+                    if (e.ctrlKey || e.metaKey) {
+                        targetCol = table.colCount - 1;
+                        targetRow = stateManager.select.cellPos.row;
+                    }
+                    else if (e.shiftKey) {
+                        targetRow = stateManager.select.cellPos.row;
+                        targetCol = Math.min(table.colCount - 1, Math.max(0, stateManager.select.cellPos.col + 1));
+                    }
+                    else {
+                        targetRow = stateManager.select.cellPos.row;
+                        targetCol = Math.min(table.colCount - 1, Math.max(0, stateManager.select.cellPos.col + 1));
+                    }
                 }
-                table.selectCell(targetCol, targetRow);
+                table.selectCell(targetCol, targetRow, e.shiftKey);
                 if ((table.options.keyboardOptions?.moveEditCellOnArrowKeys ?? false) &&
                     table.editorManager.editingEditor) {
                     table.editorManager.completeEdit();
@@ -54786,6 +54890,7 @@
         downIcon;
         globalEventListeners = [];
         inertiaScroll;
+        bindSparklineHoverEvent;
         constructor(table) {
             this.table = table;
             this.handleTextStickBindId = [];
@@ -54824,6 +54929,7 @@
                     });
                     this.handleTextStickBindId = [];
                 }
+                bindSparklineHoverEvent(this.table);
             }, 0);
         }
         bindSelfEvent() {
@@ -56072,10 +56178,19 @@
         getIcons(col, row) {
             const icons = [];
             if (this._table.isPivotTable()) {
-                const { showSort } = this._table.internalProps.layoutMap.getHeader(col, row);
+                const { showSort, sort } = this._table.internalProps.layoutMap.getHeader(col, row);
                 if (showSort) {
-                    const order = this._table.getPivotSortState(col, row);
-                    const sortIcon = order === 'asc' ? this.downIcon : order === 'desc' ? this.upIcon : this.normalIcon;
+                    let order = this._table.getPivotSortState(col, row);
+                    if (order) {
+                        order = order.toUpperCase();
+                    }
+                    const sortIcon = order === 'ASC' ? this.downIcon : order === 'DESC' ? this.upIcon : this.normalIcon;
+                    if (sortIcon) {
+                        icons.push(sortIcon);
+                    }
+                }
+                else if (sort) {
+                    const sortIcon = this.getSortIconForPivotTable(this._table.getPivotSortState(col, row), this._table, col, row);
                     if (sortIcon) {
                         icons.push(sortIcon);
                     }
@@ -56198,6 +56313,17 @@
             }
             return icon;
         }
+        getSortIconForPivotTable(order, _table, col, row) {
+            const headerC = _table.getHeaderDefine(col, row);
+            if (!headerC ||
+                headerC.showSort === false ||
+                (!isValid$1(headerC.showSort) && !headerC.sort) ||
+                (headerC.columns && headerC.columns.length > 0)) {
+                return null;
+            }
+            const icon = order === 'ASC' ? this.downIcon : order === 'DESC' ? this.upIcon : this.normalIcon;
+            return icon;
+        }
         getDropDownStateIcons(_table, col, row) {
             const headerC = _table.getHeaderDefine(col, row);
             const headerL = _table._getHeaderLayoutMap(col, row);
@@ -56449,30 +56575,12 @@
 	white-space: pre-wrap;
 	margin: 0;
 	box-sizing: border-box;
-	overflow: auto;
+	overflow: hidden;
 	word-wrap: break-word;
 	position: relative;
 	background-color: #FFF;
 	z-index: 2;
-	border-radius: 4px;
-}
-/*  WebKit Microsoft Edge（新版）： */
-.vtable__bubble-tooltip-element__content::-webkit-scrollbar {
-  width: 0;
-  height: 0;
-  background-color: transparent;
-}
-/*  Opera Firefox  */
-.vtable__bubble-tooltip-element__content > scrollbar-track {
-  width: 0;
-  height: 0;
-  background-color: transparent;
-}
-/* Internet Explorer 11 和 Microsoft Edge（旧版） */
-.vtable__bubble-tooltip-element__content > scrollbar {
-  width: 0;
-  height: 0;
-  background-color: transparent;
+	border-radius: 4px
 }
 .vtable__bubble-tooltip-element__triangle {
 	/* font-size: .75rem; */
@@ -56506,7 +56614,7 @@
         constructor() {
             this._handler = new EventHandler();
             const rootElement = (this._rootElement = createElement('div', [TOOLTIP_CLASS, HIDDEN_CLASS]));
-            const messageElement = createElement('div', [CONTENT_CLASS]);
+            const messageElement = createElement('span', [CONTENT_CLASS]);
             const triangle = createElement('span', [TRIANGLE_CLASS]);
             rootElement.appendChild(triangle);
             rootElement.appendChild(messageElement);
@@ -56519,9 +56627,6 @@
                 this._disappearDelay = undefined;
                 this.unbindFromCell();
             });
-            messageElement.addEventListener('wheel', e => {
-                e.stopPropagation();
-            });
         }
         bindToCell(table, col, row, tooltipInstanceInfo, confine) {
             this._disappearDelay = tooltipInstanceInfo?.disappearDelay;
@@ -56546,10 +56651,6 @@
                 tooltipInstanceInfo?.style?.color && (messageElement.style.color = tooltipInstanceInfo?.style?.color);
                 tooltipInstanceInfo?.style?.padding &&
                     (messageElement.style.padding = `${tooltipInstanceInfo?.style?.padding.join('px ')}px`);
-                tooltipInstanceInfo?.style?.maxHeight &&
-                    (messageElement.style.maxHeight = `${tooltipInstanceInfo?.style?.maxHeight}px`);
-                tooltipInstanceInfo?.style?.maxWidth &&
-                    (messageElement.style.maxWidth = `${tooltipInstanceInfo?.style?.maxWidth}px`);
                 messageElement && (messageElement.textContent = tooltipInstanceInfo?.content);
                 const binded = this._bindToCell(table, col, row, tooltipInstanceInfo?.position, tooltipInstanceInfo?.referencePosition, confine, tooltipInstanceInfo?.style?.arrowMark);
                 if (binded) {
@@ -56928,7 +57029,7 @@
                         rect
                     },
                     disappearDelay: table.internalProps.tooltip.overflowTextTooltipDisappearDelay ?? 0,
-                    style: table.theme.tooltipStyle
+                    style: { arrowMark: false }
                 };
             }
             else if (table.internalProps.tooltip?.isShowOverflowTextTooltip) {
@@ -58675,7 +58776,7 @@
                 : Object.assign({}, (indicatorInfo ?? dimensionInfo)?.headerStyle),
             headerType: indicatorInfo?.headerType ?? dimensionInfo?.headerType ?? 'text',
             headerIcon: indicatorInfo?.headerIcon ?? dimensionInfo?.headerIcon,
-            define: Object.assign({}, hd, indicatorInfo ?? dimensionInfo),
+            define: Object.assign({}, hd, indicatorInfo ?? Object.assign({}, dimensionInfo, { sort: undefined })),
             fieldFormat: indicatorInfo?.headerFormat ?? dimensionInfo?.headerFormat,
             dropDownMenu: indicatorInfo?.dropDownMenu ?? dimensionInfo?.dropDownMenu,
             pivotInfo: {
@@ -58687,6 +58788,7 @@
             minWidth: dimensionInfo?.minWidth,
             maxWidth: dimensionInfo?.maxWidth,
             showSort: indicatorInfo?.showSort ?? dimensionInfo?.showSort,
+            sort: indicatorInfo?.sort,
             description: dimensionInfo?.description
         };
         if (indicatorInfo) {
@@ -59103,7 +59205,7 @@
             return TABLE_EVENT_TYPE;
         }
         options;
-        version = "1.2.1-alpha.1";
+        version = "1.3.0";
         pagination;
         id = `VTable${Date.now()}`;
         headerStyleCache;
@@ -60715,8 +60817,8 @@
         clearSelected() {
             this.stateManager.updateSelectPos(-1, -1);
         }
-        selectCell(col, row) {
-            this.stateManager.updateSelectPos(col, row);
+        selectCell(col, row, isShift, isCtrl) {
+            this.stateManager.updateSelectPos(col, row, isShift, isCtrl);
             this.stateManager.endSelectCells();
         }
         selectCells(cellRanges) {
@@ -61028,8 +61130,11 @@
                 let cacheKey;
                 if (this.isPivotTable() && !this.isBottomFrozenRow(row) && !this.isRightFrozenColumn(col)) {
                     const define = this.getHeaderDefine(col, row);
+                    const isCorner = this.isCornerHeader(col, row);
                     cacheKey = define?.dimensionKey
-                        ? `dim-${define.dimensionKey}`
+                        ? isCorner
+                            ? `dim-cor-${define.dimensionKey}`
+                            : `dim-${define.dimensionKey}`
                         : define?.indicatorKey
                             ? `ind-${define.indicatorKey}`
                             : `${col}-${row}`;
@@ -61343,6 +61448,9 @@
                     ? getProp('bgColor', actStyle, col, row, this)
                     : theme.group.fill,
                 color: isBoolean$2(theme.text.fill) ? getProp('color', actStyle, col, row, this) : theme.text.fill,
+                strokeColor: isBoolean$2(theme.text.stroke)
+                    ? getProp('strokeColor', actStyle, col, row, this)
+                    : theme.text.stroke,
                 fontFamily: theme.text.fontFamily,
                 fontSize: theme.text.fontSize,
                 fontWeight: theme.text.fontWeight,
@@ -63803,7 +63911,9 @@
                 subtextStyle: {
                     width: realWidth,
                     ...this._titleOption.subtextStyle
-                }
+                },
+                dx: this._titleOption.dx ?? 0,
+                dy: this._titleOption.dy ?? 0
             };
         }
     }
@@ -64694,7 +64804,7 @@
             const cellType = this.getCellType(col, row);
             if (isValid$1(field) && cellType === 'checkbox') {
                 const dataIndex = this.dataSource.getIndexKey(this.getRecordShowIndexByCell(col, row));
-                return this.stateManager.checkedState[dataIndex][field];
+                return this.stateManager.checkedState[dataIndex]?.[field];
             }
             return undefined;
         }
@@ -65793,11 +65903,15 @@
                                 : dimensionKey === 'axis'
                                     ? ''
                                     : dimensionKey,
-                        field: '维度名称',
+                        field: dimensionKey,
                         style: this.cornerSetting.headerStyle,
                         headerType: this.cornerSetting.headerType ?? 'text',
+                        showSort: dimensionInfo?.showSortInCorner,
+                        sort: dimensionInfo?.sort,
                         define: {
-                            dimensionKey: '维度名称',
+                            showSort: dimensionInfo?.showSortInCorner,
+                            sort: dimensionInfo?.sort,
+                            dimensionKey: dimensionKey,
                             id,
                             value: dimensionKey,
                             disableHeaderHover: !!this.cornerSetting.disableHeaderHover,
@@ -67081,6 +67195,7 @@
         getCellAdressByHeaderPath(dimensionPaths) {
             let colHeaderPaths;
             let rowHeaderPaths;
+            let isCornerCell = false;
             let forceBody = false;
             if (Array.isArray(dimensionPaths)) {
                 if (dimensionPaths.length > this.rowDimensionKeys.length + this.colDimensionKeys.length) {
@@ -67109,6 +67224,32 @@
                 return (this.fullRowDimensionKeys.indexOf(a.dimensionKey ?? this.indicatorDimensionKey) -
                     this.fullRowDimensionKeys.indexOf(b.dimensionKey ?? this.indicatorDimensionKey));
             });
+            colHeaderPaths?.forEach(a => {
+                if (a.isPivotCorner) {
+                    isCornerCell = true;
+                }
+            });
+            rowHeaderPaths?.forEach(a => {
+                if (a.isPivotCorner) {
+                    isCornerCell = true;
+                }
+            });
+            if (isCornerCell) {
+                if (this.cornerSetting.titleOnDimension === 'row') {
+                    for (let i = 0; i < this.rowDimensionKeys.length; i++) {
+                        if (rowHeaderPaths[0].dimensionKey === this.rowDimensionKeys[i]) {
+                            return { col: i + this.leftRowSeriesNumberColumnCount, row: 0 };
+                        }
+                    }
+                }
+                else {
+                    for (let i = 0; i < this.colDimensionKeys.length; i++) {
+                        if (colHeaderPaths[0].dimensionKey === this.colDimensionKeys[i]) {
+                            return { col: 0, row: i };
+                        }
+                    }
+                }
+            }
             let needLowestLevel = false;
             if (colHeaderPaths?.length >= 1 && rowHeaderPaths?.length >= 1) {
                 needLowestLevel = true;
@@ -67209,7 +67350,7 @@
                 }
             }
             if (colDimensionFinded || forceBody) {
-                col = this.rowHeaderLevelCount;
+                col = this.rowHeaderLevelCount + this.leftRowSeriesNumberColumnCount;
                 const { startInTotal, level } = colDimensionFinded ?? defaultDimension;
                 col += startInTotal ?? 0;
                 defaultRow = this.columnHeaderTitle ? level + 1 : level;
@@ -67728,7 +67869,9 @@
             return totalCount;
         }
         resetHeaderTree() {
+            this.colIndex = 0;
             this._rowHeaderCellFullPathIds_FULL = [];
+            this._columnHeaderCellFullPathIds = [];
             this._columnHeaderCellIds = [];
             const dataset = this.dataset;
             this.rowTree = dataset.rowHeaderTree;
@@ -67744,6 +67887,8 @@
                 o[e.id] = e;
                 return o;
             }, {});
+            this._CellHeaderPathMap = new Map();
+            this._largeCellRangeCache.length = 0;
             this.generateCellIdsConsiderHideHeader();
             this.setPagination(this.pagination);
         }
@@ -69348,9 +69493,10 @@
                     }
                     this.internalProps.layoutMap = new PivotHeaderLayoutMap(this, this.dataset, columnDimensionTree, rowDimensionTree);
                 }
-                this.pivotSortState = [];
-                if (options.pivotSortState) {
-                    this.updatePivotSortState(options.pivotSortState);
+                this._changePivotSortStateBySortRules();
+                if ((options.pivotSortState?.length ?? 0) > 0) {
+                    this.pivotSortState = [];
+                    this.pivotSortState = options.pivotSortState;
                 }
                 if (Env.mode !== 'node') {
                     this.editorManager = new EditManeger(this);
@@ -69485,9 +69631,10 @@
                 }
                 internalProps.layoutMap = new PivotHeaderLayoutMap(this, this.dataset, columnDimensionTree, rowDimensionTree);
             }
-            this.pivotSortState = [];
-            if (options.pivotSortState) {
-                this.updatePivotSortState(options.pivotSortState);
+            this._changePivotSortStateBySortRules();
+            if ((options.pivotSortState?.length ?? 0) > 0) {
+                this.pivotSortState = [];
+                this.pivotSortState = options.pivotSortState;
             }
             this.refreshHeader();
             if (internalProps.releaseList) {
@@ -69925,24 +70072,147 @@
             }
         }
         updateSortRules(sortRules) {
-            this.internalProps.dataConfig.sortRules = sortRules;
+            if (this.internalProps.dataConfig) {
+                this.internalProps.dataConfig.sortRules = sortRules;
+            }
+            else {
+                this.internalProps.dataConfig = { sortRules };
+            }
             this.dataset.updateSortRules(sortRules);
+            this._changePivotSortStateBySortRules();
             this.internalProps.layoutMap.resetHeaderTree();
             this.scenegraph.clearCells();
             this.refreshHeader();
             this.scenegraph.createSceneGraph();
             this.render();
         }
-        updatePivotSortState(pivotSortStateConfig) {
-            for (let i = 0; i < pivotSortStateConfig.length; i++) {
-                const { dimensions, order } = pivotSortStateConfig[i];
-                const cellAddress = this.internalProps.layoutMap.getPivotCellAdress(dimensions);
-                cellAddress &&
+        _changePivotSortStateBySortRules() {
+            this.pivotSortState = [];
+            const sortRules = this.internalProps.dataConfig?.sortRules ?? [];
+            for (let i = 0; i < sortRules.length; i++) {
+                const sortRule = sortRules[i];
+                if (sortRule.sortType) {
+                    const dimensions = [];
+                    if (sortRule.sortByIndicator) {
+                        if (sortRule.sortField ===
+                            (this.dataset.indicatorsAsCol
+                                ? this.dataset.rows[this.dataset.rows.length - 1]
+                                : this.dataset.columns[this.dataset.columns.length - 1])) {
+                            for (let j = 0; j < sortRule.query.length; j++) {
+                                dimensions.push({
+                                    dimensionKey: this.dataset.indicatorsAsCol ? this.dataset.columns[j] : this.dataset.rows[j],
+                                    value: sortRule.query[j]
+                                });
+                            }
+                            dimensions.push({
+                                indicatorKey: sortRule.sortByIndicator,
+                                value: this.internalProps.layoutMap.getIndicatorInfo(sortRule.sortByIndicator)
+                                    ?.title ?? sortRule.sortByIndicator
+                            });
+                        }
+                    }
+                    else {
+                        dimensions.push({
+                            dimensionKey: sortRule.sortField,
+                            isPivotCorner: true,
+                            value: sortRule.sortField
+                        });
+                    }
                     this.pivotSortState.push({
-                        col: cellAddress.col,
-                        row: cellAddress.row,
-                        order
+                        dimensions,
+                        order: sortRule.sortType
                     });
+                }
+            }
+        }
+        updatePivotSortState(pivotSortStateConfig) {
+            this.pivotSortState = pivotSortStateConfig;
+        }
+        sort(col, row, order) {
+            let dimensions;
+            if (this.isCornerHeader(col, row)) {
+                const dimensionInfo = this.getHeaderDefine(col, row);
+                dimensions = [];
+                const dimension = {
+                    isPivotCorner: true,
+                    dimensionKey: dimensionInfo.value,
+                    value: dimensionInfo.value
+                };
+                dimensions.push(dimension);
+            }
+            else if (this.isColumnHeader(col, row)) {
+                dimensions = this.getCellHeaderPaths(col, row).colHeaderPaths;
+            }
+            else {
+                dimensions = this.getCellHeaderPaths(col, row).rowHeaderPaths;
+            }
+            const sortIndicator = dimensions[dimensions.length - 1].indicatorKey;
+            const headerDefine = this.getHeaderDefine(col, row);
+            if (headerDefine.sort) {
+                if (this.dataset.sortRules) {
+                    for (let i = this.dataset.sortRules.length - 1; i >= 0; i--) {
+                        const sortRule = this.dataset.sortRules[i];
+                        if (headerDefine.dimensionKey && sortRule.sortField === headerDefine.dimensionKey) {
+                            this.dataset.sortRules.splice(i, 1);
+                        }
+                        else if (sortIndicator &&
+                            sortRule.sortField ===
+                                (this.dataset.indicatorsAsCol
+                                    ? this.dataset.rows[this.dataset.rows.length - 1]
+                                    : this.dataset.columns[this.dataset.columns.length - 1])) {
+                            this.dataset.sortRules.splice(i, 1);
+                        }
+                    }
+                    if (sortIndicator) {
+                        this.dataset.sortRules.push({
+                            sortField: this.dataset.indicatorsAsCol
+                                ? this.dataset.rows[this.dataset.rows.length - 1]
+                                : this.dataset.columns[this.dataset.columns.length - 1],
+                            sortType: SortType[order],
+                            sortByIndicator: sortIndicator,
+                            query: dimensions.reduce((arr, dimension) => {
+                                if (dimension.dimensionKey) {
+                                    arr.push(dimension.value);
+                                }
+                                return arr;
+                            }, [])
+                        });
+                    }
+                    else {
+                        this.dataset.sortRules.push({
+                            sortField: headerDefine.dimensionKey,
+                            sortType: SortType[order]
+                        });
+                    }
+                }
+                else {
+                    if (sortIndicator) {
+                        this.dataset.sortRules = [
+                            {
+                                sortField: this.dataset.indicatorsAsCol
+                                    ? this.dataset.rows[this.dataset.rows.length - 1]
+                                    : this.dataset.columns[this.dataset.columns.length - 1],
+                                sortType: SortType[order],
+                                sortByIndicator: sortIndicator,
+                                query: dimensions.reduce((arr, dimension) => {
+                                    if (dimension.dimensionKey) {
+                                        arr.push(dimension.value);
+                                    }
+                                    return arr;
+                                }, [])
+                            }
+                        ];
+                    }
+                    else {
+                        this.dataset.sortRules = [
+                            {
+                                sortField: headerDefine.dimensionKey,
+                                sortType: SortType[order]
+                            }
+                        ];
+                    }
+                }
+                this.updateSortRules(this.dataset.sortRules);
             }
         }
         getPivotSortState(col, row) {
@@ -69951,8 +70221,11 @@
             }
             const cellRange = this.getCellRange(col, row);
             for (let i = 0; i < this.pivotSortState.length; i++) {
-                const { col: sortCol, row: sortRow, order } = this.pivotSortState[i];
-                if (cellInRange(cellRange, sortCol, sortRow)) {
+                const pivotState = this.pivotSortState[i];
+                const dimensions = pivotState.dimensions;
+                const cell = this.getCellAddressByHeaderPaths(dimensions);
+                const order = pivotState.order;
+                if (cell && cellInRange(cellRange, cell.col, cell.row)) {
                     return order;
                 }
             }
@@ -70141,7 +70414,7 @@
                 internalProps.layoutMap = new PivotHeaderLayoutMap(this, this.dataset, columnDimensionTree, rowDimensionTree);
                 this.pivotSortState = [];
                 if (options.pivotSortState) {
-                    this.updatePivotSortState(options.pivotSortState);
+                    this.pivotSortState = options.pivotSortState;
                 }
             }
             this.refreshHeader();
@@ -70955,7 +71228,12 @@
             return this.getCellOriginRecord(col, row);
         }
         updateSortRules(sortRules) {
-            this.internalProps.dataConfig.sortRules = sortRules;
+            if (this.internalProps.dataConfig) {
+                this.internalProps.dataConfig.sortRules = sortRules;
+            }
+            else {
+                this.internalProps.dataConfig = { sortRules };
+            }
             this.dataset.updateSortRules(sortRules);
             this.internalProps.layoutMap.resetHeaderTree();
             this.scenegraph.clearCells();
@@ -70963,18 +71241,6 @@
             this.scenegraph.createSceneGraph();
             this.render();
         }
-        updatePivotSortState(pivotSortStateConfig) {
-            for (let i = 0; i < pivotSortStateConfig.length; i++) {
-                const { dimensions, order } = pivotSortStateConfig[i];
-                const cellAddress = this.internalProps.layoutMap.getPivotCellAdress(dimensions);
-                cellAddress &&
-                    this.pivotSortState.push({
-                        col: cellAddress.col,
-                        row: cellAddress.row,
-                        order
-                    });
-            }
-        }
         getPivotSortState(col, row) {
             if (!this.pivotSortState) {
                 return undefined;
@@ -71015,27 +71281,6 @@
             return null;
         }
         toggleHierarchyState(col, row) {
-            const hierarchyState = this.getHierarchyState(col, row);
-            if (hierarchyState === HierarchyState.expand) {
-                this.fireListeners(PIVOT_CHART_EVENT_TYPE.TREE_HIERARCHY_STATE_CHANGE, {
-                    col: col,
-                    row: row,
-                    hierarchyState: HierarchyState.collapse
-                });
-            }
-            else if (hierarchyState === HierarchyState.collapse) {
-                this.fireListeners(PIVOT_CHART_EVENT_TYPE.TREE_HIERARCHY_STATE_CHANGE, {
-                    col: col,
-                    row: row,
-                    hierarchyState: HierarchyState.expand,
-                    originData: this.getCellOriginRecord(col, row)
-                });
-            }
-            const result = this.internalProps.layoutMap.toggleHierarchyState(col, row);
-            this.refreshRowColCount();
-            this.clearCellStyleCache();
-            this.scenegraph.updateHierarchyIcon(col, row);
-            this.scenegraph.updateRow(result.removeCellPositions, result.addCellPositions);
         }
         getHeaderCellAddressByPath(dimensionPaths) {
             const cellAddress = this.internalProps.layoutMap.getPivotCellAdress(dimensionPaths);
@@ -72085,7 +72330,7 @@
     }
 
     registerForVrender();
-    const version = "1.2.1-alpha.1";
+    const version = "1.3.0";
     function getIcons() {
         return get$2();
     }