@syncfusion/ej2-richtexteditor 19.3.45 → 19.3.53-6125

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

@@ -2739,7 +2739,8 @@ class ToolbarRenderer {
         this.parent.notify(beforeDropDownItemRender, args);
     }
     dropDownOpen(args) {
-        if (args.element.parentElement.getAttribute('id').indexOf('TableCell') > -1) {
+        if (args.element.parentElement.getAttribute('id').indexOf('TableCell') > -1 && !isNullOrUndefined(args.element.parentElement.querySelector('.e-cell-merge')) &&
+            (!isNullOrUndefined(args.element.parentElement.querySelector('.e-cell-horizontal-split')) || !isNullOrUndefined(args.element.parentElement.querySelector('.e-cell-vertical-split')))) {
             const listEle = args.element.querySelectorAll('li');
             if (this.parent.inputElement.querySelectorAll('.e-cell-select').length === 1) {
                 addClass([listEle[0]], 'e-disabled');
@@ -3591,6 +3592,11 @@ 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) {
@@ -3621,6 +3627,11 @@ 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) {
@@ -4707,12 +4718,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,
@@ -5649,6 +5660,11 @@ class QuickToolbar {
         this.parent.isBlur = false;
         this.parent.isRTE = true;
     }
+    keyUpQT(e) {
+        if (e.which == 27) {
+            this.hideQuickToolbars();
+        }
+    }
     renderQuickToolbars() {
         if (this.linkQTBar || this.imageQTBar || this.textQTBar || this.tableQTBar) {
             return;
@@ -5663,15 +5679,19 @@ class QuickToolbar {
         this.renderFactory.addRenderer(RenderType.TableToolbar, this.tableQTBar);
         if (this.linkQTBar) {
             EventHandler.add(this.linkQTBar.element, 'mousedown', this.onMouseDown, this);
+            EventHandler.add(this.linkQTBar.element, 'keyup', this.keyUpQT, this);
         }
         if (this.imageQTBar) {
             EventHandler.add(this.imageQTBar.element, 'mousedown', this.onMouseDown, this);
+            EventHandler.add(this.imageQTBar.element, 'keyup', this.keyUpQT, this);
         }
         if (this.textQTBar) {
             EventHandler.add(this.textQTBar.element, 'mousedown', this.onMouseDown, this);
+            EventHandler.add(this.textQTBar.element, 'keyup', this.keyUpQT, this);
         }
         if (this.tableQTBar) {
             EventHandler.add(this.tableQTBar.element, 'mousedown', this.onMouseDown, this);
+            EventHandler.add(this.tableQTBar.element, 'keyup', this.keyUpQT, this);
         }
     }
     renderInlineQuickToolbar() {
@@ -5680,6 +5700,7 @@ class QuickToolbar {
             this.inlineQTBar = this.createQTBar('Inline', 'MultiRow', this.parent.toolbarSettings.items, RenderType.InlineToolbar);
             this.renderFactory.addRenderer(RenderType.InlineToolbar, this.inlineQTBar);
             EventHandler.add(this.inlineQTBar.element, 'mousedown', this.onMouseDown, this);
+            EventHandler.add(this.inlineQTBar.element, 'keyup', this.keyUpQT, this);
         }
     }
     /**
@@ -5761,7 +5782,10 @@ class QuickToolbar {
                 else {
                     const closestAnchor = closest(target, 'a');
                     target = closestAnchor ? closestAnchor : target;
-                    if (target.tagName !== 'IMG' && target.tagName !== 'A' && (!closest(target, 'td,th') || !range.collapsed)) {
+                    const startNode = this.parent.getRange().startContainer.parentElement;
+                    const endNode = this.parent.getRange().endContainer.parentElement;
+                    if ((isNullOrUndefined(closest(startNode, 'A')) || isNullOrUndefined(closest(endNode, 'A'))) && (!closest(target, 'td,th') || !range.collapsed) &&
+                        (target.tagName !== 'IMG' || this.parent.getRange().startOffset !== this.parent.getRange().endOffset)) {
                         if (this.parent.inlineMode.onSelection && range.collapsed) {
                             return;
                         }
@@ -5829,22 +5853,27 @@ class QuickToolbar {
     destroy() {
         if (this.linkQTBar) {
             EventHandler.remove(this.linkQTBar.element, 'mousedown', this.onMouseDown);
+            EventHandler.remove(this.linkQTBar.element, 'keyup', this.keyUpQT);
             this.linkQTBar.destroy();
         }
         if (this.textQTBar) {
             EventHandler.remove(this.textQTBar.element, 'mousedown', this.onMouseDown);
+            EventHandler.remove(this.textQTBar.element, 'keyup', this.keyUpQT);
             this.textQTBar.destroy();
         }
         if (this.imageQTBar) {
             EventHandler.remove(this.imageQTBar.element, 'mousedown', this.onMouseDown);
+            EventHandler.remove(this.imageQTBar.element, 'keyup', this.keyUpQT);
             this.imageQTBar.destroy();
         }
         if (this.tableQTBar) {
             EventHandler.remove(this.tableQTBar.element, 'mousedown', this.onMouseDown);
+            EventHandler.remove(this.tableQTBar.element, 'keyup', this.keyUpQT);
             this.tableQTBar.destroy();
         }
         if (this.inlineQTBar) {
             EventHandler.remove(this.inlineQTBar.element, 'mousedown', this.onMouseDown);
+            EventHandler.remove(this.inlineQTBar.element, 'keyup', this.keyUpQT);
             if (isIDevice()) {
                 EventHandler.remove(document, 'selectionchange', this.selectionChangeHandler);
             }
@@ -6824,7 +6853,7 @@ class Formatter {
             || ((args.item.subCommand === 'FontName' || args.item.subCommand === 'FontSize') && args.name === 'dropDownSelect')
             || ((args.item.subCommand === 'BackgroundColor' || args.item.subCommand === 'FontColor')
                 && args.name === 'colorPickerChanged'))) {
-            extend(args, args, { requestType: args.item.subCommand, cancel: false, itemCollection: value }, true);
+            extend(args, args, { requestType: args.item.subCommand, cancel: false, itemCollection: value, selectType: args.name }, true);
             self.trigger(actionBegin, args, (actionBeginArgs) => {
                 if (!actionBeginArgs.cancel) {
                     if (this.getUndoRedoStack().length === 0 && actionBeginArgs.item.command !== 'Links'
@@ -6842,8 +6871,8 @@ class Formatter {
                     }
                     else {
                         this.editorManager.observer.notify(checkUndo, { subCommand: actionBeginArgs.item.subCommand });
-                        this.editorManager.execCommand(actionBeginArgs.item.command, actionBeginArgs.item.subCommand, event, this.onSuccess.bind(this, self), actionBeginArgs.item.value, actionBeginArgs.item.subCommand === 'Pre' && args.name === 'dropDownSelect' ?
-                            { name: args.name } : value, ('#' + self.getID() + ' iframe'), self.enterKey);
+                        this.editorManager.execCommand(actionBeginArgs.item.command, actionBeginArgs.item.subCommand, event, this.onSuccess.bind(this, self), actionBeginArgs.item.value, actionBeginArgs.item.subCommand === 'Pre' && actionBeginArgs.selectType === 'dropDownSelect' ?
+                            { name: actionBeginArgs.selectType } : value, ('#' + self.getID() + ' iframe'), self.enterKey);
                     }
                 }
             });
@@ -9314,7 +9343,8 @@ class NodeSelection {
             || range.startContainer;
         const endNode = range.endContainer.childNodes[(range.endOffset > 0) ? (range.endOffset - 1) : range.endOffset]
             || range.endContainer;
-        if (startNode === endNode && startNode.childNodes.length === 0) {
+        if ((startNode === endNode || (startNode.nodeName === 'BR' && startNode === range.endContainer.childNodes[range.endOffset])) &&
+            startNode.childNodes.length === 0) {
             return [startNode];
         }
         if (range.startOffset === range.endOffset && range.startOffset !== 0 && range.startContainer.nodeName === 'PRE') {
@@ -12168,7 +12198,17 @@ class InsertHtml {
                 tempSpan.parentNode.replaceChild(node, tempSpan);
             }
             else {
-                const splitedElm = nodeCutter.GetSpliceNode(range, blockNode);
+                let currentNode = nodes[nodes.length - 1];
+                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 {
+                    splitedElm = nodeCutter.GetSpliceNode(range, blockNode);
+                }
                 splitedElm.parentNode.replaceChild(node, splitedElm);
             }
         }
@@ -14415,7 +14455,24 @@ class SelectionCommands {
                     }
                 }
             }
-            InsertMethods.unwrap(cursorFormat);
+            if ((['fontcolor', 'fontname', 'fontsize', 'backgroundcolor'].indexOf(format) > -1)) {
+                if (format === 'fontcolor') {
+                    cursorFormat.style.color = value;
+                }
+                else if (format === 'fontname') {
+                    cursorFormat.style.fontFamily = value;
+                }
+                else if (format === 'fontsize') {
+                    cursorFormat.style.fontSize = value;
+                }
+                else {
+                    cursorFormat.style.backgroundColor = value;
+                }
+                cursorNode = cursorFormat;
+            }
+            else {
+                InsertMethods.unwrap(cursorFormat);
+            }
         }
         else {
             if (cursorNodes.length > 1 && range.startOffset > 0 && (cursorNodes[0].firstElementChild &&
@@ -16692,98 +16749,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
@@ -19376,7 +19433,8 @@ class Link {
             this.contentModule = this.rendererFactory.getRenderer(RenderType.Content);
             const isPopupOpen = this.quickToolObj.linkQTBar.element.classList.contains('e-rte-pop');
             if (target.nodeName === 'A' && (target.childNodes.length > 0 && target.childNodes[0].nodeName !== 'IMG') &&
-                e.args.target.nodeName !== 'IMG') {
+                e.args.target.nodeName !== 'IMG' &&
+                !isNullOrUndefined(closest(this.parent.getRange().startContainer.parentElement, 'A')) && !isNullOrUndefined(closest(this.parent.getRange().endContainer.parentElement, 'A'))) {
                 if (isPopupOpen) {
                     return;
                 }
@@ -20551,7 +20609,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) {
+            if (target.nodeName === 'IMG' && this.parent.quickToolbarModule && this.parent.getRange().startOffset === this.parent.getRange().endOffset) {
                 if (isPopupOpen) {
                     return;
                 }
@@ -20788,13 +20846,34 @@ class Image {
         }
     }
     imageRemovePost(src) {
+        const proxy = this;
+        let absoluteUrl = '';
+        if (src.indexOf('http://') > -1 || src.indexOf('https://') > -1) {
+            absoluteUrl = src;
+        }
+        else {
+            absoluteUrl = new URL(src, document.baseURI).href;
+        }
+        this.removingImgName = absoluteUrl.replace(/^.*[\\\/]/, '');
+        const xhr = new XMLHttpRequest();
+        xhr.addEventListener("readystatechange", function () {
+            if (this.readyState == 4 && this.status == 200) {
+                proxy.triggerPost(this.response);
+            }
+        });
+        xhr.open('GET', absoluteUrl);
+        xhr.responseType = 'blob';
+        xhr.send();
+    }
+    triggerPost(response) {
         const removeUrl = this.parent.insertImageSettings.removeUrl;
         if (isNullOrUndefined(removeUrl) || removeUrl === '') {
             return;
         }
+        const file = new File([response], this.removingImgName);
         const ajax = new Ajax(removeUrl, 'POST', true, null);
         const formData = new FormData();
-        formData.append(name, src);
+        formData.append('UploadFiles', file);
         ajax.send(formData);
     }
     caption(e) {
@@ -22538,7 +22617,9 @@ class Table {
             }
             const range = this.parent.formatter.editorManager.nodeSelection.getRange(this.contentModule.getDocument());
             const closestTable = closest(target, 'table');
-            if (target && target.nodeName !== 'A' && target.nodeName !== 'IMG' && (target.nodeName === 'TD' || target.nodeName === 'TH' ||
+            const startNode = this.parent.getRange().startContainer.parentElement;
+            const endNode = this.parent.getRange().endContainer.parentElement;
+            if (target && target.nodeName !== 'A' && target.nodeName !== 'IMG' && startNode === endNode && (target.nodeName === 'TD' || target.nodeName === 'TH' ||
                 target.nodeName === 'TABLE' || (closestTable && this.parent.contentModule.getEditPanel().contains(closestTable)))
                 && !(range.startContainer.nodeType === 3 && !range.collapsed)) {
                 const range = this.parent.formatter.editorManager.nodeSelection.getRange(this.contentModule.getDocument());
@@ -22625,7 +22706,6 @@ class Table {
             tdNode : target;
         removeClass(this.contentModule.getEditPanel().querySelectorAll('table td, table th'), CLS_TABLE_SEL);
         if (target && (target.tagName === 'TD' || target.tagName === 'TH')) {
-            target.removeAttribute('class');
             addClass([target], CLS_TABLE_SEL);
             this.activeCell = target;
             this.curTable = (this.curTable) ? this.curTable : closest(target, 'table');
@@ -23601,12 +23681,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.
  */
@@ -23895,12 +23975,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.
  */
@@ -23927,12 +24007,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.
  */
@@ -24073,6 +24153,7 @@ class EnterKeyAction {
                                         detach(nearBlockNode);
                                     }
                                 }
+                                this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), insertElem.nextElementSibling, 0);
                             }
                             else if (nearBlockNode.textContent.length === 0 && !(!isNullOrUndefined(nearBlockNode.childNodes[0]) && nearBlockNode.childNodes[0].nodeName === 'IMG')) {
                                 if (!isNullOrUndefined(nearBlockNode.children[0]) && nearBlockNode.children[0].tagName !== 'BR') {
@@ -24219,12 +24300,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
@@ -25594,8 +25675,7 @@ let RichTextEditor = class RichTextEditor extends Component {
                 this.setProperties({ value: this.valueTemplate });
             }
             else {
-                const compiledString = compile(this.valueTemplate);
-                const compiledTemplate = compiledString({});
+                const compiledTemplate = compile(this.valueTemplate)('', this, 'valueTemplate');
                 for (let i = 0; i < compiledTemplate.length; i++) {
                     const item = compiledTemplate[i];
                     append([item], this.element);