roosterjs 9.55.0 → 9.57.0

package/dist/rooster.js

@@ -8545,9 +8545,9 @@ var DefaultSanitizingOption = {
 /**
  * @internal
  */
-function createDomToModelContextForSanitizing(document, defaultFormat, defaultOption, additionalSanitizingOption, domHelper) {
+function createDomToModelContextForSanitizing(document, defaultFormat, defaultOption, additionalSanitizingOption, domHelper, experimentalFeatures) {
     var sanitizingOption = (0, tslib_1.__assign)((0, tslib_1.__assign)({}, DefaultSanitizingOption), additionalSanitizingOption);
-    return (0, roosterjs_content_model_dom_1.createDomToModelContext)((0, tslib_1.__assign)((0, tslib_1.__assign)({ defaultFormat: defaultFormat }, (0, getRootComputedStyleForContext_1.getRootComputedStyleForContext)(document)), { experimentalFeatures: [], editorViewWidth: domHelper === null || domHelper === void 0 ? void 0 : domHelper.getClientWidth() }), defaultOption, {
+    return (0, roosterjs_content_model_dom_1.createDomToModelContext)((0, tslib_1.__assign)((0, tslib_1.__assign)({ defaultFormat: defaultFormat }, (0, getRootComputedStyleForContext_1.getRootComputedStyleForContext)(document)), { experimentalFeatures: experimentalFeatures !== null && experimentalFeatures !== void 0 ? experimentalFeatures : [], editorViewWidth: domHelper === null || domHelper === void 0 ? void 0 : domHelper.getClientWidth() }), defaultOption, {
         processorOverride: {
             '#text': pasteTextProcessor_1.pasteTextProcessor,
             entity: (0, pasteEntityProcessor_1.createPasteEntityProcessor)(sanitizingOption),
@@ -9389,12 +9389,13 @@ var BlackColor = 'rgb(0,0,0)';
  */
 function mergePasteContent(editor, eventResult, isFirstPaste) {
     var fragment = eventResult.fragment, domToModelOption = eventResult.domToModelOption, customizedMerge = eventResult.customizedMerge, pasteType = eventResult.pasteType, clipboardData = eventResult.clipboardData, containsBlockElements = eventResult.containsBlockElements;
+    var shouldScrollCaretIntoView = !isImageOnlyFragment(fragment);
     editor.formatContentModel(function (model, context) {
         if (!isFirstPaste && 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());
+        var domToModelContext = (0, createDomToModelContextForSanitizing_1.createDomToModelContextForSanitizing)(editor.getDocument(), undefined /*defaultFormat*/, editor.getEnvironment().domToModelSettings.customized, domToModelOption, editor.getDOMHelper(), editor.getExperimentalFeatures());
         domToModelContext.segmentFormat = getSegmentFormatForPaste(model, pasteType);
         var pasteModel = (0, roosterjs_content_model_dom_1.domToContentModel)(fragment, domToModelContext);
         var mergeOption = {
@@ -9414,7 +9415,7 @@ function mergePasteContent(editor, eventResult, isFirstPaste) {
     }, {
         changeSource: roosterjs_content_model_dom_1.ChangeSource.Paste,
         getChangeData: function () { return clipboardData; },
-        scrollCaretIntoView: true,
+        scrollCaretIntoView: shouldScrollCaretIntoView,
         apiName: 'paste',
     });
 }
@@ -9455,6 +9456,13 @@ function getLastSegmentFormat(pasteModel) {
     }
     return {};
 }
+function isImageOnlyFragment(pasteFragment) {
+    var _a;
+    var images = pasteFragment.querySelectorAll('img');
+    return (images.length === 1 &&
+        pasteFragment.childNodes.length === 1 &&
+        ((_a = pasteFragment.textContent) === null || _a === void 0 ? void 0 : _a.trim()) === '');
+}
 
 
 /***/ },
@@ -9500,11 +9508,11 @@ function paste(editor, clipboardData, pasteTypeOrGetter) {
         clipboardData.rawHtml = (0, cleanHtmlComments_1.cleanHtmlComments)(clipboardData.rawHtml);
     }
     var doc = createDOMFromHtml(clipboardData.rawHtml, domCreator);
-    var pasteType = typeof pasteTypeOrGetter == 'function'
-        ? pasteTypeOrGetter(doc, clipboardData)
-        : pasteTypeOrGetter;
     // 2. Handle HTML from clipboard
     var htmlFromClipboard = (0, retrieveHtmlInfo_1.retrieveHtmlInfo)(doc, clipboardData);
+    var pasteType = typeof pasteTypeOrGetter == 'function'
+        ? pasteTypeOrGetter(doc, clipboardData, editor.getEnvironment(), htmlFromClipboard.metadata)
+        : pasteTypeOrGetter;
     // 3. Create target fragment
     var sourceFragment = (0, createPasteFragment_1.createPasteFragment)(editor.getDocument(), clipboardData, pasteType, (_a = (clipboardData.rawHtml == clipboardData.html
         ? doc
@@ -10289,7 +10297,7 @@ var formatContentModel = function (core, formatter, options, domToModelOptions)
         try {
             handleImages(core, context);
             selection =
-                (_a = core.api.setContentModel(core, model, hasFocus ? undefined : { ignoreSelection: true }, // If editor did not have focus before format, do not set focus after format
+                (_a = core.api.setContentModel(core, model, hasFocus && !(options === null || options === void 0 ? void 0 : options.skipDOMSelection) ? undefined : { ignoreSelection: true }, // If editor did not have focus before format, do not set focus after format
                 onNodeCreated)) !== null && _a !== void 0 ? _a : undefined;
             handlePendingFormat(core, context, selection);
             if (scroll && ((selection === null || selection === void 0 ? void 0 : selection.type) == 'range' || (selection === null || selection === void 0 ? void 0 : selection.type) == 'image')) {
@@ -14491,6 +14499,7 @@ var Down = 'ArrowDown';
 var Left = 'ArrowLeft';
 var Right = 'ArrowRight';
 var Tab = 'Tab';
+var F10 = 'F10';
 /**
  * @internal
  */
@@ -14507,7 +14516,6 @@ var SelectionPlugin = /** @class */ (function () {
         this.disposer = null;
         this.logicalRootDisposer = null;
         this.isSafari = false;
-        this.isMac = false;
         this.scrollTopCache = 0;
         this.onMouseMove = function (event) {
             var _a, _b, _c;
@@ -14559,7 +14567,7 @@ var SelectionPlugin = /** @class */ (function () {
         // MacOS will not create a mouseUp event if contextMenu event is not prevent defaulted.
         // Make sure we capture image target even if image is wrapped
         this.getContainedTargetImage = function (event, previousSelection) {
-            if (!_this.isMac || !previousSelection || previousSelection.type !== 'image') {
+            if (!previousSelection || previousSelection.type !== 'image') {
                 return null;
             }
             var target = event.target;
@@ -14599,11 +14607,11 @@ var SelectionPlugin = /** @class */ (function () {
             if (((_a = _this.editor) === null || _a === void 0 ? void 0 : _a.hasFocus()) && !_this.editor.isInShadowEdit()) {
                 var newSelection = _this.editor.getDOMSelection();
                 var domHelper = _this.editor.getDOMHelper();
-                //If am image selection changed to a wider range due a keyboard event, we should update the selection
+                // If an image selection changed to a wider range due to a keyboard event, we should update the selection
                 var range = domHelper.getSelectionRange();
                 if (range) {
                     var image = (0, isSingleImageInSelection_1.isSingleImageInSelection)(range);
-                    if ((newSelection === null || newSelection === void 0 ? void 0 : newSelection.type) == 'image' && !image) {
+                    if ((newSelection === null || newSelection === void 0 ? void 0 : newSelection.type) == 'image' && !image && !range.collapsed) {
                         var sel = (_b = _this.editor.getDocument().defaultView) === null || _b === void 0 ? void 0 : _b.getSelection();
                         var isReverted = sel
                             ? sel.focusNode != range.endContainer || sel.focusOffset != range.endOffset
@@ -14662,7 +14670,6 @@ var SelectionPlugin = /** @class */ (function () {
         var env = this.editor.getEnvironment();
         var document = this.editor.getDocument();
         this.isSafari = !!env.isSafari;
-        this.isMac = !!env.isMac;
         document.addEventListener('selectionchange', this.onSelectionChange);
         if (this.isSafari) {
             this.disposer = this.editor.attachDomEvent({
@@ -14815,6 +14822,7 @@ var SelectionPlugin = /** @class */ (function () {
                 }
                 break;
             case 'range':
+                var image = void 0;
                 if (key == Up || key == Down || key == Left || key == Right || key == Tab) {
                     var start = selection.range.startContainer;
                     this.state.tableSelection = this.parseTableSelection(start, start, editor.getDOMHelper());
@@ -14830,6 +14838,14 @@ var SelectionPlugin = /** @class */ (function () {
                         }
                     }
                 }
+                else if (key == F10 &&
+                    rawEvent.shiftKey &&
+                    (image = (0, isSingleImageInSelection_1.isSingleImageInSelection)(selection.range))) {
+                    this.setDOMSelection({
+                        type: 'image',
+                        image: image,
+                    }, null /* tableSelection */);
+                }
                 break;
             case 'table':
                 // After a content change event is handled tableSelection state is reset to null
@@ -15973,6 +15989,13 @@ var Editor = /** @class */ (function () {
     Editor.prototype.isExperimentalFeatureEnabled = function (featureName) {
         return this.getCore().experimentalFeatures.indexOf(featureName) >= 0;
     };
+    /**
+     * Get all experimental features enabled in this editor
+     * @returns An array of experimental feature names
+     * */
+    Editor.prototype.getExperimentalFeatures = function () {
+        return this.getCore().experimentalFeatures;
+    };
     /**
      * @returns the current EditorCore object
      * @throws a standard Error if there's no core object
@@ -16812,6 +16835,8 @@ function createAriaLiveElement(document) {
     div.style.height = '1px';
     div.style.overflow = 'hidden';
     div.style.position = 'absolute';
+    div.style.top = '0';
+    div.style.left = '0';
     div.style.whiteSpace = 'nowrap';
     div.style.width = '1px';
     div.ariaLive = 'assertive';
@@ -17202,6 +17227,10 @@ exports.ChangeSource = {
      * Content changed by paste
      */
     Paste: 'Paste',
+    /**
+     * Content changed by auto markdown conversion
+     */
+    AutoMarkdownConversion: 'AutoMarkdownConversion',
     /**
      * Content changed by setContent API
      */
@@ -17613,6 +17642,9 @@ function createDomToModelDecoratorContext() {
         code: {
             format: {},
         },
+        data: {
+            format: {},
+        },
         blockDecorator: {
             format: {},
             tagName: '',
@@ -17684,6 +17716,7 @@ exports.defaultProcessorMap = void 0;
 var brProcessor_1 = __webpack_require__(/*! ../processors/brProcessor */ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/brProcessor.ts");
 var childProcessor_1 = __webpack_require__(/*! ../processors/childProcessor */ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/childProcessor.ts");
 var codeProcessor_1 = __webpack_require__(/*! ../processors/codeProcessor */ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/codeProcessor.ts");
+var dataProcessor_1 = __webpack_require__(/*! ../processors/dataProcessor */ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/dataProcessor.ts");
 var delimiterProcessor_1 = __webpack_require__(/*! ../processors/delimiterProcessor */ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/delimiterProcessor.ts");
 var elementProcessor_1 = __webpack_require__(/*! ../processors/elementProcessor */ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/elementProcessor.ts");
 var entityProcessor_1 = __webpack_require__(/*! ../processors/entityProcessor */ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/entityProcessor.ts");
@@ -17710,6 +17743,7 @@ exports.defaultProcessorMap = {
     blockquote: knownElementProcessor_1.knownElementProcessor,
     br: brProcessor_1.brProcessor,
     code: codeProcessor_1.codeProcessor,
+    data: dataProcessor_1.dataProcessor,
     dd: formatContainerProcessor_1.formatContainerProcessor,
     del: knownElementProcessor_1.knownElementProcessor,
     div: knownElementProcessor_1.knownElementProcessor,
@@ -17965,6 +17999,33 @@ var codeProcessor = function (group, element, context) {
 exports.codeProcessor = codeProcessor;
 
 
+/***/ },
+
+/***/ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/dataProcessor.ts"
+/*!*****************************************************************************************!*\
+  !*** ./packages/roosterjs-content-model-dom/lib/domToModel/processors/dataProcessor.ts ***!
+  \*****************************************************************************************/
+(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.dataProcessor = void 0;
+var knownElementProcessor_1 = __webpack_require__(/*! ./knownElementProcessor */ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/knownElementProcessor.ts");
+var parseFormat_1 = __webpack_require__(/*! ../utils/parseFormat */ "./packages/roosterjs-content-model-dom/lib/domToModel/utils/parseFormat.ts");
+var stackFormat_1 = __webpack_require__(/*! ../utils/stackFormat */ "./packages/roosterjs-content-model-dom/lib/domToModel/utils/stackFormat.ts");
+/**
+ * @internal
+ */
+var dataProcessor = function (group, element, context) {
+    (0, stackFormat_1.stackFormat)(context, { data: 'empty' }, function () {
+        (0, parseFormat_1.parseFormat)(element, context.formatParsers.data, context.data.format, context);
+        (0, knownElementProcessor_1.knownElementProcessor)(group, element, context);
+    });
+};
+exports.dataProcessor = dataProcessor;
+
+
 /***/ },
 
 /***/ "./packages/roosterjs-content-model-dom/lib/domToModel/processors/delimiterProcessor.ts"
@@ -19403,13 +19464,14 @@ var SkippedStylesForTable = [
  * @internal
  */
 function stackFormat(context, options, callback) {
-    var segmentFormat = context.segmentFormat, blockFormat = context.blockFormat, linkFormat = context.link, codeFormat = context.code, decoratorFormat = context.blockDecorator;
-    var segment = options.segment, paragraph = options.paragraph, link = options.link, code = options.code, blockDecorator = options.blockDecorator;
+    var segmentFormat = context.segmentFormat, blockFormat = context.blockFormat, linkFormat = context.link, codeFormat = context.code, dataFormat = context.data, decoratorFormat = context.blockDecorator;
+    var segment = options.segment, paragraph = options.paragraph, link = options.link, code = options.code, data = options.data, blockDecorator = options.blockDecorator;
     try {
         context.segmentFormat = stackFormatInternal(segmentFormat, segment);
         context.blockFormat = stackFormatInternal(blockFormat, paragraph);
         context.link = stackLinkInternal(linkFormat, link);
         context.code = stackCodeInternal(codeFormat, code);
+        context.data = stackDataInternal(dataFormat, data);
         context.blockDecorator = stackDecoratorInternal(decoratorFormat, blockDecorator);
         callback();
     }
@@ -19418,6 +19480,7 @@ function stackFormat(context, options, callback) {
         context.blockFormat = blockFormat;
         context.link = linkFormat;
         context.code = codeFormat;
+        context.data = dataFormat;
         context.blockDecorator = decoratorFormat;
     }
 }
@@ -19460,6 +19523,16 @@ function stackCodeInternal(codeFormat, code) {
             return codeFormat;
     }
 }
+function stackDataInternal(dataFormat, data) {
+    switch (data) {
+        case 'empty':
+            return {
+                format: {},
+            };
+        default:
+            return dataFormat;
+    }
+}
 function stackDecoratorInternal(format, decorator) {
     switch (decorator) {
         case 'empty':
@@ -22242,6 +22315,7 @@ var borderColorFormatHandler_1 = __webpack_require__(/*! ./common/borderColorFor
 var borderFormatHandler_1 = __webpack_require__(/*! ./common/borderFormatHandler */ "./packages/roosterjs-content-model-dom/lib/formatHandlers/common/borderFormatHandler.ts");
 var boxShadowFormatHandler_1 = __webpack_require__(/*! ./common/boxShadowFormatHandler */ "./packages/roosterjs-content-model-dom/lib/formatHandlers/common/boxShadowFormatHandler.ts");
 var datasetFormatHandler_1 = __webpack_require__(/*! ./common/datasetFormatHandler */ "./packages/roosterjs-content-model-dom/lib/formatHandlers/common/datasetFormatHandler.ts");
+var dataValueFormatHandler_1 = __webpack_require__(/*! ./segment/dataValueFormatHandler */ "./packages/roosterjs-content-model-dom/lib/formatHandlers/segment/dataValueFormatHandler.ts");
 var directionFormatHandler_1 = __webpack_require__(/*! ./block/directionFormatHandler */ "./packages/roosterjs-content-model-dom/lib/formatHandlers/block/directionFormatHandler.ts");
 var displayFormatHandler_1 = __webpack_require__(/*! ./block/displayFormatHandler */ "./packages/roosterjs-content-model-dom/lib/formatHandlers/block/displayFormatHandler.ts");
 var entityFormatHandler_1 = __webpack_require__(/*! ./entity/entityFormatHandler */ "./packages/roosterjs-content-model-dom/lib/formatHandlers/entity/entityFormatHandler.ts");
@@ -22287,6 +22361,7 @@ var defaultFormatHandlerMap = {
     borderColor: borderColorFormatHandler_1.borderColorFormatHandler,
     boxShadow: boxShadowFormatHandler_1.boxShadowFormatHandler,
     dataset: datasetFormatHandler_1.datasetFormatHandler,
+    dataValue: dataValueFormatHandler_1.dataValueFormatHandler,
     direction: directionFormatHandler_1.directionFormatHandler,
     display: displayFormatHandler_1.displayFormatHandler,
     float: floatFormatHandler_1.floatFormatHandler,
@@ -22428,6 +22503,7 @@ exports.defaultFormatKeysPerCategory = {
     ],
     segmentUnderLink: ['textColor'],
     code: ['fontFamily', 'display'],
+    data: ['dataValue'],
     dataset: ['dataset'],
     divider: (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([], (0, tslib_1.__read)(sharedBlockFormats), false), (0, tslib_1.__read)(sharedContainerFormats), false), ['display', 'size', 'htmlAlign'], false),
     container: (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([], (0, tslib_1.__read)(sharedContainerFormats), false), ['htmlAlign', 'size', 'display', 'id'], false),
@@ -22718,6 +22794,37 @@ exports.boldFormatHandler = {
 };
 
 
+/***/ },
+
+/***/ "./packages/roosterjs-content-model-dom/lib/formatHandlers/segment/dataValueFormatHandler.ts"
+/*!***************************************************************************************************!*\
+  !*** ./packages/roosterjs-content-model-dom/lib/formatHandlers/segment/dataValueFormatHandler.ts ***!
+  \***************************************************************************************************/
+(__unused_webpack_module, exports) {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.dataValueFormatHandler = void 0;
+/**
+ * @internal
+ * Format handler for the "value" attribute of a HTML <data> element
+ */
+exports.dataValueFormatHandler = {
+    parse: function (format, element) {
+        var _a;
+        if (element.hasAttribute('value')) {
+            format.dataValue = (_a = element.getAttribute('value')) !== null && _a !== void 0 ? _a : '';
+        }
+    },
+    apply: function (format, element) {
+        if (format.dataValue != undefined) {
+            element.setAttribute('value', format.dataValue);
+        }
+    },
+};
+
+
 /***/ },
 
 /***/ "./packages/roosterjs-content-model-dom/lib/formatHandlers/segment/fontFamilyFormatHandler.ts"
@@ -23758,9 +23865,9 @@ 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.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;
+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.addData = 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.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 = exports.trimModelForSelection = 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 = exports.getClosestAncestorBlockGroupIndex = 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");
@@ -23874,7 +23981,9 @@ Object.defineProperty(exports, "addBlock", ({ enumerable: true, get: function ()
 var addDecorators_1 = __webpack_require__(/*! ./modelApi/common/addDecorators */ "./packages/roosterjs-content-model-dom/lib/modelApi/common/addDecorators.ts");
 Object.defineProperty(exports, "addCode", ({ enumerable: true, get: function () { return addDecorators_1.addCode; } }));
 var addDecorators_2 = __webpack_require__(/*! ./modelApi/common/addDecorators */ "./packages/roosterjs-content-model-dom/lib/modelApi/common/addDecorators.ts");
-Object.defineProperty(exports, "addLink", ({ enumerable: true, get: function () { return addDecorators_2.addLink; } }));
+Object.defineProperty(exports, "addData", ({ enumerable: true, get: function () { return addDecorators_2.addData; } }));
+var addDecorators_3 = __webpack_require__(/*! ./modelApi/common/addDecorators */ "./packages/roosterjs-content-model-dom/lib/modelApi/common/addDecorators.ts");
+Object.defineProperty(exports, "addLink", ({ enumerable: true, get: function () { return addDecorators_3.addLink; } }));
 var addTextSegment_1 = __webpack_require__(/*! ./modelApi/common/addTextSegment */ "./packages/roosterjs-content-model-dom/lib/modelApi/common/addTextSegment.ts");
 Object.defineProperty(exports, "addTextSegment", ({ enumerable: true, get: function () { return addTextSegment_1.addTextSegment; } }));
 var normalizeParagraph_1 = __webpack_require__(/*! ./modelApi/common/normalizeParagraph */ "./packages/roosterjs-content-model-dom/lib/modelApi/common/normalizeParagraph.ts");
@@ -24195,7 +24304,7 @@ exports.addBlock = addBlock;
 "use strict";
 
 Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.addDecorators = exports.addCode = exports.addLink = void 0;
+exports.addDecorators = exports.addData = exports.addCode = exports.addLink = void 0;
 var tslib_1 = __webpack_require__(/*! tslib */ "./node_modules/tslib/tslib.es6.mjs");
 /**
  * @internal
@@ -24222,12 +24331,27 @@ function addCode(segment, code) {
     }
 }
 exports.addCode = addCode;
+/**
+ * @internal
+ * Add a data decorator into segment if any
+ * @param segment The segment to add decorator to
+ * @param data The data decorator to add
+ */
+function addData(segment, data) {
+    if (data.format.dataValue != undefined) {
+        segment.data = {
+            format: (0, tslib_1.__assign)({}, data.format),
+        };
+    }
+}
+exports.addData = addData;
 /**
  * @internal
  */
 function addDecorators(segment, context) {
     addLink(segment, context.link);
     addCode(segment, context.code);
+    addData(segment, context.data);
 }
 exports.addDecorators = addDecorators;
 
@@ -24512,7 +24636,8 @@ function segmentsWithSameFormat(seg1, seg2) {
     return (!!seg1.isSelected == !!seg2.isSelected &&
         (0, areSameFormats_1.areSameFormats)(seg1.format, seg2.format) &&
         areSameLinks(seg1.link, seg2.link) &&
-        areSameCodes(seg1.code, seg2.code));
+        areSameCodes(seg1.code, seg2.code) &&
+        areSameData(seg1.data, seg2.data));
 }
 function areSameLinks(link1, link2) {
     return ((!link1 && !link2) ||
@@ -24524,6 +24649,9 @@ function areSameLinks(link1, link2) {
 function areSameCodes(code1, code2) {
     return (!code1 && !code2) || (code1 && code2 && (0, areSameFormats_1.areSameFormats)(code1.format, code2.format));
 }
+function areSameData(data1, data2) {
+    return (!data1 && !data2) || (data1 && data2 && (0, areSameFormats_1.areSameFormats)(data1.format, data2.format));
+}
 
 
 /***/ },
@@ -25609,9 +25737,10 @@ var addDecorators_1 = __webpack_require__(/*! ../common/addDecorators */ "./pack
  * @param text Text of this model
  * @param format @optional The format of this model
  * @param link @optional The link decorator
- * @param code @option The code decorator
+ * @param code @optional The code decorator
+ * @param data @optional The data decorator
  */
-function createText(text, format, link, code) {
+function createText(text, format, link, code, data) {
     var result = {
         segmentType: 'Text',
         text: text,
@@ -25623,6 +25752,9 @@ function createText(text, format, link, code) {
     if (code) {
         (0, addDecorators_1.addCode)(result, code);
     }
+    if (data) {
+        (0, addDecorators_1.addData)(result, data);
+    }
     return result;
 }
 exports.createText = createText;
@@ -26090,7 +26222,7 @@ function cloneBlockGroupBase(group, options) {
     };
 }
 function cloneSegmentBase(segment) {
-    var segmentType = segment.segmentType, isSelected = segment.isSelected, code = segment.code, link = segment.link;
+    var segmentType = segment.segmentType, isSelected = segment.isSelected, code = segment.code, link = segment.link, data = segment.data;
     var newSegment = Object.assign({
         segmentType: segmentType,
         isSelected: isSelected,
@@ -26101,6 +26233,9 @@ function cloneSegmentBase(segment) {
     if (link) {
         newSegment.link = Object.assign(cloneModelWithFormat(link), cloneModelWithDataset(link));
     }
+    if (data) {
+        newSegment.data = cloneModelWithFormat(data);
+    }
     return newSegment;
 }
 function cloneEntity(entity, options) {
@@ -26905,6 +27040,11 @@ function mergeTables(markerPosition, newTable, source) {
         var newTableRowCount = newTable.rows.length;
         var lastTargetColIndex = getTargetColIndex(table, rowIndex, colIndex, newTableColCount);
         var extraColsNeeded = lastTargetColIndex - table.rows[0].cells.length;
+        newTable.rows.forEach(function (row) {
+            row.cells.forEach(function (cell) {
+                cell.spanAbove = false;
+            });
+        });
         if (extraColsNeeded > 0) {
             var currentColCount = table.rows[0].cells.length;
             for (var col = 0; col < extraColsNeeded; col++) {
@@ -30136,7 +30276,7 @@ var moveChildNodes_1 = __webpack_require__(/*! ../../domUtils/moveChildNodes */
  * @internal
  */
 var handleSegmentDecorator = function (_, parent, segment, context) {
-    var code = segment.code, link = segment.link;
+    var code = segment.code, link = segment.link, data = segment.data;
     if ((0, isNodeOfType_1.isNodeOfType)(parent, 'ELEMENT_NODE')) {
         if (link) {
             (0, stackFormat_1.stackFormat)(context, 'a', function () {
@@ -30155,6 +30295,14 @@ var handleSegmentDecorator = function (_, parent, segment, context) {
                 (_a = context.onNodeCreated) === null || _a === void 0 ? void 0 : _a.call(context, code, codeNode);
             });
         }
+        if (data) {
+            (0, stackFormat_1.stackFormat)(context, 'data', function () {
+                var _a;
+                var dataNode = (0, moveChildNodes_1.wrapAllChildNodes)(parent, 'data');
+                (0, applyFormat_1.applyFormat)(dataNode, context.formatAppliers.data, data.format, context);
+                (_a = context.onNodeCreated) === null || _a === void 0 ? void 0 : _a.call(context, data, dataNode);
+            });
+        }
     }
 };
 exports.handleSegmentDecorator = handleSegmentDecorator;
@@ -30339,7 +30487,20 @@ exports.handleText = handleText;
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.mergeNode = void 0;
 var isNodeOfType_1 = __webpack_require__(/*! ../../domUtils/isNodeOfType */ "./packages/roosterjs-content-model-dom/lib/domUtils/isNodeOfType.ts");
-var OptimizeTags = ['SPAN', 'B', 'EM', 'I', 'U', 'SUB', 'SUP', 'STRIKE', 'S', 'A', 'CODE'];
+var OptimizeTags = [
+    'SPAN',
+    'B',
+    'EM',
+    'I',
+    'U',
+    'SUB',
+    'SUP',
+    'STRIKE',
+    'S',
+    'A',
+    'CODE',
+    'DATA',
+];
 /**
  * @internal
  */
@@ -30915,9 +31076,9 @@ var MarkdownBlockGroupType = {
 /**
  * @internal
  */
-function createBlockGroupFromMarkdown(text, patternName, options, group) {
+function createBlockGroupFromMarkdown(text, patternName, options, group, list) {
     if (MarkdownBlockGroupType[patternName] === 'ListItem') {
-        return (0, createListFromMarkdown_1.createListFromMarkdown)(text, patternName === 'ordered_list' ? 'OL' : 'UL', options);
+        return (0, createListFromMarkdown_1.createListFromMarkdown)(text, patternName === 'ordered_list' ? 'OL' : 'UL', options, list);
     }
     else {
         return (0, createBlockQuoteFromMarkdown_1.createBlockQuoteFromMarkdown)(text, options, group);
@@ -31005,12 +31166,13 @@ var createParagraphFromMarkdown_1 = __webpack_require__(/*! ./createParagraphFro
 /**
  * @internal
  */
-function createListFromMarkdown(text, listType, options) {
+function createListFromMarkdown(text, listType, options, list) {
     var marker = text.trim().split(' ')[0];
     var isDummy = isDummyListItem(marker);
+    var startNumber = listType === 'OL' && !list ? parseInt(marker, 10) : undefined;
     var itemText = isDummy ? text : text.trim().substring(marker.length);
     var paragraph = (0, createParagraphFromMarkdown_1.createParagraphFromMarkdown)(itemText.trim(), options);
-    var levels = createLevels(text, listType, isDummy, options);
+    var levels = createLevels(text, listType, isDummy, options, startNumber);
     var listModel = (0, roosterjs_content_model_dom_1.createListItem)(levels);
     if (options.direction) {
         listModel.format.direction = options.direction;
@@ -31019,8 +31181,11 @@ function createListFromMarkdown(text, listType, options) {
     return listModel;
 }
 exports.createListFromMarkdown = createListFromMarkdown;
-function createLevels(text, listType, isDummy, options) {
+function createLevels(text, listType, isDummy, options, startNumberOverride) {
     var level = (0, roosterjs_content_model_dom_1.createListLevel)(listType, options.direction ? { direction: options.direction } : undefined);
+    if (startNumberOverride) {
+        level.format.startNumberOverride = startNumberOverride;
+    }
     if (isDummy) {
         level.format.displayForDummyItem = 'block';
     }
@@ -31309,7 +31474,7 @@ function addMarkdownBlockToModel(model, blockType, markdown, patternName, markdo
             model.blocks.push(divider);
             break;
         case 'BlockGroup':
-            var blockGroup = (0, createBlockGroupFromMarkdown_1.createBlockGroupFromMarkdown)(markdown, patternName, options, markdownContext.lastQuote);
+            var blockGroup = (0, createBlockGroupFromMarkdown_1.createBlockGroupFromMarkdown)(markdown, patternName, options, markdownContext.lastQuote, markdownContext.lastList);
             if (!markdownContext.lastQuote) {
                 model.blocks.push(blockGroup);
             }
@@ -32161,6 +32326,7 @@ var MarkdownPastePlugin = /** @class */ (function () {
                     return true;
                 }, {
                     apiName: 'MarkdownConversion',
+                    changeSource: roosterjs_content_model_dom_1.ChangeSource.AutoMarkdownConversion,
                     scrollCaretIntoView: true,
                 });
             }
@@ -33742,7 +33908,8 @@ exports.CustomReplacePlugin = CustomReplacePlugin;
 
 Object.defineProperty(exports, "__esModule", ({ value: true }));
 exports.DragAndDropPlugin = void 0;
-var handleDroppedContent_1 = __webpack_require__(/*! ./utils/handleDroppedContent */ "./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/handleDroppedContent.ts");
+var handleDroppedExternalContent_1 = __webpack_require__(/*! ./utils/handleDroppedExternalContent */ "./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/handleDroppedExternalContent.ts");
+var handleDroppedInternalContent_1 = __webpack_require__(/*! ./utils/handleDroppedInternalContent */ "./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/handleDroppedInternalContent.ts");
 var DefaultOptions = {
     forbiddenElements: ['iframe'],
 };
@@ -33759,7 +33926,7 @@ var DragAndDropPlugin = /** @class */ (function () {
         var _a;
         this.editor = null;
         this.forbiddenElements = [];
-        this.isInternalDragging = false;
+        this.internalDrag = false;
         this.disposer = null;
         this.forbiddenElements = (_a = options.forbiddenElements) !== null && _a !== void 0 ? _a : [];
     }
@@ -33781,7 +33948,7 @@ var DragAndDropPlugin = /** @class */ (function () {
         this.disposer = editor.attachDomEvent({
             dragstart: {
                 beforeDispatch: function (_ev) {
-                    _this.isInternalDragging = true;
+                    _this.internalDrag = true;
                 },
             },
         });
@@ -33797,7 +33964,6 @@ var DragAndDropPlugin = /** @class */ (function () {
             this.disposer();
             this.disposer = null;
         }
-        this.isInternalDragging = false;
         this.forbiddenElements = [];
     };
     /**
@@ -33809,17 +33975,18 @@ var DragAndDropPlugin = /** @class */ (function () {
     DragAndDropPlugin.prototype.onPluginEvent = function (event) {
         var _a;
         if (this.editor && event.eventType == 'beforeDrop') {
-            if (this.isInternalDragging) {
-                this.isInternalDragging = false;
+            var dropEvent = event.rawEvent;
+            if (this.internalDrag &&
+                this.editor.isExperimentalFeatureEnabled('HandleDropInternalContent')) {
+                (0, handleDroppedInternalContent_1.handleDroppedInternalContent)(this.editor, dropEvent);
             }
-            else {
-                var dropEvent = event.rawEvent;
+            else if (!this.internalDrag) {
                 var html = (_a = dropEvent.dataTransfer) === null || _a === void 0 ? void 0 : _a.getData('text/html');
                 if (html) {
-                    (0, handleDroppedContent_1.handleDroppedContent)(this.editor, dropEvent, html, this.forbiddenElements);
+                    (0, handleDroppedExternalContent_1.handleDroppedExternalContent)(this.editor, dropEvent, html, this.forbiddenElements);
                 }
             }
-            return;
+            this.internalDrag = false;
         }
     };
     return DragAndDropPlugin;
@@ -33873,23 +34040,23 @@ exports.cleanForbiddenElements = cleanForbiddenElements;
 
 /***/ },
 
-/***/ "./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/handleDroppedContent.ts"
-/*!************************************************************************************************!*\
-  !*** ./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/handleDroppedContent.ts ***!
-  \************************************************************************************************/
+/***/ "./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/handleDroppedExternalContent.ts"
+/*!********************************************************************************************************!*\
+  !*** ./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/handleDroppedExternalContent.ts ***!
+  \********************************************************************************************************/
 (__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
 
 Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.handleDroppedContent = void 0;
+exports.handleDroppedExternalContent = void 0;
 var cleanForbiddenElements_1 = __webpack_require__(/*! ./cleanForbiddenElements */ "./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/cleanForbiddenElements.ts");
 var roosterjs_content_model_dom_1 = __webpack_require__(/*! roosterjs-content-model-dom */ "./packages/roosterjs-content-model-dom/lib/index.ts");
 /**
  * @internal
  * Handle dropped HTML content by inserting it at the drop position
  */
-function handleDroppedContent(editor, event, html, forbiddenElements) {
+function handleDroppedExternalContent(editor, event, html, forbiddenElements) {
     var doc = editor.getDocument();
     var domPosition = (0, roosterjs_content_model_dom_1.getNodePositionFromEvent)(doc, editor.getDOMHelper(), event.x, event.y);
     if (domPosition) {
@@ -33913,7 +34080,56 @@ function handleDroppedContent(editor, event, html, forbiddenElements) {
         });
     }
 }
-exports.handleDroppedContent = handleDroppedContent;
+exports.handleDroppedExternalContent = handleDroppedExternalContent;
+
+
+/***/ },
+
+/***/ "./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/handleDroppedInternalContent.ts"
+/*!********************************************************************************************************!*\
+  !*** ./packages/roosterjs-content-model-plugins/lib/dragAndDrop/utils/handleDroppedInternalContent.ts ***!
+  \********************************************************************************************************/
+(__unused_webpack_module, exports, __webpack_require__) {
+
+"use strict";
+
+Object.defineProperty(exports, "__esModule", ({ value: true }));
+exports.handleDroppedInternalContent = void 0;
+var roosterjs_content_model_api_1 = __webpack_require__(/*! roosterjs-content-model-api */ "./packages/roosterjs-content-model-api/lib/index.ts");
+var roosterjs_content_model_dom_1 = __webpack_require__(/*! roosterjs-content-model-dom */ "./packages/roosterjs-content-model-dom/lib/index.ts");
+/**
+ * @internal
+ * Handle dropped internal HTML content by inserting it at the drop position
+ */
+function handleDroppedInternalContent(editor, event) {
+    var doc = editor.getDocument();
+    var domPosition = (0, roosterjs_content_model_dom_1.getNodePositionFromEvent)(doc, editor.getDOMHelper(), event.x, event.y);
+    var selection = editor.getDOMSelection();
+    if (domPosition && selection) {
+        event.preventDefault();
+        event.stopPropagation();
+        (0, roosterjs_content_model_api_1.formatInsertPointWithContentModel)(editor, domPosition, function (model, context, insertPoint) {
+            if (insertPoint) {
+                var cloneModel = (0, roosterjs_content_model_dom_1.cloneModelForPaste)(model);
+                (0, roosterjs_content_model_dom_1.trimModelForSelection)(cloneModel, selection);
+                if ((0, roosterjs_content_model_dom_1.deleteSelection)(model, [], context).deleteResult == 'range') {
+                    (0, roosterjs_content_model_dom_1.normalizeContentModel)(model);
+                }
+                var startMarker = (0, roosterjs_content_model_dom_1.createSelectionMarker)(insertPoint.marker.format);
+                var startParagraph = (0, roosterjs_content_model_dom_1.mutateBlock)(insertPoint.paragraph);
+                var startIndex = startParagraph.segments.indexOf(insertPoint.marker);
+                startParagraph.segments.splice(startIndex, 0, startMarker);
+                var newInsertPoint = (0, roosterjs_content_model_dom_1.mergeModel)(model, cloneModel, context, {
+                    insertPosition: insertPoint,
+                });
+                if (newInsertPoint) {
+                    (0, roosterjs_content_model_dom_1.setSelection)(model, startMarker, newInsertPoint.marker);
+                }
+            }
+        });
+    }
+}
+exports.handleDroppedInternalContent = handleDroppedInternalContent;
 
 
 /***/ },
@@ -36987,7 +37203,7 @@ var ImageEditPlugin = /** @class */ (function () {
                 if (event.rawEvent.key == 'Enter' && this.isCropMode) {
                     event.rawEvent.preventDefault();
                 }
-                this.applyFormatWithContentModel(editor, this.isCropMode, true /** should selectImage */, false /* isApiOperation */);
+                this.applyFormatWithContentModel(editor, this.isCropMode, false /** should selectImage */, false /* isApiOperation */);
             }
         }
     };
@@ -37027,6 +37243,28 @@ var ImageEditPlugin = /** @class */ (function () {
         var editingImageModel;
         var selection = editor.getDOMSelection();
         var isRTL = false;
+        var formatContentModelOptions = {
+            onNodeCreated: function (model, node) {
+                var _a;
+                if (!isApiOperation &&
+                    editingImageModel &&
+                    editingImageModel == model &&
+                    editingImageModel.format.imageState == findEditingImage_1.EDITING_MARKER &&
+                    (0, roosterjs_content_model_dom_1.isNodeOfType)(node, 'ELEMENT_NODE') &&
+                    (0, roosterjs_content_model_dom_1.isElementOfType)(node, 'img')) {
+                    if (_this.isCropMode) {
+                        _this.startCropMode(editor, node, isRTL);
+                    }
+                    else {
+                        (_a = editor.getDocument().defaultView) === null || _a === void 0 ? void 0 : _a.requestAnimationFrame(function () {
+                            _this.startRotateAndResize(editor, node, isRTL);
+                        });
+                    }
+                }
+            },
+            apiName: IMAGE_EDIT_FORMAT_EVENT,
+            skipDOMSelection: false,
+        };
         editor.formatContentModel(function (model, context) {
             var editingImage = (0, getSelectedImage_1.getSelectedImage)(model);
             var previousSelectedImage = isApiOperation
@@ -37085,28 +37323,12 @@ var ImageEditPlugin = /** @class */ (function () {
                         _this.imageEditInfo = (0, updateImageEditInfo_1.updateImageEditInfo)(image, selection.image);
                         image.format.imageState = 'isEditing';
                     });
+                    formatContentModelOptions.skipDOMSelection = !isCropMode;
                     result = true;
                 }
             }
             return result;
-        }, {
-            onNodeCreated: function (model, node) {
-                if (!isApiOperation &&
-                    editingImageModel &&
-                    editingImageModel == model &&
-                    editingImageModel.format.imageState == findEditingImage_1.EDITING_MARKER &&
-                    (0, roosterjs_content_model_dom_1.isNodeOfType)(node, 'ELEMENT_NODE') &&
-                    (0, roosterjs_content_model_dom_1.isElementOfType)(node, 'img')) {
-                    if (isCropMode) {
-                        _this.startCropMode(editor, node, isRTL);
-                    }
-                    else {
-                        _this.startRotateAndResize(editor, node, isRTL);
-                    }
-                }
-            },
-            apiName: IMAGE_EDIT_FORMAT_EVENT,
-        }, {
+        }, formatContentModelOptions, {
             tryGetFromCache: true,
         });
     };
@@ -38092,7 +38314,6 @@ var createImageCropper_1 = __webpack_require__(/*! ../Cropper/createImageCropper
 var createImageResizer_1 = __webpack_require__(/*! ../Resizer/createImageResizer */ "./packages/roosterjs-content-model-plugins/lib/imageEdit/Resizer/createImageResizer.ts");
 var createImageRotator_1 = __webpack_require__(/*! ../Rotator/createImageRotator */ "./packages/roosterjs-content-model-plugins/lib/imageEdit/Rotator/createImageRotator.ts");
 var roosterjs_content_model_dom_1 = __webpack_require__(/*! roosterjs-content-model-dom */ "./packages/roosterjs-content-model-dom/lib/index.ts");
-var IMAGE_EDIT_SHADOW_ROOT = 'ImageEditShadowRoot';
 /**
  * @internal
  */
@@ -38125,15 +38346,8 @@ 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';
     }
@@ -38807,7 +39021,7 @@ function getSelectedImageMetadata(editor, image) {
             (0, roosterjs_content_model_dom_1.mutateSegment)(selectedImage.paragraph, selectedImage === null || selectedImage === void 0 ? void 0 : selectedImage.image, function (modelImage) {
                 imageMetadata = updateImageEditInfo(modelImage, image);
             });
-            return true;
+            return false;
         }
         return false;
     });
@@ -39617,6 +39831,7 @@ var BulletSelector = '* > span > span[style*=mso-special-format]';
 var MsOfficeSpecialFormat = 'mso-special-format';
 var CssStyleKey = 'style';
 var MsoSpecialFormatRegex = /mso-special-format:\s*([^;]*)/;
+var TableElementTags = new Set(['TABLE', 'THEAD', 'TBODY', 'TFOOT', 'TR', 'TD', 'TH']);
 var clearListItemStyles = function (format) {
     delete format.textAlign;
     delete format.marginLeft;
@@ -39643,7 +39858,9 @@ function processPastedContentFromPowerPoint(event, domCreator) {
         if (style.includes(MsOfficeSpecialFormat) && context.listFormat.levels.length > 0) {
             return;
         }
-        var bulletElement = element.querySelector(BulletSelector);
+        var bulletElement = !TableElementTags.has(element.tagName)
+            ? element.querySelector(BulletSelector)
+            : null;
         if (bulletElement) {
             var _c = extractPowerPointListInfo(element, bulletElement), depth = _c.depth, unorderedBulletType = _c.unorderedBulletType, orderedBulletType = _c.orderedBulletType, startNumberOverrideOrBullet_1 = _c.startNumberOverrideOrBullet, isOrderedList = _c.isOrderedList, isNewList_1 = _c.isNewList;
             // Setup the listformat with the metadata extracted from the bullet element
@@ -39664,6 +39881,12 @@ function processPastedContentFromPowerPoint(event, domCreator) {
                 }
                 clearListItemStyles(listItem.levels[listItem.levels.length - 1].format);
                 clearListItemStyles(listItem.format);
+                // When the list is inside a table cell, remove the font size from the
+                // list marker so it does not inherit the list's font size. Otherwise a
+                // large marker may be rendered outside of the table cell.
+                if (element.closest('td,th')) {
+                    delete listItem.formatHolder.format.fontSize;
+                }
             });
         }
         else {