@visactor/vtable 0.10.1-alpha.1 → 0.10.1-alpha.3

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")), 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_1 = require("@visactor/vutils"), text_1 = require("../scenegraph/graphic/text"), 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"), legend_1 = require("../components/legend/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"), 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"), legend_1 = require("../components/legend/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,7 +45,7 @@ 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.1-alpha.1", 
+        if (super(), this.showFrozenIcon = !0, this.showSort = !0, this.version = "0.10.1-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;
@@ -88,7 +88,7 @@ class BaseTable extends EventTarget_1.EventTarget {
         internalProps.bodyHelper = new body_helper_1.BodyHelper(this), internalProps.headerHelper = new header_helper_1.HeaderHelper(this), 
         internalProps.autoWrapText = options.autoWrapText, internalProps.allowFrozenColCount = null !== (_c = options.allowFrozenColCount) && void 0 !== _c ? _c : internalProps.colCount, 
         internalProps.limitMaxAutoWidth = null !== (_d = options.limitMaxAutoWidth) && void 0 !== _d ? _d : 450, 
-        this.dataSet = new vdataset_1.DataSet, this.scenegraph = new scenegraph_1.Scenegraph(this), 
+        this._vDataSet = new vdataset_1.DataSet, this.scenegraph = new scenegraph_1.Scenegraph(this), 
         this.stateManeger = new state_1.StateManeger(this), this.eventManeger = new event_1.EventManeger(this), 
         options.legends && (internalProps.legends = new legend_1.TableLegend(options.legends, this), 
         this.scenegraph.tableGroup.setAttributes({
@@ -248,13 +248,13 @@ class BaseTable extends EventTarget_1.EventTarget {
         return this._widthMode;
     }
     set widthMode(widthMode) {
-        widthMode !== this._widthMode && (this._widthMode = widthMode);
+        widthMode !== this._widthMode && (this._widthMode = widthMode, this.options.widthMode = widthMode);
     }
     get heightMode() {
         return this._heightMode;
     }
     set heightMode(heightMode) {
-        heightMode !== this._heightMode && (this._heightMode = heightMode);
+        heightMode !== this._heightMode && (this._heightMode = heightMode, this.options.heightMode = heightMode);
     }
     get autoFillWidth() {
         return this._autoFillWidth;
@@ -663,7 +663,7 @@ class BaseTable extends EventTarget_1.EventTarget {
         internalProps.theme = themes_1.default.of(null !== (_a = options.theme) && void 0 !== _a ? _a : themes_1.default.DEFAULT), 
         internalProps.autoWrapText = options.autoWrapText, internalProps.allowFrozenColCount = null !== (_b = options.allowFrozenColCount) && void 0 !== _b ? _b : internalProps.colCount, 
         internalProps.limitMaxAutoWidth = null !== (_c = options.limitMaxAutoWidth) && void 0 !== _c ? _c : 450, 
-        this.dataSet = new vdataset_1.DataSet, null === (_d = internalProps.legends) || void 0 === _d || _d.release(), 
+        this._vDataSet = new vdataset_1.DataSet, null === (_d = internalProps.legends) || void 0 === _d || _d.release(), 
         null === (_e = internalProps.title) || void 0 === _e || _e.release(), internalProps.layoutMap.release(), 
         this.scenegraph.clearCells(), this.stateManeger.initState(), this._updateSize(), 
         options.legends && (internalProps.legends = new legend_1.TableLegend(options.legends, this), 
@@ -685,6 +685,10 @@ class BaseTable extends EventTarget_1.EventTarget {
         this.headerStyleCache = new Map, this.bodyStyleCache = new Map, this.clearColWidthCache(), 
         this.clearRowHeightCache();
     }
+    renderWithRecreateCells() {
+        this.refreshHeader(), this.scenegraph.clearCells(), this.headerStyleCache = new Map, 
+        this.bodyStyleCache = new Map, this.scenegraph.createSceneGraph(), this.render();
+    }
     getFrozenRowsHeight() {
         return this.getRowsHeight(0, this.frozenRowCount - 1);
     }
@@ -865,13 +869,20 @@ class BaseTable extends EventTarget_1.EventTarget {
         return this.internalProps.autoWrapText;
     }
     set autoWrapText(autoWrapText) {
+        this.internalProps.autoWrapText = autoWrapText, this.options.autoWrapText = autoWrapText;
+    }
+    updateAutoWrapText(autoWrapText) {
         this.internalProps.autoWrapText !== autoWrapText && (this.internalProps.autoWrapText = autoWrapText, 
-        this.options.autoWrapText = autoWrapText, this.internalProps.layoutMap && (this.refreshHeader(), 
-        this.render()));
+        this.options.autoWrapText = autoWrapText, this.scenegraph.clearCells(), this.headerStyleCache = new Map, 
+        this.bodyStyleCache = new Map, this.scenegraph.createSceneGraph(), this.render());
     }
     get theme() {
         return this.internalProps.theme;
     }
+    set theme(theme) {
+        this.internalProps.theme = themes_1.default.of(null != theme ? theme : themes_1.default.DEFAULT), 
+        this.options.theme = theme;
+    }
     updateTheme(theme) {
         this.internalProps.theme = themes_1.default.of(null != theme ? theme : themes_1.default.DEFAULT), 
         this.options.theme = theme, this.scenegraph.clearCells(), this.headerStyleCache = new Map, 
@@ -1017,7 +1028,7 @@ class BaseTable extends EventTarget_1.EventTarget {
             row: row,
             field: this.getHeaderField(col, row),
             cellHeaderPaths: this.internalProps.layoutMap.getCellHeaderPaths(col, row),
-            caption: colDef.caption,
+            title: colDef.title,
             columnType: colDef.columnType ? "string" == typeof colDef.columnType ? colDef.columnType : "progressbar" : "text",
             originData: this.getCellOriginRecord(col, row),
             cellRange: this.getCellRangeRelativeRect({
@@ -1083,7 +1094,7 @@ class BaseTable extends EventTarget_1.EventTarget {
             value: this.getCellValue(col, row),
             dataValue: this.getCellOriginValue(col, row),
             cellHeaderPaths: this.getCellHeaderPaths(col, row)
-        }, styleClass, this.options.autoWrapText), (0, vutils_1.isFunction)(style) || this.bodyStyleCache.set(cacheKey, cacheStyle), 
+        }, styleClass, this.options.autoWrapText), (0, vutils_2.isFunction)(style) || this.bodyStyleCache.set(cacheKey, cacheStyle), 
         cacheStyle;
     }
     clearCellStyleCache() {
@@ -1148,8 +1159,8 @@ class BaseTable extends EventTarget_1.EventTarget {
         return {
             textAlign: theme.text.textAlign,
             textBaseline: theme.text.textBaseline,
-            bgColor: (0, vutils_1.isBoolean)(theme.group.fill) ? (0, get_prop_1.getProp)("bgColor", actStyle, col, row, this) : theme.group.fill,
-            color: (0, vutils_1.isBoolean)(theme.text.fill) ? (0, get_prop_1.getProp)("color", actStyle, col, row, this) : theme.text.fill,
+            bgColor: (0, vutils_2.isBoolean)(theme.group.fill) ? (0, get_prop_1.getProp)("bgColor", actStyle, col, row, this) : theme.group.fill,
+            color: (0, vutils_2.isBoolean)(theme.text.fill) ? (0, get_prop_1.getProp)("color", actStyle, col, row, this) : theme.text.fill,
             fontFamily: theme.text.fontFamily,
             fontSize: theme.text.fontSize,
             fontWeight: theme.text.fontWeight,
@@ -1159,7 +1170,7 @@ class BaseTable extends EventTarget_1.EventTarget {
             autoWrapText: null != autoWrapText && autoWrapText,
             lineClamp: null != lineClamp ? lineClamp : "auto",
             textOverflow: textOverflow,
-            borderColor: (0, vutils_1.isBoolean)(theme.group.stroke) ? (0, get_prop_1.getProp)("borderColor", actStyle, col, row, this) : theme.group.stroke,
+            borderColor: (0, vutils_2.isBoolean)(theme.group.stroke) ? (0, get_prop_1.getProp)("borderColor", actStyle, col, row, this) : theme.group.stroke,
             borderLineWidth: theme.group.lineWidth,
             borderLineDash: theme.group.lineDash,
             underline: !!theme.text.underline,
@@ -1298,13 +1309,6 @@ class BaseTable extends EventTarget_1.EventTarget {
     measureText(text, font) {
         return measure_text_1.textMeasure.measureText(text, font);
     }
-    measureTextBounds(attributes) {
-        const text = new text_1.WrapText(attributes);
-        return {
-            width: text.AABBBounds.width(),
-            height: text.AABBBounds.height()
-        };
-    }
     getCustomRender(col, row) {
         let customRender;
         if ("body" !== this.getCellType(col, row)) {
@@ -1335,6 +1339,21 @@ class BaseTable extends EventTarget_1.EventTarget {
         const cellGroup = this.scenegraph.getCell(null === (_b = null === (_a = this.stateManeger.hover) || void 0 === _a ? void 0 : _a.cellPos) || void 0 === _b ? void 0 : _b.col, null === (_d = null === (_c = this.stateManeger.hover) || void 0 === _c ? void 0 : _c.cellPos) || void 0 === _d ? void 0 : _d.row);
         return "chart" === (null === (_f = null === (_e = null == cellGroup ? void 0 : cellGroup.getChildren()) || void 0 === _e ? void 0 : _e[0]) || void 0 === _f ? void 0 : _f.type) ? cellGroup.getChildren()[0].activeChartInstance : null;
     }
+    cellIsInVisualView(col, row) {
+        const drawRange = this.getDrawRange(), rect = this.getCellRelativeRect(col, row);
+        return col < this.frozenColCount && row < this.frozenRowCount || rect.top >= drawRange.top && rect.bottom <= drawRange.bottom && rect.left >= drawRange.left && rect.right <= drawRange.right;
+    }
+    exportImg() {
+        return this.scenegraph.stage.toCanvas().toDataURL();
+    }
+    exportCellImg(col, row) {
+        this.cellIsInVisualView(col, row) || 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();
+    }
 }
 
 exports.BaseTable = BaseTable;