@visactor/vtable 1.7.8-alpha.4 → 1.7.8

package/cjs/core/BaseTable.d.ts

@@ -408,6 +408,13 @@ export declare abstract class BaseTable extends EventTarget implements BaseTable
     checkReactCustomLayout(removeAllContainer: () => void): void;
     get bodyDomContainer(): HTMLElement;
     get headerDomContainer(): HTMLElement;
+    get frozenBodyDomContainer(): HTMLElement;
+    get frozenHeaderDomContainer(): HTMLElement;
+    get rightFrozenBodyDomContainer(): HTMLElement;
+    get rightFrozenHeaderDomContainer(): HTMLElement;
+    get frozenBottomDomContainer(): HTMLElement;
+    get bottomDomContainer(): HTMLElement;
+    get rightFrozenBottomDomContainer(): HTMLElement;
     showMoverLine(col: number, row: number): void;
     hideMoverLine(col: number, row: number): void;
     disableScroll(): 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")), 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")), 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"), frozen_react_1 = require("../scenegraph/layout/frozen-react"), {toBoxArray: toBoxArray} = helper_1.style, {isTouchEvent: isTouchEvent} = helper_1.event, rangeReg = /^\$(\d+)\$(\d+)$/;
 
 (0, style_1.importStyle)();
 
@@ -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;
-        if (super(), this.showFrozenIcon = !0, this.version = "1.7.8-alpha.4", this.id = `VTable${Date.now()}`, 
+        if (super(), this.showFrozenIcon = !0, this.version = "1.7.8", 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 && !options.canvas) 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;
@@ -69,10 +69,8 @@ class BaseTable extends EventTarget_1.EventTarget {
         internalProps.canvas = this.options.canvas, internalProps.context = internalProps.canvas.getContext("2d")) : "node" !== env_1.Env.mode && (internalProps.element = (0, 
         tableHelper_1.createRootElement)(this.padding), internalProps.focusControl = new FouseInput_1.FocusInput(this, internalProps.element), 
         internalProps.canvas = document.createElement("canvas"), internalProps.element.appendChild(internalProps.canvas), 
-        internalProps.context = internalProps.canvas.getContext("2d"), (null === (_b = options.customConfig) || void 0 === _b ? void 0 : _b.createReactContainer) && (internalProps.bodyDomContainer = document.createElement("div"), 
-        internalProps.bodyDomContainer.classList.add("table-component-container"), internalProps.element.appendChild(internalProps.bodyDomContainer), 
-        internalProps.headerDomContainer = document.createElement("div"), internalProps.headerDomContainer.classList.add("table-component-container"), 
-        internalProps.element.appendChild(internalProps.headerDomContainer))), internalProps.handler = new EventHandler_1.EventHandler, 
+        internalProps.context = internalProps.canvas.getContext("2d"), (null === (_b = options.customConfig) || void 0 === _b ? void 0 : _b.createReactContainer) && (0, 
+        frozen_react_1.createReactContainer)(this)), internalProps.handler = new EventHandler_1.EventHandler, 
         (0, vutils_1.isNumber)(this.options.resizeTime) && (internalProps.handler.resizeTime = this.options.resizeTime), 
         internalProps.pixelRatio = pixelRatio, internalProps.frozenColCount = frozenColCount, 
         internalProps.frozenRowCount = frozenRowCount, internalProps.defaultRowHeight = defaultRowHeight, 
@@ -374,9 +372,7 @@ class BaseTable extends EventTarget_1.EventTarget {
             heightP = null !== (_e = null === (_d = canvas.parentElement) || void 0 === _d ? void 0 : _d.offsetHeight) && void 0 !== _e ? _e : 0, 
             (null === (_f = null == this ? void 0 : this.scenegraph) || void 0 === _f ? void 0 : _f.stage) ? this.scenegraph.stage.resize(widthP, heightP) : (canvas.style.width = "", 
             canvas.style.height = "", canvas.width = widthP, canvas.height = heightP, canvas.style.width = `${widthP}px`, 
-            canvas.style.height = `${heightP}px`), this.internalProps.bodyDomContainer && (this.internalProps.bodyDomContainer.style.width = `${widthP}px`, 
-            this.internalProps.bodyDomContainer.style.height = `${heightP}px`), this.internalProps.headerDomContainer && (this.internalProps.headerDomContainer.style.width = `${widthP}px`, 
-            this.internalProps.headerDomContainer.style.height = `${heightP}px`);
+            canvas.style.height = `${heightP}px`);
         } else "node" === env_1.Env.mode && (widthP = this.canvasWidth - 1, heightP = this.canvasHeight - 1);
         const width = Math.floor(widthP - style.getVerticalScrollBarSize(this.getTheme().scrollStyle)), height = Math.floor(heightP - style.getHorizontalScrollBarSize(this.getTheme().scrollStyle));
         if (null === (_g = this.internalProps.theme) || void 0 === _g ? void 0 : _g.frameStyle) {
@@ -1706,6 +1702,27 @@ class BaseTable extends EventTarget_1.EventTarget {
     get headerDomContainer() {
         return this.internalProps.headerDomContainer;
     }
+    get frozenBodyDomContainer() {
+        return this.internalProps.frozenBodyDomContainer;
+    }
+    get frozenHeaderDomContainer() {
+        return this.internalProps.frozenHeaderDomContainer;
+    }
+    get rightFrozenBodyDomContainer() {
+        return this.internalProps.rightFrozenBodyDomContainer;
+    }
+    get rightFrozenHeaderDomContainer() {
+        return this.internalProps.rightFrozenHeaderDomContainer;
+    }
+    get frozenBottomDomContainer() {
+        return this.internalProps.frozenBottomDomContainer;
+    }
+    get bottomDomContainer() {
+        return this.internalProps.bottomDomContainer;
+    }
+    get rightFrozenBottomDomContainer() {
+        return this.internalProps.rightFrozenBottomDomContainer;
+    }
     showMoverLine(col, row) {
         this.scenegraph.component.showMoveCol(col, row, 0), this.scenegraph.renderSceneGraph();
     }