@syncfusion/ej2-richtexteditor 19.3.43 → 19.3.47

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 19.3.43
+*  version : 19.3.47
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-richtexteditor@*",
-  "_id": "@syncfusion/ej2-richtexteditor@18.56.3",
+  "_id": "@syncfusion/ej2-richtexteditor@19.3.46",
   "_inBundle": false,
-  "_integrity": "sha512-A4SCmlOjvTVUxWapX9kGMVSNNLBAtftqknMvjF8zGq6hZL43VGLW2UpoMJqfWIw84dVOhEsuMuyl0Jpvt+8k4Q==",
+  "_integrity": "sha512-KQjXb4GwcPJNBiezc3uprAR1P3Z0O2zn0ponoX5Y6KdSgN06/h83YeBbgoOVjQTVtK2ni97KMliyopHBJ8IsFQ==",
   "_location": "/@syncfusion/ej2-richtexteditor",
   "_phantomChildren": {},
   "_requested": {
@@ -26,8 +26,8 @@
     "/@syncfusion/ej2-react-richtexteditor",
     "/@syncfusion/ej2-vue-richtexteditor"
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-18.56.3.tgz",
-  "_shasum": "826e64146698b4573f40bc66de6a6b253b2e3272",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-19.3.46.tgz",
+  "_shasum": "ce6564f5c1887ff8ddd139f2fbbf40ccbacb99fe",
   "_spec": "@syncfusion/ej2-richtexteditor@*",
   "_where": "/jenkins/workspace/automation_release_19.1.0.1-ZPMUBNQ6AUYH6YGEFBPVYMEQLRRW2SLD4XCZ6GATNZJFYJ3RIAOA/packages/included",
   "author": {
@@ -38,13 +38,13 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~19.3.43",
-    "@syncfusion/ej2-buttons": "~19.3.43",
-    "@syncfusion/ej2-filemanager": "~19.3.43",
-    "@syncfusion/ej2-inputs": "~19.3.43",
-    "@syncfusion/ej2-navigations": "~19.3.43",
-    "@syncfusion/ej2-popups": "~19.3.43",
-    "@syncfusion/ej2-splitbuttons": "~19.3.43"
+    "@syncfusion/ej2-base": "~19.3.47",
+    "@syncfusion/ej2-buttons": "~19.3.44",
+    "@syncfusion/ej2-filemanager": "~19.3.44",
+    "@syncfusion/ej2-inputs": "~19.3.47",
+    "@syncfusion/ej2-navigations": "~19.3.46",
+    "@syncfusion/ej2-popups": "~19.3.47",
+    "@syncfusion/ej2-splitbuttons": "~19.3.47"
   },
   "deprecated": false,
   "description": "Essential JS 2 RichTextEditor component",
@@ -70,6 +70,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "19.3.43",
+  "version": "19.3.47",
   "sideEffects": false
 }

package/src/common/constant.d.ts

@@ -68,14 +68,14 @@ export declare const MS_WORD_CLEANUP_PLUGIN: string;
  */
 export declare const MS_WORD_CLEANUP: string;
 /**
-* ActionBegin event callback
-*
-* @hidden
-*/
+ * ActionBegin event callback
+ *
+ * @hidden
+ */
 export declare const ON_BEGIN: string;
 /**
-* Callback for spacelist action
-*
-* @hidden
-*/
+ * Callback for spacelist action
+ *
+ * @hidden
+ */
 export declare const SPACE_ACTION: string;

package/src/common/constant.js

@@ -68,14 +68,14 @@ export var MS_WORD_CLEANUP_PLUGIN = 'ms_word_cleanup_plugin';
  */
 export var MS_WORD_CLEANUP = 'ms_word_cleanup';
 /**
-* ActionBegin event callback
-*
-* @hidden
-*/
+ * ActionBegin event callback
+ *
+ * @hidden
+ */
 export var ON_BEGIN = 'onBegin';
 /**
-* Callback for spacelist action
-*
-* @hidden
-*/
+ * Callback for spacelist action
+ *
+ * @hidden
+ */
 export var SPACE_ACTION = 'actionBegin';

package/src/editor-manager/base/editor-manager.js

@@ -93,7 +93,7 @@ var EditorManager = /** @class */ (function () {
      */
     /* eslint-enable */
     EditorManager.prototype.execCommand = function (command, value, event, callBack, text, exeValue, selector, enterAction) {
-        switch (command.toLocaleLowerCase()) {
+        switch (command.toLowerCase()) {
             case 'lists':
                 this.observer.notify(EVENTS.LIST_TYPE, { subCommand: value, event: event, callBack: callBack,
                     selector: selector, item: exeValue, enterAction: enterAction });

package/src/editor-manager/plugin/clearformat.d.ts

@@ -10,6 +10,7 @@ export declare class ClearFormat {
      *
      * @param {Document} docElement - specifies the document element.
      * @param {Node} endNode - specifies the end node
+     * @param {string} enterAction - specifies the enter key action
      * @param {string} selector - specifies the string value
      * @returns {void}
      * @hidden

package/src/editor-manager/plugin/clearformat.js

@@ -16,6 +16,7 @@ var ClearFormat = /** @class */ (function () {
      *
      * @param {Document} docElement - specifies the document element.
      * @param {Node} endNode - specifies the end node
+     * @param {string} enterAction - specifies the enter key action
      * @param {string} selector - specifies the string value
      * @returns {void}
      * @hidden

package/src/editor-manager/plugin/image.js

@@ -32,7 +32,7 @@ var ImageCommand = /** @class */ (function () {
 
      */
     ImageCommand.prototype.imageCommand = function (e) {
-        switch (e.value.toString().toLocaleLowerCase()) {
+        switch (e.value.toString().toLowerCase()) {
             case 'image':
             case 'replace':
                 this.createImage(e);
@@ -109,21 +109,8 @@ var ImageCommand = /** @class */ (function () {
             var selectedNode = this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)[0];
             var imgElm_1 = (e.value === 'Replace' || isReplaced) ? e.item.selectParent[0] :
                 (Browser.isIE ? selectedNode.previousSibling : selectedNode.previousElementSibling);
-            var preventLoadCall_1 = false;
             imgElm_1.addEventListener('load', function () {
-                if (e.value === 'Replace' || isReplaced) {
-                    if (!preventLoadCall_1) {
-                        e.callBack({
-                            requestType: 'Images',
-                            editorMode: 'HTML',
-                            event: e.event,
-                            range: _this.parent.nodeSelection.getRange(_this.parent.currentDocument),
-                            elements: [imgElm_1]
-                        });
-                        preventLoadCall_1 = true;
-                    }
-                }
-                else {
+                if (e.value !== 'Replace' || !isReplaced) {
                     e.callBack({
                         requestType: 'Images',
                         editorMode: 'HTML',
@@ -253,10 +240,18 @@ var ImageCommand = /** @class */ (function () {
         var selectNode = e.item.selectNode[0];
         selectNode.style.height = '';
         selectNode.style.width = '';
-        e.item.width !== 'auto' ? selectNode.style.width = formatUnit(e.item.width) :
+        if (e.item.width !== 'auto') {
+            selectNode.style.width = formatUnit(e.item.width);
+        }
+        else {
             selectNode.removeAttribute('width');
-        e.item.height !== 'auto' ? selectNode.style.height = formatUnit(e.item.height) :
+        }
+        if (e.item.height !== 'auto') {
+            selectNode.style.height = formatUnit(e.item.height);
+        }
+        else {
             selectNode.removeAttribute('height');
+        }
         this.callBack(e);
     };
     ImageCommand.prototype.imageCaption = function (e) {

package/src/editor-manager/plugin/inserthtml.js

@@ -34,6 +34,11 @@ var InsertHtml = /** @class */ (function () {
         var nodeSelection = new NodeSelection();
         var nodeCutter = new NodeCutter();
         var range = nodeSelection.getRange(docElement);
+        if (range.startContainer === editNode && range.startContainer === range.endContainer && range.startOffset === 0 &&
+            range.startOffset === range.endOffset && editNode.textContent.length === 0 && editNode.children[0].tagName === 'P') {
+            nodeSelection.setSelectionText(docElement, range.startContainer.children[0], range.startContainer.children[0], 0, 0);
+            range = nodeSelection.getRange(docElement);
+        }
         var isCursor = range.startOffset === range.endOffset && range.startOffset === 0 &&
             range.startContainer === range.endContainer;
         var isCollapsed = range.collapsed;
@@ -345,15 +350,20 @@ var InsertHtml = /** @class */ (function () {
                 blockNode = range.endContainer;
                 range.setEnd(blockNode, range.endContainer.textContent.length);
             }
-            if (!isNOU(blockNode) && editNode === blockNode &&
-                range.startContainer === editNode && range.endContainer === editNode) {
-                blockNode = editNode.firstElementChild;
-                range.setStart(editNode.firstElementChild, editNode.firstElementChild.textContent.length);
-                range.setEnd(editNode.firstElementChild, editNode.firstElementChild.textContent.length);
-            }
             if (blockNode.nodeName === 'BODY' && range.startContainer === range.endContainer && range.startContainer.nodeType === 1) {
                 blockNode = range.startContainer;
             }
+            if (blockNode.closest('LI') && node && node.firstElementChild &&
+                ((node).firstElementChild.tagName === 'OL' || node.firstElementChild.tagName === 'UL')) {
+                var liNode = void 0;
+                while (node.firstElementChild.lastElementChild && node.firstElementChild.lastElementChild.tagName === 'LI') {
+                    liNode = node.firstElementChild.lastElementChild;
+                    liNode.style.removeProperty('margin-left');
+                    liNode.style.removeProperty('margin-top');
+                    liNode.style.removeProperty('margin-bottom');
+                    node.firstElementChild.insertAdjacentElement('afterend', liNode);
+                }
+            }
             if (blockNode.nodeName === 'TD' || blockNode.nodeName === 'TH') {
                 var tempSpan = createElement('span', { className: 'tempSpan' });
                 range.insertNode(tempSpan);

package/src/editor-manager/plugin/lists.js

@@ -83,7 +83,6 @@ var Lists = /** @class */ (function () {
             }
         }
     };
-    // eslint-disable-next-line
     Lists.prototype.enterList = function (e) {
         var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
         var startNode = range.startContainer.nodeName === 'LI' ? range.startContainer :

package/src/editor-manager/plugin/ms-word-clean-up.js

@@ -113,6 +113,7 @@ var MsWordPaste = /** @class */ (function () {
         var imgSrc = [];
         var base64Src = [];
         var imgName = [];
+        // eslint-disable-next-line
         var linkRegex = new RegExp(/([^\S]|^)(((https?\:\/\/)|(www\.))(\S+))/gi);
         if (imgElem.length > 0) {
             for (var i = 0; i < imgElem.length; i++) {

package/src/editor-manager/plugin/selection-commands.d.ts

@@ -6,6 +6,7 @@ export declare class SelectionCommands {
      * @param {Document} docElement - specifies the document
      * @param {string} format - specifies the string value
      * @param {Node} endNode - specifies the end node
+     * @param {string} enterAction - specifies the enter key action
      * @param {string} value - specifies the string value
      * @param {string} selector - specifies the string
      * @returns {void}

package/src/editor-manager/plugin/selection-commands.js

@@ -17,6 +17,7 @@ var SelectionCommands = /** @class */ (function () {
      * @param {Document} docElement - specifies the document
      * @param {string} format - specifies the string value
      * @param {Node} endNode - specifies the end node
+     * @param {string} enterAction - specifies the enter key action
      * @param {string} value - specifies the string value
      * @param {string} selector - specifies the string
      * @returns {void}
@@ -31,7 +32,6 @@ var SelectionCommands = /** @class */ (function () {
             if (format === 'backgroundcolor' && value === '') {
                 value = 'transparent';
             }
-            var preventRestore = false;
             var domSelection = new NodeSelection();
             var domNode = new DOMNode(endNode, docElement);
             var nodeCutter = new NodeCutter();
@@ -43,6 +43,7 @@ var SelectionCommands = /** @class */ (function () {
             var isCollapsed = false;
             var isFormat = false;
             var isCursor = false;
+            var preventRestore = false;
             var isFontStyle = (['fontcolor', 'fontname', 'fontsize', 'backgroundcolor'].indexOf(format) > -1);
             if (range.collapsed) {
                 if (nodes.length > 0) {
@@ -66,6 +67,9 @@ var SelectionCommands = /** @class */ (function () {
                     else {
                         domSelection.endOffset = domSelection.startOffset = 1;
                     }
+                    if (cursorNode.nodeName === 'BR' && cursorNode.parentNode.textContent.length === 0) {
+                        preventRestore = true;
+                    }
                 }
             }
             isCursor = range.collapsed;
@@ -113,7 +117,53 @@ var SelectionCommands = /** @class */ (function () {
         var cursorNode = null;
         if (cursorFormat) {
             cursorNode = cursorNodes[0];
-            InsertMethods.unwrap(cursorFormat);
+            if (cursorFormat.firstChild.textContent.charCodeAt(0) === 8203) {
+                var isCursorEqual = false;
+                var regEx = new RegExp(String.fromCharCode(8203), 'g');
+                var emptySpaceNode = void 0;
+                if (cursorFormat.firstChild === cursorNode) {
+                    cursorNode.textContent = cursorNode.textContent.replace(regEx, '');
+                    emptySpaceNode = cursorNode;
+                    isCursorEqual = true;
+                }
+                else {
+                    cursorFormat.firstChild.textContent = cursorFormat.firstChild.textContent.replace(regEx, '');
+                    emptySpaceNode = cursorFormat.firstChild;
+                }
+                var pointer = void 0;
+                if (emptySpaceNode.textContent.length === 0) {
+                    if (!isNOU(emptySpaceNode.previousSibling)) {
+                        cursorNode = emptySpaceNode.previousSibling;
+                        pointer = emptySpaceNode.textContent.length - 1;
+                        domSelection.setCursorPoint(docElement, emptySpaceNode, pointer);
+                    }
+                    else if (!isNOU(emptySpaceNode.parentElement) && emptySpaceNode.parentElement.textContent.length === 0) {
+                        var brElem = document.createElement('BR');
+                        emptySpaceNode.parentElement.appendChild(brElem);
+                        detach(emptySpaceNode);
+                        cursorNode = brElem;
+                        domSelection.setCursorPoint(docElement, cursorNode.parentElement, 0);
+                    }
+                }
+            }
+            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 &&

package/src/editor-manager/plugin/table.js

@@ -223,7 +223,7 @@ var TableCommand = /** @class */ (function () {
         var currentTabElm = closest(curRow, 'table');
         var thTdElm = closest(curRow, 'table').querySelectorAll('th,td');
         for (var i = 0; i < thTdElm.length; i++) {
-            thTdElm[i].dataset.oldWidth = (thTdElm[i].offsetWidth / currentTabElm.offsetWidth * 100) + "%";
+            thTdElm[i].dataset.oldWidth = (thTdElm[i].offsetWidth / currentTabElm.offsetWidth * 100) + '%';
         }
         for (var i = 0; i < allRows.length; i++) {
             curCell = allRows[i].querySelectorAll(':scope > td, :scope > th')[colIndex];
@@ -236,11 +236,11 @@ var TableCommand = /** @class */ (function () {
             // eslint-disable-next-line
             (e.item.subCommand === 'InsertColumnLeft') ? curCell.parentElement.insertBefore(colTemplate, curCell) :
                 this.insertAfter(colTemplate, curCell);
-            colTemplate.style.width = currentWidth.toFixed(4) + "%";
+            colTemplate.style.width = currentWidth.toFixed(4) + '%';
             delete colTemplate.dataset.oldWidth;
         }
         for (var i = 0; i < thTdElm.length; i++) {
-            thTdElm[i].style.width = (Number(thTdElm[i].dataset.oldWidth.split('%')[0]) * currentWidth / previousWidth).toFixed(4) + "%";
+            thTdElm[i].style.width = (Number(thTdElm[i].dataset.oldWidth.split('%')[0]) * currentWidth / previousWidth).toFixed(4) + '%';
             delete thTdElm[i].dataset.oldWidth;
         }
         e.item.selection.setSelectionText(this.parent.currentDocument, selectedCell, selectedCell, 0, 0);

package/src/editor-manager/plugin/toolbar-status.js

@@ -35,8 +35,8 @@ var ToolbarStatus = /** @class */ (function () {
         var range = nodeSelection.getRange(docElement);
         for (var index = 0; index < nodes.length; index++) {
             while (nodes[index].nodeType === 3 && range.startContainer.nodeType === 3 && nodes[index].parentNode &&
-                nodes[index].parentNode.lastElementChild && nodes[index].parentNode.lastElementChild.nodeName !== "BR" &&
-                this.getImmediateBlockNode(nodes[index].parentNode, targetNode).textContent.replace(/\u200B/g, '').length === 0 &&
+                nodes[index].parentNode.lastElementChild && nodes[index].parentNode.lastElementChild.nodeName !== 'BR' &&
+                (this.getImmediateBlockNode(nodes[index].parentNode)).textContent.replace(/\u200B/g, '').length === 0 &&
                 range.startContainer.textContent.replace(/\u200B/g, '').length === 0 &&
                 nodeSelection.get(docElement).toString().replace(/\u200B/g, '').length === 0) {
                 nodes[index] = nodes[index].parentNode.lastElementChild.firstChild;
@@ -112,7 +112,7 @@ var ToolbarStatus = /** @class */ (function () {
         }
         return nodeCollection;
     };
-    ToolbarStatus.getImmediateBlockNode = function (node, editNode) {
+    ToolbarStatus.getImmediateBlockNode = function (node) {
         do {
             node = node.parentNode;
         } while (node && CONSTANT.BLOCK_TAGS.indexOf(node.nodeName.toLocaleLowerCase()) < 0);

package/src/rich-text-editor/actions/enter-key.js

@@ -69,9 +69,7 @@ var EnterKeyAction = /** @class */ (function () {
                                     }
                                     else if (focusElem.textContent.length === 0) {
                                         var currentFocusElem = focusElem.previousSibling.lastChild;
-                                        var finalFocusElem = void 0;
                                         while (currentFocusElem.nodeName !== '#text') {
-                                            finalFocusElem = currentFocusElem;
                                             currentFocusElem = currentFocusElem.lastChild;
                                         }
                                         _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), currentFocusElem, currentFocusElem.textContent.length);
@@ -86,9 +84,9 @@ var EnterKeyAction = /** @class */ (function () {
                                 _this.getRangeNode();
                             }
                         }
-                        if (_this.range.startContainer === _this.range.endContainer && _this.range.startOffset === 0 &&
-                            _this.range.startOffset == _this.range.endOffset && _this.range.startContainer === _this.parent.inputElement) {
-                            _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), _this.range.startContainer.childNodes[_this.range.startOffset], _this.range.startOffset);
+                        if (_this.range.startContainer === _this.range.endContainer &&
+                            _this.range.startOffset === _this.range.endOffset && _this.range.startContainer === _this.parent.inputElement) {
+                            _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' ||
@@ -164,7 +162,7 @@ var EnterKeyAction = /** @class */ (function () {
                                     }
                                     _this.parent.formatter.editorManager.domNode.insertAfter(insertElm, newElem);
                                     detach(newElem);
-                                    _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), insertElm, insertElm.textContent.length >= 0 ? 0 : 1);
+                                    _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();
@@ -204,18 +202,14 @@ var EnterKeyAction = /** @class */ (function () {
                                 }
                                 else {
                                     var newElem = void 0;
-                                    var focusElem = void 0;
                                     var outerBRElem = _this.parent.createElement('br');
                                     if (_this.range.startOffset === 0 && _this.range.endOffset === 0 &&
                                         !isNOU(currentParent.previousSibling) && currentParent.previousSibling.nodeName === 'BR') {
-                                        focusElem = _this.range.startContainer;
                                         newElem = _this.parent.formatter.editorManager.nodeCutter.SplitNode(_this.range, currentParent, false).cloneNode(true);
                                         _this.parent.formatter.editorManager.domNode.insertAfter(outerBRElem, currentParent);
                                         _this.insertFocusContent();
                                         var currentFocusElem = outerBRElem.nextSibling;
-                                        var finalFocusElem = void 0;
                                         while (!isNOU(currentFocusElem) && currentFocusElem.nodeName !== '#text') {
-                                            finalFocusElem = currentFocusElem;
                                             currentFocusElem = currentFocusElem.lastChild;
                                         }
                                         _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), currentFocusElem, 0);
@@ -253,12 +247,6 @@ var EnterKeyAction = /** @class */ (function () {
                             }
                             e.args.preventDefault();
                         }
-                        if (_this.range.startContainer.nodeName === '#text') {
-                            _this.range.startContainer.parentElement.scrollIntoView(false);
-                        }
-                        else {
-                            _this.range.startContainer.scrollIntoView(false);
-                        }
                         _this.parent.trigger(events.actionComplete, { requestType: shiftKey_1 ? 'ShiftEnterAction' : 'EnterAction', args: e.args });
                     }
                 });

package/src/rich-text-editor/actions/html-editor.d.ts

@@ -41,6 +41,7 @@ export declare class HtmlEditor {
     private updateReadOnly;
     private onSelectionSave;
     private onSelectionRestore;
+    private onKeyUp;
     private onKeyDown;
     private isOrderedList;
     private isUnOrderedList;

package/src/rich-text-editor/actions/html-editor.js

@@ -56,6 +56,7 @@ var HtmlEditor = /** @class */ (function () {
         this.parent.on(events.initialLoad, this.instantiateRenderer, this);
         this.parent.on(events.htmlToolbarClick, this.onToolbarClick, this);
         this.parent.on(events.keyDown, this.onKeyDown, this);
+        this.parent.on(events.keyUp, this.onKeyUp, this);
         this.parent.on(events.renderColorPicker, this.renderColorPicker, this);
         this.parent.on(events.initialEnd, this.render, this);
         this.parent.on(events.modelChanged, this.onPropertyChanged, this);
@@ -90,6 +91,30 @@ var HtmlEditor = /** @class */ (function () {
             this.saveSelection.restore();
         }
     };
+    HtmlEditor.prototype.onKeyUp = function (e) {
+        var args = e.args;
+        var restrictKeys = [8, 9, 13, 16, 17, 18, 20, 27, 37, 38, 39, 40, 44, 45, 46, 91,
+            112, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123];
+        var range = this.parent.getRange();
+        var regEx = new RegExp(String.fromCharCode(8203), 'g');
+        var pointer;
+        if (restrictKeys.indexOf(args.keyCode) < 0 && !args.shiftKey && !args.ctrlKey && !args.altKey) {
+            if (range.startContainer.textContent.charCodeAt(0) === 8203) {
+                pointer = range.startOffset - 1;
+                range.startContainer.textContent = range.startContainer.textContent.replace(regEx, '');
+                this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), range.startContainer, pointer);
+            }
+            if (!isNOU(range.startContainer.previousSibling) && !isNOU(range.startContainer.previousSibling.parentElement) &&
+                range.startContainer.parentElement === range.startContainer.previousSibling.parentElement && range.startContainer.previousSibling.textContent.charCodeAt(0) === 8203) {
+                range.startContainer.previousSibling.textContent = range.startContainer.previousSibling.textContent.replace(regEx, '');
+            }
+            if (range.endContainer.textContent.charCodeAt(range.endOffset) === 8203) {
+                pointer = range.startOffset;
+                range.endContainer.textContent = range.endContainer.textContent.replace(regEx, '');
+                this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), range.startContainer, pointer);
+            }
+        }
+    };
     HtmlEditor.prototype.onKeyDown = function (e) {
         var _this = this;
         var currentRange;
@@ -300,7 +325,12 @@ var HtmlEditor = /** @class */ (function () {
                         while (this.deleteOldRangeElement.firstChild) {
                             this.deleteRangeElement.appendChild(this.deleteOldRangeElement.childNodes[0]);
                         }
-                        !isLiElement ? detach(this.deleteOldRangeElement) : detach(this.deleteOldRangeElement.parentElement);
+                        if (!isLiElement) {
+                            detach(this.deleteOldRangeElement);
+                        }
+                        else {
+                            detach(this.deleteOldRangeElement.parentElement);
+                        }
                         this.deleteRangeElement.normalize();
                     }
                     else {

package/src/rich-text-editor/actions/quick-toolbar.js

@@ -1,4 +1,4 @@
-import { select, isNullOrUndefined, Browser, addClass, removeClass, EventHandler, closest } from '@syncfusion/ej2-base';
+import { select, isNullOrUndefined, Browser, addClass, removeClass, EventHandler, closest, isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';
 import { RenderType } from '../base/enum';
 import * as events from '../base/constant';
 import { pageYOffset, hasClass, isIDevice } from '../base/util';
@@ -193,7 +193,10 @@ var QuickToolbar = /** @class */ (function () {
                 else {
                     var closestAnchor = closest(target, 'a');
                     target = closestAnchor ? closestAnchor : target;
-                    if (target.tagName !== 'IMG' && target.tagName !== 'A' && (!closest(target, 'td,th') || !range.collapsed)) {
+                    var startNode = this.parent.getRange().startContainer.parentElement;
+                    var endNode = this.parent.getRange().endContainer.parentElement;
+                    if ((isNOU(closest(startNode, 'A')) || isNOU(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;
                         }

package/src/rich-text-editor/actions/xhtml-validation.d.ts

@@ -11,6 +11,7 @@ export declare class XhtmlValidation {
     private enableXhtmlValidation;
     /**
      * @param {string} currentValue - specifies the string value.
+     * @param {number} valueLength - specifies the length of the current value.
      * @returns {void}
 
      */

package/src/rich-text-editor/actions/xhtml-validation.js

@@ -29,22 +29,24 @@ var XhtmlValidation = /** @class */ (function () {
             this.ImageTags();
             this.removeTags();
             this.RemoveUnsupported();
-            this.currentElement.innerHTML = this.selfEncloseValidation(this.currentElement.innerHTML, this.currentElement.innerText === "\n" ? this.currentElement.innerText.length : this.currentElement.innerText.trim().length);
+            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);
         }
     };
     /**
      * @param {string} currentValue - specifies the string value.
+     * @param {number} valueLength - specifies the length of the current value.
      * @returns {void}
 
      */
     XhtmlValidation.prototype.selfEncloseValidation = function (currentValue, valueLength) {
         if (valueLength === 0 && currentValue.indexOf('table') < 0 && currentValue.indexOf('img') < 0) {
             var arrayValue = currentValue.split('&nbsp;');
-            arrayValue[arrayValue.length - 1] = "&#8203;" + arrayValue[arrayValue.length - 1];
+            arrayValue[arrayValue.length - 1] = '&#8203;' + arrayValue[arrayValue.length - 1];
             currentValue = arrayValue.join('');
         }
-        currentValue = currentValue.replace(/<br>/g, '<br/>').replace(/<hr>/g, '<hr/>').replace(/&nbsp;/gi, ' ').replace(/ /g, ' ');
+        currentValue = currentValue.replace(/<br>/g, '<br/>').replace(/<hr>/g, '<hr/>').replace(/ /g, ' ');
         var valueTemp;
         var valueDupe = [];
         var valueOriginal = [];

package/src/rich-text-editor/base/rich-text-editor-model.d.ts

@@ -333,11 +333,11 @@ export interface RichTextEditorModel extends ComponentModel{
 
     /**
      * Specifies tag to be inserted when enter key is pressed.
-     * 
+     *
      * - `P` - When the enter key is pressed a `p` tag will be inserted and the default value of the Rich Text Editor will be <p><br></p>.
-     * 
+     *
      * - `DIV` - When the enter key is pressed a `div` tag will be inserted instead of the default `P` tag and the default value of the Rich Text Editor will be <div><br></div>.
-     * 
+     *
      * - `BR` - When the enter key is pressed a `br` tag will be inserted instead of the default `P` tag and the default value of the Rich Text Editor will be <br>.
      *
      * @default 'P'
@@ -346,11 +346,11 @@ export interface RichTextEditorModel extends ComponentModel{
 
     /**
      * Specifies tags to be inserted when shift+enter key is pressed.
-     * 
+     *
      * - `BR` - When the shift + enter key is pressed a `br` tag will be inserted which is the default behavior.
-     * 
+     *
      * - `P` - When the shift + enter key is pressed a `p` tag will be inserted instead of the default `br` tag.
-     * 
+     *
      * - `DIV` - When the shift + enter key is pressed a `div` tag will be inserted instead of the default `br` tag.
      *
      * @default 'BR'

package/src/rich-text-editor/base/util.d.ts

@@ -125,6 +125,7 @@ export declare function toObjectLowerCase(obj: {
 export declare function getEditValue(value: string, rteObj: IRichTextEditor): string;
 /**
  * @param {string} value - specifies the value
+ * @param {IRichTextEditor} rteObj - specifies the rich text editor instance.
  * @returns {string} - returns the string
  * @hidden
  */

package/src/rich-text-editor/base/util.js

@@ -398,6 +398,7 @@ export function getEditValue(value, rteObj) {
 }
 /**
  * @param {string} value - specifies the value
+ * @param {IRichTextEditor} rteObj - specifies the rich text editor instance.
  * @returns {string} - returns the string
  * @hidden
  */

package/src/rich-text-editor/renderer/image-module.d.ts

@@ -33,6 +33,7 @@ export declare class Image {
     private changedHeightValue;
     private inputWidthValue;
     private inputHeightValue;
+    private removingImgName;
     private constructor();
     protected addEventListener(): void;
     protected removeEventListener(): void;
@@ -78,6 +79,7 @@ export declare class Image {
     private isUrl;
     private deleteImg;
     private imageRemovePost;
+    private triggerPost;
     private caption;
     private imageSize;
     private break;