@talrace/ngx-noder 19.0.66 → 19.0.68

package/fesm2022/talrace-ngx-noder.mjs

@@ -633,13 +633,7 @@ class EditorService {
         this._clipboardData$ = new BehaviorSubject('');
         this._hasSelection$ = new BehaviorSubject(false);
         this._historyInfo$ = new BehaviorSubject(new OperationsHistoryInfoModel(-1, -1));
-        this._toggleSidenav$ = new BehaviorSubject({
-            open: false,
-            component: null,
-            focus: false,
-            data: null
-        });
-        this._isSidenavLocked = false;
+        this._toggleSidenav$ = new Subject();
         this._displayGrammarError$ = new Subject();
         this._applyGrammarSuggestion$ = new Subject();
         this._ignoreGrammarError$ = new Subject();
@@ -771,9 +765,6 @@ class EditorService {
     get toggleSidenav$() {
         return this._toggleSidenav$.asObservable();
     }
-    get isSidenavLocked() {
-        return this._isSidenavLocked;
-    }
     get displayGrammarError$() {
         return this._displayGrammarError$.asObservable();
     }
@@ -1194,14 +1185,8 @@ class EditorService {
         this._toggleSidenav$.next({ open: true, component, focus });
     }
     closeSidenav() {
-        if (this.isSidenavLocked) {
-            return;
-        }
         this._toggleSidenav$.next({ open: false, component: null, focus: false });
     }
-    lockSidenav(value) {
-        this._isSidenavLocked = value;
-    }
     changedTableSize(insertIndex, sessionId) {
         this._changedTableSize$.next({ insertIndex, sessionId });
     }
@@ -1462,7 +1447,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImpor
 class ExternalComponent extends BaseNoderComponent {
     constructor() {
         super(...arguments);
-        this.focusSidenav = true;
+        this.focusSidenav = false;
         this.isText = false; // this will substitute component block by in editor text (getText() will be used as a value)
     }
     getText() {
@@ -9757,7 +9742,9 @@ class EditSession {
     }
     insertElementByDocumentIndex(insertElement) {
         const elementPosition = ContentHelper.documentIndexToParagraphIndex(this.displayData.paragraphs, insertElement.element.insertIndex);
-        return this.insertElement(elementPosition, insertElement.element);
+        const { endPosition } = this.insertElement(elementPosition, insertElement.element);
+        this.selection.placeCursor(endPosition);
+        return endPosition;
     }
     insertBreakByDocumentIndex(insertElement) {
         const elementPosition = ContentHelper.documentIndexToParagraphIndex(this.displayData.paragraphs, insertElement.insertIndex);
@@ -9979,10 +9966,9 @@ class EditSession {
         const endPosition = this.displayData.insertText(position, CUSTOM_ELEMENT_MARKER);
         const model = this.model.elements.find(x => x.insertIndex === insertIndex);
         const type = this.customContentService.findComponentType(model.type);
-        this.addComponent(this.customComponents.customElements, model, type);
+        const component = this.addComponent(this.customComponents.customElements, model, type);
         this.displayData.updateNextLineIndexes(position.row, endPosition.row);
-        this.selection.placeCursor(endPosition);
-        return endPosition;
+        return { endPosition, component };
     }
     insertBreak(position, breakType) {
         const insertIndex = ContentHelper.paragraphPositionToDocumentIndex(this.displayData.paragraphs, position);
@@ -10041,7 +10027,7 @@ class EditSession {
     }
     insertContents(insertIndex, contents) {
         OperationsHelper.insertContents(this.model, contents, insertIndex, this.generalProperties.numberings, contents.numberings);
-        const endIndex = insertIndex + contents.content.length - 1;
+        const endIndex = insertIndex + contents.content.length;
         this.insertComponents(this.model.tables, this.customComponents.tables, NoderTableComponent, insertIndex, endIndex);
         this.insertComponents(this.model.images, this.customComponents.images, NoderImageComponent, insertIndex, endIndex);
         this.insertComponents(this.model.tabs, this.customComponents.tabs, NoderTabComponent, insertIndex, endIndex);
@@ -10122,6 +10108,7 @@ class EditSession {
             customElements.push(customElement);
         }
         customElement.instance.initialize();
+        return customElement;
     }
     applyToolbarStyles() {
         // undefined - value wasn't set
@@ -15647,7 +15634,7 @@ class Editor {
             this.mainRenderer.onResize(true);
         };
         this.onDocumentChange = (range) => {
-            let lastRow = range.start.row === range.end.row ? range.end.row : Infinity;
+            const lastRow = range.start.row === range.end.row ? range.end.row : Infinity;
             this.renderer.updateLines(range.start.row, lastRow);
             // Update cursor because tab characters can influence the cursor position.
             this.renderer.updateCursor();
@@ -15803,7 +15790,7 @@ class Editor {
         }
         this.saveInsertBreakToHistory(insertBreak);
         const endPoint = this.session.insertBreak(this.selection.cursor, breakType);
-        let lastRow = this.selection.cursor.row === endPoint.row ? endPoint.row : Infinity;
+        const lastRow = this.selection.cursor.row === endPoint.row ? endPoint.row : Infinity;
         this.renderer.updateLines(this.selection.cursor.row, lastRow);
         this.renderer.updateCursor();
         this.rerenderMarker();
@@ -15870,73 +15857,43 @@ class Editor {
         this.onContentChange();
     }
     insertImage(imageData) {
-        if (!this.selection.isEmpty && !this.selection.isFocused) {
-            const startIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, this.selection.range.start);
-            const pageFormat = this.session.displayData.getPageFormatAtPosition(startIndex);
-            const adjustedImage = ImageHelper.getImageWithAllowedSize(imageData, pageFormat.contentWidth);
-            const insertImage = new InsertImageModel({ insertIndex: startIndex, imageData: adjustedImage });
-            this.replaceBy(new ReplaceModel({ insertImage }));
-            return;
-        }
-        const startPoint = this.selection.isFocused
-            ? new CursorParagraph(this.selection.cursor.row, this.selection.cursor.column + 1)
-            : this.selection.cursor;
-        const insertIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, startPoint);
+        const insertIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, this.selection.range.start);
         const pageFormat = this.session.displayData.getPageFormatAtPosition(insertIndex);
         const adjustedImage = ImageHelper.getImageWithAllowedSize(imageData, pageFormat.contentWidth);
         const insertImage = new InsertImageModel({ insertIndex, imageData: adjustedImage });
+        if (!this.selection.isEmpty) {
+            this.replaceBy(new ReplaceModel({ insertImage }));
+            return;
+        }
         this.saveInsertImageToHistory(insertImage);
-        const endPoint = this.session.insertImage(startPoint, adjustedImage);
-        let lastRow = startPoint.row === endPoint.row ? endPoint.row : Infinity;
-        this.renderer.updateLines(startPoint.row, lastRow);
+        const endPoint = this.session.insertImage(this.selection.cursor, adjustedImage);
+        const lastRow = this.selection.cursor.row === endPoint.row ? endPoint.row : Infinity;
+        this.renderer.updateLines(this.selection.cursor.row, lastRow);
         this.renderer.updateCursor();
         this.rerenderMarker();
         this.onContentChange();
     }
     insertLink(linkDataModel) {
-        if (!this.selection.isEmpty && !this.selection.isFocused) {
-            const startIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, this.selection.range.start);
-            const insertLink = new InsertLinkModel({ insertIndex: startIndex, linkDataModel });
+        const insertIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, this.selection.range.start);
+        const insertLink = new InsertLinkModel({ insertIndex, linkDataModel });
+        if (!this.selection.isEmpty) {
             this.replaceBy(new ReplaceModel({ insertLink }));
             return;
         }
-        const startPoint = this.selection.isFocused
-            ? new CursorParagraph(this.selection.cursor.row, this.selection.cursor.column + 1)
-            : this.selection.cursor;
-        const insertIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, startPoint);
-        const insertLink = new InsertLinkModel({ insertIndex, linkDataModel });
         this.saveInsertLinkToHistory(insertLink);
-        this.session.insertLink(startPoint, linkDataModel);
+        this.session.insertLink(this.selection.cursor, linkDataModel);
         this.renderer.updateCursor();
         this.rerenderMarker();
         this.onContentChange();
     }
     insertTable(tableData) {
-        if (!this.selection.isEmpty && !this.selection.isFocused) {
-            const start = this.selection.range.start;
-            const end = this.selection.range.end;
-            const startIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, start);
-            const endIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, end);
-            const isNumbering = !!this.session.displayData.paragraphs[start.row].paragraphSettings.numberingData.numberingId;
-            const noParagraphLeft = startIndex !== 0 && !this.session.model.paragraphs.find(x => x.insertIndex === startIndex - 1);
-            const noParagraphRight = !this.session.model.paragraphs.find(x => x.insertIndex === endIndex);
-            const insertTable = new InsertTableModel({
-                insertIndex: startIndex,
-                rowsCount: tableData.rows,
-                columnsCount: tableData.columns,
-                insertParagraphBefore: isNumbering || noParagraphLeft,
-                insertParagraphAfter: isNumbering || noParagraphRight
-            });
-            this.replaceBy(new ReplaceModel({ insertTable }));
-            return;
-        }
-        const startPoint = this.selection.isFocused
-            ? new CursorParagraph(this.selection.cursor.row, this.selection.cursor.column + 1)
-            : this.selection.cursor;
-        const insertIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, startPoint);
-        const isNumbering = !!this.session.displayData.paragraphs[startPoint.row].paragraphSettings.numberingData.numberingId;
+        const start = this.selection.range.start;
+        const end = this.selection.range.end;
+        const insertIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, start);
+        const endIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, end);
+        const isNumbering = !!this.session.displayData.paragraphs[start.row].paragraphSettings.numberingData.numberingId;
         const noParagraphLeft = insertIndex !== 0 && !this.session.model.paragraphs.find(x => x.insertIndex === insertIndex - 1);
-        const noParagraphRight = !this.session.model.paragraphs.find(x => x.insertIndex === insertIndex);
+        const noParagraphRight = !this.session.model.paragraphs.find(x => x.insertIndex === endIndex);
         const insertTable = new InsertTableModel({
             insertIndex,
             rowsCount: tableData.rows,
@@ -15944,10 +15901,14 @@ class Editor {
             insertParagraphBefore: isNumbering || noParagraphLeft,
             insertParagraphAfter: isNumbering || noParagraphRight
         });
+        if (!this.selection.isEmpty) {
+            this.replaceBy(new ReplaceModel({ insertTable }));
+            return;
+        }
         this.saveInsertTableToHistory(insertTable);
-        const endPoint = this.session.insertTable(startPoint, insertTable);
-        let lastRow = startPoint.row === endPoint.row ? endPoint.row : Infinity;
-        this.renderer.updateLines(startPoint.row, lastRow);
+        const endPoint = this.session.insertTable(this.selection.cursor, insertTable);
+        const lastRow = this.selection.cursor.row === endPoint.row ? endPoint.row : Infinity;
+        this.renderer.updateLines(this.selection.cursor.row, lastRow);
         this.renderer.updateCursor();
         this.onContentChange();
         this.rerenderMarker();
@@ -16195,7 +16156,7 @@ class Editor {
             });
             this.saveReplaceToHistory(range, replaceModel);
             const endPosition = this.session.replace(replaceModel);
-            let lastRow = range.start.row === endPosition.row ? endPosition.row : Infinity;
+            const lastRow = range.start.row === endPosition.row ? endPosition.row : Infinity;
             this.renderer.updateLines(range.start.row, lastRow);
         }
         else {
@@ -16622,28 +16583,20 @@ class Editor {
         this.commandsService.createCommand(SaveCommandsHelper.getApplyDocumentPageFormatCommand(redo, this.targets));
     }
     createCustomElement(data) {
-        if (!this.selection.isEmpty && !this.selection.isFocused) {
-            const startIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, this.selection.range.start);
-            const insertElement = new InsertElementModel({ element: new ElementModel({ ...data, insertIndex: startIndex }) });
+        const insertIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, this.selection.range.start);
+        const insertElement = new InsertElementModel({ element: new ElementModel({ ...data, insertIndex }) });
+        if (!this.selection.isEmpty) {
             this.replaceBy(new ReplaceModel({ insertElement }));
-            this.focusCustomElement(startIndex).catch(() => {
-                // continue regardless error
-            });
+            const component = this.session.displayData.customComponents.customElements.find(x => x.instance.insertIndex === insertIndex);
+            this.selection.focus(component, this.selection.cursor);
             return;
         }
-        const startPoint = this.selection.isFocused
-            ? new CursorParagraph(this.selection.cursor.row, this.selection.cursor.column + 1)
-            : this.selection.cursor;
-        const insertIndex = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, startPoint);
-        const insertElement = new InsertElementModel({ element: new ElementModel({ ...data, insertIndex }) });
         this.saveInsertElementToHistory(insertElement);
-        const endPoint = this.session.insertElement(startPoint, data);
-        this.onDocumentChange(new Range(startPoint, endPoint));
+        const { endPosition, component } = this.session.insertElement(this.selection.cursor, data);
+        this.selection.focus(component, this.selection.cursor);
+        this.onDocumentChange(new Range(this.selection.cursor, endPosition));
         this.onSelectionChange();
         this.onContentChange();
-        this.focusCustomElement(insertIndex).catch(() => {
-            // continue regardless error
-        });
     }
     replaceByCustomElement(textKey, model) {
         const index = ContentHelper.paragraphPositionToDocumentIndex(this.session.displayData.paragraphs, this.selection.cursor);
@@ -16836,7 +16789,7 @@ class Editor {
         const replaceModel = new ReplaceModel({ insertText, delete: deleteModel });
         this.saveReplaceToHistory(paragraphRange, replaceModel);
         const endPosition = session.session.replace(replaceModel);
-        let lastRow = paragraphRange.start.row === endPosition.row ? endPosition.row : Infinity;
+        const lastRow = paragraphRange.start.row === endPosition.row ? endPosition.row : Infinity;
         this.renderer.updateLines(paragraphRange.start.row, lastRow);
         this.onContentChange();
     }
@@ -17120,13 +17073,11 @@ class Editor {
             links: [],
             comments: []
         });
-        this.editorService.lockSidenav(true);
         this.insertContent(insertIndex, nextElementContents);
-        this.focusCustomElement(insertIndex + 1)
-            .then(() => this.editorService.lockSidenav(false))
-            .catch(() => {
-            // continue regardless error
-        });
+        const component = this.session.customComponents.customElements.find(x => x.instance.content.insertIndex === insertIndex + 1);
+        const position = this.session.displayData.indexToPosition(component.instance.insertIndex, 0);
+        this.selection.focus(component, position);
+        this.onSelectionChange();
     }
     insertContent(insertIndex, contents) {
         const insertContents = new InsertContentsModel({ insertIndex, contents });
@@ -17301,6 +17252,7 @@ class Editor {
         }
         const position = this.session.displayData.indexToPosition(index, 0);
         this.selection.focus(component, position);
+        this.renderer.hideCursor();
         this.onSelectionChange();
     }
     scrollCursorIntoMainView(offset) {
@@ -17926,21 +17878,6 @@ class Editor {
         this.overlayService.open(CommentPopupComponent, {}, hintX, hintY);
         event?.stopPropagation();
     }
-    focusCustomElement(insertIndex) {
-        return new Promise(resolve => {
-            setTimeout(() => {
-                // Need to skip micro tasks for a render element before focus
-                const component = this.session.customComponents.customElements.find(x => x.instance.content.insertIndex === insertIndex);
-                if (component) {
-                    const position = this.session.displayData.indexToPosition(component.instance.insertIndex, 0);
-                    this.selection.focus(component, position);
-                    this.onSelectionChange();
-                    this.scrollCursorIntoMainView();
-                }
-                resolve();
-            });
-        });
-    }
 }
 
 const EDITOR_VERSION = '2';
@@ -18475,14 +18412,7 @@ class EditorComponent {
     }
     toggleSidenavSubscription() {
         return this.editorService.toggleSidenav$.subscribe(data => {
-            const isSameComponent = this.sidenavComponentRef?.componentType === data.component;
-            if (data.open && (isSameComponent || this.editorService.isSidenavLocked)) {
-                const instance = this.sidenavComponentRef.instance;
-                for (const [key, value] of Object.entries(data.data || {})) {
-                    if (key in instance) {
-                        this.sidenavComponentRef.setInput(key, value);
-                    }
-                }
+            if (this.sidenavComponentRef?.componentType === data.component) {
                 return;
             }
             this.removeSidenavComponent();
@@ -18500,9 +18430,6 @@ class EditorComponent {
                 this.sidenav.close().catch(() => {
                     // continue regardless of error
                 });
-                if (this.editor.selection.isFocused) {
-                    this.editor.selection.blur();
-                }
             }
             this.cdr.markForCheck();
         });