@syncfusion/ej2-richtexteditor 22.2.10 → 23.1.36

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 22.2.10
+*  version : 23.1.36
 *  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@22.2.9",
+  "_id": "@syncfusion/ej2-richtexteditor@21.8.0",
   "_inBundle": false,
-  "_integrity": "sha512-78MlcIbPWFlPsrRzTGAympS5eiCqkjg3iEDSK1fX7mjNnIir8l3KqWflqkNcQtR6WiKhiuP2O4EOb3gwG1KxDA==",
+  "_integrity": "sha512-BEsWdjIVfT1nygxINHX88ZqEtXGIp/dcT/JC5PX6I9VKT+jWeMMYKneZt2xb/KfyOw/q7yDNNnBIUXEykMtk+w==",
   "_location": "/@syncfusion/ej2-richtexteditor",
   "_phantomChildren": {},
   "_requested": {
@@ -26,10 +26,10 @@
     "/@syncfusion/ej2-react-richtexteditor",
     "/@syncfusion/ej2-vue-richtexteditor"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-22.2.9.tgz",
-  "_shasum": "8e11f18edec2f7f8b6ff02469ce638d3f14c5117",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-21.8.0.tgz",
+  "_shasum": "9e2bc90fda2f3e7c4210a07c7fe34ce7d2e87ff4",
   "_spec": "@syncfusion/ej2-richtexteditor@*",
-  "_where": "/jenkins/workspace/elease-automation_release_21.1.1/packages/included",
+  "_where": "/jenkins/workspace/elease-automation_release_23.1.1/packages/included",
   "author": {
     "name": "Syncfusion Inc."
   },
@@ -38,13 +38,13 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~22.2.10",
-    "@syncfusion/ej2-buttons": "~22.2.9",
-    "@syncfusion/ej2-filemanager": "~22.2.10",
-    "@syncfusion/ej2-inputs": "~22.2.9",
-    "@syncfusion/ej2-navigations": "~22.2.8",
-    "@syncfusion/ej2-popups": "~22.2.9",
-    "@syncfusion/ej2-splitbuttons": "~22.2.8"
+    "@syncfusion/ej2-base": "~23.1.36",
+    "@syncfusion/ej2-buttons": "~23.1.36",
+    "@syncfusion/ej2-filemanager": "~23.1.36",
+    "@syncfusion/ej2-inputs": "~23.1.36",
+    "@syncfusion/ej2-navigations": "~23.1.36",
+    "@syncfusion/ej2-popups": "~23.1.36",
+    "@syncfusion/ej2-splitbuttons": "~23.1.36"
   },
   "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": "22.2.10",
+  "version": "23.1.36",
   "sideEffects": false
 }

package/src/editor-manager/plugin/dom-node.js

@@ -452,11 +452,12 @@ var DOMNode = /** @class */ (function () {
         var startTextNode;
         var endTextNode;
         if (start.textContent === '' && isNOU(end) && action !== 'tab') {
-            if (isNOU(action) && save.range.startContainer.nodeType === 1 &&
-                save.range.startContainer.querySelectorAll('audio,video,image').length === 0) {
-                start.innerHTML = '<br>';
-            }
-            else if (start.childNodes.length === 1 && start.childNodes[0].nodeName === 'BR') {
+            // To Do Apply Heading and Back space press in empty content.
+            // if (isNOU(action) && save.range.startContainer.nodeType === 1 &&
+            //     (save.range.startContainer as HTMLElement).querySelectorAll('audio,video,image').length === 0)  {
+            //     start.innerHTML = '<br>';
+            // }
+            if (start.childNodes.length === 1 && start.childNodes[0].nodeName === 'BR') {
                 start.innerHTML = '&#65279;&#65279;<br>';
             }
             else {

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

@@ -19,6 +19,7 @@ export declare class MsWordPaste {
     private removableElements;
     private listContents;
     private addEventListener;
+    private cropImageDimensions;
     private wordCleanup;
     private cleanList;
     private insertAfter;
@@ -31,6 +32,7 @@ export declare class MsWordPaste {
     private conBytesToBase64;
     private conHexStringToBytes;
     private hexConversion;
+    private extractCropValue;
     private removeClassName;
     private breakLineAddition;
     private findDetachElem;

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

@@ -45,6 +45,7 @@ var MsWordPaste = /** @class */ (function () {
             'μ', 'ν', 'ξ', 'ο', 'π', 'ρ', 'σ', 'τ', 'υ', 'φ', 'χ', 'ψ', 'ω'];
         this.removableElements = ['o:p', 'style'];
         this.listContents = [];
+        this.cropImageDimensions = [];
         this.parent = parent;
         this.addEventListener();
     }
@@ -94,7 +95,7 @@ var MsWordPaste = /** @class */ (function () {
                     }
                 }
             }
-            e.callBack(elm.innerHTML);
+            e.callBack(elm.innerHTML, this.cropImageDimensions);
         }
         else {
             e.callBack(elm.innerHTML);
@@ -162,7 +163,8 @@ var MsWordPaste = /** @class */ (function () {
                 imgElem[i].getAttribute('v:shapes').indexOf('Grafik') < 0 &&
                 imgElem[i].getAttribute('v:shapes').toLowerCase().indexOf('image') < 0 &&
                 imgElem[i].getAttribute('v:shapes').indexOf('Graphic') < 0 &&
-                imgElem[i].getAttribute('v:shapes').indexOf('_x0000_s') < 0) {
+                imgElem[i].getAttribute('v:shapes').indexOf('_x0000_s') < 0 &&
+                imgElem[i].getAttribute('v:shapes').indexOf('_x0000_i') < 0) {
                 detach(imgElem[i]);
             }
         }
@@ -179,14 +181,36 @@ var MsWordPaste = /** @class */ (function () {
             }
             var hexValue = this.hexConversion(rtfData);
             for (var i = 0; i < hexValue.length; i++) {
-                base64Src.push(this.convertToBase64(hexValue[i]));
+                base64Src.push({
+                    base64Data: !isNOU(hexValue[i].hex) ? this.convertToBase64(hexValue[i]) : null,
+                    isCroppedImage: hexValue[i].isCroppedImage
+                });
+                if (hexValue[i].isCroppedImage) {
+                    this.cropImageDimensions.push({
+                        goalWidth: hexValue[i].goalWidth,
+                        goalHeight: hexValue[i].goalHeight,
+                        cropLength: hexValue[i].cropLength,
+                        cropTop: hexValue[i].cropTop,
+                        cropR: hexValue[i].cropR,
+                        cropB: hexValue[i].cropB
+                    });
+                }
             }
             for (var i = 0; i < imgElem.length; i++) {
                 if (imgSrc[i].match(linkRegex)) {
                     imgElem[i].setAttribute('src', imgSrc[i]);
                 }
                 else {
-                    imgElem[i].setAttribute('src', base64Src[i]);
+                    if (!isNOU(base64Src[i]) && !isNOU(base64Src[i].base64Data)) {
+                        imgElem[i].setAttribute('src', base64Src[i].base64Data);
+                    }
+                    else {
+                        imgElem[i].removeAttribute('src');
+                        imgElem[i].setAttribute('alt', 'Unsupported file format');
+                    }
+                    if (!isNOU(base64Src[i]) && base64Src[i].isCroppedImage) {
+                        imgElem[i].classList.add('e-img-cropped');
+                    }
                 }
                 imgElem[i].setAttribute('id', 'msWordImg-' + imgName[i]);
             }
@@ -263,6 +287,13 @@ var MsWordPaste = /** @class */ (function () {
         var result = [];
         if (!isNOU(fullImg)) {
             for (var i = 0; i < fullImg.length; i++) {
+                var isCroppedImage = false;
+                var goalWidth = 0;
+                var goalHeight = 0;
+                var cropLength = 0;
+                var cropTop = 0;
+                var cropR = 0;
+                var cropB = 0;
                 if (picHead.test(fullImg[i])) {
                     if (fullImg[i].indexOf('\\pngblip') !== -1) {
                         imgType = 'image/png';
@@ -270,20 +301,45 @@ var MsWordPaste = /** @class */ (function () {
                     else if (fullImg[i].indexOf('\\jpegblip') !== -1) {
                         imgType = 'image/jpeg';
                     }
+                    else if (fullImg[i].indexOf('\\picprop') !== -1) {
+                        imgType = null;
+                    }
                     else {
                         continue;
                     }
+                    isCroppedImage = this.extractCropValue('cropl', fullImg[i]) > 0 &&
+                        this.extractCropValue('cropt', fullImg[i]) > 0 ? true : false;
+                    if (isCroppedImage) {
+                        goalWidth = this.extractCropValue('wgoal', fullImg[i]);
+                        goalHeight = this.extractCropValue('hgoal', fullImg[i]);
+                        cropLength = this.extractCropValue('cropl', fullImg[i]);
+                        cropTop = this.extractCropValue('cropt', fullImg[i]);
+                        cropR = this.extractCropValue('cropr', fullImg[i]);
+                        cropB = this.extractCropValue('cropb', fullImg[i]);
+                    }
                     result.push({
                         hex: imgType ? fullImg[i].replace(picHead, '').replace(/[^\da-fA-F]/g, '') : null,
-                        type: imgType
+                        type: imgType,
+                        isCroppedImage: isCroppedImage,
+                        goalWidth: goalWidth,
+                        goalHeight: goalHeight,
+                        cropLength: cropLength,
+                        cropTop: cropTop,
+                        cropR: cropR,
+                        cropB: cropB
                     });
                 }
             }
         }
         return result;
     };
+    MsWordPaste.prototype.extractCropValue = function (crop, rtfData) {
+        // eslint-disable-next-line security/detect-non-literal-regexp
+        var result = new RegExp('\\\\pic' + crop + '(\\-?\\d+)\\\\').exec(rtfData.replace('\r\n\\', '\\'))[1];
+        return parseInt(result, 10);
+    };
     MsWordPaste.prototype.removeClassName = function (elm) {
-        var elmWithClass = elm.querySelectorAll('*[class]');
+        var elmWithClass = elm.querySelectorAll('*[class]:not(.e-img-cropped)');
         for (var i = 0; i < elmWithClass.length; i++) {
             elmWithClass[i].removeAttribute('class');
         }
@@ -620,8 +676,10 @@ var MsWordPaste = /** @class */ (function () {
                         currentListStyle = listNodes[i].getAttribute('style');
                     }
                 }
-                collection.push({ listType: type, content: tempNode, nestedLevel: level, class: currentClassName,
-                    listStyle: currentListStyle, listStyleTypeName: listStyleType, start: startAttr, styleMarginLeft: styleMarginLeft });
+                collection.push({
+                    listType: type, content: tempNode, nestedLevel: level, class: currentClassName,
+                    listStyle: currentListStyle, listStyleTypeName: listStyleType, start: startAttr, styleMarginLeft: styleMarginLeft
+                });
             }
         }
         stNode = listNodes.shift();
@@ -749,8 +807,7 @@ var MsWordPaste = /** @class */ (function () {
                 }
                 else {
                     if (collection[index].nestedLevel > pLevel && isNormalList) {
-                        var initialNode = void 0;
-                        initialNode = createElement(collection[index].listType);
+                        var initialNode = createElement(collection[index].listType);
                         prevList = createElement('li');
                         initialNode.appendChild(prevList);
                         initialNode.style.listStyleType = 'none';
@@ -839,7 +896,7 @@ var MsWordPaste = /** @class */ (function () {
             if (firstChild.childNodes.length > 0) {
                 var listIgnoreTag = firstChild.querySelectorAll('[style*="mso-list"]');
                 for (var i = 0; i < listIgnoreTag.length; i++) {
-                    listIgnoreTag[i].setAttribute('style', listIgnoreTag[i].getAttribute('style').replace(/\n/g, ""));
+                    listIgnoreTag[i].setAttribute('style', listIgnoreTag[i].getAttribute('style').replace(/\n/g, ''));
                 }
                 var listOrder = firstChild.querySelector('span[style="mso-list:Ignore"]');
                 if (!isNOU(listOrder)) {

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

@@ -92,7 +92,7 @@ var TableCommand = /** @class */ (function () {
     TableCommand.prototype.calculateStyleValue = function (value) {
         var styleValue;
         if (typeof (value) === 'string') {
-            if (value.indexOf('px') || value.indexOf('%') || value.indexOf('auto')) {
+            if (value.indexOf('px') >= 0 || value.indexOf('%') >= 0 || value.indexOf('auto') >= 0) {
                 styleValue = value;
             }
             else {

package/src/rich-text-editor/actions/base-quick-toolbar.d.ts

@@ -42,11 +42,12 @@ export declare class BaseQuickToolbar {
      * @param {number} x - specifies the x value
      * @param {number} y - specifies the y value
      * @param {Element} target - specifies the element
+     * @param {string} type - specifies the type
      * @returns {void}
      * @hidden
 
      */
-    showPopup(x: number, y: number, target: Element): void;
+    showPopup(x: number, y: number, target: Element, type?: string): void;
     /**
      * hidePopup method
      *

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

@@ -42,6 +42,9 @@ var BaseQuickToolbar = /** @class */ (function () {
         else if (args.popupType === 'Inline') {
             className = classes.CLS_INLINE_POP;
         }
+        else if (args.popupType === 'Text') {
+            className = classes.CLS_TEXT_POP;
+        }
         else {
             className = '';
         }
@@ -121,7 +124,7 @@ var BaseQuickToolbar = /** @class */ (function () {
                 case 'bottom': {
                     var posY = void 0;
                     if (viewPort === 'document') {
-                        if (type === 'inline') {
+                        if (type === 'inline' || type === 'text') {
                             posY = (e.y - e.popHeight - 10);
                         }
                         else {
@@ -150,7 +153,7 @@ var BaseQuickToolbar = /** @class */ (function () {
                     break;
                 }
                 case 'right':
-                    if (type === 'inline') {
+                    if (type === 'inline' || type === 'text') {
                         x = window.pageXOffset + (e.windowWidth - (e.popWidth + e.bodyRightSpace + 10));
                     }
                     else {
@@ -158,7 +161,7 @@ var BaseQuickToolbar = /** @class */ (function () {
                     }
                     break;
                 case 'left':
-                    if (type === 'inline') {
+                    if (type === 'inline' || type === 'text') {
                         x = 0;
                     }
                     else {
@@ -177,11 +180,12 @@ var BaseQuickToolbar = /** @class */ (function () {
      * @param {number} x - specifies the x value
      * @param {number} y - specifies the y value
      * @param {Element} target - specifies the element
+     * @param {string} type - specifies the type
      * @returns {void}
      * @hidden
 
      */
-    BaseQuickToolbar.prototype.showPopup = function (x, y, target) {
+    BaseQuickToolbar.prototype.showPopup = function (x, y, target, type) {
         var _this = this;
         var eventArgs = { popup: this.popupObj, cancel: false, targetElement: target,
             positionX: x, positionY: y };
@@ -212,7 +216,7 @@ var BaseQuickToolbar = /** @class */ (function () {
                     editPanelTop = (cntEle) ? cntEle.scrollTop : 0;
                     editPanelHeight = (cntEle) ? cntEle.offsetHeight : 0;
                 }
-                if (!_this.parent.inlineMode.enable && !closest(target, 'table')) {
+                if (!_this.parent.inlineMode.enable && !closest(target, 'table') && type !== 'text') {
                     _this.parent.disableToolbarItem(_this.parent.toolbarSettings.items);
                     _this.parent.enableToolbarItem(['Undo', 'Redo']);
                 }
@@ -265,7 +269,7 @@ var BaseQuickToolbar = /** @class */ (function () {
                 if (!_this.parent.inlineMode.enable) {
                     _this.checkCollision(showPopupData, 'parent', '');
                 }
-                _this.checkCollision(showPopupData, 'document', ((_this.parent.inlineMode.enable) ? 'inline' : ''));
+                _this.checkCollision(showPopupData, 'document', ((_this.parent.inlineMode.enable) ? 'inline' : (type === 'text') ? 'text' : ''));
                 _this.popupObj.element.classList.remove('e-popup-open');
                 removeClass([_this.element], [classes.CLS_HIDE]);
                 _this.popupObj.show({ name: 'ZoomIn', duration: (Browser.isIE ? 250 : 400) });

package/src/rich-text-editor/actions/emoji-picker.js

@@ -36,7 +36,13 @@ var EmojiPicker = /** @class */ (function () {
     EmojiPicker.prototype.toolbarClick = function (args) {
         var _this = this;
         var _a, _b;
-        var spanElement = this.parent.element.querySelector('.e-emoji');
+        var spanElement;
+        if (!isNOU(this.parent.element.querySelector('.e-emoji'))) {
+            spanElement = this.parent.element.querySelector('.e-emoji');
+        }
+        else if (this.parent.inlineMode.enable) {
+            spanElement = this.parent.element.ownerDocument.querySelector('.e-emoji');
+        }
         this.divElement = spanElement.closest('div');
         var range = this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument());
         this.save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());
@@ -51,7 +57,12 @@ var EmojiPicker = /** @class */ (function () {
             this.popupObj.hide();
         }
         this.popDiv = this.parent.createElement('div', { className: 'e-rte-emojipicker-popup', id: this.parent.getID() + '_emojiPicker' });
-        this.parent.getToolbar().appendChild(this.popDiv);
+        if (!isNOU(this.parent.getToolbar()) && !this.parent.inlineMode.enable) {
+            this.parent.getToolbar().appendChild(this.popDiv);
+        }
+        else if (this.parent.inlineMode.enable) {
+            this.parent.inputElement.appendChild(this.popDiv);
+        }
         EventHandler.add(this.popDiv, 'keydown', this.onKeyDown, this);
         EventHandler.add(this.popDiv, 'keyup', this.searchFilter, this);
         var extendEle = this.parent.element.querySelector('.e-toolbar-extended');
@@ -66,13 +77,14 @@ var EmojiPicker = /** @class */ (function () {
         var target;
         var xValue;
         var yValue;
-        if (!isNOU(args.args)) {
+        if (!isNOU(args.args) && !this.parent.inlineMode.enable &&
+            isNOU(this.parent.quickToolbarSettings.text)) {
             target = args.args.originalEvent.target;
             target = target.classList.contains('e-toolbar-item') ? target.firstChild : target.parentElement;
             xValue = 'left';
             yValue = 'bottom';
         }
-        else if (isNOU(args.x) && isNOU(args.y)) {
+        else if (isNOU(args.x) && isNOU(args.y) && !this.parent.inlineMode.enable && isNOU(this.parent.quickToolbarSettings.text)) {
             target = this.parent.inputElement;
             if (window.getSelection().rangeCount > 0) {
                 var coordinates = this.getCoordinates();
@@ -80,6 +92,14 @@ var EmojiPicker = /** @class */ (function () {
                 yValue = coordinates.top;
             }
         }
+        else if (isNOU(args.x) && isNOU(args.y) && (this.parent.inlineMode.enable || !isNOU(this.parent.quickToolbarSettings.text))) {
+            this.parent.notify(events.hidePopup, {});
+            if (window.getSelection().rangeCount > 0) {
+                var coordinates = this.getCoordinates();
+                xValue = coordinates.left;
+                yValue = coordinates.top;
+            }
+        }
         else {
             target = this.parent.inputElement;
             xValue = args.x;
@@ -106,7 +126,8 @@ var EmojiPicker = /** @class */ (function () {
         addClass([this.popupObj.element], 'e-popup-open');
         this.popupObj.refreshPosition(target);
         // header search element
-        if ((!isNOU(args.args) || (isNOU(args.x) && isNOU(args.y))) && this.parent.emojiPickerSettings.showSearchBox) {
+        if ((!isNOU(args.args) || (isNOU(args.x) && isNOU(args.y))) &&
+            this.parent.emojiPickerSettings.showSearchBox) {
             var inputEle = createElement('input', { id: 'e-rte-emoji-search', className: 'e-rte-emoji-search' });
             this.popDiv.append(inputEle);
             var inputobj = new TextBox({
@@ -142,7 +163,8 @@ var EmojiPicker = /** @class */ (function () {
         this.popDiv.appendChild(emojiBtnDiv);
         var height;
         var popupBorder = window.getComputedStyle(this.popDiv);
-        if ((isNOU(args.args) && !(isNOU(args.x) && isNOU(args.y))) || !this.parent.emojiPickerSettings.showSearchBox) {
+        if ((isNOU(args.args) && !(isNOU(args.x) && isNOU(args.y))) ||
+            !this.parent.emojiPickerSettings.showSearchBox) {
             height = (this.popDiv.getBoundingClientRect().height - emojiToolBar.getBoundingClientRect().height - (2 * parseFloat(popupBorder.borderWidth))) + 'px';
             emojiBtnDiv.style.setProperty('height', height, 'important');
         }
@@ -188,13 +210,6 @@ var EmojiPicker = /** @class */ (function () {
         if (!isNOU(popup)) {
             scrollTop = Math.round(popup.scrollTop);
         }
-        for (var i = 0; i < toolbarName.length; i++) {
-            /* eslint-disable */
-            if (toolbarName[i].classList.contains('e-selected')) {
-                removeClass([toolbarName[i]], 'e-selected');
-            }
-            /* eslint-enable */
-        }
         if (scrollTop < toolbarName[0].offsetHeight) {
             addClass([toolbarName[0]], 'e-selected');
         }
@@ -649,7 +664,7 @@ var EmojiPicker = /** @class */ (function () {
         var startOffset = this.save.startOffset;
         var textContent = this.save.range.startContainer.textContent;
         var previousText = textContent.substring(startOffset, startOffset + 1);
-        // When toolbar action is clicked then only restore the range. 
+        // When toolbar action is clicked then only restore the range.
         if (!isNOU(this.clickEvent) || previousText !== ':') {
             this.save.restore();
         }

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

@@ -173,8 +173,12 @@ var EnterKeyAction = /** @class */ (function () {
                                         (_this.range.startContainer.previousSibling.nodeName === 'IMG' || _this.range.startContainer.previousSibling.nodeName === 'BR'))) {
                                     var isNearBlockLengthZero = void 0;
                                     var newElem = void 0;
-                                    if (!isNOU(_this.range.startContainer.childNodes) && _this.range.startContainer.textContent.length === 0
-                                        && (_this.range.startContainer.querySelectorAll('img, audio, video').length > 0 ||
+                                    if (!isNOU(_this.range.startContainer.childNodes) &&
+                                        (_this.range.startContainer.textContent.length === 0 ||
+                                            (_this.range.startContainer.nodeName !== '#text' && !isNOU(_this.range.startContainer.querySelector('.e-video-clickelem')) &&
+                                                _this.range.startContainer.querySelector('.e-video-clickelem').textContent.length === 0)) &&
+                                        (_this.range.startContainer.querySelectorAll('img, audio, video').length > 0 ||
+                                            !isNOU(_this.range.startContainer.querySelector('.e-video-clickelem')) ||
                                             _this.range.startContainer.nodeName === 'IMG' || _this.range.startContainer.nodeName === 'TABLE')) {
                                         newElem = _this.createInsertElement(shiftKey_1);
                                         isMediaNode = true;

package/src/rich-text-editor/actions/format-painter.js

@@ -25,6 +25,10 @@ var FormatPainter = /** @class */ (function () {
             clickargs.args.action = 'escape';
             this.actionHandler(clickargs, 'keyBoard');
         }
+        if (this.parent.quickToolbarModule && !isNOU(this.parent.quickToolbarSettings.text) &&
+            this.parent.element.ownerDocument.contains(this.parent.quickToolbarModule.textQTBar.element)) {
+            this.parent.quickToolbarModule.textQTBar.hidePopup();
+        }
     };
     FormatPainter.prototype.toolbarDoubleClick = function (args) {
         this.isActive = true;
@@ -103,12 +107,14 @@ var FormatPainter = /** @class */ (function () {
         }
     };
     FormatPainter.prototype.updateToolbarBtn = function (enable) {
-        var toolbarBtn = this.parent.element.querySelector('.e-rte-format-painter').parentElement.parentElement;
-        if (enable) {
-            addClass([toolbarBtn], 'e-active');
-        }
-        else if (!this.isSticky) {
-            removeClass([toolbarBtn], 'e-active');
+        if (!isNOU(this.parent.element.querySelector('.e-rte-format-painter'))) {
+            var toolbarBtn = this.parent.element.querySelector('.e-rte-format-painter').parentElement.parentElement;
+            if (enable) {
+                addClass([toolbarBtn], 'e-active');
+            }
+            else if (!this.isSticky) {
+                removeClass([toolbarBtn], 'e-active');
+            }
         }
     };
     FormatPainter.prototype.editAreaClick = function (args) {

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

@@ -126,11 +126,24 @@ var HtmlEditor = /** @class */ (function () {
             var currentLength = this.parent.inputElement.innerHTML.replace(regEx, '').length;
             var focusNode = range.startContainer;
             if (previousLength > currentLength && !isRootParent) {
+                if (focusNode.textContent.trim().length !== 0 && focusNode.previousSibling) {
+                    var tempSpan = document.createElement('span');
+                    tempSpan.className = 'tempSpan';
+                    range.insertNode(tempSpan);
+                }
                 var currentChild = this.parent.inputElement.firstChild;
                 while (!isNOU(currentChild) && currentChild.textContent.replace(regEx, '').trim().length > 0) {
                     currentChild.innerHTML = currentChild.innerHTML.replace(regEx, '');
                     currentChild = currentChild.nextElementSibling;
                 }
+                var tempSpanToRemove = this.parent.inputElement.querySelector('.tempSpan');
+                if (tempSpanToRemove && tempSpanToRemove.previousSibling && focusNode.textContent.trim().length !== 0) {
+                    focusNode = tempSpanToRemove.previousSibling;
+                    pointer = tempSpanToRemove.previousSibling.textContent.length;
+                    var parentElement = tempSpanToRemove.parentNode;
+                    parentElement.removeChild(tempSpanToRemove);
+                    tempSpanToRemove = null;
+                }
                 var currentChildNode = this.parent.inputElement.querySelector('.currentStartMark').childNodes;
                 if (currentChildNode.length > 1) {
                     for (var i = 0; i < currentChildNode.length; i++) {
@@ -585,7 +598,7 @@ var HtmlEditor = /** @class */ (function () {
         var item = args.item;
         var closestElement = closest(args.originalEvent.target, '.e-rte-quick-popup');
         if (item.command !== 'FormatPainter') {
-            if (closestElement && !closestElement.classList.contains('e-rte-inline-popup')) {
+            if (closestElement && !closestElement.classList.contains('e-rte-inline-popup') && !closestElement.classList.contains('e-rte-text-popup')) {
                 if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||
                     item.subCommand === 'FontColor' || item.subCommand === 'BackgroundColor')) {
                     if (isIDevice() && item.command === 'Images') {

package/src/rich-text-editor/actions/paste-clean-up.d.ts

@@ -22,6 +22,7 @@ export declare class PasteCleanup {
     private blockNode;
     private isNotFromHtml;
     private containsHtml;
+    private cropImageData;
     constructor(parent?: IRichTextEditor, serviceLocator?: ServiceLocator);
     private addEventListener;
     private destroy;
@@ -56,6 +57,7 @@ export declare class PasteCleanup {
     private destroyDialog;
     private cleanAppleClass;
     private formatting;
+    private cropImageHandler;
     private addTableClass;
     private setImageProperties;
     private addTempClass;