@syncfusion/ej2-richtexteditor 19.3.53-6125 → 19.4.38

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

@@ -3592,11 +3592,6 @@ class DropDownButtons {
         for (const prop of Object.keys(newProp)) {
             switch (prop) {
                 case 'fontFamily':
-                    if (this.parent.inlineMode.enable) {
-                        if (!isNullOrUndefined(this.parent.fontFamily.default)) {
-                            this.getEditNode().style.fontFamily = this.parent.fontFamily.default;
-                        }
-                    }
                     if (this.fontNameDropDown) {
                         for (const fontFamily$$1 of Object.keys(newProp.fontFamily)) {
                             switch (fontFamily$$1) {
@@ -3627,11 +3622,6 @@ class DropDownButtons {
                     }
                     break;
                 case 'fontSize':
-                    if (this.parent.inlineMode) {
-                        if (!isNullOrUndefined(this.parent.fontSize.default)) {
-                            this.getEditNode().style.fontSize = this.parent.fontSize.default;
-                        }
-                    }
                     if (this.fontSizeDropDown) {
                         for (const fontSize$$1 of Object.keys(newProp.fontSize)) {
                             switch (fontSize$$1) {
@@ -4718,12 +4708,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,
@@ -5714,7 +5704,7 @@ class QuickToolbar {
      * @deprecated
      */
     showInlineQTBar(x, y, target) {
-        if (this.parent.readonly) {
+        if (this.parent.readonly || target.tagName.toLowerCase() === "img") {
             return;
         }
         this.inlineQTBar.showPopup(x, y, target);
@@ -12202,8 +12192,6 @@ class InsertHtml {
                 let splitedElm;
                 if ((currentNode.nodeName === 'BR' || currentNode.nodeName === 'HR') && !isNullOrUndefined(currentNode.parentElement) &&
                     currentNode.parentElement.textContent.trim().length === 0 && !node.classList.contains('pasteContent')) {
-                    //let newChildElem: HTMLElement = createElement(currentNode.nodeName);
-                    //currentNode.parentElement.insertBefore(newChildElem, currentNode);
                     splitedElm = currentNode;
                 }
                 else {
@@ -15272,7 +15260,16 @@ class UndoRedoManager {
      * @deprecated
      */
     saveData(e) {
-        const range = new NodeSelection().getRange(this.parent.currentDocument);
+        let range = new NodeSelection().getRange(this.parent.currentDocument);
+        let currentContainer = range.startContainer;
+        for (let i = currentContainer.childNodes.length - 1; i >= 0; i--) {
+            if (!isNullOrUndefined(currentContainer.childNodes[i]) && currentContainer.childNodes[i].nodeName === '#text' &&
+                currentContainer.childNodes[i].textContent.length === 0 && currentContainer.childNodes[i].nodeName !== 'IMG' &&
+                currentContainer.childNodes[i].nodeName !== 'BR' && currentContainer.childNodes[i].nodeName && 'HR') {
+                detach(currentContainer.childNodes[i]);
+            }
+        }
+        range = new NodeSelection().getRange(this.parent.currentDocument);
         const save = new NodeSelection().save(range, this.parent.currentDocument);
         const htmlText = this.parent.editableElement.innerHTML;
         const changEle = { text: htmlText, range: save };
@@ -15422,7 +15419,7 @@ class MsWordPaste {
         this.parent.observer.on(MS_WORD_CLEANUP_PLUGIN, this.wordCleanup, this);
     }
     wordCleanup(e) {
-        const wordPasteStyleConfig = e.allowedStylePropertiesArray;
+        const wordPasteStyleConfig = !isNullOrUndefined(e.allowedStylePropertiesArray) ? e.allowedStylePropertiesArray : [];
         let listNodes = [];
         let tempHTMLContent = e.args.clipboardData.getData('text/HTML');
         const rtfData = e.args.clipboardData.getData('text/rtf');
@@ -16749,98 +16746,98 @@ 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 {border: 0;cursor: pointer;display:
-                    block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}
-                .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-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 {float: left;margin: 0 5px 0 0;text-align: left;}
-                .e-imgright {float: right;margin: 0 0 0 5px;text-align: right;}
-                .e-imgcenter {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 {display: inline-block;float: none;margin-left: 5px;margin-right: 5px;
-                    max-width: calc(100% - (2 * 5px));vertical-align: bottom;}
-                .e-imgbreak {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) {border: solid 2px #4a90e2;}
-                img.e-img-focus::selection { background: transparent;color: transparent;}
-                span.e-rte-imageboxmark {  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 { background: #4a90e2; border: 1px solid #fff; }
-                .e-mob-rte span.e-rte-imageboxmark { background: #fff; border: 1px solid #4a90e2;
-                    border-radius: 15px; height: 20px; width: 20px; }
-                .e-mob-rte.e-mob-span span.e-rte-imageboxmark { background: #4a90e2; border: 1px solid #fff; }
-                .e-rte-content .e-content img.e-resize { z-index: 1000; }
-                .e-img-caption .e-img-inner { outline: 0; }
-                .e-img-caption a:focus-visible { outline: none; }
-                .e-img-caption .e-rte-image.e-imgright, .e-img-caption .e-rte-image.e-imgleft { float: none; 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;}
-                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; 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; }
-            </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 {border: 0;cursor: pointer;display:
+                    block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}
+                .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-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 {float: left;margin: 0 5px 0 0;text-align: left;}
+                .e-imgright {float: right;margin: 0 0 0 5px;text-align: right;}
+                .e-imgcenter {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 {display: inline-block;float: none;margin-left: 5px;margin-right: 5px;
+                    max-width: calc(100% - (2 * 5px));vertical-align: bottom;}
+                .e-imgbreak {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) {border: solid 2px #4a90e2;}
+                img.e-img-focus::selection { background: transparent;color: transparent;}
+                span.e-rte-imageboxmark {  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 { background: #4a90e2; border: 1px solid #fff; }
+                .e-mob-rte span.e-rte-imageboxmark { background: #fff; border: 1px solid #4a90e2;
+                    border-radius: 15px; height: 20px; width: 20px; }
+                .e-mob-rte.e-mob-span span.e-rte-imageboxmark { background: #4a90e2; border: 1px solid #fff; }
+                .e-rte-content .e-content img.e-resize { z-index: 1000; }
+                .e-img-caption .e-img-inner { outline: 0; }
+                .e-img-caption a:focus-visible { outline: none; }
+                .e-img-caption .e-rte-image.e-imgright, .e-img-caption .e-rte-image.e-imgleft { float: none; 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;}
+                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; 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; }
+            </style>
         </head>`;
 /**
  * Content module is used to render Rich Text Editor content
@@ -16941,7 +16938,7 @@ class XhtmlValidation {
             this.ImageTags();
             this.removeTags();
             this.RemoveUnsupported();
-            this.currentElement.innerHTML = this.selfEncloseValidation(this.currentElement.innerHTML, this.currentElement.innerText === '\n' ?
+            this.currentElement.innerHTML = this.selfEncloseValidation(this.currentElement.innerHTML, this.currentElement.innerText === "\n" ?
                 this.currentElement.innerText.length : this.currentElement.innerText.trim().length);
             this.parent.setProperties({ value: this.currentElement.innerHTML }, true);
         }
@@ -17225,7 +17222,7 @@ class HtmlEditor {
             e.args.action === 'enter' ||
             e.args.keyCode === 13) {
             this.spaceLink(e.args);
-            if (this.parent.editorMode === 'HTML' && !((this.parent.shiftEnterKey === 'BR' && e.args.shiftKey))) {
+            if (this.parent.editorMode === 'HTML' && !this.parent.readonly) {
                 this.parent.notify(enterHandler, { args: e.args });
             }
         }
@@ -17502,7 +17499,7 @@ class HtmlEditor {
             const divElement = this.parent.createElement('div');
             divElement.setAttribute('class', 'pasteContent');
             divElement.style.display = 'inline';
-            divElement.innerHTML = contentInnerElem;
+            divElement.innerHTML = contentInnerElem.replace('&para', '&amp;para');
             const paraElem = divElement.querySelectorAll('span, p');
             for (let i = 0; i < paraElem.length; i++) {
                 const splitTextContent = paraElem[i].innerHTML.split(' ');
@@ -20126,10 +20123,14 @@ class Image {
                 img.style.height = expectedY + 'px';
             }
             else if (img.style.width !== '' && img.style.height === '') {
-                img.style.width = ((width / height * expectedY) + width / height).toString() + 'px';
+                let currentWidth = ((width / height * expectedY) + width / height) < (this.parent.inputElement.getBoundingClientRect().right - 32) ?
+                    ((width / height * expectedY) + width / height) : (this.parent.inputElement.getBoundingClientRect().right - 32);
+                img.style.width = currentWidth.toString() + 'px';
             }
             else if (img.style.width !== '') {
-                img.style.width = (width / height * expectedY) + 'px';
+                let currentWidth = (width / height * expectedY) < (this.parent.inputElement.getBoundingClientRect().right - 32) ?
+                    (width / height * expectedY) : (this.parent.inputElement.getBoundingClientRect().right - 32);
+                img.style.width = currentWidth + 'px';
                 img.style.height = expectedY + 'px';
             }
             else {
@@ -20237,7 +20238,7 @@ class Image {
     }
     resizeImgDupPos(e) {
         this.imgDupPos = {
-            width: (e.style.height !== '') ? this.imgEle.style.width : e.width + 'px',
+            width: (e.style.width !== '') ? this.imgEle.style.width : e.width + 'px',
             height: (e.style.height !== '') ? this.imgEle.style.height : e.height + 'px'
         };
     }
@@ -20405,6 +20406,27 @@ class Image {
                     const src = this.deletedImg[i].src;
                     this.imageRemovePost(src);
                 }
+                if (range.startContainer.nodeType === 3) {
+                    if (originalEvent.code === 'Backspace') {
+                        if (range.startContainer.previousElementSibling && range.startOffset === 0 &&
+                            range.startContainer.previousElementSibling.classList.contains(CLS_CAPTION) &&
+                            range.startContainer.previousElementSibling.classList.contains(CLS_CAPINLINE)) {
+                            detach(range.startContainer.previousElementSibling);
+                        }
+                    }
+                    else {
+                        if (range.startContainer.nextElementSibling &&
+                            range.endContainer.textContent.length === range.endOffset &&
+                            range.startContainer.nextElementSibling.classList.contains(CLS_CAPTION) &&
+                            range.startContainer.nextElementSibling.classList.contains(CLS_CAPINLINE)) {
+                            detach(range.startContainer.nextElementSibling);
+                        }
+                    }
+                }
+                else if ((range.startContainer.nodeType === 1 &&
+                    range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_CAPINLINE))) {
+                    detach(range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_CAPINLINE));
+                }
                 break;
             case 'insert-image':
                 this.openDialog(true, originalEvent, save, selectNodeEle, selectParentEle);
@@ -20609,7 +20631,7 @@ class Image {
             const target = args.target;
             this.contentModule = this.rendererFactory.getRenderer(RenderType.Content);
             const isPopupOpen = this.quickToolObj.imageQTBar.element.classList.contains('e-rte-pop');
-            if (target.nodeName === 'IMG' && this.parent.quickToolbarModule && this.parent.getRange().startOffset === this.parent.getRange().endOffset) {
+            if (target.nodeName === 'IMG' && this.parent.quickToolbarModule) {
                 if (isPopupOpen) {
                     return;
                 }
@@ -20848,6 +20870,9 @@ class Image {
     imageRemovePost(src) {
         const proxy = this;
         let absoluteUrl = '';
+        if (isNullOrUndefined(this.parent.insertImageSettings.removeUrl) || this.parent.insertImageSettings.removeUrl === '') {
+            return;
+        }
         if (src.indexOf('http://') > -1 || src.indexOf('https://') > -1) {
             absoluteUrl = src;
         }
@@ -21684,6 +21709,7 @@ class Image {
         imageTag.addEventListener('load', () => {
             this.parent.trigger(actionComplete, e);
         });
+        detach(parentElement);
     }
     /**
      * Rendering uploader and popup for drag and drop
@@ -21718,6 +21744,9 @@ class Image {
                 this.popupObj.destroy();
                 detach(this.popupObj.element);
                 this.popupObj = null;
+                if (!this.parent.inlineMode.enable) {
+                    this.parent.toolbarModule.baseToolbar.toolbarObj.disable(false);
+                }
             }
         });
         this.popupObj.element.style.display = 'none';
@@ -21749,6 +21778,10 @@ class Image {
                 isUploading = false;
                 detach(imageElement);
                 this.popupObj.close();
+                this.quickToolObj.imageQTBar.hidePopup();
+                setTimeout(() => {
+                    this.uploadObj.destroy();
+                }, 900);
             },
             beforeUpload: (args) => {
                 if (this.parent.isServerRendered) {
@@ -21760,6 +21793,9 @@ class Image {
                         if (beforeUploadArgs.cancel) {
                             return;
                         }
+                        if (!this.parent.inlineMode.enable) {
+                            this.parent.toolbarModule.baseToolbar.toolbarObj.disable(true);
+                        }
                         /* eslint-disable */
                         this.uploadObj.currentRequestHeader = beforeUploadArgs.currentRequest ?
                             beforeUploadArgs.currentRequest : this.uploadObj.currentRequestHeader;
@@ -21772,6 +21808,9 @@ class Image {
                 }
                 else {
                     this.parent.trigger(beforeImageUpload, args);
+                    if (!this.parent.inlineMode.enable) {
+                        this.parent.toolbarModule.baseToolbar.toolbarObj.disable(true);
+                    }
                 }
             },
             uploading: (e) => {
@@ -21814,6 +21853,9 @@ class Image {
                 }, 900);
             },
             success: (e) => {
+                if (e.operation === "cancel") {
+                    return;
+                }
                 isUploading = false;
                 this.parent.inputElement.contentEditable = 'true';
                 const args = {
@@ -23681,12 +23723,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.
  */
@@ -23975,12 +24017,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.
  */
@@ -24007,12 +24049,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.
  */
@@ -24053,9 +24095,20 @@ class EnterKeyAction {
     }
     enterHandler(e) {
         this.getRangeNode();
+        let isTableEnter = true;
+        if (!isNullOrUndefined(this.startNode.closest('TABLE')) && !isNullOrUndefined(this.endNode.closest('TABLE'))) {
+            isTableEnter = false;
+            let curElement = this.startNode;
+            let blockElement = curElement;
+            while (!this.parent.formatter.editorManager.domNode.isBlockNode(curElement)) {
+                blockElement = curElement;
+                curElement = curElement.parentElement;
+            }
+            isTableEnter = blockElement.tagName === 'TD' ? false : true;
+        }
         if (e.args.which === 13 && e.args.code === 'Enter') {
-            if (isNullOrUndefined(this.startNode.closest('LI')) && isNullOrUndefined(this.endNode.closest('LI')) && isNullOrUndefined(this.startNode.closest('TABLE')) &&
-                isNullOrUndefined(this.endNode.closest('TABLE')) && isNullOrUndefined(this.startNode.closest('PRE')) && isNullOrUndefined(this.endNode.closest('PRE'))) {
+            if (isNullOrUndefined(this.startNode.closest('LI')) && isNullOrUndefined(this.endNode.closest('LI')) && isTableEnter &&
+                isNullOrUndefined(this.startNode.closest('PRE')) && isNullOrUndefined(this.endNode.closest('PRE'))) {
                 const shiftKey = e.args.shiftKey;
                 const actionBeginArgs = {
                     cancel: false,
@@ -24113,12 +24166,32 @@ class EnterKeyAction {
                             this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), this.range.startContainer.childNodes[this.range.startOffset], 0);
                             this.getRangeNode();
                         }
-                        if (this.parent.enterKey === 'P' || this.parent.enterKey === 'DIV' ||
+                        if ((this.parent.enterKey === 'P' && !shiftKey) || (this.parent.enterKey === 'DIV' && !shiftKey) ||
                             (this.parent.shiftEnterKey === 'P' && shiftKey) ||
                             (this.parent.shiftEnterKey === 'DIV' && shiftKey)) {
-                            const nearBlockNode = this.parent.formatter.editorManager.domNode.blockParentNode(this.startNode);
+                            let nearBlockNode;
+                            if (isTableEnter && this.parent.formatter.editorManager.domNode.isBlockNode(this.startNode)) {
+                                nearBlockNode = this.startNode;
+                            }
+                            else {
+                                nearBlockNode = this.parent.formatter.editorManager.domNode.blockParentNode(this.startNode);
+                            }
                             let isImageNode = false;
-                            if (this.range.startOffset === 0 && this.range.endOffset === 0 && !(!isNullOrUndefined(this.range.startContainer.previousSibling) && this.range.startContainer.previousSibling.nodeName === 'IMG')) {
+                            let isFocusedFirst = false;
+                            if (this.range.startOffset != 0 && this.range.endOffset != 0 && this.range.startContainer === this.range.endContainer &&
+                                !(!isNullOrUndefined(nearBlockNode.childNodes[0]) && nearBlockNode.childNodes[0].nodeName === 'IMG')) {
+                                let startNodeText = this.range.startContainer.textContent;
+                                let splitFirstText = startNodeText.substring(0, this.range.startOffset);
+                                if (splitFirstText.charCodeAt(this.range.startOffset - 1) != 160 && splitFirstText.trim().length === 0) {
+                                    isFocusedFirst = true;
+                                }
+                            }
+                            else if (this.range.startOffset === 0 && this.range.endOffset === 0) {
+                                isFocusedFirst = true;
+                            }
+                            if (((this.range.startOffset === 0 && this.range.endOffset === 0) || isFocusedFirst) &&
+                                !(!isNullOrUndefined(this.range.startContainer.previousSibling) &&
+                                    (this.range.startContainer.previousSibling.nodeName === 'IMG' || this.range.startContainer.previousSibling.nodeName === 'BR'))) {
                                 let isNearBlockLengthZero;
                                 let newElem;
                                 if (this.range.startContainer.nodeName === 'IMG') {
@@ -24127,7 +24200,7 @@ class EnterKeyAction {
                                     isNearBlockLengthZero = false;
                                 }
                                 else {
-                                    if (nearBlockNode.textContent.length !== 0) {
+                                    if (nearBlockNode.textContent.trim().length !== 0) {
                                         newElem = this.parent.formatter.editorManager.nodeCutter.SplitNode(this.range, nearBlockNode, false).cloneNode(true);
                                         isNearBlockLengthZero = false;
                                     }
@@ -24176,7 +24249,18 @@ class EnterKeyAction {
                                 }
                                 if (newElem.textContent.trim().length === 0) {
                                     const brElm = this.parent.createElement('br');
-                                    this.startNode.appendChild(brElm);
+                                    if (this.startNode.nodeName === 'A') {
+                                        let startParentElem = this.startNode.parentElement;
+                                        this.startNode.parentElement.insertBefore(brElm, this.startNode);
+                                        detach(this.startNode);
+                                        this.startNode = startParentElem;
+                                    }
+                                    else {
+                                        this.startNode.appendChild(brElm);
+                                    }
+                                    if (newElem.childNodes[0].textContent === '\n') {
+                                        detach(newElem.childNodes[0]);
+                                    }
                                     this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), this.startNode, 0);
                                 }
                                 if (((this.parent.enterKey === 'P' || this.parent.enterKey === 'DIV') && !shiftKey) || ((this.parent.shiftEnterKey === 'DIV' ||
@@ -24187,12 +24271,13 @@ class EnterKeyAction {
                                     }
                                     this.parent.formatter.editorManager.domNode.insertAfter(insertElm, newElem);
                                     detach(newElem);
-                                    this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), this.parent.formatter.editorManager.domNode.isBlockNode(this.startNode) ? insertElm : this.startNode, 0);
+                                    this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), this.parent.formatter.editorManager.domNode.isBlockNode(this.startNode) ?
+                                        insertElm : this.startNode, 0);
                                 }
                             }
                             e.args.preventDefault();
                         }
-                        if (this.parent.enterKey === 'BR' && !shiftKey) {
+                        if ((this.parent.enterKey === 'BR' && !shiftKey) || (this.parent.shiftEnterKey === 'BR' && shiftKey)) {
                             let currentParent;
                             if (!this.parent.formatter.editorManager.domNode.isBlockNode(this.startNode)) {
                                 let currentNode = this.startNode;
@@ -24207,11 +24292,16 @@ class EnterKeyAction {
                             else {
                                 currentParent = this.startNode;
                             }
-                            let isEmptyBrInserted = false;
+                            let currentParentLastChild = currentParent.lastChild;
+                            while (!isNullOrUndefined(currentParentLastChild) && !(currentParentLastChild.nodeName === '#text')) {
+                                currentParentLastChild = currentParentLastChild.lastChild;
+                            }
+                            const isLastNodeLength = this.range.startContainer === currentParentLastChild ?
+                                this.range.startContainer.textContent.length : currentParent.textContent.length;
                             if (currentParent !== this.parent.inputElement &&
                                 this.parent.formatter.editorManager.domNode.isBlockNode(currentParent) &&
                                 this.range.startOffset === this.range.endOffset &&
-                                this.range.startOffset === currentParent.textContent.length) {
+                                this.range.startOffset === isLastNodeLength) {
                                 const outerBRElem = this.parent.createElement('br');
                                 this.parent.formatter.editorManager.domNode.insertAfter(outerBRElem, currentParent);
                                 this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), outerBRElem, 0);
@@ -24238,37 +24328,15 @@ class EnterKeyAction {
                                             currentFocusElem = currentFocusElem.lastChild;
                                         }
                                         this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), currentFocusElem, 0);
-                                        isEmptyBrInserted = true;
+                                        
                                     }
                                     else {
-                                        newElem = this.parent.formatter.editorManager.nodeCutter.SplitNode(this.range, currentParent, true);
-                                        newElem.parentElement.insertBefore(outerBRElem, newElem);
-                                        this.insertFocusContent();
+                                        this.insertBRElement();
                                     }
                                 }
                             }
                             else {
-                                const brElm = this.parent.createElement('br');
-                                if (this.startNode.nodeName === 'BR' && this.endNode.nodeName === 'BR' && this.range.startOffset === 0 && this.range.startOffset === this.range.endOffset) {
-                                    this.parent.formatter.editorManager.domNode.insertAfter(brElm, this.startNode);
-                                    isEmptyBrInserted = true;
-                                }
-                                else {
-                                    if (this.startNode === this.parent.inputElement && !isNullOrUndefined(this.range.startContainer.previousSibling) &&
-                                        this.range.startContainer.previousSibling.nodeName === 'BR' && this.range.startContainer.textContent.length === 0) {
-                                        isEmptyBrInserted = true;
-                                    }
-                                    this.range.insertNode(brElm);
-                                }
-                                if (isEmptyBrInserted || (!isNullOrUndefined(brElm.nextElementSibling) && brElm.nextElementSibling.tagName === 'BR') || (!isNullOrUndefined(brElm.nextSibling) && brElm.nextSibling.textContent.length > 0)) {
-                                    this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), !isNullOrUndefined(brElm.nextSibling) ? brElm.nextSibling : brElm, 0);
-                                    isEmptyBrInserted = false;
-                                }
-                                else {
-                                    const brElm2 = this.parent.createElement('br');
-                                    this.range.insertNode(brElm2);
-                                    this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), brElm, 0);
-                                }
+                                this.insertBRElement();
                             }
                             e.args.preventDefault();
                         }
@@ -24278,6 +24346,30 @@ class EnterKeyAction {
             }
         }
     }
+    insertBRElement() {
+        let isEmptyBrInserted = false;
+        const brElm = this.parent.createElement('br');
+        if (this.startNode.nodeName === 'BR' && this.endNode.nodeName === 'BR' && this.range.startOffset === 0 && this.range.startOffset === this.range.endOffset) {
+            this.parent.formatter.editorManager.domNode.insertAfter(brElm, this.startNode);
+            isEmptyBrInserted = true;
+        }
+        else {
+            if (this.startNode === this.parent.inputElement && !isNullOrUndefined(this.range.startContainer.previousSibling) &&
+                this.range.startContainer.previousSibling.nodeName === 'BR' && this.range.startContainer.textContent.length === 0) {
+                isEmptyBrInserted = true;
+            }
+            this.range.insertNode(brElm);
+        }
+        if (isEmptyBrInserted || (!isNullOrUndefined(brElm.nextElementSibling) && brElm.nextElementSibling.tagName === 'BR') || (!isNullOrUndefined(brElm.nextSibling) && brElm.nextSibling.textContent.length > 0)) {
+            this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), !isNullOrUndefined(brElm.nextSibling) ? brElm.nextSibling : brElm, 0);
+            isEmptyBrInserted = false;
+        }
+        else {
+            const brElm2 = this.parent.createElement('br');
+            this.range.insertNode(brElm2);
+            this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), brElm, 0);
+        }
+    }
     insertFocusContent() {
         if (this.range.startContainer.textContent.length === 0) {
             if (this.range.startContainer.nodeName === '#text') {
@@ -24300,12 +24392,12 @@ class EnterKeyAction {
     }
 }
 
-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
@@ -25675,7 +25767,7 @@ let RichTextEditor = class RichTextEditor extends Component {
                 this.setProperties({ value: this.valueTemplate });
             }
             else {
-                const compiledTemplate = compile(this.valueTemplate)('', this, 'valueTemplate');
+                const compiledTemplate = compile(this.valueTemplate)("", this, 'valueTemplate');
                 for (let i = 0; i < compiledTemplate.length; i++) {
                     const item = compiledTemplate[i];
                     append([item], this.element);