@visactor/vtable 1.11.2-alpha.2 → 1.11.2

package/dist/vtable.js

@@ -37638,7 +37638,8 @@
                     });
                     if (renderDefault) {
                         const style = table._getCellStyle(colStart, rowStart);
-                        updateCellContentHeight(singleCellGroup, distHeight, detaY, autoRowHeight, getQuadProps(style.padding), style.textAlign, style.textBaseline, table);
+                        const padding = getQuadProps(getProp('padding', style, col, row, table));
+                        updateCellContentHeight(singleCellGroup, distHeight, detaY, autoRowHeight, padding, style.textAlign, style.textBaseline, table);
                     }
                     const rangeHeight = table.getRowHeight(row);
                     const rangeWidth = table.getColWidth(col);
@@ -37661,7 +37662,8 @@
         }
         else {
             const style = table._getCellStyle(cellGroup.col, cellGroup.row);
-            updateCellContentHeight(cellGroup, distHeight, detaY, autoRowHeight, getQuadProps(style.padding), style.textAlign, style.textBaseline, table);
+            const padding = getQuadProps(getProp('padding', style, cellGroup.col, cellGroup.row, table));
+            updateCellContentHeight(cellGroup, distHeight, detaY, autoRowHeight, padding, style.textAlign, style.textBaseline, table);
         }
     }
 
@@ -38006,7 +38008,7 @@
                     let changed = false;
                     if (renderDefault) {
                         const style = table._getCellStyle(colStart, rowStart);
-                        const padding = getQuadProps(style.padding);
+                        const padding = getQuadProps(getProp('padding', style, col, row, table));
                         const textAlign = style.textAlign;
                         const textBaseline = style.textBaseline;
                         changed = updateCellContentWidth(singleCellGroup, distWidth, cellHeight, detaX, autoRowHeight, padding, textAlign, textBaseline, table.scenegraph);
@@ -38041,7 +38043,7 @@
             return isHeightChange;
         }
         const style = table._getCellStyle(cellGroup.col, cellGroup.row);
-        const padding = getQuadProps(style.padding);
+        const padding = getQuadProps(getProp('padding', style, cellGroup.col, cellGroup.row, table));
         const textAlign = style.textAlign;
         const textBaseline = style.textBaseline;
         return updateCellContentWidth(cellGroup, distWidth, table.getRowHeight(cellGroup.row), detaX, autoRowHeight, padding, textAlign, textBaseline, table.scenegraph);
@@ -49402,6 +49404,18 @@
                 }
             }
         });
+        if (state.table.leftRowSeriesNumberCount === 1) {
+            state.headerCheckedState._vtable_rowSeries_number = false;
+            state._checkboxCellTypeFields.push('_vtable_rowSeries_number');
+            isNeedInitHeaderCheckedStateFromRecord = true;
+        }
+        else if (state.table.leftRowSeriesNumberCount > 1) {
+            for (let i = 0; i < state.table.leftRowSeriesNumberCount; i++) {
+                state.headerCheckedState[`_vtable_rowSeries_number_${i}`] = false;
+                state._checkboxCellTypeFields.push(`_vtable_rowSeries_number_${i}`);
+            }
+            isNeedInitHeaderCheckedStateFromRecord = true;
+        }
         if (isNeedInitHeaderCheckedStateFromRecord) {
             records.forEach((record, index) => {
                 state._checkboxCellTypeFields.forEach(field => {
@@ -49493,30 +49507,49 @@
         }
     }
     function setCellCheckboxState(col, row, checked, table) {
-        const cellGoup = table.scenegraph.getCell(col, row);
-        const chechbox = cellGoup?.getChildByName('checkbox');
-        if (!chechbox) {
+        const cellGroup = table.scenegraph.getCell(col, row);
+        const checkbox = cellGroup?.getChildByName('checkbox');
+        if (!checkbox) {
+            const field = table.getHeaderField(col, row);
+            if (table.isHeader(col, row)) {
+                table.stateManager.setHeaderCheckedState(field, checked);
+                const cellType = table.getCellType(col, row);
+                if (cellType === 'checkbox') {
+                    table.scenegraph.updateCheckboxCellState(col, row, checked);
+                }
+            }
+            else {
+                table.stateManager.setCheckedState(col, row, field, checked);
+                const cellType = table.getCellType(col, row);
+                if (cellType === 'checkbox') {
+                    const oldHeaderCheckedState = table.stateManager.headerCheckedState[field];
+                    const newHeaderCheckedState = table.stateManager.updateHeaderCheckedState(field, col, row);
+                    if (oldHeaderCheckedState !== newHeaderCheckedState) {
+                        table.scenegraph.updateHeaderCheckboxCellState(col, row, newHeaderCheckedState);
+                    }
+                }
+            }
             return;
         }
-        const { checked: oldChecked, indeterminate } = chechbox.attribute;
+        const { checked: oldChecked, indeterminate } = checkbox.attribute;
         if (indeterminate) {
             if (checked) {
-                chechbox._handlePointerUp();
+                checkbox._handlePointerUp();
             }
             else {
-                chechbox._handlePointerUp();
-                chechbox._handlePointerUp();
+                checkbox._handlePointerUp();
+                checkbox._handlePointerUp();
             }
         }
         else if (oldChecked) {
             if (checked) ;
             else {
-                chechbox._handlePointerUp();
+                checkbox._handlePointerUp();
             }
         }
         else {
             if (checked) {
-                chechbox._handlePointerUp();
+                checkbox._handlePointerUp();
             }
         }
     }
@@ -50803,10 +50836,15 @@
                             __value: cellValue,
                             __dataValue: cellOriginValue
                         }, rowData);
-                        const re = /\{\s*(\S+?)\s*\}/g;
-                        url = templateLink.replace(re, (matchs, key) => {
-                            return data[key];
-                        });
+                        if (isFunction$1(templateLink)) {
+                            url = templateLink(data, col, row, table);
+                        }
+                        else {
+                            const re = /\{\s*(\S+?)\s*\}/g;
+                            url = templateLink.replace(re, (matchs, key) => {
+                                return data[key];
+                            });
+                        }
                     }
                     else if (!linkDetect) {
                         url = cellValue;
@@ -53807,6 +53845,10 @@
                 e.stopPropagation();
                 e.preventDefault();
             });
+            this._rootElement?.addEventListener('contextmenu', e => {
+                e.stopPropagation();
+                e.preventDefault();
+            });
             this._rootElement?.addEventListener('touchend', e => {
                 e.stopPropagation();
                 e.preventDefault();
@@ -54067,7 +54109,7 @@
         }
         _canBindToCell(table, col, row) {
             const rect = table.getCellRangeRelativeRect({ col, row });
-            const element = table.getElement();
+            const element = table.internalProps.menu.parentElement ?? table.getElement();
             const { top, bottom, left, right } = rect;
             if (table.isFrozenCell(col, row)) {
                 return true;
@@ -54089,8 +54131,8 @@
         }
         _bindToCell(table, col, row, position, referencePosition) {
             const rootElement = this._rootElement;
-            const element = table.getElement();
-            const { width: containerWidth, height: containerHeight } = table.internalProps.element.getBoundingClientRect();
+            const element = table.internalProps.menu.parentElement ?? table.getElement();
+            const { width: containerWidth, height: containerHeight, left: containerLeft, top: containerTop } = element.getBoundingClientRect();
             if (rootElement) {
                 if (rootElement.parentElement !== element) {
                     element.appendChild(rootElement);
@@ -54119,14 +54161,21 @@
                 if (rootElementTop < 0) {
                     rootElementTop = rootElementTop / 2;
                 }
-                rootElement.style.top = `${rootElementTop}px`;
+                let deltaTop = 0;
+                let deltaLeft = 0;
+                if (table.getElement() !== element) {
+                    const { left, top } = table.getElement().getBoundingClientRect();
+                    deltaTop = top - containerTop;
+                    deltaLeft = left - containerLeft;
+                }
+                rootElement.style.top = `${rootElementTop + deltaTop}px`;
                 if (rootElementLeft < 0) {
                     rootElementLeft = 0;
                 }
                 else if (rootElementLeft * scaleX + rootElementWidth > containerWidth) {
                     rootElementLeft = (containerWidth - rootElementWidth) / scaleX;
                 }
-                rootElement.style.left = `${rootElementLeft}px`;
+                rootElement.style.left = `${rootElementLeft + deltaLeft}px`;
                 return true;
             }
             return false;
@@ -54134,8 +54183,8 @@
         _bindSecondElement(table, col, row, x, y) {
             const secondElement = this._secondElement;
             const rootElement = this._rootElement;
-            const element = table.getElement();
-            const { width: containerWidth, left: containerLeft, top: containerTop } = table.internalProps.element.getBoundingClientRect();
+            const element = table.internalProps.menu.parentElement ?? table.getElement();
+            const { width: containerWidth, left: containerLeft, top: containerTop } = element.getBoundingClientRect();
             const { x: rootLeft, y: rootTop, width: rootWidth } = rootElement.getBoundingClientRect();
             if (secondElement) {
                 if (secondElement.parentElement !== element) {
@@ -55363,15 +55412,21 @@
             this.customCellStyleArrangement = customCellStyleArrangement;
         }
         getCustomCellStyle(col, row) {
-            const customStyleId = this.getCustomCellStyleId(col, row);
-            if (customStyleId) {
-                const styleOption = this.getCustomCellStyleOption(customStyleId);
-                return styleOption?.style;
+            const customStyleIds = this.getCustomCellStyleIds(col, row);
+            if (customStyleIds.length) {
+                const styles = [];
+                customStyleIds.forEach(customStyleId => {
+                    const styleOption = this.getCustomCellStyleOption(customStyleId);
+                    if (styleOption?.style) {
+                        styles.push(styleOption.style);
+                    }
+                });
+                return merge({}, ...styles);
             }
             return undefined;
         }
-        getCustomCellStyleId(col, row) {
-            let customStyleId;
+        getCustomCellStyleIds(col, row) {
+            const customStyleIds = [];
             const range = this.table.getCellRange(col, row);
             for (let c = range.start.col; c <= range.end.col; c++) {
                 for (let r = range.start.row; r <= range.end.row; r++) {
@@ -55381,16 +55436,16 @@
                                 style.cellPosition.range.end.col >= c &&
                                 style.cellPosition.range.start.row <= r &&
                                 style.cellPosition.range.end.row >= r) {
-                                customStyleId = style.customStyleId;
+                                customStyleIds.push(style.customStyleId);
                             }
                         }
                         else if (style.cellPosition.col === c && style.cellPosition.row === r) {
-                            customStyleId = style.customStyleId;
+                            customStyleIds.push(style.customStyleId);
                         }
                     });
                 }
             }
-            return customStyleId;
+            return customStyleIds;
         }
         getCustomCellStyleOption(customStyleId) {
             return this.customCellStyle.find(style => style.id === customStyleId);
@@ -57506,7 +57561,7 @@
             return TABLE_EVENT_TYPE;
         }
         options;
-        version = "1.11.2-alpha.2";
+        version = "1.11.2";
         pagination;
         id = `VTable${Date.now()}`;
         headerStyleCache;
@@ -57683,7 +57738,8 @@
                 parentElement: this.getElement(),
                 renderMode: 'html',
                 isShowOverflowTextTooltip: false,
-                confine: true
+                confine: true,
+                position: Placement.bottom
             }, options.tooltip);
             if (internalProps.tooltip.renderMode === 'html') {
                 const TooltipHandler = Factory.getComponent('tooltipHandler');
@@ -58903,7 +58959,8 @@
                 parentElement: this.getElement(),
                 renderMode: 'html',
                 isShowOverflowTextTooltip: false,
-                confine: true
+                confine: true,
+                position: Placement.bottom
             }, options.tooltip);
             if (internalProps.tooltip.renderMode === 'html' && !internalProps.tooltipHandler) {
                 const TooltipHandler = Factory.getComponent('tooltipHandler');
@@ -61436,17 +61493,17 @@
         handleRowSeriesNumber(rowSeriesNumber) {
             if (rowSeriesNumber) {
                 if (Array.isArray(rowSeriesNumber)) {
-                    this.rowSeriesNumberColumn = rowSeriesNumber.map(seriesNumber => {
+                    this.rowSeriesNumberColumn = rowSeriesNumber.map((seriesNumber, index) => {
                         return {
                             id: this.seqId++,
                             title: seriesNumber.title,
-                            define: seriesNumber,
+                            define: merge({ field: '_vtable_rowSeries_number_' + index }, seriesNumber),
                             cellType: seriesNumber.cellType ?? 'text',
                             headerType: rowSeriesNumber.cellType ?? 'text',
                             style: seriesNumber.style,
                             width: seriesNumber.width,
                             format: seriesNumber.format,
-                            field: seriesNumber.field,
+                            field: seriesNumber.field ?? '_vtable_rowSeries_number_' + index,
                             icon: seriesNumber.icon,
                             headerIcon: seriesNumber.headerIcon,
                             isChildNode: false
@@ -61458,13 +61515,13 @@
                         {
                             id: this.seqId++,
                             title: rowSeriesNumber.title,
-                            define: rowSeriesNumber,
+                            define: merge({ field: '_vtable_rowSeries_number' }, rowSeriesNumber),
                             cellType: rowSeriesNumber.cellType ?? 'text',
                             headerType: rowSeriesNumber.cellType ?? 'text',
                             style: rowSeriesNumber.style,
                             width: rowSeriesNumber.width,
                             format: rowSeriesNumber.format,
-                            field: '',
+                            field: '_vtable_rowSeries_number',
                             icon: rowSeriesNumber.icon,
                             headerIcon: rowSeriesNumber.headerIcon,
                             isChildNode: false
@@ -62106,6 +62163,12 @@
             return this._headerObjectMap[id];
         }
         getHeaderField(col, row) {
+            if (this.isSeriesNumberInHeader(col, row)) {
+                return this.getSeriesNumberHeader(col, row)?.field;
+            }
+            else if (this.isSeriesNumberInBody(col, row)) {
+                return this.getSeriesNumberBody(col, row)?.field;
+            }
             const id = this.getCellId(col, row);
             return (this._headerObjectMap[id]?.field ||
                 (this.transpose
@@ -66063,7 +66126,7 @@
         }
         _canBindToCell(table, col, row) {
             const rect = table.getCellRangeRelativeRect({ col, row });
-            const element = table.getElement();
+            const element = table.internalProps.menu.parentElement ?? table.getElement();
             const { top, bottom, left, right } = rect;
             if (table.isFrozenCell(col, row)) {
                 return true;
@@ -66085,8 +66148,8 @@
         }
         _bindCell(table, col, row, position, referencePosition) {
             const rootElement = this._rootElement;
-            const element = table.getElement();
-            const { width: containerWidth, height: containerHeight } = table.internalProps.element.getBoundingClientRect();
+            const element = table.internalProps.menu.parentElement ?? table.getElement();
+            const { width: containerWidth, height: containerHeight, left: containerLeft, top: containerTop } = element.getBoundingClientRect();
             if (rootElement) {
                 if (rootElement.parentElement !== element) {
                     element.appendChild(rootElement);
@@ -66113,14 +66176,21 @@
                 if (rootElementTop < 0) {
                     rootElementTop = rootElementTop / 2;
                 }
-                rootElement.style.top = `${rootElementTop}px`;
+                let deltaTop = 0;
+                let deltaLeft = 0;
+                if (table.getElement() !== element) {
+                    const { left, top } = table.getElement().getBoundingClientRect();
+                    deltaTop = top - containerTop;
+                    deltaLeft = left - containerLeft;
+                }
+                rootElement.style.top = `${rootElementTop + deltaTop}px`;
                 if (rootElementLeft < 0) {
                     rootElementLeft = 0;
                 }
                 else if (rootElementLeft + rootElementWidth > containerWidth) {
                     rootElementLeft = containerWidth - rootElementWidth;
                 }
-                rootElement.style.left = `${rootElementLeft}px`;
+                rootElement.style.left = `${rootElementLeft + deltaLeft}px`;
                 return true;
             }
             return false;
@@ -67035,7 +67105,7 @@
                 tooltipOption = {
                     content: headerDescription,
                     referencePosition: {
-                        placement: Placement.bottom,
+                        placement: table.internalProps.tooltip.position,
                         rect
                     },
                     disappearDelay: table.internalProps.tooltip.overflowTextTooltipDisappearDelay ?? 0,
@@ -67054,7 +67124,7 @@
   ${overflowText}`
                             : overflowText,
                         referencePosition: {
-                            placement: Placement.bottom,
+                            placement: table.internalProps.tooltip.position,
                             rect
                         },
                         disappearDelay: table.internalProps.tooltip.overflowTextTooltipDisappearDelay ?? 0,
@@ -77166,7 +77236,7 @@
     }
 
     registerForVrender();
-    const version = "1.11.2-alpha.2";
+    const version = "1.11.2";
     function getIcons() {
         return get$2();
     }