@visactor/vtable 0.10.3-alpha.3 → 0.11.0

package/cjs/core/BaseTable.d.ts

@@ -1,4 +1,4 @@
-import type { CellAddress, CellRange, TableEventHandlersEventArgumentMap, TableEventHandlersReturnMap, TableKeyboardOptions, DropDownMenuHighlightInfo, MenuListItem, WidthModeDef, ICustomRender, ICellHeaderPaths, HeaderData, FullExtendStyle, FieldDef, ColumnTypeOption, SortState, IPagination, ICustomLayout, CellInfo, CellStyle, DropDownMenuOptions, FieldFormat, FieldData, MaybePromiseOrUndefined, MousePointerCellEvent, DropDownMenuEventInfo, HierarchyState, FieldKeyDef, CellLocation, LayoutObjectId, HeightModeDef } from '../ts-types';
+import { type CellAddress, type CellRange, type TableEventHandlersEventArgumentMap, type TableEventHandlersReturnMap, type TableKeyboardOptions, type DropDownMenuHighlightInfo, type MenuListItem, type WidthModeDef, type ICustomRender, type ICellHeaderPaths, type HeaderData, type FullExtendStyle, type FieldDef, type ColumnTypeOption, type SortState, type IPagination, type ICustomLayout, type CellInfo, type CellStyle, type DropDownMenuOptions, type FieldFormat, type FieldData, type MaybePromiseOrUndefined, type MousePointerCellEvent, type DropDownMenuEventInfo, type HierarchyState, type FieldKeyDef, type CellLocation, type LayoutObjectId, type HeightModeDef, type ITableThemeDefine } from '../ts-types';
 import type { ColumnIconOption } from '../ts-types';
 import { TABLE_EVENT_TYPE } from './TABLE_EVENT_TYPE';
 import { EventTarget } from '../event/EventTarget';
@@ -32,6 +32,7 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     _widthMode: WidthModeDef;
     _heightMode: HeightModeDef;
     _autoFillWidth: boolean;
+    _autoFillHeight: boolean;
     customRender?: ICustomRender;
     canvasWidth?: number;
     canvasHeight?: number;
@@ -48,6 +49,7 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     headerStyleCache: any;
     bodyStyleCache: any;
     container: HTMLElement;
+    isReleased: boolean;
     constructor(container: HTMLElement, options?: BaseTableConstructorOptions);
     throttleInvalidate: (this: any, ...args: any[]) => void;
     getContainer(): HTMLElement;
@@ -107,9 +109,11 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     set heightMode(heightMode: HeightModeDef);
     get autoFillWidth(): boolean;
     set autoFillWidth(autoFillWidth: boolean);
-    private _colWidthDefineToPxWidth;
+    get autoFillHeight(): boolean;
+    set autoFillHeight(autoFillHeight: boolean);
+    _colWidthDefineToPxWidth(width: string | number): number;
     private _getColWidthLimits;
-    private _adjustColWidth;
+    _adjustColWidth(col: number, orgWidth: number): number;
     setPixelRatio(pixelRatio: number): void;
     _updateSize(): void;
     get rowHierarchyType(): 'grid' | 'tree';
@@ -209,6 +213,7 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     private computeTargetColByX;
     clearSelected(): void;
     selectCell(col: number, row: number): void;
+    selectCells(cellRanges: CellRange[]): void;
     abstract isListTable(): boolean;
     abstract isPivotTable(): boolean;
     abstract isPivotChart(): boolean;
@@ -237,7 +242,7 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     updateAutoWrapText(autoWrapText: boolean): void;
     get theme(): TableTheme;
     set theme(theme: TableTheme);
-    updateTheme(theme: TableTheme): void;
+    updateTheme(theme: ITableThemeDefine): void;
     getBodyField(col: number, row: number): FieldDef | undefined;
     getBodyColumnDefine(col: number, row: number): ColumnDefine;
     getBodyColumnType(col: number, row: number): ColumnTypeOption;
@@ -301,4 +306,5 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     cellIsInVisualView(col: number, row: number): boolean;
     exportImg(): string;
     exportCellImg(col: number, row: number): string;
+    exportCellRangeImg(cellRange: CellRange): string;
 }

package/cjs/core/BaseTable.js

@@ -33,7 +33,7 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.BaseTable = void 0;
 
-const columnStyleContents = __importStar(require("../body-helper/style")), headerStyleContents = __importStar(require("../header-helper/style")), style_1 = require("./style"), style = __importStar(require("../tools/style")), vutils_1 = require("@visactor/vutils"), helper_1 = require("../tools/helper"), TABLE_EVENT_TYPE_1 = require("./TABLE_EVENT_TYPE"), EventHandler_1 = require("../event/EventHandler"), EventTarget_1 = require("../event/EventTarget"), NumberMap_1 = require("../tools/NumberMap"), Rect_1 = require("../tools/Rect"), util_1 = require("../tools/util"), themes_1 = __importDefault(require("../themes")), env_1 = require("../tools/env"), scenegraph_1 = require("../scenegraph/scenegraph"), state_1 = require("../state/state"), event_1 = require("../event/event"), body_helper_1 = require("../body-helper/body-helper"), header_helper_1 = require("../header-helper/header-helper"), TooltipHandler_1 = require("../components/tooltip/TooltipHandler"), vutils_2 = require("@visactor/vutils"), measure_text_1 = require("../scenegraph/utils/measure-text"), get_prop_1 = require("../scenegraph/utils/get-prop"), icons_1 = require("../plugins/icons"), tableHelper_1 = require("./tableHelper"), MenuHandler_1 = require("../components/menu/dom/MenuHandler"), FouseInput_1 = require("./FouseInput"), pixel_ratio_1 = require("../tools/pixel-ratio"), create_legend_1 = require("../components/legend/create-legend"), vdataset_1 = require("@visactor/vdataset"), title_1 = require("../components/title/title"), chart_render_helper_1 = require("../scenegraph/graphic/contributions/chart-render-helper"), {toBoxArray: toBoxArray} = helper_1.style, {isTouchEvent: isTouchEvent} = helper_1.event, rangeReg = /^\$(\d+)\$(\d+)$/;
+const columnStyleContents = __importStar(require("../body-helper/style")), headerStyleContents = __importStar(require("../header-helper/style")), style_1 = require("./style"), style = __importStar(require("../tools/style")), vutils_1 = require("@visactor/vutils"), ts_types_1 = require("../ts-types"), helper_1 = require("../tools/helper"), TABLE_EVENT_TYPE_1 = require("./TABLE_EVENT_TYPE"), EventHandler_1 = require("../event/EventHandler"), EventTarget_1 = require("../event/EventTarget"), NumberMap_1 = require("../tools/NumberMap"), Rect_1 = require("../tools/Rect"), util_1 = require("../tools/util"), themes_1 = __importDefault(require("../themes")), env_1 = require("../tools/env"), scenegraph_1 = require("../scenegraph/scenegraph"), state_1 = require("../state/state"), event_1 = require("../event/event"), body_helper_1 = require("../body-helper/body-helper"), header_helper_1 = require("../header-helper/header-helper"), TooltipHandler_1 = require("../components/tooltip/TooltipHandler"), vutils_2 = require("@visactor/vutils"), measure_text_1 = require("../scenegraph/utils/measure-text"), get_prop_1 = require("../scenegraph/utils/get-prop"), icons_1 = require("../plugins/icons"), tableHelper_1 = require("./tableHelper"), MenuHandler_1 = require("../components/menu/dom/MenuHandler"), FouseInput_1 = require("./FouseInput"), pixel_ratio_1 = require("../tools/pixel-ratio"), create_legend_1 = require("../components/legend/create-legend"), vdataset_1 = require("@visactor/vdataset"), title_1 = require("../components/title/title"), chart_render_helper_1 = require("../scenegraph/graphic/contributions/chart-render-helper"), {toBoxArray: toBoxArray} = helper_1.style, {isTouchEvent: isTouchEvent} = helper_1.event, rangeReg = /^\$(\d+)\$(\d+)$/;
 
 (0, style_1.importStyle)();
 
@@ -45,13 +45,13 @@ class BaseTable extends EventTarget_1.EventTarget {
     }
     constructor(container, options = {}) {
         var _a, _b, _c, _d, _e, _f, _g;
-        if (super(), this.showFrozenIcon = !0, this.showSort = !0, this.version = "0.10.3-alpha.3", 
-        this.id = `VTable${Date.now()}`, this.throttleInvalidate = (0, util_1.throttle2)(this.render.bind(this), 200), 
-        !container) throw new Error("vtable's container is undefined");
-        const {frozenColCount: frozenColCount = 0, defaultRowHeight: defaultRowHeight = 40, defaultHeaderRowHeight: defaultHeaderRowHeight, defaultColWidth: defaultColWidth = 80, defaultHeaderColWidth: defaultHeaderColWidth, widthMode: widthMode = "standard", heightMode: heightMode = "standard", autoFillWidth: autoFillWidth = !1, keyboardOptions: keyboardOptions, columnResizeMode: columnResizeMode, dragHeaderMode: dragHeaderMode, showFrozenIcon: showFrozenIcon, allowFrozenColCount: allowFrozenColCount, padding: padding, hover: hover, menu: menu, select: click, customRender: customRender, pixelRatio: pixelRatio = pixel_ratio_1.defaultPixelRatio, renderChartAsync: renderChartAsync, renderChartAsyncBatchCount: renderChartAsyncBatchCount} = options;
+        if (super(), this.showFrozenIcon = !0, this.showSort = !0, this.version = "0.11.0", 
+        this.id = `VTable${Date.now()}`, this.isReleased = !1, this.throttleInvalidate = (0, 
+        util_1.throttle2)(this.render.bind(this), 200), !container) throw new Error("vtable's container is undefined");
+        const {frozenColCount: frozenColCount = 0, defaultRowHeight: defaultRowHeight = 40, defaultHeaderRowHeight: defaultHeaderRowHeight, defaultColWidth: defaultColWidth = 80, defaultHeaderColWidth: defaultHeaderColWidth, widthMode: widthMode = "standard", heightMode: heightMode = "standard", autoFillWidth: autoFillWidth = !1, autoFillHeight: autoFillHeight = !1, keyboardOptions: keyboardOptions, columnResizeMode: columnResizeMode, dragHeaderMode: dragHeaderMode, showFrozenIcon: showFrozenIcon, allowFrozenColCount: allowFrozenColCount, padding: padding, hover: hover, menu: menu, select: click, customRender: customRender, pixelRatio: pixelRatio = pixel_ratio_1.defaultPixelRatio, renderChartAsync: renderChartAsync, renderChartAsyncBatchCount: renderChartAsyncBatchCount} = options;
         this.container = container, this.options = options, this.options.container = container, 
         this._widthMode = widthMode, this._heightMode = heightMode, this._autoFillWidth = autoFillWidth, 
-        this.customRender = customRender, this.padding = {
+        this._autoFillHeight = autoFillHeight, this.customRender = customRender, this.padding = {
             top: 0,
             right: 0,
             left: 0,
@@ -262,6 +262,12 @@ class BaseTable extends EventTarget_1.EventTarget {
     set autoFillWidth(autoFillWidth) {
         autoFillWidth !== this._autoFillWidth && (this._autoFillWidth = autoFillWidth);
     }
+    get autoFillHeight() {
+        return this._autoFillHeight;
+    }
+    set autoFillHeight(autoFillHeight) {
+        autoFillHeight !== this._autoFillHeight && (this._autoFillHeight = autoFillHeight);
+    }
     _colWidthDefineToPxWidth(width) {
         return "auto" === width ? 0 : (0, tableHelper_1._toPxWidth)(this, width);
     }
@@ -632,7 +638,7 @@ class BaseTable extends EventTarget_1.EventTarget {
             return null === (_a = null == releaseObj ? void 0 : releaseObj.release) || void 0 === _a ? void 0 : _a.call(releaseObj);
         })), internalProps.releaseList = null), this.scenegraph.stage.release();
         const {parentElement: parentElement} = internalProps.element;
-        parentElement && parentElement.removeChild(internalProps.element);
+        parentElement && parentElement.removeChild(internalProps.element), this.isReleased = !0;
     }
     fireListeners(type, event) {
         return super.fireListeners(type, event);
@@ -640,7 +646,7 @@ class BaseTable extends EventTarget_1.EventTarget {
     updateOption(options) {
         var _a, _b, _c, _d, _e;
         this.options = options;
-        const {frozenColCount: frozenColCount = 0, defaultRowHeight: defaultRowHeight = 40, defaultHeaderRowHeight: defaultHeaderRowHeight, defaultColWidth: defaultColWidth = 80, defaultHeaderColWidth: defaultHeaderColWidth = 80, keyboardOptions: keyboardOptions, columnResizeMode: columnResizeMode, dragHeaderMode: dragHeaderMode, showFrozenIcon: showFrozenIcon, allowFrozenColCount: allowFrozenColCount, padding: padding, hover: hover, menu: menu, select: click, pixelRatio: pixelRatio, widthMode: widthMode, heightMode: heightMode, autoFillWidth: autoFillWidth, customRender: customRender, renderChartAsync: renderChartAsync, renderChartAsyncBatchCount: renderChartAsyncBatchCount} = options;
+        const {frozenColCount: frozenColCount = 0, defaultRowHeight: defaultRowHeight = 40, defaultHeaderRowHeight: defaultHeaderRowHeight, defaultColWidth: defaultColWidth = 80, defaultHeaderColWidth: defaultHeaderColWidth = 80, keyboardOptions: keyboardOptions, columnResizeMode: columnResizeMode, dragHeaderMode: dragHeaderMode, showFrozenIcon: showFrozenIcon, allowFrozenColCount: allowFrozenColCount, padding: padding, hover: hover, menu: menu, select: click, pixelRatio: pixelRatio, widthMode: widthMode, heightMode: heightMode, autoFillWidth: autoFillWidth, autoFillHeight: autoFillHeight, customRender: customRender, renderChartAsync: renderChartAsync, renderChartAsyncBatchCount: renderChartAsyncBatchCount} = 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), 
@@ -648,7 +654,8 @@ class BaseTable extends EventTarget_1.EventTarget {
         padding.right && (this.padding.right = padding.right))), this.showFrozenIcon = "boolean" != typeof showFrozenIcon || showFrozenIcon, 
         "number" == typeof allowFrozenColCount && allowFrozenColCount <= 0 && (this.showFrozenIcon = !1), 
         this.widthMode = null != widthMode ? widthMode : "standard", this.heightMode = null != heightMode ? heightMode : "standard", 
-        this.autoFillWidth = null != autoFillWidth && autoFillWidth, this.customRender = customRender;
+        this.autoFillWidth = null != autoFillWidth && autoFillWidth, this.autoFillHeight = null != autoFillHeight && autoFillHeight, 
+        this.customRender = customRender;
         const internalProps = this.internalProps;
         "node" !== env_1.Env.mode && (0, tableHelper_1.updateRootElementPadding)(internalProps.element, this.padding), 
         internalProps.frozenColCount = frozenColCount, internalProps.defaultRowHeight = defaultRowHeight, 
@@ -841,6 +848,14 @@ class BaseTable extends EventTarget_1.EventTarget {
     selectCell(col, row) {
         this.stateManeger.updateSelectPos(col, row), this.stateManeger.endSelectCells();
     }
+    selectCells(cellRanges) {
+        const {scrollLeft: scrollLeft, scrollTop: scrollTop} = this;
+        cellRanges.forEach(((cellRange, index) => {
+            this.stateManeger.updateSelectPos(cellRange.start.col, cellRange.start.row, !1, index >= 1), 
+            this.stateManeger.updateInteractionState(ts_types_1.InteractionState.grabing), this.stateManeger.updateSelectPos(cellRange.end.col, cellRange.end.row, !1, index >= 1), 
+            this.stateManeger.endSelectCells(!1), this.stateManeger.updateInteractionState(ts_types_1.InteractionState.default);
+        })), this.setScrollTop(scrollTop), this.setScrollLeft(scrollLeft);
+    }
     get allowFrozenColCount() {
         return this.internalProps.allowFrozenColCount;
     }
@@ -891,7 +906,10 @@ class BaseTable extends EventTarget_1.EventTarget {
         return null == body ? void 0 : body.define;
     }
     getBodyColumnType(col, row) {
-        return this.internalProps.layoutMap.getBody(col, row).cellType;
+        const cellType = this.internalProps.layoutMap.getBody(col, row).cellType;
+        return (0, get_prop_1.getProp)("cellType", {
+            cellType: cellType
+        }, col, row, this);
     }
     getHeaderField(col, row) {
         return this.internalProps.layoutMap.getHeaderField(col, row);
@@ -1327,7 +1345,7 @@ class BaseTable extends EventTarget_1.EventTarget {
         return customLayout;
     }
     hasAutoImageColumn() {
-        return this.internalProps.layoutMap.columnObjects.find((column => !("image" !== column.cellType || !column.define.imageAutoSizing)));
+        return this.internalProps.layoutMap.columnObjects.find((column => !("image" !== column.cellType && "function" != typeof column.cellType || !column.define.imageAutoSizing)));
     }
     _getActiveChartInstance() {
         var _a, _b, _c, _d, _e, _f;
@@ -1342,12 +1360,33 @@ class BaseTable extends EventTarget_1.EventTarget {
         return this.scenegraph.stage.toCanvas().toDataURL();
     }
     exportCellImg(col, row) {
-        this.cellIsInVisualView(col, row) || this.scrollToCell({
+        const isInView = this.cellIsInVisualView(col, row), {scrollTop: scrollTop, scrollLeft: scrollLeft} = this;
+        isInView || this.scrollToCell({
             col: col,
             row: row
         });
-        const cellRect = this.getCellRelativeRect(col, row);
-        return this.scenegraph.stage.toCanvas(!1, (new vutils_1.AABBBounds).set(cellRect.left + this.tableX + 1, cellRect.top + this.tableY + 1, cellRect.right + this.tableX, cellRect.bottom + this.tableY)).toDataURL();
+        const cellRect = this.getCellRelativeRect(col, row), c = this.scenegraph.stage.toCanvas(!1, (new vutils_1.AABBBounds).set(cellRect.left + this.tableX + 1, cellRect.top + this.tableY + 1, cellRect.right + this.tableX, cellRect.bottom + this.tableY));
+        return isInView || (this.setScrollTop(scrollTop), this.setScrollLeft(scrollLeft)), 
+        c.toDataURL();
+    }
+    exportCellRangeImg(cellRange) {
+        const {scrollTop: scrollTop, scrollLeft: scrollLeft} = this, minCol = Math.min(cellRange.start.col, cellRange.end.col), minRow = Math.min(cellRange.start.row, cellRange.end.row), maxCol = Math.max(cellRange.start.col, cellRange.end.col), maxRow = Math.max(cellRange.start.row, cellRange.end.row), isInView = this.cellIsInVisualView(minCol, minRow), isMaxCellInView = this.cellIsInVisualView(maxCol, maxRow);
+        isInView && isMaxCellInView || this.scrollToCell({
+            col: minCol,
+            row: minRow
+        });
+        const cellRect = this.getCellRangeRelativeRect({
+            start: {
+                col: minCol,
+                row: minRow
+            },
+            end: {
+                col: maxCol,
+                row: maxRow
+            }
+        }), base64Image = this.scenegraph.stage.toCanvas(!1, (new vutils_1.AABBBounds).set(cellRect.left + this.tableX + 1, cellRect.top + this.tableY + 1, cellRect.right + this.tableX, cellRect.bottom + this.tableY)).toDataURL();
+        return isInView && isMaxCellInView || (this.setScrollTop(scrollTop), this.setScrollLeft(scrollLeft)), 
+        base64Image;
     }
 }