@syncfusion/ej2-richtexteditor 23.2.7 → 24.1.41

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

@@ -738,12 +738,17 @@ const emojiPicker = 'emojiPicker';
  * @hidden
  * @deprecated
  */
-const maximizeMinimizeClick = 'maximizeMinimizeClick';
+const destroyTooltip = 'destroyTooltip';
 /**
  * @hidden
  * @deprecated
  */
 const hidePopup = 'hidePopup';
+/**
+ * @hidden
+ * @deprecated
+ */
+const cleanupResizeElements = 'cleanupResizeElements';
 /**
  * @hidden
  * @deprecated
@@ -840,6 +845,11 @@ const CLS_FULL_SCREEN = 'e-rte-full-screen';
  * @deprecated
  */
 const CLS_QUICK_TB = 'e-rte-quick-toolbar';
+/**
+ * @hidden
+ * @deprecated
+ */
+const CLS_TEXT_QUICK_TB = 'e-rte-text-quicktoolbar';
 /**
  * @hidden
  * @deprecated
@@ -2217,7 +2227,7 @@ let windowKeys = {
     'Number Format List': 'Ctrl+Shift+O',
     'Bullet Format List': 'Ctrl+Alt+O',
     'Insert Audio': 'Ctrl+Shift+A',
-    'Insert Video': 'Ctrl+Shift+V',
+    'Insert Video': 'Ctrl+Alt+V',
     'Increase Indent': 'Ctrl+]',
     'Decrease Indent': 'Ctrl+[',
     'Decrease Fontsize': 'Ctrl+Shift+<',
@@ -2638,6 +2648,7 @@ let toolsLocale = {
     'bulletformatlist': 'bulletFormatList',
     'undo': 'undo',
     'redo': 'redo',
+    'filemanager': 'fileManager',
     'superscript': 'superscript',
     'subscript': 'subscript',
     'createlink': 'createLink',
@@ -2704,6 +2715,7 @@ let toolsLocale = {
     'emojiPickerTypeToFind': 'Type to find',
     'emojiPickerNoResultFound': 'No results found',
     'emojiPickerTrySomethingElse': 'Try something else',
+    'ImageLinkAriaLabel': 'Open in new window',
 };
 let fontNameLocale = [
     { locale: 'fontNameSegoeUI', value: 'Segoe UI' },
@@ -2999,11 +3011,11 @@ function getTBarItemsIndex(items, toolbarItems) {
                 continue;
             }
             else {
-                if (items[i] === 'OrderedList' && toolbarItems[j].subCommand === 'OL') {
+                if ((items[i] === 'OrderedList' || items[i] === 'NumberFormatList') && toolbarItems[j].subCommand === 'OL') {
                     itemsIndex.push(j);
                     break;
                 }
-                else if (items[i] === 'UnorderedList' && toolbarItems[j].subCommand === 'UL') {
+                else if ((items[i] === 'UnorderedList' || items[i] === 'BulletFormatList') && toolbarItems[j].subCommand === 'UL') {
                     itemsIndex.push(j);
                     break;
                 }
@@ -3155,6 +3167,15 @@ function updateTextNode(value, rteObj) {
             for (let i = 0; i < emptyBlockElem.length; i++) {
                 emptyBlockElem[i].innerHTML = '<br>';
             }
+            // To handle the Empty block node with \n
+            const allPNodes = tempNode.querySelectorAll('p');
+            for (let i = 0; i < allPNodes.length; i++) {
+                if (allPNodes[i].textContent.trim().length === 0 && allPNodes[i].childNodes.length === 1
+                    && allPNodes[i].childNodes[0].nodeName === '#text' &&
+                    isNullOrUndefined(allPNodes[i].childNodes[0].textContent.match(/\u00a0/g))) {
+                    allPNodes[i].innerHTML = '<br>';
+                }
+            }
             const emptyInlineElem = tempNode.querySelectorAll(inlineEmptyNodes);
             for (let i = 0; i < emptyInlineElem.length; i++) {
                 emptyInlineElem[i].innerHTML = '&ZeroWidthSpace;';
@@ -3341,21 +3362,19 @@ class ToolbarRenderer {
     }
     wireEvent() {
         this.parent.on(destroy, this.unWireEvent, this);
-        this.parent.on(maximizeMinimizeClick, this.destroyTooltip, this);
+        this.parent.on(destroyTooltip, this.destroyTooltip, this);
     }
     destroyTooltip() {
-        if (!isNullOrUndefined(document.querySelector('.e-tooltip-wrap')) && !isNullOrUndefined(document.querySelector(' [data-tooltip-id]'))) {
-            const tooltipTargetEle = this.parent.element.querySelector('[data-tooltip-id]');
+        const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
+            this.parent.contentModule.getDocument();
+        if (!isNullOrUndefined(currentDocument.querySelector('.e-tooltip-wrap')) && !isNullOrUndefined(currentDocument.querySelector('[data-tooltip-id]'))) {
+            const tooltipTargetEle = currentDocument.querySelector('[data-tooltip-id]');
             const event = new MouseEvent('mouseleave', { bubbles: true, cancelable: true });
             tooltipTargetEle.dispatchEvent(event);
         }
     }
     unWireEvent() {
         this.parent.off(destroy, this.unWireEvent);
-        if (this.popupOverlay) {
-            EventHandler.remove(this.popupOverlay, 'click touchmove', this.onPopupOverlay);
-        }
-        this.removePopupContainer();
     }
     toolbarBeforeCreate(e) {
         if (this.mode === 'Extended') {
@@ -3376,7 +3395,6 @@ class ToolbarRenderer {
     }
     dropDownSelected(args) {
         this.parent.notify(dropDownSelect, args);
-        this.onPopupOverlay();
     }
     beforeDropDownItemRender(args) {
         if (this.parent.readonly || !this.parent.enabled) {
@@ -3413,27 +3431,11 @@ class ToolbarRenderer {
                 addClass([listEle[1], listEle[2]], 'e-disabled');
             }
         }
-        if (Browser.isDevice && !args.element.parentElement.classList.contains(CLS_QUICK_DROPDOWN)) {
-            this.popupModal(args.element.parentElement);
-        }
         this.parent.notify(selectionSave, args);
     }
     dropDownClose(args) {
-        this.removePopupContainer();
         this.parent.notify(selectionRestore, args);
     }
-    removePopupContainer() {
-        if (Browser.isDevice && !isNullOrUndefined(this.popupContainer)) {
-            const popupEle = this.popupContainer.querySelector('.e-dropdown-popup.e-tbar-btn.e-control');
-            if (popupEle) {
-                this.popupContainer.parentNode.insertBefore(popupEle, this.popupContainer.nextSibling);
-                popupEle.style.removeProperty('position');
-                removeClass([popupEle], 'e-popup-modal');
-            }
-            detach(this.popupContainer);
-            this.popupContainer = undefined;
-        }
-    }
     /**
      * renderToolbar method
      *
@@ -3467,7 +3469,7 @@ class ToolbarRenderer {
                 openDelay: 400,
                 opensOn: 'Hover',
                 beforeRender: this.tooltipBeforeRender.bind(this),
-                cssClass: this.parent.cssClass,
+                cssClass: this.parent.getCssClass(),
                 windowCollision: true,
                 position: 'BottomCenter'
             });
@@ -3526,7 +3528,7 @@ class ToolbarRenderer {
                     }
                     //Alignments preselect
                     let alignEle = proxy.parent.getRange().startContainer;
-                    while (alignEle !== proxy.parent.element.querySelector('.e-content') && !isNullOrUndefined(alignEle.parentElement)) {
+                    while (alignEle !== proxy.parent.inputElement && !isNullOrUndefined(alignEle.parentElement)) {
                         if (alignEle.nodeName === '#text') {
                             alignEle = alignEle.parentElement;
                         }
@@ -3552,7 +3554,8 @@ class ToolbarRenderer {
                         alignEle = alignEle.parentElement;
                     }
                     //image preselect
-                    const imageEle = startNode.closest('img') ? startNode.closest('img') : startNode.querySelector('img');
+                    const closestNode = startNode.closest('img');
+                    const imageEle = closestNode ? closestNode : startNode.querySelector('img');
                     if (args.items[0].command === 'Images') {
                         if (!isNullOrUndefined(imageEle)) {
                             let index;
@@ -3664,39 +3667,6 @@ class ToolbarRenderer {
         };
         return dropDown;
     }
-    // eslint-disable-next-line
-    onPopupOverlay(args) {
-        if (!isNullOrUndefined(this.popupOverlay)) {
-            closest(this.popupOverlay, '.e-popup-container').style.display = 'none';
-            this.popupOverlay.style.display = 'none';
-            removeClass([this.popupOverlay], 'e-popup-overlay');
-        }
-    }
-    setIsModel(element) {
-        if (!closest(element, '.e-popup-container')) {
-            this.popupContainer = this.parent.createElement('div', {
-                className: 'e-rte-modal-popup e-popup-container e-center'
-            });
-            element.parentNode.insertBefore(this.popupContainer, element);
-            this.popupContainer.appendChild(element);
-            this.popupContainer.style.zIndex = element.style.zIndex;
-            this.popupContainer.style.display = 'flex';
-            element.style.position = 'relative';
-            addClass([element], 'e-popup-modal');
-            this.popupOverlay = this.parent.createElement('div', { className: 'e-popup-overlay' });
-            // eslint-disable-next-line
-            this.popupOverlay.style.zIndex = (parseInt(element.style.zIndex, null) - 1).toString();
-            this.popupOverlay.style.display = 'block';
-            this.popupContainer.appendChild(this.popupOverlay);
-            EventHandler.add(this.popupOverlay, 'click touchmove', this.onPopupOverlay, this);
-        }
-        else {
-            element.parentElement.style.display = 'flex';
-            this.popupOverlay = element.nextElementSibling;
-            this.popupOverlay.style.display = 'block';
-            addClass([this.popupOverlay], 'e-popup-overlay');
-        }
-    }
     paletteSelection(dropDownArgs, currentElement) {
         const ele = dropDownArgs.element.querySelector('.e-control.e-colorpicker');
         const colorbox = [].slice.call(selectAll('.e-tile', ele.parentElement));
@@ -3724,7 +3694,7 @@ class ToolbarRenderer {
         const proxy = this;
         let css = CLS_RTE_ELEMENTS + ' ' + CLS_TB_BTN + ((this.parent.inlineMode) ? (' ' + CLS_INLINE_DROPDOWN) : '');
         css += (' ' + ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_DROPDOWN : CLS_FONT_COLOR_DROPDOWN));
-        css += ' ' + this.parent.cssClass;
+        css += this.parent.getCssClass(true);
         const content = proxy.parent.createElement('span', { className: CLS_COLOR_CONTENT });
         const inlineEle = proxy.parent.createElement('span', { className: args.cssClass });
         let range;
@@ -3796,9 +3766,6 @@ class ToolbarRenderer {
                 if (focusEle) {
                     focusEle.focus();
                 }
-                if (Browser.isDevice) {
-                    this.popupModal(dropDownArgs.element.parentElement);
-                }
                 this.pickerRefresh(dropDownArgs);
             },
             beforeClose: (dropDownArgs) => {
@@ -3826,22 +3793,6 @@ class ToolbarRenderer {
             },
             close: (dropDownArgs) => {
                 proxy.parent.notify(selectionRestore, {});
-                const dropElement = closest(dropDownArgs.element.parentElement, '.e-popup-container');
-                if (dropElement) {
-                    dropElement.style.display = 'none';
-                    dropElement.lastElementChild.style.display = 'none';
-                    removeClass([dropElement.lastElementChild], 'e-popup-overlay');
-                }
-                if (Browser.isDevice && !isNullOrUndefined(dropElement)) {
-                    const popupEle = dropElement.querySelector('.e-dropdown-popup.e-tbar-btn.e-control');
-                    if (popupEle) {
-                        dropElement.parentNode.insertBefore(popupEle, dropElement.nextSibling);
-                        popupEle.style.removeProperty('position');
-                        removeClass([popupEle], 'e-popup-modal');
-                    }
-                    detach(dropElement);
-                    proxy.popupContainer = undefined;
-                }
             }
         });
         dropDown.isStringTemplate = true;
@@ -3869,16 +3820,6 @@ class ToolbarRenderer {
             popupElem.style.width = (popupElem.offsetWidth - 5).toString() + 'px';
         }
     }
-    popupModal(element) {
-        const popupInst = getInstance(element, Popup);
-        popupInst.relateTo = document.body;
-        popupInst.position = { X: 0, Y: 0 };
-        popupInst.targetType = 'container';
-        popupInst.collision = { X: 'fit', Y: 'fit' };
-        popupInst.offsetY = 4;
-        popupInst.dataBind();
-        this.setIsModel(element);
-    }
     setColorPickerContentWidth(colorPicker) {
         const colorPickerContent = colorPicker.element.nextSibling;
         if (colorPickerContent.style.width === '0px') {
@@ -3916,7 +3857,7 @@ class ToolbarRenderer {
                 args.element.classList.add(CLS_COLOR_PALETTE);
                 args.element.classList.add(CLS_CUSTOM_TILE);
                 if (!isNullOrUndefined(this.parent.cssClass)) {
-                    const allClassName = this.parent.cssClass.split(' ');
+                    const allClassName = this.parent.getCssClass().split(' ');
                     for (let i = 0; i < allClassName.length; i++) {
                         if (allClassName[i].trim() !== '') {
                             args.element.classList.add(allClassName[i]);
@@ -4383,7 +4324,7 @@ class DropDownButtons {
             }
         });
         if (this.parent.inlineMode.enable) {
-            this.setCssClass({ cssClass: this.parent.cssClass });
+            this.setCssClass({ cssClass: this.parent.getCssClass() });
         }
     }
     getUpdateItems(items, value) {
@@ -4700,7 +4641,9 @@ class DropDownButtons {
         this.parent.on(bindCssClass, this.setCssClass, this);
     }
     onIframeMouseDown() {
-        dispatchEvent(document, 'mousedown');
+        if (this.parent.getToolbarElement().querySelectorAll('.e-rte-dropdown-btn[aria-expanded="true"]').length > 0) {
+            dispatchEvent(document, 'mousedown');
+        }
     }
     removeEventListener() {
         if (this.parent.isDestroyed) {
@@ -4917,6 +4860,10 @@ class Toolbar$2 {
             case 'escape':
                 this.parent.contentModule.getEditPanel().focus();
                 break;
+            case 'enter':
+                if (e.target.classList.contains('e-hor-nav')) {
+                    this.adjustContentHeight(e.target, true);
+                }
         }
     }
     createToolbarElement() {
@@ -4972,7 +4919,7 @@ class Toolbar$2 {
             items: this.parent.toolbarSettings.items,
             mode: tBarMode,
             target: ele,
-            cssClass: this.parent.cssClass
+            cssClass: this.parent.getCssClass()
         });
         if (this.parent.toolbarSettings.type === ToolbarType.Expand) {
             addClass([ele], ['e-rte-tb-mobile']);
@@ -5091,7 +5038,7 @@ class Toolbar$2 {
                 items: this.parent.toolbarSettings.items,
                 mode: this.getToolbarMode(),
                 target: this.tbElement,
-                cssClass: this.parent.cssClass
+                cssClass: this.parent.getCssClass()
             });
             if (!this.parent.inlineMode.enable) {
                 if (this.parent.toolbarSettings.enableFloating) {
@@ -5121,7 +5068,7 @@ class Toolbar$2 {
             });
             this.refreshToolbarOverflow();
         }
-        const divEle = this.parent.element.querySelector('.e-rte-srctextarea');
+        const divEle = this.parent.element.querySelector('.' + CLS_RTE_SOURCE_CODE_TXTAREA);
         const iframeEle = this.parent.element.querySelector('.e-source-content');
         if ((!this.parent.iframeSettings.enable && (!isNullOrUndefined(divEle) && divEle.style.display === 'block')) ||
             (this.parent.iframeSettings.enable && (!isNullOrUndefined(iframeEle) && iframeEle.style.display === 'block'))) {
@@ -5251,7 +5198,7 @@ class Toolbar$2 {
                 baseToolbar.toolbarObj.enableItems(item, isEnable);
             }
         }
-        if (!select('.e-rte-srctextarea', this.parent.element) && !muteToolbarUpdate) {
+        if (!select('.' + CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element) && !muteToolbarUpdate) {
             updateUndoRedoStatus(baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());
         }
     }
@@ -5424,20 +5371,24 @@ class Toolbar$2 {
     }
     toolbarClickHandler(e) {
         const trg = closest(e.originalEvent.target, '.e-hor-nav');
+        this.adjustContentHeight(trg, false);
+    }
+    adjustContentHeight(trg, isKeyboard) {
         if (trg && this.parent.toolbarSettings.type === ToolbarType.Expand && !isNullOrUndefined(trg)) {
             const extendedTbar = this.tbElement.querySelector('.e-toolbar-extended');
             if (!isNullOrUndefined(extendedTbar)) {
                 setStyleAttribute(extendedTbar, { maxHeight: '', display: 'block' });
                 setStyleAttribute(extendedTbar, { maxHeight: extendedTbar.offsetHeight + 'px', display: '' });
             }
-            if (!trg.classList.contains('e-nav-active')) {
-                removeClass([this.tbElement], [CLS_EXPAND_OPEN]);
-                this.parent.setContentHeight('toolbar', false);
+            const hasActiveClass = trg.classList.contains('e-nav-active');
+            const isExpand = isKeyboard ? (hasActiveClass ? false : true) : (hasActiveClass ? true : false);
+            if (isExpand) {
+                addClass([this.tbElement], [CLS_EXPAND_OPEN]);
             }
             else {
-                addClass([this.tbElement], [CLS_EXPAND_OPEN]);
-                this.parent.setContentHeight('toolbar', true);
+                removeClass([this.tbElement], [CLS_EXPAND_OPEN]);
             }
+            this.parent.setContentHeight('toolbar', isExpand);
         }
         else if (Browser.isDevice || this.parent.inlineMode.enable) {
             this.isToolbar = true;
@@ -5560,7 +5511,7 @@ class Toolbar$2 {
             this.addEventListener();
             this.renderToolbar();
             this.parent.wireScrollElementsEvents();
-            if (!select('.e-rte-srctextarea', this.parent.element)) {
+            if (!select('.' + CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element)) {
                 updateUndoRedoStatus(this.baseToolbar, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());
             }
             this.parent.notify(dynamicModule, {});
@@ -5837,7 +5788,7 @@ class ColorPickerInput {
                         document.body.appendChild(fontNode);
                         options = {
                             cssClass: this.tools[item.toLocaleLowerCase()].icon
-                                + ' ' + CLS_RTE_ELEMENTS + ' ' + CLS_ICONS + ' ' + this.parent.cssClass,
+                                + ' ' + CLS_RTE_ELEMENTS + ' ' + CLS_ICONS + this.parent.getCssClass(true),
                             value: this.tools[item.toLocaleLowerCase()].value,
                             command: this.tools[item.toLocaleLowerCase()].command,
                             subCommand: this.tools[item.toLocaleLowerCase()].subCommand,
@@ -5864,7 +5815,7 @@ class ColorPickerInput {
                         document.body.appendChild(backNode);
                         options = {
                             cssClass: this.tools[item.toLocaleLowerCase()].icon
-                                + ' ' + CLS_RTE_ELEMENTS + ' ' + CLS_ICONS + ' ' + this.parent.cssClass,
+                                + ' ' + CLS_RTE_ELEMENTS + ' ' + CLS_ICONS + this.parent.getCssClass(true),
                             value: this.tools[item.toLocaleLowerCase()].value,
                             command: this.tools[item.toLocaleLowerCase()].command,
                             subCommand: this.tools[item.toLocaleLowerCase()].subCommand,
@@ -5879,7 +5830,7 @@ class ColorPickerInput {
             }
         });
         if (this.parent.inlineMode.enable) {
-            this.setCssClass({ cssClass: this.parent.cssClass });
+            this.setCssClass({ cssClass: this.parent.getCssClass() });
         }
     }
     destroy() {
@@ -6038,6 +5989,9 @@ class BaseQuickToolbar {
     }
     appendPopupContent() {
         this.toolbarElement = this.parent.createElement('div', { className: CLS_QUICK_TB });
+        if (this.element.classList.contains(CLS_TEXT_POP)) {
+            this.toolbarElement.classList.add(CLS_TEXT_QUICK_TB);
+        }
         this.element.appendChild(this.toolbarElement);
     }
     /**
@@ -6229,7 +6183,7 @@ class BaseQuickToolbar {
                     editPanelTop = (cntEle) ? cntEle.scrollTop : 0;
                     editPanelHeight = (cntEle) ? cntEle.offsetHeight : 0;
                 }
-                if (!this.parent.inlineMode.enable && !closest(target, 'table') && type !== 'text') {
+                if ((!this.parent.inlineMode.enable && !closest(target, 'table') && type !== 'text' && type !== 'link') || target.tagName === 'IMG') {
                     this.parent.disableToolbarItem(this.parent.toolbarSettings.items);
                     this.parent.enableToolbarItem(['Undo', 'Redo']);
                 }
@@ -6372,7 +6326,18 @@ class BaseQuickToolbar {
             tbItems: this.quickTBarObj.toolbarObj.items
         };
         setToolbarStatus(options, true, this.parent);
-        if (!select('.e-rte-srctextarea', this.parent.element)) {
+        if (this.parent.quickToolbarSettings.text && this.parent.quickToolbarModule.textQTBar) {
+            const options = {
+                args: args,
+                dropDownModule: this.parent.quickToolbarModule.textQTBar.dropDownButtons,
+                parent: this.parent,
+                tbElements: selectAll('.' + CLS_TB_ITEM, this.parent.quickToolbarModule.textQTBar.element),
+                tbItems: this.parent.quickToolbarModule.textQTBar.quickTBarObj.toolbarObj.items
+            };
+            setToolbarStatus(options, true, this.parent);
+            updateUndoRedoStatus(this.parent.quickToolbarModule.textQTBar.quickTBarObj, this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());
+        }
+        if (!select('.' + CLS_RTE_SOURCE_CODE_TXTAREA, this.parent.element)) {
             updateUndoRedoStatus(this.parent.getBaseToolbarObject(), this.parent.formatter.editorManager.undoRedoManager.getUndoStatus());
         }
     }
@@ -6404,7 +6369,7 @@ class BaseQuickToolbar {
         }
         this.parent.on(destroy, this.destroy, this);
         this.parent.on(modelChanged, this.onPropertyChanged, this);
-        if (this.parent.inlineMode.enable) {
+        if (this.parent.inlineMode.enable || this.parent.quickToolbarSettings.text) {
             this.parent.on(toolbarUpdated, this.updateStatus, this);
         }
     }
@@ -6445,7 +6410,7 @@ class BaseQuickToolbar {
         }
         this.parent.off(destroy, this.destroy);
         this.parent.off(modelChanged, this.onPropertyChanged);
-        if (this.parent.inlineMode.enable) {
+        if (this.parent.inlineMode.enable || this.parent.quickToolbarSettings.text) {
             this.parent.off(toolbarUpdated, this.updateStatus);
         }
     }
@@ -6564,7 +6529,7 @@ class QuickToolbar {
             toolbarItems: items,
             mode: mode,
             renderType: type,
-            cssClass: this.parent.cssClass
+            cssClass: this.parent.getCssClass()
         };
     }
     /**
@@ -6777,6 +6742,9 @@ class QuickToolbar {
             && !isNullOrUndefined(select('.' + CLS_INLINE_POP, document))) {
             this.hideInlineQTBar();
         }
+        if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {
+            this.textQTBar.hidePopup();
+        }
     }
     inlineQTBarMouseDownHandler() {
         if ((this.parent.inlineMode.enable && (!Browser.isDevice || isIDevice()))
@@ -6790,8 +6758,8 @@ class QuickToolbar {
         }
     }
     keyUpHandler(e) {
+        const args = e.args;
         if (this.parent.inlineMode.enable && !Browser.isDevice) {
-            const args = e.args;
             if (this.parent.inlineMode.onSelection) {
                 if (this.parent.getSelection().length > 0) {
                     if ((args.ctrlKey && args.keyCode === 65) || (args.shiftKey && (args.keyCode === 33 || args.keyCode === 34 ||
@@ -6804,6 +6772,13 @@ class QuickToolbar {
             }
             this.deBounce(this.offsetX, this.offsetY, args.target);
         }
+        if (this.parent.quickToolbarSettings.text && !Browser.isDevice) {
+            if ((args.ctrlKey && args.keyCode === 65) || (args.shiftKey && (args.keyCode === 33 || args.keyCode === 34 ||
+                args.keyCode === 35 || args.keyCode === 36 || args.keyCode === 37 || args.keyCode === 38 ||
+                args.keyCode === 39 || args.keyCode === 40))) {
+                this.textQTBar.showPopup(this.offsetX, this.offsetY, args.target, 'text');
+            }
+        }
     }
     selectionChangeHandler(e) {
         clearTimeout(this.deBouncer);
@@ -6962,6 +6937,15 @@ class QuickToolbar {
             if (this.videoQTBar && !hasClass(this.videoQTBar.element, 'e-popup-close')) {
                 this.videoQTBar.hidePopup();
             }
+            if (this.tableQTBar && !hasClass(this.tableQTBar.element, 'e-popup-close')) {
+                this.tableQTBar.hidePopup();
+            }
+            if (this.linkQTBar && !hasClass(this.linkQTBar.element, 'e-popup-close')) {
+                this.linkQTBar.hidePopup();
+            }
+            if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {
+                this.textQTBar.hidePopup();
+            }
         }
     }
     onIframeMouseDown() {
@@ -7014,6 +6998,9 @@ class QuickToolbar {
      * @deprecated
      */
     removeEventListener() {
+        if (this.deBouncer) {
+            clearTimeout(this.deBouncer);
+        }
         if (this.parent.isDestroyed) {
             return;
         }
@@ -7034,9 +7021,6 @@ class QuickToolbar {
         this.parent.off(rtlMode, this.setRtl);
         this.parent.off(bindCssClass, this.setCssClass);
         this.parent.off(hidePopup, this.hideQuickToolbars);
-        if (this.deBouncer) {
-            clearTimeout(this.deBouncer);
-        }
     }
     /**
      * Called internally if any of the property value changed.
@@ -7905,7 +7889,7 @@ class Formatter {
             if (args.item.command === 'Images' || args.item.command === 'Videos' || args.item.command === 'Table' || args.item.command === 'Files') {
                 currentInsertContentLength = 1;
             }
-            const currentLength = self.getText().trim().length;
+            const currentLength = self.getText().trim().replace(/(\r\n|\n|\r)/gm, '').replace(/\u200B/g, '').length;
             const selectionLength = self.getSelection().length;
             const totalLength = (currentLength - selectionLength) + currentInsertContentLength;
             if (!(self.maxLength === -1 || totalLength <= self.maxLength)) {
@@ -9211,7 +9195,7 @@ const htmlKeyConfig = {
     'insert-link': 'ctrl+k',
     'insert-image': 'ctrl+shift+i',
     'insert-audio': 'ctrl+shift+a',
-    'insert-video': 'ctrl+shift+v',
+    'insert-video': 'ctrl+alt+v',
     'insert-table': 'ctrl+shift+e',
     'undo': 'ctrl+z',
     'redo': 'ctrl+y',
@@ -11324,19 +11308,6 @@ class DOMNode {
         let end = this.parent.querySelector('.' + markerClassName.endSelection);
         let startTextNode;
         let endTextNode;
-        if (start.textContent === '' && isNullOrUndefined(end) && action !== 'tab') {
-            // 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 {
-                start.innerHTML = '&#65279;&#65279;';
-            }
-        }
         if (this.hasClass(start, markerClassName.startSelection) && start.classList.length > 1) {
             const replace = this.createTagString(DEFAULT_TAG, start, this.encode(start.textContent));
             this.replaceWith(start, replace);
@@ -11459,7 +11430,7 @@ class DOMNode {
         else if (start.tagName === 'BR') {
             this.replaceWith(start, this.marker(className, this.encode(start.textContent)));
             const markerStart = range.startContainer.querySelector('.' + className);
-            markerStart.appendChild(start);
+            markerStart.parentElement.appendChild(start);
         }
         else {
             if (start.tagName === 'IMG') {
@@ -12767,7 +12738,7 @@ class NodeCutter {
         if ((indexes.indexOf(range.startOffset) >= 0)
             || ((indexes.indexOf(range.startOffset - 1) >= 0) && (range.startOffset !== 1
                 || (range.startOffset === 1 && new RegExp('\\s').test(str[0])))
-                || ((indexes[indexes.length - 1] - 1) === range.startOffset))) {
+                || (((indexes[indexes.length - 1] - 1) === range.startOffset) && !new RegExp('\\s').test(str[0])))) {
             cursorRange = range;
             this.position = 1;
         }
@@ -13286,6 +13257,9 @@ class InsertHtml {
                         InsertMethods.AppendBefore(node, parentNode.firstChild, false);
                     }
                 }
+                else if (isNullOrUndefined(preNode.previousSibling) && insertNode.tagName === 'TABLE') {
+                    parentNode.prepend(node);
+                }
                 else {
                     parentNode.appendChild(node);
                 }
@@ -13463,7 +13437,7 @@ class InsertHtml {
                         (this.inlineNode.indexOf(node.firstChild.nodeName.toLocaleLowerCase()) >= 0 && isFirstTextNode)) {
                         lastSelectionNode = node.firstChild;
                         if (isNullOrUndefined(node.previousElementSibling)) {
-                            const firstParaElm = createElement('p');
+                            const firstParaElm = enterAction === 'DIV' ? createElement('div') : createElement('p');
                             node.parentElement.insertBefore(firstParaElm, node);
                         }
                         if (node.previousElementSibling.nodeName === 'BR') {
@@ -13478,7 +13452,7 @@ class InsertHtml {
                         if (node.firstChild.nodeName === '#text' ||
                             (this.inlineNode.indexOf(node.firstChild.nodeName.toLocaleLowerCase()) >= 0)) {
                             if (!isPreviousInlineElem) {
-                                paraElm = createElement('p');
+                                paraElm = enterAction === 'DIV' ? createElement('div') : createElement('p');
                                 paraElm.appendChild(node.firstChild);
                                 fragment.appendChild(paraElm);
                             }
@@ -14336,8 +14310,8 @@ class ImageCommand {
         e.item.url = isNullOrUndefined(e.item.url) || e.item.url === 'undefined' ? e.item.src : e.item.url;
         if (!isNullOrUndefined(e.item.selectParent) && e.item.selectParent[0].tagName === 'IMG') {
             const imgEle = e.item.selectParent[0];
-            this.setStyle(imgEle, e);
             isReplaced = true;
+            this.setStyle(imgEle, e, isReplaced);
         }
         else {
             const imgElement = createElement('img');
@@ -14373,12 +14347,33 @@ class ImageCommand {
                 }
             });
         }
+        if (e.value === 'Replace') {
+            e.item.subCommand = 'Replace';
+            this.callBack(e);
+        }
     }
-    setStyle(imgElement, e) {
+    setStyle(imgElement, e, imgReplace) {
         if (!isNullOrUndefined(e.item.url)) {
             imgElement.setAttribute('src', e.item.url);
         }
-        imgElement.setAttribute('class', 'e-rte-image' + (isNullOrUndefined(e.item.cssClass) ? '' : ' ' + e.item.cssClass));
+        let alignClassName;
+        if (imgReplace) {
+            const alignClass = {
+                'e-imgcenter': 'e-imgcenter',
+                'e-imgright': 'e-imgright',
+                'e-imgleft': 'e-imgleft'
+            };
+            const imgClassList = imgElement.classList;
+            for (let i = 0; i < imgClassList.length; i++) {
+                // eslint-disable-next-line
+                if (!isNullOrUndefined(alignClass[imgClassList[i]])) {
+                    // eslint-disable-next-line
+                    alignClassName = alignClass[imgClassList[i]];
+                }
+            }
+        }
+        imgElement.setAttribute('class', 'e-rte-image' + (isNullOrUndefined(e.item.cssClass) ? '' : ' ' + e.item.cssClass)
+            + (isNullOrUndefined(alignClassName) ? '' : ' ' + alignClassName));
         if (!isNullOrUndefined(e.item.altText)) {
             imgElement.setAttribute('alt', e.item.altText);
         }
@@ -14430,6 +14425,9 @@ class ImageCommand {
         if (!isNullOrUndefined(e.item.target)) {
             anchor.setAttribute('target', e.item.target);
         }
+        if (!isNullOrUndefined(e.item.ariaLabel)) {
+            anchor.setAttribute('aria-label', e.item.ariaLabel);
+        }
         InsertHtml.Insert(this.parent.currentDocument, anchor, this.parent.editableElement);
         this.callBack(e);
     }
@@ -14461,9 +14459,11 @@ class ImageCommand {
         e.item.selectNode[0].parentElement.href = e.item.url;
         if (isNullOrUndefined(e.item.target)) {
             e.item.selectNode[0].parentElement.removeAttribute('target');
+            e.item.selectNode[0].parentElement.removeAttribute('aria-label');
         }
         else {
             e.item.selectNode[0].parentElement.target = e.item.target;
+            e.item.selectNode[0].parentElement.ariaLabel = e.item.ariaLabel;
         }
         this.callBack(e);
     }
@@ -14728,9 +14728,19 @@ class AudioCommand {
         if (!isNullOrUndefined(e.item.url)) {
             sourceElement.setAttribute('src', e.item.url);
         }
-        sourceElement.type = e.item.fileName && e.item.fileName.split('.').length > 0 ?
-            'audio/' + e.item.fileName.split('.')[e.item.fileName.split('.').length - 1] :
-            e.item.url && e.item.url.split('.').length > 0 ? 'audio/' + e.item.url.split('.')[e.item.url.split('.').length - 1] : '';
+        const fileExtension = e.item.fileName ? e.item.fileName.split('.').pop().toLowerCase() :
+            e.item.url ? e.item.url.split('.').pop().toLowerCase() : '';
+        if (fileExtension === 'opus') {
+            sourceElement.type = 'audio/ogg';
+        }
+        else if (fileExtension === 'm4a') {
+            sourceElement.type = 'audio/mp4';
+        }
+        else {
+            sourceElement.type = e.item.fileName && e.item.fileName.split('.').length > 0 ?
+                'audio/' + e.item.fileName.split('.')[e.item.fileName.split('.').length - 1] :
+                e.item.url && e.item.url.split('.').length > 0 ? 'audio/' + e.item.url.split('.')[e.item.url.split('.').length - 1] : '';
+        }
     }
     callBack(e) {
         if (e.callBack) {
@@ -16472,6 +16482,19 @@ class SelectionCommands {
         }
         else {
             child = InsertMethods.unwrap(formatNode);
+            let liElement = nodes[index].parentElement;
+            if (!isNullOrUndefined(liElement) && liElement.tagName.toLowerCase() !== 'li') {
+                liElement = closest(liElement, 'li');
+            }
+            if (!isNullOrUndefined(liElement) && liElement.tagName.toLowerCase() === 'li' &&
+                liElement.textContent.trim() === nodes[index].textContent.trim()) {
+                if (format === 'bold') {
+                    liElement.style.fontWeight = 'normal';
+                }
+                else if (format === "italic") {
+                    liElement.style.fontStyle = 'normal';
+                }
+            }
         }
         if (child[0] && !isFontStyle) {
             let nodeTraverse = child[index] ? child[index] : child[0];
@@ -16520,6 +16543,16 @@ class SelectionCommands {
                 if (child[num].nodeType !== 3 || (child[num].textContent &&
                     child[num].textContent.trim().length > 0)) {
                     child[num] = InsertMethods.Wrap(child[num], this.GetFormatNode(format, value, formatNodeTagName, formatNodeStyles));
+                    let liElement = nodes[index].parentElement;
+                    if (!isNullOrUndefined(liElement) && liElement.tagName.toLowerCase() !== 'li') {
+                        liElement = closest(liElement, 'li');
+                    }
+                    if (!isNullOrUndefined(liElement) && liElement.tagName.toLowerCase() === 'li' &&
+                        liElement.textContent.trim() === nodes[index].textContent.trim()) {
+                        if (format === 'fontname') {
+                            liElement.style.fontFamily = value;
+                        }
+                    }
                     if (child[num].textContent === startText) {
                         if (num === 0) {
                             range.setStartBefore(child[num]);
@@ -16633,6 +16666,9 @@ class SelectionCommands {
                                 liElement.style.color = value;
                                 liElement.style.textDecoration = 'inherit';
                             }
+                            else if (format === 'fontname') {
+                                liElement.style.fontFamily = value;
+                            }
                         }
                         if (value === 'formatPainter') {
                             return this.insertFormatPainterElem(nodes, index, range, nodeCutter, painterValues, domNode);
@@ -16680,6 +16716,19 @@ class SelectionCommands {
                     }
                     else {
                         nodes[index] = this.applyStyles(nodes, index, element);
+                        let liElement = nodes[index].parentElement;
+                        if (!isNullOrUndefined(liElement) && liElement.tagName.toLowerCase() !== 'li') {
+                            liElement = closest(liElement, 'li');
+                        }
+                        if (!isNullOrUndefined(liElement) && liElement.tagName.toLowerCase() === 'li' &&
+                            liElement.textContent.trim() === nodes[index].textContent.trim()) {
+                            if (format === 'bold') {
+                                liElement.style.fontWeight = 'bold';
+                            }
+                            else if (format === "italic") {
+                                liElement.style.fontStyle = 'italic';
+                            }
+                        }
                     }
                 }
             }
@@ -18002,6 +18051,9 @@ class MsWordPaste {
                     resultElem = elm.querySelectorAll(keys[i]);
                 }
                 for (let j = 0; j < resultElem.length; j++) {
+                    if (resultElem[j].closest('li') && keys[i] === 'p') {
+                        continue;
+                    }
                     const styleProperty = resultElem[j].getAttribute('style');
                     if (!isNullOrUndefined(styleProperty) && styleProperty.trim() !== '') {
                         const valueSplit = values[i].split(';');
@@ -18300,7 +18352,7 @@ class MsWordPaste {
                 !isNormalList) {
                 prevList = null;
             }
-            const pElement = createElement('p');
+            const pElement = createElement('p', { className: 'MsoNormal' });
             pElement.innerHTML = collection[index].content.join(' ');
             if ((collection[index].nestedLevel === 1) && listCount === 0 && collection[index].content) {
                 root.appendChild(temp = createElement(collection[index].listType, { className: collection[index].class }));
@@ -20455,7 +20507,7 @@ class HtmlEditor {
             e.args.keyCode === 13) {
             this.spaceLink(e.args);
             if (this.parent.editorMode === 'HTML' && !this.parent.readonly) {
-                const currentLength = this.parent.getText().trim().length;
+                const currentLength = this.parent.getText().trim().replace(/(\r\n|\n|\r)/gm, '').replace(/\u200B/g, '').length;
                 const selectionLength = this.parent.getSelection().length;
                 const totalLength = (currentLength - selectionLength) + 1;
                 if (!(this.parent.maxLength === -1 || totalLength <= this.parent.maxLength) &&
@@ -20465,6 +20517,10 @@ class HtmlEditor {
                 }
                 else {
                     this.parent.notify(enterHandler, { args: e.args });
+                    const newRange = this.parent.getRange();
+                    if (!isNullOrUndefined(newRange.startContainer) && newRange.startContainer === this.parent.inputElement.lastChild && newRange.startContainer.nodeName !== '#text') {
+                        newRange.startContainer.scrollIntoView({ block: "end", inline: "nearest" });
+                    }
                 }
             }
         }
@@ -20613,7 +20669,7 @@ class HtmlEditor {
         let liElement;
         let rootElement;
         if (e.args.code === 'Delete' && e.args.keyCode === 46 &&
-            this.parent.contentModule.getText().trim().length !== 0 && this.parent.getSelection().length === 0 && currentRange.startContainer.parentElement.tagName !== 'TD' &&
+            this.parent.contentModule.getText().trim().replace(/(\r\n|\n|\r)/gm, '').replace(/\u200B/g, '').length !== 0 && this.parent.getSelection().length === 0 && currentRange.startContainer.parentElement.tagName !== 'TD' &&
             currentRange.startContainer.parentElement.tagName !== 'TH') {
             this.deleteRangeElement = rootElement = this.getRootBlockNode(currentRange.startContainer);
             if (this.deleteRangeElement.tagName === 'OL' || this.deleteRangeElement.tagName === 'UL') {
@@ -20661,8 +20717,13 @@ class HtmlEditor {
                         this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), this.deleteRangeElement, this.deleteRangeElement.childNodes.length);
                         this.isImageDelete = false;
                     }
-                    if (this.deleteRangeElement.querySelector('BR')) {
-                        detach(this.deleteRangeElement.querySelector('BR'));
+                    const brNode = this.deleteRangeElement.querySelector('BR');
+                    if (brNode && brNode.classList.contains('e-rte-image-remove-focus')) {
+                        removeClass([brNode], ['e-rte-image-focus']);
+                        return;
+                    }
+                    else if (brNode) {
+                        detach(brNode);
                     }
                     if (!isNullOrUndefined(this.deleteRangeElement) && (this.deleteOldRangeElement.tagName !== 'OL' && this.deleteOldRangeElement.tagName !== 'UL')
                         && this.deleteOldRangeElement !== this.deleteRangeElement) {
@@ -20823,12 +20884,34 @@ class HtmlEditor {
             }, e, value);
         }
     }
+    mouseOutHandler() {
+        if (!isNullOrUndefined(this.tooltipTargetEle)) {
+            this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
+        }
+        else {
+            const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
+                this.parent.contentModule.getDocument();
+            this.tooltipTargetEle = currentDocument.querySelector('[data-title]');
+            this.tooltipTargetEle.setAttribute('title', this.tooltipTargetEle.getAttribute('data-title'));
+        }
+        this.tooltipTargetEle.removeAttribute('data-title');
+        EventHandler.remove(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler);
+    }
     onToolbarClick(args) {
         let save;
         let selectNodeEle;
         let selectParentEle;
         const item = args.item;
         const closestElement = closest(args.originalEvent.target, '.e-rte-quick-popup');
+        const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument :
+            this.parent.contentModule.getDocument();
+        this.tooltipTargetEle = closest(args.originalEvent.target, '[data-tooltip-id]');
+        if (!isNullOrUndefined(this.tooltipTargetEle) && this.parent.showTooltip && !isNullOrUndefined(currentDocument.querySelector('.e-tooltip-wrap'))) {
+            this.parent.notify(destroyTooltip, { args: event });
+            this.tooltipTargetEle.setAttribute('data-title', this.tooltipTargetEle.getAttribute('title'));
+            this.tooltipTargetEle.removeAttribute('title');
+            EventHandler.add(this.tooltipTargetEle, 'mouseout', this.mouseOutHandler, this);
+        }
         if (item.command !== 'FormatPainter') {
             if (closestElement && !closestElement.classList.contains('e-rte-inline-popup') && !closestElement.classList.contains('e-rte-text-popup')) {
                 if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||
@@ -21139,6 +21222,7 @@ class PasteCleanup {
             event: e
         };
         let value = null;
+        let isClipboardHTMLDataNull = false;
         let imageproperties;
         if (e.args && !isNullOrUndefined(e.args.clipboardData)) {
             value = e.args.clipboardData.getData('text/html');
@@ -21177,6 +21261,7 @@ class PasteCleanup {
                     const divElement = this.parent.createElement('div');
                     divElement.innerHTML = this.splitBreakLine(value);
                     value = divElement.innerHTML;
+                    isClipboardHTMLDataNull = true;
                 }
             }
             else if (value.length > 0) {
@@ -21198,10 +21283,13 @@ class PasteCleanup {
             tempDivElem.innerHTML = value;
             const isValueNotEmpty = tempDivElem.textContent !== '' || !isNullOrUndefined(tempDivElem.querySelector('img')) ||
                 !isNullOrUndefined(tempDivElem.querySelector('table'));
+            this.parent.trigger(cleanupResizeElements, { value: value }, (args) => {
+                value = args.value;
+            });
             if (this.parent.pasteCleanupSettings.prompt) {
                 if (isValueNotEmpty) {
                     e.args.preventDefault();
-                    this.pasteDialog(value, args);
+                    this.pasteDialog(value, args, isClipboardHTMLDataNull);
                 }
                 else if (Browser.userAgent.indexOf('Firefox') !== -1 && isNullOrUndefined(file)) {
                     this.fireFoxImageUpload();
@@ -21213,7 +21301,7 @@ class PasteCleanup {
             }
             else if (this.parent.pasteCleanupSettings.plainText) {
                 e.args.preventDefault();
-                this.plainFormatting(value, args);
+                this.plainFormatting(value, args, isClipboardHTMLDataNull);
             }
             else if (this.parent.pasteCleanupSettings.keepFormat) {
                 e.args.preventDefault();
@@ -21254,13 +21342,17 @@ class PasteCleanup {
     splitBreakLine(value) {
         const enterSplitText = value.split('\n');
         let contentInnerElem = '';
+        const startNode = this.parent.enterKey === 'P' ? '<p>' : (this.parent.enterKey === 'DIV' ? '<div>' : '');
+        const endNode = this.parent.enterKey === 'P' ? '</p>' : (this.parent.enterKey === 'DIV' ? '</div>' : '<br>');
         for (let i = 0; i < enterSplitText.length; i++) {
             if (enterSplitText[i].trim() === '') {
                 contentInnerElem += getDefaultValue(this.parent);
             }
             else {
                 const contentWithSpace = this.makeSpace(enterSplitText[i]);
-                contentInnerElem += '<p>' + contentWithSpace.trim() + '</p>';
+                contentInnerElem += (i === 0 && this.parent.enterKey !== 'BR' ? '<span>' : startNode) +
+                    (contentWithSpace.trim() === '' ? '<br>' : contentWithSpace.trim()) +
+                    (enterSplitText.length - 1 === i && this.parent.enterKey === 'BR' ? '' : (i === 0 && this.parent.enterKey !== 'BR' ? '</span>' : endNode));
             }
         }
         return contentInnerElem;
@@ -21524,10 +21616,10 @@ class PasteCleanup {
         const range = this.nodeSelectionObj.getRange(currentDocument);
         this.saveSelection = this.nodeSelectionObj.save(range, currentDocument);
         if (this.parent.pasteCleanupSettings.prompt) {
-            this.pasteDialog(imageValue, pasteArgs);
+            this.pasteDialog(imageValue, pasteArgs, false);
         }
         else if (this.parent.pasteCleanupSettings.plainText) {
-            this.plainFormatting(imageValue, pasteArgs);
+            this.plainFormatting(imageValue, pasteArgs, false);
         }
         else if (this.parent.pasteCleanupSettings.keepFormat) {
             this.formatting(imageValue, false, pasteArgs);
@@ -21551,7 +21643,7 @@ class PasteCleanup {
         const plainTextElement = this.parent.element.querySelector('#plainTextFormat');
         this.plainTextRadioButton.appendTo(plainTextElement);
     }
-    selectFormatting(value, args, keepChecked, cleanChecked) {
+    selectFormatting(value, args, keepChecked, cleanChecked, isClipboardHTMLDataNull) {
         if (keepChecked) {
             this.formatting(value, false, args);
         }
@@ -21559,10 +21651,10 @@ class PasteCleanup {
             this.formatting(value, true, args);
         }
         else {
-            this.plainFormatting(value, args);
+            this.plainFormatting(value, args, isClipboardHTMLDataNull);
         }
     }
-    pasteDialog(value, args) {
+    pasteDialog(value, args, isClipboardHTMLDataNull) {
         let isHeight = false;
         const preRTEHeight = this.parent.height;
         const dialogModel = {
@@ -21578,7 +21670,7 @@ class PasteCleanup {
                             const argument = this.dialogObj;
                             this.dialogRenderObj.close(argument);
                             this.dialogObj.destroy();
-                            this.selectFormatting(value, args, keepChecked, cleanChecked);
+                            this.selectFormatting(value, args, keepChecked, cleanChecked, isClipboardHTMLDataNull);
                         }
                     },
                     buttonModel: {
@@ -21639,7 +21731,7 @@ class PasteCleanup {
             isHeight = true;
         }
         this.dialogObj.show();
-        this.setCssClass({ cssClass: this.parent.cssClass });
+        this.setCssClass({ cssClass: this.parent.getCssClass() });
     }
     updateCss(currentObj, e) {
         if (currentObj && e.cssClass) {
@@ -21847,8 +21939,8 @@ class PasteCleanup {
         return value;
     }
     //Plain Formatting
-    plainFormatting(value, args) {
-        const clipBoardElem = this.parent.createElement('div', { className: 'pasteContent', styles: 'display:inline;' });
+    plainFormatting(value, args, isClipboardHTMLDataNull) {
+        let clipBoardElem = this.parent.createElement('div', { className: 'pasteContent', styles: 'display:inline;' });
         clipBoardElem.innerHTML = value;
         this.detachInlineElements(clipBoardElem);
         this.getTextContent(clipBoardElem);
@@ -21884,6 +21976,13 @@ class PasteCleanup {
             this.saveSelection.restore();
             clipBoardElem.innerHTML = this.sanitizeHelper(clipBoardElem.innerHTML);
             this.addTempClass(clipBoardElem);
+            this.removingComments(clipBoardElem);
+            if (this.parent.enterKey === 'BR' && !isClipboardHTMLDataNull) {
+                clipBoardElem = this.reframeToBrContent(clipBoardElem);
+            }
+            else if (this.parent.enterKey === 'DIV') {
+                clipBoardElem.innerHTML = clipBoardElem.innerHTML.replace(/<p class="pasteContent_RTE">/g, '<div>').replace(/<\/p>/g, '</div>');
+            }
             this.parent.trigger(afterPasteCleanup, { value: clipBoardElem.innerHTML, filesData: null }, (updatedArgs) => { value = updatedArgs.value; });
             clipBoardElem.innerHTML = value;
             this.parent.formatter.editorManager.execCommand('inserthtml', 'pasteCleanup', args, (returnArgs) => {
@@ -21898,6 +21997,41 @@ class PasteCleanup {
             this.parent.formatter.onSuccess(this.parent, args);
         }
     }
+    removingComments(elm) {
+        let innerElement = elm.innerHTML;
+        innerElement = innerElement.replace(/<!--[\s\S]*?-->/g, '');
+        elm.innerHTML = innerElement;
+    }
+    reframeToBrContent(clipBoardElem) {
+        const newClipBoardElem = this.parent.createElement('div', { className: 'pasteContent', styles: 'display:inline;' });
+        while (!isNullOrUndefined(clipBoardElem.firstChild)) {
+            const brElem = this.parent.createElement('br');
+            const currentFirstChild = clipBoardElem.firstChild;
+            if (currentFirstChild.nodeName === '#text') {
+                const isNextSibPresent = !isNullOrUndefined(currentFirstChild.nextSibling);
+                newClipBoardElem.appendChild(currentFirstChild);
+                if (isNextSibPresent) {
+                    newClipBoardElem.appendChild(brElem);
+                }
+            }
+            else {
+                const isCurrentNodeBRElm = currentFirstChild.nodeName === 'BR';
+                if (isCurrentNodeBRElm) {
+                    newClipBoardElem.appendChild(currentFirstChild);
+                }
+                else {
+                    newClipBoardElem.appendChild(currentFirstChild.childNodes[0]);
+                }
+                if (!isNullOrUndefined(currentFirstChild) && !isNullOrUndefined(currentFirstChild.nextSibling)) {
+                    newClipBoardElem.appendChild(brElem);
+                }
+                if (!isCurrentNodeBRElm && !isNullOrUndefined(currentFirstChild)) {
+                    detach(currentFirstChild);
+                }
+            }
+        }
+        return newClipBoardElem;
+    }
     getTextContent(clipBoardElem) {
         for (let i = 0; i < this.blockNode.length; i++) {
             const inElem = clipBoardElem.querySelectorAll(this.blockNode[i]);
@@ -21945,14 +22079,16 @@ class PasteCleanup {
         for (let i = 0; i < this.inlineNode.length; i++) {
             const inElem = clipBoardElem.querySelectorAll(this.inlineNode[i]);
             for (let j = 0; j < inElem.length; j++) {
-                let parElem;
-                for (let k = 0; k < inElem[j].childNodes.length; k++) {
-                    parElem = inElem[j].childNodes[k].parentElement;
-                    inElem[j].childNodes[k].parentElement.parentElement.insertBefore(inElem[j].childNodes[k], inElem[j].childNodes[k].parentElement);
-                    k--;
-                }
-                if (!isNullOrUndefined(parElem)) {
-                    detach(parElem);
+                if (!(inElem[j] === clipBoardElem.firstChild && inElem[j].nodeName === 'SPAN')) {
+                    let parElem;
+                    for (let k = 0; k < inElem[j].childNodes.length; k++) {
+                        parElem = inElem[j].childNodes[k].parentElement;
+                        inElem[j].childNodes[k].parentElement.parentElement.insertBefore(inElem[j].childNodes[k], inElem[j].childNodes[k].parentElement);
+                        k--;
+                    }
+                    if (!isNullOrUndefined(parElem)) {
+                        detach(parElem);
+                    }
                 }
             }
         }
@@ -22309,7 +22445,7 @@ class FileManager$1 {
         this.dialogObj.createElement = this.parent.createElement;
         this.dialogObj.appendTo(dlgTarget);
         this.dialogObj.show(Browser.isDevice ? true : false);
-        this.setCssClass({ cssClass: this.parent.cssClass });
+        this.setCssClass({ cssClass: this.parent.getCssClass() });
     }
     // eslint-disable-next-line @typescript-eslint/tslint/config
     setCssClass(e) {
@@ -22506,7 +22642,7 @@ class FullScreen {
             this.parent.quickToolbarModule.hideQuickToolbars();
         }
         if (this.parent.showTooltip && !isNullOrUndefined(document.querySelector('.e-tooltip-wrap'))) {
-            this.parent.notify(maximizeMinimizeClick, { args: event });
+            this.parent.notify(destroyTooltip, { args: event });
         }
         this.scrollableParent = getScrollableParent(this.parent.element);
         if (!this.parent.element.classList.contains(CLS_FULL_SCREEN)) {
@@ -22560,7 +22696,7 @@ class FullScreen {
             this.parent.quickToolbarModule.hideQuickToolbars();
         }
         if (this.parent.showTooltip && !isNullOrUndefined(document.querySelector('.e-tooltip-wrap'))) {
-            this.parent.notify(maximizeMinimizeClick, { args: event });
+            this.parent.notify(destroyTooltip, { args: event });
         }
         if (this.parent.element.classList.contains(CLS_FULL_SCREEN)) {
             const evenArgs = {
@@ -22751,7 +22887,7 @@ class FormatPainter {
     }
     onKeyDown(event) {
         const originalEvent = event.args;
-        if ((originalEvent.altKey && originalEvent.shiftKey && (originalEvent.action === 'format-copy' || originalEvent.action === 'format-paste'))
+        if (!isNullOrUndefined(originalEvent) && !isNullOrUndefined(originalEvent.action) && (originalEvent.action === 'format-copy' || originalEvent.action === 'format-paste')
             || (originalEvent.action === 'escape' && (this.previousAction === 'format-copy' || this.previousAction === 'format-paste'))) {
             if ((originalEvent.action === 'format-copy' || originalEvent.action === 'format-paste')) {
                 originalEvent.stopPropagation();
@@ -22905,6 +23041,9 @@ class EmojiPicker {
             spanElement = this.parent.element.ownerDocument.querySelector('.e-emoji');
         }
         this.divElement = spanElement.closest('div');
+        if (!(this.parent.inputElement.contains(this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument()).startContainer))) {
+            this.parent.contentModule.getEditPanel().focus();
+        }
         const range = this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument());
         this.save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());
         this.clickEvent = args.args;
@@ -23544,7 +23683,8 @@ class EmojiPicker {
     }
     onkeyPress(e) {
         const originalEvent = e.args;
-        const selection = this.parent.contentModule.getDocument().getSelection();
+        const selection = (this.parent.iframeSettings.enable) ? this.parent.contentModule.getPanel().contentWindow.getSelection() :
+            this.parent.contentModule.getDocument().getSelection();
         if (selection.rangeCount <= 0) {
             return;
         }
@@ -23564,6 +23704,10 @@ class EmojiPicker {
         }
         if (originalEvent.keyCode === 32 && isPrevColon && this.popupObj) {
             removeClass([this.divElement], 'e-active');
+            const currentDocument = this.parent.iframeSettings.enable ? this.parent.contentModule.getPanel().ownerDocument : this.parent.contentModule.getDocument();
+            if (this.parent.showTooltip && !isNullOrUndefined(currentDocument.querySelector('.e-tooltip-wrap'))) {
+                this.parent.notify(destroyTooltip, { args: event });
+            }
             this.popupObj.hide();
         }
         if (this.popupObj && (originalEvent.keyCode === 37 || originalEvent.keyCode === 38 || originalEvent.keyCode === 39
@@ -23574,7 +23718,8 @@ class EmojiPicker {
     }
     onkeyUp(e) {
         const originalEvent = e.args;
-        const selection = this.parent.contentModule.getDocument().getSelection();
+        const selection = (this.parent.iframeSettings.enable) ? this.parent.contentModule.getPanel().contentWindow.getSelection() :
+            this.parent.contentModule.getDocument().getSelection();
         if (selection.rangeCount <= 0) {
             return;
         }
@@ -23600,7 +23745,7 @@ class EmojiPicker {
     }
     getCoordinates() {
         let coordinates;
-        const selection = this.parent.contentModule.getDocument().getSelection();
+        const selection = (this.parent.iframeSettings.enable) ? this.parent.contentModule.getPanel().contentWindow.getSelection() : window.getSelection();
         const range = selection.getRangeAt(0);
         let firstChild;
         if (range.startContainer.nodeName === 'P' || range.startContainer.nodeName === 'DIV') {
@@ -23889,7 +24034,7 @@ class Link {
                 pageY = (this.parent.iframeSettings.enable) ? window.pageYOffset + parentTop + args.clientY : args.pageY;
             }
             if (this.quickToolObj.linkQTBar) {
-                this.quickToolObj.linkQTBar.showPopup(pageX, pageY, range.endContainer);
+                this.quickToolObj.linkQTBar.showPopup(pageX, pageY, range.endContainer, 'link');
             }
         }
     }
@@ -23920,12 +24065,32 @@ class Link {
                 if (isPopupOpen) {
                     return;
                 }
-                this.showLinkQuickToolbar({
-                    args: args,
-                    isNotify: false,
-                    type: 'Links',
-                    elements: [args.target]
-                });
+                if (e.args.ctrlKey === false) {
+                    this.showLinkQuickToolbar({
+                        args: args,
+                        isNotify: false,
+                        type: 'Links',
+                        elements: [args.target]
+                    });
+                }
+                else {
+                    const selection = this.parent.formatter.editorManager.nodeSelection;
+                    const range = selection.getRange(this.parent.contentModule.getDocument());
+                    const args = {
+                        args: {
+                            item: {
+                                subCommand: 'OpenLink',
+                                command: 'Links',
+                                name: ''
+                            },
+                            originalEvent: e.args
+                        },
+                        selectNode: selection.getNodeCollection(range),
+                        selectParent: selection.getParentNodeCollection(range),
+                        selection: selection.save(range, this.parent.contentModule.getDocument())
+                    };
+                    this.parent.notify(openLink, args);
+                }
             }
             else {
                 this.hideLinkQuickToolbar();
@@ -23982,7 +24147,7 @@ class Link {
     }
     showDialog() {
         this.openDialog(false);
-        this.setCssClass({ cssClass: this.parent.cssClass });
+        this.setCssClass({ cssClass: this.parent.getCssClass() });
     }
     closeDialog() {
         if (this.dialogObj) {
@@ -24014,22 +24179,22 @@ class Link {
         const textPlace = this.i10n.getConstant('textPlaceholder');
         const title = this.i10n.getConstant('linkTitle');
         const linkDialogEle = this.parent.createElement('div', {
-            className: 'e-rte-link-dialog' + ' ' + this.parent.cssClass, id: this.rteID + '_rtelink'
+            className: 'e-rte-link-dialog' + this.parent.getCssClass(true), id: this.rteID + '_rtelink'
         });
         this.parent.element.appendChild(linkDialogEle);
         const linkContent = this.parent.createElement('div', {
-            className: 'e-rte-linkcontent' + ' ' + this.parent.cssClass, id: this.rteID + '_linkContent'
+            className: 'e-rte-linkcontent' + this.parent.getCssClass(true), id: this.rteID + '_linkContent'
         });
         const htmlTextbox = (this.parent.editorMode === 'HTML') ? '<label>' + linkTooltip +
-            '</label></div><div class="e-rte-field' + ' ' + this.parent.cssClass + '">' +
-            '<input type="text" data-role ="none" spellcheck="false" placeholder = "' + title + '"aria-label="' + this.i10n.getConstant('linkTitle') + '" class="e-input e-rte-linkTitle' + ' ' + this.parent.cssClass + '"></div>' +
-            '<div class="e-rte-label' + ' ' + this.parent.cssClass + '"></div>' + '<div class="e-rte-field' + ' ' + this.parent.cssClass + '">' +
-            '<input type="checkbox" class="e-rte-linkTarget' + ' ' + this.parent.cssClass + '"  data-role ="none"></div>' : '';
-        const content = '<div class="e-rte-label' + ' ' + this.parent.cssClass + '"><label>' + linkWebAddress + '</label></div>' + '<div class="e-rte-field' + ' ' + this.parent.cssClass + '">' +
-            '<input type="text" data-role ="none" spellcheck="false" placeholder="' + urlPlace + '"aria-label="' + this.i10n.getConstant('linkWebUrl') + '" class="e-input e-rte-linkurl' + ' ' + this.parent.cssClass + '"/></div>' +
-            '<div class="e-rte-label' + ' ' + this.parent.cssClass + '">' + '<label>' + linkDisplayText + '</label></div><div class="e-rte-field' + ' ' + this.parent.cssClass + '"> ' +
-            '<input type="text" data-role ="none" spellcheck="false" class="e-input e-rte-linkText' + ' ' + this.parent.cssClass + '"aria-label="' + this.i10n.getConstant('linkText') + '" placeholder="' + textPlace + '">' +
-            '</div><div class="e-rte-label' + ' ' + this.parent.cssClass + '">' + htmlTextbox;
+            '</label></div><div class="e-rte-field' + this.parent.getCssClass(true) + '">' +
+            '<input type="text" data-role ="none" spellcheck="false" placeholder = "' + title + '"aria-label="' + this.i10n.getConstant('linkTitle') + '" class="e-input e-rte-linkTitle' + this.parent.getCssClass(true) + '"></div>' +
+            '<div class="e-rte-label' + this.parent.getCssClass(true) + '"></div>' + '<div class="e-rte-field' + this.parent.getCssClass(true) + '">' +
+            '<input type="checkbox" class="e-rte-linkTarget' + this.parent.getCssClass(true) + '"  data-role ="none"></div>' : '';
+        const content = '<div class="e-rte-label' + this.parent.getCssClass(true) + '"><label>' + linkWebAddress + '</label></div>' + '<div class="e-rte-field' + this.parent.getCssClass(true) + '">' +
+            '<input type="text" data-role ="none" spellcheck="false" placeholder="' + urlPlace + '"aria-label="' + this.i10n.getConstant('linkWebUrl') + '" class="e-input e-rte-linkurl' + this.parent.getCssClass(true) + '"/></div>' +
+            '<div class="e-rte-label' + this.parent.getCssClass(true) + '">' + '<label>' + linkDisplayText + '</label></div><div class="e-rte-field' + this.parent.getCssClass(true) + '"> ' +
+            '<input type="text" data-role ="none" spellcheck="false" class="e-input e-rte-linkText' + this.parent.getCssClass(true) + '"aria-label="' + this.i10n.getConstant('linkText') + '" placeholder="' + textPlace + '">' +
+            '</div><div class="e-rte-label' + this.parent.getCssClass(true) + '">' + htmlTextbox;
         const contentElem = parseHtml(content);
         linkContent.appendChild(contentElem);
         const linkTarget = linkContent.querySelector('.e-rte-linkTarget');
@@ -24038,7 +24203,7 @@ class Link {
         const linkTitle = linkContent.querySelector('.e-rte-linkTitle');
         const linkOpenLabel = this.i10n.getConstant('linkOpenInNewWindow');
         this.checkBoxObj = new CheckBox({ label: linkOpenLabel, checked: true, enableRtl: this.parent.enableRtl,
-            cssClass: this.parent.cssClass });
+            cssClass: this.parent.getCssClass() });
         this.checkBoxObj.isStringTemplate = true;
         this.checkBoxObj.createElement = this.parent.createElement;
         this.checkBoxObj.appendTo(linkTarget);
@@ -24051,16 +24216,16 @@ class Link {
         const dialogModel = {
             header: this.i10n.getConstant('linkHeader'),
             content: linkContent,
-            cssClass: CLS_RTE_ELEMENTS + ' ' + this.parent.cssClass,
+            cssClass: CLS_RTE_ELEMENTS + this.parent.getCssClass(true),
             enableRtl: this.parent.enableRtl,
             locale: this.parent.locale,
             showCloseIcon: true, closeOnEscape: true, width: (Browser.isDevice) ? '290px' : '310px',
             isModal: Browser.isDevice,
             buttons: [{
                     click: this.insertlink.bind(selectObj),
-                    buttonModel: { content: linkInsert, cssClass: 'e-flat e-insertLink' + ' ' + this.parent.cssClass, isPrimary: true }
+                    buttonModel: { content: linkInsert, cssClass: 'e-flat e-insertLink' + this.parent.getCssClass(true), isPrimary: true }
                 },
-                { click: this.cancelDialog.bind(selectObj), buttonModel: { cssClass: 'e-flat' + ' ' + this.parent.cssClass, content: linkCancel } }],
+                { click: this.cancelDialog.bind(selectObj), buttonModel: { cssClass: 'e-flat' + this.parent.getCssClass(true), content: linkCancel } }],
             target: (Browser.isDevice) ? document.body : this.parent.element,
             animationSettings: { effect: 'None' },
             close: (event) => {
@@ -24560,18 +24725,18 @@ class Image$1 {
         this.resizeBtnInit();
         this.imgEle = e;
         addClass([this.imgEle], 'e-resize');
-        this.imgResizeDiv = this.parent.createElement('span', { className: 'e-img-resize' + ' ' + this.parent.cssClass, id: this.rteID + '_imgResize' });
+        this.imgResizeDiv = this.parent.createElement('span', { className: 'e-img-resize' + this.parent.getCssClass(true), id: this.rteID + '_imgResize' });
         this.imgResizeDiv.appendChild(this.parent.createElement('span', {
-            className: 'e-rte-imageboxmark e-rte-topLeft' + ' ' + this.parent.cssClass, styles: 'cursor: nwse-resize'
+            className: 'e-rte-imageboxmark e-rte-topLeft' + this.parent.getCssClass(true), styles: 'cursor: nwse-resize'
         }));
         this.imgResizeDiv.appendChild(this.parent.createElement('span', {
-            className: 'e-rte-imageboxmark e-rte-topRight' + ' ' + this.parent.cssClass, styles: 'cursor: nesw-resize'
+            className: 'e-rte-imageboxmark e-rte-topRight' + this.parent.getCssClass(true), styles: 'cursor: nesw-resize'
         }));
         this.imgResizeDiv.appendChild(this.parent.createElement('span', {
-            className: 'e-rte-imageboxmark e-rte-botLeft' + ' ' + this.parent.cssClass, styles: 'cursor: nesw-resize'
+            className: 'e-rte-imageboxmark e-rte-botLeft' + this.parent.getCssClass(true), styles: 'cursor: nesw-resize'
         }));
         this.imgResizeDiv.appendChild(this.parent.createElement('span', {
-            className: 'e-rte-imageboxmark e-rte-botRight' + ' ' + this.parent.cssClass, styles: 'cursor: nwse-resize'
+            className: 'e-rte-imageboxmark e-rte-botRight' + this.parent.getCssClass(true), styles: 'cursor: nwse-resize'
         }));
         if (Browser.isDevice) {
             addClass([this.imgResizeDiv], 'e-mob-rte');
@@ -24724,8 +24889,8 @@ class Image$1 {
                 img.removeAttribute('height');
             }
             else {
-                img.style.width = expectedX + 'px';
-                img.style.height = expectedX + 'px';
+                img.style.width = ((expectedX >= 15) ? expectedX : 15) + 'px';
+                img.style.height = ((expectedX >= 15) ? expectedX : 15) + 'px';
             }
         }
     }
@@ -24753,7 +24918,6 @@ class Image$1 {
                 this.setAspectRatio(this.imgEle, parseInt(width, 10), parseInt(height, 10), args);
                 this.resizeImgDupPos(this.imgEle);
                 this.imgResizePos(this.imgEle, this.imgResizeDiv);
-                this.parent.setContentHeight('', false);
             }
         });
     }
@@ -24768,7 +24932,7 @@ class Image$1 {
         else if (isNullOrUndefined(this.parent.insertImageSettings.maxHeight)) {
             this.imgEle.style.maxHeight = '';
         }
-        this.imgEle.style.maxWidth = this.parent.getInsertImgMaxWidth() + 'px';
+        this.imgEle.style.maxWidth = (closest(this.imgEle, 'ol,ul') != null ? this.parent.getInsertImgMaxWidth() - parseInt((getComputedStyle(closest(this.imgEle, 'ol,ul')).paddingLeft), 0) : this.parent.getInsertImgMaxWidth()) + 'px';
         const pageX = this.getPointX(e);
         const pageY = this.getPointY(e);
         const mouseX = (this.resizeBtnStat.botLeft || this.resizeBtnStat.topLeft) ? -(pageX - this.pageX) : (pageX - this.pageX);
@@ -24993,13 +25157,22 @@ class Image$1 {
                             }
                         }
                     }
-                    else if ((range.startContainer.nodeType === 1 &&
-                        range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_CAPINLINE))) {
-                        detach(range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_CAPINLINE));
-                    }
-                    else if (range.startContainer.nodeType === 1 &&
-                        range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_IMGBREAK)) {
-                        detach(range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_IMGBREAK));
+                    else if (range.startContainer.nodeType === 1) {
+                        if (range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_CAPINLINE)) {
+                            detach(range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_CAPINLINE));
+                        }
+                        else if (range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_IMGBREAK)) {
+                            detach(range.startContainer.querySelector('.' + CLS_CAPTION + '.' + CLS_IMGBREAK));
+                        }
+                        else if (range.startContainer.classList.contains('e-img-wrap') && closest(range.startContainer, '.' + CLS_CAPTION)) {
+                            const parentElem = range.startContainer.parentElement.parentElement;
+                            detach(closest(range.startContainer, '.' + CLS_CAPTION));
+                            if (parentElem && parentElem.textContent.trim() === '') {
+                                const brElem = this.parent.createElement('br');
+                                brElem.classList.add('e-rte-image-remove-focus');
+                                parentElem.appendChild(brElem);
+                            }
+                        }
                     }
                 }
                 break;
@@ -25056,7 +25229,7 @@ class Image$1 {
     }
     showDialog() {
         this.openDialog(false);
-        this.setCssClass({ cssClass: this.parent.cssClass });
+        this.setCssClass({ cssClass: this.parent.getCssClass() });
     }
     closeDialog() {
         if (this.dialogObj) {
@@ -25262,19 +25435,19 @@ class Image$1 {
         }
         this.imagDialog(e);
         if (!isNullOrUndefined(this.dialogObj)) {
-            const linkWrap = this.parent.createElement('div', { className: 'e-img-linkwrap' + ' ' + this.parent.cssClass });
+            const linkWrap = this.parent.createElement('div', { className: 'e-img-linkwrap' + this.parent.getCssClass(true) });
             const linkUrl = this.i10n.getConstant('linkurl');
-            const content = '<div class="e-rte-field' + ' ' + this.parent.cssClass + '">' +
-                '<input type="text" data-role ="none" class="e-input e-img-link' + ' ' + this.parent.cssClass + '" spellcheck="false" placeholder="' + linkUrl + '"/></div>' +
+            const content = '<div class="e-rte-field' + this.parent.getCssClass(true) + '">' +
+                '<input type="text" data-role ="none" class="e-input e-img-link' + this.parent.getCssClass(true) + '" spellcheck="false" placeholder="' + linkUrl + '"/></div>' +
                 '<div class="e-rte-label"></div>' + '<div class="e-rte-field">' +
-                '<input type="checkbox" class="e-rte-linkTarget' + ' ' + this.parent.cssClass + '"  data-role ="none"></div>';
+                '<input type="checkbox" class="e-rte-linkTarget' + this.parent.getCssClass(true) + '"  data-role ="none"></div>';
             const contentElem = parseHtml(content);
             linkWrap.appendChild(contentElem);
             const linkTarget = linkWrap.querySelector('.e-rte-linkTarget');
             const inputLink = linkWrap.querySelector('.e-img-link');
             const linkOpenLabel = this.i10n.getConstant('linkOpenInNewWindow');
             this.checkBoxObj = new CheckBox({
-                label: linkOpenLabel, checked: true, enableRtl: this.parent.enableRtl, cssClass: this.parent.cssClass,
+                label: linkOpenLabel, checked: true, enableRtl: this.parent.enableRtl, cssClass: this.parent.getCssClass(),
                 change: (e) => {
                     if (e.checked) {
                         target = '_blank';
@@ -25288,11 +25461,12 @@ class Image$1 {
             this.checkBoxObj.createElement = this.parent.createElement;
             this.checkBoxObj.appendTo(linkTarget);
             let target = this.checkBoxObj.checked ? '_blank' : null;
+            let imageLabel = this.checkBoxObj.checked ? this.i10n.getConstant('ImageLinkAriaLabel') : null;
             const linkUpdate = this.i10n.getConstant('dialogUpdate');
             const linkargs = {
                 args: e.args,
                 selfImage: this, selection: e.selection,
-                selectNode: e.selectNode, selectParent: e.selectParent, link: inputLink, target: target
+                selectNode: e.selectNode, selectParent: e.selectParent, link: inputLink, target: target, ariaLabel: imageLabel
             };
             this.dialogObj.setProperties({
                 height: 'inherit',
@@ -25305,7 +25479,7 @@ class Image$1 {
                             this.insertlink(linkargs);
                         },
                         buttonModel: {
-                            content: linkUpdate, cssClass: 'e-flat e-update-link' + ' ' + this.parent.cssClass, isPrimary: true
+                            content: linkUpdate, cssClass: 'e-flat e-update-link' + this.parent.getCssClass(true), isPrimary: true
                         }
                     }],
                 cssClass: this.dialogObj.cssClass + ' e-rte-img-link-dialog'
@@ -25330,13 +25504,13 @@ class Image$1 {
         this.imagDialog(e);
         const altText = this.i10n.getConstant('altText');
         if (!isNullOrUndefined(this.dialogObj)) {
-            const altWrap = this.parent.createElement('div', { className: 'e-img-altwrap' + ' ' + this.parent.cssClass });
+            const altWrap = this.parent.createElement('div', { className: 'e-img-altwrap' + this.parent.getCssClass(true) });
             const altHeader = this.i10n.getConstant('alternateHeader');
             const linkUpdate = this.i10n.getConstant('dialogUpdate');
             const getAlt = (e.selectNode[0].getAttribute('alt') === null) ? '' :
                 e.selectNode[0].getAttribute('alt');
-            const content = '<div class="e-rte-field' + ' ' + this.parent.cssClass + '">' +
-                '<input type="text" spellcheck="false"  class="e-input e-img-alt' + ' ' + this.parent.cssClass + '" placeholder="' + altText + '"/>' +
+            const content = '<div class="e-rte-field' + this.parent.getCssClass(true) + '">' +
+                '<input type="text" spellcheck="false"  class="e-input e-img-alt' + this.parent.getCssClass(true) + '" placeholder="' + altText + '"/>' +
                 '</div>';
             const contentElem = parseHtml(content);
             contentElem.querySelector('input').setAttribute('value', getAlt);
@@ -25354,7 +25528,7 @@ class Image$1 {
                             this.insertAlt(altArgs);
                         },
                         buttonModel: {
-                            content: linkUpdate, cssClass: 'e-flat e-update-alt' + ' ' + this.parent.cssClass, isPrimary: true
+                            content: linkUpdate, cssClass: 'e-flat e-update-alt' + this.parent.getCssClass(true), isPrimary: true
                         }
                     }],
                 cssClass: this.dialogObj.cssClass + ' e-rte-img-alt-dialog'
@@ -25406,14 +25580,14 @@ class Image$1 {
         }
         if (e.selectNode[0].parentElement.nodeName === 'A') {
             proxy.parent.formatter.process(proxy.parent, e.args, e.args, {
-                url: url, target: proxy.checkBoxObj.checked ? '_blank' : null, selectNode: e.selectNode,
+                url: url, target: proxy.checkBoxObj.checked ? '_blank' : null, ariaLabel: proxy.checkBoxObj.checked ? this.i10n.getConstant('ImageLinkAriaLabel') : null, selectNode: e.selectNode,
                 subCommand: e.args.item.subCommand
             });
             proxy.dialogObj.hide({ returnValue: true });
             return;
         }
         proxy.parent.formatter.process(proxy.parent, e.args, e.args, {
-            url: url, target: proxy.checkBoxObj.checked ? '_blank' : null, selectNode: e.selectNode,
+            url: url, target: proxy.checkBoxObj.checked ? '_blank' : null, ariaLabel: proxy.checkBoxObj.checked ? this.i10n.getConstant('ImageLinkAriaLabel') : null, selectNode: e.selectNode,
             subCommand: e.args.item.subCommand, selection: e.selection
         });
         const captionEle = closest(e.selectNode[0], '.e-img-caption');
@@ -25524,11 +25698,11 @@ class Image$1 {
         }
         else {
             this.captionEle = this.parent.createElement('span', {
-                className: CLS_CAPTION + ' ' + CLS_RTE_CAPTION + ' ' + this.parent.cssClass,
+                className: CLS_CAPTION + ' ' + CLS_RTE_CAPTION + this.parent.getCssClass(true),
                 attrs: { contenteditable: 'false', draggable: 'false', style: 'width:' + this.parent.insertImageSettings.width }
             });
-            const imgWrap = this.parent.createElement('span', { className: 'e-img-wrap' + ' ' + this.parent.cssClass });
-            const imgInner = this.parent.createElement('span', { className: 'e-img-inner' + ' ' + this.parent.cssClass,
+            const imgWrap = this.parent.createElement('span', { className: 'e-img-wrap' + this.parent.getCssClass(true) });
+            const imgInner = this.parent.createElement('span', { className: 'e-img-inner' + this.parent.getCssClass(true),
                 attrs: { contenteditable: 'true' } });
             const parent = e.selectNode[0].parentElement;
             if (parent.tagName === 'A') {
@@ -25580,7 +25754,7 @@ class Image$1 {
                             this.insertSize(selectObj);
                         },
                         buttonModel: {
-                            content: linkUpdate, cssClass: 'e-flat e-update-size' + ' ' + this.parent.cssClass, isPrimary: true
+                            content: linkUpdate, cssClass: 'e-flat e-update-size' + this.parent.getCssClass(true), isPrimary: true
                         }
                     }],
                 cssClass: this.dialogObj.cssClass + ' e-rte-img-size-dialog'
@@ -25625,7 +25799,7 @@ class Image$1 {
             this.dialogObj.hide({ returnValue: true });
             return;
         }
-        const imgDialog = this.parent.createElement('div', { className: 'e-rte-img-dialog' + ' ' + this.parent.cssClass, id: this.rteID + '_image' });
+        const imgDialog = this.parent.createElement('div', { className: 'e-rte-img-dialog' + this.parent.getCssClass(true), id: this.rteID + '_image' });
         this.parent.element.appendChild(imgDialog);
         const imgInsert = this.i10n.getConstant('dialogInsert');
         const imglinkCancel = this.i10n.getConstant('dialogCancel');
@@ -25634,20 +25808,20 @@ class Image$1 {
         const selectObj = { selfImage: this, selection: e.selection, args: e.args, selectParent: e.selectParent };
         const dialogModel = {
             header: imgHeader,
-            cssClass: CLS_RTE_ELEMENTS + ' ' + this.parent.cssClass,
+            cssClass: CLS_RTE_ELEMENTS + this.parent.getCssClass(true),
             enableRtl: this.parent.enableRtl,
             locale: this.parent.locale,
             showCloseIcon: true, closeOnEscape: true, width: (Browser.isDevice) ? '290px' : '340px',
             isModal: Browser.isDevice,
             buttons: [{
                     click: this.insertImageUrl.bind(selectObj),
-                    buttonModel: { content: imgInsert, cssClass: 'e-flat e-insertImage' + ' ' + this.parent.cssClass, isPrimary: true, disabled: true }
+                    buttonModel: { content: imgInsert, cssClass: 'e-flat e-insertImage' + this.parent.getCssClass(true), isPrimary: true, disabled: true }
                 },
                 {
                     click: (e) => {
                         this.cancelDialog(e);
                     },
-                    buttonModel: { cssClass: 'e-flat e-cancel' + ' ' + this.parent.cssClass, content: imglinkCancel }
+                    buttonModel: { cssClass: 'e-flat e-cancel' + this.parent.getCssClass(true), content: imglinkCancel }
                 }],
             target: (Browser.isDevice) ? document.body : this.parent.element,
             animationSettings: { effect: 'None' },
@@ -25670,12 +25844,12 @@ class Image$1 {
                 this.dialogObj = null;
             }
         };
-        const dialogContent = this.parent.createElement('div', { className: 'e-img-content' + ' ' + this.parent.cssClass });
+        const dialogContent = this.parent.createElement('div', { className: 'e-img-content' + this.parent.getCssClass(true) });
         if ((!isNullOrUndefined(this.parent.insertImageSettings.path) && this.parent.editorMode === 'Markdown')
             || this.parent.editorMode === 'HTML') {
             dialogContent.appendChild(this.imgUpload(e));
         }
-        const linkHeader = this.parent.createElement('div', { className: 'e-linkheader' + ' ' + this.parent.cssClass });
+        const linkHeader = this.parent.createElement('div', { className: 'e-linkheader' + this.parent.getCssClass(true) });
         const linkHeaderText = this.i10n.getConstant('imageLinkHeader');
         if (this.parent.editorMode === 'HTML') {
             linkHeader.innerHTML = linkHeaderText;
@@ -25791,10 +25965,10 @@ class Image$1 {
     }
     // eslint-disable-next-line
     imageUrlPopup(e) {
-        const imgUrl = this.parent.createElement('div', { className: 'imgUrl' + ' ' + this.parent.cssClass });
+        const imgUrl = this.parent.createElement('div', { className: 'imgUrl' + this.parent.getCssClass(true) });
         const placeUrl = this.i10n.getConstant('imageUrl');
         this.inputUrl = this.parent.createElement('input', {
-            className: 'e-input e-img-url' + ' ' + this.parent.cssClass,
+            className: 'e-input e-img-url' + this.parent.getCssClass(true),
             attrs: { placeholder: placeUrl, spellcheck: 'false', 'aria-label': this.i10n.getConstant('imageLinkHeader') }
         });
         this.inputUrl.addEventListener('input', () => {
@@ -25860,7 +26034,7 @@ class Image$1 {
         const selectNode = e.selectNode[0];
         const imgHeight = this.i10n.getConstant('imageHeight');
         const imgWidth = this.i10n.getConstant('imageWidth');
-        const imgSizeWrap = this.parent.createElement('div', { className: 'e-img-sizewrap' + ' ' + this.parent.cssClass });
+        const imgSizeWrap = this.parent.createElement('div', { className: 'e-img-sizewrap' + this.parent.getCssClass(true) });
         const widthVal = isNullOrUndefined(this.changedWidthValue) && (selectNode.style.width.toString() === 'auto' ||
             selectNode.style.width !== '') ? selectNode.style.width : !isNullOrUndefined(this.changedWidthValue) ?
             this.changedWidthValue : (parseInt(selectNode.getClientRects()[0].width.toString(), 10)).toString();
@@ -25869,10 +26043,10 @@ class Image$1 {
             this.changedHeightValue : (parseInt(selectNode.getClientRects()[0].height.toString(), 10)).toString();
         this.changedWidthValue = null;
         this.changedHeightValue = null;
-        const content = '<div class="e-rte-label' + ' ' + this.parent.cssClass + '"><label>' + imgWidth +
-            '</label></div><div class="e-rte-field' + ' ' + this.parent.cssClass + '"><input type="text" id="imgwidth" class="e-img-width' + ' ' + this.parent.cssClass + '/></div>' +
-            '<div class="e-rte-label' + ' ' + this.parent.cssClass + '">' + '<label>' + imgHeight + '</label></div><div class="e-rte-field' + ' ' + this.parent.cssClass + '"> ' +
-            '<input type="text" id="imgheight" class="e-img-height' + ' ' + this.parent.cssClass + '"/></div>';
+        const content = '<div class="e-rte-label' + this.parent.getCssClass(true) + '"><label>' + imgWidth +
+            '</label></div><div class="e-rte-field' + this.parent.getCssClass(true) + '"><input type="text" id="imgwidth" class="e-img-width' + this.parent.getCssClass(true) + '"/></div>' +
+            '<div class="e-rte-label' + this.parent.getCssClass(true) + '">' + '<label>' + imgHeight + '</label></div><div class="e-rte-field' + this.parent.getCssClass(true) + '"> ' +
+            '<input type="text" id="imgheight" class="e-img-height' + this.parent.getCssClass(true) + '"/></div>';
         const contentElem = parseHtml(content);
         contentElem.getElementById('imgwidth').setAttribute('value', widthVal);
         contentElem.getElementById('imgheight').setAttribute('value', heightVal);
@@ -25880,7 +26054,7 @@ class Image$1 {
         this.widthNum = new TextBox({
             value: formatUnit(widthVal),
             enableRtl: this.parent.enableRtl,
-            cssClass: this.parent.cssClass,
+            cssClass: this.parent.getCssClass(),
             input: (e) => {
                 this.inputWidthValue = formatUnit(this.inputValue(e.value));
             }
@@ -25890,7 +26064,7 @@ class Image$1 {
         this.heightNum = new TextBox({
             value: formatUnit(heightVal),
             enableRtl: this.parent.enableRtl,
-            cssClass: this.parent.cssClass,
+            cssClass: this.parent.getCssClass(),
             input: (e) => {
                 this.inputHeightValue = formatUnit(this.inputValue(e.value));
             }
@@ -25961,16 +26135,16 @@ class Image$1 {
             save = e.selection;
             selectParent = e.selectParent;
         }
-        const uploadParentEle = this.parent.createElement('div', { className: 'e-img-uploadwrap e-droparea' + ' ' + this.parent.cssClass });
+        const uploadParentEle = this.parent.createElement('div', { className: 'e-img-uploadwrap e-droparea' + this.parent.getCssClass(true) });
         const deviceImgUpMsg = this.i10n.getConstant('imageDeviceUploadMessage');
         const imgUpMsg = this.i10n.getConstant('imageUploadMessage');
-        const span = this.parent.createElement('span', { className: 'e-droptext' + ' ' + this.parent.cssClass });
+        const span = this.parent.createElement('span', { className: 'e-droptext' + this.parent.getCssClass(true) });
         const spanMsg = this.parent.createElement('span', {
-            className: 'e-rte-upload-text' + ' ' + this.parent.cssClass, innerHTML: ((Browser.isDevice) ? deviceImgUpMsg : imgUpMsg)
+            className: 'e-rte-upload-text' + this.parent.getCssClass(true), innerHTML: ((Browser.isDevice) ? deviceImgUpMsg : imgUpMsg)
         });
         span.appendChild(spanMsg);
         const btnEle = this.parent.createElement('button', {
-            className: 'e-browsebtn' + ' ' + this.parent.cssClass, id: this.rteID + '_insertImage', attrs: { autofocus: 'true', type: 'button' }
+            className: 'e-browsebtn' + this.parent.getCssClass(true), id: this.rteID + '_insertImage', attrs: { autofocus: 'true', type: 'button' }
         });
         span.appendChild(btnEle);
         uploadParentEle.appendChild(span);
@@ -25982,7 +26156,7 @@ class Image$1 {
         const btnClick = (Browser.isDevice) ? span : btnEle;
         EventHandler.add(btnClick, 'click', this.fileSelect, this);
         const uploadEle = this.parent.createElement('input', {
-            id: this.rteID + '_upload', attrs: { type: 'File', name: 'UploadFiles' }, className: this.parent.cssClass
+            id: this.rteID + '_upload', attrs: { type: 'File', name: 'UploadFiles' }, className: this.parent.getCssClass()
         });
         uploadParentEle.appendChild(uploadEle);
         let altText;
@@ -25990,7 +26164,7 @@ class Image$1 {
         let filesData;
         this.uploadObj = new Uploader({
             asyncSettings: { saveUrl: this.parent.insertImageSettings.saveUrl, removeUrl: this.parent.insertImageSettings.removeUrl },
-            dropArea: span, multiple: false, enableRtl: this.parent.enableRtl, cssClass: this.parent.cssClass,
+            dropArea: span, multiple: false, enableRtl: this.parent.enableRtl, cssClass: this.parent.getCssClass(),
             allowedExtensions: this.parent.insertImageSettings.allowedTypes.toString(),
             selected: (e) => {
                 proxy.isImgUploaded = true;
@@ -26063,9 +26237,9 @@ class Image$1 {
             failure: (e) => {
                 this.parent.trigger(imageUploadFailed, e);
             },
-            removing: () => {
+            removing: (removeEventArgs) => {
                 // eslint-disable-next-line
-                this.parent.trigger(imageRemoving, e, (e) => {
+                this.parent.trigger(imageRemoving, removeEventArgs, (e) => {
                     proxy.isImgUploaded = false;
                     this.dialogObj.getButtons(0).element.disabled = true;
                     proxy.inputUrl.removeAttribute('disabled');
@@ -26350,7 +26524,7 @@ class Image$1 {
                 saveUrl: this.parent.insertImageSettings.saveUrl,
                 removeUrl: this.parent.insertImageSettings.removeUrl
             },
-            cssClass: CLS_RTE_DIALOG_UPLOAD + ' ' + this.parent.cssClass,
+            cssClass: CLS_RTE_DIALOG_UPLOAD + this.parent.getCssClass(true),
             dropArea: this.parent.element,
             allowedExtensions: this.parent.insertImageSettings.allowedTypes.toString(),
             removing: () => {
@@ -26553,10 +26727,10 @@ class Image$1 {
      */
     /* eslint-enable */
     destroy() {
-        this.prevSelectedImgEle = undefined;
         if (isNullOrUndefined(this.parent)) {
             return;
         }
+        this.prevSelectedImgEle = undefined;
         this.removeEventListener();
     }
     moduleDestroy() {
@@ -28846,7 +29020,7 @@ class ViewSource {
         this.parent.formatter.editorManager.observer.off(KEY_DOWN_HANDLER, this.onKeyDown);
     }
     getSourceCode() {
-        return this.parent.createElement('textarea', { className: CLS_RTE_SOURCE_CODE_TXTAREA + ' ' + this.parent.cssClass });
+        return this.parent.createElement('textarea', { className: CLS_RTE_SOURCE_CODE_TXTAREA + this.parent.getCssClass(true) });
     }
     wireEvent(element) {
         this.keyboardModule = new KeyboardEvents$1(element, {
@@ -28943,8 +29117,10 @@ class ViewSource {
             this.getPanel().style.display = 'block';
         }
         else {
+            const height = this.parent.inputElement.offsetHeight;
             this.contentModule.getPanel().appendChild(this.previewElement);
             this.getPanel().value = this.getTextAreaValue();
+            this.previewElement.style.height = height + 'px';
             this.contentModule.getEditPanel().style.display = 'none';
             this.previewElement.style.display = 'block';
         }
@@ -29106,6 +29282,7 @@ class Table {
         this.parent.on(showTableDialog, this.showDialog, this);
         this.parent.on(closeTableDialog, this.closeDialog, this);
         this.parent.on(docClick, this.docClick, this);
+        this.parent.on(iframeMouseDown, this.onIframeMouseDown, this);
         this.parent.on(editAreaClick, this.editAreaClickHandler, this);
         this.parent.on(clearDialogObj, this.clearDialogObj, this);
         this.parent.on(tableToolbarAction, this.onToolbarAction, this);
@@ -29126,6 +29303,7 @@ class Table {
         this.parent.off(initialEnd, this.afterRender);
         this.parent.off(dynamicModule, this.afterRender);
         this.parent.off(docClick, this.docClick);
+        this.parent.off(iframeMouseDown, this.onIframeMouseDown);
         this.parent.off(showTableDialog, this.showDialog);
         this.parent.off(closeTableDialog, this.closeDialog);
         this.parent.off(editAreaClick, this.editAreaClickHandler);
@@ -29134,8 +29312,8 @@ class Table {
         this.parent.off(dropDownSelect, this.dropdownSelect);
         this.parent.off(mouseDown, this.cellSelect);
         this.parent.off(tableColorPickerChanged, this.setBGColor);
-        this.parent.off(keyUp, this.keyUp);
         this.parent.off(keyDown, this.keyDown);
+        this.parent.off(keyUp, this.keyUp);
         this.parent.off(mouseUp, this.selectionTable);
         this.parent.off(tableModulekeyUp, this.tableModulekeyUp);
         this.parent.off(bindCssClass, this.setCssClass);
@@ -29331,11 +29509,12 @@ class Table {
                 name: !isInternal ? 'showDialog' : null
             };
             this.insertTableDialog({ self: this, args: args, selection: selection });
+            this.parent.formatter.editorManager.nodeSelection.restore();
         }
     }
     showDialog() {
         this.openDialog(false);
-        this.setCssClass({ cssClass: this.parent.cssClass });
+        this.setCssClass({ cssClass: this.parent.getCssClass() });
     }
     closeDialog() {
         if (this.editdlgObj) {
@@ -29525,6 +29704,10 @@ class Table {
     tableHeader(selection, e) {
         this.parent.formatter.process(this.parent, e, e.originalEvent, { selection: selection, subCommand: e.item.subCommand });
     }
+    getAnchorNode(element) {
+        const selectParent = closest(element, 'a');
+        return (selectParent ? selectParent : element);
+    }
     editAreaClickHandler(e) {
         if (this.parent.readonly || !isNullOrUndefined(closest(e.args.target, '.e-img-caption'))) {
             return;
@@ -29546,7 +29729,8 @@ class Table {
             const closestTable = closest(target, 'table');
             const startNode = this.parent.getRange().startContainer.parentElement;
             const endNode = this.parent.getRange().endContainer.parentElement;
-            if (target && target.nodeName !== 'A' && target.nodeName !== 'IMG' && target.nodeName !== 'VIDEO' && !target.classList.contains(CLS_CLICKELEM) &&
+            const isAnchorEle = this.getAnchorNode(target);
+            if (target && target.nodeName !== 'A' && isAnchorEle.nodeName !== 'A' && target.nodeName !== 'IMG' && target.nodeName !== 'VIDEO' && !target.classList.contains(CLS_CLICKELEM) &&
                 target.nodeName !== 'AUDIO' && startNode === endNode && (target.nodeName === 'TD' || target.nodeName === 'TH' ||
                 target.nodeName === 'TABLE' || (closestTable && this.parent.contentModule.getEditPanel().contains(closestTable)))
                 && !(range.startContainer.nodeType === 3 && !range.collapsed)) {
@@ -29732,7 +29916,7 @@ class Table {
             this.contentModule.getEditPanel().appendChild(rowReEle);
         }
         const tableReBox = this.parent.createElement('span', {
-            className: CLS_TB_BOX_RES + ' ' + this.parent.cssClass, attrs: {
+            className: CLS_TB_BOX_RES + this.parent.getCssClass(true), attrs: {
                 'data-col': columns.length.toString(), 'unselectable': 'on', 'contenteditable': 'false'
             }
         });
@@ -29884,7 +30068,7 @@ class Table {
     }
     appendHelper() {
         this.helper = this.parent.createElement('div', {
-            className: 'e-table-rhelper' + ' ' + this.parent.cssClass
+            className: 'e-table-rhelper' + this.parent.getCssClass(true)
         });
         if (Browser.isDevice) {
             this.helper.classList.add('e-reicon');
@@ -30243,16 +30427,16 @@ class Table {
         this.hideTableQuickToolbar();
         const header = '1X1';
         const insertbtn = this.l10n.getConstant('inserttablebtn');
-        this.dlgDiv = this.parent.createElement('div', { className: 'e-rte-table-popup' + ' ' + this.parent.cssClass, id: this.rteID + '_table' });
-        this.tblHeader = this.parent.createElement('div', { className: 'e-rte-popup-header' + ' ' + this.parent.cssClass });
+        this.dlgDiv = this.parent.createElement('div', { className: 'e-rte-table-popup' + this.parent.getCssClass(true), id: this.rteID + '_table' });
+        this.tblHeader = this.parent.createElement('div', { className: 'e-rte-popup-header' + this.parent.getCssClass(true) });
         this.tblHeader.innerHTML = header;
         this.dlgDiv.appendChild(this.tblHeader);
-        const tableDiv = this.parent.createElement('div', { className: 'e-rte-table-span' + ' ' + this.parent.cssClass });
+        const tableDiv = this.parent.createElement('div', { className: 'e-rte-table-span' + this.parent.getCssClass(true) });
         this.drawTable(tableDiv, args);
         this.dlgDiv.appendChild(tableDiv);
-        this.dlgDiv.appendChild(this.parent.createElement('span', { className: 'e-span-border' + ' ' + this.parent.cssClass }));
+        this.dlgDiv.appendChild(this.parent.createElement('span', { className: 'e-span-border' + this.parent.getCssClass(true) }));
         const btnEle = this.parent.createElement('button', {
-            className: 'e-insert-table-btn' + ' ' + this.parent.cssClass, id: this.rteID + '_insertTable',
+            className: 'e-insert-table-btn' + this.parent.getCssClass(true), id: this.rteID + '_insertTable',
             attrs: { type: 'button', tabindex: '0' }
         });
         if (!isNullOrUndefined(this.parent.getToolbarElement().querySelector('.e-expended-nav'))) {
@@ -30260,7 +30444,7 @@ class Table {
         }
         this.dlgDiv.appendChild(btnEle);
         this.createTableButton = new Button({
-            iconCss: 'e-icons e-create-table', content: insertbtn, cssClass: 'e-flat' + ' ' + this.parent.cssClass,
+            iconCss: 'e-icons e-create-table', content: insertbtn, cssClass: 'e-flat' + this.parent.getCssClass(true),
             enableRtl: this.parent.enableRtl, locale: this.parent.locale
         });
         this.createTableButton.isStringTemplate = true;
@@ -30288,10 +30472,15 @@ class Table {
         });
         addClass([this.popupObj.element], 'e-popup-open');
         if (!isNullOrUndefined(this.parent.cssClass)) {
-            addClass([this.popupObj.element], this.parent.cssClass);
+            addClass([this.popupObj.element], this.parent.getCssClass());
         }
         this.popupObj.refreshPosition(target);
     }
+    onIframeMouseDown() {
+        if (this.popupObj) {
+            this.popupObj.hide();
+        }
+    }
     docClick(e) {
         const target = e.args.target;
         // eslint-disable-next-line
@@ -30328,10 +30517,10 @@ class Table {
         let rowDiv;
         let tableCell;
         for (let row = 0; row < 3; row++) {
-            rowDiv = this.parent.createElement('div', { className: 'e-rte-table-row' + ' ' + this.parent.cssClass, attrs: { 'data-column': '' + row } });
+            rowDiv = this.parent.createElement('div', { className: 'e-rte-table-row' + this.parent.getCssClass(true), attrs: { 'data-column': '' + row } });
             for (let col = 0; col < 10; col++) {
                 const display = (row > 2) ? 'none' : 'inline-block';
-                tableCell = this.parent.createElement('div', { className: 'e-rte-tablecell e-default' + ' ' + this.parent.cssClass, attrs: { 'data-cell': '' + col } });
+                tableCell = this.parent.createElement('div', { className: 'e-rte-tablecell e-default' + this.parent.getCssClass(true), attrs: { 'data-cell': '' + col } });
                 rowDiv.appendChild(tableCell);
                 tableCell.style.display = display;
                 if (col === 0 && row === 0) {
@@ -30354,13 +30543,13 @@ class Table {
             height: 'initial', width: '290px', content: editContent, header: editHeader,
             buttons: [{
                     click: this.applyProperties.bind(this, args),
-                    buttonModel: { content: update, cssClass: 'e-flat e-size-update' + ' ' + this.parent.cssClass, isPrimary: true }
+                    buttonModel: { content: update, cssClass: 'e-flat e-size-update' + this.parent.getCssClass(true), isPrimary: true }
                 },
                 {
                     click: (e) => {
                         this.cancelDialog(e);
                     },
-                    buttonModel: { cssClass: 'e-flat e-cancel' + ' ' + this.parent.cssClass, content: cancel }
+                    buttonModel: { cssClass: 'e-flat e-cancel' + this.parent.getCssClass(true), content: cancel }
                 }],
             cssClass: this.editdlgObj.cssClass + ' e-rte-edit-table-prop-dialog'
         });
@@ -30402,10 +30591,10 @@ class Table {
     tableCellDlgContent() {
         const tableColumn = this.l10n.getConstant('columns');
         const tableRow = this.l10n.getConstant('rows');
-        const tableWrap = this.parent.createElement('div', { className: 'e-cell-wrap' + ' ' + this.parent.cssClass });
-        const content = '<div class="e-rte-field' + ' ' + this.parent.cssClass + '"><input type="text" '
-            + ' data-role ="none" id="tableColumn" class="e-table-column' + ' ' + this.parent.cssClass + '"/></div>'
-            + '<div class="e-rte-field' + ' ' + this.parent.cssClass + '"><input type="text" data-role ="none" id="tableRow" class="e-table-row' + ' ' + this.parent.cssClass + '" /></div>';
+        const tableWrap = this.parent.createElement('div', { className: 'e-cell-wrap' + this.parent.getCssClass(true) });
+        const content = '<div class="e-rte-field' + this.parent.getCssClass(true) + '"><input type="text" '
+            + ' data-role ="none" id="tableColumn" class="e-table-column' + this.parent.getCssClass(true) + '"/></div>'
+            + '<div class="e-rte-field' + this.parent.getCssClass(true) + '"><input type="text" data-role ="none" id="tableRow" class="e-table-row' + this.parent.getCssClass(true) + '" /></div>';
         const contentElem = parseHtml(content);
         tableWrap.appendChild(contentElem);
         this.columnTextBox = new NumericTextBox({
@@ -30416,7 +30605,7 @@ class Table {
             floatLabelType: 'Auto',
             max: 50,
             enableRtl: this.parent.enableRtl, locale: this.parent.locale,
-            cssClass: this.parent.cssClass
+            cssClass: this.parent.getCssClass()
         });
         this.columnTextBox.isStringTemplate = true;
         this.columnTextBox.appendTo(tableWrap.querySelector('#tableColumn'));
@@ -30428,7 +30617,7 @@ class Table {
             floatLabelType: 'Auto',
             max: 1000,
             enableRtl: this.parent.enableRtl, locale: this.parent.locale,
-            cssClass: this.parent.cssClass
+            cssClass: this.parent.getCssClass()
         });
         this.rowTextBox.isStringTemplate = true;
         this.rowTextBox.appendTo(tableWrap.querySelector('#tableRow'));
@@ -30448,7 +30637,7 @@ class Table {
             return;
         }
         const tableDialog = this.parent.createElement('div', {
-            className: 'e-rte-edit-table' + ' ' + this.parent.cssClass, id: this.rteID + '_tabledialog'
+            className: 'e-rte-edit-table' + this.parent.getCssClass(true), id: this.rteID + '_tabledialog'
         });
         this.parent.element.appendChild(tableDialog);
         const insert = this.l10n.getConstant('dialogInsert');
@@ -30456,20 +30645,20 @@ class Table {
         const header = this.l10n.getConstant('tabledialogHeader');
         const dialogModel = {
             header: header,
-            cssClass: CLS_RTE_ELEMENTS + ' ' + this.parent.cssClass,
+            cssClass: CLS_RTE_ELEMENTS + this.parent.getCssClass(true),
             enableRtl: this.parent.enableRtl,
             locale: this.parent.locale,
             showCloseIcon: true, closeOnEscape: true, width: (Browser.isDevice) ? '290px' : '340px', height: 'initial',
             position: { X: 'center', Y: (Browser.isDevice) ? 'center' : 'top' },
             isModal: Browser.isDevice,
             buttons: [{
-                    buttonModel: { content: insert, cssClass: 'e-flat e-insert-table' + ' ' + this.parent.cssClass, isPrimary: true }
+                    buttonModel: { content: insert, cssClass: 'e-flat e-insert-table' + this.parent.getCssClass(true), isPrimary: true }
                 },
                 {
                     click: (e) => {
                         this.cancelDialog(e);
                     },
-                    buttonModel: { cssClass: 'e-flat e-cancel' + ' ' + this.parent.cssClass, content: cancel }
+                    buttonModel: { cssClass: 'e-flat e-cancel' + this.parent.getCssClass(true), content: cancel }
                 }],
             target: (Browser.isDevice) ? document.body : this.parent.element,
             animationSettings: { effect: 'None' },
@@ -30542,13 +30731,13 @@ class Table {
         const tableWidth = this.l10n.getConstant('tableWidth');
         const cellPadding = this.l10n.getConstant('cellpadding');
         const cellSpacing = this.l10n.getConstant('cellspacing');
-        const tableWrap = this.parent.createElement('div', { className: 'e-table-sizewrap' + ' ' + this.parent.cssClass });
+        const tableWrap = this.parent.createElement('div', { className: 'e-table-sizewrap' + this.parent.getCssClass(true) });
         const widthVal = closest(selectNode, 'table').getClientRects()[0].width;
         const padVal = closest(selectNode, 'td').style.padding;
         const brdSpcVal = closest(selectNode, 'table').getAttribute('cellspacing');
-        const content = '<div class="e-rte-field' + ' ' + this.parent.cssClass + '"><input type="text" data-role ="none" id="tableWidth" class="e-table-width' + ' ' + this.parent.cssClass + '" '
-            + ' /></div>' + '<div class="e-rte-field' + ' ' + this.parent.cssClass + '"><input type="text" data-role ="none" id="cellPadding" class="e-cell-padding' + ' ' + this.parent.cssClass + '" />'
-            + ' </div><div class="e-rte-field' + ' ' + this.parent.cssClass + '"><input type="text" data-role ="none" id="cellSpacing" class="e-cell-spacing' + ' ' + this.parent.cssClass + '" /></div>';
+        const content = '<div class="e-rte-field' + this.parent.getCssClass(true) + '"><input type="text" data-role ="none" id="tableWidth" class="e-table-width' + this.parent.getCssClass(true) + '" '
+            + ' /></div>' + '<div class="e-rte-field' + this.parent.getCssClass(true) + '"><input type="text" data-role ="none" id="cellPadding" class="e-cell-padding' + this.parent.getCssClass(true) + '" />'
+            + ' </div><div class="e-rte-field' + this.parent.getCssClass(true) + '"><input type="text" data-role ="none" id="cellSpacing" class="e-cell-spacing' + this.parent.getCssClass(true) + '" /></div>';
         const contentElem = parseHtml(content);
         tableWrap.appendChild(contentElem);
         this.tableWidthNum = new NumericTextBox({
@@ -30694,7 +30883,16 @@ class DialogRenderer {
     getDialogPosition() {
         let distanceFromVisibleTop = this.parent.element.getBoundingClientRect().top;
         if (distanceFromVisibleTop < 0) {
-            distanceFromVisibleTop = Math.abs(distanceFromVisibleTop);
+            let topHeight = 0;
+            let parentElement = this.parent.element;
+            while (parentElement.nodeName !== 'BODY') {
+                const top = parentElement.getBoundingClientRect().top;
+                if (top > 0) {
+                    topHeight = top;
+                }
+                parentElement = parentElement.parentElement;
+            }
+            distanceFromVisibleTop = Math.abs(distanceFromVisibleTop) + topHeight;
             return distanceFromVisibleTop.toString();
         }
         else {
@@ -31591,7 +31789,8 @@ class EnterKeyAction {
                                     }
                                     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') && !(nearBlockNode.querySelectorAll('img').length > 0)) {
+                                else if (nearBlockNode.textContent.length === 0 && !(!isNullOrUndefined(nearBlockNode.childNodes[0]) && nearBlockNode.childNodes[0].nodeName === 'IMG' ||
+                                    (nearBlockNode.querySelectorAll('video').length > 0) || (nearBlockNode.querySelectorAll('audio').length > 0) || (nearBlockNode.querySelectorAll('img').length > 0))) {
                                     if (!isNullOrUndefined(nearBlockNode.children[0]) && nearBlockNode.children[0].tagName !== 'BR') {
                                         const newElem = this.parent.formatter.editorManager.nodeCutter.SplitNode(this.range, nearBlockNode, false).cloneNode(true);
                                         this.parent.formatter.editorManager.domNode.insertAfter(newElem, nearBlockNode);
@@ -32185,7 +32384,7 @@ let RichTextEditor = class RichTextEditor extends Component {
             if (tool.command === 'InsertText') {
                 currentInsertContentLength = value.length;
             }
-            const currentLength = this.getText().trim().length;
+            const currentLength = this.getText().trim().replace(/(\r\n|\n|\r)/gm, '').replace(/\u200B/g, '').length;
             const selectionLength = this.getSelection().length;
             const totalLength = (currentLength - selectionLength) + currentInsertContentLength;
             if (!(this.maxLength === -1 || totalLength <= this.maxLength)) {
@@ -32360,7 +32559,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         if (this.enableXhtml) {
             this.setProperties({ value: this.getXhtml() }, true);
         }
-        if (this.toolbarSettings.enable && this.toolbarSettings.type === 'Expand' && !isNullOrUndefined(this.getToolbar()) &&
+        if (this.toolbarSettings.enable && (this.toolbarSettings.type === 'Expand' || this.toolbarSettings.type === 'MultiRow' || this.toolbarSettings.type === 'Scrollable') && !isNullOrUndefined(this.getToolbar()) &&
             (this.toolbarSettings.items.indexOf('Undo') > -1 && this.toolbarSettings.items.indexOf('Redo') > -1)) {
             this.disableToolbarItem(['Undo', 'Redo']);
         }
@@ -32370,7 +32569,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         }
         // eslint-disable-next-line
         (this.enabled && !this.readonly) ? this.eventInitializer() : this.unWireEvents();
-        this.notify(bindCssClass, { cssClass: this.cssClass });
+        this.notify(bindCssClass, { cssClass: this.getCssClass() });
         this.addAudioVideoWrapper();
         this.notify(tableclass, {});
         this.renderComplete();
@@ -32460,7 +32659,13 @@ let RichTextEditor = class RichTextEditor extends Component {
             range.endContainer;
         const closestLI = closest(endNode, 'LI');
         let isDetached = false;
-        if (!isNullOrUndefined(closestLI) && endNode.textContent.length === range.endOffset &&
+        let currentRangeEndOffset = range.endOffset;
+        if (currentEndContainer.nodeType === Node.TEXT_NODE) {
+            if (currentEndContainer.textContent.charAt(currentRangeEndOffset - 1) === '\uFEFF') {
+                currentRangeEndOffset--;
+            }
+        }
+        if (!isNullOrUndefined(closestLI) && endNode.textContent.trim().length === currentRangeEndOffset &&
             !range.collapsed && isNullOrUndefined(endNode.nextElementSibling)) {
             for (let i = 0; i < closestLI.childNodes.length; i++) {
                 if (closestLI.childNodes[i].nodeName === '#text' && closestLI.childNodes[i].textContent.trim().length === 0) {
@@ -32539,7 +32744,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         }
         const notFormatPainterCopy = isNullOrUndefined(e.action) ? true : (e.action !== 'format-copy' ? true : false);
         if (this.formatter.getUndoRedoStack().length === 0 && notFormatPainterCopy &&
-            !(e.altKey || e.shiftKey || (e.altKey && e.shiftKey && e.which === 67))) {
+            !(e.altKey || e.shiftKey || (e.altKey && e.shiftKey && e.which == 67))) {
             this.formatter.saveData();
         }
         if (e.action !== 'insert-link' &&
@@ -32608,7 +32813,7 @@ let RichTextEditor = class RichTextEditor extends Component {
             this.formatter.onKeyHandler(this, e);
         }
         if (this.inputElement && this.inputElement.textContent.length !== 0
-            || this.element.querySelectorAll('.e-toolbar-item.e-active').length > 0) {
+            || this.element.querySelectorAll('.e-toolbar-item.e-active').length > 0 || this.formatter.getUndoRedoStack().length > 0) {
             this.notify(toolbarRefresh, { args: e });
         }
         if (!isNullOrUndefined(this.placeholder)) {
@@ -32700,20 +32905,61 @@ let RichTextEditor = class RichTextEditor extends Component {
                 return;
             }
         }
-        this.notifyMouseUp(e);
         if (e.detail === 3) {
             const range = this.getRange();
             const selection = this.formatter.editorManager.domNode.getSelection();
-            if (/\s+$/.test(selection.toString())) {
-                if (!isNullOrUndefined(range.startContainer.parentElement) && (!isNullOrUndefined(range.startContainer.parentElement.nextSibling) &&
-                    (range.startContainer.parentElement.nextSibling.nodeType !== 3 ||
-                        /\s+$/.test(range.startContainer.parentElement.nextSibling.textContent)) || range.startOffset === range.endOffset)
-                    || range.startContainer.parentElement.tagName.toLocaleLowerCase() === 'li') {
-                    range.setStart(range.startContainer, range.startOffset);
-                    range.setEnd(range.startContainer, range.startContainer.textContent.length);
+            // To handle the triple click node selection improper range due to browser behavior.
+            if (selection.rangeCount > 0 && !isNullOrUndefined(range.startContainer.parentElement) && (!isNullOrUndefined(range.startContainer.parentElement.nextSibling) &&
+                (range.startContainer.parentElement.nextSibling.nodeType !== 3 ||
+                    /\s+$/.test(range.startContainer.parentElement.nextSibling.textContent)) || range.startOffset === range.endOffset)
+                || range.startContainer.parentElement.tagName.toLocaleLowerCase() === 'li') {
+                const newRange = new Range();
+                let start = range.startContainer;
+                let end = range.endContainer;
+                let isInvalid = false;
+                const isInsideList = range.commonAncestorContainer.nodeName === 'OL' || range.commonAncestorContainer.nodeName === 'UL'
+                    || range.commonAncestorContainer.nodeName === 'LI';
+                if (!isInsideList && end.nodeType === 1 && end.nodeName === 'LI') {
+                    end = closest(end, 'ol, ul').previousElementSibling.lastElementChild;
+                }
+                else if (isInsideList && end.nodeType === 1 && range.endOffset === 0) {
+                    if (end.previousElementSibling && end.previousElementSibling.lastElementChild) {
+                        end = end.previousElementSibling.lastElementChild;
+                    }
+                    else {
+                        end = closest(end.parentElement, 'li');
+                        if (end && end.nodeName === 'LI') {
+                            end = end.previousElementSibling;
+                        }
+                    }
                 }
+                else {
+                    if (!closest(end, 'li') && end.previousElementSibling && end.previousElementSibling.lastChild &&
+                        end.previousElementSibling.textContent.trim().length > 0) {
+                        end = end.previousElementSibling.lastChild;
+                    }
+                    else if (closest(end, 'li') && end.previousElementSibling && end.previousElementSibling.lastChild) {
+                        end = closest(end, 'li').parentElement.previousElementSibling.lastChild;
+                    }
+                }
+                if (!end || end === this.inputElement) {
+                    end = start;
+                    isInvalid = true;
+                }
+                while (end.nodeName !== '#text' && !isInvalid) {
+                    if (end.lastElementChild) {
+                        end = end.lastElementChild;
+                    }
+                    else {
+                        end = end.lastChild;
+                    }
+                }
+                newRange.setStart(start, 0);
+                newRange.setEnd(end, end.textContent.length);
+                this.formatter.editorManager.nodeSelection.setRange(this.contentModule.getDocument(), newRange);
             }
         }
+        this.notifyMouseUp(e);
     }
     /**
      * @param {Function} module - specifies the module function.
@@ -32756,7 +33002,7 @@ let RichTextEditor = class RichTextEditor extends Component {
             const currentLength = this.inputElement.textContent.length;
             const selectionLength = this.getSelection().length;
             const pastedContentLength = (isNullOrUndefined(e) || isNullOrUndefined(e.clipboardData))
-                ? 0 : e.clipboardData.getData('text/plain').length;
+                ? 0 : e.clipboardData.getData('text/plain').replace(/(\r\n|\n|\r)/gm, '').replace(/\u200B/g, '').length;
             const totalLength = (currentLength - selectionLength) + pastedContentLength;
             if (this.editorMode === 'Markdown') {
                 const args = { requestType: 'Paste', editorMode: this.editorMode, event: e };
@@ -33187,7 +33433,7 @@ let RichTextEditor = class RichTextEditor extends Component {
     updatePanelValue() {
         let value = this.value;
         value = (this.enableHtmlEncode && this.value) ? decode(value) : value;
-        const getTextArea = this.element.querySelector('.e-rte-srctextarea');
+        const getTextArea = this.element.querySelector('.' + CLS_RTE_SOURCE_CODE_TXTAREA);
         if (value) {
             if (getTextArea && getTextArea.style.display === 'block') {
                 getTextArea.value = this.value;
@@ -33816,6 +34062,16 @@ let RichTextEditor = class RichTextEditor extends Component {
     getID() {
         return (this.originalElement.tagName === 'TEXTAREA' ? this.valueContainer.id : this.element.id);
     }
+    /**
+   * @returns {void}
+   * getCssClass method
+   *
+   * @hidden
+   * @deprecated
+   */
+    getCssClass(isSpace) {
+        return (isNullOrUndefined(this.cssClass) ? '' : isSpace ? ' ' + this.cssClass : this.cssClass);
+    }
     mouseDownHandler(e) {
         const touch = (e.touches ? e.changedTouches[0] : e);
         addClass([this.element], [CLS_FOCUS]);
@@ -33927,7 +34183,7 @@ let RichTextEditor = class RichTextEditor extends Component {
     }
     getUpdatedValue() {
         let value;
-        const getTextArea = this.element.querySelector('.e-rte-srctextarea');
+        const getTextArea = this.element.querySelector('.' + CLS_RTE_SOURCE_CODE_TXTAREA);
         if (this.editorMode === 'HTML') {
             value = (this.inputElement.innerHTML === '<p><br></p>' || this.inputElement.innerHTML === '<div><br></div>' ||
                 this.inputElement.innerHTML === '<br>') ? null : this.enableHtmlEncode ?
@@ -33958,6 +34214,10 @@ let RichTextEditor = class RichTextEditor extends Component {
         clearTimeout(this.idleInterval);
         this.idleInterval = setTimeout(this.updateValueOnIdle.bind(this), 0);
     }
+    cleanupResizeElements(args) {
+        const value = this.removeResizeElement(args.value);
+        return value;
+    }
     removeResizeElement(value) {
         let valueElementWrapper = document.createElement("div");
         valueElementWrapper.innerHTML = value;
@@ -34176,6 +34436,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         this.on(contentChanged, this.contentChanged, this);
         this.on(resizeInitialized, this.updateResizeFlag, this);
         this.on(updateTbItemsStatus, this.updateStatus, this);
+        this.on(cleanupResizeElements, this.cleanupResizeElements, this);
         if (this.readonly && this.enabled) {
             return;
         }
@@ -34262,6 +34523,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         this.off(contentChanged, this.contentChanged);
         this.off(resizeInitialized, this.updateResizeFlag);
         this.off(updateTbItemsStatus, this.updateStatus);
+        this.off(cleanupResizeElements, this.cleanupResizeElements);
         if (this.readonly && this.enabled) {
             return;
         }
@@ -34633,5 +34895,5 @@ RichTextEditor = __decorate$1([
  * Rich Text Editor component exported items
  */
 
-export { Toolbar$2 as Toolbar, KeyboardEvents$1 as KeyboardEvents, BaseToolbar, BaseQuickToolbar, QuickToolbar, Count, ColorPickerInput, MarkdownToolbarStatus, ExecCommandCallBack, ToolbarAction, MarkdownEditor, HtmlEditor, PasteCleanup, Resize, DropDownButtons, FileManager$1 as FileManager, FullScreen, setAttributes, HtmlToolbarStatus, XhtmlValidation, FormatPainter, EmojiPicker, HTMLFormatter, Formatter, MarkdownFormatter, ContentRender, Render, ToolbarRenderer, Link, Image$1 as Image, Audio, Video, ViewSource, Table, DialogRenderer, IframeContentRender, MarkdownRender, PopupRenderer, RichTextEditor, RenderType, ToolbarType, DialogType, executeGroup, created, destroyed, tableclass, load, initialLoad, contentChanged, initialEnd, iframeMouseDown, destroy, toolbarClick, toolbarRefresh, refreshBegin, toolbarUpdated, bindOnEnd, renderColorPicker, htmlToolbarClick, markdownToolbarClick, destroyColorPicker, modelChanged, tableModulekeyUp, keyUp, keyDown, mouseUp, toolbarCreated, toolbarRenderComplete, enableFullScreen, disableFullScreen, dropDownSelect, beforeDropDownItemRender, execCommandCallBack, imageToolbarAction, audioToolbarAction, videoToolbarAction, linkToolbarAction, windowResize, resizeStart, onResize, resizeStop, undo, redo, insertLink, unLink, editLink, openLink, actionBegin, actionComplete, updatedToolbarStatus, actionSuccess, updateToolbarItem, insertImage, insertAudio, insertVideo, insertCompleted, imageLeft, imageRight, imageCenter, imageBreak, imageInline, imageLink, imageAlt, imageDelete, audioDelete, videoDelete, imageCaption, imageSize, videoSize, sourceCode, updateSource, toolbarOpen, beforeDropDownOpen, selectionSave, selectionRestore, expandPopupClick, count, contentFocus, contentBlur, mouseDown, sourceCodeMouseDown, editAreaClick, scroll, contentscroll, colorPickerChanged, tableColorPickerChanged, focusChange, selectAll$1 as selectAll, selectRange, getSelectedHtml, renderInlineToolbar, paste, imgModule, rtlMode, createTable, docClick, tableToolbarAction, checkUndo, readOnlyMode, moduleDestroy, pasteClean, enterHandler, beforeDialogOpen, clearDialogObj, dialogOpen, beforeDialogClose, dialogClose, beforeQuickToolbarOpen, quickToolbarOpen, quickToolbarClose, popupHide, imageSelected, imageUploading, imageUploadSuccess, imageUploadFailed, imageRemoving, fileSelected, fileUploading, fileUploadSuccess, fileUploadFailed, fileRemoving, afterImageDelete, afterMediaDelete, drop, xhtmlValidation, beforeImageUpload, beforeFileUpload, resizeInitialized, renderFileManager, beforeImageDrop, dynamicModule, beforePasteCleanup, afterPasteCleanup, updateTbItemsStatus, showLinkDialog, closeLinkDialog, showImageDialog, showAudioDialog, showVideoDialog, closeImageDialog, closeAudioDialog, closeVideoDialog, showTableDialog, closeTableDialog, bindCssClass, formatPainterClick, formatPainterDoubleClick, emojiPicker, maximizeMinimizeClick, hidePopup, blockEmptyNodes, inlineEmptyNodes, CLS_RTE, CLS_RTL, CLS_CONTENT, CLS_DISABLED, CLS_SCRIPT_SHEET, CLS_STYLE_SHEET, CLS_TOOLBAR, CLS_TB_FIXED, CLS_TB_FLOAT, CLS_TB_ABS_FLOAT, CLS_INLINE, CLS_TB_INLINE, CLS_RTE_EXPAND_TB, CLS_FULL_SCREEN, CLS_QUICK_TB, CLS_POP, CLS_TB_STATIC, CLS_QUICK_POP, CLS_QUICK_DROPDOWN, CLS_IMAGE_POP, CLS_TEXT_POP, CLS_INLINE_POP, CLS_INLINE_DROPDOWN, CLS_DROPDOWN_POPUP, CLS_DROPDOWN_ICONS, CLS_DROPDOWN_ITEMS, CLS_DROPDOWN_BTN, CLS_RTE_CONTENT, CLS_TB_ITEM, CLS_TB_EXTENDED, CLS_TB_WRAP, CLS_POPUP, CLS_SEPARATOR, CLS_MINIMIZE, CLS_MAXIMIZE, CLS_BACK, CLS_SHOW, CLS_HIDE, CLS_VISIBLE, CLS_FOCUS, CLS_RM_WHITE_SPACE, CLS_IMGRIGHT, CLS_IMGLEFT, CLS_IMGCENTER, CLS_IMGBREAK, CLS_AUDIOBREAK, CLS_CLICKELEM, CLS_VID_CLICK_ELEM, CLS_AUDIOWRAP, CLS_VIDEOWRAP, CLS_VIDEOBREAK, CLS_CAPTION, CLS_RTE_CAPTION, CLS_CAPINLINE, CLS_IMGINLINE, CLS_AUDIOINLINE, CLS_VIDEOINLINE, CLS_COUNT, CLS_WARNING, CLS_ERROR, CLS_ICONS, CLS_ACTIVE, CLS_EXPAND_OPEN, CLS_RTE_ELEMENTS, CLS_TB_BTN, CLS_HR_SEPARATOR, CLS_TB_IOS_FIX, CLS_LIST_PRIMARY_CONTENT, CLS_NUMBERFORMATLIST_TB_BTN, CLS_BULLETFORMATLIST_TB_BTN, CLS_FORMATS_TB_BTN, CLS_FONT_NAME_TB_BTN, CLS_FONT_SIZE_TB_BTN, CLS_ALIGN_TB_BTN, CLS_FONT_COLOR_TARGET, CLS_BACKGROUND_COLOR_TARGET, CLS_COLOR_CONTENT, CLS_FONT_COLOR_DROPDOWN, CLS_BACKGROUND_COLOR_DROPDOWN, CLS_COLOR_PALETTE, CLS_FONT_COLOR_PICKER, CLS_BACKGROUND_COLOR_PICKER, CLS_RTE_READONLY, CLS_TABLE_SEL, CLS_TB_DASH_BOR, CLS_TB_ALT_BOR, CLS_TB_COL_RES, CLS_TB_ROW_RES, CLS_TB_BOX_RES, CLS_RTE_HIDDEN, CLS_RTE_PASTE_KEEP_FORMAT, CLS_RTE_PASTE_REMOVE_FORMAT, CLS_RTE_PASTE_PLAIN_FORMAT, CLS_RTE_PASTE_OK, CLS_RTE_PASTE_CANCEL, CLS_RTE_DIALOG_MIN_HEIGHT, CLS_RTE_RES_HANDLE, CLS_RTE_RES_EAST, CLS_RTE_IMAGE, CLS_RESIZE, CLS_IMG_FOCUS, CLS_AUD_FOCUS, CLS_VID_FOCUS, CLS_RTE_DRAG_IMAGE, CLS_RTE_UPLOAD_POPUP, CLS_POPUP_OPEN, CLS_IMG_RESIZE, CLS_DROPAREA, CLS_IMG_INNER, CLS_UPLOAD_FILES, CLS_RTE_DIALOG_UPLOAD, CLS_RTE_RES_CNT, CLS_CUSTOM_TILE, CLS_NOCOLOR_ITEM, CLS_TABLE, CLS_TABLE_BORDER, CLS_RTE_TABLE_RESIZE, CLS_RTE_FIXED_TB_EXPAND, CLS_RTE_TB_ENABLED, CLS_RTE_RES_WEST, CLS_RTE_SOURCE_CODE_TXTAREA, getIndex, hasClass, getDropDownValue, isIDevice, getFormattedFontSize, pageYOffset, getTooltipText, setToolbarStatus, getCollection, getTBarItemsIndex, updateUndoRedoStatus, dispatchEvent, parseHtml, getTextNodesUnder, toObjectLowerCase, getEditValue, updateTextNode, getDefaultValue, isEditableValueEmpty, decode, sanitizeHelper, convertToBlob, getLocaleFontFormat, updateDropDownFontFormatLocale, ServiceLocator, RendererFactory, EditorManager, IMAGE, AUDIO, VIDEO, TABLE, LINK, INSERT_ROW, INSERT_COLUMN, DELETEROW, DELETECOLUMN, REMOVETABLE, TABLEHEADER, TABLE_VERTICAL_ALIGN, TABLE_MERGE, TABLE_VERTICAL_SPLIT, TABLE_HORIZONTAL_SPLIT, TABLE_MOVE, ALIGNMENT_TYPE, INDENT_TYPE, DEFAULT_TAG, BLOCK_TAGS, IGNORE_BLOCK_TAGS, TABLE_BLOCK_TAGS, SELECTION_TYPE, INSERTHTML_TYPE, INSERT_TEXT_TYPE, CLEAR_TYPE, SELF_CLOSING_TAGS, CLASS_IMAGE_RIGHT, CLASS_IMAGE_LEFT, CLASS_IMAGE_CENTER, CLASS_VIDEO_RIGHT, CLASS_VIDEO_LEFT, CLASS_VIDEO_CENTER, CLASS_IMAGE_BREAK, CLASS_AUDIO_BREAK, CLASS_VIDEO_BREAK, CLASS_CAPTION, CLASS_RTE_CAPTION, CLASS_CAPTION_INLINE, CLASS_IMAGE_INLINE, CLASS_AUDIO_INLINE, CLASS_CLICK_ELEM, CLASS_VIDEO_CLICK_ELEM, CLASS_AUDIO, CLASS_VIDEO, CLASS_AUDIO_WRAP, CLASS_VIDEO_WRAP, CLASS_EMBED_VIDEO_WRAP, CLASS_AUDIO_FOCUS, CLASS_VIDEO_FOCUS, CLASS_VIDEO_INLINE, Lists, markerClassName, DOMNode, Alignments, Indents, Formats, LinkCommand, InsertMethods, InsertTextExec, InsertHtmlExec, InsertHtml, IsFormatted, MsWordPaste, NodeCutter, ImageCommand, AudioCommand, VideoCommand, SelectionCommands, SelectionBasedExec, ClearFormatExec, UndoRedoManager, TableCommand, statusCollection, ToolbarStatus, FormatPainterActions, EmojiPickerAction, NodeSelection, MarkdownParser, LISTS_COMMAND, selectionCommand, LINK_COMMAND, CLEAR_COMMAND, MD_TABLE, INSERT_TEXT_COMMAND, ClearFormat, MDLists, MDFormats, MarkdownSelection, UndoRedoCommands, MDSelectionFormats, MDLink, MDTable, markdownFormatTags, markdownSelectionTags, markdownListsTags, htmlKeyConfig, markdownKeyConfig, pasteCleanupGroupingTags, listConversionFilters, selfClosingTags, KEY_DOWN, ACTION, FORMAT_TYPE, KEY_DOWN_HANDLER, LIST_TYPE, KEY_UP_HANDLER, KEY_UP, MODEL_CHANGED_PLUGIN, MODEL_CHANGED, MS_WORD_CLEANUP_PLUGIN, MS_WORD_CLEANUP, ON_BEGIN, SPACE_ACTION, FORMAT_PAINTER_ACTIONS, EMOJI_PICKER_ACTIONS };
+export { Toolbar$2 as Toolbar, KeyboardEvents$1 as KeyboardEvents, BaseToolbar, BaseQuickToolbar, QuickToolbar, Count, ColorPickerInput, MarkdownToolbarStatus, ExecCommandCallBack, ToolbarAction, MarkdownEditor, HtmlEditor, PasteCleanup, Resize, DropDownButtons, FileManager$1 as FileManager, FullScreen, setAttributes, HtmlToolbarStatus, XhtmlValidation, FormatPainter, EmojiPicker, HTMLFormatter, Formatter, MarkdownFormatter, ContentRender, Render, ToolbarRenderer, Link, Image$1 as Image, Audio, Video, ViewSource, Table, DialogRenderer, IframeContentRender, MarkdownRender, PopupRenderer, RichTextEditor, RenderType, ToolbarType, DialogType, executeGroup, created, destroyed, tableclass, load, initialLoad, contentChanged, initialEnd, iframeMouseDown, destroy, toolbarClick, toolbarRefresh, refreshBegin, toolbarUpdated, bindOnEnd, renderColorPicker, htmlToolbarClick, markdownToolbarClick, destroyColorPicker, modelChanged, tableModulekeyUp, keyUp, keyDown, mouseUp, toolbarCreated, toolbarRenderComplete, enableFullScreen, disableFullScreen, dropDownSelect, beforeDropDownItemRender, execCommandCallBack, imageToolbarAction, audioToolbarAction, videoToolbarAction, linkToolbarAction, windowResize, resizeStart, onResize, resizeStop, undo, redo, insertLink, unLink, editLink, openLink, actionBegin, actionComplete, updatedToolbarStatus, actionSuccess, updateToolbarItem, insertImage, insertAudio, insertVideo, insertCompleted, imageLeft, imageRight, imageCenter, imageBreak, imageInline, imageLink, imageAlt, imageDelete, audioDelete, videoDelete, imageCaption, imageSize, videoSize, sourceCode, updateSource, toolbarOpen, beforeDropDownOpen, selectionSave, selectionRestore, expandPopupClick, count, contentFocus, contentBlur, mouseDown, sourceCodeMouseDown, editAreaClick, scroll, contentscroll, colorPickerChanged, tableColorPickerChanged, focusChange, selectAll$1 as selectAll, selectRange, getSelectedHtml, renderInlineToolbar, paste, imgModule, rtlMode, createTable, docClick, tableToolbarAction, checkUndo, readOnlyMode, moduleDestroy, pasteClean, enterHandler, beforeDialogOpen, clearDialogObj, dialogOpen, beforeDialogClose, dialogClose, beforeQuickToolbarOpen, quickToolbarOpen, quickToolbarClose, popupHide, imageSelected, imageUploading, imageUploadSuccess, imageUploadFailed, imageRemoving, fileSelected, fileUploading, fileUploadSuccess, fileUploadFailed, fileRemoving, afterImageDelete, afterMediaDelete, drop, xhtmlValidation, beforeImageUpload, beforeFileUpload, resizeInitialized, renderFileManager, beforeImageDrop, dynamicModule, beforePasteCleanup, afterPasteCleanup, updateTbItemsStatus, showLinkDialog, closeLinkDialog, showImageDialog, showAudioDialog, showVideoDialog, closeImageDialog, closeAudioDialog, closeVideoDialog, showTableDialog, closeTableDialog, bindCssClass, formatPainterClick, formatPainterDoubleClick, emojiPicker, destroyTooltip, hidePopup, cleanupResizeElements, blockEmptyNodes, inlineEmptyNodes, CLS_RTE, CLS_RTL, CLS_CONTENT, CLS_DISABLED, CLS_SCRIPT_SHEET, CLS_STYLE_SHEET, CLS_TOOLBAR, CLS_TB_FIXED, CLS_TB_FLOAT, CLS_TB_ABS_FLOAT, CLS_INLINE, CLS_TB_INLINE, CLS_RTE_EXPAND_TB, CLS_FULL_SCREEN, CLS_QUICK_TB, CLS_TEXT_QUICK_TB, CLS_POP, CLS_TB_STATIC, CLS_QUICK_POP, CLS_QUICK_DROPDOWN, CLS_IMAGE_POP, CLS_TEXT_POP, CLS_INLINE_POP, CLS_INLINE_DROPDOWN, CLS_DROPDOWN_POPUP, CLS_DROPDOWN_ICONS, CLS_DROPDOWN_ITEMS, CLS_DROPDOWN_BTN, CLS_RTE_CONTENT, CLS_TB_ITEM, CLS_TB_EXTENDED, CLS_TB_WRAP, CLS_POPUP, CLS_SEPARATOR, CLS_MINIMIZE, CLS_MAXIMIZE, CLS_BACK, CLS_SHOW, CLS_HIDE, CLS_VISIBLE, CLS_FOCUS, CLS_RM_WHITE_SPACE, CLS_IMGRIGHT, CLS_IMGLEFT, CLS_IMGCENTER, CLS_IMGBREAK, CLS_AUDIOBREAK, CLS_CLICKELEM, CLS_VID_CLICK_ELEM, CLS_AUDIOWRAP, CLS_VIDEOWRAP, CLS_VIDEOBREAK, CLS_CAPTION, CLS_RTE_CAPTION, CLS_CAPINLINE, CLS_IMGINLINE, CLS_AUDIOINLINE, CLS_VIDEOINLINE, CLS_COUNT, CLS_WARNING, CLS_ERROR, CLS_ICONS, CLS_ACTIVE, CLS_EXPAND_OPEN, CLS_RTE_ELEMENTS, CLS_TB_BTN, CLS_HR_SEPARATOR, CLS_TB_IOS_FIX, CLS_LIST_PRIMARY_CONTENT, CLS_NUMBERFORMATLIST_TB_BTN, CLS_BULLETFORMATLIST_TB_BTN, CLS_FORMATS_TB_BTN, CLS_FONT_NAME_TB_BTN, CLS_FONT_SIZE_TB_BTN, CLS_ALIGN_TB_BTN, CLS_FONT_COLOR_TARGET, CLS_BACKGROUND_COLOR_TARGET, CLS_COLOR_CONTENT, CLS_FONT_COLOR_DROPDOWN, CLS_BACKGROUND_COLOR_DROPDOWN, CLS_COLOR_PALETTE, CLS_FONT_COLOR_PICKER, CLS_BACKGROUND_COLOR_PICKER, CLS_RTE_READONLY, CLS_TABLE_SEL, CLS_TB_DASH_BOR, CLS_TB_ALT_BOR, CLS_TB_COL_RES, CLS_TB_ROW_RES, CLS_TB_BOX_RES, CLS_RTE_HIDDEN, CLS_RTE_PASTE_KEEP_FORMAT, CLS_RTE_PASTE_REMOVE_FORMAT, CLS_RTE_PASTE_PLAIN_FORMAT, CLS_RTE_PASTE_OK, CLS_RTE_PASTE_CANCEL, CLS_RTE_DIALOG_MIN_HEIGHT, CLS_RTE_RES_HANDLE, CLS_RTE_RES_EAST, CLS_RTE_IMAGE, CLS_RESIZE, CLS_IMG_FOCUS, CLS_AUD_FOCUS, CLS_VID_FOCUS, CLS_RTE_DRAG_IMAGE, CLS_RTE_UPLOAD_POPUP, CLS_POPUP_OPEN, CLS_IMG_RESIZE, CLS_DROPAREA, CLS_IMG_INNER, CLS_UPLOAD_FILES, CLS_RTE_DIALOG_UPLOAD, CLS_RTE_RES_CNT, CLS_CUSTOM_TILE, CLS_NOCOLOR_ITEM, CLS_TABLE, CLS_TABLE_BORDER, CLS_RTE_TABLE_RESIZE, CLS_RTE_FIXED_TB_EXPAND, CLS_RTE_TB_ENABLED, CLS_RTE_RES_WEST, CLS_RTE_SOURCE_CODE_TXTAREA, getIndex, hasClass, getDropDownValue, isIDevice, getFormattedFontSize, pageYOffset, getTooltipText, setToolbarStatus, getCollection, getTBarItemsIndex, updateUndoRedoStatus, dispatchEvent, parseHtml, getTextNodesUnder, toObjectLowerCase, getEditValue, updateTextNode, getDefaultValue, isEditableValueEmpty, decode, sanitizeHelper, convertToBlob, getLocaleFontFormat, updateDropDownFontFormatLocale, ServiceLocator, RendererFactory, EditorManager, IMAGE, AUDIO, VIDEO, TABLE, LINK, INSERT_ROW, INSERT_COLUMN, DELETEROW, DELETECOLUMN, REMOVETABLE, TABLEHEADER, TABLE_VERTICAL_ALIGN, TABLE_MERGE, TABLE_VERTICAL_SPLIT, TABLE_HORIZONTAL_SPLIT, TABLE_MOVE, ALIGNMENT_TYPE, INDENT_TYPE, DEFAULT_TAG, BLOCK_TAGS, IGNORE_BLOCK_TAGS, TABLE_BLOCK_TAGS, SELECTION_TYPE, INSERTHTML_TYPE, INSERT_TEXT_TYPE, CLEAR_TYPE, SELF_CLOSING_TAGS, CLASS_IMAGE_RIGHT, CLASS_IMAGE_LEFT, CLASS_IMAGE_CENTER, CLASS_VIDEO_RIGHT, CLASS_VIDEO_LEFT, CLASS_VIDEO_CENTER, CLASS_IMAGE_BREAK, CLASS_AUDIO_BREAK, CLASS_VIDEO_BREAK, CLASS_CAPTION, CLASS_RTE_CAPTION, CLASS_CAPTION_INLINE, CLASS_IMAGE_INLINE, CLASS_AUDIO_INLINE, CLASS_CLICK_ELEM, CLASS_VIDEO_CLICK_ELEM, CLASS_AUDIO, CLASS_VIDEO, CLASS_AUDIO_WRAP, CLASS_VIDEO_WRAP, CLASS_EMBED_VIDEO_WRAP, CLASS_AUDIO_FOCUS, CLASS_VIDEO_FOCUS, CLASS_VIDEO_INLINE, Lists, markerClassName, DOMNode, Alignments, Indents, Formats, LinkCommand, InsertMethods, InsertTextExec, InsertHtmlExec, InsertHtml, IsFormatted, MsWordPaste, NodeCutter, ImageCommand, AudioCommand, VideoCommand, SelectionCommands, SelectionBasedExec, ClearFormatExec, UndoRedoManager, TableCommand, statusCollection, ToolbarStatus, FormatPainterActions, EmojiPickerAction, NodeSelection, MarkdownParser, LISTS_COMMAND, selectionCommand, LINK_COMMAND, CLEAR_COMMAND, MD_TABLE, INSERT_TEXT_COMMAND, ClearFormat, MDLists, MDFormats, MarkdownSelection, UndoRedoCommands, MDSelectionFormats, MDLink, MDTable, markdownFormatTags, markdownSelectionTags, markdownListsTags, htmlKeyConfig, markdownKeyConfig, pasteCleanupGroupingTags, listConversionFilters, selfClosingTags, KEY_DOWN, ACTION, FORMAT_TYPE, KEY_DOWN_HANDLER, LIST_TYPE, KEY_UP_HANDLER, KEY_UP, MODEL_CHANGED_PLUGIN, MODEL_CHANGED, MS_WORD_CLEANUP_PLUGIN, MS_WORD_CLEANUP, ON_BEGIN, SPACE_ACTION, FORMAT_PAINTER_ACTIONS, EMOJI_PICKER_ACTIONS };
 //# sourceMappingURL=ej2-richtexteditor.es2015.js.map