@visactor/vrender-components 1.0.14-alpha.0 → 1.0.15

package/es/table-series-number/table-series-number.js

@@ -0,0 +1,544 @@
+import { generateColField } from "./tools";
+
+import { merge } from "@visactor/vutils";
+
+import { AbstractComponent } from "../core/base";
+
+import { SeriesNumberCellStateValue, SeriesNumberEvent } from "./type";
+
+import { TableSeriesNumberEventManager } from "./event-manager";
+
+import { parsePadding } from "@visactor/vrender-core";
+
+import { loadTableSeriesNumberComponent } from "./register";
+
+const cornerSvg = '<svg t="1716726614852" class="icon" viewBox="0 0 1194 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2621" width="200" height="200"><path d="M1038.694079 367.237067c13.265507 23.342857-16.633865-40.004445-63.05621-40.004446H219.018794c-26.558738 0-46.46393 13.334815-63.05621 40.004446S0.006238 607.277601 0.006238 650.608819V940.647979a82.351494 82.351494 0 0 0 82.961402 83.349526H1111.702885a82.337632 82.337632 0 0 0 82.975264-83.349526V650.608819c0-43.331218-155.970208-283.371753-155.970208-283.371752zM730.066575 667.284269a136.328386 136.328386 0 0 1-132.738243 133.33429 133.417459 133.417459 0 0 1-132.738243-133.33429v-6.681269a40.6698 40.6698 0 0 0-36.497473-26.66963H73.015044l119.458874-220.02445s23.231965-40.004445 53.103614-40.004446h713.481918c26.544876 0 29.871649 10.008042 46.436207 40.004446L1128.33675 633.947231H769.904682c-26.184476 0-39.838107 7.623855-39.838107 33.337038zM338.505391 210.559919l-89.601086-86.69016a22.178487 22.178487 0 0 1 0-33.26773 21.984425 21.984425 0 0 1 33.170699 0l89.601087 86.676299a22.317102 22.317102 0 0 1 0 33.26773 24.950798 24.950798 0 0 1-33.1707 0z m252.197118-40.059891a25.532983 25.532983 0 0 1-6.639685-16.633865l-3.326773-126.694606A28.263709 28.263709 0 0 1 603.995739 0.515788c13.251646-3.326773 23.204242 10.021904 26.544877 23.342858V153.866163a28.249847 28.249847 0 0 1-23.259688 26.66963c-6.611961-3.312911-13.279369-3.312911-16.578419-10.035765z m235.646421 33.337038a22.372548 22.372548 0 0 1 0-33.337038l86.288175-90.030795a22.039871 22.039871 0 0 1 33.170699 0 22.289379 22.289379 0 0 1 0 33.364761l-82.961401 90.003072a25.962691 25.962691 0 0 1-36.483611 0z" fill="#8a8a8a" p-id="2622"></path></svg>';
+
+loadTableSeriesNumberComponent();
+
+export class TableSeriesNumber extends AbstractComponent {
+    constructor(attributes, options) {
+        if (super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, TableSeriesNumber.defaultAttributes, attributes)), 
+        this.name = "tableSeriesNumber", this._firstRowSeriesNumberIndex = 0, this._firstColSeriesNumberIndex = 0, 
+        this._maxTextWidth = 0, this._changeRowSeriesNumberWidthTimer = null, this.interactionState = {
+            selectIndexs: new Set,
+            _lastHoverItem: null,
+            _lastClickItem: null
+        }, this._parsedRowSeriesNumberCellPadding = [ 0, 0, 0, 0 ], this._parsedColSeriesNumberCellPadding = [ 0, 0, 0, 0 ], 
+        this.initRenderAll = !1, this.initRenderAll = (null == options ? void 0 : options.initRenderAll) || !1, 
+        this._skipRenderAttributes.push("frozenTopRow"), this._skipRenderAttributes.push("frozenLeftCol"), 
+        this._skipRenderAttributes.push("frozenRightCol"), this._skipRenderAttributes.push("frozenBottomRow"), 
+        this._skipRenderAttributes.push("rowCount"), this._skipRenderAttributes.push("colCount"), 
+        this._skipRenderAttributes.push("hover"), this._skipRenderAttributes.push("select"), 
+        this.attribute.rowSeriesNumberCellStyle.text.padding) {
+            const padding = parsePadding(this.attribute.rowSeriesNumberCellStyle.text.padding);
+            this._parsedRowSeriesNumberCellPadding = "number" == typeof padding ? [ padding, padding, padding, padding ] : padding;
+        }
+        if (this.attribute.colSeriesNumberCellStyle.text.padding) {
+            const padding = parsePadding(this.attribute.colSeriesNumberCellStyle.text.padding);
+            this._parsedColSeriesNumberCellPadding = "number" == typeof padding ? [ padding, padding, padding, padding ] : padding;
+        }
+        this._eventManager = new TableSeriesNumberEventManager(this);
+    }
+    get rowSeriesNumberWidth() {
+        const {rowSeriesNumberWidth: rowSeriesNumberWidth} = this.attribute;
+        return this._maxTextWidth ? Math.max(this._maxTextWidth + this._parsedRowSeriesNumberCellPadding[3] + this._parsedRowSeriesNumberCellPadding[1], "number" == typeof rowSeriesNumberWidth ? rowSeriesNumberWidth : 40) : "number" == typeof rowSeriesNumberWidth ? rowSeriesNumberWidth : 40;
+    }
+    get colSeriesNumberHeight() {
+        const {colSeriesNumberHeight: colSeriesNumberHeight} = this.attribute;
+        return "number" == typeof colSeriesNumberHeight ? colSeriesNumberHeight : 20;
+    }
+    get rowCount() {
+        const {rowCount: rowCount} = this.attribute;
+        return rowCount;
+    }
+    get colCount() {
+        const {colCount: colCount} = this.attribute;
+        return colCount;
+    }
+    bindEvents() {
+        this._eventManager.bindEvents();
+    }
+    dispatchTableSeriesNumberEvent(event, ...args) {
+        this._dispatchEvent(event, ...args);
+    }
+    render() {
+        const {rowCount: rowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, innerView = this.createOrUpdateChild("tableSeriesNumberContainer", {
+            x: 0,
+            y: 0,
+            fill: "rgba(1,1,1,0)",
+            width: this.rowSeriesNumberWidth + colCount * ("number" == typeof colWidth ? colWidth : 20),
+            height: this.colSeriesNumberHeight + rowCount * ("number" == typeof rowHeight ? rowHeight : 20),
+            pickable: !1,
+            childrenPickable: !0
+        }, "group");
+        this._tableSeriesNumberContainer = innerView, this._renderContent();
+    }
+    _renderContent() {
+        if (this._renderRowSeriesNumber(), this._renderColSeriesNumber(), this._renderFrozenTopRowSeriesNumber(), 
+        this._renderFrozenLeftColSeriesNumber(), this._renderCorner(), this.initRenderAll) {
+            this.recreateCellsToRowSeriesNumberGroup(0, this.attribute.rowCount - 1), this.recreateCellsToColSeriesNumberGroup(0, this.attribute.colCount - 1);
+            let y = 0;
+            for (let i = 0; i < this.attribute.rowCount; i++) this.setRowSeriesNumberCellAttributes(i, {
+                y: y,
+                height: "number" == typeof this.attribute.rowHeight ? this.attribute.rowHeight : 20
+            }), y += "number" == typeof this.attribute.rowHeight ? this.attribute.rowHeight : 20;
+            let x = 0;
+            for (let i = 0; i < this.attribute.colCount; i++) this.setColSeriesNumberCellAttributes(i, {
+                x: x,
+                width: "number" == typeof this.attribute.colWidth ? this.attribute.colWidth : 20
+            }), x += "number" == typeof this.attribute.colWidth ? this.attribute.colWidth : 20;
+        }
+    }
+    _renderCorner() {
+        const {rowCount: rowCount, colCount: colCount, cornerCellStyle: cornerSeriesNumberCellStyle, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, cornerGroup = this._tableSeriesNumberContainer.createOrUpdateChild("cornerSeriesNumberCell", {
+            x: 0,
+            y: 0,
+            fill: cornerSeriesNumberCellStyle.bgColor,
+            stroke: cornerSeriesNumberCellStyle.borderLine.stroke,
+            lineWidth: cornerSeriesNumberCellStyle.borderLine.lineWidth,
+            pickable: !0,
+            width: this.rowSeriesNumberWidth,
+            height: this.colSeriesNumberHeight
+        }, "group");
+        cornerGroup.id = "0,0", cornerGroup.states = cornerSeriesNumberCellStyle.states, 
+        this._cornerGroup = cornerGroup;
+    }
+    _renderRowSeriesNumber() {
+        const {frozenRowCount: frozenRowCount, rowCount: rowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, rowSeriesNumberGroup = this._tableSeriesNumberContainer.createOrUpdateChild("rowSeriesNumberCellGroup", {
+            x: 0,
+            y: this.colSeriesNumberHeight,
+            pickable: !0,
+            fill: rowSeriesNumberCellStyle.bgColor,
+            width: this.rowSeriesNumberWidth,
+            height: rowCount * ("number" == typeof rowHeight ? rowHeight : 20)
+        }, "group");
+        this._rowSeriesNumberGroup = rowSeriesNumberGroup;
+    }
+    _renderColSeriesNumber() {
+        const {frozenColCount: frozenColCount, rowCount: rowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, colSeriesNumberGroup = this._tableSeriesNumberContainer.createOrUpdateChild("colSeriesNumberCellGroup", {
+            x: this.rowSeriesNumberWidth + frozenColCount * ("number" == typeof colWidth ? colWidth : 20),
+            y: 0,
+            pickable: !0,
+            fill: colSeriesNumberCellStyle.bgColor,
+            width: colCount * ("number" == typeof colWidth ? colWidth : 20),
+            height: this.colSeriesNumberHeight
+        }, "group");
+        this._colSeriesNumberGroup = colSeriesNumberGroup;
+    }
+    _renderFrozenTopRowSeriesNumber() {
+        const {frozenRowCount: frozenRowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, frozenTopSeriesNumberGroup = this._tableSeriesNumberContainer.createOrUpdateChild("frozenTopSeriesNumberGroup", {
+            x: 0,
+            y: this.colSeriesNumberHeight,
+            width: this.rowSeriesNumberWidth,
+            height: frozenRowCount * ("number" == typeof rowHeight ? rowHeight : 20)
+        }, "group");
+        this._frozenTopRowSeriesNumberGroup = frozenTopSeriesNumberGroup;
+    }
+    _renderFrozenLeftColSeriesNumber() {
+        const {frozenColCount: frozenColCount, rowCount: rowCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, frozenLeftSeriesNumberGroup = this._tableSeriesNumberContainer.createOrUpdateChild("frozenLeftSeriesNumberGroup", {
+            x: this.rowSeriesNumberWidth,
+            y: 0,
+            height: this.colSeriesNumberHeight,
+            width: frozenColCount * ("number" == typeof colWidth ? colWidth : 20)
+        }, "group");
+        this._frozenLeftColSeriesNumberGroup = frozenLeftSeriesNumberGroup;
+    }
+    recreateCellsToRowSeriesNumberGroup(startIndex, endIndex) {
+        var _a, _b;
+        const {frozenRowCount: frozenRowCount, rowCount: rowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute;
+        this._frozenTopRowSeriesNumberGroup.removeAllChild(), this._rowSeriesNumberGroup.removeAllChild();
+        let y = 0;
+        const height = ("number" == typeof rowHeight ? rowHeight : 20) - this._parsedRowSeriesNumberCellPadding[0] - this._parsedRowSeriesNumberCellPadding[2];
+        let x;
+        y = "middle" === rowSeriesNumberCellStyle.text.textBaseline ? this._parsedRowSeriesNumberCellPadding[0] + (height - rowSeriesNumberCellStyle.text.fontSize) / 2 : "bottom" === rowSeriesNumberCellStyle.text.textBaseline ? this._parsedRowSeriesNumberCellPadding[0] + height - rowSeriesNumberCellStyle.text.fontSize : this._parsedRowSeriesNumberCellPadding[0];
+        const width = this.rowSeriesNumberWidth - this._parsedRowSeriesNumberCellPadding[3] - this._parsedRowSeriesNumberCellPadding[1], textAlign = this.attribute.rowSeriesNumberCellStyle.text.textAlign, padding = this._parsedRowSeriesNumberCellPadding;
+        x = "center" === textAlign ? padding[3] + +width / 2 : "right" === textAlign ? padding[3] + width : padding[3];
+        for (let i = 0; i < frozenRowCount; i++) {
+            const cellGroup = this._frozenTopRowSeriesNumberGroup.createOrUpdateChild(`rowSeriesNumberCell-${i}`, {
+                x: 0,
+                y: 0,
+                pickable: !0,
+                fill: rowSeriesNumberCellStyle.bgColor,
+                stroke: rowSeriesNumberCellStyle.borderLine.stroke,
+                lineWidth: rowSeriesNumberCellStyle.borderLine.lineWidth,
+                width: this.rowSeriesNumberWidth,
+                height: "number" == typeof rowHeight ? rowHeight : 20
+            }, "group");
+            cellGroup.id = i, cellGroup.states = rowSeriesNumberCellStyle.states, (null === (_a = this.interactionState.selectIndexs) || void 0 === _a ? void 0 : _a.has(cellGroup.name)) && cellGroup.useStates([ SeriesNumberCellStateValue.select ]);
+            cellGroup.createOrUpdateChild(`rowSeriesNumberCellText-${i}`, Object.assign(Object.assign({
+                x: x,
+                y: y,
+                text: `${i + 1}`,
+                pickable: !1,
+                dx: 0
+            }, rowSeriesNumberCellStyle.text), {
+                textBaseline: "top"
+            }), "text");
+        }
+        this._firstRowSeriesNumberIndex = Math.max(startIndex, frozenRowCount) - frozenRowCount;
+        let thisTextMaxWidth = 0;
+        for (let i = this._firstRowSeriesNumberIndex; i <= endIndex - frozenRowCount; i++) {
+            const cellGroup = this._rowSeriesNumberGroup.createOrUpdateChild(`rowSeriesNumberCell-${i + frozenRowCount}`, {
+                x: 0,
+                y: 0,
+                pickable: !0,
+                fill: rowSeriesNumberCellStyle.bgColor,
+                stroke: rowSeriesNumberCellStyle.borderLine.stroke,
+                lineWidth: rowSeriesNumberCellStyle.borderLine.lineWidth,
+                width: this.rowSeriesNumberWidth,
+                height: "number" == typeof rowHeight ? rowHeight : 20
+            }, "group");
+            cellGroup.id = i + frozenRowCount, cellGroup.states = rowSeriesNumberCellStyle.states, 
+            (null === (_b = this.interactionState.selectIndexs) || void 0 === _b ? void 0 : _b.has(cellGroup.name)) && cellGroup.useStates([ SeriesNumberCellStateValue.select ]);
+            const text = cellGroup.createOrUpdateChild(`rowSeriesNumberCellText-${i + frozenRowCount}`, Object.assign(Object.assign({
+                x: x,
+                y: y,
+                text: `${i + 1 + frozenRowCount}`,
+                pickable: !1,
+                dx: 0
+            }, rowSeriesNumberCellStyle.text), {
+                textBaseline: "top"
+            }), "text");
+            i === endIndex - frozenRowCount && (thisTextMaxWidth = text.clipedWidth);
+        }
+        clearTimeout(this._changeRowSeriesNumberWidthTimer), this._changeRowSeriesNumberWidthTimer = setTimeout((() => {
+            if (Math.abs(thisTextMaxWidth - this._maxTextWidth) >= 6) {
+                const oldWidth = this._maxTextWidth;
+                this._maxTextWidth = thisTextMaxWidth, this.changeRowSeriesNumberWidth(Math.max(this.rowSeriesNumberWidth, 20)), 
+                this._dispatchEvent(SeriesNumberEvent.rowSeriesNumberWidthChange, {
+                    newWidth: this.rowSeriesNumberWidth,
+                    oldWidth: oldWidth
+                });
+            }
+        }), 100);
+    }
+    recreateCellsToColSeriesNumberGroup(startIndex, endIndex) {
+        var _a, _b, _c, _d;
+        const {colCount: colCount, colSeriesNumberCellStyle: colSeriesNumberCellStyle, frozenColCount: frozenColCount, colWidth: colWidth} = this.attribute, oldFrozenLeftColSeriesNumberGroupCellsWidth = new Map;
+        null === (_b = null === (_a = this._frozenLeftColSeriesNumberGroup) || void 0 === _a ? void 0 : _a.forEachChildren) || void 0 === _b || _b.call(_a, ((child, index) => {
+            oldFrozenLeftColSeriesNumberGroupCellsWidth.set(index, child.getAttributes().width);
+        })), this._frozenLeftColSeriesNumberGroup.removeAllChild(), this._colSeriesNumberGroup.removeAllChild();
+        let y = 0;
+        const height = this.colSeriesNumberHeight - this._parsedColSeriesNumberCellPadding[0] - this._parsedColSeriesNumberCellPadding[2];
+        let x;
+        y = "middle" === colSeriesNumberCellStyle.text.textBaseline ? this._parsedColSeriesNumberCellPadding[0] + (height - colSeriesNumberCellStyle.text.fontSize) / 2 : "bottom" === colSeriesNumberCellStyle.text.textBaseline ? this._parsedColSeriesNumberCellPadding[0] + height - colSeriesNumberCellStyle.text.fontSize : this._parsedColSeriesNumberCellPadding[0];
+        const width = ("number" == typeof colWidth ? colWidth : 20) - this._parsedColSeriesNumberCellPadding[3] - this._parsedColSeriesNumberCellPadding[1], textAlign = this.attribute.colSeriesNumberCellStyle.text.textAlign, padding = this._parsedColSeriesNumberCellPadding;
+        x = "center" === textAlign ? padding[3] + +width / 2 : "right" === textAlign ? padding[3] + width : padding[3];
+        for (let i = 0; i < frozenColCount; i++) {
+            const cellGroup = this._frozenLeftColSeriesNumberGroup.createOrUpdateChild(`colSeriesNumberCell-${i}`, {
+                x: 0,
+                y: 0,
+                pickable: !0,
+                fill: colSeriesNumberCellStyle.bgColor,
+                stroke: colSeriesNumberCellStyle.borderLine.stroke,
+                lineWidth: colSeriesNumberCellStyle.borderLine.lineWidth,
+                width: oldFrozenLeftColSeriesNumberGroupCellsWidth.get(i) || ("number" == typeof colWidth ? colWidth : 20),
+                height: this.colSeriesNumberHeight
+            }, "group");
+            cellGroup.id = i, cellGroup.states = colSeriesNumberCellStyle.states, (null === (_c = this.interactionState.selectIndexs) || void 0 === _c ? void 0 : _c.has(cellGroup.name)) && cellGroup.useStates([ SeriesNumberCellStateValue.select ]);
+            cellGroup.createOrUpdateChild(`colSeriesNumberCellText-${i}`, Object.assign(Object.assign({
+                x: x,
+                y: y,
+                dx: 0,
+                text: generateColField(i),
+                pickable: !1
+            }, colSeriesNumberCellStyle.text), {
+                textBaseline: "top"
+            }), "text");
+        }
+        this._firstColSeriesNumberIndex = Math.max(startIndex, frozenColCount) - frozenColCount;
+        for (let i = this._firstColSeriesNumberIndex; i <= endIndex - frozenColCount; i++) {
+            const cellGroup = this._colSeriesNumberGroup.createOrUpdateChild(`colSeriesNumberCell-${i + frozenColCount}`, {
+                x: 0,
+                y: 0,
+                pickable: !0,
+                fill: colSeriesNumberCellStyle.bgColor,
+                stroke: colSeriesNumberCellStyle.borderLine.stroke,
+                lineWidth: colSeriesNumberCellStyle.borderLine.lineWidth,
+                width: "number" == typeof colWidth ? colWidth : 20,
+                height: this.colSeriesNumberHeight
+            }, "group");
+            cellGroup.id = i + frozenColCount, cellGroup.states = colSeriesNumberCellStyle.states, 
+            (null === (_d = this.interactionState.selectIndexs) || void 0 === _d ? void 0 : _d.has(cellGroup.name)) && cellGroup.useStates([ SeriesNumberCellStateValue.select ]);
+            cellGroup.createOrUpdateChild(`colSeriesNumberCellText-${i + frozenColCount}`, Object.assign(Object.assign({
+                x: x,
+                y: y,
+                dx: 0,
+                text: generateColField(i + frozenColCount),
+                pickable: !1
+            }, colSeriesNumberCellStyle.text), {
+                textBaseline: "top"
+            }), "text");
+        }
+    }
+    changeRowSeriesNumberWidth(newWidth) {
+        const {rowHeight: rowHeight, rowCount: oldRowCount, frozenRowCount: frozenRowCount, frozenColCount: frozenLeftCol, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle} = this.attribute;
+        this._cornerGroup.setAttributes({
+            width: newWidth
+        }), this._frozenTopRowSeriesNumberGroup.setAttributes({
+            width: newWidth
+        });
+        for (let i = 0; i < this._frozenTopRowSeriesNumberGroup.children.length; i++) this.setRowSeriesNumberCellAttributes(i, {
+            width: newWidth
+        });
+        this._rowSeriesNumberGroup.setAttributes({
+            width: newWidth
+        });
+        for (let i = 0; i < this._rowSeriesNumberGroup.children.length; i++) this.setRowSeriesNumberCellAttributes(i + this._firstRowSeriesNumberIndex + frozenRowCount, {
+            width: newWidth
+        });
+        this._frozenLeftColSeriesNumberGroup.setAttributes({
+            x: newWidth
+        }), this._colSeriesNumberGroup.setAttributes({
+            x: newWidth + this._frozenLeftColSeriesNumberGroup.getAttributes().width
+        });
+    }
+    getRowSeriesNumberCellGroup(index) {
+        const {frozenRowCount: frozenRowCount} = this.getAttributes();
+        if (index >= 0 && index < frozenRowCount) return this._frozenTopRowSeriesNumberGroup.children[index];
+        return this._rowSeriesNumberGroup.children[index - frozenRowCount - this._firstRowSeriesNumberIndex];
+    }
+    getColSeriesNumberCellGroup(index) {
+        const {frozenColCount: frozenColCount} = this.getAttributes();
+        if (index >= 0 && index < frozenColCount) return this._frozenLeftColSeriesNumberGroup.children[index];
+        return this._colSeriesNumberGroup.children[index - frozenColCount - this._firstColSeriesNumberIndex];
+    }
+    getRowSeriesNumberCellAttributes(index) {
+        const {frozenRowCount: frozenRowCount} = this.getAttributes();
+        if (index >= 0 && index < frozenRowCount) return this._frozenTopRowSeriesNumberGroup.children[index].attribute;
+        return this._rowSeriesNumberGroup.children[index - frozenRowCount - this._firstRowSeriesNumberIndex].attribute;
+    }
+    getColSeriesNumberCellAttributes(index) {
+        const {frozenColCount: frozenColCount} = this.getAttributes();
+        if (index >= 0 && index < frozenColCount) return this._frozenLeftColSeriesNumberGroup.children[index].attribute;
+        return this._colSeriesNumberGroup.children[index - frozenColCount - this._firstColSeriesNumberIndex].attribute;
+    }
+    setRowSeriesNumberCellAttributes(index, attributes) {
+        const {frozenRowCount: frozenRowCount} = this.getAttributes();
+        let targetCellGroup;
+        if (index >= 0 && index < frozenRowCount) {
+            const {height: oldHeight, width: oldWidth, y: y} = this._frozenTopRowSeriesNumberGroup.getAttributes();
+            targetCellGroup = this._frozenTopRowSeriesNumberGroup.children[index], targetCellGroup.setAttributes(attributes), 
+            attributes.height && this._frozenTopRowSeriesNumberGroup.setAttributes({
+                height: this._frozenTopRowSeriesNumberGroup.getAttributes().height + (attributes.height - oldHeight)
+            }), attributes.width && this._frozenTopRowSeriesNumberGroup.setAttributes({
+                width: this._frozenTopRowSeriesNumberGroup.getAttributes().width + (attributes.width - oldWidth)
+            }), attributes.height && this._rowSeriesNumberGroup.setAttributes({
+                y: this._frozenTopRowSeriesNumberGroup.getAttributes().height + this._frozenTopRowSeriesNumberGroup.getAttributes().y
+            });
+        } else {
+            targetCellGroup = this._rowSeriesNumberGroup.children[index - frozenRowCount - this._firstRowSeriesNumberIndex], 
+            targetCellGroup.setAttributes(attributes);
+        }
+        if (attributes.width) {
+            let x;
+            const width = attributes.width - this._parsedRowSeriesNumberCellPadding[3] - this._parsedRowSeriesNumberCellPadding[1], textAlign = this.attribute.rowSeriesNumberCellStyle.text.textAlign, padding = this._parsedRowSeriesNumberCellPadding;
+            x = "center" === textAlign ? padding[3] + +width / 2 : "right" === textAlign ? padding[3] + width : padding[3], 
+            targetCellGroup.children[0].setAttributes({
+                x: x
+            });
+        }
+        if (attributes.height) {
+            const height = attributes.height - this._parsedRowSeriesNumberCellPadding[0] - this._parsedRowSeriesNumberCellPadding[2], textBaseline = this.attribute.rowSeriesNumberCellStyle.text.textBaseline, padding = this._parsedRowSeriesNumberCellPadding;
+            let y;
+            y = "middle" === textBaseline ? padding[0] + (height - this.attribute.rowSeriesNumberCellStyle.text.fontSize) / 2 : "bottom" === textBaseline ? padding[0] + height - this.attribute.rowSeriesNumberCellStyle.text.fontSize : padding[0], 
+            targetCellGroup.children[0].setAttributes({
+                y: y
+            });
+        }
+    }
+    setColSeriesNumberCellAttributes(index, attributes) {
+        const {frozenColCount: frozenColCount} = this.getAttributes();
+        let targetCellGroup;
+        if (index >= 0 && index < frozenColCount) {
+            targetCellGroup = this._frozenLeftColSeriesNumberGroup.children[index];
+            const {height: oldHeight, width: oldWidth} = targetCellGroup.getAttributes();
+            targetCellGroup.setAttributes(attributes), attributes.height && this._frozenLeftColSeriesNumberGroup.setAttributes({
+                height: this._frozenLeftColSeriesNumberGroup.getAttributes().height + (attributes.height - oldHeight)
+            }), attributes.width && this._frozenLeftColSeriesNumberGroup.setAttributes({
+                width: this._frozenLeftColSeriesNumberGroup.getAttributes().width + (attributes.width - oldWidth)
+            }), attributes.width && this._colSeriesNumberGroup.setAttributes({
+                x: this._frozenLeftColSeriesNumberGroup.getAttributes().width + this._frozenLeftColSeriesNumberGroup.getAttributes().x
+            });
+        } else {
+            targetCellGroup = this._colSeriesNumberGroup.children[index - frozenColCount - this._firstColSeriesNumberIndex], 
+            targetCellGroup.setAttributes(attributes);
+        }
+        if (attributes.width) {
+            let x;
+            const width = attributes.width - this._parsedColSeriesNumberCellPadding[3] - this._parsedColSeriesNumberCellPadding[1], textAlign = this.attribute.colSeriesNumberCellStyle.text.textAlign, padding = this._parsedColSeriesNumberCellPadding;
+            x = "center" === textAlign ? padding[3] + +width / 2 : "right" === textAlign ? padding[3] + width : padding[3], 
+            targetCellGroup.children[0].setAttributes({
+                x: x
+            });
+        }
+        if (attributes.height) {
+            const height = attributes.height - this._parsedColSeriesNumberCellPadding[0] - this._parsedColSeriesNumberCellPadding[2], textBaseline = this.attribute.colSeriesNumberCellStyle.text.textBaseline, padding = this._parsedColSeriesNumberCellPadding;
+            let y;
+            y = "middle" === textBaseline ? padding[0] + (height - this.attribute.colSeriesNumberCellStyle.text.fontSize) / 2 : "bottom" === textBaseline ? padding[0] + height - this.attribute.colSeriesNumberCellStyle.text.fontSize : padding[0], 
+            targetCellGroup.children[0].setAttributes({
+                y: y
+            });
+        }
+    }
+    setRowSeriesNumberGroupAttributes(attributes) {
+        this._rowSeriesNumberGroup.setAttributes(attributes);
+    }
+    setColSeriesNumberGroupAttributes(attributes) {
+        this._colSeriesNumberGroup.setAttributes(attributes);
+    }
+    addSelectedIndex(isRow, index) {
+        let name;
+        name = isRow ? `rowSeriesNumberCell-${index}` : `colSeriesNumberCell-${index}`, 
+        this.interactionState.selectIndexs.add(name);
+    }
+    addRowSelectedRanges(ranges) {
+        performance.now();
+        for (let i = 0; i < ranges.length; i++) {
+            const {startIndex: startIndex, endIndex: endIndex} = ranges[i];
+            for (let j = startIndex; j <= endIndex; j++) {
+                const name = `rowSeriesNumberCell-${j}`;
+                this.interactionState.selectIndexs.add(name);
+            }
+        }
+        performance.now();
+    }
+    addColSelectedRanges(ranges) {
+        for (let i = 0; i < ranges.length; i++) {
+            const {startIndex: startIndex, endIndex: endIndex} = ranges[i];
+            for (let j = startIndex; j <= endIndex; j++) {
+                const name = `colSeriesNumberCell-${j}`;
+                this.interactionState.selectIndexs.add(name);
+            }
+        }
+    }
+    addCornderSelected() {
+        this.interactionState.selectIndexs.add(this._cornerGroup.name);
+    }
+    resetAllSelectedIndexs({rowIndexs: rowIndexs, colIndexs: colIndexs}) {
+        if (this.interactionState.selectIndexs = new Set, rowIndexs) for (let i = 0; i < rowIndexs.length; i++) {
+            const name = `rowSeriesNumberCell-${rowIndexs[i]}`;
+            this.interactionState.selectIndexs.add(name);
+        }
+        if (colIndexs) for (let i = 0; i < colIndexs.length; i++) {
+            const name = `colSeriesNumberCell-${colIndexs[i]}`;
+            this.interactionState.selectIndexs.add(name);
+        }
+    }
+    removeSelectedIndex(isRow, index) {
+        let name;
+        name = isRow ? `rowSeriesNumberLeftCell-${index}` : `colSeriesNumberCell-${index}`, 
+        this.interactionState.selectIndexs.delete(name);
+    }
+    removeAllSelectedIndexs() {
+        var _a, _b;
+        for (const name of this.interactionState.selectIndexs) {
+            const isRow = name.startsWith("row"), isCol = name.startsWith("col"), index = Number(name.split("-")[1]);
+            isRow ? null === (_a = this.getRowSeriesNumberCellGroup(index)) || void 0 === _a || _a.removeState(SeriesNumberCellStateValue.select) : isCol ? null === (_b = this.getColSeriesNumberCellGroup(index)) || void 0 === _b || _b.removeState(SeriesNumberCellStateValue.select) : this._cornerGroup.removeState(SeriesNumberCellStateValue.select);
+        }
+        this.interactionState.selectIndexs.clear();
+    }
+    removeOneGroupSelected(group) {
+        this.interactionState.selectIndexs.delete(group.name), group.removeState(SeriesNumberCellStateValue.select);
+    }
+    addOneGroupSelected(group) {
+        this.interactionState.selectIndexs.add(group.name), group.useStates([ SeriesNumberCellStateValue.select ]);
+    }
+    renderSelectedIndexsState() {
+        var _a, _b;
+        const {rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle} = this.attribute;
+        for (const name of this.interactionState.selectIndexs) {
+            const isRow = name.startsWith("row"), isCol = name.startsWith("col"), index = Number(name.split("-")[1]);
+            isRow ? null === (_a = this.getRowSeriesNumberCellGroup(index)) || void 0 === _a || _a.useStates([ SeriesNumberCellStateValue.select ]) : isCol ? null === (_b = this.getColSeriesNumberCellGroup(index)) || void 0 === _b || _b.useStates([ SeriesNumberCellStateValue.select ]) : this._cornerGroup.useStates([ SeriesNumberCellStateValue.select ]);
+        }
+        this.stage.render();
+    }
+}
+
+TableSeriesNumber.defaultAttributes = {
+    frozenRowCount: 0,
+    frozenColCount: 0,
+    rightFrozenColCount: 0,
+    bottomFrozenRowCount: 0,
+    pickable: !1,
+    rowCount: 100,
+    colCount: 100,
+    rowHeight: 20,
+    colWidth: 50,
+    rowSeriesNumberWidth: 30,
+    colSeriesNumberHeight: 30,
+    rowSeriesNumberCellStyle: {
+        text: {
+            fontSize: 14,
+            fill: "#7A7A7A",
+            pickable: !1,
+            textAlign: "left",
+            textBaseline: "middle",
+            padding: [ 2, 4, 2, 4 ]
+        },
+        borderLine: {
+            stroke: "#D9D9D9",
+            lineWidth: 1,
+            pickable: !1
+        },
+        bgColor: "#F9F9F9",
+        states: {
+            hover: {
+                fill: "#98C8A5",
+                opacity: .7
+            },
+            select: {
+                fill: "yellow",
+                opacity: .7
+            }
+        }
+    },
+    colSeriesNumberCellStyle: {
+        text: {
+            fontSize: 14,
+            fill: "#7A7A7A",
+            pickable: !1,
+            textAlign: "left",
+            textBaseline: "middle",
+            padding: [ 2, 4, 2, 4 ]
+        },
+        borderLine: {
+            stroke: "#D9D9D9",
+            lineWidth: 1,
+            pickable: !1
+        },
+        bgColor: "#F9F9F9",
+        states: {
+            hover: {
+                fill: "#98C8A5",
+                opacity: .7
+            },
+            select: {
+                fill: "orange",
+                opacity: .7
+            }
+        }
+    },
+    cornerCellStyle: {
+        borderLine: {
+            stroke: "#D9D9D9",
+            lineWidth: 1,
+            pickable: !1
+        },
+        bgColor: "#F9F9F9",
+        states: {
+            hover: {
+                fill: "#98C8A5",
+                opacity: .7
+            },
+            select: {
+                fill: "#98C8A5",
+                opacity: .7
+            }
+        }
+    },
+    hover: !0,
+    select: !0
+};
+//# sourceMappingURL=table-series-number.js.map