@talrace/ngx-noder 19.0.67 → 19.0.69

package/fesm2022/talrace-ngx-noder.mjs

@@ -489,6 +489,15 @@ class FormatStyleHelper {
     }
 }
 
+class FontMetric {
+    constructor(width, ascent, descent) {
+        this.width = width;
+        this.ascent = ascent;
+        this.descent = descent;
+        this.height = ascent + descent;
+    }
+}
+
 class FontMetrics {
     static { this.storageKey = 'metrics'; }
     static { this.versionKey = 'editorVersion'; }
@@ -515,7 +524,7 @@ class FontMetrics {
             this.fontStringMap[contentStyle] = identifier;
         }
         this.metrics[identifier] ??= {};
-        if (!this.metrics[identifier][ch] || isNaN(this.metrics[identifier][ch].font)) {
+        if (!this.metrics[identifier][ch]) {
             this.metrics[identifier][ch] = this.calculateCanvas(ch, contentStyle);
             localStorage.setItem(this.storageKey, JSON.stringify(this.metrics));
         }
@@ -523,53 +532,10 @@ class FontMetrics {
     }
     static calculateCanvas(ch, contentStyle) {
         this.canvasNode ||= document.createElement('canvas');
-        const fontBaseLine = this.fontBaseline(contentStyle, ch);
         const context = this.canvasNode.getContext('2d');
         context.font = contentStyle;
-        const textMetrics = context.measureText(ch);
-        return {
-            width: textMetrics.width,
-            height: textMetrics.fontBoundingBoxAscent + textMetrics.fontBoundingBoxDescent,
-            font: fontBaseLine.font,
-            ascent: textMetrics.fontBoundingBoxAscent,
-            descent: textMetrics.fontBoundingBoxDescent
-        };
-    }
-    static fontBaseline(contentStyle, text) {
-        const container = document.body;
-        this.measureDiv ||= document.createElement('div');
-        this.strut ||= document.createElement('span');
-        if (text === ' ') {
-            text = 'X';
-        }
-        this.measureDiv.style.font = contentStyle;
-        this.measureDiv.style.lineHeight = '1';
-        this.measureDiv.style.position = 'absolute';
-        this.measureDiv.style.visibility = 'hidden';
-        this.measureDiv.style.margin = '0';
-        this.measureDiv.style.padding = '0';
-        this.measureDiv.innerHTML = text;
-        this.strut.style.fontSize = '0';
-        this.strut.style.verticalAlign = 'baseline';
-        this.strut.style.padding = '0 10px';
-        this.measureDiv.classList.add('font-baseline');
-        this.measureDiv.appendChild(this.strut);
-        container.appendChild(this.measureDiv);
-        const computedStyle = window.getComputedStyle(this.measureDiv);
-        const fontSize = parseFloat(computedStyle.fontSize);
-        const baselineHeight = fontSize - this.strut.offsetTop;
-        const strutHeight = this.measureDiv.offsetHeight;
-        const lineHeight = parseFloat(computedStyle.lineHeight) || this.measureDiv.offsetHeight;
-        this.measureDiv.parentNode.removeChild(this.measureDiv);
-        this.measureDiv.innerHTML = '';
-        this.strut.innerHTML = '';
-        return {
-            baseline: baselineHeight,
-            content: strutHeight,
-            font: fontSize,
-            line: lineHeight,
-            multiplier: fontSize / baselineHeight
-        };
+        const metric = context.measureText(ch);
+        return new FontMetric(metric.width, metric.fontBoundingBoxAscent, metric.fontBoundingBoxDescent);
     }
 }
 
@@ -1154,8 +1120,8 @@ class EditorService {
     changeImageStyle(value) {
         this._changeImageStyle$.next(value);
     }
-    rerender(index = 0) {
-        this._rerender$.next(index);
+    rerender(index, sessionId) {
+        this._rerender$.next({ index, sessionId });
     }
     createCustomComponent(model) {
         this._createCustomComponent$.next(model);
@@ -1418,7 +1384,7 @@ class BaseNoderComponent extends DestroyComponent {
         return [];
     }
     rerender() {
-        this.editorService.rerender(this.insertIndex);
+        this.editorService.rerender(this.insertIndex, this.sessionId);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: BaseNoderComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.5", type: BaseNoderComponent, isStandalone: true, inputs: { content: "content", sessionId: "sessionId", contentWidth: "contentWidth", generalProperties: "generalProperties" }, host: { properties: { "class.focused": "this.focused", "attr.data-session-id": "this.sessionId", "attr.data-insert-index": "this.insertIndex" } }, usesInheritance: true, ngImport: i0 }); }
@@ -7456,15 +7422,14 @@ class DisplayTokenHelper {
             }
             return result;
         }
-        return [this.getComponentToken(component, fontString, index)];
+        return [this.getComponentToken(component, index)];
     }
-    static getComponentToken(component, fontString, index) {
+    static getComponentToken(component, index) {
         const ascent = component.instance.ascent() ?? 0;
         const descent = component.instance.descent() ?? 0;
         return new DisplayToken({
             width: component.instance.width(),
             height: ascent + descent,
-            font: FontMetrics.measureCharSize('0', fontString).font,
             ascent,
             descent,
             displayValue: this.getComponentDisplayValue(component.instance),
@@ -7472,7 +7437,7 @@ class DisplayTokenHelper {
         });
     }
     static getTableTokens(component, fontString, index, withNumbering) {
-        const tableToken = this.getComponentToken(component, fontString, index);
+        const tableToken = this.getComponentToken(component, index);
         if (!withNumbering) {
             return [tableToken];
         }
@@ -8257,9 +8222,6 @@ class DisplayData extends EventEmitting {
     getParagraphContent(index) {
         return this.paragraphs[index]?.content || '';
     }
-    getAllParagraphsContent() {
-        return this.paragraphs.map(x => x.content);
-    }
     getParagraphSettings(index) {
         return this.paragraphs[index]?.paragraphSettings || null;
     }
@@ -8278,48 +8240,18 @@ class DisplayData extends EventEmitting {
     getTextRange(range) {
         return this.getParagraphsContentForRange(range).join(NEW_LINE_MARKUP);
     }
-    positionToIndex(position, startRow = 0) {
-        let index = 0;
-        const endRow = Math.min(position.row, this.paragraphs.length);
-        for (let i = startRow || 0; i < endRow; i++) {
-            index += this.paragraphs[i].content.length + 1;
-        }
-        return index + position.column;
+    positionToIndex(position) {
+        return this.paragraphs[position.row].startIndex + position.column;
     }
-    indexToPosition(positionIndex, startRow) {
-        const newlineLength = NEW_LINE_MARKUP.length;
-        for (let lineIndex = startRow || 0; lineIndex < this.paragraphs.length; lineIndex++) {
-            positionIndex -= this.paragraphs[lineIndex].content.length + newlineLength;
-            if (positionIndex < 0) {
-                const column = positionIndex + this.paragraphs[lineIndex].content.length + newlineLength;
-                return new CursorParagraph(lineIndex, column);
-            }
-        }
-        const column = positionIndex + this.paragraphs[this.paragraphs.length - 1].content.length + newlineLength;
-        return new CursorParagraph(this.paragraphs.length - 1, column);
+    indexToPosition(positionIndex) {
+        const paragraph = this.paragraphs.findLastIndex(x => x.startIndex <= positionIndex);
+        return new CursorParagraph(paragraph, positionIndex - this.paragraphs[paragraph].startIndex);
     }
     indexesToRange(startIndex, endIndex) {
-        const startPoint = this.indexToPosition(startIndex, 0);
-        const endPoint = this.indexToPosition(endIndex, 0);
+        const startPoint = this.indexToPosition(startIndex);
+        const endPoint = this.indexToPosition(endIndex);
         return new Range(startPoint, endPoint);
     }
-    getSelectedParagraphsByRange(range) {
-        const newlineLength = NEW_LINE_MARKUP.length;
-        let start = 0;
-        let end = 0;
-        let i;
-        const row = Math.min(range.end.row, this.paragraphs.length - 1);
-        for (i = 0; i < row; i++) {
-            if (i < range.start.row) {
-                start += this.paragraphs[i].content.length + newlineLength;
-            }
-            end += this.paragraphs[i].content.length + newlineLength;
-        }
-        if (i < this.paragraphs.length) {
-            end += this.paragraphs[i].content.length;
-        }
-        return { start, end };
-    }
     getPositionAfterBreak(position, breakType) {
         if (breakType === BreakTypes.TextWrapping) {
             return position;
@@ -9833,7 +9765,7 @@ class EditSession {
         const imageComponentRef = this.customComponents.images.find(x => x.instance.insertIndex === applyImage.insertIndex);
         imageComponentRef.instance.resize({ width: applyImage.width, height: applyImage.height });
         OperationsHelper.applyImageStyle(this.model, applyImage);
-        const start = this.displayData.indexToPosition(applyImage.insertIndex, 0);
+        const start = this.displayData.indexToPosition(applyImage.insertIndex);
         this.displayData.updateNextLineIndexes(start.row, this.displayData.paragraphs.length - 1);
     }
     restoreTextStyles(formats, linkFormats) {
@@ -10044,8 +9976,8 @@ class EditSession {
     }
     removeMoveRange(moveModel) {
         const endIndex = moveModel.sourceStartIndex + moveModel.sourceCount - 1;
-        const startPosition = this.displayData.indexToPosition(moveModel.sourceStartIndex, 0);
-        const endPosition = this.displayData.indexToPosition(endIndex + 1, 0);
+        const startPosition = this.displayData.indexToPosition(moveModel.sourceStartIndex);
+        const endPosition = this.displayData.indexToPosition(endIndex + 1);
         const sourceRange = new Range(startPosition, endPosition);
         this.displayData.removeRange(sourceRange);
         CustomComponentHelper.applyRemovingComponents(this.customComponents.tables, moveModel.sourceStartIndex, endIndex);
@@ -10070,8 +10002,8 @@ class EditSession {
         this.displayData.updateNextLineIndexes(startPosition.row, endPosition.row);
         this.selection.placeCursor(endPosition);
         this.applyToolbarStyles();
-        const newStartPosition = this.displayData.indexToPosition(moveIndex, 0);
-        const newEndPosition = this.displayData.indexToPosition(moveIndex + moveModel.sourceCount, 0);
+        const newStartPosition = this.displayData.indexToPosition(moveIndex);
+        const newEndPosition = this.displayData.indexToPosition(moveIndex + moveModel.sourceCount);
         return new Range(newStartPosition, newEndPosition);
     }
     isPositionInRange(position, range) {
@@ -12619,7 +12551,7 @@ class RegulatorService {
         });
     }
     getSessionModel(sessionId) {
-        return this.sessions.find(x => x.sessionId === sessionId);
+        return this.currentSession.sessionId === sessionId ? this.currentSession : this.sessions.find(x => x.sessionId === sessionId);
     }
     getSession(sessionId) {
         return this.getSessionModel(sessionId).session;
@@ -12752,6 +12684,9 @@ class RegulatorService {
             }
         });
     }
+    rerender(index, sessionId) {
+        this.getSession(sessionId).rerender(index);
+    }
     toggleGrammarChecks(value) {
         this.grammarEnabled = value;
         if (this.grammarEnabled) {
@@ -13043,16 +12978,16 @@ class TableOverlayMenuComponent {
         const insertRowsBelowMessage = this.selectedRowsCount > 1
             ? this.translateService.instant('NODER.COMPLEX_LABEL.INSERT_ROWS_BELOW', { count: this.selectedRowsCount })
             : this.translateService.instant('NODER.LABEL.INSERT_ROW_BELOW');
-        const insertColumnsLeftMessage = this.selectedRowsCount > 1
+        const insertColumnsLeftMessage = this.selectedColumnsCount > 1
             ? this.translateService.instant('NODER.COMPLEX_LABEL.INSERT_COLUMNS_TO_THE_LEFT', { count: this.selectedColumnsCount })
             : this.translateService.instant('NODER.LABEL.INSERT_COLUMN_TO_THE_LEFT');
-        const insertColumnsRightMessage = this.selectedRowsCount > 1
+        const insertColumnsRightMessage = this.selectedColumnsCount > 1
             ? this.translateService.instant('NODER.COMPLEX_LABEL.INSERT_COLUMNS_TO_THE_RIGHT', { count: this.selectedColumnsCount })
             : this.translateService.instant('NODER.LABEL.INSERT_COLUMN_TO_THE_RIGHT');
         const removeRowsMessage = this.selectedRowsCount > 1
             ? this.translateService.instant('NODER.COMPLEX_LABEL.REMOVE_ROWS', { count: this.selectedRowsCount })
             : this.translateService.instant('NODER.LABEL.REMOVE_ROW');
-        const removeColumnsMessage = this.selectedRowsCount > 1
+        const removeColumnsMessage = this.selectedColumnsCount > 1
             ? this.translateService.instant('NODER.COMPLEX_LABEL.REMOVE_COLUMNS', { count: this.selectedColumnsCount })
             : this.translateService.instant('NODER.LABEL.REMOVE_COLUMN');
         const removeTableMessage = this.translateService.instant('NODER.LABEL.REMOVE_TABLE');
@@ -13476,15 +13411,17 @@ class TableSelection {
     }
     getTargetsForMenuOverlay(selectionRange) {
         return new SelectionRangeModel({
-            startIndex: this.getTargetRowStartIndex(selectionRange.rowIndexes.startIndex),
-            endIndex: this.getTargetRowEndIndex(selectionRange.rowIndexes.endIndex)
+            startIndex: this.getTargetRowStartIndex(selectionRange.rowIndexes.startIndex, selectionRange.cellIndexes.startIndex, selectionRange.cellIndexes.endIndex),
+            endIndex: this.getTargetRowEndIndex(selectionRange.rowIndexes.endIndex, selectionRange.cellIndexes.startIndex, selectionRange.cellIndexes.endIndex)
         }, {
             startIndex: this.getTargetColumnStartIndex(selectionRange.rowIndexes.startIndex, selectionRange.rowIndexes.endIndex, selectionRange.cellIndexes.startIndex),
             endIndex: this.getTargetColumnEndIndex(selectionRange.rowIndexes.startIndex, selectionRange.rowIndexes.endIndex, selectionRange.cellIndexes.endIndex)
         });
     }
-    getTargetRowStartIndex(startIndex) {
-        const mergedRowCells = this.rowMatrix[startIndex].cells.filter(x => x.cell.rowSpan > 1 && x.componentRef.instance.cell.verticalMerge);
+    getTargetRowStartIndex(startIndex, cellStartIndex, cellEndIndex) {
+        const mergedRowCells = this.rowMatrix[startIndex].cells
+            .slice(cellStartIndex, cellEndIndex + 1)
+            .filter(x => x.cell.rowSpan > 1 && x.componentRef.instance.cell.verticalMerge);
         if (!mergedRowCells.length) {
             return startIndex;
         }
@@ -13499,8 +13436,10 @@ class TableSelection {
         }
         return index + 1;
     }
-    getTargetRowEndIndex(endIndex) {
-        const mergedRowCells = this.rowMatrix[endIndex].cells.filter(x => x.cell.rowSpan > 1 && x.componentRef.instance.cell.verticalMerge);
+    getTargetRowEndIndex(endIndex, cellStartIndex, cellEndIndex) {
+        const mergedRowCells = this.rowMatrix[endIndex].cells
+            .slice(cellStartIndex, cellEndIndex + 1)
+            .filter(x => x.cell.rowSpan > 1 && x.componentRef.instance.cell.verticalMerge);
         if (!mergedRowCells.length) {
             return endIndex + 1;
         }
@@ -15629,7 +15568,6 @@ class Editor {
         this.subscriptions = [];
         this.commentCreateRequests = [];
         this.emojiRegex = /\p{Extended_Pictographic}(?:\p{Emoji_Modifier}|\u{200D}\p{Extended_Pictographic})*/gu;
-        this.isRerenderSubscriptionOpen = true;
         this.rerenderResize = () => {
             this.mainRenderer.onResize(true);
         };
@@ -17075,7 +17013,7 @@ class Editor {
         });
         this.insertContent(insertIndex, nextElementContents);
         const component = this.session.customComponents.customElements.find(x => x.instance.content.insertIndex === insertIndex + 1);
-        const position = this.session.displayData.indexToPosition(component.instance.insertIndex, 0);
+        const position = this.session.displayData.indexToPosition(component.instance.insertIndex);
         this.selection.focus(component, position);
         this.onSelectionChange();
     }
@@ -17250,7 +17188,7 @@ class Editor {
         if (!component) {
             return;
         }
-        const position = this.session.displayData.indexToPosition(index, 0);
+        const position = this.session.displayData.indexToPosition(index);
         this.selection.focus(component, position);
         this.renderer.hideCursor();
         this.onSelectionChange();
@@ -17532,9 +17470,7 @@ class Editor {
         return this.editorService.setImageStyle$.subscribe(image => this.applyImageStyles(image));
     }
     rerenderSubscription() {
-        return this.editorService.rerender$.pipe(filter(() => this.isRerenderSubscriptionOpen)).subscribe(index => {
-            this.session.rerender(index);
-        });
+        return this.editorService.rerender$.subscribe(x => this.regulatorService.rerender(x.index, x.sessionId));
     }
     createCustomComponentSubscription() {
         return this.editorService.createCustomComponent$.subscribe(model => {
@@ -17834,9 +17770,7 @@ class Editor {
             this.changeCellsWidth(table.rows, scalingRatio);
         });
         this.selection.navigateFileStart();
-        this.isRerenderSubscriptionOpen = false;
         this.regulatorService.addMainSession(this.model, scalingRatio, this.container);
-        this.isRerenderSubscriptionOpen = true;
         this.textInput = new TextInput(this.mainRenderer.container);
         this.mainRenderer.textarea = this.textInput.input;
         this.touchHandler.destroy();