@visactor/vtable 1.19.9-alpha.3 → 1.20.0-alpha.0

package/cjs/core/BaseTable.d.ts

@@ -55,6 +55,8 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     customRender?: ICustomRender;
     canvasWidth?: number;
     canvasHeight?: number;
+    contentOffsetX?: number;
+    contentOffsetY?: number;
     _vDataSet?: DataSet;
     scenegraph: Scenegraph;
     stateManager: StateManager;
@@ -91,6 +93,7 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     getElement(): HTMLElement;
     get canvas(): HTMLCanvasElement;
     setCanvasSize(canvasWidth: number, canvasHeight: number): void;
+    setContentInsetXY(contentOffsetX: number, contentOffsetY: number): void;
     resize(): void;
     get rowCount(): number;
     set rowCount(rowCount: number);
@@ -256,7 +259,10 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     private dispose;
     release(): void;
     fireListeners<TYPE extends keyof TableEventHandlersEventArgumentMap>(type: TYPE, event: TableEventHandlersEventArgumentMap[TYPE]): TableEventHandlersReturnMap[TYPE][];
-    updateOption(options: BaseTableConstructorOptions): void;
+    updateOption(options: BaseTableConstructorOptions, updateConfig?: {
+        clearColWidthCache?: boolean;
+        clearRowHeightCache?: boolean;
+    }): void;
     renderWithRecreateCells(): void;
     getFrozenRowsHeight(): number;
     getFrozenColsWidth(): number;
@@ -276,6 +282,13 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     clearSelected(): void;
     selectCell(col: number, row: number, isShift?: boolean, isCtrl?: boolean, makeSelectCellVisible?: boolean, skipBodyMerge?: boolean): void;
     selectCells(cellRanges: CellRange[]): void;
+    selectRow(rowIndex: number, isCtrl?: boolean, isShift?: boolean): void;
+    selectCol(colIndex: number, isCtrl?: boolean, isShift?: boolean): void;
+    startDragSelectCol(colIndex: number, isCtrl?: boolean, isShift?: boolean): void;
+    dragSelectCol(colIndex: number, isCtrl?: boolean): void;
+    endDragSelect(): void;
+    startDragSelectRow(rowIndex: number, isCtrl?: boolean, isShift?: boolean): void;
+    dragSelectRow(rowIndex: number, isCtrl?: boolean): void;
     abstract isListTable(): boolean;
     abstract isPivotTable(): boolean;
     abstract isPivotChart(): boolean;

package/cjs/core/BaseTable.js

@@ -43,7 +43,7 @@ class BaseTable extends EventTarget_1.EventTarget {
     }
     constructor(container, options = {}) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
-        if (super(), this.showFrozenIcon = !0, this.version = "1.19.9-alpha.3", this.id = `VTable${Date.now()}`, 
+        if (super(), this.showFrozenIcon = !0, this.version = "1.20.0-alpha.0", this.id = `VTable${Date.now()}`, 
         this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = (0, util_1.throttle2)(this.render.bind(this), 200), 
         "node" === env_1.Env.mode ? (options = container, container = null) : container instanceof HTMLElement || (options = container, 
         container = container.container ? container.container : null), !container && "node" !== options.mode && !options.canvas) throw new Error("vtable's container is undefined");
@@ -55,7 +55,7 @@ class BaseTable extends EventTarget_1.EventTarget {
         const {frozenColCount: frozenColCount = 0, unfreezeAllOnExceedsMaxWidth: unfreezeAllOnExceedsMaxWidth, frozenRowCount: frozenRowCount, defaultRowHeight: defaultRowHeight = 40, defaultHeaderRowHeight: defaultHeaderRowHeight, defaultColWidth: defaultColWidth = 80, defaultHeaderColWidth: defaultHeaderColWidth, widthMode: widthMode = "standard", heightMode: heightMode = "standard", autoFillWidth: autoFillWidth = !1, autoFillHeight: autoFillHeight = !1, containerFit: containerFit = {
             width: !1,
             height: !1
-        }, widthAdaptiveMode: widthAdaptiveMode = "only-body", heightAdaptiveMode: heightAdaptiveMode = "only-body", keyboardOptions: keyboardOptions, eventOptions: eventOptions, rowSeriesNumber: rowSeriesNumber, enableCheckboxCascade: enableCheckboxCascade, enableHeaderCheckboxCascade: enableHeaderCheckboxCascade, columnResizeMode: columnResizeMode, rowResizeMode: rowResizeMode = "none", resize: resize, dragHeaderMode: dragHeaderMode, dragOrder: dragOrder, showFrozenIcon: showFrozenIcon, allowFrozenColCount: allowFrozenColCount, padding: padding, hover: hover, menu: menu, select: click, customRender: customRender, pixelRatio: pixelRatio = pixel_ratio_1.defaultPixelRatio, renderChartAsync: renderChartAsync, renderChartAsyncBatchCount: renderChartAsyncBatchCount, mode: mode, modeParams: modeParams, canvasWidth: canvasWidth, canvasHeight: canvasHeight, overscrollBehavior: overscrollBehavior, limitMinWidth: limitMinWidth, limitMinHeight: limitMinHeight, clearDOM: clearDOM = !0} = options, {groupConfig: groupConfig, groupBy: groupBy, groupTitleFieldFormat: groupTitleFieldFormat, groupTitleCustomLayout: groupTitleCustomLayout, enableTreeStickCell: enableTreeStickCell} = options;
+        }, widthAdaptiveMode: widthAdaptiveMode = "only-body", heightAdaptiveMode: heightAdaptiveMode = "only-body", keyboardOptions: keyboardOptions, eventOptions: eventOptions, rowSeriesNumber: rowSeriesNumber, enableCheckboxCascade: enableCheckboxCascade, enableHeaderCheckboxCascade: enableHeaderCheckboxCascade, columnResizeMode: columnResizeMode, rowResizeMode: rowResizeMode = "none", resize: resize, dragHeaderMode: dragHeaderMode, dragOrder: dragOrder, showFrozenIcon: showFrozenIcon, allowFrozenColCount: allowFrozenColCount, padding: padding, hover: hover, menu: menu, select: click, customRender: customRender, pixelRatio: pixelRatio = pixel_ratio_1.defaultPixelRatio, renderChartAsync: renderChartAsync, renderChartAsyncBatchCount: renderChartAsyncBatchCount, mode: mode, modeParams: modeParams, canvasWidth: canvasWidth, canvasHeight: canvasHeight, contentOffsetX: translateX, contentOffsetY: translateY, overscrollBehavior: overscrollBehavior, limitMinWidth: limitMinWidth, limitMinHeight: limitMinHeight, clearDOM: clearDOM = !0} = options, {groupConfig: groupConfig, groupBy: groupBy, groupTitleFieldFormat: groupTitleFieldFormat, groupTitleCustomLayout: groupTitleCustomLayout, enableTreeStickCell: enableTreeStickCell} = options;
         this.container = container, this.options = options, this._widthMode = widthMode, 
         this._heightMode = heightMode, this._widthAdaptiveMode = widthAdaptiveMode, this._heightAdaptiveMode = heightAdaptiveMode, 
         this._autoFillWidth = autoFillWidth, this._autoFillHeight = autoFillHeight, void 0 !== containerFit && (this._containerFit = "boolean" == typeof containerFit ? {
@@ -77,9 +77,10 @@ class BaseTable extends EventTarget_1.EventTarget {
         padding.bottom && (this.padding.bottom = padding.bottom), padding.left && (this.padding.left = padding.left), 
         padding.right && (this.padding.right = padding.right))), ((0, vutils_1.isValid)(canvasHeight) || (0, 
         vutils_1.isValid)(canvasWidth)) && (this.canvasSizeSeted = !0), this.tableNoFrameWidth = 0, 
-        this.tableNoFrameHeight = 0, this.canvasWidth = (0, vutils_1.isNumber)(canvasWidth) ? canvasWidth : void 0, 
-        this.canvasHeight = (0, vutils_1.isNumber)(canvasHeight) ? canvasHeight : void 0, 
-        this.columnWidthComputeMode = null !== (_d = options.columnWidthComputeMode) && void 0 !== _d ? _d : "normal";
+        this.tableNoFrameHeight = 0, this.contentOffsetX = null != translateX ? translateX : 0, 
+        this.contentOffsetY = null != translateY ? translateY : 0, this.canvasWidth = (0, 
+        vutils_1.isNumber)(canvasWidth) ? canvasWidth : void 0, this.canvasHeight = (0, 
+        vutils_1.isNumber)(canvasHeight) ? canvasHeight : void 0, this.columnWidthComputeMode = null !== (_d = options.columnWidthComputeMode) && void 0 !== _d ? _d : "normal";
         const internalProps = this.internalProps = {};
         void 0 !== showFrozenIcon && (this.showFrozenIcon = showFrozenIcon), "number" == typeof allowFrozenColCount && allowFrozenColCount <= 0 && (this.showFrozenIcon = !1), 
         this.options.canvas ? ("node" !== env_1.Env.mode && (internalProps.element = this.options.canvas.parentElement, 
@@ -210,6 +211,10 @@ class BaseTable extends EventTarget_1.EventTarget {
         this.canvasWidth = canvasWidth, this.canvasHeight = canvasHeight, this.options.canvasHeight = canvasHeight, 
         this.options.canvasWidth = canvasWidth, this.resize();
     }
+    setContentInsetXY(contentOffsetX, contentOffsetY) {
+        this.contentOffsetX = contentOffsetX, this.contentOffsetY = contentOffsetY, this.options.contentOffsetX = contentOffsetX, 
+        this.options.contentOffsetY = contentOffsetY, this.resize();
+    }
     resize() {
         var _a;
         this._updateSize(), null === (_a = this.internalProps.legends) || void 0 === _a || _a.forEach((legend => {
@@ -265,7 +270,8 @@ class BaseTable extends EventTarget_1.EventTarget {
         return null !== (_e = null !== (_c = null === (_b = null === (_a = this.internalProps) || void 0 === _a ? void 0 : _a.layoutMap) || void 0 === _b ? void 0 : _b.frozenRowCount) && void 0 !== _c ? _c : null === (_d = this.internalProps) || void 0 === _d ? void 0 : _d.frozenRowCount) && void 0 !== _e ? _e : 0;
     }
     set frozenRowCount(frozenRowCount) {
-        this.internalProps.frozenRowCount = frozenRowCount, this.stateManager.setFrozenRow(this.internalProps.frozenRowCount);
+        this.internalProps.frozenRowCount = frozenRowCount, this.options.frozenRowCount = frozenRowCount, 
+        this.stateManager.setFrozenRow(this.internalProps.frozenRowCount);
     }
     get rightFrozenColCount() {
         var _a, _b, _c, _d, _e;
@@ -439,7 +445,7 @@ class BaseTable extends EventTarget_1.EventTarget {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
         const {padding: padding} = this;
         let widthP = 0, heightP = 0;
-        if (this.tableX = 0, this.tableY = 0, this.options.canvas && this.options.viewBox) widthP = this.options.viewBox.x2 - this.options.viewBox.x1, 
+        if (this.tableX = this.contentOffsetX, this.tableY = this.contentOffsetY, this.options.canvas && this.options.viewBox) widthP = this.options.viewBox.x2 - this.options.viewBox.x1, 
         heightP = this.options.viewBox.y2 - this.options.viewBox.y1, (null === (_a = null == this ? void 0 : this.scenegraph) || void 0 === _a ? void 0 : _a.stage) && (this.options.viewBox ? this.scenegraph.stage.setViewBox(this.options.viewBox, !1) : this.scenegraph.stage.resize(widthP, heightP)); else if ("browser" === env_1.Env.mode) {
             const element = this.getElement();
             let widthWithoutPadding = 0, heightWithoutPadding = 0;
@@ -470,15 +476,15 @@ class BaseTable extends EventTarget_1.EventTarget {
         const width = Math.floor(widthP - vScrollBarWidth), height = Math.floor(heightP - hScrollBarWidth);
         if (null === (_l = this.internalProps.theme) || void 0 === _l ? void 0 : _l.frameStyle) {
             const lineWidths = toBoxArray(null !== (_o = null === (_m = this.internalProps.theme.frameStyle) || void 0 === _m ? void 0 : _m.borderLineWidth) && void 0 !== _o ? _o : [ null ]), shadowWidths = toBoxArray(null !== (_q = null === (_p = this.internalProps.theme.frameStyle) || void 0 === _p ? void 0 : _p.shadowBlur) && void 0 !== _q ? _q : [ 0 ]);
-            if (null === (_r = this.theme.frameStyle) || void 0 === _r ? void 0 : _r.innerBorder) this.tableX = 0, 
-            this.tableY = 0, this.tableNoFrameWidth = width - (null !== (_s = shadowWidths[1]) && void 0 !== _s ? _s : 0), 
-            this.tableNoFrameHeight = height - (null !== (_t = shadowWidths[2]) && void 0 !== _t ? _t : 0); else {
-                this.tableX = (null !== (_u = lineWidths[3]) && void 0 !== _u ? _u : 0) + (null !== (_v = shadowWidths[3]) && void 0 !== _v ? _v : 0), 
-                this.tableY = (null !== (_w = lineWidths[0]) && void 0 !== _w ? _w : 0) + (null !== (_x = shadowWidths[0]) && void 0 !== _x ? _x : 0);
+            if (null === (_r = this.theme.frameStyle) || void 0 === _r ? void 0 : _r.innerBorder) this.tableX += this.contentOffsetX, 
+            this.tableY += this.contentOffsetY, this.tableNoFrameWidth = width - (null !== (_s = shadowWidths[1]) && void 0 !== _s ? _s : 0) - this.contentOffsetX, 
+            this.tableNoFrameHeight = height - (null !== (_t = shadowWidths[2]) && void 0 !== _t ? _t : 0) - this.contentOffsetY; else {
+                this.tableX += (null !== (_u = lineWidths[3]) && void 0 !== _u ? _u : 0) + (null !== (_v = shadowWidths[3]) && void 0 !== _v ? _v : 0), 
+                this.tableY += (null !== (_w = lineWidths[0]) && void 0 !== _w ? _w : 0) + (null !== (_x = shadowWidths[0]) && void 0 !== _x ? _x : 0);
                 const rightBorder = (null !== (_y = lineWidths[1]) && void 0 !== _y ? _y : 0) + (null !== (_z = shadowWidths[1]) && void 0 !== _z ? _z : 0);
-                this.tableNoFrameWidth = width - (rightBorder > vScrollBarWidth ? rightBorder - vScrollBarWidth : 0) - ((null !== (_0 = lineWidths[3]) && void 0 !== _0 ? _0 : 0) + (null !== (_1 = shadowWidths[3]) && void 0 !== _1 ? _1 : 0));
+                this.tableNoFrameWidth = width - (rightBorder > vScrollBarWidth ? rightBorder - vScrollBarWidth : 0) - ((null !== (_0 = lineWidths[3]) && void 0 !== _0 ? _0 : 0) + (null !== (_1 = shadowWidths[3]) && void 0 !== _1 ? _1 : 0)) - this.contentOffsetX;
                 const bottomBorder = (null !== (_2 = lineWidths[2]) && void 0 !== _2 ? _2 : 0) + (null !== (_3 = shadowWidths[2]) && void 0 !== _3 ? _3 : 0);
-                this.tableNoFrameHeight = height - (bottomBorder > hScrollBarWidth ? bottomBorder - hScrollBarWidth : 0) - ((null !== (_4 = lineWidths[0]) && void 0 !== _4 ? _4 : 0) + (null !== (_5 = shadowWidths[0]) && void 0 !== _5 ? _5 : 0));
+                this.tableNoFrameHeight = height - (bottomBorder > hScrollBarWidth ? bottomBorder - hScrollBarWidth : 0) - ((null !== (_4 = lineWidths[0]) && void 0 !== _4 ? _4 : 0) + (null !== (_5 = shadowWidths[0]) && void 0 !== _5 ? _5 : 0)) - this.contentOffsetY;
             }
         }
         this._clearColRangeWidthsMap(), this._clearRowRangeHeightsMap();
@@ -920,7 +926,8 @@ class BaseTable extends EventTarget_1.EventTarget {
         if (this.isReleased) return;
         null === (_b = null === (_a = internalProps.tooltipHandler) || void 0 === _a ? void 0 : _a.release) || void 0 === _b || _b.call(_a), 
         null === (_d = null === (_c = internalProps.menuHandler) || void 0 === _c ? void 0 : _c.release) || void 0 === _d || _d.call(_c), 
-        null === (_e = super.release) || void 0 === _e || _e.call(this), null === (_g = null === (_f = internalProps.handler) || void 0 === _f ? void 0 : _f.release) || void 0 === _g || _g.call(_f), 
+        null === (_e = super.release) || void 0 === _e || _e.call(this), this.pluginManager.release(), 
+        null === (_g = null === (_f = internalProps.handler) || void 0 === _f ? void 0 : _f.release) || void 0 === _g || _g.call(_f), 
         this.eventManager.release(), null === (_j = null === (_h = internalProps.focusControl) || void 0 === _h ? void 0 : _h.release) || void 0 === _j || _j.call(_h), 
         null === (_k = internalProps.legends) || void 0 === _k || _k.forEach((legend => {
             null == legend || legend.release();
@@ -935,16 +942,22 @@ class BaseTable extends EventTarget_1.EventTarget {
         parentElement && !this.options.canvas && parentElement.removeChild(internalProps.element), 
         null === (_q = null === (_p = null === (_o = this.editorManager) || void 0 === _o ? void 0 : _o.editingEditor) || void 0 === _p ? void 0 : _p.onEnd) || void 0 === _q || _q.call(_p), 
         this.isReleased = !0, this.scenegraph = null, this.internalProps = null, null === (_r = this.reactCustomLayout) || void 0 === _r || _r.clearCache(), 
-        this.pluginManager.release(), (0, chart_render_helper_1.clearChartRenderQueue)();
+        (0, chart_render_helper_1.clearChartRenderQueue)();
     }
     fireListeners(type, event) {
         return super.fireListeners(type, event);
     }
-    updateOption(options) {
+    updateOption(options, updateConfig = {
+        clearColWidthCache: !0,
+        clearRowHeightCache: !0
+    }) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
-        null === (_a = this.editorManager) || void 0 === _a || _a.cancelEdit(), this.options = options, 
+        this.fireListeners(TABLE_EVENT_TYPE_1.TABLE_EVENT_TYPE.BEFORE_UPDATE_OPTION, {
+            options: options,
+            container: this.container
+        }), null === (_a = this.editorManager) || void 0 === _a || _a.cancelEdit(), this.options = options, 
         this._hasAutoImageColumn = void 0;
-        const {frozenColCount: frozenColCount = 0, unfreezeAllOnExceedsMaxWidth: unfreezeAllOnExceedsMaxWidth, defaultRowHeight: defaultRowHeight = 40, defaultHeaderRowHeight: defaultHeaderRowHeight, defaultColWidth: defaultColWidth = 80, defaultHeaderColWidth: defaultHeaderColWidth = 80, keyboardOptions: keyboardOptions, eventOptions: eventOptions, rowSeriesNumber: rowSeriesNumber, enableCheckboxCascade: enableCheckboxCascade, enableHeaderCheckboxCascade: enableHeaderCheckboxCascade, columnResizeMode: columnResizeMode, rowResizeMode: rowResizeMode = "none", resize: resize, dragHeaderMode: dragHeaderMode, dragOrder: dragOrder, showFrozenIcon: showFrozenIcon, allowFrozenColCount: allowFrozenColCount, padding: padding, hover: hover, menu: menu, select: click, pixelRatio: pixelRatio, widthMode: widthMode, heightMode: heightMode, autoFillWidth: autoFillWidth, autoFillHeight: autoFillHeight, containerFit: containerFit, widthAdaptiveMode: widthAdaptiveMode, heightAdaptiveMode: heightAdaptiveMode, customRender: customRender, renderChartAsync: renderChartAsync, renderChartAsyncBatchCount: renderChartAsyncBatchCount, canvasWidth: canvasWidth, canvasHeight: canvasHeight, overscrollBehavior: overscrollBehavior, limitMinWidth: limitMinWidth, limitMinHeight: limitMinHeight} = options, {groupConfig: groupConfig, groupBy: groupBy, groupTitleFieldFormat: groupTitleFieldFormat, groupTitleCustomLayout: groupTitleCustomLayout, enableTreeStickCell: enableTreeStickCell} = options;
+        const {frozenColCount: frozenColCount = 0, unfreezeAllOnExceedsMaxWidth: unfreezeAllOnExceedsMaxWidth, defaultRowHeight: defaultRowHeight = 40, defaultHeaderRowHeight: defaultHeaderRowHeight, defaultColWidth: defaultColWidth = 80, defaultHeaderColWidth: defaultHeaderColWidth = 80, keyboardOptions: keyboardOptions, eventOptions: eventOptions, rowSeriesNumber: rowSeriesNumber, enableCheckboxCascade: enableCheckboxCascade, enableHeaderCheckboxCascade: enableHeaderCheckboxCascade, columnResizeMode: columnResizeMode, rowResizeMode: rowResizeMode = "none", resize: resize, dragHeaderMode: dragHeaderMode, dragOrder: dragOrder, showFrozenIcon: showFrozenIcon, allowFrozenColCount: allowFrozenColCount, padding: padding, hover: hover, menu: menu, select: click, pixelRatio: pixelRatio, widthMode: widthMode, heightMode: heightMode, autoFillWidth: autoFillWidth, autoFillHeight: autoFillHeight, containerFit: containerFit, widthAdaptiveMode: widthAdaptiveMode, heightAdaptiveMode: heightAdaptiveMode, customRender: customRender, renderChartAsync: renderChartAsync, renderChartAsyncBatchCount: renderChartAsyncBatchCount, canvasWidth: canvasWidth, canvasHeight: canvasHeight, contentOffsetX: translateX = 0, contentOffsetY: translateY = 0, overscrollBehavior: overscrollBehavior, limitMinWidth: limitMinWidth, limitMinHeight: limitMinHeight} = options, {groupConfig: groupConfig, groupBy: groupBy, groupTitleFieldFormat: groupTitleFieldFormat, groupTitleCustomLayout: groupTitleCustomLayout, enableTreeStickCell: enableTreeStickCell} = options;
         pixelRatio && pixelRatio !== this.internalProps.pixelRatio && (this.internalProps.pixelRatio = pixelRatio), 
         padding && ("number" == typeof padding ? (this.padding.top = padding, this.padding.left = padding, 
         this.padding.bottom = padding, this.padding.right = padding) : (padding.top && (this.padding.top = padding.top), 
@@ -964,8 +977,10 @@ class BaseTable extends EventTarget_1.EventTarget {
         } : {
             width: !1,
             height: !1
-        }), this.customRender = customRender, this.canvasWidth = (0, vutils_1.isNumber)(canvasWidth) ? canvasWidth : void 0, 
-        this.canvasHeight = (0, vutils_1.isNumber)(canvasHeight) ? canvasHeight : void 0;
+        }), this.customRender = customRender, this.contentOffsetX = null != translateX ? translateX : 0, 
+        this.contentOffsetY = null != translateY ? translateY : 0, this.canvasWidth = (0, 
+        vutils_1.isNumber)(canvasWidth) ? canvasWidth : void 0, this.canvasHeight = (0, 
+        vutils_1.isNumber)(canvasHeight) ? canvasHeight : void 0;
         const internalProps = this.internalProps;
         if ("node" === env_1.Env.mode || options.canvas || (0, tableHelper_1.updateRootElementPadding)(internalProps.element, this.padding), 
         this.columnWidthComputeMode = null !== (_d = options.columnWidthComputeMode) && void 0 !== _d ? _d : "normal", 
@@ -985,11 +1000,12 @@ class BaseTable extends EventTarget_1.EventTarget {
         internalProps.groupTitleFieldFormat = null !== (_l = null == groupConfig ? void 0 : groupConfig.titleFieldFormat) && void 0 !== _l ? _l : groupTitleFieldFormat, 
         internalProps.groupTitleCustomLayout = null !== (_m = null == groupConfig ? void 0 : groupConfig.titleCustomLayout) && void 0 !== _m ? _m : groupTitleCustomLayout, 
         internalProps.enableTreeStickCell = null !== (_o = null == groupConfig ? void 0 : groupConfig.enableTreeStickCell) && void 0 !== _o ? _o : enableTreeStickCell, 
+        (null == updateConfig ? void 0 : updateConfig.clearColWidthCache) && (internalProps._widthResizedColMap.clear(), 
+        this.colWidthsMap = new NumberMap_1.NumberMap, this.colContentWidthsMap = new NumberMap_1.NumberMap, 
+        this.colWidthsLimit = {}), (null == updateConfig ? void 0 : updateConfig.clearRowHeightCache) && (internalProps._heightResizedRowMap.clear(), 
         internalProps._rowHeightsMap = new row_height_map_1.NumberRangeMap(this), internalProps._rowRangeHeightsMap = new Map, 
-        internalProps._colRangeWidthsMap = new Map, internalProps._widthResizedColMap = new Set, 
-        internalProps._heightResizedRowMap = new Set, this.colWidthsMap = new NumberMap_1.NumberMap, 
-        this.colContentWidthsMap = new NumberMap_1.NumberMap, this.colWidthsLimit = {}, 
-        internalProps.stick.changedCells.clear(), internalProps.theme = themes_1.default.of(null !== (_p = options.theme) && void 0 !== _p ? _p : themes_1.default.DEFAULT), 
+        internalProps._colRangeWidthsMap = new Map), internalProps.stick.changedCells.clear(), 
+        internalProps.theme = themes_1.default.of(null !== (_p = options.theme) && void 0 !== _p ? _p : themes_1.default.DEFAULT), 
         internalProps.theme.isPivot = this.isPivotTable(), (0, icons_1.setIconColor)(internalProps.theme.functionalIconsStyle), 
         this.scenegraph.updateStageBackground(), internalProps.autoWrapText = options.autoWrapText, 
         internalProps.enableLineBreak = options.enableLineBreak, internalProps.allowFrozenColCount = null !== (_q = options.allowFrozenColCount) && void 0 !== _q ? _q : 0, 
@@ -1034,7 +1050,8 @@ class BaseTable extends EventTarget_1.EventTarget {
             const MenuHandler = factory_1.Factory.getComponent("menuHandler");
             internalProps.menuHandler = new MenuHandler(this);
         }
-        this.clearCellStyleCache(), this.clearColWidthCache(), this.clearRowHeightCache(), 
+        this.clearCellStyleCache(), (null == updateConfig ? void 0 : updateConfig.clearColWidthCache) && this.clearColWidthCache(), 
+        (null == updateConfig ? void 0 : updateConfig.clearRowHeightCache) && this.clearRowHeightCache(), 
         internalProps.customMergeCell = (0, get_custom_merge_cell_func_1.getCustomMergeCellFunc)(options.customMergeCell), 
         null === (_z = this.customCellStylePlugin) || void 0 === _z || _z.updateCustomCell(null !== (_0 = options.customCellStyle) && void 0 !== _0 ? _0 : [], null !== (_1 = options.customCellStyleArrangement) && void 0 !== _1 ? _1 : []), 
         this._adjustCanvasSizeByOption();
@@ -1138,11 +1155,87 @@ class BaseTable extends EventTarget_1.EventTarget {
         const {scrollLeft: scrollLeft, scrollTop: scrollTop} = this;
         cellRanges.forEach(((cellRange, index) => {
             var _a, _b, _c, _d, _e, _f;
-            cellRange.start.col === cellRange.end.col && cellRange.start.row === cellRange.end.row ? this.stateManager.updateSelectPos(cellRange.start.col, cellRange.start.row, !1, index >= 1, !1, null === (_b = null === (_a = this.options.select) || void 0 === _a ? void 0 : _a.makeSelectCellVisible) || void 0 === _b || _b, !0) : (this.stateManager.updateSelectPos(cellRange.start.col, cellRange.start.row, !1, index >= 1, !1, null === (_d = null === (_c = this.options.select) || void 0 === _c ? void 0 : _c.makeSelectCellVisible) || void 0 === _d || _d, !0), 
-            this.stateManager.updateInteractionState(ts_types_1.InteractionState.grabing), this.stateManager.updateSelectPos(cellRange.end.col, cellRange.end.row, !1, index >= 1, !1, null === (_f = null === (_e = this.options.select) || void 0 === _e ? void 0 : _e.makeSelectCellVisible) || void 0 === _f || _f, !0)), 
+            const startRow = cellRange.start.row, startCol = cellRange.start.col, endRow = cellRange.end.row, endCol = cellRange.end.col;
+            startCol === endCol && startRow === endRow ? this.stateManager.updateSelectPos(startCol, startRow, !1, index >= 1, !1, null === (_b = null === (_a = this.options.select) || void 0 === _a ? void 0 : _a.makeSelectCellVisible) || void 0 === _b || _b, !0) : (this.stateManager.updateSelectPos(startCol, startRow, !1, index >= 1, !1, null === (_d = null === (_c = this.options.select) || void 0 === _c ? void 0 : _c.makeSelectCellVisible) || void 0 === _d || _d, !0), 
+            this.stateManager.updateInteractionState(ts_types_1.InteractionState.grabing), this.stateManager.updateSelectPos(endCol, endRow, !1, index >= 1, !1, null === (_f = null === (_e = this.options.select) || void 0 === _e ? void 0 : _e.makeSelectCellVisible) || void 0 === _f || _f, !0)), 
             this.stateManager.endSelectCells(!1, !1), this.stateManager.updateInteractionState(ts_types_1.InteractionState.default);
         })), this.setScrollTop(scrollTop), this.setScrollLeft(scrollLeft);
     }
+    selectRow(rowIndex, isCtrl, isShift) {
+        const currentSelectRanges = this.stateManager.select.ranges;
+        if (isCtrl) currentSelectRanges.push({
+            start: {
+                col: 0,
+                row: rowIndex
+            },
+            end: {
+                col: this.colCount - 1,
+                row: rowIndex
+            }
+        }), this.selectCells(currentSelectRanges); else if (isShift) {
+            const lastSelectRange = currentSelectRanges[currentSelectRanges.length - 1];
+            lastSelectRange && (lastSelectRange.end.row = rowIndex), this.selectCells(currentSelectRanges);
+        } else this.selectCells([ {
+            start: {
+                col: 0,
+                row: rowIndex
+            },
+            end: {
+                col: this.colCount - 1,
+                row: rowIndex
+            }
+        } ]);
+    }
+    selectCol(colIndex, isCtrl, isShift) {
+        const currentSelectRanges = this.stateManager.select.ranges;
+        if (isCtrl) currentSelectRanges.push({
+            start: {
+                col: colIndex,
+                row: 0
+            },
+            end: {
+                col: colIndex,
+                row: this.rowCount - 1
+            }
+        }), this.selectCells(currentSelectRanges); else if (isShift) {
+            const lastSelectRange = currentSelectRanges[currentSelectRanges.length - 1];
+            lastSelectRange && (lastSelectRange.end.col = colIndex), this.selectCells(currentSelectRanges);
+        } else this.selectCells([ {
+            start: {
+                col: colIndex,
+                row: 0
+            },
+            end: {
+                col: colIndex,
+                row: this.rowCount - 1
+            }
+        } ]);
+    }
+    startDragSelectCol(colIndex, isCtrl, isShift) {
+        var _a, _b, _c, _d, _e, _f;
+        const lastSelectRange = this.stateManager.select.ranges[this.stateManager.select.ranges.length - 1], startCol = isShift && (null === (_a = null == lastSelectRange ? void 0 : lastSelectRange.start) || void 0 === _a ? void 0 : _a.col) ? null === (_b = null == lastSelectRange ? void 0 : lastSelectRange.start) || void 0 === _b ? void 0 : _b.col : colIndex, endCol = colIndex, endRow = this.rowCount - 1;
+        this.stateManager.updateSelectPos(startCol, 0, isShift, isCtrl, !1, null === (_d = null === (_c = this.options.select) || void 0 === _c ? void 0 : _c.makeSelectCellVisible) || void 0 === _d || _d, !0), 
+        this.stateManager.updateInteractionState(ts_types_1.InteractionState.grabing), this.stateManager.updateSelectPos(endCol, endRow, isShift, isCtrl, !1, null === (_f = null === (_e = this.options.select) || void 0 === _e ? void 0 : _e.makeSelectCellVisible) || void 0 === _f || _f, !0);
+    }
+    dragSelectCol(colIndex, isCtrl) {
+        var _a, _b;
+        const currentSelectRanges = this.stateManager.select.ranges, lastSelectRange = currentSelectRanges[currentSelectRanges.length - 1];
+        lastSelectRange && (lastSelectRange.end.col = colIndex), this.stateManager.updateSelectPos(colIndex, this.rowCount - 1, !1, isCtrl, !1, null === (_b = null === (_a = this.options.select) || void 0 === _a ? void 0 : _a.makeSelectCellVisible) || void 0 === _b || _b, !0);
+    }
+    endDragSelect() {
+        this.stateManager.updateInteractionState(ts_types_1.InteractionState.default), this.stateManager.endSelectCells(!1, !1);
+    }
+    startDragSelectRow(rowIndex, isCtrl, isShift) {
+        var _a, _b, _c, _d, _e, _f;
+        const lastSelectRange = this.stateManager.select.ranges[this.stateManager.select.ranges.length - 1], startRow = isShift && (null === (_a = null == lastSelectRange ? void 0 : lastSelectRange.start) || void 0 === _a ? void 0 : _a.row) ? null === (_b = null == lastSelectRange ? void 0 : lastSelectRange.start) || void 0 === _b ? void 0 : _b.row : rowIndex, endCol = this.colCount - 1, endRow = rowIndex;
+        this.stateManager.updateSelectPos(0, startRow, isShift, isCtrl, !1, null === (_d = null === (_c = this.options.select) || void 0 === _c ? void 0 : _c.makeSelectCellVisible) || void 0 === _d || _d, !0), 
+        this.stateManager.updateInteractionState(ts_types_1.InteractionState.grabing), this.stateManager.updateSelectPos(endCol, endRow, isShift, isCtrl, !1, null === (_f = null === (_e = this.options.select) || void 0 === _e ? void 0 : _e.makeSelectCellVisible) || void 0 === _f || _f, !0);
+    }
+    dragSelectRow(rowIndex, isCtrl) {
+        var _a, _b;
+        const currentSelectRanges = this.stateManager.select.ranges, lastSelectRange = currentSelectRanges[currentSelectRanges.length - 1];
+        lastSelectRange && (lastSelectRange.end.row = rowIndex), this.stateManager.updateSelectPos(this.colCount - 1, rowIndex, !1, isCtrl, !1, null === (_b = null === (_a = this.options.select) || void 0 === _a ? void 0 : _a.makeSelectCellVisible) || void 0 === _b || _b, !0);
+    }
     get recordsCount() {
         var _a;
         return null === (_a = this.records) || void 0 === _a ? void 0 : _a.length;