@visactor/vtable 1.5.3-alpha.1 → 1.5.3

package/cjs/core/BaseTable.d.ts

@@ -52,10 +52,9 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     version: string;
     pagination?: IPagination | undefined;
     id: string;
-    headerStyleCache: Map<string, any>;
-    bodyStyleCache: Map<string, any>;
-    bodyMergeTitleCache: Map<string, any>;
-    bodyBottomStyleCache: Map<string, any>;
+    headerStyleCache: any;
+    bodyStyleCache: any;
+    bodyBottomStyleCache: any;
     container: HTMLElement;
     isReleased: boolean;
     _chartEventMap: Record<string, {
@@ -405,5 +404,4 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     hideMoverLine(col: number, row: number): void;
     disableScroll(): void;
     enableScroll(): void;
-    getGroupTitleLevel(col: number, row: number): number | undefined;
 }

package/cjs/core/BaseTable.js

@@ -33,17 +33,19 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.BaseTable = void 0;
 
-const columnStyleContents = __importStar(require("../body-helper/style")), style_1 = require("./style"), style = __importStar(require("../tools/style")), 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"), vutils_1 = require("@visactor/vutils"), text_measure_1 = require("../scenegraph/utils/text-measure"), get_prop_1 = require("../scenegraph/utils/get-prop"), icons_1 = require("../plugins/icons"), tableHelper_1 = require("./tableHelper"), FouseInput_1 = require("./FouseInput"), pixel_ratio_1 = require("../tools/pixel-ratio"), chart_render_helper_1 = require("../scenegraph/graphic/contributions/chart-render-helper"), row_height_map_1 = require("../layout/row-height-map"), row_series_number_helper_1 = require("./row-series-number-helper"), custom_cell_style_1 = require("../plugins/custom-cell-style"), update_select_border_1 = require("../scenegraph/select/update-select-border"), react_custom_layout_1 = require("../components/react/react-custom-layout"), layout_helper_1 = require("../layout/layout-helper"), factory_1 = require("./factory"), get_cell_position_1 = require("./utils/get-cell-position"), style_helper_1 = require("./style-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")), 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"), vutils_1 = require("@visactor/vutils"), text_measure_1 = require("../scenegraph/utils/text-measure"), get_prop_1 = require("../scenegraph/utils/get-prop"), icons_1 = require("../plugins/icons"), tableHelper_1 = require("./tableHelper"), FouseInput_1 = require("./FouseInput"), pixel_ratio_1 = require("../tools/pixel-ratio"), chart_render_helper_1 = require("../scenegraph/graphic/contributions/chart-render-helper"), get_axis_config_1 = require("../layout/chart-helper/get-axis-config"), row_height_map_1 = require("../layout/row-height-map"), row_series_number_helper_1 = require("./row-series-number-helper"), custom_cell_style_1 = require("../plugins/custom-cell-style"), update_select_border_1 = require("../scenegraph/select/update-select-border"), react_custom_layout_1 = require("../components/react/react-custom-layout"), layout_helper_1 = require("../layout/layout-helper"), factory_1 = require("./factory"), get_cell_position_1 = require("./utils/get-cell-position"), {toBoxArray: toBoxArray} = helper_1.style, {isTouchEvent: isTouchEvent} = helper_1.event, rangeReg = /^\$(\d+)\$(\d+)$/;
 
 (0, style_1.importStyle)();
 
+const EMPTY_STYLE = {};
+
 class BaseTable extends EventTarget_1.EventTarget {
     static get EVENT_TYPE() {
         return TABLE_EVENT_TYPE_1.TABLE_EVENT_TYPE;
     }
     constructor(container, options = {}) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-        if (super(), this.showFrozenIcon = !0, this.version = "1.5.3-alpha.1", this.id = `VTable${Date.now()}`, 
+        if (super(), this.showFrozenIcon = !0, this.version = "1.5.3", this.id = `VTable${Date.now()}`, 
         this.isReleased = !1, this._chartEventMap = {}, this.throttleInvalidate = (0, util_1.throttle2)(this.render.bind(this), 200), 
         !container && "node" !== options.mode) throw new Error("vtable's container is undefined");
         const {frozenColCount: frozenColCount = 0, frozenRowCount: frozenRowCount, defaultRowHeight: defaultRowHeight = 40, defaultHeaderRowHeight: defaultHeaderRowHeight, defaultColWidth: defaultColWidth = 80, defaultHeaderColWidth: defaultHeaderColWidth, widthMode: widthMode = "standard", heightMode: heightMode = "standard", autoFillWidth: autoFillWidth = !1, autoFillHeight: autoFillHeight = !1, widthAdaptiveMode: widthAdaptiveMode = "only-body", heightAdaptiveMode: heightAdaptiveMode = "only-body", keyboardOptions: keyboardOptions, eventOptions: eventOptions, rowSeriesNumber: rowSeriesNumber, columnResizeMode: columnResizeMode, rowResizeMode: rowResizeMode = "none", 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, mode: mode, modeParams: modeParams, canvasWidth: canvasWidth, canvasHeight: canvasHeight, overscrollBehavior: overscrollBehavior, limitMinWidth: limitMinWidth, limitMinHeight: limitMinHeight, clearDOM: clearDOM = !0} = options;
@@ -132,8 +134,8 @@ class BaseTable extends EventTarget_1.EventTarget {
             const MenuHandler = factory_1.Factory.getComponent("menuHandler");
             internalProps.menuHandler = new MenuHandler(this);
         }
-        this.headerStyleCache = new Map, this.bodyStyleCache = new Map, this.bodyMergeTitleCache = new Map, 
-        this.bodyBottomStyleCache = new Map, internalProps.stick = {
+        this.headerStyleCache = new Map, this.bodyStyleCache = new Map, this.bodyBottomStyleCache = new Map, 
+        internalProps.stick = {
             changedCells: new Map
         }, internalProps.customMergeCell = options.customMergeCell, this.customCellStylePlugin = new custom_cell_style_1.CustomCellStylePlugin(this, null !== (_k = options.customCellStyle) && void 0 !== _k ? _k : [], null !== (_l = options.customCellStyleArrangement) && void 0 !== _l ? _l : []);
     }
@@ -1173,11 +1175,81 @@ class BaseTable extends EventTarget_1.EventTarget {
         return null === (_a = this.internalProps.dataSource) || void 0 === _a ? void 0 : _a.hasField(index, field);
     }
     _getCellStyle(col, row) {
-        return (0, style_helper_1.getCellStyle)(col, row, this);
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        const customCellStyle = this.customCellStylePlugin.getCustomCellStyle(col, row), {layoutMap: layoutMap} = this.internalProps;
+        if (layoutMap.isHeader(col, row)) {
+            let cacheKey;
+            if (!this.isPivotTable() || this.isBottomFrozenRow(row) || this.isRightFrozenColumn(col)) cacheKey = `${col}-${row}`; else {
+                const define = this.getHeaderDefine(col, row), isCorner = this.isCornerHeader(col, row);
+                cacheKey = (null == define ? void 0 : define.dimensionKey) ? isCorner ? `dim-cor-${define.dimensionKey}` : `dim-${define.dimensionKey}` : (null == define ? void 0 : define.indicatorKey) ? `ind-${define.indicatorKey}` : `${col}-${row}`;
+            }
+            let cacheStyle = this.headerStyleCache.get(cacheKey);
+            if (cacheStyle) return customCellStyle ? (0, custom_cell_style_1.mergeStyle)(cacheStyle, customCellStyle) : cacheStyle;
+            const hd = layoutMap.getHeader(col, row);
+            let paddingForAxis;
+            if (this.isPivotChart() && (0, get_axis_config_1.isTopOrBottomAxis)(col, row, layoutMap) && layoutMap.isAxisCell(col, row)) {
+                paddingForAxis = null !== (_b = null === (_a = layoutMap.getBody(col, this.rowHeaderLevelCount).style) || void 0 === _a ? void 0 : _a.padding) && void 0 !== _b ? _b : this.theme.bodyStyle.padding;
+            } else if (this.isPivotChart() && (0, get_axis_config_1.isLeftOrRightAxis)(col, row, layoutMap) && layoutMap.isAxisCell(col, row)) {
+                paddingForAxis = null !== (_d = null === (_c = layoutMap.getBody(this.columnHeaderLevelCount, row).style) || void 0 === _c ? void 0 : _c.padding) && void 0 !== _d ? _d : this.theme.bodyStyle.padding;
+            }
+            if ((!hd || hd.isEmpty) && (layoutMap.isLeftBottomCorner(col, row) || layoutMap.isRightBottomCorner(col, row) || layoutMap.isCornerHeader(col, row) || layoutMap.isRightTopCorner(col, row))) return EMPTY_STYLE;
+            const styleClass = this.internalProps.headerHelper.getStyleClass((null == hd ? void 0 : hd.headerType) || "text");
+            if (layoutMap.isBottomFrozenRow(col, row) && this.theme.bottomFrozenStyle) cacheStyle = headerStyleContents.of(paddingForAxis ? {
+                padding: paddingForAxis
+            } : {}, this.theme.bottomFrozenStyle, {
+                col: col,
+                row: row,
+                table: this,
+                value: this.getCellValue(col, row),
+                dataValue: this.getCellOriginValue(col, row),
+                cellHeaderPaths: this.getCellHeaderPaths(col, row)
+            }, styleClass, this.options.autoWrapText, this.theme); else if (layoutMap.isRightFrozenColumn(col, row) && this.theme.rightFrozenStyle) cacheStyle = headerStyleContents.of(paddingForAxis ? {
+                padding: paddingForAxis
+            } : {}, this.theme.rightFrozenStyle, {
+                col: col,
+                row: row,
+                table: this,
+                value: this.getCellValue(col, row),
+                dataValue: this.getCellOriginValue(col, row),
+                cellHeaderPaths: this.getCellHeaderPaths(col, row)
+            }, styleClass, this.options.autoWrapText, this.theme); else {
+                const style = (null == hd ? void 0 : hd.style) || {};
+                paddingForAxis && (style.padding = paddingForAxis), cacheStyle = headerStyleContents.of(style, layoutMap.isColumnHeader(col, row) || layoutMap.isBottomFrozenRow(col, row) ? this.theme.headerStyle : layoutMap.isRowHeader(col, row) || layoutMap.isRightFrozenColumn(col, row) ? this.theme.rowHeaderStyle : this.theme.cornerHeaderStyle, {
+                    col: col,
+                    row: row,
+                    table: this,
+                    value: this.getCellValue(col, row),
+                    dataValue: this.getCellOriginValue(col, row),
+                    cellHeaderPaths: this.getCellHeaderPaths(col, row)
+                }, styleClass, this.options.autoWrapText, this.theme);
+            }
+            return this.headerStyleCache.set(cacheKey, cacheStyle), customCellStyle ? (0, custom_cell_style_1.mergeStyle)(cacheStyle, customCellStyle) : cacheStyle;
+        }
+        let bgColorFunc, cacheKey;
+        (null === (_f = null === (_e = this.internalProps) || void 0 === _e ? void 0 : _e.dataConfig) || void 0 === _f ? void 0 : _f.mappingRules) && !this.isHeader(col, row) && (null === (_j = null === (_h = null === (_g = this.internalProps) || void 0 === _g ? void 0 : _g.dataConfig) || void 0 === _h ? void 0 : _h.mappingRules) || void 0 === _j || _j.forEach(((mappingRule, i) => {
+            mappingRule.bgColor && this.internalProps.layoutMap.getIndicatorKey(col, row) === mappingRule.bgColor.indicatorKey && (bgColorFunc = mappingRule.bgColor.mapping);
+        })));
+        const cellType = this.getCellType(col, row);
+        let cacheStyle;
+        if (cacheKey = this.isSeriesNumberInBody(col, row) ? `${col}-series-` + cellType : this.isListTable() && !this.transpose || this.isPivotTable() && this.internalProps.layoutMap.indicatorsAsCol ? col + cellType : row + cellType, 
+        cacheStyle = layoutMap.isBottomFrozenRow(row) ? this.bodyBottomStyleCache.get(cacheKey) : this.bodyStyleCache.get(cacheKey), 
+        cacheStyle) return customCellStyle ? (0, custom_cell_style_1.mergeStyle)(cacheStyle, customCellStyle) : cacheStyle;
+        const column = layoutMap.getBody(col, row), styleClass = this.internalProps.bodyHelper.getStyleClass(this.getCellType(col, row)), style = null == column ? void 0 : column.style;
+        return cacheStyle = columnStyleContents.of(style, layoutMap.isBottomFrozenRow(row) && this.theme.bottomFrozenStyle ? this.theme.bottomFrozenStyle : layoutMap.isRightFrozenColumn(col) && this.theme.rightFrozenStyle ? this.theme.rightFrozenStyle : this.theme.bodyStyle, {
+            col: col,
+            row: row,
+            table: this,
+            value: this.getCellValue(col, row),
+            dataValue: this.getCellOriginValue(col, row),
+            cellHeaderPaths: this.getCellHeaderPaths(col, row)
+        }, styleClass, this.options.autoWrapText, this.theme), bgColorFunc && (cacheStyle = (0, 
+        custom_cell_style_1.mergeStyle)(cacheStyle, {
+            bgColor: bgColorFunc
+        })), (0, vutils_1.isFunction)(style) || (layoutMap.isBottomFrozenRow(row) ? this.bodyBottomStyleCache.set(cacheKey, cacheStyle) : this.bodyStyleCache.set(cacheKey, cacheStyle)), 
+        customCellStyle ? (0, custom_cell_style_1.mergeStyle)(cacheStyle, customCellStyle) : cacheStyle;
     }
     clearCellStyleCache() {
-        this.headerStyleCache.clear(), this.bodyStyleCache.clear(), this.bodyMergeTitleCache.clear(), 
-        this.bodyBottomStyleCache.clear();
+        this.headerStyleCache.clear(), this.bodyStyleCache.clear(), this.bodyBottomStyleCache.clear();
     }
     clearRowHeightCache() {
         this.internalProps._rowHeightsMap.clear(), this._clearRowRangeHeightsMap();
@@ -1683,7 +1755,6 @@ class BaseTable extends EventTarget_1.EventTarget {
     enableScroll() {
         this.eventManager.enableScroll();
     }
-    getGroupTitleLevel(col, row) {}
 }
 
 exports.BaseTable = BaseTable;