@visactor/vtable 0.9.3-alpha.6 → 0.9.3-alpha.7

package/dist/vtable.js

@@ -39137,34 +39137,35 @@
                 fontSize: DEFAULT_TEXT_FONT_SIZE
             },
             getTextBounds: useNaiveCanvas ? undefined : getTextBounds,
-            specialCharSet: `-/: .,@%'"~${TextMeasure.ALPHABET_CHAR_SET}${TextMeasure.ALPHABET_CHAR_SET.toUpperCase()}`,
+            specialCharSet: `{}()//&-/: .,@%'"~${TextMeasure.ALPHABET_CHAR_SET}${TextMeasure.ALPHABET_CHAR_SET.toUpperCase()}`,
             ...(option ?? {})
         }, textSpec);
     };
     const fastTextMeasureCache = new Map();
-    function getFastTextMeasure(fontSize, fontFamily) {
-        const key = `${fontSize}-${fontFamily}`;
+    function getFastTextMeasure(fontSize, fontWeight, fontFamily) {
+        const key = `${fontSize}-${fontWeight}-${fontFamily}`;
         const cache = fastTextMeasureCache.get(key);
         if (cache) {
             return cache;
         }
         const fastTextMeasure = initTextMeasure({
             fontSize,
-            fontFamily
+            fontFamily,
+            fontWeight
         });
         fastTextMeasureCache.set(key, fastTextMeasure);
         return fastTextMeasure;
     }
     class TextMeasureTool {
         measureText(text, options) {
-            const { fontSize, fontFamily } = options;
-            const fastTextMeasure = getFastTextMeasure(fontSize, fontFamily);
+            const { fontSize, fontFamily, fontWeight } = options;
+            const fastTextMeasure = getFastTextMeasure(fontSize, fontWeight, fontFamily);
             const textMeasure = fastTextMeasure.measure(text);
             return textMeasure;
         }
         measureTextWidth(text, options) {
-            const { fontSize, fontFamily = 'sans-serif' } = options;
-            const fastTextMeasure = getFastTextMeasure(fontSize, fontFamily);
+            const { fontSize, fontFamily = 'sans-serif', fontWeight = 'normal' } = options;
+            const fastTextMeasure = getFastTextMeasure(fontSize, fontWeight, fontFamily);
             const textMeasure = fastTextMeasure.measure(text);
             return textMeasure.width;
         }
@@ -39245,7 +39246,7 @@
             let width;
             let str;
             const attribute = this.attribute;
-            const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontSize = textTheme.fontSize, fontFamily = textTheme.fontFamily, stroke = textTheme.stroke, lineHeight = attribute.lineHeight ?? attribute.fontSize ?? textTheme.fontSize, lineWidth = textTheme.lineWidth } = attribute;
+            const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontSize = textTheme.fontSize, fontFamily = textTheme.fontFamily, fontWeight = textTheme.fontWeight, stroke = textTheme.stroke, lineHeight = attribute.lineHeight ?? attribute.fontSize ?? textTheme.fontSize, lineWidth = textTheme.lineWidth } = attribute;
             if (!this.shouldUpdateShape() && this.cache) {
                 width = this.cache.clipedWidth;
                 const dx = textDrawOffsetX(textAlign, width);
@@ -39272,7 +39273,7 @@
                 this.cache.clipedWidth = width;
             }
             else {
-                width = textMeasure.measureTextWidth(text.toString(), { fontSize, fontFamily });
+                width = textMeasure.measureTextWidth(text.toString(), { fontSize, fontFamily, fontWeight });
                 this.cache.clipedText = text.toString();
                 this.cache.clipedWidth = width;
             }
@@ -39287,7 +39288,7 @@
         }
         updateMultilineAABBBounds(text) {
             const textTheme = getTheme(this).text;
-            const { fontFamily = textTheme.fontFamily, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontSize = textTheme.fontSize, lineHeight = this.attribute.lineHeight ?? this.attribute.fontSize ?? textTheme.fontSize, ellipsis = textTheme.ellipsis, maxLineWidth, stroke = textTheme.stroke, lineWidth = textTheme.lineWidth, heightLimit = -1, lineClamp = textTheme.lineClamp, autoWrapText = textTheme.autoWrapText } = this.attribute;
+            const { fontFamily = textTheme.fontFamily, textAlign = textTheme.textAlign, fontWeight = textTheme.fontWeight, textBaseline = textTheme.textBaseline, fontSize = textTheme.fontSize, lineHeight = this.attribute.lineHeight ?? this.attribute.fontSize ?? textTheme.fontSize, ellipsis = textTheme.ellipsis, maxLineWidth, stroke = textTheme.stroke, lineWidth = textTheme.lineWidth, heightLimit = -1, lineClamp = textTheme.lineClamp, autoWrapText = textTheme.autoWrapText } = this.attribute;
             if (!this.shouldUpdateShape() && this.cache?.layoutData) {
                 const bbox = this.cache.layoutData.bbox;
                 this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height);
@@ -39336,7 +39337,7 @@
                         const clip = layoutObj.textMeasure.clipText(str, layoutObj.textOptions, maxLineWidth);
                         if (str !== '' && clip.str === '') {
                             clip.str = str.substring(0, 1);
-                            clip.width = textMeasure.measureTextWidth(clip.str, { fontSize, fontFamily });
+                            clip.width = textMeasure.measureTextWidth(clip.str, { fontSize, fontFamily, fontWeight });
                         }
                         linesLayout.push({
                             str: clip.str,
@@ -40664,6 +40665,9 @@
         let maxHeight = 0;
         for (let col = 0; col < scene.table.colCount; col++) {
             const cell = scene.highPerformanceGetCell(col, row);
+            if (cell.role === 'empty') {
+                return;
+            }
             let cellHeight = getCleanCellHeight(cell, scene);
             const mergeInfo = getCellMergeInfo(scene.table, col, row);
             if (mergeInfo && mergeInfo.end.row - mergeInfo.start.row) {
@@ -40674,6 +40678,9 @@
         for (let col = 0; col < scene.table.colCount; col++) {
             let distHeight = maxHeight;
             const cell = scene.highPerformanceGetCell(col, row);
+            if (cell.role === 'empty') {
+                return;
+            }
             const mergeInfo = getCellMergeInfo(scene.table, col, row);
             if (mergeInfo && mergeInfo.end.row - mergeInfo.start.row) {
                 for (let rowIndex = mergeInfo.start.row; rowIndex <= mergeInfo.end.row; rowIndex++) {
@@ -42337,10 +42344,12 @@
         drawShape(group, context, x, y, doFill, doStroke, fVisible, sVisible, groupAttribute, drawContext, fillCb, strokeCb, doFillOrStroke) {
             if (group.role === 'cell') {
                 const table = group.stage.table;
-                const hoverColor = getCellHoverColor(group, table);
-                if (hoverColor) {
-                    group.oldColor = group.attribute.fill;
-                    group.attribute.fill = hoverColor;
+                if (table.stateManeger.interactionState !== InteractionState.scrolling) {
+                    const hoverColor = getCellHoverColor(group, table);
+                    if (hoverColor) {
+                        group.oldColor = group.attribute.fill;
+                        group.attribute.fill = hoverColor;
+                    }
                 }
             }
         }
@@ -42743,6 +42752,7 @@
                     }
                     labelWidth = Math.max(labelWidth, table.measureText(text, {
                         fontSize: attribute.label?.style?.fontSize,
+                        fontWeight: attribute.label?.style?.fontWeight,
                         fontFamily: attribute.label?.style?.fontFamily
                     }).width);
                 });
@@ -42759,6 +42769,7 @@
                     }
                     labelWidth = Math.max(labelWidth, table.measureText(text, {
                         fontSize: attribute.label?.style?.fontSize,
+                        fontWeight: attribute.label?.style?.fontWeight,
                         fontFamily: attribute.label?.style?.fontFamily
                     }).width + 2);
                 });
@@ -42771,6 +42782,7 @@
                 titleWidth =
                     table.measureText(attribute.title.text, {
                         fontSize: attribute.title?.style?.fontSize,
+                        fontWeight: attribute.title?.style?.fontWeight,
                         fontFamily: attribute.title?.style?.fontFamily
                     }).height + 2;
             }
@@ -42778,6 +42790,7 @@
                 titleWidth =
                     table.measureText(attribute.title.text, {
                         fontSize: attribute.title?.style?.fontSize,
+                        fontWeight: attribute.title?.style?.fontWeight,
                         fontFamily: attribute.title?.style?.fontFamily
                     }).width + 2;
             }
@@ -42848,6 +42861,7 @@
     }
 
     function computeColsWidth(table, colStart, colEnd, update) {
+        typeof window !== 'undefined' ? window.performance.now() : 0;
         colStart = colStart ?? 0;
         colEnd = colEnd ?? table.colCount - 1;
         if (colStart === 0 && colEnd === table.colCount - 1) {
@@ -43127,12 +43141,14 @@
         const paddingWidth = padding[1] + padding[3];
         const fontSize = getProp('fontSize', actStyle, col, row, table);
         const fontFamily = getProp('fontFamily', actStyle, col, row, table);
+        const fontWeight = getProp('fontWeight', actStyle, col, row, table);
         const lines = validToString(cellValue).split('\n') || [];
         if (lines.length >= 1) {
             lines.forEach((line) => {
                 const width = table.measureText(line.slice(0, table.options.maxCharactersNumber || 200), {
                     fontSize,
-                    fontFamily
+                    fontFamily,
+                    fontWeight
                 }).width;
                 maxWidth = Math.max((width + paddingWidth + 4 + iconWidth) / spanCol, maxWidth);
             });
@@ -43164,19 +43180,14 @@
         height: 0,
         textConfig: []
     });
-    function computeRowsHeight(table, rowStart, rowEnd) {
-        const time = typeof window !== 'undefined' ? window.performance.now() : 0;
+    function computeRowsHeight(table, rowStart, rowEnd, isClearRowRangeHeightsMap = true) {
+        typeof window !== 'undefined' ? window.performance.now() : 0;
         if (table.heightMode === 'autoHeight' || table.heightMode === 'adaptive') {
             rowStart = rowStart ?? 0;
             rowEnd = rowEnd ?? table.rowCount - 1;
-            if (rowStart === 0 && rowEnd === table.rowCount - 1) {
+            if ((rowStart === 0 && rowEnd === table.rowCount - 1) || isClearRowRangeHeightsMap) {
                 table._clearRowRangeHeightsMap();
             }
-            else {
-                for (let row = rowStart; row <= rowEnd; row++) {
-                    table._clearRowRangeHeightsMap(row);
-                }
-            }
             for (let row = rowStart; row < table.columnHeaderLevelCount; row++) {
                 const height = computeRowHeight(row, 0, table.colCount - 1, table);
                 table.setRowHeight(row, height);
@@ -43184,24 +43195,31 @@
             if (rowEnd < table.columnHeaderLevelCount) {
                 return;
             }
-            if (!table.internalProps.transpose &&
-                !(table.isPivotTable() && table.internalProps.layoutMap.indicatorsAsCol) &&
+            if (!(table.internalProps.transpose ||
+                (table.isPivotTable() && !table.internalProps.layoutMap.indicatorsAsCol)) &&
                 checkFixedStyleAndNoWrap(table)) {
                 const height = computeRowHeight(table.columnHeaderLevelCount, 0, table.colCount - 1, table);
-                fillRowsHeight(height, table.columnHeaderLevelCount, table.rowCount - 1, table);
+                fillRowsHeight(height, table.columnHeaderLevelCount, table.rowCount - 1 - table.bottomFrozenRowCount, table);
+                for (let row = table.rowCount - table.bottomFrozenRowCount; row <= rowEnd; row++) {
+                    const height = computeRowHeight(row, 0, table.colCount - 1, table);
+                    table.setRowHeight(row, height);
+                }
             }
-            else if ((table.internalProps.transpose ||
-                (table.isPivotTable() && !table.internalProps.layoutMap.indicatorsAsCol)) &&
-                checkFixedStyleAndNoWrap(table)) {
+            else if (table.internalProps.transpose ||
+                (table.isPivotTable() && !table.internalProps.layoutMap.indicatorsAsCol)) {
                 for (let row = Math.max(rowStart, table.columnHeaderLevelCount); row <= rowEnd; row++) {
-                    table._clearRowRangeHeightsMap(row);
-                    const height = computeRowHeight(row, 0, table.rowHeaderLevelCount, table);
+                    let height;
+                    if (checkFixedStyleAndNoWrapForTranspose(table, row)) {
+                        height = computeRowHeight(row, 0, table.rowHeaderLevelCount, table);
+                    }
+                    else {
+                        height = computeRowHeight(row, 0, table.colCount - 1, table);
+                    }
                     table.setRowHeight(row, height);
                 }
             }
             else {
                 for (let row = Math.max(rowStart, table.columnHeaderLevelCount); row <= rowEnd; row++) {
-                    table._clearRowRangeHeightsMap(row);
                     const height = computeRowHeight(row, 0, table.colCount - 1, table);
                     table.setRowHeight(row, height);
                 }
@@ -43227,7 +43245,6 @@
                 table.setRowHeight(row, rowHeight, false);
             }
         }
-        console.log('computeRowsHeight  time:', (typeof window !== 'undefined' ? window.performance.now() : 0) - time);
     }
     function computeRowHeight(row, startCol, endCol, table) {
         let maxHeight = 0;
@@ -43269,14 +43286,16 @@
     function checkFixedStyleAndNoWrap(table) {
         const { layoutMap } = table.internalProps;
         const row = table.columnHeaderLevelCount;
+        if (table.internalProps.autoWrapText &&
+            (table.options.heightMode === 'autoHeight' || table.options.heightMode === 'adaptive')) {
+            return false;
+        }
         for (let col = 0; col < table.colCount; col++) {
-            const isHeader = layoutMap.isHeader(col, row);
-            const cellDefine = isHeader ? layoutMap.getHeader(col, row) : layoutMap.getBody(col, row);
+            const cellDefine = layoutMap.getBody(col, row);
             if (typeof cellDefine.style === 'function' ||
                 typeof cellDefine.icon === 'function' ||
-                typeof cellDefine.headerIcon === 'function' ||
-                (isHeader ? cellDefine.define?.headerCustomRender : cellDefine.define?.customRender) ||
-                (isHeader ? typeof cellDefine.define?.headerIcon === 'function' : typeof cellDefine.define?.icon === 'function')) {
+                cellDefine.define?.customRender ||
+                typeof cellDefine.define?.icon === 'function') {
                 return false;
             }
             const cellStyle = table._getCellStyle(col, row);
@@ -43289,6 +43308,28 @@
         }
         return true;
     }
+    function checkFixedStyleAndNoWrapForTranspose(table, row) {
+        const { layoutMap } = table.internalProps;
+        if (table.internalProps.autoWrapText &&
+            (table.options.heightMode === 'autoHeight' || table.options.heightMode === 'adaptive')) {
+            return false;
+        }
+        const cellDefine = layoutMap.getBody(table.rowHeaderLevelCount, row);
+        if (typeof cellDefine.style === 'function' ||
+            typeof cellDefine.icon === 'function' ||
+            cellDefine.define?.customRender ||
+            typeof cellDefine.define?.icon === 'function') {
+            return false;
+        }
+        const cellStyle = table._getCellStyle(table.rowHeaderLevelCount, row);
+        if (typeof cellStyle.padding === 'function' ||
+            typeof cellStyle.fontSize === 'function' ||
+            typeof cellStyle.lineHeight === 'function' ||
+            cellStyle.autoWrapText === true) {
+            return false;
+        }
+        return true;
+    }
     function fillRowsHeight(height, startRow, endRow, table) {
         for (let row = startRow; row <= endRow; row++) {
             table.setRowHeight(row, height);
@@ -44127,6 +44168,9 @@
         colGroup.needUpdate = true;
     }
     function updateColGroupContent(colGroup, proxy) {
+        if (!colGroup) {
+            return;
+        }
         let cellGroup = colGroup.firstChild;
         while (cellGroup) {
             const newCellGroup = proxy.updateCellGroupContent(cellGroup);
@@ -44308,9 +44352,7 @@
                 syncTopRow = Math.max(distStartRow, topRow);
                 syncBottomRow = Math.min(distEndRow, BottomRow);
             }
-            if (proxy.table.heightMode === 'autoHeight') {
-                computeRowsHeight(proxy.table, syncTopRow, syncBottomRow);
-            }
+            computeRowsHeight(proxy.table, syncTopRow, syncBottomRow);
             proxy.rowStart = direction === 'up' ? proxy.rowStart + count : proxy.rowStart - count;
             proxy.rowEnd = direction === 'up' ? proxy.rowEnd + count : proxy.rowEnd - count;
             checkFirstRowMerge(syncTopRow, proxy);
@@ -44346,9 +44388,7 @@
                 syncTopRow = Math.max(proxy.bodyTopRow, screenTopRow - proxy.screenRowCount * 1);
                 syncBottomRow = Math.min(proxy.bodyBottomRow, screenTopRow + proxy.screenRowCount * 2);
             }
-            if (proxy.table.heightMode === 'autoHeight') {
-                computeRowsHeight(proxy.table, syncTopRow, syncBottomRow);
-            }
+            computeRowsHeight(proxy.table, syncTopRow, syncBottomRow);
             proxy.rowStart = distStartRow;
             proxy.rowEnd = distEndRow;
             checkFirstRowMerge(syncTopRow, proxy);
@@ -44566,26 +44606,6 @@
         async createGroupForFirstScreen(cornerHeaderGroup, colHeaderGroup, rowHeaderGroup, rightFrozenGroup, bottomFrozenGroup, bodyGroup, xOrigin, yOrigin) {
             await createGroupForFirstScreen(cornerHeaderGroup, colHeaderGroup, rowHeaderGroup, rightFrozenGroup, bottomFrozenGroup, bodyGroup, xOrigin, yOrigin, this);
         }
-        async createColGroupForFirstScreen(rowHeaderGroup, bodyGroup, xOrigin, yOrigin, table) {
-            this.setParamsForRow();
-            this.setParamsForColumn();
-            computeRowsHeight(table, this.table.columnHeaderLevelCount, Math.min(this.firstScreenRowLimit, table.rowCount - 1));
-            createColGroup(rowHeaderGroup, xOrigin, yOrigin, 0, table.rowHeaderLevelCount - 1, table.columnHeaderLevelCount, table.rowCount - 1, 'rowHeader', table, this.firstScreenRowLimit);
-            createColGroup(bodyGroup, xOrigin, yOrigin, table.rowHeaderLevelCount, table.colCount - 1, table.columnHeaderLevelCount, table.rowCount - 1, 'body', table, this.firstScreenRowLimit);
-            if (!bodyGroup.firstChild) {
-                this.currentRow = this.totalRow;
-                this.rowEnd = this.currentRow;
-                this.rowUpdatePos = this.rowEnd;
-                this.referenceRow = Math.floor((this.rowEnd - this.rowStart) / 2);
-            }
-            else {
-                this.currentRow = bodyGroup.firstChild?.rowNumber ?? this.totalRow;
-                this.rowEnd = this.currentRow;
-                this.rowUpdatePos = this.rowEnd;
-                this.referenceRow = Math.floor((this.rowEnd - this.rowStart) / 2);
-                await this.progress();
-            }
-        }
         async progress() {
             return new Promise((resolve, reject) => {
                 setTimeout(async () => {
@@ -44625,7 +44645,7 @@
         }
         createRowCellGroup(onceCount) {
             const endRow = Math.min(this.totalRow, this.currentRow + onceCount);
-            computeRowsHeight(this.table, this.currentRow + 1, endRow);
+            computeRowsHeight(this.table, this.currentRow + 1, endRow, false);
             if (this.table.rowHeaderLevelCount) {
                 let maxHeight = 0;
                 for (let col = 0; col < this.table.rowHeaderLevelCount; col++) {
@@ -44731,7 +44751,7 @@
         updateCellGroups(count) {
             const distRow = Math.min(this.bodyBottomRow, this.rowUpdatePos + count);
             if (this.table.heightMode === 'autoHeight') {
-                computeRowsHeight(this.table, this.rowUpdatePos, distRow);
+                computeRowsHeight(this.table, this.rowUpdatePos, distRow, false);
             }
             updateRowContent(this.rowUpdatePos, distRow, this);
             if (this.table.heightMode === 'autoHeight') {
@@ -44780,9 +44800,7 @@
                 syncBottomRow = Math.min(this.bodyBottomRow, this.screenTopRow + this.screenRowCount * 3);
             }
             console.log('sort更新同步范围', syncTopRow, syncBottomRow);
-            if (this.table.heightMode === 'autoHeight') {
-                computeRowsHeight(this.table, syncTopRow, syncBottomRow);
-            }
+            computeRowsHeight(this.table, syncTopRow, syncBottomRow);
             for (let col = this.bodyLeftCol; col <= this.bodyRightCol; col++) {
                 for (let row = syncTopRow; row <= syncBottomRow; row++) {
                     const cellGroup = this.highPerformanceGetCell(col, row);
@@ -46217,9 +46235,7 @@
         }
         resize() {
             this.recalculateColWidths();
-            if (this.table.heightMode === 'autoHeight') {
-                this.recalculateRowHeights();
-            }
+            this.recalculateRowHeights();
             this.dealWidthMode();
             this.dealHeightMode();
             this.dealFrozen();
@@ -46735,9 +46751,7 @@
         updateRow(removeCells, addCells) {
             updateRow(removeCells, addCells, this.table);
             this.recalculateColWidths();
-            if (this.table.heightMode === 'autoHeight') {
-                this.recalculateRowHeights();
-            }
+            this.recalculateRowHeights();
             this.table.stateManeger.checkFrozen();
             this.updateNextFrame();
         }
@@ -47474,6 +47488,9 @@
         sparkLine;
         _clearVerticalScrollBar;
         _clearHorizontalScrollBar;
+        resetInteractionState = debounce(() => {
+            this.updateInteractionState(InteractionState.default);
+        }, 100);
         constructor(table) {
             this.table = table;
             this.initState();
@@ -48763,10 +48780,16 @@
         const throttleVerticalWheel = throttle(stateManeger.updateVerticalScrollBar, 20);
         const throttleHorizontalWheel = throttle(stateManeger.updateHorizontalScrollBar, 20);
         scenegraph.component.vScrollBar.addEventListener('scroll', (e) => {
+            if (stateManeger.interactionState !== InteractionState.scrolling) {
+                stateManeger.updateInteractionState(InteractionState.scrolling);
+            }
             const ratio = e.detail.value[0] / (1 - e.detail.value[1] + e.detail.value[0]);
             throttleVerticalWheel(ratio, e);
         });
         scenegraph.component.hScrollBar.addEventListener('scroll', (e) => {
+            if (stateManeger.interactionState !== InteractionState.scrolling) {
+                stateManeger.updateInteractionState(InteractionState.scrolling);
+            }
             const ratio = e.detail.value[0] / (1 - e.detail.value[1] + e.detail.value[0]);
             throttleHorizontalWheel(ratio);
         });
@@ -48779,6 +48802,11 @@
             deltaY = 0;
         }
         const [optimizedDeltaX, optimizedDeltaY] = optimizeScrollXY(deltaX, deltaY, { horizontal: 1, vertical: 1 });
+        if (optimizedDeltaX || optimizedDeltaY) {
+            if (state.interactionState !== InteractionState.scrolling) {
+                state.updateInteractionState(InteractionState.scrolling);
+            }
+        }
         if (optimizedDeltaX) {
             state.setScrollLeft(state.scroll.horizontalBarPos + optimizedDeltaX);
             state.showHorizontalScrollBar(true);
@@ -48787,6 +48815,7 @@
             state.setScrollTop(state.scroll.verticalBarPos + optimizedDeltaY);
             state.showVerticalScrollBar(true);
         }
+        state.resetInteractionState();
         if (event.cancelable &&
             ((deltaY !== 0 && isVerticalScrollable(deltaY, state)) || (deltaX !== 0 && isHorizontalScrollable(deltaX, state)))) {
             event.preventDefault();
@@ -48876,7 +48905,7 @@
         handler.on(table.getElement(), 'contextmenu', (e) => {
             e.preventDefault();
         });
-        handler.on(table.getParentElement(), 'resize', () => {
+        handler.on(table.getContainer(), 'resize', () => {
             table.resize();
         });
     }
@@ -51936,15 +51965,21 @@
             return TABLE_EVENT_TYPE;
         }
         options;
-        version = "0.9.3-alpha.6";
+        version = "0.9.3-alpha.7";
         pagerConf;
         id = `VTable${Date.now()}`;
         headerStyleCache;
         bodyStyleCache;
-        constructor(options = {}) {
+        container;
+        constructor(container, options = {}) {
             super();
-            const { frozenColCount = 0, defaultRowHeight = 40, defaultHeaderRowHeight, defaultColWidth = 80, defaultHeaderColWidth, widthMode = 'standard', heightMode = 'standard', autoFillWidth = false, keyboardOptions, parentElement, columnResizeMode, dragHeaderMode, showFrozenIcon, allowFrozenColCount, padding, hover, menu, select: click, customRender, pixelRatio = defaultPixelRatio } = options;
+            if (!container) {
+                throw new Error("vtable's container is undefined");
+            }
+            const { frozenColCount = 0, defaultRowHeight = 40, defaultHeaderRowHeight, defaultColWidth = 80, defaultHeaderColWidth, widthMode = 'standard', heightMode = 'standard', autoFillWidth = false, keyboardOptions, columnResizeMode, dragHeaderMode, showFrozenIcon, allowFrozenColCount, padding, hover, menu, select: click, customRender, pixelRatio = defaultPixelRatio } = options;
+            this.container = container;
             this.options = options;
+            this.options.container = container;
             this._widthMode = widthMode;
             this._heightMode = heightMode;
             this._autoFillWidth = autoFillWidth;
@@ -52001,9 +52036,9 @@
             internalProps.cellTextOverflows = {};
             internalProps.focusedTable = false;
             internalProps.theme = themes.of(options.theme ?? themes.DEFAULT);
-            if (parentElement) {
-                parentElement.innerHTML = '';
-                parentElement.appendChild(internalProps.element);
+            if (container) {
+                container.innerHTML = '';
+                container.appendChild(internalProps.element);
                 this._updateSize();
             }
             else {
@@ -52056,8 +52091,8 @@
             this.bodyStyleCache = new Map();
         }
         throttleInvalidate = throttle2(this.render.bind(this), 200);
-        getParentElement() {
-            return this.options.parentElement;
+        getContainer() {
+            return this.container;
         }
         getElement() {
             return this.internalProps.element;
@@ -52378,12 +52413,6 @@
                 this._clearRowRangeHeightsMap(row);
             }
         }
-        fillRowsHeight(rowStart, rowEnd, rowHeight) {
-            for (let row = rowStart; row <= rowEnd; row++) {
-                this.rowHeightsMap.put(row, Math.round(rowHeight));
-                this._rowRangeHeightsMap.set(`$0$${row}`, Math.round((this._rowRangeHeightsMap.get(`$0$${row - 1}`) ?? 0) + rowHeight));
-            }
-        }
         getRowsHeight(startRow, endRow) {
             const cachedRowHeight = this._rowRangeHeightsMap.get(`$${startRow}$${endRow}`);
             if (cachedRowHeight !== null && cachedRowHeight !== undefined) {
@@ -54830,8 +54859,17 @@
 
     class ListTable extends BaseTable {
         showHeader = true;
-        constructor(options = {}) {
-            super(options);
+        constructor(container, options) {
+            if (!(container instanceof HTMLElement)) {
+                options = container;
+                if (container.container) {
+                    container = container.container;
+                }
+                else {
+                    container = null;
+                }
+            }
+            super(container, options);
             const internalProps = this.internalProps;
             this.pagerConf = options.pagerConf;
             internalProps.sortState = options.sortState;
@@ -59397,8 +59435,17 @@
         pivotSortState;
         dataset;
         flatDataToObjects;
-        constructor(options) {
-            super(options);
+        constructor(container, options) {
+            if (!(container instanceof HTMLElement)) {
+                options = container;
+                if (container.container) {
+                    container = container.container;
+                }
+                else {
+                    container = null;
+                }
+            }
+            super(container, options);
             if (options.layout) {
                 Object.assign(options, options.layout);
             }
@@ -59838,8 +59885,17 @@
         _selectedDimensionInChart = [];
         _chartEventMap = {};
         _axes;
-        constructor(options) {
-            super(options);
+        constructor(container, options) {
+            if (!(container instanceof HTMLElement)) {
+                options = container;
+                if (container.container) {
+                    container = container.container;
+                }
+                else {
+                    container = null;
+                }
+            }
+            super(container, options);
             if (options.layout) {
                 Object.assign(options, options.layout);
             }
@@ -60412,11 +60468,11 @@
             });
         }
         onVChartEvent(type, query, callback) {
-            if (query) {
-                this._chartEventMap[type] = { callback, query };
+            if (typeof query === 'function') {
+                this._chartEventMap[type] = { callback: query };
             }
             else {
-                this._chartEventMap[type] = { callback };
+                this._chartEventMap[type] = { callback, query };
             }
         }
         offVChartEvent(type) {
@@ -61053,6 +61109,7 @@
         getSize(table) {
             const { width, height } = table.measureText(this.text, {
                 fontSize: this.fontSize,
+                fontWeight: this.fontWeight,
                 fontFamily: this.fontFamily
             });
             this.width = width;
@@ -61111,7 +61168,7 @@
         percentCalc: percentCalc
     });
 
-    const version = "0.9.3-alpha.6";
+    const version = "0.9.3-alpha.7";
     function getIcons() {
         return get$1();
     }