@syncfusion/ej2-richtexteditor 25.2.3 → 25.2.4-621927

package/dist/es6/ej2-richtexteditor.es2015.js

@@ -778,18 +778,18 @@ const closeTooltip = 'closeTooltip';
  * @hidden
  * @deprecated
  */
-const blockEmptyNodes = `address:empty, article:empty, aside:empty, blockquote:empty,
- details:empty, dd:empty, div:empty, dl:empty, dt:empty, fieldset:empty, footer:empty,form:empty, h1:empty,
- h2:empty, h3:empty, h4:empty, h5:empty, h6:empty, header:empty, hgroup:empty, li:empty, main:empty, nav:empty,
+const blockEmptyNodes = `address:empty, article:empty, aside:empty, blockquote:empty,
+ details:empty, dd:empty, div:empty, dl:empty, dt:empty, fieldset:empty, footer:empty,form:empty, h1:empty,
+ h2:empty, h3:empty, h4:empty, h5:empty, h6:empty, header:empty, hgroup:empty, li:empty, main:empty, nav:empty,
  noscript:empty, output:empty, p:empty, pre:empty, section:empty, td:empty, th:empty`;
 /**
  * @hidden
  * @deprecated
  */
-const inlineEmptyNodes = `a:empty, abbr:empty, acronym:empty, b:empty, bdi:empty, bdo:empty, big:empty, button:empty,
-canvas:empty, cite:empty, code:empty, data:empty, datalist:empty, del:empty, dfn:empty, em:empty, font:empty, i:empty, iframe:empty,
-ins:empty, kbd:empty, label:empty, map:empty, mark:empty, meter:empty, noscript:empty, object:empty, output:empty, picture:empty, progress:empty,
-q:empty, ruby:empty, s:empty, samp:empty, script:empty, select:empty, slot:empty, small:empty, span:empty, strong:empty, strike:empty, sub:empty, sup:empty, svg:empty,
+const inlineEmptyNodes = `a:empty, abbr:empty, acronym:empty, b:empty, bdi:empty, bdo:empty, big:empty, button:empty,
+canvas:empty, cite:empty, code:empty, data:empty, datalist:empty, del:empty, dfn:empty, em:empty, font:empty, i:empty, iframe:empty,
+ins:empty, kbd:empty, label:empty, map:empty, mark:empty, meter:empty, noscript:empty, object:empty, output:empty, picture:empty, progress:empty,
+q:empty, ruby:empty, s:empty, samp:empty, script:empty, select:empty, slot:empty, small:empty, span:empty, strong:empty, strike:empty, sub:empty, sup:empty, svg:empty,
 template:empty, textarea:empty, time:empty, u:empty, tt:empty, var:empty, wbr:empty`;
 /**
  * @hidden
@@ -4574,11 +4574,14 @@ function nestedListCleanUp(range) {
                     item.remove();
                 });
             }
+            else {
+                break;
+            }
         }
         let liElem = (range.startContainer.nodeName === "#text" ? range.startContainer.parentElement : range.startContainer).querySelectorAll("li");
         if (liElem.length > 0) {
             liElem.forEach((item) => {
-                if (item.firstChild.nodeName === "OL" || item.firstChild.nodeName === "UL") {
+                if (!isNullOrUndefined(item.firstChild) && (item.firstChild.nodeName === "OL" || item.firstChild.nodeName === "UL")) {
                     item.style.listStyleType = "none";
                 }
             });
@@ -5449,8 +5452,6 @@ class ToolbarRenderer {
             target: colorPicker.element.parentElement, cssClass: css,
             enablePersistence: this.parent.enablePersistence, enableRtl: this.parent.enableRtl,
             beforeOpen: (dropDownArgs) => {
-                colorPicker.inline = true;
-                colorPicker.dataBind();
                 if (proxy.parent.readonly || !proxy.parent.enabled) {
                     dropDownArgs.cancel = true;
                     return;
@@ -5588,14 +5589,18 @@ class ToolbarRenderer {
         const colorPicker = new ColorPicker({
             enablePersistence: this.parent.enablePersistence,
             enableRtl: this.parent.enableRtl,
-            inline: false,
-            value: '#fff',
+            inline: true,
+            value: null,
+            cssClass: ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass + ' ' + 'e-rte-picker-init',
             created: () => {
                 const value = (item === 'backgroundcolor') ? proxy.parent.backgroundColor.default : proxy.parent.fontColor.default;
-                colorPicker.setProperties({ value: value });
+                colorPicker.cssClass = ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass;
+                colorPicker.value = value;
             },
             mode: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.mode : proxy.parent.fontColor.mode),
             modeSwitcher: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.modeSwitcher : proxy.parent.fontColor.modeSwitcher),
+            presetColors: (item === 'backgroundcolor') ? this.parent.backgroundColor.colorCode : this.parent.fontColor.colorCode,
+            columns: (item === 'backgroundcolor') ? this.parent.backgroundColor.columns : this.parent.fontColor.columns,
             beforeTileRender: (args) => {
                 args.element.classList.add(CLS_COLOR_PALETTE);
                 args.element.classList.add(CLS_CUSTOM_TILE);
@@ -5640,10 +5645,6 @@ class ToolbarRenderer {
             }
         });
         colorPicker.isStringTemplate = true;
-        colorPicker.columns = (item === 'backgroundcolor') ? this.parent.backgroundColor.columns : this.parent.fontColor.columns;
-        colorPicker.presetColors = (item === 'backgroundcolor') ? this.parent.backgroundColor.colorCode :
-            this.parent.fontColor.colorCode;
-        colorPicker.cssClass = ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass;
         colorPicker.createElement = this.parent.createElement;
         colorPicker.appendTo(document.getElementById(args.target));
         return colorPicker;
@@ -7210,12 +7211,12 @@ class Toolbar$2 {
     }
 }
 
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 var KeyboardEvents_1;
 const keyCode = {
     'backspace': 8,
@@ -12250,7 +12251,7 @@ class DOMNode {
     unWrap(element) {
         const parent = element.parentNode;
         let unWrapNode = [];
-        while (element.firstChild) {
+        while (element.firstChild && (element.previousSibling !== this.parent.querySelector('.e-mention-chip') || element.textContent !== ' ')) {
             unWrapNode.push(element.firstChild);
             parent.insertBefore(element.firstChild, element);
         }
@@ -12600,6 +12601,109 @@ class DOMNode {
         }
         return null;
     }
+    /**
+     * Method to wrap the inline and text node with block node.
+     *
+     * @param {HTMLElement} node - specifies the element sent to wrap the node around it with block nodes.
+     * @param {string} wrapperElement - specifies which block nodes to wrap around.
+     * @returns {HTMLElement} - returns the wrapped element.
+     * @hidden
+     * @deprecated
+     */
+    gatherElementsAround(node, wrapperElement) {
+        const newWrapElem = createElement(wrapperElement);
+        // Insert the new div element before the current node.
+        let currentNode = node.previousSibling;
+        const currentNodeParent = node.parentElement;
+        if (currentNodeParent.className === 'e-editor-select-start') {
+            currentNodeParent.parentNode.insertBefore(newWrapElem, currentNodeParent);
+        }
+        else if (currentNodeParent) {
+            currentNodeParent.insertBefore(newWrapElem, node);
+        }
+        let i = 0;
+        while (currentNode !== null && currentNode.nodeName !== 'BR' &&
+            !this.isBlockNode(currentNode)) {
+            const prevSibling = currentNode.previousSibling;
+            if (currentNode.nodeType === 3 || currentNode.nodeType === 1) {
+                if (i === 0) {
+                    newWrapElem.appendChild(currentNode);
+                }
+                else {
+                    newWrapElem.insertBefore(currentNode, newWrapElem.firstChild);
+                }
+            }
+            currentNode = prevSibling;
+            i++;
+        }
+        // Add the current node to the new div
+        newWrapElem.appendChild(node);
+        // Gather text and inline elements after the currentNode
+        currentNode = newWrapElem.nextSibling ? newWrapElem.nextSibling :
+            newWrapElem.parentElement.nextSibling;
+        while (currentNode !== null && currentNode.nodeName !== 'BR' &&
+            !this.isBlockNode(currentNode)) {
+            const nextSibling = currentNode.nextSibling ?
+                currentNode.nextSibling : currentNode.parentElement.nextSibling;
+            if (currentNode.nodeType === 3 || currentNode.nodeType === 1) {
+                newWrapElem.appendChild(currentNode);
+            }
+            currentNode = nextSibling;
+        }
+        return newWrapElem;
+    }
+    /**
+     * Method to convert all the inline nodes between the selection to block nodes.
+     *
+     * @param {Node[]} selectedNodes - specifies the nodes of the start and end selection.
+     * @param {boolean} fromList - specifies if the method is called from list module.
+     * @returns {Node[]} - returns the selected list of elements as block nodes.
+     * @hidden
+     * @deprecated
+     */
+    convertToBlockNodes(selectedNodes, fromList) {
+        if (selectedNodes.length > 1) {
+            let i = 0;
+            let currentSelectedNode = selectedNodes[0];
+            while (!isNullOrUndefined(currentSelectedNode)) {
+                if (currentSelectedNode.nodeName === 'BR') {
+                    const nextNode = currentSelectedNode.nextSibling;
+                    detach(currentSelectedNode);
+                    currentSelectedNode = nextNode;
+                }
+                if (!isNullOrUndefined(currentSelectedNode)) {
+                    if (fromList) {
+                        selectedNodes[i] = currentSelectedNode.nodeName === 'LI' || this.isBlockNode(currentSelectedNode) ?
+                            currentSelectedNode :
+                            this.gatherElementsAround(currentSelectedNode, (fromList ? 'p' : 'div'));
+                    }
+                    else {
+                        selectedNodes[i] = !this.isBlockNode(selectedNodes[i]) ?
+                            this.gatherElementsAround(currentSelectedNode, (fromList ? 'p' : 'div')) :
+                            selectedNodes[i];
+                    }
+                    const currentProcessNode = selectedNodes[i].nodeName === 'LI' ? selectedNodes[i].parentElement : selectedNodes[i];
+                    const currentElementCheckNode = currentProcessNode.nodeName === '#text' ? currentProcessNode.parentElement : currentProcessNode;
+                    currentSelectedNode = !isNullOrUndefined(currentElementCheckNode.querySelector('.e-editor-select-end')) ||
+                        !isNullOrUndefined(closest(currentSelectedNode, '.e-editor-select-end')) ?
+                        null : currentProcessNode.nextSibling;
+                    if (currentSelectedNode === null && !isNullOrUndefined(currentProcessNode.nextSibling) && currentProcessNode.nextSibling.nodeName === 'BR') {
+                        detach(currentProcessNode.nextSibling);
+                    }
+                }
+                i++;
+            }
+        }
+        else {
+            if (!this.isBlockNode(selectedNodes[0])) {
+                selectedNodes[0] = this.gatherElementsAround(selectedNodes[0], (fromList ? 'p' : 'div'));
+                if (!isNullOrUndefined(selectedNodes[0].nextSibling) && (selectedNodes[0].nextSibling.nodeName === 'BR')) {
+                    detach(selectedNodes[0].nextSibling);
+                }
+            }
+        }
+        return selectedNodes;
+    }
     /**
      * blockNodes method
      *
@@ -13107,7 +13211,7 @@ class Lists {
             e.event.preventDefault();
         }
     }
-    onKeyUp() {
+    onKeyUp(e) {
         if (!isNullOrUndefined(this.commonLIParent) && !isNullOrUndefined(this.commonLIParent.querySelector('.removeList'))) {
             const currentLIElem = this.commonLIParent.querySelector('.removeList');
             while (!isNullOrUndefined(currentLIElem.firstChild)) {
@@ -13115,6 +13219,14 @@ class Lists {
             }
             detach(currentLIElem);
         }
+        if (e.event.keyCode === 13) {
+            const listElements = this.parent.editableElement.querySelectorAll('UL, OL');
+            for (let i = 0; i < listElements.length; i++) {
+                if (!isNullOrUndefined(listElements[i]) && !isNullOrUndefined(listElements[i].parentElement) && !isNullOrUndefined(listElements[i].previousElementSibling) && (listElements[i].parentElement.nodeName === 'UL' || listElements[i].parentElement.nodeName === 'OL')) {
+                    listElements[i].previousElementSibling.appendChild(listElements[i]);
+                }
+            }
+        }
     }
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     firstListBackSpace(range, _e) {
@@ -13356,6 +13468,8 @@ class Lists {
                 else {
                     if (prevSibling.tagName === 'LI') {
                         const nestedElement = createElement(elements[i].parentNode.tagName);
+                        nestedElement.style.listStyleType =
+                            elements[i].parentNode.style.listStyleType;
                         append([nestedElement], prevSibling);
                         append([elements[i]], nestedElement);
                     }
@@ -13405,39 +13519,7 @@ class Lists {
         let listsNodes = this.domNode.blockNodes(true);
         if (e.enterAction === 'BR') {
             this.setSelectionBRConfig();
-            const selectedNodes = this.parent.domNode.blockNodes();
-            if (selectedNodes.length > 1) {
-                let i = 0;
-                let currentAlignmentNode = selectedNodes[0];
-                while (!isNullOrUndefined(currentAlignmentNode)) {
-                    if (currentAlignmentNode.nodeName === 'BR') {
-                        const nextNode = currentAlignmentNode.nextSibling;
-                        detach(currentAlignmentNode);
-                        currentAlignmentNode = nextNode;
-                    }
-                    if (!isNullOrUndefined(currentAlignmentNode)) {
-                        selectedNodes[i] = currentAlignmentNode.nodeName === 'LI' || this.parent.domNode.isBlockNode(currentAlignmentNode) ?
-                            currentAlignmentNode : this.gatherElementsAround(currentAlignmentNode);
-                        const currentSelectNode = selectedNodes[i].nodeName === 'LI' ? selectedNodes[i].parentElement : selectedNodes[i];
-                        const currentElementCheckNode = currentAlignmentNode.nodeName === '#text' ? currentAlignmentNode.parentElement : currentAlignmentNode;
-                        currentAlignmentNode = !isNullOrUndefined(currentElementCheckNode.querySelector('.e-editor-select-end')) ||
-                            !isNullOrUndefined(closest(currentAlignmentNode, '.e-editor-select-end')) ?
-                            null : currentSelectNode.nextSibling;
-                        if (currentAlignmentNode === null && !isNullOrUndefined(currentSelectNode.nextSibling) && currentSelectNode.nextSibling.nodeName === 'BR') {
-                            detach(currentSelectNode.nextSibling);
-                        }
-                    }
-                    i++;
-                }
-            }
-            else {
-                if (!this.parent.domNode.isBlockNode(selectedNodes[0])) {
-                    selectedNodes[0] = this.gatherElementsAround(selectedNodes[0]);
-                    if (!isNullOrUndefined(selectedNodes[0].nextSibling) && (selectedNodes[0].nextSibling.nodeName === 'BR')) {
-                        detach(selectedNodes[0].nextSibling);
-                    }
-                }
-            }
+            this.parent.domNode.convertToBlockNodes(this.parent.domNode.blockNodes(), true);
             this.setSelectionBRConfig();
             listsNodes = this.parent.domNode.blockNodes();
         }
@@ -13494,7 +13576,7 @@ class Lists {
                 }
                 let elemAtt;
                 elements[i].style.removeProperty('margin-left');
-                elemAtt = elements[i].tagName === 'IMG' ? '' : this.domNode.attributes(elements[i]);
+                elemAtt = elements[i].tagName === 'IMG' || elements[i].classList.contains('e-editor-select-start') ? '' : this.domNode.attributes(elements[i]);
                 if (elements[i].getAttribute('contenteditable') === 'true'
                     && elements[i].childNodes.length === 1 && elements[i].childNodes[0].nodeName === 'TABLE') {
                     const listEle = document.createElement(type);
@@ -13615,6 +13697,13 @@ class Lists {
         for (let c = 0; c < liParents.length; c++) {
             const node = liParents[c];
             let toFindtopOlUl = true;
+            let containsListElements = node;
+            while (containsListElements.parentElement) {
+                if (containsListElements.parentElement && containsListElements.parentElement.tagName !== 'LI' && containsListElements.parentElement.tagName !== 'OL' && containsListElements.parentElement.tagName !== 'UL') {
+                    break;
+                }
+                containsListElements = containsListElements.parentElement;
+            }
             if (toFindtopOlUl && (liParents[c].parentElement.parentElement.nodeName === 'OL' || liParents[c].parentElement.parentElement.nodeName === 'UL')) {
                 toFindtopOlUl = false;
                 const preElement = liParents[c].parentElement.parentElement;
@@ -13634,9 +13723,43 @@ class Lists {
                     node.previousElementSibling.lastChild.append(node);
                 }
             }
+            else if (this.domNode.isList(node.previousElementSibling) && containsListElements.contains(node.previousElementSibling) && ((node.tagName === 'OL' || node.tagName === 'UL') && (node.previousElementSibling.nodeName === 'OL' || node.previousElementSibling.nodeName === 'UL'))) {
+                const contentNodes = this.domNode.contents(node);
+                for (let f = 0; f < contentNodes.length; f++) {
+                    node.previousElementSibling.appendChild(contentNodes[f]);
+                }
+                node.parentNode.removeChild(node);
+            }
         }
         if (firstNodeOL) {
             firstNodeOL.style.listStyleType = listStyleType;
+            const range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
+            let listOlUlElements = [];
+            if (range.commonAncestorContainer.nodeName === 'UL' || range.commonAncestorContainer.nodeName === 'OL') {
+                if (range.commonAncestorContainer instanceof Element) {
+                    listOlUlElements.push(range.commonAncestorContainer);
+                }
+                listOlUlElements = listOlUlElements.concat(Array.from(range.commonAncestorContainer.querySelectorAll('ol, ul')));
+            }
+            else {
+                listOlUlElements = Array.from(range.commonAncestorContainer.querySelectorAll('ol, ul'));
+            }
+            for (let k = 0; k < listOlUlElements.length; k++) {
+                let listStyle;
+                let listElements = listOlUlElements[k];
+                while (listElements) {
+                    if (listElements.nodeName === 'OL' || listElements.nodeName === 'OL') {
+                        if (listElements.style.listStyleType !== '' && listElements.style.listStyleType !== 'none' && listElements.nodeName !== 'LI') {
+                            listStyle = listElements.style.listStyleType;
+                        }
+                        else if (!isNullOrUndefined(listStyle) && (listElements.style.listStyleType === '' || listElements.style.listStyleType === 'none') &&
+                            listElements.nodeName !== 'LI' && (listElements.nodeName === 'UL' || listElements.nodeName === 'OL')) {
+                            listElements.style.listStyleType = listStyle;
+                        }
+                    }
+                    listElements = listElements.querySelector('UL,OL');
+                }
+            }
         }
     }
     findUnSelected(temp, elements) {
@@ -13739,7 +13862,7 @@ class Lists {
                                 parentNode.removeAttribute("style");
                             }
                         }
-                        const wrapper = '<' + DEFAULT_TAG + wrapperclass + this.domNode.attributes(element) + '></' + DEFAULT_TAG + '>';
+                        const wrapper = '<' + e.enterAction + wrapperclass + this.domNode.attributes(element) + '></' + e.enterAction + '>';
                         if (e.enterAction !== 'BR') {
                             this.domNode.wrapInner(element, this.domNode.parseHTMLFragment(wrapper));
                         }
@@ -13813,48 +13936,6 @@ class Lists {
     closeTag(type) {
         return this.domNode.parseHTMLFragment('<span class="e-rte-list-close-' + type.toLowerCase() + '"></span>');
     }
-    gatherElementsAround(node) {
-        const pWrap = document.createElement('p');
-        // Insert the new div before the current node
-        let currentNode = node.previousSibling;
-        const classNode = node.parentNode;
-        if (classNode.className === 'e-editor-select-start') {
-            node.parentNode.parentNode.insertBefore(pWrap, node.parentNode);
-        }
-        else if (node.parentNode) {
-            node.parentNode.insertBefore(pWrap, node);
-        }
-        // Gather text and inline elements before the currentNode
-        let i = 0;
-        while (currentNode !== null && currentNode.nodeName !== 'BR' &&
-            !this.parent.domNode.isBlockNode(currentNode)) {
-            const prevSibling = currentNode.previousSibling;
-            if (currentNode.nodeType === 3 || currentNode.nodeType === 1) {
-                if (i === 0) {
-                    pWrap.appendChild(currentNode);
-                }
-                else {
-                    pWrap.insertBefore(currentNode, pWrap.firstChild);
-                }
-            }
-            currentNode = prevSibling;
-            i++;
-        }
-        // Add the current node to the new p
-        pWrap.appendChild(node);
-        // Gather text and inline elements after the currentNode
-        currentNode = pWrap.nextSibling ? pWrap.nextSibling : pWrap.parentElement.nextSibling;
-        while (currentNode !== null && currentNode.nodeName !== 'BR' &&
-            !this.parent.domNode.isBlockNode(currentNode)) {
-            const nextSibling = currentNode.nextSibling ?
-                currentNode.nextSibling : currentNode.parentElement.nextSibling;
-            if (currentNode.nodeType === 3 || currentNode.nodeType === 1) {
-                pWrap.appendChild(currentNode);
-            }
-            currentNode = nextSibling;
-        }
-        return pWrap;
-    }
 }
 
 /**
@@ -14189,8 +14270,8 @@ class Formats {
                 }
             }
         }
-        if (e.enterAction !== 'BR' && !isNullOrUndefined(range.startContainer) && !isNullOrUndefined(range.startContainer.parentElement) && range.startContainer === range.endContainer && range.startContainer.nodeName === '#text' && range.startContainer.parentElement.classList.contains("e-content") && range.startContainer.parentElement.isContentEditable) {
-            let pTag = createElement(e.enterAction);
+        if (e.enterAction !== 'BR' && !isNullOrUndefined(range.startContainer) && !isNullOrUndefined(range.startContainer.parentElement) && range.startContainer === range.endContainer && range.startContainer.nodeName === '#text' && range.startContainer.parentElement.classList.contains('e-content') && range.startContainer.parentElement.isContentEditable) {
+            const pTag = createElement(e.enterAction);
             range.startContainer.parentElement.insertBefore(pTag, range.startContainer);
             pTag.appendChild(range.startContainer);
             this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, pTag, 1);
@@ -14607,6 +14688,9 @@ class InsertHtml {
             this.insertTableInList(range, node, closestParentNode, nodes[0], nodeCutter);
             return;
         }
+        if (isCursor && range.startContainer.textContent === '' && range.startContainer.nodeName !== 'BR' && enterAction !== 'BR' && node.nodeName !== '#text' && !isNullOrUndefined(node.children[0]) && !isNullOrUndefined(node.children[0].tagName) && node.children[0].tagName === 'IMG' && node.children.length === 1) {
+            range.startContainer.innerHTML = '';
+        }
         if (isExternal || (!isNullOrUndefined(node) && !isNullOrUndefined(node.classList) &&
             node.classList.contains('pasteContent'))) {
             this.pasteInsertHTML(nodes, node, range, nodeSelection, nodeCutter, docElement, isCollapsed, closestParentNode, editNode, enterAction);
@@ -15530,7 +15614,10 @@ class Alignments {
         let save = this.parent.nodeSelection.save(range, this.parent.currentDocument);
         if (!isTableAlign) {
             this.parent.domNode.setMarker(save);
-            const alignmentNodes = this.parent.domNode.blockNodes();
+            let alignmentNodes = this.parent.domNode.blockNodes();
+            if (e.enterAction === 'BR') {
+                alignmentNodes = this.parent.domNode.convertToBlockNodes(alignmentNodes, false);
+            }
             for (let i = 0; i < alignmentNodes.length; i++) {
                 const parentNode = alignmentNodes[i];
                 setStyleAttribute(parentNode, { 'text-align': this.alignments[e.subCommand] });
@@ -15612,7 +15699,10 @@ class Indents {
         const range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
         let save = this.parent.nodeSelection.save(range, this.parent.currentDocument);
         this.parent.domNode.setMarker(save);
-        const indentsNodes = this.parent.domNode.blockNodes();
+        let indentsNodes = this.parent.domNode.blockNodes();
+        if (e.enterAction === 'BR') {
+            indentsNodes = this.parent.domNode.convertToBlockNodes(indentsNodes, false);
+        }
         const parentNodes = indentsNodes.slice();
         const listsNodes = [];
         for (let i = 0; i < parentNodes.length; i++) {
@@ -19894,7 +19984,7 @@ class MsWordPaste {
                 !isNormalList) {
                 prevList = null;
             }
-            const pElement = createElement('p', { className: 'MsoNormal' });
+            const pElement = createElement('p', { className: 'MsoNoSpacing' });
             pElement.innerHTML = collection[index].content.join(' ');
             if ((collection[index].nestedLevel === 1) &&
                 (listCount === 0 || lfo !== collection[index].listFormatOverride) &&
@@ -20970,12 +21060,14 @@ class EditorManager {
             case 'alignments':
                 this.observer.notify(ALIGNMENT_TYPE, {
                     subCommand: value, event: event, callBack: callBack,
-                    selector: selector,
-                    value: exeValue
+                    selector: selector, value: exeValue, enterAction: enterAction
                 });
                 break;
             case 'indents':
-                this.observer.notify(INDENT_TYPE, { subCommand: value, event: event, callBack: callBack, selector: selector });
+                this.observer.notify(INDENT_TYPE, {
+                    subCommand: value, event: event, callBack: callBack,
+                    selector: selector, enterAction: enterAction
+                });
                 break;
             case 'links':
                 this.observer.notify(LINK, { command: command, value: value, item: exeValue, event: event, callBack: callBack });
@@ -21304,116 +21396,116 @@ class ContentRender {
     }
 }
 
-const IFRAMEHEADER = `
-<!DOCTYPE html> 
-    <html>
-         <head>
-            <meta charset='utf-8' /> 
-            <style>
-                @charset "UTF-8";
-                body {
-                    font-family: "Roboto", sans-serif;
-                    font-size: 14px;
-                }
-                html, body{height: 100%;margin: 0;}
-                body.e-cursor{cursor:default}
-                span.e-selected-node	{background-color: #939393;color: white;}
-                span.e-selected-node.e-highlight {background-color: #1d9dd8;}
-                body{color:#333;word-wrap:break-word;padding: 8px;box-sizing: border-box;}
-                .e-rte-image, .e-rte-video {border: 0;cursor: pointer;display:
-                    block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}
-                .e-rte-audio {border: 0;cursor: pointer;display:
-                        block;float: none;margin: 5px auto;max-width: 100%;position: relative;}
-                .e-rte-image.e-imginline, .e-rte-audio.e-audio-inline, .e-rte-video.e-video-inline {display: inline-block;float: none;
-                    margin-left: 5px;margin-right: 5px;max-width: calc(100% - (2 * 5px));padding: 1px;vertical-align: bottom;}
-                .e-rte-image.e-imgcenter, .e-rte-video.e-video-center {cursor: pointer;display: block;float: none;margin: 5px auto;max-width: 100%;position: relative;}
-                .e-rte-image.e-imgright, .e-rte-video.e-video-right { float: right; margin: 0 auto;margin-left: 5px;text-align: right;}
-                .e-rte-image.e-imgleft, .e-rte-video.e-video-left {float: left;margin: 0 auto;margin-right: 5px;text-align: left;}
-                .e-img-caption { display: inline-block; float: none; margin: 5px auto; max-width: 100%;position: relative;}
-                .e-img-caption.e-caption-inline {display: inline-block;float: none;
-                    margin: 5px auto;margin-left: 5px;margin-right: 5px;max-width: calc(100% - (2 * 5px));
-                    position: relativetext-align: center;vertical-align: bottom;}
-                .e-rte-img-caption.e-imgcenter {display: contents; margin-left: auto; margin-right: auto;}
-                .e-rte-img-caption.e-imgright {display: contents; margin-left: auto; margin-right: 0;}
-                .e-rte-img-caption.e-imgleft {display: contents;margin-left: 0;margin-right: auto;}
-                .e-img-caption.e-rte-img-caption.e-imgbreak {display: contents;}
-                .e-img-inner {box-sizing: border-box;display: block;font-size: 16px;font-weight: initial;
-                    margin: auto;opacity: .9;text-align: center;width: 100%;}
-                .e-img-wrap {display: inline-block;margin: auto;padding: 0;text-align: center;width: 100%;}
-                .e-imgleft, .e-video-left {float: left;margin: 0 5px 0 0;text-align: left;}
-                .e-imgright, .e-video-right {float: right;margin: 0 0 0 5px;text-align: right;}
-                .e-imgcenter, .e-video-center {cursor: pointer;display: block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}
-                .e-control img:not(.e-resize) {border: 2px solid transparent; z-index: 1000}
-                .e-imginline , .e-audio-inline, .e-video-inline {display: inline-block;float: none;margin-left: 5px;margin-right: 5px;
-                    max-width: calc(100% - (2 * 5px));vertical-align: bottom;}
-                .e-imgbreak, .e-audio-break, .e-video-break {border: 0;cursor: pointer;
-                    display: block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}
-                .e-rte-image.e-img-focus:not(.e-resize), .e-audio-focus:not(.e-resize), .e-video-focus:not(.e-resize) {border: solid 2px #4a90e2;}
-                img.e-img-focus::selection, audio.e-audio-focus::selection, .e-video-focus::selection { background: transparent;color: transparent;}
-                span.e-rte-imageboxmark, span.e-rte-videoboxmark {  width: 10px; height: 10px; position: absolute; display: block;
-                    background: #4a90e2; border: 1px solid #fff; z-index: 1000;}
-                .e-mob-rte.e-mob-span span.e-rte-imageboxmark, .e-mob-rte.e-mob-span span.e-rte-videoboxmark { background: #4a90e2; border: 1px solid #fff; }
-                .e-mob-rte span.e-rte-imageboxmark, .e-mob-rte span.e-rte-videoboxmark { background: #fff; border: 1px solid #4a90e2;
-                    border-radius: 15px; height: 20px; width: 20px; }
-                .e-mob-rte.e-mob-span span.e-rte-imageboxmark, .e-mob-rte.e-mob-span span.e-rte-videoboxmark { background: #4a90e2; border: 1px solid #fff; }
-                .e-rte-content .e-content img.e-resize, .e-rte-content .e-content video.e-resize { z-index: 1000; }
-                .e-img-caption .e-img-inner { outline: 0; }
-                .e-rte-img-caption.e-imgleft .e-img-inner { float: left; text-align: left; }
-                .e-rte-img-caption.e-imgright .e-img-inner { float: right; text-align: right; }
-                .e-rte-img-caption.e-imgleft .e-img-wrap, .e-rte-img-caption.e-imgright .e-img-wrap { display: contents; }
-                .e-img-caption a:focus-visible { outline: none; }
-                .e-rte-img-caption .e-rte-image.e-imgright { margin-left: auto; margin-right: 0; }
-                .e-rte-img-caption .e-rte-image.e-imgleft { margin: 0; }
-                body{box-sizing: border-box;min-height: 100px;outline: 0 solid transparent;
-                    overflow-x: auto;padding: 16px;position: relative;text-align: inherit;z-index: 2;}
-                p{margin: 0 0 10px;margin-bottom: 10px;}
-                li{margin-bottom: 10px;}
-                table{margin-bottom: 10px;}
-                h1{font-size: 2.17em;font-weight: 400;line-height: 1;margin: 10px 0;}
-                h2{font-size: 1.74em;font-weight: 400;margin: 10px 0;}
-                h3{font-size: 1.31em;font-weight: 400;margin: 10px 0;}
-                h4{font-size: 16px;font-weight: 400;line-height: 1.5;margin: 0;}
-                h5{font-size: 00.8em;font-weight: 400;margin: 0;}
-                h6{font-size: 00.65em;font-weight: 400;margin: 0;}
-                blockquote{margin: 10px 0;margin-left: 0;padding-left: 5px;border-left: solid 2px #5c5c5c;}
-                pre{background-color: inherit;border: 0;border-radius: 0;color: #333;
-                    font-size: inherit;line-height: inherit;margin: 0 0 10px;overflow: visible;padding: 0;
-                    white-space: pre-wrap;word-break: inherit;word-wrap: break-word;}
-                strong, b{font-weight: 700;}
-                a{text-decoration: none;user-select: auto;}
-                a:hover{text-decoration: underline;};
-                p:last-child, pre:last-child, blockquote:last-child{margin-bottom: 0;}
-                h3+h4, h4+h5, h5+h6{margin-top: 00.6em;}
-                ul:last-child{margin-bottom: 0;}
-                table { border-collapse: collapse; empty-cells: show;}
-                table td,table th {border: 1px solid #BDBDBD; height: 20px; padding: 2px 5px; vertical-align: middle;}
-                table.e-alternate-border tbody tr:nth-child(2n) {background-color: #F5F5F5;}
-                table th {background-color: #E0E0E0;}
-                table.e-dashed-border td,table.e-dashed-border th { border: 1px dashed #BDBDBD} 
-                table .e-cell-select {border: 1px double #4a90e2;}
-                span.e-table-box { cursor: nwse-resize; display: block; height: 10px; position: absolute; width: 10px; }
-                span.e-table-box.e-rmob {height: 14px;width: 14px;}
-                .e-row-resize, .e-column-resize { background-color: transparent; background-repeat: repeat;
-                    bottom: 0;cursor: col-resize;height: 1px;overflow: visible;position: absolute;width: 1px; }
-                .e-row-resize { cursor: row-resize; height: 1px;}
-                .e-table-rhelper { cursor: col-resize; opacity: .87;position: absolute;}
-                .e-table-rhelper.e-column-helper { width: 1px; }
-                .e-table-rhelper.e-row-helper {height: 1px;}
-                .e-reicon::before { border-bottom: 6px solid transparent; border-right: 6px solid;
-                    border-top: 6px solid transparent; content: ''; display: block; height: 0;
-                    position: absolute; right: 4px; top: 4px; width: 20px; }
-                .e-reicon::after { border-bottom: 6px solid transparent; border-left: 6px solid;
-                    border-top: 6px solid transparent; content: ''; display: block;
-                    height: 0; left: 4px; position: absolute; top: 4px; width: 20px; z-index: 3; }
-                .e-row-helper.e-reicon::after { top: 10px; transform: rotate(90deg); }
-                .e-row-helper.e-reicon::before { left: 4px; top: -20px; transform: rotate(90deg); }
-                span.e-table-box { background-color: #ffffff; border: 1px solid #BDBDBD; }
-                span.e-table-box.e-rbox-select { background-color: #BDBDBD; border: 1px solid #BDBDBD; }
-                .e-table-rhelper { background-color: #4a90e2;}
-                .e-rtl { direction: rtl; }
-                .e-rte-placeholder::before { content: attr(placeholder); opacity: 0.54; overflow: hidden; padding-top: 16px; position: absolute; text-align: start; top: 0; z-index: 1; }
-                li ol, li ul { margin-block-start: 10px;}
-            </style>
+const IFRAMEHEADER = `
+<!DOCTYPE html> 
+    <html>
+         <head>
+            <meta charset='utf-8' /> 
+            <style>
+                @charset "UTF-8";
+                body {
+                    font-family: "Roboto", sans-serif;
+                    font-size: 14px;
+                }
+                html, body{height: 100%;margin: 0;}
+                body.e-cursor{cursor:default}
+                span.e-selected-node	{background-color: #939393;color: white;}
+                span.e-selected-node.e-highlight {background-color: #1d9dd8;}
+                body{color:#333;word-wrap:break-word;padding: 8px;box-sizing: border-box;}
+                .e-rte-image, .e-rte-video {border: 0;cursor: pointer;display:
+                    block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}
+                .e-rte-audio {border: 0;cursor: pointer;display:
+                        block;float: none;margin: 5px auto;max-width: 100%;position: relative;}
+                .e-rte-image.e-imginline, .e-rte-audio.e-audio-inline, .e-rte-video.e-video-inline {display: inline-block;float: none;
+                    margin-left: 5px;margin-right: 5px;max-width: calc(100% - (2 * 5px));padding: 1px;vertical-align: bottom;}
+                .e-rte-image.e-imgcenter, .e-rte-video.e-video-center {cursor: pointer;display: block;float: none;margin: 5px auto;max-width: 100%;position: relative;}
+                .e-rte-image.e-imgright, .e-rte-video.e-video-right { float: right; margin: 0 auto;margin-left: 5px;text-align: right;}
+                .e-rte-image.e-imgleft, .e-rte-video.e-video-left {float: left;margin: 0 auto;margin-right: 5px;text-align: left;}
+                .e-img-caption { display: inline-block; float: none; margin: 5px auto; max-width: 100%;position: relative;}
+                .e-img-caption.e-caption-inline {display: inline-block;float: none;
+                    margin: 5px auto;margin-left: 5px;margin-right: 5px;max-width: calc(100% - (2 * 5px));
+                    position: relativetext-align: center;vertical-align: bottom;}
+                .e-rte-img-caption.e-imgcenter {display: contents; margin-left: auto; margin-right: auto;}
+                .e-rte-img-caption.e-imgright {display: contents; margin-left: auto; margin-right: 0;}
+                .e-rte-img-caption.e-imgleft {display: contents;margin-left: 0;margin-right: auto;}
+                .e-img-caption.e-rte-img-caption.e-imgbreak {display: contents;}
+                .e-img-inner {box-sizing: border-box;display: block;font-size: 16px;font-weight: initial;
+                    margin: auto;opacity: .9;text-align: center;width: 100%;}
+                .e-img-wrap {display: inline-block;margin: auto;padding: 0;text-align: center;width: 100%;}
+                .e-imgleft, .e-video-left {float: left;margin: 0 5px 0 0;text-align: left;}
+                .e-imgright, .e-video-right {float: right;margin: 0 0 0 5px;text-align: right;}
+                .e-imgcenter, .e-video-center {cursor: pointer;display: block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}
+                .e-control img:not(.e-resize) {border: 2px solid transparent; z-index: 1000}
+                .e-imginline , .e-audio-inline, .e-video-inline {display: inline-block;float: none;margin-left: 5px;margin-right: 5px;
+                    max-width: calc(100% - (2 * 5px));vertical-align: bottom;}
+                .e-imgbreak, .e-audio-break, .e-video-break {border: 0;cursor: pointer;
+                    display: block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}
+                .e-rte-image.e-img-focus:not(.e-resize), .e-audio-focus:not(.e-resize), .e-video-focus:not(.e-resize) {border: solid 2px #4a90e2;}
+                img.e-img-focus::selection, audio.e-audio-focus::selection, .e-video-focus::selection { background: transparent;color: transparent;}
+                span.e-rte-imageboxmark, span.e-rte-videoboxmark {  width: 10px; height: 10px; position: absolute; display: block;
+                    background: #4a90e2; border: 1px solid #fff; z-index: 1000;}
+                .e-mob-rte.e-mob-span span.e-rte-imageboxmark, .e-mob-rte.e-mob-span span.e-rte-videoboxmark { background: #4a90e2; border: 1px solid #fff; }
+                .e-mob-rte span.e-rte-imageboxmark, .e-mob-rte span.e-rte-videoboxmark { background: #fff; border: 1px solid #4a90e2;
+                    border-radius: 15px; height: 20px; width: 20px; }
+                .e-mob-rte.e-mob-span span.e-rte-imageboxmark, .e-mob-rte.e-mob-span span.e-rte-videoboxmark { background: #4a90e2; border: 1px solid #fff; }
+                .e-rte-content .e-content img.e-resize, .e-rte-content .e-content video.e-resize { z-index: 1000; }
+                .e-img-caption .e-img-inner { outline: 0; }
+                .e-rte-img-caption.e-imgleft .e-img-inner { float: left; text-align: left; }
+                .e-rte-img-caption.e-imgright .e-img-inner { float: right; text-align: right; }
+                .e-rte-img-caption.e-imgleft .e-img-wrap, .e-rte-img-caption.e-imgright .e-img-wrap { display: contents; }
+                .e-img-caption a:focus-visible { outline: none; }
+                .e-rte-img-caption .e-rte-image.e-imgright { margin-left: auto; margin-right: 0; }
+                .e-rte-img-caption .e-rte-image.e-imgleft { margin: 0; }
+                body{box-sizing: border-box;min-height: 100px;outline: 0 solid transparent;
+                    overflow-x: auto;padding: 16px;position: relative;text-align: inherit;z-index: 2;}
+                p{margin: 0 0 10px;margin-bottom: 10px;}
+                li{margin-bottom: 10px;}
+                table{margin-bottom: 10px;}
+                h1{font-size: 2.17em;font-weight: 400;line-height: 1;margin: 10px 0;}
+                h2{font-size: 1.74em;font-weight: 400;margin: 10px 0;}
+                h3{font-size: 1.31em;font-weight: 400;margin: 10px 0;}
+                h4{font-size: 16px;font-weight: 400;line-height: 1.5;margin: 0;}
+                h5{font-size: 00.8em;font-weight: 400;margin: 0;}
+                h6{font-size: 00.65em;font-weight: 400;margin: 0;}
+                blockquote{margin: 10px 0;margin-left: 0;padding-left: 5px;border-left: solid 2px #5c5c5c;}
+                pre{background-color: inherit;border: 0;border-radius: 0;color: #333;
+                    font-size: inherit;line-height: inherit;margin: 0 0 10px;overflow: visible;padding: 0;
+                    white-space: pre-wrap;word-break: inherit;word-wrap: break-word;}
+                strong, b{font-weight: 700;}
+                a{text-decoration: none;user-select: auto;}
+                a:hover{text-decoration: underline;};
+                p:last-child, pre:last-child, blockquote:last-child{margin-bottom: 0;}
+                h3+h4, h4+h5, h5+h6{margin-top: 00.6em;}
+                ul:last-child{margin-bottom: 0;}
+                table { border-collapse: collapse; empty-cells: show;}
+                table td,table th {border: 1px solid #BDBDBD; height: 20px; padding: 2px 5px; vertical-align: middle;}
+                table.e-alternate-border tbody tr:nth-child(2n) {background-color: #F5F5F5;}
+                table th {background-color: #E0E0E0;}
+                table.e-dashed-border td,table.e-dashed-border th { border: 1px dashed #BDBDBD} 
+                table .e-cell-select {border: 1px double #4a90e2;}
+                span.e-table-box { cursor: nwse-resize; display: block; height: 10px; position: absolute; width: 10px; }
+                span.e-table-box.e-rmob {height: 14px;width: 14px;}
+                .e-row-resize, .e-column-resize { background-color: transparent; background-repeat: repeat;
+                    bottom: 0;cursor: col-resize;height: 1px;overflow: visible;position: absolute;width: 1px; }
+                .e-row-resize { cursor: row-resize; height: 1px;}
+                .e-table-rhelper { cursor: col-resize; opacity: .87;position: absolute;}
+                .e-table-rhelper.e-column-helper { width: 1px; }
+                .e-table-rhelper.e-row-helper {height: 1px;}
+                .e-reicon::before { border-bottom: 6px solid transparent; border-right: 6px solid;
+                    border-top: 6px solid transparent; content: ''; display: block; height: 0;
+                    position: absolute; right: 4px; top: 4px; width: 20px; }
+                .e-reicon::after { border-bottom: 6px solid transparent; border-left: 6px solid;
+                    border-top: 6px solid transparent; content: ''; display: block;
+                    height: 0; left: 4px; position: absolute; top: 4px; width: 20px; z-index: 3; }
+                .e-row-helper.e-reicon::after { top: 10px; transform: rotate(90deg); }
+                .e-row-helper.e-reicon::before { left: 4px; top: -20px; transform: rotate(90deg); }
+                span.e-table-box { background-color: #ffffff; border: 1px solid #BDBDBD; }
+                span.e-table-box.e-rbox-select { background-color: #BDBDBD; border: 1px solid #BDBDBD; }
+                .e-table-rhelper { background-color: #4a90e2;}
+                .e-rtl { direction: rtl; }
+                .e-rte-placeholder::before { content: attr(placeholder); opacity: 0.54; overflow: hidden; padding-top: 16px; position: absolute; text-align: start; top: 0; z-index: 1; }
+                li ol, li ul { margin-block-start: 10px;}
+            </style>
         </head>`;
 /**
  * Content module is used to render Rich Text Editor content
@@ -21921,25 +22013,54 @@ class HtmlEditor {
             this.deleteCleanup(e, currentRange);
         }
         if (args.keyCode === 9 && this.parent.enableTabKey) {
+            this.parent.formatter.saveData(e);
             if (!isNullOrUndefined(args.target) && isNullOrUndefined(closest(args.target, '.e-rte-toolbar'))) {
                 const range = this.nodeSelectionObj.getRange(this.contentRenderer.getDocument());
                 const parentNode = this.nodeSelectionObj.getParentNodeCollection(range);
                 if (!((parentNode[0].nodeName === 'LI' || closest(parentNode[0], 'li') ||
-                    closest(parentNode[0], 'table')) && range.startOffset === 0)) {
+                    closest(parentNode[0], 'table')))) {
                     args.preventDefault();
-                    if (!args.shiftKey) {
-                        InsertHtml.Insert(this.contentRenderer.getDocument(), '&nbsp;&nbsp;&nbsp;&nbsp;');
-                        this.rangeCollection.push(this.nodeSelectionObj.getRange(this.contentRenderer.getDocument()));
+                    const selection = this.contentRenderer.getDocument().getSelection().getRangeAt(0);
+                    let alignmentNodes = this.parent.formatter.editorManager.domNode.blockNodes();
+                    if (this.parent.enterKey === 'BR') {
+                        if (selection.startOffset !== selection.endOffset && selection.startOffset === 0) {
+                            let save = this.nodeSelectionObj.save(range, this.contentRenderer.getDocument());
+                            this.parent.formatter.editorManager.domNode.setMarker(save);
+                            alignmentNodes = this.parent.formatter.editorManager.domNode.blockNodes();
+                            this.parent.formatter.editorManager.domNode.convertToBlockNodes(alignmentNodes, false);
+                            this.marginTabAdd(args.shiftKey, alignmentNodes);
+                            save = this.parent.formatter.editorManager.domNode.saveMarker(save);
+                            save.restore();
+                        }
+                        else {
+                            InsertHtml.Insert(this.contentRenderer.getDocument(), '&nbsp;&nbsp;&nbsp;&nbsp;');
+                            this.rangeCollection.push(this.nodeSelectionObj.getRange(this.contentRenderer.getDocument()));
+                        }
                     }
-                    else if (this.rangeCollection.length > 0 &&
-                        this.rangeCollection[this.rangeCollection.length - 1].startContainer.textContent.length === 4) {
-                        const textCont = this.rangeCollection[this.rangeCollection.length - 1].startContainer;
-                        this.nodeSelectionObj.setSelectionText(this.contentRenderer.getDocument(), textCont, textCont, 0, textCont.textContent.length);
-                        InsertHtml.Insert(this.contentRenderer.getDocument(), document.createTextNode(''));
-                        this.rangeCollection.pop();
+                    else {
+                        if (!args.shiftKey) {
+                            if (selection.startOffset !== selection.endOffset && selection.startOffset === 0) {
+                                this.marginTabAdd(args.shiftKey, alignmentNodes);
+                            }
+                            else {
+                                InsertHtml.Insert(this.contentRenderer.getDocument(), '&nbsp;&nbsp;&nbsp;&nbsp;');
+                                this.rangeCollection.push(this.nodeSelectionObj.getRange(this.contentRenderer.getDocument()));
+                            }
+                        }
+                        else if (this.rangeCollection.length > 0 &&
+                            this.rangeCollection[this.rangeCollection.length - 1].startContainer.textContent.length === 4) {
+                            const textCont = this.rangeCollection[this.rangeCollection.length - 1].startContainer;
+                            this.nodeSelectionObj.setSelectionText(this.contentRenderer.getDocument(), textCont, textCont, 0, textCont.textContent.length);
+                            InsertHtml.Insert(this.contentRenderer.getDocument(), document.createTextNode(''));
+                            this.rangeCollection.pop();
+                        }
+                        else {
+                            this.marginTabAdd(args.shiftKey, alignmentNodes);
+                        }
                     }
                 }
             }
+            this.parent.formatter.saveData(e);
         }
         if (e.args.action === 'space' ||
             e.args.action === 'enter' ||
@@ -22601,6 +22722,30 @@ class HtmlEditor {
     getSelectedHtml(e) {
         e.callBack(this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument()).toString());
     }
+    marginTabAdd(val, alignmentNodes) {
+        for (let index = 0; index < alignmentNodes.length; index++) {
+            const element = alignmentNodes[index];
+            if (element.closest('li')) {
+                continue;
+            }
+            if (element.style.marginLeft) {
+                let count$$1 = parseInt(element.style.marginLeft, 10);
+                if (val) {
+                    count$$1 -= 20;
+                }
+                else {
+                    count$$1 += 20;
+                }
+                element.style.marginLeft = count$$1.toString() + 'px';
+                if (element.style.marginLeft === '0px') {
+                    element.removeAttribute('style');
+                }
+            }
+            else if (!val) {
+                element.style.marginLeft = '20px';
+            }
+        }
+    }
 }
 
 /**
@@ -23254,7 +23399,8 @@ class PasteCleanup {
             clipBoardElem = this.allowedStyle(clipBoardElem);
         }
         this.saveSelection.restore();
-        clipBoardElem.innerHTML = this.sanitizeHelper(clipBoardElem.innerHTML);
+        const newText = clipBoardElem.innerHTML.split("&").join("&amp;");
+        clipBoardElem.innerHTML = this.sanitizeHelper(newText);
         const allImg = clipBoardElem.querySelectorAll('img');
         for (let i = 0; i < allImg.length; i++) {
             if (!isNullOrUndefined(allImg[i].getAttribute('src'))) {
@@ -23309,6 +23455,28 @@ class PasteCleanup {
             this.cropImageHandler(this.parent.inputElement);
         }
     }
+    convertBlobToBase64(element) {
+        const imgElem = element.querySelectorAll('img');
+        for (let i = 0; i < imgElem.length; i++) {
+            if (imgElem[i].getAttribute('src') &&
+                imgElem[i].getAttribute('src').startsWith("blob")) {
+                let blobImageUrl = imgElem[i].getAttribute('src');
+                let img = new Image();
+                const onImageLoadEvent = () => {
+                    let canvas = document.createElement('canvas');
+                    let ctx = canvas.getContext('2d');
+                    canvas.width = img.width;
+                    canvas.height = img.height;
+                    ctx.drawImage(img, 0, 0);
+                    let base64String = canvas.toDataURL('image/png');
+                    imgElem[i].src = base64String;
+                    img.removeEventListener('load', onImageLoadEvent);
+                };
+                img.src = blobImageUrl;
+                img.addEventListener('load', onImageLoadEvent);
+            }
+        }
+    }
     cropImageHandler(element) {
         const allImgElm = element.querySelectorAll('.e-img-cropped');
         if (allImgElm.length > 0) {
@@ -23347,9 +23515,20 @@ class PasteCleanup {
             }
         }
         else {
-            this.imgUploading(this.parent.inputElement);
-            if (this.parent.iframeSettings.enable) {
-                this.parent.updateValue();
+            if (!isNullOrUndefined(this.parent.insertImageSettings.saveUrl) && !isNullOrUndefined(this.parent.insertImageSettings.path) && !isNullOrUndefined(this.parent.inputElement.querySelectorAll("img")) && this.parent.inputElement.querySelectorAll("img")[0].src.startsWith("blob")) {
+                this.convertBlobToBase64(this.parent.inputElement);
+                setTimeout(() => {
+                    this.imgUploading(this.parent.inputElement);
+                    if (this.parent.iframeSettings.enable) {
+                        this.parent.updateValue();
+                    }
+                }, 20);
+            }
+            else {
+                this.imgUploading(this.parent.inputElement);
+                if (this.parent.iframeSettings.enable) {
+                    this.parent.updateValue();
+                }
             }
         }
     }
@@ -24129,9 +24308,6 @@ class FullScreen {
             && !isNullOrUndefined(this.parent.quickToolbarModule)) {
             this.parent.quickToolbarModule.hideQuickToolbars();
         }
-        if (this.parent.showTooltip && !isNullOrUndefined(document.querySelector('.e-tooltip-wrap'))) {
-            this.parent.notify(destroyTooltip, { args: event });
-        }
         this.scrollableParent = getScrollableParent(this.parent.element);
         if (!this.parent.element.classList.contains(CLS_FULL_SCREEN)) {
             const evenArgs = {
@@ -24183,9 +24359,6 @@ class FullScreen {
             && !isNullOrUndefined(this.parent.quickToolbarModule)) {
             this.parent.quickToolbarModule.hideQuickToolbars();
         }
-        if (this.parent.showTooltip && !isNullOrUndefined(document.querySelector('.e-tooltip-wrap'))) {
-            this.parent.notify(destroyTooltip, { args: event });
-        }
         if (this.parent.element.classList.contains(CLS_FULL_SCREEN)) {
             const evenArgs = {
                 cancel: false,
@@ -26586,13 +26759,13 @@ class Image$1 {
             selectParentEle = this.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);
             if (!originalEvent.ctrlKey && originalEvent.key && (originalEvent.key.length === 1 || originalEvent.action === 'enter') &&
                 (!isNullOrUndefined(selectParentEle[0]) && selectParentEle[0].tagName === 'IMG') && selectParentEle[0].parentElement) {
-                const prev = selectParentEle[0].parentElement.childNodes[0];
                 if (this.contentModule.getEditPanel().querySelector('.e-img-resize')) {
                     this.removeResizeEle();
                 }
-                this.parent.formatter.editorManager.nodeSelection.setSelectionText(this.contentModule.getDocument(), prev, prev, prev.textContent.length, prev.textContent.length);
                 removeClass([selectParentEle[0]], 'e-img-focus');
-                this.quickToolObj.imageQTBar.hidePopup();
+                if (this.quickToolObj && this.quickToolObj.imageQTBar) {
+                    this.quickToolObj.imageQTBar.hidePopup();
+                }
             }
         }
         if (originalEvent.ctrlKey && (originalEvent.keyCode === 89 || originalEvent.keyCode === 90)) {
@@ -27353,7 +27526,12 @@ class Image$1 {
             animationSettings: { effect: 'None' },
             close: (event) => {
                 if (this.isImgUploaded) {
-                    this.uploadObj.remove();
+                    if (this.dialogObj.element.querySelector('.e-file-abort-btn')) {
+                        this.dialogObj.element.querySelector('.e-file-abort-btn').click();
+                    }
+                    else {
+                        this.uploadObj.remove();
+                    }
                 }
                 this.parent.isBlur = false;
                 if (event && !isNullOrUndefined(event.event) && event.event.returnValue) {
@@ -28860,7 +29038,12 @@ class Audio {
             animationSettings: { effect: 'None' },
             close: (event) => {
                 if (this.isAudioUploaded) {
-                    this.uploadObj.removing();
+                    if (this.dialogObj.element.querySelector('.e-file-abort-btn')) {
+                        this.dialogObj.element.querySelector('.e-file-abort-btn').click();
+                    }
+                    else {
+                        this.uploadObj.remove();
+                    }
                 }
                 this.parent.isBlur = false;
                 if (event && !isNullOrUndefined(event.event) && event.event.returnValue) {
@@ -30211,7 +30394,12 @@ class Video {
             animationSettings: { effect: 'None' },
             close: (event) => {
                 if (this.isVideoUploaded) {
-                    this.uploadObj.removing();
+                    if (this.dialogObj.element.querySelector('.e-file-abort-btn')) {
+                        this.dialogObj.element.querySelector('.e-file-abort-btn').click();
+                    }
+                    else {
+                        this.uploadObj.remove();
+                    }
                 }
                 this.parent.isBlur = false;
                 if (event && !isNullOrUndefined(event.event) && event.event.returnValue) {
@@ -32438,7 +32626,8 @@ class Table {
             const argument = ((Browser.isDevice || (!isNullOrUndefined(args.args)
                 && !isNullOrUndefined(args.args.originalEvent) &&
                 args.args.originalEvent.action === 'insert-table')
-                || proxy.parent.inlineMode.enable || !isNullOrUndefined(proxy.parent.quickToolbarSettings.text)) ? args :
+                || proxy.parent.inlineMode.enable || ((!isNullOrUndefined(proxy.parent.quickToolbarSettings.text)) &&
+                !(args instanceof PointerEvent))) ? args :
                 this);
             proxy.tableInsert(proxy.rowTextBox.value, proxy.columnTextBox.value, e, argument);
         }
@@ -32887,12 +33076,12 @@ const executeGroup = {
     }
 };
 
-var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Configures the toolbar settings of the RichTextEditor.
  */
@@ -33282,12 +33471,12 @@ __decorate$2([
     Property(bulletFormatList)
 ], BulletFormatList.prototype, "types", void 0);
 
-var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Objects used for configuring the iframe resources properties.
  */
@@ -33314,12 +33503,12 @@ __decorate$3([
     Complex({}, Resources)
 ], IFrameSettings.prototype, "resources", void 0);
 
-var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Configures the inlineMode property of the RTE.
  */
@@ -33370,16 +33559,18 @@ class EnterKeyAction {
         this.getRangeNode();
         let isTableEnter = true;
         this.formatTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'blockquote'];
-        const isCursorAtTableEnd = this.range.collapsed && (this.range.startContainer.nodeType === 1) &&
-            this.range.startContainer.isContentEditable &&
-            this.range.startContainer.childNodes[this.range.startOffset - 1] &&
-            this.range.startContainer.childNodes[this.range.startOffset - 1].nodeName === 'TABLE';
-        const isCursorAtTableStart = this.range.collapsed && (this.range.startContainer.nodeType === 1) &&
-            this.range.startContainer.isContentEditable && this.range.startContainer.childNodes[this.range.startOffset] &&
-            this.range.startContainer.childNodes[this.range.startOffset].nodeName === 'TABLE';
-        if (isCursorAtTableEnd || isCursorAtTableStart) {
-            this.handleCursorAtTableSide(e, isCursorAtTableStart, isCursorAtTableEnd);
-            return;
+        const tableImagCursor = this.processedTableImageCursor();
+        if (tableImagCursor.start || tableImagCursor.end) {
+            if (tableImagCursor.startName === 'TABLE' || tableImagCursor.endName === 'TABLE') { // Default browser action prevented and hanled manually.
+                this.handleCursorAtTableSide(e, tableImagCursor.start, tableImagCursor.end);
+                return;
+            }
+        }
+        if (tableImagCursor.start || tableImagCursor.end || this.range.startContainer.nodeName === 'IMG') {
+            if (this.parent.enterKey === 'BR' && (tableImagCursor.startName === 'IMG' || tableImagCursor.endName === 'IMG' || this.range.startContainer.nodeName === 'IMG')) { // Default browser action prevented and hanled manually.
+                this.handleEnterKeyAtImageSide(e, tableImagCursor.start, tableImagCursor.end);
+                return;
+            }
         }
         if (!isNullOrUndefined(this.startNode.closest('TABLE')) && !isNullOrUndefined(this.endNode.closest('TABLE'))) {
             isTableEnter = false;
@@ -33747,7 +33938,6 @@ class EnterKeyAction {
                                     const outerBRElem = this.parent.createElement('br');
                                     if (this.range.startOffset === 0 && this.range.endOffset === 0 &&
                                         !isNullOrUndefined(currentParent.previousSibling) && currentParent.previousSibling.nodeName === 'BR' && currentParent.nodeName !== 'P' && currentParent.nodeName !== 'DIV') {
-                                        // eslint-disable-next-line @typescript-eslint/no-unused-vars
                                         newElem = this.parent.formatter.editorManager.nodeCutter.SplitNode(this.range, currentParent, false).cloneNode(true);
                                         this.parent.formatter.editorManager.domNode.insertAfter(outerBRElem, currentParent);
                                         this.insertFocusContent();
@@ -33777,7 +33967,7 @@ class EnterKeyAction {
                             }
                             e.args.preventDefault();
                         }
-                        this.parent.trigger(actionComplete, { requestType: shiftKey ? 'ShiftEnterAction' : 'EnterAction', args: e.args });
+                        this.triggerActionComplete(e, shiftKey);
                     }
                 });
             }
@@ -33847,6 +34037,9 @@ class EnterKeyAction {
         }
         return insertElem;
     }
+    triggerActionComplete(e, shiftKey) {
+        this.parent.trigger(actionComplete, { requestType: shiftKey ? 'ShiftEnterAction' : 'EnterAction', args: e.args });
+    }
     handleCursorAtTableSide(e, isStart, isEnd) {
         if (this.parent.enterKey !== 'BR') {
             const shiftKey = e.args.shiftKey;
@@ -33876,19 +34069,99 @@ class EnterKeyAction {
                     }
                     this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), newElement, 0);
                     e.args.preventDefault();
-                    this.parent.trigger(actionComplete, { requestType: shiftKey ? 'ShiftEnterAction' : 'EnterAction', args: e.args });
+                    this.triggerActionComplete(e, shiftKey);
                 }
             });
         }
     }
+    handleEnterKeyAtImageSide(e, isStart, isEnd) {
+        const actionBeginArgs = {
+            cancel: false,
+            name: actionBegin,
+            requestType: e.args.shiftKey ? 'ShiftEnterAction' : 'EnterAction',
+            originalEvent: e.args
+        };
+        let directRange = false;
+        if (this.range.startContainer.nodeName === 'IMG' && this.range.startOffset === 0) {
+            directRange = true;
+        }
+        this.parent.trigger(actionBegin, actionBeginArgs, (actionBeginArgs) => {
+            if (!actionBeginArgs.cancel) {
+                if (this.parent.enterKey === 'BR') {
+                    const newElement = this.parent.createElement('BR');
+                    let imageElement;
+                    if (directRange) {
+                        imageElement = this.range.startContainer;
+                        imageElement.parentElement.insertBefore(newElement, imageElement);
+                        this.parent.formatter.editorManager.nodeSelection.
+                            setCursorPoint(this.parent.contentModule.getDocument(), imageElement, 0);
+                    }
+                    if (isStart) {
+                        imageElement = this.range.startContainer.childNodes[this.range.startOffset];
+                        imageElement.parentElement.insertBefore(newElement, imageElement);
+                        this.parent.formatter.editorManager.nodeSelection.
+                            setCursorPoint(this.parent.contentModule.getDocument(), imageElement, 0);
+                    }
+                    if (isEnd) {
+                        imageElement = this.range.startContainer.childNodes[this.range.startOffset - 1];
+                        if (!isNullOrUndefined(imageElement.nextSibling)) {
+                            imageElement.parentElement.insertBefore(newElement, imageElement.nextSibling);
+                            this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), newElement.nextSibling, 0);
+                        }
+                        else if (isNullOrUndefined(imageElement.nextSibling)) {
+                            imageElement.parentElement.appendChild(newElement);
+                            const brElement = this.parent.createElement('BR');
+                            imageElement.parentElement.appendChild(brElement);
+                            this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), brElement, 0);
+                        }
+                    }
+                    e.args.preventDefault();
+                    this.triggerActionComplete(e, e.args.shiftKey);
+                }
+            }
+        });
+    }
+    isTableOrImageStart() {
+        const customHandlerElements = ['IMG', 'TABLE'];
+        const startContainer = this.range.startContainer;
+        const startOffset = this.range.startOffset;
+        const isCursorAtStart = this.range.collapsed && (startContainer.nodeType === 1) &&
+            startContainer.isContentEditable && startContainer.childNodes[startOffset] &&
+            (customHandlerElements.indexOf(startContainer.childNodes[startOffset].nodeName) > -1);
+        if (isCursorAtStart) {
+            return { start: isCursorAtStart, startNodeName: startContainer.childNodes[startOffset].nodeName };
+        }
+        else {
+            return { start: false, startNodeName: '' };
+        }
+    }
+    isTableOrImageEnd() {
+        const customHandlerElements = ['IMG', 'TABLE'];
+        const startContainer = this.range.startContainer;
+        const startOffset = this.range.startOffset;
+        const isCursorAtEnd = this.range.collapsed && (startContainer.nodeType === 1) &&
+            startContainer.isContentEditable && startContainer.childNodes[startOffset - 1] &&
+            (customHandlerElements.indexOf(startContainer.childNodes[startOffset - 1].nodeName) > -1);
+        if (isCursorAtEnd) {
+            return { end: isCursorAtEnd, endNodeName: startContainer.childNodes[startOffset - 1].nodeName };
+        }
+        else {
+            return { end: false, endNodeName: '' };
+        }
+    }
+    processedTableImageCursor() {
+        const { start, startNodeName } = this.isTableOrImageStart();
+        const { end, endNodeName } = this.isTableOrImageEnd();
+        return { start, startName: startNodeName, end, endName: endNodeName };
+    }
 }
 
-var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 /**
  * Represents the Rich Text Editor component.
  * ```html
@@ -34026,6 +34299,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         this.persistData();
         setStyleAttribute(this.element, { 'width': formatUnit(this.width) });
         attributes(this.element, { role: 'application', 'aria-label': 'Rich Text Editor' });
+        this.beforeRenderClassValue = this.element.getAttribute('class');
     }
     persistData() {
         if (this.enablePersistence && this.originalElement.tagName === 'TEXTAREA') {
@@ -34896,6 +35170,10 @@ let RichTextEditor = class RichTextEditor extends Component {
         if (this.isDestroyed || !this.isRendered) {
             return;
         }
+        this.element.className = this.beforeRenderClassValue;
+        this.removeHtmlAttributes();
+        this.removeAttributes();
+        this.beforeRenderClassValue = null;
         if (!isNullOrUndefined(this.timeInterval)) {
             clearInterval(this.timeInterval);
             this.timeInterval = null;
@@ -34963,8 +35241,6 @@ let RichTextEditor = class RichTextEditor extends Component {
                 }
             }
         }
-        this.removeHtmlAttributes();
-        this.removeAttributes();
         super.destroy();
         this.isRendered = false;
     }
@@ -34995,6 +35271,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         this.element.removeAttribute('aria-disabled');
         this.element.removeAttribute('role');
         this.element.removeAttribute('tabindex');
+        this.element.removeAttribute('aria-label');
     }
     destroyDependentModules() {
         /* destroy dependent modules */
@@ -35248,7 +35525,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         }
     }
     updatePanelValue() {
-        let value = this.value;
+        let value = this.listOrderCorrection(this.value);
         value = (this.enableHtmlEncode && this.value) ? decode(value) : value;
         const getTextArea = this.element.querySelector('.' + CLS_RTE_SOURCE_CODE_TXTAREA);
         if (value) {
@@ -35292,6 +35569,17 @@ let RichTextEditor = class RichTextEditor extends Component {
             this.countModule.refresh();
         }
     }
+    listOrderCorrection(value) {
+        const valueElementWrapper = this.createElement('div');
+        valueElementWrapper.innerHTML = value;
+        const listElements = valueElementWrapper.querySelectorAll('UL, OL');
+        for (let i = 0; i < listElements.length; i++) {
+            if (!isNullOrUndefined(listElements[i]) && !isNullOrUndefined(listElements[i].parentElement) && !isNullOrUndefined(listElements[i].previousElementSibling) && (listElements[i].parentElement.nodeName === 'UL' || listElements[i].parentElement.nodeName === 'OL')) {
+                listElements[i].previousElementSibling.appendChild(listElements[i]);
+            }
+        }
+        return valueElementWrapper.innerHTML;
+    }
     setHeight(height) {
         if (height !== 'auto') {
             this.element.style.height = formatUnit(height);