Fix 262677: Allow insert entity to a specified position without chang…

…ing selection (#2537)

packages/roosterjs-content-model-api/lib/modelApi/entity/insertEntityModel.ts

@@ -13,9 +13,9 @@ import type {
     ContentModelDocument,
     ContentModelEntity,
     ContentModelParagraph,
-    DeleteSelectionResult,
     FormatContentModelContext,
     InsertEntityPosition,
+    InsertPoint,
 } from 'roosterjs-content-model-types';
 
 /**
@@ -27,11 +27,12 @@ export function insertEntityModel(
     position: InsertEntityPosition,
     isBlock: boolean,
     focusAfterEntity?: boolean,
-    context?: FormatContentModelContext
+    context?: FormatContentModelContext,
+    insertPointOverride?: InsertPoint
 ) {
     let blockParent: ContentModelBlockGroup | undefined;
     let blockIndex = -1;
-    let deleteResult: DeleteSelectionResult;
+    let insertPoint: InsertPoint | null;
 
     if (position == 'begin' || position == 'end') {
         blockParent = model;
@@ -40,12 +41,8 @@ export function insertEntityModel(
         if (!isBlock) {
             Object.assign(entityModel.format, model.format);
         }
-    } else if ((deleteResult = deleteSelection(model, [], context)).insertPoint) {
-        const { marker, paragraph, path } = deleteResult.insertPoint;
-
-        if (deleteResult.deleteResult == 'range') {
-            normalizeContentModel(model);
-        }
+    } else if ((insertPoint = getInsertPoint(model, insertPointOverride, context))) {
+        const { marker, paragraph, path } = insertPoint;
 
         if (!isBlock) {
             const index = paragraph.segments.indexOf(marker);
@@ -111,3 +108,22 @@ export function insertEntityModel(
         }
     }
 }
+
+function getInsertPoint(
+    model: ContentModelDocument,
+    insertPointOverride?: InsertPoint,
+    context?: FormatContentModelContext
+): InsertPoint | null {
+    if (insertPointOverride) {
+        return insertPointOverride;
+    } else {
+        const deleteResult = deleteSelection(model, [], context);
+        const insertPoint = deleteResult.insertPoint;
+
+        if (deleteResult.deleteResult == 'range') {
+            normalizeContentModel(model);
+        }
+
+        return insertPoint;
+    }
+}

packages/roosterjs-content-model-api/lib/publicApi/entity/insertEntity.ts

@@ -1,3 +1,4 @@
+import { formatInsertPointWithContentModel } from '../utils/formatInsertPointWithContentModel';
 import { insertEntityModel } from '../../modelApi/entity/insertEntityModel';
 import {
     ChangeSource,
@@ -7,11 +8,15 @@ import {
 } from 'roosterjs-content-model-dom';
 import type {
     ContentModelEntity,
-    DOMSelection,
     InsertEntityPosition,
     InsertEntityOptions,
     IEditor,
     EntityState,
+    DOMInsertPoint,
+    FormatContentModelOptions,
+    ContentModelDocument,
+    FormatContentModelContext,
+    InsertPoint,
 } from 'roosterjs-content-model-types';
 
 const BlockEntityTag = 'div';
@@ -32,7 +37,7 @@ export function insertEntity(
     editor: IEditor,
     type: string,
     isBlock: boolean,
-    position: 'focus' | 'begin' | 'end' | DOMSelection,
+    position: 'focus' | 'begin' | 'end' | DOMInsertPoint,
     options?: InsertEntityOptions
 ): ContentModelEntity | null;
 
@@ -51,15 +56,15 @@ export function insertEntity(
     editor: IEditor,
     type: string,
     isBlock: true,
-    position: InsertEntityPosition | DOMSelection,
+    position: InsertEntityPosition | DOMInsertPoint,
     options?: InsertEntityOptions
 ): ContentModelEntity | null;
 
 export function insertEntity(
     editor: IEditor,
     type: string,
     isBlock: boolean,
-    position?: InsertEntityPosition | DOMSelection,
+    position?: InsertEntityPosition | DOMInsertPoint,
     options?: InsertEntityOptions
 ): ContentModelEntity | null {
     const { contentNode, focusAfterEntity, wrapperDisplay, skipUndoSnapshot, initialEntityState } =
@@ -85,36 +90,45 @@ export function insertEntity(
         editor.takeSnapshot();
     }
 
-    editor.formatContentModel(
-        (model, context) => {
-            insertEntityModel(
-                model,
-                entityModel,
-                typeof position == 'string' ? position : 'focus',
-                isBlock,
-                focusAfterEntity,
-                context
-            );
-
-            normalizeContentModel(model);
-
-            context.skipUndoSnapshot = true;
-            context.newEntities.push(entityModel);
-
-            return true;
-        },
-        {
-            selectionOverride: typeof position === 'object' ? position : undefined,
-            changeSource: ChangeSource.InsertEntity,
-            getChangeData: () => ({
-                wrapper,
-                type,
-                id: '',
-                isReadonly: true,
-            }),
-            apiName: 'insertEntity',
-        }
-    );
+    const formatOptions: FormatContentModelOptions = {
+        changeSource: ChangeSource.InsertEntity,
+        getChangeData: () => ({
+            wrapper,
+            type,
+            id: '',
+            isReadonly: true,
+        }),
+        apiName: 'insertEntity',
+    };
+
+    const callback = (
+        model: ContentModelDocument,
+        context: FormatContentModelContext,
+        insertPoint?: InsertPoint
+    ) => {
+        insertEntityModel(
+            model,
+            entityModel,
+            typeof position == 'string' ? position : 'focus',
+            isBlock,
+            focusAfterEntity,
+            context,
+            insertPoint
+        );
+
+        normalizeContentModel(model);
+
+        context.skipUndoSnapshot = true;
+        context.newEntities.push(entityModel);
+
+        return true;
+    };
+
+    if (typeof position == 'object') {
+        formatInsertPointWithContentModel(editor, position, callback, formatOptions);
+    } else {
+        editor.formatContentModel(callback, formatOptions);
+    }
 
     if (!skipUndoSnapshot) {
         let entityState: EntityState | undefined;