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

package/cjs/core/BaseTable.d.ts

@@ -1,5 +1,5 @@
 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 FieldData, type MaybePromiseOrUndefined, type MousePointerCellEvent, type DropDownMenuEventInfo, type HierarchyState, type FieldKeyDef, type CellLocation, type LayoutObjectId, type HeightModeDef, type ITableThemeDefine } from '../ts-types';
-import type { AnyFunction, CellAddressWithBound, ColumnIconOption, TableEventOptions } from '../ts-types';
+import type { AnyFunction, CellAddressWithBound, ColumnIconOption, ColumnStyleOption, TableEventOptions } from '../ts-types';
 import { TABLE_EVENT_TYPE } from './TABLE_EVENT_TYPE';
 import { EventTarget } from '../event/EventTarget';
 import { NumberMap } from '../tools/NumberMap';
@@ -15,6 +15,7 @@ import type { TooltipOptions } from '../ts-types/tooltip';
 import type { BaseTableAPI, BaseTableConstructorOptions, IBaseTableProtected } from '../ts-types/base-table';
 import { DataSet } from '@visactor/vdataset';
 import { NumberRangeMap } from '../layout/row-height-map';
+import { CustomCellStylePlugin } from '../plugins/custom-cell-style';
 export declare abstract class BaseTable extends EventTarget implements BaseTableAPI {
     internalProps: IBaseTableProtected;
     showFrozenIcon: boolean;
@@ -55,6 +56,7 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
         query?: any;
         callback: AnyFunction;
     }[]>;
+    customCellStylePlugin: CustomCellStylePlugin;
     constructor(container: HTMLElement, options?: BaseTableConstructorOptions);
     throttleInvalidate: (this: any, ...args: any[]) => void;
     getContainer(): HTMLElement;
@@ -360,4 +362,10 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     onVChartEvent(type: string, query: any, callback: AnyFunction): void;
     offVChartEvent(type: string, callback?: AnyFunction): void;
     _bindChartEvent(activeChartInstance: any): void;
+    registerCustomCellStyle(customStyleId: string, customStyle: ColumnStyleOption | undefined | null): void;
+    arrangeCustomCellStyle(cellPos: {
+        col?: number;
+        row?: number;
+        range?: CellRange;
+    }, customStyleId: string): void;
 }

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")), 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_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"), 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"), 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"), {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"), TooltipHandler_1 = require("../components/tooltip/TooltipHandler"), 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"), 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"), 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"), custom_cell_style_1 = require("../plugins/custom-cell-style"), {toBoxArray: toBoxArray} = helper_1.style, {isTouchEvent: isTouchEvent} = helper_1.event, rangeReg = /^\$(\d+)\$(\d+)$/;
 
 (0, style_1.importStyle)();
 
@@ -44,8 +44,8 @@ class BaseTable extends EventTarget_1.EventTarget {
         return TABLE_EVENT_TYPE_1.TABLE_EVENT_TYPE;
     }
     constructor(container, options = {}) {
-        var _a, _b, _c, _d, _e, _f, _g;
-        if (super(), this.showFrozenIcon = !0, this.version = "0.20.4-alpha.1", this.id = `VTable${Date.now()}`, 
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        if (super(), this.showFrozenIcon = !0, this.version = "0.20.4-alpha.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, defaultRowHeight: defaultRowHeight = 40, defaultHeaderRowHeight: defaultHeaderRowHeight, defaultColWidth: defaultColWidth = 80, defaultHeaderColWidth: defaultHeaderColWidth, widthMode: widthMode = "standard", heightMode: heightMode = "standard", autoFillWidth: autoFillWidth = !1, autoFillHeight: autoFillHeight = !1, keyboardOptions: keyboardOptions, eventOptions: eventOptions, 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, mode: mode, modeParams: modeParams, canvasWidth: canvasWidth, canvasHeight: canvasHeight, overscrollBehavior: overscrollBehavior, limitMinWidth: limitMinWidth} = options;
@@ -112,7 +112,7 @@ class BaseTable extends EventTarget_1.EventTarget {
         this.headerStyleCache = new Map, this.bodyStyleCache = new Map, this.bodyBottomStyleCache = new Map, 
         internalProps.stick = {
             changedCells: new Map
-        }, internalProps.customMergeCell = options.customMergeCell;
+        }, internalProps.customMergeCell = options.customMergeCell, this.customCellStylePlugin = new custom_cell_style_1.CustomCellStylePlugin(this, null !== (_h = options.customCellStyle) && void 0 !== _h ? _h : [], null !== (_j = options.customCellStyleArrangement) && void 0 !== _j ? _j : []);
     }
     getContainer() {
         return this.container;
@@ -1143,7 +1143,7 @@ class BaseTable extends EventTarget_1.EventTarget {
     }
     _getCellStyle(col, row) {
         var _a, _b, _c, _d;
-        const {layoutMap: layoutMap} = this.internalProps;
+        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 {
@@ -1151,7 +1151,7 @@ class BaseTable extends EventTarget_1.EventTarget {
                 cacheKey = (null == define ? void 0 : 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 cacheStyle;
+            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)) {
@@ -1190,14 +1190,14 @@ class BaseTable extends EventTarget_1.EventTarget {
                     cellHeaderPaths: this.getCellHeaderPaths(col, row)
                 }, styleClass, this.options.autoWrapText, this.theme);
             }
-            return this.headerStyleCache.set(cacheKey, cacheStyle), cacheStyle;
+            return this.headerStyleCache.set(cacheKey, cacheStyle), customCellStyle ? (0, custom_cell_style_1.mergeStyle)(cacheStyle, customCellStyle) : cacheStyle;
         }
         let cacheKey;
         const cellType = this.getCellType(col, row);
         let cacheStyle;
         if (cacheKey = 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 cacheStyle;
+        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,
@@ -1207,7 +1207,7 @@ class BaseTable extends EventTarget_1.EventTarget {
             dataValue: this.getCellOriginValue(col, row),
             cellHeaderPaths: this.getCellHeaderPaths(col, row)
         }, styleClass, this.options.autoWrapText, this.theme), (0, vutils_1.isFunction)(style) || (layoutMap.isBottomFrozenRow(row) ? this.bodyBottomStyleCache.set(cacheKey, cacheStyle) : this.bodyStyleCache.set(cacheKey, cacheStyle)), 
-        cacheStyle;
+        customCellStyle ? (0, custom_cell_style_1.mergeStyle)(cacheStyle, customCellStyle) : cacheStyle;
     }
     clearCellStyleCache() {
         this.headerStyleCache.clear(), this.bodyStyleCache.clear(), this.bodyBottomStyleCache.clear();
@@ -1553,6 +1553,12 @@ class BaseTable extends EventTarget_1.EventTarget {
             e.query ? activeChartInstance.on(key, e.query, e.callback) : activeChartInstance.on(key, e.callback);
         }));
     }
+    registerCustomCellStyle(customStyleId, customStyle) {
+        this.customCellStylePlugin.registerCustomCellStyle(customStyleId, customStyle);
+    }
+    arrangeCustomCellStyle(cellPos, customStyleId) {
+        this.customCellStylePlugin.arrangeCustomCellStyle(cellPos, customStyleId);
+    }
 }
 
 exports.BaseTable = BaseTable;