roosterjs 9.53.0 → 9.55.0

package/dist/rooster-amd.js

@@ -6751,7 +6751,7 @@ var formatSegmentWithContentModel_1 = __webpack_require__(/*! ../utils/formatSeg
  */
 function changeCapitalization(editor, capitalization, language) {
     editor.focus();
-    (0, formatSegmentWithContentModel_1.formatSegmentWithContentModel)(editor, 'changeCapitalization', function (_, __, segment) {
+    (0, formatSegmentWithContentModel_1.formatSegmentWithContentModel)(editor, 'changeCapitalization', function (_, __, segment, paragraph) {
         if ((segment === null || segment === void 0 ? void 0 : segment.segmentType) == 'Text') {
             switch (capitalization) {
                 case 'lowerCase':
@@ -6762,7 +6762,13 @@ function changeCapitalization(editor, capitalization, language) {
                     break;
                 case 'capitalize':
                     var wordArray = segment.text.toLocaleLowerCase(language).split(' ');
-                    for (var i = 0; i < wordArray.length; i++) {
+                    // When a collapsed selection is in the middle of a word, the word is split
+                    // into multiple text segments around the selection marker. In that case the
+                    // first segment of the word continues from a previous segment, so its first
+                    // word must not be capitalized to avoid results like "HeLlo" for "he|llo".
+                    var precedingChar = getPrecedingCharacter(paragraph, segment);
+                    var startIndex = precedingChar && precedingChar != ' ' ? 1 : 0;
+                    for (var i = startIndex; i < wordArray.length; i++) {
                         wordArray[i] =
                             wordArray[i].charAt(0).toLocaleUpperCase(language) +
                                 wordArray[i].slice(1);
@@ -6786,6 +6792,30 @@ function changeCapitalization(editor, capitalization, language) {
     });
 }
 exports.changeCapitalization = changeCapitalization;
+/**
+ * Get the character immediately preceding the given segment within its paragraph, skipping
+ * selection markers (which carry no text). Returns an empty string if there is no preceding
+ * text character (e.g. the segment starts the paragraph or follows a non-text segment).
+ */
+function getPrecedingCharacter(paragraph, segment) {
+    if (!paragraph) {
+        return '';
+    }
+    var index = paragraph.segments.indexOf(segment);
+    for (var i = index - 1; i >= 0; i--) {
+        var previous = paragraph.segments[i];
+        if (previous.segmentType == 'SelectionMarker') {
+            continue;
+        }
+        else if (previous.segmentType == 'Text' && previous.text.length > 0) {
+            return previous.text[previous.text.length - 1];
+        }
+        else {
+            break;
+        }
+    }
+    return '';
+}
 
 
 /***/ },
@@ -8019,6 +8049,15 @@ function formatInsertPointWithContentModel(editor, insertPoint, callback, option
             textWithSelection: getShadowTextProcessor(bundle),
         },
         tryGetFromCache: false,
+        // When an element carries "container level" styles such as margin or padding, we first
+        // wrap it in a FormatContainer. After all its child nodes are processed, we decide whether
+        // to keep the FormatContainer or fall back to a plain paragraph when it only wraps a single
+        // paragraph. However, formatInsertPointWithContentModel persists the Content Model group path
+        // during processing so the later formatting callback can still use it (see the
+        // DomToModelContextWithPath interface below). If the FormatContainer falls back to a paragraph,
+        // it is removed from the model and the persisted path becomes invalid. To keep the path valid,
+        // we skip the fallback check here and always keep the FormatContainer when one is needed.
+        skipFormatContainerFallbackCheck: true,
     });
 }
 exports.formatInsertPointWithContentModel = formatInsertPointWithContentModel;
@@ -9339,21 +9378,11 @@ exports.generatePasteOptionFromPlugins = generatePasteOptionFromPlugins;
 "use strict";
 
 Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.mergePasteContent = exports.cloneModelForPaste = void 0;
+exports.mergePasteContent = void 0;
 var tslib_1 = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.mjs");
 var createDomToModelContextForSanitizing_1 = __webpack_require__(/*! ../createModelFromHtml/createDomToModelContextForSanitizing */ "./packages/roosterjs-content-model-core/lib/command/createModelFromHtml/createDomToModelContextForSanitizing.ts");
 var roosterjs_content_model_dom_1 = __webpack_require__(/*! roosterjs-content-model-dom */ "./packages/roosterjs-content-model-dom/lib/index.ts");
 var BlackColor = 'rgb(0,0,0)';
-var CloneOption = {
-    includeCachedElement: function (node, type) { return (type == 'cache' ? undefined : node); },
-};
-/**
- * @internal
- */
-function cloneModelForPaste(model) {
-    return (0, roosterjs_content_model_dom_1.cloneModel)(model, CloneOption);
-}
-exports.cloneModelForPaste = cloneModelForPaste;
 /**
  * @internal
  */
@@ -9361,7 +9390,7 @@ function mergePasteContent(editor, eventResult, isFirstPaste) {
     var fragment = eventResult.fragment, domToModelOption = eventResult.domToModelOption, customizedMerge = eventResult.customizedMerge, pasteType = eventResult.pasteType, clipboardData = eventResult.clipboardData, containsBlockElements = eventResult.containsBlockElements;
     editor.formatContentModel(function (model, context) {
         if (!isFirstPaste && clipboardData.modelBeforePaste) {
-            var clonedModel = cloneModelForPaste(clipboardData.modelBeforePaste);
+            var clonedModel = (0, roosterjs_content_model_dom_1.cloneModelForPaste)(clipboardData.modelBeforePaste);
             model.blocks = clonedModel.blocks;
         }
         var domToModelContext = (0, createDomToModelContextForSanitizing_1.createDomToModelContextForSanitizing)(editor.getDocument(), undefined /*defaultFormat*/, editor.getEnvironment().domToModelSettings.customized, domToModelOption, editor.getDOMHelper());
@@ -9440,10 +9469,11 @@ function getLastSegmentFormat(pasteModel) {
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.paste = void 0;
 var cleanHtmlComments_1 = __webpack_require__(/*! ./cleanHtmlComments */ "./packages/roosterjs-content-model-core/lib/command/paste/cleanHtmlComments.ts");
-var mergePasteContent_1 = __webpack_require__(/*! ./mergePasteContent */ "./packages/roosterjs-content-model-core/lib/command/paste/mergePasteContent.ts");
+var roosterjs_content_model_dom_1 = __webpack_require__(/*! roosterjs-content-model-dom */ "./packages/roosterjs-content-model-dom/lib/index.ts");
 var convertInlineCss_1 = __webpack_require__(/*! ../createModelFromHtml/convertInlineCss */ "./packages/roosterjs-content-model-core/lib/command/createModelFromHtml/convertInlineCss.ts");
 var createPasteFragment_1 = __webpack_require__(/*! ./createPasteFragment */ "./packages/roosterjs-content-model-core/lib/command/paste/createPasteFragment.ts");
 var generatePasteOptionFromPlugins_1 = __webpack_require__(/*! ./generatePasteOptionFromPlugins */ "./packages/roosterjs-content-model-core/lib/command/paste/generatePasteOptionFromPlugins.ts");
+var mergePasteContent_1 = __webpack_require__(/*! ./mergePasteContent */ "./packages/roosterjs-content-model-core/lib/command/paste/mergePasteContent.ts");
 var retrieveHtmlInfo_1 = __webpack_require__(/*! ./retrieveHtmlInfo */ "./packages/roosterjs-content-model-core/lib/command/paste/retrieveHtmlInfo.ts");
 /**
  * Paste into editor using a clipboardData object
@@ -9459,7 +9489,7 @@ function paste(editor, clipboardData, pasteTypeOrGetter) {
     if (!clipboardData.modelBeforePaste) {
         isFirstPaste = true;
         editor.formatContentModel(function (model) {
-            clipboardData.modelBeforePaste = (0, mergePasteContent_1.cloneModelForPaste)(model);
+            clipboardData.modelBeforePaste = (0, roosterjs_content_model_dom_1.cloneModelForPaste)(model);
             return false;
         });
     }
@@ -10103,6 +10133,9 @@ var createContentModel = function (core, option, selectionOverride) {
     var domToModelContext = option
         ? (0, roosterjs_content_model_dom_1.createDomToModelContext)(editorContext, settings.builtIn, settings.customized, option)
         : (0, roosterjs_content_model_dom_1.createDomToModelContextWithConfig)(settings.calculated, editorContext);
+    if (option === null || option === void 0 ? void 0 : option.skipFormatContainerFallbackCheck) {
+        domToModelContext.skipFormatContainerFallbackCheck = true;
+    }
     if (selection) {
         domToModelContext.selection = selection;
     }
@@ -11574,6 +11607,11 @@ var CachePlugin = /** @class */ (function () {
                             _this.invalidateCache();
                         }
                         break;
+                    case 'attribute':
+                        if (!_this.state.domIndexer.reconcileImageAttribute(mutation.element, mutation.attributeName)) {
+                            _this.invalidateCache();
+                        }
+                        break;
                     case 'unknown':
                         _this.invalidateCache();
                         break;
@@ -12105,6 +12143,33 @@ var DomIndexerImpl = /** @class */ (function () {
             return false;
         }
     };
+    DomIndexerImpl.prototype.reconcileImageAttribute = function (element, attributeName) {
+        var _a, _b;
+        if ((0, roosterjs_content_model_dom_1.isElementOfType)(element, 'img')) {
+            var image = (_a = getIndexedSegmentItem(element)) === null || _a === void 0 ? void 0 : _a.segments[0];
+            if ((image === null || image === void 0 ? void 0 : image.segmentType) == 'Image') {
+                if (attributeName == 'src') {
+                    // Use getAttribute('src') instead of retrieving src directly, in case the src
+                    // has port and may be stripped by browser. This matches imageProcessor.
+                    image.src = (_b = element.getAttribute('src')) !== null && _b !== void 0 ? _b : '';
+                    return true;
+                }
+                else if (attributeName.indexOf('data-') == 0) {
+                    // A data-* attribute may be added, modified or removed. Rebuild the whole
+                    // dataset from DOM to keep it in sync, the same way imageProcessor builds it.
+                    var dataset_1 = image.dataset;
+                    (0, roosterjs_content_model_dom_1.getObjectKeys)(dataset_1).forEach(function (key) {
+                        delete dataset_1[key];
+                    });
+                    (0, roosterjs_content_model_dom_1.getObjectKeys)(element.dataset).forEach(function (key) {
+                        dataset_1[key] = element.dataset[key] || '';
+                    });
+                    return true;
+                }
+            }
+        }
+        return false;
+    };
     DomIndexerImpl.prototype.onBlockEntityDelimiter = function (node, entity, parent) {
         if ((0, roosterjs_content_model_dom_1.isNodeOfType)(node, 'ELEMENT_NODE') && (0, roosterjs_content_model_dom_1.isEntityDelimiter)(node) && node.firstChild) {
             var indexedDelimiter = node.firstChild;
@@ -12420,6 +12485,16 @@ var TextMutationObserverImpl = /** @class */ (function () {
                                 (0, roosterjs_content_model_dom_1.isNodeOfType)(target, 'ELEMENT_NODE')) {
                                 _this.onMutation({ type: 'elementId', element: target });
                             }
+                            else if (mutation.attributeName &&
+                                (0, roosterjs_content_model_dom_1.isNodeOfType)(target, 'ELEMENT_NODE') &&
+                                (mutation.attributeName == 'src' ||
+                                    mutation.attributeName.indexOf('data-') == 0)) {
+                                _this.onMutation({
+                                    type: 'attribute',
+                                    element: target,
+                                    attributeName: mutation.attributeName,
+                                });
+                            }
                             else {
                                 // We cannot handle attributes changes on editor content for now
                                 canHandle = false;
@@ -12699,7 +12774,7 @@ var CopyPastePlugin = /** @class */ (function () {
                 var dataTransfer = event.clipboardData;
                 if (shouldPreventDefaultPaste(dataTransfer, editor_1)) {
                     event.preventDefault();
-                    (0, roosterjs_content_model_dom_1.extractClipboardItems)((0, roosterjs_content_model_dom_1.toArray)(dataTransfer.items), _this.state.allowedCustomPasteType).then(function (clipboardData) {
+                    (0, roosterjs_content_model_dom_1.extractClipboardItems)((0, roosterjs_content_model_dom_1.toArray)(dataTransfer.items), _this.state.allowedCustomPasteType, true /* isPasteNative */).then(function (clipboardData) {
                         if (!editor_1.isDisposed()) {
                             (0, paste_1.paste)(editor_1, clipboardData, _this.state.defaultPasteType);
                         }
@@ -18136,7 +18211,9 @@ var formatContainerProcessorInternal = function (group, element, context, forceF
         if (element.style.fontSize && parseInt(element.style.fontSize) == 0) {
             formatContainer.zeroFontSize = true;
         }
-        if (shouldFallbackToParagraph(formatContainer) && !forceFormatContainer) {
+        if (!context.skipFormatContainerFallbackCheck &&
+            shouldFallbackToParagraph(formatContainer) &&
+            !forceFormatContainer) {
             // For DIV container that only has one paragraph child, container style can be merged into paragraph
             // and no need to have this container
             var paragraph = formatContainer.blocks[0];
@@ -19717,7 +19794,7 @@ var ContentHandlers = (_a = {},
  * @param allowedCustomPasteType Allowed custom content type when paste besides text/plain, text/html and images
     Only text types are supported, and do not add "text/" prefix to the type values
  */
-function extractClipboardItems(items, allowedCustomPasteType) {
+function extractClipboardItems(items, allowedCustomPasteType, isPasteNative) {
     var data = {
         types: [],
         text: '',
@@ -19725,7 +19802,7 @@ function extractClipboardItems(items, allowedCustomPasteType) {
         files: [],
         rawHtml: null,
         customValues: {},
-        pasteNativeEvent: true,
+        pasteNativeEvent: !!isPasteNative,
     };
     return Promise.all((items || []).map(function (item) {
         var type = item.type;
@@ -20666,6 +20743,7 @@ function pruneUnselectedModel(model) {
 exports.pruneUnselectedModel = pruneUnselectedModel;
 function pruneUnselectedModelInternal(model, isSelectionAfterElement) {
     var e_1, _a, _b;
+    var _c;
     for (var index = model.blocks.length - 1; index >= 0; index--) {
         var block = model.blocks[index];
         switch (block.blockType) {
@@ -20689,15 +20767,17 @@ function pruneUnselectedModelInternal(model, isSelectionAfterElement) {
             case 'Paragraph':
                 var newSegments = [];
                 try {
-                    for (var _c = (e_1 = void 0, (0, tslib_1.__values)(block.segments)), _d = _c.next(); !_d.done; _d = _c.next()) {
-                        var segment = _d.value;
+                    for (var _d = (e_1 = void 0, (0, tslib_1.__values)(block.segments)), _e = _d.next(); !_e.done; _e = _d.next()) {
+                        var segment = _e.value;
+                        var isSelectedOrUndeletable = segment.isSelected || ((_c = segment.link) === null || _c === void 0 ? void 0 : _c.format.undeletable);
                         if (segment.segmentType == 'General') {
                             pruneUnselectedModel(segment);
-                            if (segment.blocks.length > 0 || segment.isSelected) {
+                            if (segment.blocks.length > 0 || isSelectedOrUndeletable) {
                                 newSegments.push(segment);
                             }
                         }
-                        else if (segment.isSelected && segment.segmentType != 'SelectionMarker') {
+                        else if (isSelectedOrUndeletable &&
+                            segment.segmentType != 'SelectionMarker') {
                             newSegments.push(segment);
                         }
                     }
@@ -20705,7 +20785,7 @@ function pruneUnselectedModelInternal(model, isSelectionAfterElement) {
                 catch (e_1_1) { e_1 = { error: e_1_1 }; }
                 finally {
                     try {
-                        if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
+                        if (_e && !_e.done && (_a = _d.return)) _a.call(_d);
                     }
                     finally { if (e_1) throw e_1.error; }
                 }
@@ -23678,8 +23758,8 @@ exports.shouldSetValue = shouldSetValue;
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.createImage = exports.createText = exports.createTableCell = exports.createTable = exports.createSelectionMarker = exports.createParagraph = exports.createFormatContainer = exports.createListItem = exports.createBr = exports.isLinkUndeletable = exports.setLinkUndeletable = exports.scrollRectIntoView = exports.normalizeRect = exports.isWhiteSpacePreserved = exports.reuseCachedElement = exports.findClosestBlockEntityContainer = exports.isBlockEntityContainer = exports.isEntityDelimiter = exports.addDelimiters = exports.generateEntityClassNames = exports.parseEntityFormat = exports.getAllEntityWrappers = exports.findClosestEntityWrapper = exports.isEntityElement = exports.unwrap = exports.wrap = exports.wrapAllChildNodes = exports.moveChildNodes = exports.toArray = exports.getSafeIdSelector = exports.getObjectKeys = exports.isElementOfType = exports.isNodeOfType = exports.hasMetadata = exports.getMetadata = exports.updateMetadata = exports.buildSelectionMarker = exports.isBlockElement = exports.areSameFormats = exports.parseFormat = exports.getRegularSelectionOffsets = exports.formatContainerProcessor = exports.tableProcessor = exports.entityProcessor = exports.processChildNode = exports.handleRegularSelection = exports.childProcessor = exports.contentModelToText = exports.contentModelToDom = exports.domToContentModel = void 0;
 exports.trimModelForSelection = exports.getDOMInsertPointRect = exports.getSelectionRootNode = exports.isBold = exports.createModelToDomConfig = exports.createModelToDomContextWithConfig = exports.createModelToDomContext = exports.createDomToModelConfig = exports.createDomToModelContextWithConfig = exports.createDomToModelContext = exports.defaultGenerateColorKey = exports.parseColor = exports.setColor = exports.getColor = exports.DeprecatedColors = exports.BorderKeys = exports.parseValueWithUnit = exports.getAutoListStyleType = exports.getOrderedListNumberStr = exports.ParagraphFormats = exports.ListFormatsToMove = exports.ListFormatsToKeep = exports.ListFormats = exports.copyFormat = exports.setParagraphNotImplicit = exports.normalizeSegmentFormat = exports.mergeTextSegments = exports.normalizeSingleSegment = exports.isEmpty = exports.addSegment = exports.unwrapBlock = exports.isGeneralSegment = exports.normalizeContentModel = exports.normalizeParagraph = exports.addTextSegment = exports.addLink = exports.addCode = exports.addBlock = exports.mutateSegment = exports.mutateSegments = exports.mutateBlock = exports.createTableRow = exports.createEmptyModel = exports.createListLevel = exports.createDivider = exports.createEntity = exports.createGeneralBlock = exports.createGeneralSegment = exports.createParagraphDecorator = exports.createContentModelDocument = void 0;
-exports.runEditSteps = exports.getClosestAncestorBlockGroupIndex = exports.getSegmentTextFormat = exports.getListStyleTypeFromString = exports.retrieveModelFormatState = exports.setTableCellBackgroundColor = exports.MIN_ALLOWED_TABLE_CELL_HEIGHT = exports.MIN_ALLOWED_TABLE_CELL_WIDTH = exports.normalizeTable = exports.setFirstColumnFormatBorders = exports.applyTableFormat = exports.deleteBlock = exports.deleteSegment = exports.deleteSelection = exports.mergeModel = exports.cloneModel = exports.setSelection = exports.hasSelectionInBlockGroup = exports.hasSelectionInSegment = exports.hasSelectionInBlock = exports.getSelectedCells = exports.getSelectedSegmentsAndParagraphs = exports.getSelectedSegments = exports.getSelectedParagraphs = exports.getOperationalBlocks = exports.getFirstSelectedTable = exports.getFirstSelectedListItem = exports.iterateSelections = exports.isBlockGroupOfType = exports.getRangesByText = exports.getImageState = exports.setImageState = exports.getParagraphMarker = exports.setParagraphMarker = exports.cacheGetEventData = exports.extractClipboardItems = exports.normalizeFontFamily = exports.transformColor = exports.retrieveDocumentMetadata = exports.readFile = exports.parseTableCells = exports.normalizeText = exports.isSpace = exports.isPunctuation = exports.extractBorderValues = exports.combineBorderValue = exports.getNodePositionFromEvent = exports.isCursorMovingKey = exports.isModifierKey = exports.isCharacterValue = void 0;
-exports.EmptySegmentFormat = exports.UnorderedListStyleMap = exports.OrderedListStyleMap = exports.TableBorderFormat = exports.NumberingListType = exports.BulletListType = exports.ChangeSource = exports.ListMetadataDefinition = exports.getListMetadata = exports.updateListMetadata = exports.getTableMetadata = exports.updateTableMetadata = exports.getTableCellMetadata = exports.updateTableCellMetadata = exports.getImageMetadata = exports.updateImageMetadata = void 0;
+exports.getClosestAncestorBlockGroupIndex = exports.getSegmentTextFormat = exports.getListStyleTypeFromString = exports.retrieveModelFormatState = exports.setTableCellBackgroundColor = exports.MIN_ALLOWED_TABLE_CELL_HEIGHT = exports.MIN_ALLOWED_TABLE_CELL_WIDTH = exports.normalizeTable = exports.setFirstColumnFormatBorders = exports.applyTableFormat = exports.deleteBlock = exports.deleteSegment = exports.deleteSelection = exports.mergeModel = exports.cloneModelForPaste = exports.cloneModel = exports.setSelection = exports.hasSelectionInBlockGroup = exports.hasSelectionInSegment = exports.hasSelectionInBlock = exports.getSelectedCells = exports.getSelectedSegmentsAndParagraphs = exports.getSelectedSegments = exports.getSelectedParagraphs = exports.getOperationalBlocks = exports.getFirstSelectedTable = exports.getFirstSelectedListItem = exports.iterateSelections = exports.isBlockGroupOfType = exports.getRangesByText = exports.getImageState = exports.setImageState = exports.getParagraphMarker = exports.setParagraphMarker = exports.cacheGetEventData = exports.extractClipboardItems = exports.normalizeFontFamily = exports.transformColor = exports.retrieveDocumentMetadata = exports.readFile = exports.parseTableCells = exports.normalizeText = exports.isSpace = exports.isPunctuation = exports.extractBorderValues = exports.combineBorderValue = exports.getNodePositionFromEvent = exports.isCursorMovingKey = exports.isModifierKey = exports.isCharacterValue = void 0;
+exports.EmptySegmentFormat = exports.UnorderedListStyleMap = exports.OrderedListStyleMap = exports.TableBorderFormat = exports.NumberingListType = exports.BulletListType = exports.ChangeSource = exports.ListMetadataDefinition = exports.getListMetadata = exports.updateListMetadata = exports.getTableMetadata = exports.updateTableMetadata = exports.getTableCellMetadata = exports.updateTableCellMetadata = exports.getImageMetadata = exports.updateImageMetadata = exports.runEditSteps = void 0;
 var domToContentModel_1 = __webpack_require__(/*! ./domToModel/domToContentModel */ "./packages/roosterjs-content-model-dom/lib/domToModel/domToContentModel.ts");
 Object.defineProperty(exports, "domToContentModel", ({ enumerable: true, get: function () { return domToContentModel_1.domToContentModel; } }));
 var contentModelToDom_1 = __webpack_require__(/*! ./modelToDom/contentModelToDom */ "./packages/roosterjs-content-model-dom/lib/modelToDom/contentModelToDom.ts");
@@ -23910,6 +23990,7 @@ var setSelection_1 = __webpack_require__(/*! ./modelApi/selection/setSelection *
 Object.defineProperty(exports, "setSelection", ({ enumerable: true, get: function () { return setSelection_1.setSelection; } }));
 var cloneModel_1 = __webpack_require__(/*! ./modelApi/editing/cloneModel */ "./packages/roosterjs-content-model-dom/lib/modelApi/editing/cloneModel.ts");
 Object.defineProperty(exports, "cloneModel", ({ enumerable: true, get: function () { return cloneModel_1.cloneModel; } }));
+Object.defineProperty(exports, "cloneModelForPaste", ({ enumerable: true, get: function () { return cloneModel_1.cloneModelForPaste; } }));
 var mergeModel_1 = __webpack_require__(/*! ./modelApi/editing/mergeModel */ "./packages/roosterjs-content-model-dom/lib/modelApi/editing/mergeModel.ts");
 Object.defineProperty(exports, "mergeModel", ({ enumerable: true, get: function () { return mergeModel_1.mergeModel; } }));
 var deleteSelection_1 = __webpack_require__(/*! ./modelApi/editing/deleteSelection */ "./packages/roosterjs-content-model-dom/lib/modelApi/editing/deleteSelection.ts");
@@ -24739,7 +24820,34 @@ exports.normalizeAllSegments = normalizeAllSegments;
 function normalizeSingleSegment(paragraph, segment, ignoreTrailingSpaces) {
     if (ignoreTrailingSpaces === void 0) { ignoreTrailingSpaces = false; }
     var context = resetNormalizeSegmentContext();
+    var index = paragraph.segments.indexOf(segment);
     context.ignoreTrailingSpaces = ignoreTrailingSpaces;
+    // Search backward for the nearest non-empty text segment (skipping SelectionMarkers and empty text),
+    // to determine whether leading spaces of the current segment should be preserved.
+    // If the previous text doesn't end with a space, keep the leading space to maintain word separation.
+    for (var i = index - 1; i >= 0; i--) {
+        var s = paragraph.segments[i];
+        if (s.segmentType == 'Text') {
+            if (s.text.length > 0) {
+                if (s.text.substr(-1) != SPACE) {
+                    context.ignoreLeadingSpaces = false;
+                }
+                break;
+            }
+        }
+        else if (s.segmentType == 'Image') {
+            // If the previous segment is an image, we should keep the leading space of the current segment to maintain word separation.
+            context.ignoreLeadingSpaces = false;
+            break;
+        }
+        else if (s.segmentType == 'Br') {
+            // If the previous segment is a line break, we should ignore the leading space of the current segment.
+            context.ignoreLeadingSpaces = true;
+        }
+        else if (s.segmentType != 'SelectionMarker') {
+            break;
+        }
+    }
     normalizeSegment(paragraph, segment, context);
 }
 exports.normalizeSingleSegment = normalizeSingleSegment;
@@ -24780,6 +24888,10 @@ function normalizeSegment(paragraph, segment, context) {
             context.ignoreLeadingSpaces = false;
             break;
         case 'Text':
+            // Skip empty text segments to avoid affecting normalization context
+            if (segment.text.length == 0) {
+                break;
+            }
             context.textSegments.push(segment);
             context.lastInlineSegment = segment;
             context.lastTextSegment = segment;
@@ -24787,9 +24899,9 @@ function normalizeSegment(paragraph, segment, context) {
             var last = segment.text.substr(-1);
             if (!(0, hasSpacesOnly_1.hasSpacesOnly)(segment.text)) {
                 if (first == SPACE) {
-                    // 1. Multiple leading space => single &nbsp; or empty (depends on if previous segment ends with space)
+                    // 1. Multiple leading space => single space or empty (depends on if previous segment ends with space)
                     (0, mutate_1.mutateSegment)(paragraph, segment, function (textSegment) {
-                        textSegment.text = textSegment.text.replace(LEADING_SPACE_REGEX, context.ignoreLeadingSpaces ? '' : NONE_BREAK_SPACE);
+                        textSegment.text = textSegment.text.replace(LEADING_SPACE_REGEX, context.ignoreLeadingSpaces ? '' : SPACE);
                     });
                 }
                 if (last == SPACE) {
@@ -25888,8 +26000,20 @@ function getBorderStyleFromColor(color) {
 "use strict";
 
 Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.cloneModel = void 0;
+exports.cloneModel = exports.cloneModelForPaste = void 0;
 var tslib_1 = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.mjs");
+var CloneOption = {
+    includeCachedElement: function (node, type) { return (type == 'cache' ? undefined : node); },
+};
+/**
+ * Clone a content model for paste operations, ensuring that cached elements are handled appropriately.
+ * @param model The content model to clone
+ * @returns A cloned content model suitable for paste operations
+ */
+function cloneModelForPaste(model) {
+    return cloneModel(model, CloneOption);
+}
+exports.cloneModelForPaste = cloneModelForPaste;
 /**
  * Clone a content model
  * @param model The content model to clone
@@ -28673,6 +28797,7 @@ function internalIterateSelections(path, callback, option, table, treatAllAsSele
 
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.setSelection = void 0;
+var tslib_1 = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.mjs");
 var isGeneralSegment_1 = __webpack_require__(/*! ../typeCheck/isGeneralSegment */ "./packages/roosterjs-content-model-dom/lib/modelApi/typeCheck/isGeneralSegment.ts");
 var mutate_1 = __webpack_require__(/*! ../common/mutate */ "./packages/roosterjs-content-model-dom/lib/modelApi/common/mutate.ts");
 /**
@@ -28710,6 +28835,7 @@ function setSelectionToBlockGroup(group, isInSelection, start, end) {
     });
 }
 function setSelectionToBlock(block, isInSelection, start, end) {
+    var _a;
     switch (block.blockType) {
         case 'BlockGroup':
             return setSelectionToBlockGroup(block, isInSelection, start, end);
@@ -28730,16 +28856,31 @@ function setSelectionToBlock(block, isInSelection, start, end) {
                 return isInSelection;
             });
         case 'Paragraph':
-            var segmentsToDelete_1 = [];
+            var state_1 = {
+                segmentsToDelete: [],
+                boundaryMarkers: [],
+                hasSelectedNonMarker: false,
+            };
             block.segments.forEach(function (segment, i) {
                 isInSelection = handleSelection(isInSelection, segment, start, end, function (isInSelection) {
-                    return setSelectionToSegment(block, segment, isInSelection, segmentsToDelete_1, start, end, i);
+                    return setSelectionToSegment(block, segment, isInSelection, state_1, start, end, i);
                 });
             });
-            if (segmentsToDelete_1.length > 0) {
+            if (state_1.hasSelectedNonMarker) {
+                // This paragraph contains a real (non-marker) selected segment, so any leading/trailing
+                // selection marker of the range is redundant within this paragraph and can be removed.
+                // We only do this within the same paragraph: a boundary marker at a paragraph edge must be
+                // kept to distinguish "selection starts at the beginning of this line" from "selection
+                // starts at the end of the previous line".
+                (_a = state_1.segmentsToDelete).push.apply(_a, (0, tslib_1.__spreadArray)([], (0, tslib_1.__read)(state_1.boundaryMarkers), false));
+            }
+            if (state_1.segmentsToDelete.length > 0) {
                 var mutablePara = (0, mutate_1.mutateBlock)(block);
                 var index = void 0;
-                while ((index = segmentsToDelete_1.pop()) !== undefined) {
+                // Sort ascending so the pop()-based splice below always removes the highest index first,
+                // keeping the remaining indices valid (boundary markers may sit before queued deletions).
+                state_1.segmentsToDelete.sort(function (a, b) { return a - b; });
+                while ((index = state_1.segmentsToDelete.pop()) !== undefined) {
                     if (index >= 0) {
                         mutablePara.segments.splice(index, 1);
                     }
@@ -28788,14 +28929,23 @@ function findCell(table, cell) {
         : -1;
     return { row: row, col: col };
 }
-function setSelectionToSegment(paragraph, segment, isInSelection, segmentsToDelete, start, end, i) {
+function setSelectionToSegment(paragraph, segment, isInSelection, state, start, end, i) {
+    if (segment.segmentType != 'SelectionMarker' && isInSelection) {
+        state.hasSelectedNonMarker = true;
+    }
     switch (segment.segmentType) {
         case 'SelectionMarker':
             if (!isInSelection || (segment != start && segment != end)) {
                 // Delete the selection marker when
                 // 1. It is not in selection any more. Or
                 // 2. It is in middle of selection, so no need to have it
-                segmentsToDelete.push(i);
+                state.segmentsToDelete.push(i);
+            }
+            else {
+                // It is a leading/trailing selection marker of a range selection. Keep it for now, but
+                // remember it so it can be removed later if this same paragraph also contains a real
+                // (non-marker) selected segment, in which case the marker is redundant.
+                state.boundaryMarkers.push(i);
             }
             return isInSelection;
         case 'General':
@@ -29236,7 +29386,7 @@ var handleBlockGroupChildren = function (doc, parent, group, context) {
                 (_a = context.domIndexer) === null || _a === void 0 ? void 0 : _a.onBlockEntity(childBlock, group);
             }
         });
-        cleanUpNodeStack(listFormat.nodeStack, context);
+        cleanUpNodeStack(listFormat.nodeStack, context, parent);
         // Remove all rest node if any since they don't appear in content model
         (0, cleanUpRestNodes_1.cleanUpRestNodes)(refNode, context.rewriteFromModel);
     }
@@ -29245,7 +29395,7 @@ var handleBlockGroupChildren = function (doc, parent, group, context) {
     }
 };
 exports.handleBlockGroupChildren = handleBlockGroupChildren;
-function cleanUpNodeStack(nodeStack, context) {
+function cleanUpNodeStack(nodeStack, context, leavingParent) {
     var _a, _b;
     if (nodeStack.length > 0) {
         // Clear list stack, only run to nodeStack[1] because nodeStack[0] is the parent node
@@ -29253,6 +29403,13 @@ function cleanUpNodeStack(nodeStack, context) {
             var node = (_b = (_a = nodeStack.pop()) === null || _a === void 0 ? void 0 : _a.refNode) !== null && _b !== void 0 ? _b : null;
             (0, cleanUpRestNodes_1.cleanUpRestNodes)(node, context.rewriteFromModel);
         }
+        if (leavingParent && nodeStack[0].node == leavingParent) {
+            // When leaving a parent node that is the same with the root of node stack
+            // It means the whole list node stack is being invalidated, so we clear it
+            while (nodeStack.length > 0) {
+                nodeStack.pop();
+            }
+        }
     }
 }
 
@@ -30641,11 +30798,17 @@ exports.MarkdownHeadings = {
 "use strict";
 
 Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.convertContentModelToMarkdown = exports.convertMarkdownToContentModel = void 0;
+exports.MarkdownPastePlugin = exports.isPastedContentMarkdown = exports.isContentMarkdown = exports.convertContentModelToMarkdown = exports.convertMarkdownToContentModel = void 0;
 var convertMarkdownToContentModel_1 = __webpack_require__(/*! ./markdownToModel/convertMarkdownToContentModel */ "./packages/roosterjs-content-model-markdown/lib/markdownToModel/convertMarkdownToContentModel.ts");
 Object.defineProperty(exports, "convertMarkdownToContentModel", ({ enumerable: true, get: function () { return convertMarkdownToContentModel_1.convertMarkdownToContentModel; } }));
 var convertContentModelToMarkdown_1 = __webpack_require__(/*! ./modelToMarkdown/convertContentModelToMarkdown */ "./packages/roosterjs-content-model-markdown/lib/modelToMarkdown/convertContentModelToMarkdown.ts");
 Object.defineProperty(exports, "convertContentModelToMarkdown", ({ enumerable: true, get: function () { return convertContentModelToMarkdown_1.convertContentModelToMarkdown; } }));
+var isContentMarkdown_1 = __webpack_require__(/*! ./publicApi/isContentMarkdown */ "./packages/roosterjs-content-model-markdown/lib/publicApi/isContentMarkdown.ts");
+Object.defineProperty(exports, "isContentMarkdown", ({ enumerable: true, get: function () { return isContentMarkdown_1.isContentMarkdown; } }));
+var isPastedContentMarkdown_1 = __webpack_require__(/*! ./publicApi/isPastedContentMarkdown */ "./packages/roosterjs-content-model-markdown/lib/publicApi/isPastedContentMarkdown.ts");
+Object.defineProperty(exports, "isPastedContentMarkdown", ({ enumerable: true, get: function () { return isPastedContentMarkdown_1.isPastedContentMarkdown; } }));
+var MarkdownPastePlugin_1 = __webpack_require__(/*! ./plugins/MarkdownPastePlugin */ "./packages/roosterjs-content-model-markdown/lib/plugins/MarkdownPastePlugin.ts");
+Object.defineProperty(exports, "MarkdownPastePlugin", ({ enumerable: true, get: function () { return MarkdownPastePlugin_1.MarkdownPastePlugin; } }));
 
 
 /***/ },
@@ -31335,6 +31498,13 @@ function parseInlineSegments(text, segments, state, link) {
     };
     while (i < text.length) {
         var remaining = text.substring(i);
+        // Escaped character: a backslash followed by an ASCII punctuation character emits
+        // that character literally (e.g. "\*" -> "*") and is never treated as a marker.
+        if (text[i] === '\\' && i + 1 < text.length && isEscapable(text[i + 1])) {
+            buffer += text[i + 1];
+            i += 2;
+            continue;
+        }
         // Image: ![alt](url)
         var imgMatch = imagePattern.exec(remaining);
         if (imgMatch && isValidUrl(imgMatch[2])) {
@@ -31398,6 +31568,10 @@ function shouldToggleFormatting(text, index, marker, currentState) {
 function isWhitespace(char) {
     return /\s/.test(char);
 }
+function isEscapable(char) {
+    // Per CommonMark, any ASCII punctuation character may be backslash-escaped.
+    return /[!"#$%&'()*+,\-./:;<=>?@[\\\]^_`{|}~]/.test(char);
+}
 function toggleFormatting(state, type) {
     switch (type) {
         case 'bold':
@@ -31901,6 +32075,278 @@ function modelProcessor(model, newLine) {
 exports.modelProcessor = modelProcessor;
 
 
+/***/ },
+
+/***/ "./packages/roosterjs-content-model-markdown/lib/plugins/MarkdownPastePlugin.ts"
+/*!**************************************************************************************!*\
+  !*** ./packages/roosterjs-content-model-markdown/lib/plugins/MarkdownPastePlugin.ts ***!
+  \**************************************************************************************/
+(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.MarkdownPastePlugin = void 0;
+var convertMarkdownToContentModel_1 = __webpack_require__(/*! ../markdownToModel/convertMarkdownToContentModel */ "./packages/roosterjs-content-model-markdown/lib/markdownToModel/convertMarkdownToContentModel.ts");
+var isPastedContentMarkdown_1 = __webpack_require__(/*! ../publicApi/isPastedContentMarkdown */ "./packages/roosterjs-content-model-markdown/lib/publicApi/isPastedContentMarkdown.ts");
+var roosterjs_content_model_dom_1 = __webpack_require__(/*! roosterjs-content-model-dom */ "./packages/roosterjs-content-model-dom/lib/index.ts");
+var DefaultOptions = {
+    autoConversion: false,
+    undoConversion: false,
+};
+/**
+ * Markdown paste plugin. Handles the BeforePaste event and, when the pasted content
+ * can be interpreted as markdown, converts the plain text into a Content Model and
+ * pastes it as rich markdown content instead of the original clipboard HTML.
+ */
+var MarkdownPastePlugin = /** @class */ (function () {
+    /**
+     * Construct a new instance of MarkdownPastePlugin
+     * @param options Options to control the markdown paste behavior
+     */
+    function MarkdownPastePlugin(options) {
+        this.editor = null;
+        this.options = options !== null && options !== void 0 ? options : DefaultOptions;
+    }
+    /**
+     * Get name of this plugin
+     */
+    MarkdownPastePlugin.prototype.getName = function () {
+        return 'MarkdownPaste';
+    };
+    /**
+     * The first method that editor will call to a plugin when editor is initializing.
+     * It will pass in the editor instance, plugin should take this chance to save the
+     * editor reference so that it can call to any editor method or format API later.
+     * @param editor The editor object
+     */
+    MarkdownPastePlugin.prototype.initialize = function (editor) {
+        this.editor = editor;
+    };
+    /**
+     * The last method that editor will call to a plugin before it is disposed.
+     * Plugin can take this chance to clear the reference to editor. After this method is
+     * called, plugin should not call to any editor method since it will result in error.
+     */
+    MarkdownPastePlugin.prototype.dispose = function () {
+        this.editor = null;
+    };
+    /**
+     * Core method for a plugin. Once an event happens in editor, editor will call this
+     * method of each plugin to handle the event as long as the event is not handled
+     * exclusively by another plugin.
+     * @param event The event to handle:
+     */
+    MarkdownPastePlugin.prototype.onPluginEvent = function (event) {
+        if (!this.editor) {
+            return;
+        }
+        if (event.eventType === 'contentChanged' &&
+            event.source === roosterjs_content_model_dom_1.ChangeSource.Paste &&
+            this.options.autoConversion &&
+            event.data) {
+            var clipboardData = event.data;
+            var shouldConvert = clipboardData && clipboardData.pasteNativeEvent && this.options.autoConversion;
+            if (shouldConvert &&
+                (0, isPastedContentMarkdown_1.isPastedContentMarkdown)(this.editor, clipboardData) &&
+                clipboardData.modelBeforePaste) {
+                var modelBeforePaste_1 = (0, roosterjs_content_model_dom_1.cloneModelForPaste)(clipboardData.modelBeforePaste);
+                (0, roosterjs_content_model_dom_1.mergeModel)(modelBeforePaste_1, (0, convertMarkdownToContentModel_1.convertMarkdownToContentModel)(clipboardData.text, { emptyLine: 'merge' }));
+                if (this.options.undoConversion) {
+                    this.editor.takeSnapshot();
+                }
+                this.editor.formatContentModel(function (model) {
+                    model.blocks = modelBeforePaste_1.blocks;
+                    return true;
+                }, {
+                    apiName: 'MarkdownConversion',
+                    scrollCaretIntoView: true,
+                });
+            }
+        }
+        else if (event.eventType === 'beforePaste' && !event.clipboardData.pasteNativeEvent) {
+            var shouldConvert = event.pasteType === 'asMarkdown';
+            if (shouldConvert && (0, isPastedContentMarkdown_1.isPastedContentMarkdown)(this.editor, event.clipboardData)) {
+                convertPastedTextToMarkdown(this.editor, event.fragment, event.clipboardData.text);
+            }
+        }
+    };
+    return MarkdownPastePlugin;
+}());
+exports.MarkdownPastePlugin = MarkdownPastePlugin;
+function convertPastedTextToMarkdown(editor, fragment, text) {
+    var model = (0, convertMarkdownToContentModel_1.convertMarkdownToContentModel)(text, {
+        emptyLine: 'merge',
+    });
+    while (fragment.firstChild) {
+        fragment.removeChild(fragment.firstChild);
+    }
+    (0, roosterjs_content_model_dom_1.contentModelToDom)(editor.getDocument(), fragment, model, (0, roosterjs_content_model_dom_1.createModelToDomContext)());
+}
+
+
+/***/ },
+
+/***/ "./packages/roosterjs-content-model-markdown/lib/publicApi/isContentMarkdown.ts"
+/*!**************************************************************************************!*\
+  !*** ./packages/roosterjs-content-model-markdown/lib/publicApi/isContentMarkdown.ts ***!
+  \**************************************************************************************/
+(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.isContentMarkdown = void 0;
+var tslib_1 = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.mjs");
+// Block-level markdown patterns. A line that matches any of these is considered markdown.
+var BlockPatterns = [
+    /^#{1,6}\s.+/,
+    /^\s*>\s.+/,
+    /^\s*[\*\-\+]\s.+/,
+    /^\s*\d+\.\s.+/,
+    /^---+$/,
+    /^\s*\|.*\|\s*$/, // table row: "| a | b |"
+];
+// Inline markdown patterns. The text contains markdown if any of these match anywhere.
+var InlinePatterns = [
+    /!\[[^\[\]]+\]\([^\)\s]+\)/,
+    /\[[^\[\]]+\]\([^\)\s]+\)/,
+    /\*\*[^\s*][^*]*\*\*/,
+    /(^|[^*])\*[^\s*][^*]*\*([^*]|$)/,
+    /~~[^\s~][^~]*~~/, // strikethrough: ~~text~~
+];
+/**
+ * Detect whether the given plain text contains any markdown markup.
+ * Recognizes block-level patterns (headings, blockquotes, lists, horizontal rules, tables)
+ * and inline patterns (bold, italic, strikethrough, links, images).
+ * @param text The plain text to check.
+ * @returns True if the text contains any markdown markup, false otherwise.
+ */
+function isContentMarkdown(text) {
+    var e_1, _a, e_2, _b, e_3, _c;
+    if (!text || !text.trim()) {
+        return false;
+    }
+    var lines = text.split(/\r\n|\r|\n/);
+    try {
+        for (var lines_1 = (0, tslib_1.__values)(lines), lines_1_1 = lines_1.next(); !lines_1_1.done; lines_1_1 = lines_1.next()) {
+            var line = lines_1_1.value;
+            try {
+                for (var BlockPatterns_1 = (e_2 = void 0, (0, tslib_1.__values)(BlockPatterns)), BlockPatterns_1_1 = BlockPatterns_1.next(); !BlockPatterns_1_1.done; BlockPatterns_1_1 = BlockPatterns_1.next()) {
+                    var pattern = BlockPatterns_1_1.value;
+                    if (pattern.test(line)) {
+                        return true;
+                    }
+                }
+            }
+            catch (e_2_1) { e_2 = { error: e_2_1 }; }
+            finally {
+                try {
+                    if (BlockPatterns_1_1 && !BlockPatterns_1_1.done && (_b = BlockPatterns_1.return)) _b.call(BlockPatterns_1);
+                }
+                finally { if (e_2) throw e_2.error; }
+            }
+        }
+    }
+    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+    finally {
+        try {
+            if (lines_1_1 && !lines_1_1.done && (_a = lines_1.return)) _a.call(lines_1);
+        }
+        finally { if (e_1) throw e_1.error; }
+    }
+    try {
+        for (var InlinePatterns_1 = (0, tslib_1.__values)(InlinePatterns), InlinePatterns_1_1 = InlinePatterns_1.next(); !InlinePatterns_1_1.done; InlinePatterns_1_1 = InlinePatterns_1.next()) {
+            var pattern = InlinePatterns_1_1.value;
+            if (pattern.test(text)) {
+                return true;
+            }
+        }
+    }
+    catch (e_3_1) { e_3 = { error: e_3_1 }; }
+    finally {
+        try {
+            if (InlinePatterns_1_1 && !InlinePatterns_1_1.done && (_c = InlinePatterns_1.return)) _c.call(InlinePatterns_1);
+        }
+        finally { if (e_3) throw e_3.error; }
+    }
+    return false;
+}
+exports.isContentMarkdown = isContentMarkdown;
+
+
+/***/ },
+
+/***/ "./packages/roosterjs-content-model-markdown/lib/publicApi/isPastedContentMarkdown.ts"
+/*!********************************************************************************************!*\
+  !*** ./packages/roosterjs-content-model-markdown/lib/publicApi/isPastedContentMarkdown.ts ***!
+  \********************************************************************************************/
+(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.isPastedContentMarkdown = void 0;
+var isContentMarkdown_1 = __webpack_require__(/*! ./isContentMarkdown */ "./packages/roosterjs-content-model-markdown/lib/publicApi/isContentMarkdown.ts");
+// Tags that are considered "thin wrappers", which only add structure (such as line breaks)
+// around the plain text without applying any real formatting to its content.
+var ThinWrapperTags = new Set(['DIV', 'P', 'BR', 'SPAN']);
+var AllowedAttributes = new Set(['class', 'style']);
+/**
+ * Detect whether the given clipboard content can be interpreted as markdown.
+ * @param editor The editor instance.
+ * @param clipboardData The clipboard data to check.
+ * @returns True if the content can be interpreted as markdown, false otherwise.
+ */
+function isPastedContentMarkdown(editor, clipboardData) {
+    var text = clipboardData.text, rawHtml = clipboardData.rawHtml;
+    if (!text || !text.trim()) {
+        return false;
+    }
+    if ((0, isContentMarkdown_1.isContentMarkdown)(text)) {
+        if (!rawHtml) {
+            return true;
+        }
+        var doc = editor.getDocument();
+        var trustedHTMLHandler = editor.getDOMCreator();
+        var fragment = parseHtmlToFragment(rawHtml, doc, trustedHTMLHandler);
+        return isThinWrapperOfPlainText(fragment, text);
+    }
+    return false;
+}
+exports.isPastedContentMarkdown = isPastedContentMarkdown;
+function isThinWrapperOfPlainText(fragment, text) {
+    var elements = fragment.querySelectorAll('*');
+    for (var i = 0; i < elements.length; i++) {
+        var element = elements[i];
+        if (!ThinWrapperTags.has(element.tagName)) {
+            return false;
+        }
+        for (var j = 0; j < element.attributes.length; j++) {
+            var attr = element.attributes[j];
+            if (!AllowedAttributes.has(attr.name) && !attr.name.startsWith('data-')) {
+                return false;
+            }
+        }
+    }
+    return removeWhitespace(fragment.textContent || '') === removeWhitespace(text);
+}
+function removeWhitespace(text) {
+    return text.replace(/\s/g, '');
+}
+function parseHtmlToFragment(html, doc, trustedHTMLHandler) {
+    var parsedDoc = trustedHTMLHandler.htmlToDOM(html);
+    var fragment = doc.createDocumentFragment();
+    var body = parsedDoc === null || parsedDoc === void 0 ? void 0 : parsedDoc.body;
+    if (body) {
+        while (body.firstChild) {
+            fragment.appendChild(body.firstChild);
+        }
+    }
+    return fragment;
+}
+
+
 /***/ },
 
 /***/ "./packages/roosterjs-content-model-plugins/lib/announce/AnnouncePlugin.ts"
@@ -37665,16 +38111,31 @@ function createImageWrapper(editor, image, options, editInfo, htmlOptions, opera
         croppers = (0, createImageCropper_1.createImageCropper)(doc);
     }
     var wrapper = createWrapper(editor, imageClone, options, editInfo, resizers, rotators, croppers);
+    // Capture the image footprint before attaching the shadow root, since the light-DOM image
+    // stops being rendered once the shadow root takes over.
+    var imageWidth = image.offsetWidth;
+    var imageHeight = image.offsetHeight;
     var imageSpan = (0, roosterjs_content_model_dom_1.wrap)(doc, image, 'span');
-    var shadowSpan = createShadowSpan(wrapper, imageSpan);
+    var shadowSpan = createShadowSpan(wrapper, imageSpan, imageWidth, imageHeight);
     return { wrapper: wrapper, shadowSpan: shadowSpan, imageClone: imageClone, resizers: resizers, rotators: rotators, croppers: croppers };
 }
 exports.createImageWrapper = createImageWrapper;
-var createShadowSpan = function (wrapper, imageSpan) {
+var createShadowSpan = function (wrapper, imageSpan, imageWidth, imageHeight) {
     var shadowRoot = imageSpan.attachShadow({
         mode: 'open',
     });
     imageSpan.id = IMAGE_EDIT_SHADOW_ROOT;
+    // Pin the shadow host to the original image's box so that wrapping the image does not grow the
+    // surrounding line box. Without this, the taller edit wrapper enlarges the line and the browser
+    // scrolls the selection back into view, making the editor jump. The wrapper and handles still
+    // overflow the host visually because overflow is left visible.
+    if (imageWidth > 0 && imageHeight > 0) {
+        imageSpan.style.display = 'inline-block';
+        imageSpan.style.width = imageWidth + "px";
+        imageSpan.style.height = imageHeight + "px";
+        imageSpan.style.verticalAlign = 'bottom';
+        imageSpan.style.overflow = 'visible';
+    }
     shadowRoot.appendChild(wrapper);
     return imageSpan;
 };