@syncfusion/ej2-richtexteditor 20.4.53 → 21.1.37

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

@@ -1,7 +1,7 @@
 import { Ajax, Base, Browser, ChildProperty, Complex, Component, Event, EventHandler, KeyboardEvents, L10n, NotifyPropertyChanges, Observer, Property, SanitizeHtmlHelper, Touch, addClass, append, attributes, closest, compile, createElement, debounce, detach, extend, formatUnit, getEnumValue, getInstance, getUniqueID, isNullOrUndefined, prepend, print, removeClass, select, selectAll, setStyleAttribute } from '@syncfusion/ej2-base';
 import { Toolbar } from '@syncfusion/ej2-navigations';
 import { DropDownButton } from '@syncfusion/ej2-splitbuttons';
-import { Dialog, Popup, getScrollableParent, isCollide } from '@syncfusion/ej2-popups';
+import { Dialog, Popup, Tooltip, getScrollableParent, isCollide } from '@syncfusion/ej2-popups';
 import { ColorPicker, NumericTextBox, TextBox, Uploader } from '@syncfusion/ej2-inputs';
 import { Button, CheckBox, RadioButton } from '@syncfusion/ej2-buttons';
 import { AjaxSettings, ContextMenu, ContextMenuSettings, DetailsView, DetailsViewSettings, FileManager, NavigationPane, NavigationPaneSettings, SearchSettings, Toolbar as Toolbar$1, ToolbarSettings, UploadSettings } from '@syncfusion/ej2-filemanager';
@@ -719,6 +719,16 @@ const closeTableDialog = 'closeTableDialog';
  * @deprecated
  */
 const bindCssClass = 'closeTableDialog';
+/**
+ * @hidden
+ * @deprecated
+ */
+const formatPainterClick = 'formatPainterClick';
+/**
+ * @hidden
+ * @deprecated
+ */
+const formatPainterDoubleClick = 'formatPainterDoubleClick';
 /**
  * @hidden
  * @deprecated
@@ -1953,6 +1963,13 @@ let tools = {
         'tooltip': 'Styles',
         'command': 'Table',
         'subCommand': 'Styles'
+    },
+    'formatpainter': {
+        'id': 'FormatPainter',
+        'icon': 'e-rte-format-painter',
+        'tooltip': 'Format Painter',
+        'command': 'FormatPainter',
+        'subCommand': 'FormatPainter'
     }
 };
 let alignmentLocale = [
@@ -2142,6 +2159,31 @@ function updateDropDownLocale(self) {
         TableStyleItems[i].text = getLocale(self, tableStyleLocale, TableStyleItems[i]);
     });
 }
+let windowKeys = {
+    'Insert Link': 'Ctrl + K',
+    'Insert Image': 'Ctrl + Shift + I',
+    'Create Table': 'Ctrl + Shift + E',
+    'Undo': 'Ctrl + Z',
+    'Redo': 'Ctrl + Y',
+    'Copy': 'Ctrl + C',
+    'Cut': 'Ctrl + X',
+    'Paste': 'Ctrl + V',
+    'Bold': 'Ctrl + B',
+    'Italic': 'Ctrl + I',
+    'Underline': 'Ctrl + U',
+    'Strikethrough': 'Ctrl + Shift + S',
+    'Upper Case': 'Ctrl + Shift + U',
+    'Lower Case': 'Ctrl + Shift + L',
+    'Superscript': 'Ctrl + Shift + =',
+    'Subscript': 'Ctrl + =',
+    'Source Code': 'Ctrl + Shift + H',
+    'Maximize': 'Ctrl + Shift + F',
+    'Minimize': 'Esc',
+    'Clear Format': 'Ctrl + Shift + R',
+    'Numbered List': 'Ctrl + Shift + O',
+    'Bulleted List': 'Ctrl + Alt + O',
+    'Format Painter': 'Ctrl + Shift + C, Ctrl + Shift + V'
+};
 
 /* eslint-disable */
 /**
@@ -2335,7 +2377,8 @@ let defaultLocale = {
     'bulletFormatListCircle': 'Circle',
     'bulletFormatListSquare': 'Square',
     'numberFormatListNone': 'None',
-    'bulletFormatListNone': 'None'
+    'bulletFormatListNone': 'None',
+    'formatPainter': 'Format Painter'
 };
 let toolsLocale = {
     'alignments': 'alignments',
@@ -2422,7 +2465,8 @@ let toolsLocale = {
     'alignbottom': 'AlignBottom',
     'insertrowbefore': 'insertRowBefore',
     'insertrowafter': 'insertRowAfter',
-    'deleterow': 'deleteRow'
+    'deleterow': 'deleteRow',
+    'formatpainter': 'formatPainter'
 };
 let fontNameLocale = [
     { locale: 'fontNameSegoeUI', value: 'Segoe UI' },
@@ -2964,6 +3008,8 @@ function decode(value) {
 function sanitizeHelper(value, parent) {
     if (parent.enableHtmlSanitizer) {
         const item = SanitizeHtmlHelper.beforeSanitize();
+        if (item.selectors.tags[2] && item.selectors.tags[2].indexOf('iframe') > -1)
+            item.selectors.tags[2] = 'iframe:not(.e-rte-embed-url)';
         const beforeEvent = {
             cancel: false,
             helper: null
@@ -3144,6 +3190,14 @@ class ToolbarRenderer {
         args.rteToolbarObj.toolbarObj.isStringTemplate = true;
         args.rteToolbarObj.toolbarObj.createElement = this.parent.createElement;
         args.rteToolbarObj.toolbarObj.appendTo(args.target);
+        if (this.parent.showTooltip) {
+            const tooltip = new Tooltip({
+                target: '#' + this.parent.getID() + '_toolbar_wrapper [title]',
+                showTipPointer: true,
+                cssClass: this.parent.cssClass
+            });
+            tooltip.appendTo(args.target);
+        }
     }
     /**
      * renderDropDownButton method
@@ -3249,6 +3303,7 @@ class ToolbarRenderer {
         dropDown.createElement = proxy.parent.createElement;
         dropDown.appendTo(args.element);
         args.element.tabIndex = -1;
+        args.element.setAttribute('role', 'button');
         const popupElement = document.getElementById(dropDown.element.id + '-popup');
         popupElement.setAttribute('aria-owns', this.parent.getID());
         if (args.element.childElementCount === 1) {
@@ -3694,13 +3749,23 @@ class BaseToolbar {
                 case '-':
                     return { type: 'Separator', cssClass: CLS_HR_SEPARATOR };
                 default:
-                    return {
-                        id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
-                        prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
-                        tooltipText: getTooltipText(itemStr, this.locator),
-                        command: this.tools[itemStr.toLocaleLowerCase()].command,
-                        subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
-                    };
+                    if (this.parent.showTooltip) {
+                        return {
+                            id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
+                            prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
+                            tooltipText: getTooltipText(itemStr, this.locator),
+                            command: this.tools[itemStr.toLocaleLowerCase()].command,
+                            subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
+                        };
+                    }
+                    else {
+                        return {
+                            id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
+                            prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
+                            command: this.tools[itemStr.toLocaleLowerCase()].command,
+                            subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
+                        };
+                    }
             }
         }
     }
@@ -3742,6 +3807,19 @@ class BaseToolbar {
                     items.push(item);
             }
         }
+        for (let num = 0; num < items.length; num++) {
+            const tooltipText = items[num].tooltipText;
+            let shortCutKey;
+            if (windowKeys[`${tooltipText}`]) {
+                shortCutKey = Browser.isDevice && isIDevice() ? windowKeys[`${tooltipText}`].replace('Ctrl', 'Cmd') : windowKeys[`${tooltipText}`];
+            }
+            else {
+                shortCutKey = tooltipText;
+            }
+            if (shortCutKey) {
+                items[num].tooltipText = (tooltipText !== shortCutKey) ? tooltipText + ' (' + shortCutKey + ')' : tooltipText;
+            }
+        }
         return items;
     }
     getToolbarOptions(args) {
@@ -4740,7 +4818,7 @@ class Toolbar$2 {
      * @deprecated
      */
     updateItem(args) {
-        let item = this.tools[args.updateItem.toLocaleLowerCase()];
+        const item = this.tools[args.updateItem.toLocaleLowerCase()];
         if (this.parent.locale !== 'en-US') {
             item.tooltip = getTooltipText(args.updateItem.toLocaleLowerCase(), this.locator);
         }
@@ -4753,6 +4831,7 @@ class Toolbar$2 {
             args.baseToolbar.toolbarObj.items[index].tooltipText = item.tooltip;
             args.baseToolbar.toolbarObj.items[index].subCommand = item.subCommand;
             args.baseToolbar.toolbarObj.dataBind();
+            args.baseToolbar.toolbarObj.refreshOverflow();
         }
         else {
             this.addTBarItem(args, 0);
@@ -4893,7 +4972,11 @@ class Toolbar$2 {
      * @deprecated
      */
     refreshToolbarOverflow() {
+        this.parent.element.classList.remove(CLS_RTL);
         this.baseToolbar.toolbarObj.refreshOverflow();
+        if (this.parent.enableRtl) {
+            this.parent.element.classList.add(CLS_RTL);
+        }
     }
     isToolbarDestroyed() {
         return this.baseToolbar.toolbarObj && !this.baseToolbar.toolbarObj.isDestroyed;
@@ -5652,7 +5735,9 @@ class BaseQuickToolbar {
         let x;
         let y;
         const imgWrapper = closest(e.target, '.e-img-caption');
-        const target = !isNullOrUndefined(imgWrapper) ? imgWrapper : e.target;
+        const isAligned = (e.target.classList.contains('e-imginline') ||
+            e.target.classList.contains('e-imgbreak')) ? false : true;
+        let target = !isNullOrUndefined(imgWrapper) ? imgWrapper : e.target;
         addClass([this.toolbarElement], [CLS_RM_WHITE_SPACE]);
         const targetOffsetTop = target.offsetTop;
         const parentOffsetTop = window.pageYOffset + e.parentData.top;
@@ -5665,6 +5750,7 @@ class BaseQuickToolbar {
         else {
             y = e.y;
         }
+        target = isAligned ? e.target : target;
         if (target.offsetWidth > e.popWidth) {
             x = (target.offsetWidth / 2) - (e.popWidth / 2) + e.parentData.left + target.offsetLeft;
         }
@@ -5795,6 +5881,13 @@ class BaseQuickToolbar {
                     this.parent.enableToolbarItem(['Undo', 'Redo']);
                 }
                 append([this.element], document.body);
+                if (this.parent.showTooltip) {
+                    this.tooltip = new Tooltip({
+                        target: '#' + this.element.id + ' [title]',
+                        showTipPointer: true
+                    });
+                    this.tooltip.appendTo(this.element);
+                }
                 this.popupObj.position.X = x + 20;
                 this.popupObj.position.Y = y + 20;
                 this.popupObj.dataBind();
@@ -5861,6 +5954,16 @@ class BaseQuickToolbar {
         if (Browser.isDevice && !isIDevice()) {
             removeClass([this.parent.getToolbar()], [CLS_HIDE]);
         }
+        if (!isNullOrUndefined(document.querySelector('.e-tooltip-wrap'))) {
+            if (!isNullOrUndefined(document.querySelector('#' + this.element.id + ' [data-tooltip-id]'))) {
+                let tooltipTargetEle = document.querySelector('#' + this.element.id + ' [data-tooltip-id]');
+                let dataContent = tooltipTargetEle.getAttribute('data-content');
+                tooltipTargetEle.removeAttribute('data-content');
+                tooltipTargetEle.setAttribute('title', dataContent);
+                tooltipTargetEle.removeAttribute('data-tooltip-id');
+            }
+            this.tooltip.destroy();
+        }
         if (!isNullOrUndefined(this.parent.getToolbar()) && !this.parent.inlineMode.enable) {
             if (isNullOrUndefined(viewSourcePanel) || viewSourcePanel.style.display === 'none') {
                 this.parent.enableToolbarItem(this.parent.toolbarSettings.items);
@@ -6962,6 +7065,7 @@ function setEditFrameFocus(editableElement, selector) {
 }
 /**
  * @param {string} value - specifies the string value
+ * @param {string} enterAction - specifies the enter key action API
  * @returns {void}
  * @hidden
  */
@@ -7333,6 +7437,12 @@ const ON_BEGIN = 'onBegin';
  * @hidden
  */
 const SPACE_ACTION = 'actionBegin';
+/**
+ * Format painter event constant
+ *
+ * @hidden
+ */
+const FORMAT_PAINTER_ACTIONS = 'format_painter_actions';
 
 /**
  * Formatter
@@ -7356,8 +7466,14 @@ class Formatter {
         const selection = self.contentModule.getDocument().getSelection();
         const range = (selection.rangeCount > 0) ? selection.getRangeAt(selection.rangeCount - 1) : null;
         let saveSelection;
+        const isKeyboardVideoInsert = (!isNullOrUndefined(value) && !isNullOrUndefined(value.cssClass) &&
+            value.cssClass !== 'e-video-inline');
         if (self.editorMode === 'HTML') {
-            saveSelection = this.editorManager.nodeSelection.save(range, self.contentModule.getDocument());
+            if (!isNullOrUndefined(args) && !isKeyboardVideoInsert) {
+                if (isNullOrUndefined(args.name) || (!isNullOrUndefined(args.name) && args.name !== 'showDialog')) {
+                    saveSelection = this.editorManager.nodeSelection.save(range, self.contentModule.getDocument());
+                }
+            }
         }
         if (!isNullOrUndefined(args)
             && args.item.command
@@ -7433,18 +7549,21 @@ class Formatter {
             && args.item.command !== 'Font')
             || ((args.item.subCommand === 'FontName' || args.item.subCommand === 'FontSize') && args.name === 'dropDownSelect')
             || ((args.item.subCommand === 'BackgroundColor' || args.item.subCommand === 'FontColor')
-                && args.name === 'colorPickerChanged'))) {
+                && args.name === 'colorPickerChanged') || args.item.subCommand === 'FormatPainter')) {
             extend(args, args, { requestType: args.item.subCommand, cancel: false, itemCollection: value, selectType: args.name }, true);
             self.trigger(actionBegin, args, (actionBeginArgs) => {
                 if (!actionBeginArgs.cancel) {
+                    const formatPainterCopyAction = !isNullOrUndefined(actionBeginArgs.name) && actionBeginArgs.name === 'format-copy';
                     if (this.getUndoRedoStack().length === 0 && actionBeginArgs.item.command !== 'Links'
-                        && actionBeginArgs.item.command !== 'Images') {
+                        && actionBeginArgs.item.command !== 'Images' && !formatPainterCopyAction) {
                         this.saveData();
                     }
                     self.isBlur = false;
                     self.contentModule.getEditPanel().focus();
-                    if (self.editorMode === 'HTML') {
-                        saveSelection.restore();
+                    if (self.editorMode === 'HTML' && !isKeyboardVideoInsert) {
+                        if (isNullOrUndefined(args.selectType) || (!isNullOrUndefined(args.selectType) && args.selectType !== 'showDialog')) {
+                            saveSelection.restore();
+                        }
                     }
                     const command = actionBeginArgs.item.subCommand.toLocaleLowerCase();
                     if (command === 'paste' || command === 'cut' || command === 'copy') {
@@ -8713,7 +8832,9 @@ const htmlKeyConfig = {
     'space': '32',
     'enter': '13',
     'tab': 'tab',
-    'delete': '46'
+    'delete': '46',
+    'format-copy': 'ctrl+shift+c',
+    'format-paste': 'ctrl+shift+v'
 };
 /**
  * Default  markdown key config for adapter
@@ -11240,7 +11361,7 @@ class Lists {
                 this.parent.domNode.insertAfter(insertTag, startNodeParent);
                 e.event.preventDefault();
                 this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, insertTag, 0);
-                if (startNodeParent.textContent === '') {
+                if (startNodeParent.textContent === '' && (startNodeParent.querySelectorAll('audio,video').length === 0)) {
                     detach(startNodeParent);
                 }
                 else {
@@ -12849,7 +12970,9 @@ class InsertHtml {
                 }
                 else {
                     range.deleteContents();
-                    detach(lasNode);
+                    if (!isNullOrUndefined(lasNode)) {
+                        detach(lasNode);
+                    }
                     // eslint-disable-next-line
                     !isNullOrUndefined(sibNode) ? sibNode.parentNode.appendChild(fragment) : editNode.appendChild(fragment);
                 }
@@ -13035,7 +13158,7 @@ class InsertHtml {
                         detach(currentNode.nextSibling);
                     }
                 }
-                else if ((currentNode.nodeName === '#text' || currentNode.nodeName === "BR") && !isNullOrUndefined(currentNode.parentElement) &&
+                else if ((currentNode.nodeName === '#text' || currentNode.nodeName === 'BR') && !isNullOrUndefined(currentNode.parentElement) &&
                     (currentNode.parentElement.nodeName === 'LI' || (blockNode === editNode && currentNode.parentElement === blockNode)) &&
                     currentNode.parentElement.textContent.trim().length > 0) {
                     splitedElm = currentNode;
@@ -13385,7 +13508,6 @@ class LinkCommand {
         return arr.join(' ') + ' ';
     }
     openLink(e) {
-        // eslint-disable-next-line security/detect-non-literal-fs-filename
         document.defaultView.open(e.item.url, e.item.target);
         this.callBack(e);
     }
@@ -13849,7 +13971,6 @@ class ImageCommand {
         this.callBack(e);
     }
     openImageLink(e) {
-        // eslint-disable-next-line security/detect-non-literal-fs-filename
         document.defaultView.open(e.item.url, e.item.target);
         this.callBack(e);
     }
@@ -14319,6 +14440,8 @@ class VideoCommand {
                 : (Browser.isIE ? selectedNode : !e.item.isEmbedUrl ? selectedNode.lastElementChild : selectedNode.querySelector('iframe'));
             videoElm.addEventListener(videoElm.tagName !== 'IFRAME' ? 'loadeddata' : 'load', () => {
                 if (e.value !== 'VideoReplace' || !isReplaced) {
+                    if (e.item.isEmbedUrl && videoElm)
+                        videoElm.classList.add('e-rte-embed-url');
                     e.callBack({
                         requestType: 'Videos',
                         editorMode: 'HTML',
@@ -15551,6 +15674,7 @@ IsFormatted.inlineTags = [
     'code',
     'dfn',
     'em',
+    'font',
     'i',
     'kbd',
     'label',
@@ -15580,15 +15704,16 @@ class SelectionCommands {
      * @param {string} enterAction - specifies the enter key action
      * @param {string} value - specifies the string value
      * @param {string} selector - specifies the string
+     * @param {FormatPainterValue} painterValues specifies the element created and last child
      * @returns {void}
      * @hidden
      * @deprecated
      */
-    static applyFormat(docElement, format, endNode, enterAction, value, selector) {
+    static applyFormat(docElement, format, endNode, enterAction, value, selector, painterValues) {
         this.enterAction = enterAction;
         const validFormats = ['bold', 'italic', 'underline', 'strikethrough', 'superscript',
             'subscript', 'uppercase', 'lowercase', 'fontcolor', 'fontname', 'fontsize', 'backgroundcolor'];
-        if (validFormats.indexOf(format) > -1) {
+        if (validFormats.indexOf(format) > -1 || value === 'formatPainter') {
             if (format === 'backgroundcolor' && value === '') {
                 value = 'transparent';
             }
@@ -15664,8 +15789,10 @@ class SelectionCommands {
                 if (formatNode !== null && (!isFormat || isFontStyle)) {
                     nodes[index] = this.removeFormat(nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, domSelection, endNode, domNode);
                 }
-                else if (range.startContainer.parentElement !== endNode || (range.commonAncestorContainer === endNode || nodes.length === 1)) {
-                    nodes[index] = this.insertFormat(docElement, nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, domNode, endNode);
+                else if (range.startContainer.parentElement !== endNode ||
+                    (range.commonAncestorContainer !== endNode && range.startContainer.parentElement === endNode)
+                    || (range.commonAncestorContainer === endNode || nodes.length === 1)) {
+                    nodes[index] = this.insertFormat(docElement, nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, painterValues, domNode, endNode);
                 }
                 domSelection = this.applySelection(nodes, domSelection, nodeCutter, index, isCollapsed);
             }
@@ -15961,7 +16088,7 @@ class SelectionCommands {
         }
         return nodes[index];
     }
-    static insertFormat(docElement, nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, domNode, endNode) {
+    static insertFormat(docElement, nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value, painterValues, domNode, endNode) {
         let rootElementNode;
         if (!isCursor) {
             if ((formatNode === null && isFormat) || isFontStyle) {
@@ -15988,11 +16115,11 @@ class SelectionCommands {
                 }
                 else if (!(isFontStyle === true && value === '')) {
                     const element = this.GetFormatNode(format, value);
-                    if (format === 'fontsize' || format === 'fontcolor' || format === 'fontname' || format === 'backgroundcolor') {
+                    if (value === 'formatPainter' || format === 'fontsize' || format === 'fontcolor' || format === 'fontname' || format === 'backgroundcolor') {
                         if (format !== 'fontname' && format !== 'backgroundcolor') {
                             let liElement = nodes[index].parentElement;
                             let parentElement = nodes[index].parentElement;
-                            while (!isNullOrUndefined(parentElement) && parentElement.tagName.toLowerCase() !== 'li' && parentElement !== endNode) {
+                            while (!isNullOrUndefined(parentElement) && parentElement.tagName.toLowerCase() !== 'li') {
                                 parentElement = parentElement.parentElement;
                                 liElement = parentElement;
                             }
@@ -16007,11 +16134,11 @@ class SelectionCommands {
                                 }
                             }
                         }
-                        if (rootElementNode && rootElementNode.nodeType !== 3) {
+                        if (rootElementNode && rootElementNode.nodeType !== 3 && rootElementNode.nodeName !== 'A') {
                             const save = new NodeSelection();
                             save.save(range, docElement);
                             domNode.setMarker(save);
-                            var cloneNode = rootElementNode.cloneNode(true);
+                            const cloneNode = rootElementNode.cloneNode(true);
                             element.appendChild(cloneNode);
                             domNode.replaceWith(rootElementNode, element.outerHTML);
                             const currentStartNode = endNode.querySelector('.e-editor-select-start');
@@ -16027,7 +16154,12 @@ class SelectionCommands {
                             domNode.saveMarker(save, null);
                         }
                         else {
-                            nodes[index] = this.applyStyles(nodes, index, element);
+                            if (value === 'formatPainter') {
+                                return this.insertFormatPainterElem(nodes, index, range, nodeCutter, painterValues, domNode);
+                            }
+                            else {
+                                nodes[index] = this.applyStyles(nodes, index, element);
+                            }
                         }
                         if (format === 'fontsize') {
                             const bg = closest(nodes[index].parentElement, 'span[style*=' + 'background-color' + ']');
@@ -16158,6 +16290,59 @@ class SelectionCommands {
             ele.setAttribute('style', styles);
         }
     }
+    // Below function is used to insert the element created by the format painter plugin.
+    static insertFormatPainterElem(nodes, index, range, nodeCutter, painterValues, domNode) {
+        let parent = nodes[index].parentElement;
+        if (!domNode.isBlockNode(parent)) {
+            // The below code is used to remove the already present inline style from the text node.
+            while (parent.textContent.trim() === parent.parentElement.textContent.trim() && !domNode.isBlockNode(parent.parentElement)) {
+                parent = parent.parentElement;
+            }
+            if (parent.textContent.trim() !== nodes[index].textContent.trim()) {
+                nodeCutter.SplitNode(range, parent, true);
+                const childELemList = nodes[index].parentElement.childNodes;
+                for (let i = 0; i < childELemList.length; i++) {
+                    if (childELemList[i].textContent.trim() === nodes[i].textContent.trim()) {
+                        parent.parentNode.insertBefore(childELemList[i], parent);
+                        break;
+                    }
+                }
+                const blockChildNodes = parent.parentElement.childNodes;
+                for (let k = 0; k < blockChildNodes.length; k++) {
+                    if (blockChildNodes[k].textContent.trim() === '' || blockChildNodes[k].textContent.length === 0) {
+                        detach(blockChildNodes[k]);
+                    }
+                }
+            }
+            else {
+                InsertMethods.unwrap(parent);
+            }
+        }
+        const elem = painterValues.element;
+        if (!isNullOrUndefined(elem)) {
+            // Step 1: Cloning the element that is created by format painter.
+            // Step 2: Finding the last child of the nested elememt using the paintervalues.lastchild nodename
+            // Step 3: Assigning the nodes[index] text content to the last child element.
+            // Step 4: Wrapping the cloned element with the nodes[index]
+            const clonedElement = elem.cloneNode(true);
+            const elemList = clonedElement.querySelectorAll(painterValues.lastChild.nodeName);
+            let lastElement;
+            if (elemList.length > 0) {
+                lastElement = elemList[elemList.length - 1];
+            }
+            else {
+                if (!isNullOrUndefined(clonedElement) && clonedElement.nodeName === painterValues.lastChild.nodeName) {
+                    lastElement = clonedElement;
+                }
+            }
+            lastElement.textContent = nodes[index].textContent;
+            const lastChild = lastElement.childNodes[0];
+            nodes[index] = InsertMethods.Wrap(nodes[index], clonedElement);
+            nodes[index].textContent = '';
+            nodes[index] = lastChild;
+        }
+        return nodes[index];
+    }
 }
 SelectionCommands.enterAction = 'P';
 
@@ -16279,12 +16464,18 @@ class ClearFormat$1 {
         const nodeSelection = new NodeSelection();
         const nodeCutter = new NodeCutter();
         let range = nodeSelection.getRange(docElement);
-        const isCollapsed = range.collapsed;
-        const nodes = nodeSelection.getInsertNodeCollection(range);
+        const nodes = range.collapsed ? nodeSelection.getSelectionNodeCollection(range) :
+            nodeSelection.getSelectionNodeCollectionBr(range);
         const save = nodeSelection.save(range, docElement);
+        let cursorRange = false;
+        if (range.collapsed) {
+            cursorRange = true;
+            range = nodeCutter.GetCursorRange(docElement, range, nodes[0]);
+        }
+        const isCollapsed = range.collapsed;
         if (!isCollapsed) {
             let preNode;
-            if (nodes[0].nodeName === 'BR' && closest(nodes[0], 'table')) {
+            if (nodes.length > 0 && nodes[0].nodeName === 'BR' && closest(nodes[0], 'table')) {
                 preNode = nodeCutter.GetSpliceNode(range, closest(nodes[0], 'table'));
             }
             else {
@@ -16294,7 +16485,7 @@ class ClearFormat$1 {
                 nodeSelection.setSelectionContents(docElement, preNode);
                 range = nodeSelection.getRange(docElement);
             }
-            else {
+            else if (nodes.length > 1) {
                 let i = 1;
                 let lastText = nodes[nodes.length - i];
                 while (nodes.length <= i && nodes[nodes.length - i].nodeName === 'BR') {
@@ -16319,6 +16510,9 @@ class ClearFormat$1 {
             }
             this.reSelection(docElement, save, exactNodes);
         }
+        if (cursorRange) {
+            nodeSelection.setCursorPoint(docElement, range.endContainer, range.endOffset);
+        }
     }
     static reSelection(docElement, save, exactNodes) {
         const selectionNodes = save.getInsertNodes(exactNodes);
@@ -16824,7 +17018,7 @@ class MsWordPaste {
             if (pattern4.test(tempHTMLContent)) {
                 this.addTableBorderClass(elm);
             }
-            // Removing the margin for list items 
+            // Removing the margin for list items
             const liChildren = elm.querySelectorAll('li');
             if (liChildren.length > 0) {
                 for (let i = 0; i < liChildren.length; i++) {
@@ -17271,12 +17465,12 @@ class MsWordPaste {
                 listStyleType = this.getlistStyleType(this.listContents[0], type);
                 if (type === 'ol' && (i === 0 || listNodes[i - 1] === null)) {
                     const startString = this.listContents[0].split('.')[0];
-                    const listTypes = ['A', 'a', 'I', 'i', 'α', '1', '1-']; // Add '1-' for rare list type. 
+                    const listTypes = ['A', 'a', 'I', 'i', 'α', '1', '1-']; // Add '1-' for rare list type.
                     if (listTypes.indexOf(startString) === -1) {
                         if (listStyleType === 'decimal') {
                             // Bug in getlistStyleType() list style stype is returned as decimal for nested list with start attribute
-                            if (!isNaN(parseInt(startString))) {
-                                startAttr = parseInt(startString);
+                            if (!isNaN(parseInt(startString, 10))) {
+                                startAttr = parseInt(startString, 10);
                             }
                         }
                         else if (listStyleType === 'upper-alpha') {
@@ -17555,353 +17749,130 @@ class InsertTextExec {
 }
 
 /**
- * EditorManager internal component
+ * Update Toolbar Status
  *
  * @hidden
  * @deprecated
  */
-class EditorManager {
+const statusCollection = getDefaultHtmlTbStatus();
+class ToolbarStatus {
     /**
-     * Constructor for creating the component
+     * get method
      *
+     * @param {Document} docElement - specifies the document element
+     * @param {Node} targetNode - specifies the target node
+     * @param {string[]} formatNode - specifies the format node
+     * @param {string[]} fontSize - specifies the font size
+     * @param {string[]} fontName - specifies the font name.
+     * @param {Node} documentNode - specifies the document node.
+     * @returns {IToolbarStatus} - returns the toolbar status
      * @hidden
      * @deprecated
-     * @param {ICommandModel} options - specifies the command Model
      */
-    constructor(options) {
-        this.currentDocument = options.document;
-        this.editableElement = options.editableElement;
-        this.nodeSelection = new NodeSelection();
-        this.nodeCutter = new NodeCutter();
-        this.domNode = new DOMNode(this.editableElement, this.currentDocument);
-        this.observer = new Observer(this);
-        this.listObj = new Lists(this);
-        this.formatObj = new Formats(this);
-        this.alignmentObj = new Alignments(this);
-        this.indentsObj = new Indents(this);
-        this.linkObj = new LinkCommand(this);
-        this.imgObj = new ImageCommand(this);
-        this.audioObj = new AudioCommand(this);
-        this.videoObj = new VideoCommand(this);
-        this.selectionObj = new SelectionBasedExec(this);
-        this.inserthtmlObj = new InsertHtmlExec(this);
-        this.insertTextObj = new InsertTextExec(this);
-        this.clearObj = new ClearFormatExec(this);
-        this.tableObj = new TableCommand(this);
-        this.undoRedoManager = new UndoRedoManager(this, options.options);
-        this.msWordPaste = new MsWordPaste(this);
-        this.wireEvents();
-    }
-    wireEvents() {
-        this.observer.on(KEY_DOWN, this.editorKeyDown, this);
-        this.observer.on(KEY_UP, this.editorKeyUp, this);
-        this.observer.on(KEY_UP, this.editorKeyUp, this);
-        this.observer.on(MODEL_CHANGED, this.onPropertyChanged, this);
-        this.observer.on(MS_WORD_CLEANUP, this.onWordPaste, this);
-        this.observer.on(ON_BEGIN, this.onBegin, this);
-    }
-    onWordPaste(e) {
-        this.observer.notify(MS_WORD_CLEANUP_PLUGIN, e);
-    }
-    onPropertyChanged(props) {
-        this.observer.notify(MODEL_CHANGED_PLUGIN, props);
-    }
-    editorKeyDown(e) {
-        this.observer.notify(KEY_DOWN_HANDLER, e);
+    static get(docElement, targetNode, formatNode, fontSize, fontName, documentNode) {
+        let formatCollection = JSON.parse(JSON.stringify(statusCollection));
+        const nodeCollection = JSON.parse(JSON.stringify(statusCollection));
+        const nodeSelection = new NodeSelection();
+        const range = nodeSelection.getRange(docElement);
+        const nodes = documentNode ? [documentNode] : range.collapsed ? nodeSelection.getNodeCollection(range) :
+            nodeSelection.getSelectionNodeCollectionBr(range);
+        const nodesLength = nodes.length;
+        let isNodeChanged = false;
+        for (let index = 0; index < nodes.length; index++) {
+            while (nodes[index].nodeType === 3 && range.startContainer.nodeType === 3 && nodes[index].parentNode &&
+                nodes[index].parentNode.lastElementChild && nodes[index].parentNode.lastElementChild.nodeName !== 'BR' &&
+                (this.getImmediateBlockNode(nodes[index].parentNode)).textContent.replace(/\u200B/g, '').length === 0 &&
+                range.startContainer.textContent.replace(/\u200B/g, '').length === 0 &&
+                nodeSelection.get(docElement).toString().replace(/\u200B/g, '').length === 0) {
+                nodes[index] = nodes[index].parentNode.lastElementChild.firstChild;
+                isNodeChanged = true;
+            }
+            if (isNodeChanged && nodes[index]) {
+                nodeSelection.setCursorPoint(docElement, nodes[index], nodes[index].textContent.length);
+                isNodeChanged = false;
+            }
+            if ((nodes[index].nodeName !== 'BR' && nodes[index].nodeType !== 3) ||
+                (nodesLength > 1 && nodes[index].nodeType === 3 && nodes[index].textContent.trim() === '')) {
+                nodes.splice(index, 1);
+                index--;
+            }
+        }
+        for (let index = 0; index < nodes.length; index++) {
+            // eslint-disable-next-line max-len
+            formatCollection = this.getFormatParent(docElement, formatCollection, nodes[index], targetNode, formatNode, fontSize, fontName);
+            if ((index === 0 && formatCollection.bold) || !formatCollection.bold) {
+                nodeCollection.bold = formatCollection.bold;
+            }
+            if ((index === 0 && formatCollection.insertcode) || !formatCollection.insertcode) {
+                nodeCollection.insertcode = formatCollection.insertcode;
+            }
+            if ((index === 0 && formatCollection.italic) || !formatCollection.italic) {
+                nodeCollection.italic = formatCollection.italic;
+            }
+            if ((index === 0 && formatCollection.underline) || !formatCollection.underline) {
+                nodeCollection.underline = formatCollection.underline;
+            }
+            if ((index === 0 && formatCollection.strikethrough) || !formatCollection.strikethrough) {
+                nodeCollection.strikethrough = formatCollection.strikethrough;
+            }
+            if ((index === 0 && formatCollection.superscript) || !formatCollection.superscript) {
+                nodeCollection.superscript = formatCollection.superscript;
+            }
+            if ((index === 0 && formatCollection.subscript) || !formatCollection.subscript) {
+                nodeCollection.subscript = formatCollection.subscript;
+            }
+            if ((index === 0 && formatCollection.fontcolor) || !formatCollection.fontcolor) {
+                nodeCollection.fontcolor = formatCollection.fontcolor;
+            }
+            if ((index === 0 && formatCollection.fontname) || !formatCollection.fontname) {
+                nodeCollection.fontname = formatCollection.fontname;
+            }
+            if ((index === 0 && formatCollection.fontsize) || !formatCollection.fontsize) {
+                nodeCollection.fontsize = formatCollection.fontsize;
+            }
+            if ((index === 0 && formatCollection.backgroundcolor) || !formatCollection.backgroundcolor) {
+                nodeCollection.backgroundcolor = formatCollection.backgroundcolor;
+            }
+            if ((index === 0 && formatCollection.orderedlist) || !formatCollection.orderedlist) {
+                nodeCollection.orderedlist = formatCollection.orderedlist;
+            }
+            if ((index === 0 && formatCollection.unorderedlist) || !formatCollection.unorderedlist) {
+                nodeCollection.unorderedlist = formatCollection.unorderedlist;
+            }
+            if ((index === 0 && formatCollection.alignments) || !formatCollection.alignments) {
+                nodeCollection.alignments = formatCollection.alignments;
+            }
+            if ((index === 0 && formatCollection.formats) || !formatCollection.formats) {
+                nodeCollection.formats = formatCollection.formats;
+            }
+            if ((index === 0 && formatCollection.createlink) || !formatCollection.createlink) {
+                nodeCollection.createlink = formatCollection.createlink;
+            }
+            if ((index === 0 && formatCollection.numberFormatList) || !formatCollection.numberFormatList) {
+                nodeCollection.numberFormatList = formatCollection.numberFormatList;
+            }
+            if ((index === 0 && formatCollection.bulletFormatList) || !formatCollection.bulletFormatList) {
+                nodeCollection.bulletFormatList = formatCollection.bulletFormatList;
+            }
+            formatCollection = JSON.parse(JSON.stringify(statusCollection));
+        }
+        return nodeCollection;
     }
-    editorKeyUp(e) {
-        this.observer.notify(KEY_UP_HANDLER, e);
+    static getImmediateBlockNode(node) {
+        do {
+            node = node.parentNode;
+        } while (node && BLOCK_TAGS.indexOf(node.nodeName.toLocaleLowerCase()) < 0);
+        return node;
     }
-    onBegin(e) {
-        this.observer.notify(SPACE_ACTION, e);
-    }
-    /* eslint-disable */
-    /**
-     * execCommand
-     *
-     * @param {ExecCommand} command - specifies the execution command
-     * @param {T} value - specifes the value.
-     * @param {Event} event - specifies the call back event
-     * @param {Function} callBack - specifies the function
-     * @param {string} text - specifies the string value
-     * @param {T} exeValue - specifies the values to be executed
-     * @param {string} selector - specifies the selector values
-     * @returns {void}
-     * @hidden
-     * @deprecated
-     */
-    /* eslint-enable */
-    execCommand(command, value, event, callBack, text, exeValue, selector, enterAction) {
-        switch (command.toLowerCase()) {
-            case 'lists':
-                this.observer.notify(LIST_TYPE, { subCommand: value, event: event, callBack: callBack,
-                    selector: selector, item: exeValue, enterAction: enterAction });
-                break;
-            case 'formats':
-                this.observer.notify(FORMAT_TYPE, { subCommand: value, event: event, callBack: callBack,
-                    selector: selector, exeValue: exeValue, enterAction: enterAction
-                });
-                break;
-            case 'alignments':
-                this.observer.notify(ALIGNMENT_TYPE, {
-                    subCommand: value, event: event, callBack: callBack,
-                    selector: selector,
-                    value: exeValue
-                });
-                break;
-            case 'indents':
-                this.observer.notify(INDENT_TYPE, { subCommand: value, event: event, callBack: callBack, selector: selector });
-                break;
-            case 'links':
-                this.observer.notify(LINK, { command: command, value: value, item: exeValue, event: event, callBack: callBack });
-                break;
-            case 'files':
-                this.observer.notify(IMAGE, {
-                    command: command, value: 'Image', item: exeValue, event: event, callBack: callBack, selector: selector
-                });
-                break;
-            case 'images':
-                this.observer.notify(IMAGE, {
-                    command: command, value: value, item: exeValue, event: event, callBack: callBack, selector: selector
-                });
-                break;
-            case 'audios':
-                this.observer.notify(AUDIO, {
-                    command: command, value: value, item: exeValue, event: event, callBack: callBack, selector: selector
-                });
-                break;
-            case 'videos':
-                this.observer.notify(VIDEO, {
-                    command: command, value: value, item: exeValue, event: event, callBack: callBack, selector: selector
-                });
-                break;
-            case 'table':
-                switch (value.toString().toLocaleLowerCase()) {
-                    case 'createtable':
-                        this.observer.notify(TABLE, { item: exeValue, event: event, callBack: callBack, enterAction: enterAction });
-                        break;
-                    case 'insertrowbefore':
-                    case 'insertrowafter':
-                        this.observer.notify(INSERT_ROW, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                    case 'insertcolumnleft':
-                    case 'insertcolumnright':
-                        this.observer.notify(INSERT_COLUMN, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                    case 'deleterow':
-                        this.observer.notify(DELETEROW, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                    case 'deletecolumn':
-                        this.observer.notify(DELETECOLUMN, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                    case 'tableremove':
-                        this.observer.notify(REMOVETABLE, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                    case 'tableheader':
-                        this.observer.notify(TABLEHEADER, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                    case 'aligntop':
-                    case 'alignmiddle':
-                    case 'alignbottom':
-                        this.observer.notify(TABLE_VERTICAL_ALIGN, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                    case 'merge':
-                        this.observer.notify(TABLE_MERGE, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                    case 'horizontalsplit':
-                        this.observer.notify(TABLE_HORIZONTAL_SPLIT, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                    case 'verticalsplit':
-                        this.observer.notify(TABLE_VERTICAL_SPLIT, { item: exeValue, event: event, callBack: callBack });
-                        break;
-                }
-                break;
-            case 'font':
-            case 'style':
-            case 'effects':
-            case 'casing':
-                this.observer.notify(SELECTION_TYPE, { subCommand: value, event: event, callBack: callBack, value: text, selector: selector, enterAction: enterAction });
-                break;
-            case 'inserthtml':
-                this.observer.notify(INSERTHTML_TYPE, { subCommand: value, callBack: callBack, value: text, enterAction: enterAction });
-                break;
-            case 'inserttext':
-                this.observer.notify(INSERT_TEXT_TYPE, { subCommand: value, callBack: callBack, value: text });
-                break;
-            case 'clear':
-                this.observer.notify(CLEAR_TYPE, { subCommand: value, event: event, callBack: callBack, selector: selector, enterAction: enterAction });
-                break;
-            case 'actions':
-                this.observer.notify(ACTION, { subCommand: value, event: event, callBack: callBack, selector: selector });
-                break;
-        }
-    }
-}
-
-/**
- * HTML adapter
- *
- * @hidden
- * @deprecated
- */
-class HTMLFormatter extends Formatter {
-    constructor(options) {
-        super();
-        this.initialize();
-        extend(this, this, options, true);
-        if (this.currentDocument && this.element) {
-            this.updateFormatter(this.element, this.currentDocument, options.options);
-        }
-    }
-    initialize() {
-        this.keyConfig = htmlKeyConfig;
-    }
-    /**
-     * Update the formatter of RichTextEditor
-     *
-     * @param  {Element} editElement - specifies the edit element.
-     * @param  {Document} doc - specifies the doucment
-     * @param {number} options - specifies the options
-     * @returns {void}
-     * @hidden
-     * @deprecated
-     */
-    updateFormatter(editElement, doc, options) {
-        if (editElement && doc) {
-            this.editorManager = new EditorManager({
-                document: doc,
-                editableElement: editElement,
-                options: options
-            });
-        }
-    }
-}
-
-/**
- * Update Toolbar Status
- *
- * @hidden
- * @deprecated
- */
-const statusCollection = getDefaultHtmlTbStatus();
-class ToolbarStatus {
-    /**
-     * get method
-     *
-     * @param {Document} docElement - specifies the document element
-     * @param {Node} targetNode - specifies the target node
-     * @param {string[]} formatNode - specifies the format node
-     * @param {string[]} fontSize - specifies the font size
-     * @param {string[]} fontName - specifies the font name.
-     * @param {Node} documentNode - specifies the document node.
-     * @returns {IToolbarStatus} - returns the toolbar status
-     * @hidden
-     * @deprecated
-     */
-    static get(docElement, targetNode, formatNode, fontSize, fontName, documentNode) {
-        let formatCollection = JSON.parse(JSON.stringify(statusCollection));
-        const nodeCollection = JSON.parse(JSON.stringify(statusCollection));
-        const nodeSelection = new NodeSelection();
-        const range = nodeSelection.getRange(docElement);
-        const nodes = documentNode ? [documentNode] : range.collapsed ? nodeSelection.getNodeCollection(range) :
-            nodeSelection.getSelectionNodeCollectionBr(range);
-        const nodesLength = nodes.length;
-        let isNodeChanged = false;
-        for (let index = 0; index < nodes.length; index++) {
-            while (nodes[index].nodeType === 3 && range.startContainer.nodeType === 3 && nodes[index].parentNode &&
-                nodes[index].parentNode.lastElementChild && nodes[index].parentNode.lastElementChild.nodeName !== 'BR' &&
-                (this.getImmediateBlockNode(nodes[index].parentNode)).textContent.replace(/\u200B/g, '').length === 0 &&
-                range.startContainer.textContent.replace(/\u200B/g, '').length === 0 &&
-                nodeSelection.get(docElement).toString().replace(/\u200B/g, '').length === 0) {
-                nodes[index] = nodes[index].parentNode.lastElementChild.firstChild;
-                isNodeChanged = true;
-            }
-            if (isNodeChanged && nodes[index]) {
-                nodeSelection.setCursorPoint(docElement, nodes[index], nodes[index].textContent.length);
-                isNodeChanged = false;
-            }
-            if ((nodes[index].nodeName !== 'BR' && nodes[index].nodeType !== 3) ||
-                (nodesLength > 1 && nodes[index].nodeType === 3 && nodes[index].textContent.trim() === '')) {
-                nodes.splice(index, 1);
-                index--;
-            }
-        }
-        for (let index = 0; index < nodes.length; index++) {
-            // eslint-disable-next-line max-len
-            formatCollection = this.getFormatParent(docElement, formatCollection, nodes[index], targetNode, formatNode, fontSize, fontName);
-            if ((index === 0 && formatCollection.bold) || !formatCollection.bold) {
-                nodeCollection.bold = formatCollection.bold;
-            }
-            if ((index === 0 && formatCollection.insertcode) || !formatCollection.insertcode) {
-                nodeCollection.insertcode = formatCollection.insertcode;
-            }
-            if ((index === 0 && formatCollection.italic) || !formatCollection.italic) {
-                nodeCollection.italic = formatCollection.italic;
-            }
-            if ((index === 0 && formatCollection.underline) || !formatCollection.underline) {
-                nodeCollection.underline = formatCollection.underline;
-            }
-            if ((index === 0 && formatCollection.strikethrough) || !formatCollection.strikethrough) {
-                nodeCollection.strikethrough = formatCollection.strikethrough;
-            }
-            if ((index === 0 && formatCollection.superscript) || !formatCollection.superscript) {
-                nodeCollection.superscript = formatCollection.superscript;
-            }
-            if ((index === 0 && formatCollection.subscript) || !formatCollection.subscript) {
-                nodeCollection.subscript = formatCollection.subscript;
-            }
-            if ((index === 0 && formatCollection.fontcolor) || !formatCollection.fontcolor) {
-                nodeCollection.fontcolor = formatCollection.fontcolor;
-            }
-            if ((index === 0 && formatCollection.fontname) || !formatCollection.fontname) {
-                nodeCollection.fontname = formatCollection.fontname;
-            }
-            if ((index === 0 && formatCollection.fontsize) || !formatCollection.fontsize) {
-                nodeCollection.fontsize = formatCollection.fontsize;
-            }
-            if ((index === 0 && formatCollection.backgroundcolor) || !formatCollection.backgroundcolor) {
-                nodeCollection.backgroundcolor = formatCollection.backgroundcolor;
-            }
-            if ((index === 0 && formatCollection.orderedlist) || !formatCollection.orderedlist) {
-                nodeCollection.orderedlist = formatCollection.orderedlist;
-            }
-            if ((index === 0 && formatCollection.unorderedlist) || !formatCollection.unorderedlist) {
-                nodeCollection.unorderedlist = formatCollection.unorderedlist;
-            }
-            if ((index === 0 && formatCollection.alignments) || !formatCollection.alignments) {
-                nodeCollection.alignments = formatCollection.alignments;
-            }
-            if ((index === 0 && formatCollection.formats) || !formatCollection.formats) {
-                nodeCollection.formats = formatCollection.formats;
-            }
-            if ((index === 0 && formatCollection.createlink) || !formatCollection.createlink) {
-                nodeCollection.createlink = formatCollection.createlink;
-            }
-            if ((index === 0 && formatCollection.numberFormatList) || !formatCollection.numberFormatList) {
-                nodeCollection.numberFormatList = formatCollection.numberFormatList;
-            }
-            if ((index === 0 && formatCollection.bulletFormatList) || !formatCollection.bulletFormatList) {
-                nodeCollection.bulletFormatList = formatCollection.bulletFormatList;
-            }
-            formatCollection = JSON.parse(JSON.stringify(statusCollection));
-        }
-        return nodeCollection;
-    }
-    static getImmediateBlockNode(node) {
-        do {
-            node = node.parentNode;
-        } while (node && BLOCK_TAGS.indexOf(node.nodeName.toLocaleLowerCase()) < 0);
-        return node;
-    }
-    static getFormatParent(docElement, formatCollection, node, targetNode, formatNode, fontSize, fontName) {
-        if (targetNode.contains(node) ||
-            (node.nodeType === 3 && targetNode.nodeType !== 3 && targetNode.contains(node.parentNode))) {
-            do {
-                formatCollection = this.isFormattedNode(docElement, formatCollection, node, formatNode, fontSize, fontName);
-                node = node.parentNode;
-            } while (node && (node !== targetNode));
-        }
-        return formatCollection;
+    static getFormatParent(docElement, formatCollection, node, targetNode, formatNode, fontSize, fontName) {
+        if (targetNode.contains(node) ||
+            (node.nodeType === 3 && targetNode.nodeType !== 3 && targetNode.contains(node.parentNode))) {
+            do {
+                formatCollection = this.isFormattedNode(docElement, formatCollection, node, formatNode, fontSize, fontName);
+                node = node.parentNode;
+            } while (node && (node !== targetNode));
+        }
+        return formatCollection;
     }
     static isFormattedNode(docElement, formatCollection, node, formatNode, fontSize, fontName) {
         if (!formatCollection.bold) {
@@ -18059,63 +18030,766 @@ class ToolbarStatus {
             return null;
         }
     }
-    static isFormats(node, formatNode) {
-        if (((formatNode === undefined || formatNode === null)
-            && BLOCK_TAGS.indexOf(node.nodeName.toLocaleLowerCase()) > -1)
-            || (formatNode !== null && formatNode !== undefined
-                && formatNode.indexOf(node.nodeName.toLocaleLowerCase()) > -1)) {
-            return node.nodeName.toLocaleLowerCase();
-        }
-        else {
-            return null;
+    static isFormats(node, formatNode) {
+        if (((formatNode === undefined || formatNode === null)
+            && BLOCK_TAGS.indexOf(node.nodeName.toLocaleLowerCase()) > -1)
+            || (formatNode !== null && formatNode !== undefined
+                && formatNode.indexOf(node.nodeName.toLocaleLowerCase()) > -1)) {
+            return node.nodeName.toLocaleLowerCase();
+        }
+        else {
+            return null;
+        }
+    }
+    static getComputedStyle(docElement, node, prop) {
+        return docElement.defaultView.getComputedStyle(node, null).getPropertyValue(prop);
+    }
+    static isNumberFormatList(node) {
+        const list = node.style && node.style.listStyleType;
+        if (list === 'lower-alpha') {
+            return 'Lower Alpha';
+        }
+        else if (list === 'number') {
+            return 'Number';
+        }
+        else if (list === 'upper-alpha') {
+            return 'Upper Alpha';
+        }
+        else if (list === 'lower-roman') {
+            return 'Lower Roman';
+        }
+        else if (list === 'upper-roman') {
+            return 'Upper Roman';
+        }
+        else if (list === 'lower-greek') {
+            return 'Lower Greek';
+        }
+        else if (list === 'none') {
+            return 'None';
+        }
+        else {
+            return null;
+        }
+    }
+    static isBulletFormatList(node) {
+        const list = node.style && node.style.listStyleType;
+        if (list === 'circle') {
+            return 'Circle';
+        }
+        else if (list === 'square') {
+            return 'Square';
+        }
+        else if (list === 'none') {
+            return 'None';
+        }
+        else if (list === 'disc') {
+            return 'Disc';
+        }
+        else {
+            return null;
+        }
+    }
+}
+
+/**
+ * Base export
+ */
+
+class FormatPainterActions {
+    constructor(parent, options) {
+        this.parent = parent;
+        this.settings = options;
+        this.addEventListener();
+        this.setDeniedFormats();
+    }
+    addEventListener() {
+        this.parent.observer.on(FORMAT_PAINTER_ACTIONS, this.actionHandler, this);
+    }
+    actionHandler(args) {
+        if (!isNullOrUndefined(args) && !isNullOrUndefined(args.item) && !isNullOrUndefined(args.item.formatPainterAction)) {
+            switch (args.item.formatPainterAction) {
+                case 'format-copy':
+                    this.copyAction();
+                    break;
+                case 'format-paste':
+                    this.pasteAction();
+                    break;
+                case 'escape':
+                    this.escapeAction();
+                    break;
+            }
+        }
+    }
+    generateElement() {
+        const copyCollection = this.copyCollection.slice(); // To clone without reversing the collcection array
+        copyCollection.reverse();
+        const length = copyCollection.length;
+        const elemCollection = createElement('div', { className: 'e-format-paste-wrapper' });
+        let lastAppendChild;
+        for (let i = 0; i < length; i++) {
+            const { attrs, className, styles, tagName } = copyCollection[i];
+            const elem = createElement(tagName);
+            if (className !== '') {
+                elem.className = className;
+            }
+            for (let i = 0; i < attrs.length; i++) {
+                const property = attrs[i].name;
+                const value = attrs[i].value;
+                elem.setAttribute(property, value);
+            }
+            for (let i = 0; i < styles.length; i++) {
+                const property = styles[i].property;
+                const value = styles[i].value;
+                const priority = styles[i].priority;
+                elem.style.setProperty(property, value, priority);
+            }
+            if (elemCollection.childElementCount === 0) {
+                elemCollection.append(elem);
+                lastAppendChild = elem;
+            }
+            else {
+                lastAppendChild.append(elem);
+                lastAppendChild = elem;
+            }
+        }
+        const elemChild = this.removeDeniedFormats(elemCollection);
+        let currentElem = elemChild;
+        while (currentElem) {
+            if (currentElem.firstChild === null) {
+                lastAppendChild = currentElem;
+                currentElem = undefined;
+            }
+            else {
+                currentElem = currentElem.firstChild;
+            }
+        }
+        this.newElem = elemChild;
+        this.newElemLastChild = lastAppendChild;
+    }
+    pasteAction() {
+        if (isNullOrUndefined(this.copyCollection) || this.copyCollection.length === 0) {
+            this.paintPlainTextFormat();
+            return;
+        }
+        this.insertFormatNode(this.newElem, this.newElemLastChild);
+        this.parent.undoRedoManager.saveData();
+    }
+    removeDeniedFormats(parentElement) {
+        if (!isNullOrUndefined(this.deniedFormatsCollection) && this.deniedFormatsCollection.length > 0) {
+            const deniedPropArray = this.deniedFormatsCollection;
+            const length = deniedPropArray.length;
+            for (let i = 0; i < length; i++) {
+                const tag = deniedPropArray[i].tag;
+                if (deniedPropArray[i].tag) {
+                    const elementsList = parentElement.querySelectorAll(tag);
+                    for (let j = 0; j < elementsList.length; j++) {
+                        if (deniedPropArray[i].classes.length > 0) {
+                            const classes = deniedPropArray[i].classes;
+                            const classLength = classes.length;
+                            for (let k = 0; k < classLength; k++) {
+                                if (elementsList[j].classList.contains(classes[k])) {
+                                    removeClass([elementsList[j]], classes[k]);
+                                }
+                            }
+                            if (elementsList[j].classList.length === 0) {
+                                elementsList[j].removeAttribute('class');
+                            }
+                        }
+                        if (deniedPropArray[i].styles.length > 0) {
+                            const styles = deniedPropArray[i].styles;
+                            const styleLength = styles.length;
+                            for (let k = 0; k < styleLength; k++) {
+                                elementsList[j].style.removeProperty(styles[k]);
+                            }
+                            if (elementsList[j].style.length === 0) {
+                                elementsList[j].removeAttribute('style');
+                            }
+                        }
+                        if (deniedPropArray[i].attributes.length > 0) {
+                            const attributes$$1 = deniedPropArray[i].attributes;
+                            const attributeLength = attributes$$1.length;
+                            for (let k = 0; k < attributeLength; k++) {
+                                elementsList[j].removeAttribute(attributes$$1[k]);
+                            }
+                        }
+                    }
+                }
+            }
+        }
+        return parentElement.firstElementChild;
+    }
+    copyAction() {
+        const copyCollection = [];
+        const range = this.parent.nodeSelection.getRange(document);
+        let parentElem = range.startContainer.parentElement;
+        let currentContext = this.findCurrentContext(parentElem);
+        const allowedRulesArray = this.settings.allowedFormats.split(';');
+        for (let i = 0; i < allowedRulesArray.length; i++) {
+            allowedRulesArray[i] = allowedRulesArray[i].trim();
+        }
+        const [rangeParentElem, context] = this.getRangeParentElem(currentContext, range);
+        if (currentContext === null) {
+            currentContext = context;
+        }
+        if (!isNullOrUndefined(currentContext) && this.settings.allowedContext.indexOf(currentContext) > -1) {
+            if (range.startContainer.nodeName === '#text') {
+                parentElem = range.startContainer.parentElement;
+            }
+            const lastElement = parentElem;
+            do {
+                if (allowedRulesArray.indexOf(parentElem.nodeName.toLowerCase()) > -1) {
+                    const allAttributes = parentElem.attributes;
+                    const attribute = [];
+                    for (let i = 0; i < allAttributes.length; i++) {
+                        if (allAttributes[i].name !== 'class' && allAttributes[i].name !== 'style') {
+                            attribute.push(allAttributes[i]);
+                        }
+                    }
+                    const classes = parentElem.className;
+                    const allStyles = parentElem.style;
+                    const styleProp = [];
+                    for (let i = 0; i < allStyles.length; i++) {
+                        const property = allStyles[i];
+                        const value = allStyles.getPropertyValue(property);
+                        const priority = allStyles.getPropertyPriority(property);
+                        styleProp.push({ property: property, value: value, priority: priority });
+                    }
+                    copyCollection.push({
+                        attrs: attribute, className: classes, styles: styleProp, tagName: parentElem.nodeName
+                    });
+                }
+                if (rangeParentElem === parentElem) {
+                    parentElem = undefined;
+                }
+                else if (!isNullOrUndefined(parentElem.parentElement)) {
+                    parentElem = parentElem.parentElement;
+                }
+                if (lastElement === parentElem) {
+                    break;
+                }
+            } while (!isNullOrUndefined(parentElem) || parentElem === this.parent.editableElement);
+            this.copyCollection = copyCollection;
+        }
+        this.generateElement();
+    }
+    getRangeParentElem(currentContext, range) {
+        let startContainer = range.startContainer;
+        let rangeParentELem;
+        if (startContainer.nodeType === 3) {
+            startContainer = startContainer.parentElement;
+        }
+        switch (currentContext) {
+            case 'Table':
+                rangeParentELem = closest(startContainer, 'td');
+                if (isNullOrUndefined(rangeParentELem)) {
+                    rangeParentELem = closest(startContainer, 'th');
+                }
+                break;
+            case 'List':
+                rangeParentELem = closest(startContainer, 'li');
+                break;
+            case 'Text':
+                rangeParentELem = closest(startContainer, 'p');
+                break;
+        }
+        if (isNullOrUndefined(rangeParentELem)) {
+            const nearBlockParentName = this.getNearestBlockParentElement(range);
+            if (!isNullOrUndefined(nearBlockParentName) && nearBlockParentName !== 'UL' &&
+                nearBlockParentName !== 'OL' && nearBlockParentName !== 'LI') {
+                rangeParentELem = closest(startContainer, nearBlockParentName);
+                currentContext = 'Text';
+            }
+        }
+        if (currentContext === 'List') {
+            rangeParentELem = rangeParentELem.parentElement;
+        }
+        return [rangeParentELem, currentContext];
+    }
+    getNearestBlockParentElement(range) {
+        let node = range.commonAncestorContainer;
+        if (node.nodeType === 3) {
+            node = node.parentNode;
+        }
+        // iterate untill the content editable div
+        while (node && node !== this.parent.editableElement) {
+            // If true return the block node name.
+            if (!isNullOrUndefined(node) && this.isBlockElement(node)) {
+                return node.nodeName;
+            }
+            // if false re assign node to parent node
+            node = node.parentNode;
+        }
+        return null;
+    }
+    isBlockElement(node) {
+        const blockTags = ['P', 'DIV', 'UL', 'OL', 'LI', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6',
+            'ADDRESS', 'ARTICLE', 'ASIDE', 'BLOCKQUOTE', 'FIGCAPTION', 'FIGURE', 'FOOTER', 'HEADER',
+            'HR', 'MAIN', 'NAV', 'SECTION', 'SUMMARY', 'PRE'];
+        return blockTags.indexOf(node.nodeName) > -1;
+    }
+    escapeAction() {
+        this.copyCollection = [];
+    }
+    paintPlainTextFormat() {
+        const range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
+        const domSelection = this.parent.nodeSelection;
+        const nodes = range.collapsed ? domSelection.getSelectionNodeCollection(range) :
+            domSelection.getSelectionNodeCollectionBr(range);
+        let isInValid;
+        if (nodes.length > 1) {
+            for (let i = 0; i < nodes.length; i++) {
+                isInValid = this.validateELementTag(nodes[i]);
+            }
+        }
+        else {
+            isInValid = this.validateELementTag(range.startContainer) && this.validateELementTag(range.endContainer);
+        }
+        if (!isInValid) {
+            this.parent.execCommand('Clear', 'ClearFormat', null, null);
+        }
+    }
+    validateELementTag(node) {
+        const INVALID_TAGS = ['A', 'AUDIO', 'IMG', 'VIDEO', 'IFRAME'];
+        if (node.nodeType === 3) {
+            node = node.parentElement;
+        }
+        return INVALID_TAGS.indexOf(node.tagName) > -1;
+    }
+    findCurrentContext(parentElem) {
+        if (closest(parentElem, 'td') || closest(parentElem, 'tr') || closest(parentElem, 'tbody')) {
+            return 'Table';
+        }
+        else if (closest(parentElem, 'li')) {
+            return 'List';
+        }
+        else if (closest(parentElem, 'p')) {
+            return 'Text';
+        }
+        return null;
+    }
+    insertFormatNode(elem, lastChild) {
+        const endNode = this.parent.editableElement;
+        const docElement = this.parent.currentDocument;
+        const domSelection = this.parent.nodeSelection;
+        const clonedElem = elem.cloneNode(true);
+        let childElem = clonedElem.firstChild;
+        let inlineElement;
+        while (childElem) {
+            if (this.isBlockElement(childElem)) {
+                childElem = childElem.firstChild;
+            }
+            else {
+                inlineElement = childElem.parentNode.removeChild(childElem);
+                break;
+            }
+        }
+        const formatValues = {
+            element: inlineElement,
+            lastChild: lastChild
+        };
+        SelectionCommands.applyFormat(docElement, null, endNode, 'P', 'formatPainter', null, formatValues);
+        let isFullNodeSelected;
+        const range = this.parent.nodeSelection.getRange(docElement);
+        const isCollapsed = range.collapsed;
+        const nodes = range.collapsed ? domSelection.getSelectionNodeCollection(range) :
+            domSelection.getSelectionNodeCollectionBr(range);
+        if (nodes.length === 1) {
+            while (!this.isBlockElement(nodes[0])) {
+                nodes[0] = nodes[0].parentElement;
+            }
+            isFullNodeSelected = nodes[0].textContent.trim() === range.commonAncestorContainer.wholeText.trim();
+        }
+        if (this.isBlockElement(elem) && isCollapsed || nodes.length > 1 || isFullNodeSelected) {
+            this.insertBlockNode(elem, range, docElement, endNode, nodes);
+        }
+    }
+    insertBlockNode(element, range, docElement, endNode, nodes) {
+        const domSelection = this.parent.nodeSelection;
+        let listElement; // To clone to multiple list elements
+        let cloneListParentNode;
+        if (element.nodeName === 'UL' || element.nodeName === 'OL') {
+            cloneListParentNode = element.cloneNode(true);
+            listElement = cloneListParentNode.firstChild;
+        }
+        const textNode = range.startContainer; // To set cursor position
+        for (let index = 0; index < nodes.length; index++) {
+            const lastTextNode = nodes[index];
+            if (nodes[index].nodeType === 3) {
+                nodes[index] = nodes[index].parentElement;
+            }
+            while (!this.isBlockElement(nodes[index])) {
+                nodes[index] = nodes[index].parentElement;
+            }
+            let cloneParentNode;
+            if (!isNullOrUndefined(cloneListParentNode)) {
+                cloneParentNode = listElement.cloneNode(true);
+            }
+            else {
+                cloneParentNode = element.cloneNode(true);
+            }
+            // Appending all the child elements
+            while (nodes[index].firstChild) {
+                if (cloneParentNode.nodeName === 'LI') {
+                    cloneParentNode.appendChild(nodes[index].firstChild);
+                }
+                else {
+                    // Except list nodes other block nodes replaced here
+                    if (nodes[index].nodeType === 3) {
+                        cloneParentNode.appendChild(nodes[index].firstChild);
+                    }
+                    else {
+                        cloneParentNode.innerHTML = nodes[index].innerHTML;
+                        nodes[index].innerHTML = '';
+                    }
+                    nodes[index] = nodes[index].parentNode.replaceChild(cloneParentNode, nodes[index]);
+                }
+            }
+            if (cloneParentNode.nodeName === 'LI') {
+                // Appending the li nodes to the ol or ul node
+                cloneListParentNode.append(cloneParentNode);
+                if (index === 0) {
+                    const nodeName = nodes[index].nodeName;
+                    nodes[index] = nodes[index].parentNode.replaceChild(cloneListParentNode, nodes[index]);
+                    const parent = nodeName === 'LI' ? cloneListParentNode.parentElement
+                        : cloneListParentNode;
+                    // Splicing and then inserting the node to previous element sibling of the Listparent.parent
+                    this.parent.nodeCutter.SplitNode(range, parent, true);
+                    if (!isNullOrUndefined(parent.previousElementSibling)) {
+                        parent.parentNode.insertBefore(cloneListParentNode, parent.nextElementSibling);
+                    }
+                    else {
+                        parent.parentElement.insertBefore(cloneListParentNode, parent);
+                    }
+                }
+                detach(nodes[index]);
+            }
+            /**Removing the inserted block node in list and appending to previous element sibling */
+            if (cloneParentNode.nodeName !== 'LI' && (cloneParentNode.parentElement.nodeName === 'OL' ||
+                cloneParentNode.parentElement.nodeName === 'UL')) {
+                const parent = cloneParentNode.parentElement;
+                // Cutting single ul or ol to two ul or ol based on the range
+                this.parent.nodeCutter.SplitNode(range, parent, true);
+                if (!isNullOrUndefined(parent.previousElementSibling)) {
+                    parent.previousElementSibling.after(cloneParentNode);
+                }
+                else {
+                    parent.parentElement.prepend(cloneParentNode);
+                }
+            }
+            nodes[index] = lastTextNode;
+        }
+        // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+        !isNullOrUndefined(listElement) ? detach(listElement) : false;
+        this.cleanEmptyLists();
+        if (nodes.length > 1) {
+            const startSelectNode = nodes[0];
+            const endSelectNode = nodes[nodes.length - 1];
+            domSelection.setSelectionText(docElement, startSelectNode, endSelectNode, 0, endSelectNode.textContent.length);
+        }
+        else {
+            domSelection.setCursorPoint(docElement, textNode, textNode.textContent.length);
+        }
+    }
+    cleanEmptyLists() {
+        const listElem = this.parent.editableElement.querySelectorAll('ol, ul');
+        for (let i = 0; i < listElem.length; i++) {
+            if (listElem[i].textContent.trim() === '') {
+                detach(listElem[i]);
+            }
+        }
+    }
+    setDeniedFormats() {
+        const deniedFormatsCollection = [];
+        if (isNullOrUndefined(this.settings) || isNullOrUndefined(this.settings.deniedFormats)) {
+            return;
+        }
+        const deniedFormats = this.settings.deniedFormats.split(';');
+        const length = deniedFormats.length;
+        for (let i = 0; i < length; i++) {
+            const formatString = deniedFormats[i];
+            if (formatString !== '') {
+                formatString.trim();
+                const collection = this.makeDeniedFormatsCollection(formatString);
+                if (!isNullOrUndefined(collection)) {
+                    deniedFormatsCollection.push(collection);
+                }
+            }
+        }
+        this.deniedFormatsCollection = deniedFormatsCollection;
+    }
+    makeDeniedFormatsCollection(value) {
+        const openParenIndex = value.indexOf('(');
+        const closeParenIndex = value.indexOf(')');
+        const openBracketIndex = value.indexOf('[');
+        const closeBracketIndex = value.indexOf(']');
+        const openBraceIndex = value.indexOf('{');
+        const closeBraceIndex = value.indexOf('}');
+        let classes = [];
+        let attributes$$1 = '';
+        let styles = '';
+        let tagName = '';
+        let classList = [];
+        let attributesList = [];
+        let stylesList = [];
+        if (openParenIndex > -1 && closeParenIndex > -1) {
+            classes = value.substring(openParenIndex + 1, closeParenIndex).split(' ');
+            classList = classes[0].split(')')[0].split(',');
+        }
+        if (openBracketIndex > -1 && closeBracketIndex > -1) {
+            attributes$$1 = value.substring(openBracketIndex + 1, closeBracketIndex);
+            attributesList = attributes$$1.split(',');
+        }
+        if (openBraceIndex > -1 && closeBraceIndex > -1) {
+            styles = value.substring(openBraceIndex + 1, closeBraceIndex);
+            stylesList = styles.split(',');
+        }
+        let openIndexArray = [openParenIndex, openBracketIndex, openBraceIndex];
+        openIndexArray = openIndexArray.filter((index) => index > -1);
+        const len = openIndexArray.length;
+        let min;
+        if (len === 1) {
+            min = openIndexArray[0];
+        }
+        else if (len === 2) {
+            min = Math.min(openIndexArray[0], openIndexArray[1]);
+        }
+        else if (len === 3) {
+            min = Math.min(openIndexArray[0], openIndexArray[1], openIndexArray[2]);
+        }
+        tagName = value.substring(0, min);
+        tagName.trim();
+        return ({
+            tag: tagName, styles: stylesList, classes: classList,
+            attributes: attributesList
+        });
+    }
+}
+
+/**
+ * EditorManager internal component
+ *
+ * @hidden
+ * @deprecated
+ */
+class EditorManager {
+    /**
+     * Constructor for creating the component
+     *
+     * @hidden
+     * @deprecated
+     * @param {ICommandModel} options - specifies the command Model
+     */
+    constructor(options) {
+        this.currentDocument = options.document;
+        this.editableElement = options.editableElement;
+        this.nodeSelection = new NodeSelection();
+        this.nodeCutter = new NodeCutter();
+        this.domNode = new DOMNode(this.editableElement, this.currentDocument);
+        this.observer = new Observer(this);
+        this.listObj = new Lists(this);
+        this.formatObj = new Formats(this);
+        this.alignmentObj = new Alignments(this);
+        this.indentsObj = new Indents(this);
+        this.linkObj = new LinkCommand(this);
+        this.imgObj = new ImageCommand(this);
+        this.audioObj = new AudioCommand(this);
+        this.videoObj = new VideoCommand(this);
+        this.selectionObj = new SelectionBasedExec(this);
+        this.inserthtmlObj = new InsertHtmlExec(this);
+        this.insertTextObj = new InsertTextExec(this);
+        this.clearObj = new ClearFormatExec(this);
+        this.tableObj = new TableCommand(this);
+        this.undoRedoManager = new UndoRedoManager(this, options.options);
+        this.msWordPaste = new MsWordPaste(this);
+        this.formatPaintetrObj = new FormatPainterActions(this, options.formatPainterSettings);
+        this.wireEvents();
+    }
+    wireEvents() {
+        this.observer.on(KEY_DOWN, this.editorKeyDown, this);
+        this.observer.on(KEY_UP, this.editorKeyUp, this);
+        this.observer.on(KEY_UP, this.editorKeyUp, this);
+        this.observer.on(MODEL_CHANGED, this.onPropertyChanged, this);
+        this.observer.on(MS_WORD_CLEANUP, this.onWordPaste, this);
+        this.observer.on(ON_BEGIN, this.onBegin, this);
+    }
+    onWordPaste(e) {
+        this.observer.notify(MS_WORD_CLEANUP_PLUGIN, e);
+    }
+    onPropertyChanged(props) {
+        this.observer.notify(MODEL_CHANGED_PLUGIN, props);
+    }
+    editorKeyDown(e) {
+        this.observer.notify(KEY_DOWN_HANDLER, e);
+    }
+    editorKeyUp(e) {
+        this.observer.notify(KEY_UP_HANDLER, e);
+    }
+    onBegin(e) {
+        this.observer.notify(SPACE_ACTION, e);
+    }
+    /* eslint-disable */
+    /**
+     * execCommand
+     *
+     * @param {ExecCommand} command - specifies the execution command
+     * @param {T} value - specifes the value.
+     * @param {Event} event - specifies the call back event
+     * @param {Function} callBack - specifies the function
+     * @param {string} text - specifies the string value
+     * @param {T} exeValue - specifies the values to be executed
+     * @param {string} selector - specifies the selector values
+     * @returns {void}
+     * @hidden
+     * @deprecated
+     */
+    /* eslint-enable */
+    execCommand(command, value, event, callBack, text, exeValue, selector, enterAction) {
+        switch (command.toLowerCase()) {
+            case 'lists':
+                this.observer.notify(LIST_TYPE, { subCommand: value, event: event, callBack: callBack,
+                    selector: selector, item: exeValue, enterAction: enterAction });
+                break;
+            case 'formats':
+                this.observer.notify(FORMAT_TYPE, { subCommand: value, event: event, callBack: callBack,
+                    selector: selector, exeValue: exeValue, enterAction: enterAction
+                });
+                break;
+            case 'alignments':
+                this.observer.notify(ALIGNMENT_TYPE, {
+                    subCommand: value, event: event, callBack: callBack,
+                    selector: selector,
+                    value: exeValue
+                });
+                break;
+            case 'indents':
+                this.observer.notify(INDENT_TYPE, { subCommand: value, event: event, callBack: callBack, selector: selector });
+                break;
+            case 'links':
+                this.observer.notify(LINK, { command: command, value: value, item: exeValue, event: event, callBack: callBack });
+                break;
+            case 'files':
+                this.observer.notify(IMAGE, {
+                    command: command, value: 'Image', item: exeValue, event: event, callBack: callBack, selector: selector
+                });
+                break;
+            case 'images':
+                this.observer.notify(IMAGE, {
+                    command: command, value: value, item: exeValue, event: event, callBack: callBack, selector: selector
+                });
+                break;
+            case 'audios':
+                this.observer.notify(AUDIO, {
+                    command: command, value: value, item: exeValue, event: event, callBack: callBack, selector: selector
+                });
+                break;
+            case 'videos':
+                this.observer.notify(VIDEO, {
+                    command: command, value: value, item: exeValue, event: event, callBack: callBack, selector: selector
+                });
+                break;
+            case 'table':
+                switch (value.toString().toLocaleLowerCase()) {
+                    case 'createtable':
+                        this.observer.notify(TABLE, { item: exeValue, event: event, callBack: callBack, enterAction: enterAction });
+                        break;
+                    case 'insertrowbefore':
+                    case 'insertrowafter':
+                        this.observer.notify(INSERT_ROW, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                    case 'insertcolumnleft':
+                    case 'insertcolumnright':
+                        this.observer.notify(INSERT_COLUMN, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                    case 'deleterow':
+                        this.observer.notify(DELETEROW, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                    case 'deletecolumn':
+                        this.observer.notify(DELETECOLUMN, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                    case 'tableremove':
+                        this.observer.notify(REMOVETABLE, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                    case 'tableheader':
+                        this.observer.notify(TABLEHEADER, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                    case 'aligntop':
+                    case 'alignmiddle':
+                    case 'alignbottom':
+                        this.observer.notify(TABLE_VERTICAL_ALIGN, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                    case 'merge':
+                        this.observer.notify(TABLE_MERGE, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                    case 'horizontalsplit':
+                        this.observer.notify(TABLE_HORIZONTAL_SPLIT, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                    case 'verticalsplit':
+                        this.observer.notify(TABLE_VERTICAL_SPLIT, { item: exeValue, event: event, callBack: callBack });
+                        break;
+                }
+                break;
+            case 'font':
+            case 'style':
+            case 'effects':
+            case 'casing':
+                this.observer.notify(SELECTION_TYPE, { subCommand: value, event: event, callBack: callBack, value: text, selector: selector, enterAction: enterAction });
+                break;
+            case 'inserthtml':
+                this.observer.notify(INSERTHTML_TYPE, { subCommand: value, callBack: callBack, value: text, enterAction: enterAction });
+                break;
+            case 'inserttext':
+                this.observer.notify(INSERT_TEXT_TYPE, { subCommand: value, callBack: callBack, value: text });
+                break;
+            case 'clear':
+                this.observer.notify(CLEAR_TYPE, { subCommand: value, event: event, callBack: callBack, selector: selector, enterAction: enterAction });
+                break;
+            case 'actions':
+                this.observer.notify(ACTION, { subCommand: value, event: event, callBack: callBack, selector: selector });
+                break;
+            case 'formatpainter':
+                this.observer.notify(FORMAT_PAINTER_ACTIONS, { item: exeValue, subCommand: value, event: event, callBack: callBack });
+                break;
+        }
+    }
+}
+
+/**
+ * HTML adapter
+ *
+ * @hidden
+ * @deprecated
+ */
+class HTMLFormatter extends Formatter {
+    constructor(options) {
+        super();
+        this.initialize();
+        extend(this, this, options, true);
+        if (this.currentDocument && this.element) {
+            this.updateFormatter(this.element, this.currentDocument, options.options, options.formatPainterSettings);
         }
     }
-    static getComputedStyle(docElement, node, prop) {
-        return docElement.defaultView.getComputedStyle(node, null).getPropertyValue(prop);
-    }
-    static isNumberFormatList(node) {
-        const list = node.style && node.style.listStyleType;
-        if (list === 'lower-alpha') {
-            return 'Lower Alpha';
-        }
-        else if (list === 'number') {
-            return 'Number';
-        }
-        else if (list === 'upper-alpha') {
-            return 'Upper Alpha';
-        }
-        else if (list === 'lower-roman') {
-            return 'Lower Roman';
-        }
-        else if (list === 'upper-roman') {
-            return 'Upper Roman';
-        }
-        else if (list === 'lower-greek') {
-            return 'Lower Greek';
-        }
-        else if (list === 'none') {
-            return 'None';
-        }
-        else {
-            return null;
-        }
+    initialize() {
+        this.keyConfig = htmlKeyConfig;
     }
-    static isBulletFormatList(node) {
-        const list = node.style && node.style.listStyleType;
-        if (list === 'circle') {
-            return 'Circle';
-        }
-        else if (list === 'square') {
-            return 'Square';
-        }
-        else if (list === 'none') {
-            return 'None';
-        }
-        else if (list === 'disc') {
-            return 'Disc';
-        }
-        else {
-            return null;
+    /**
+     * Update the formatter of RichTextEditor
+     *
+     * @param {Element} editElement - specifies the edit element.
+     * @param {Document} doc - specifies the doucment
+     * @param {number} options - specifies the options
+     * @param {FormatPainterSettingsModel} formatPainterSettings - specifies the format painter settings
+     * @returns {void}
+     * @hidden
+     * @deprecated
+     */
+    updateFormatter(editElement, doc, options, formatPainterSettings) {
+        if (editElement && doc) {
+            this.editorManager = new EditorManager({
+                document: doc,
+                editableElement: editElement,
+                options: options,
+                formatPainterSettings: formatPainterSettings
+            });
         }
     }
 }
@@ -19142,112 +19816,130 @@ class HtmlEditor {
         let selectParentEle;
         const item = args.item;
         const closestElement = closest(args.originalEvent.target, '.e-rte-quick-popup');
-        if (closestElement && !closestElement.classList.contains('e-rte-inline-popup')) {
-            if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||
-                item.subCommand === 'FontColor' || item.subCommand === 'BackgroundColor')) {
-                if (isIDevice$1() && item.command === 'Images') {
-                    this.nodeSelectionObj.restore();
-                }
-                const range = this.nodeSelectionObj.getRange(this.parent.contentModule.getDocument());
-                save = this.nodeSelectionObj.save(range, this.parent.contentModule.getDocument());
-                selectNodeEle = this.nodeSelectionObj.getNodeCollection(range);
-                selectParentEle = this.nodeSelectionObj.getParentNodeCollection(range);
-            }
-            if (item.command === 'Images') {
-                this.parent.notify(imageToolbarAction, {
-                    member: 'image', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
-                });
-            }
-            if (item.command === 'Audios') {
-                this.parent.notify(audioToolbarAction, {
-                    member: 'audio', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
-                });
-            }
-            if (item.command === 'Videos') {
-                this.parent.notify(videoToolbarAction, {
-                    member: 'video', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
-                });
-            }
-            if (item.command === 'Links') {
-                this.parent.notify(linkToolbarAction, {
-                    member: 'link', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
-                });
-            }
-            if (item.command === 'Table') {
-                this.parent.notify(tableToolbarAction, {
-                    member: 'table', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
-                });
-            }
-        }
-        else {
-            const linkDialog = document.getElementById(this.parent.getID() + '_rtelink');
-            const imageDialog = document.getElementById(this.parent.getID() + '_image');
-            if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||
-                item.subCommand === 'FontColor' || item.subCommand === 'BackgroundColor')) {
-                const range = this.nodeSelectionObj.getRange(this.parent.contentModule.getDocument());
-                if (isNullOrUndefined(linkDialog) && isNullOrUndefined(imageDialog)) {
+        if (item.command !== 'FormatPainter') {
+            if (closestElement && !closestElement.classList.contains('e-rte-inline-popup')) {
+                if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||
+                    item.subCommand === 'FontColor' || item.subCommand === 'BackgroundColor')) {
+                    if (isIDevice$1() && item.command === 'Images') {
+                        this.nodeSelectionObj.restore();
+                    }
+                    const range = this.nodeSelectionObj.getRange(this.parent.contentModule.getDocument());
                     save = this.nodeSelectionObj.save(range, this.parent.contentModule.getDocument());
+                    selectNodeEle = this.nodeSelectionObj.getNodeCollection(range);
+                    selectParentEle = this.nodeSelectionObj.getParentNodeCollection(range);
                 }
-                selectNodeEle = this.nodeSelectionObj.getNodeCollection(range);
-                selectParentEle = this.nodeSelectionObj.getParentNodeCollection(range);
-            }
-            switch (item.subCommand) {
-                case 'Maximize':
-                    this.parent.notify(enableFullScreen, { args: args });
-                    break;
-                case 'Minimize':
-                    this.parent.notify(disableFullScreen, { args: args });
-                    break;
-                case 'CreateLink':
-                    this.parent.notify(insertLink, {
-                        member: 'link', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
-                    });
-                    break;
-                case 'RemoveLink':
-                    this.parent.notify(unLink, {
-                        member: 'link', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
-                    });
-                    break;
-                case 'Print':
-                    this.parent.print();
-                    break;
-                case 'Image':
-                    this.parent.notify(insertImage, {
+                if (item.command === 'Images') {
+                    this.parent.notify(imageToolbarAction, {
                         member: 'image', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
                     });
-                    break;
-                case 'Audio':
-                    this.parent.notify(insertAudio, {
+                }
+                if (item.command === 'Audios') {
+                    this.parent.notify(audioToolbarAction, {
                         member: 'audio', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
                     });
-                    break;
-                case 'Video':
-                    this.parent.notify(insertVideo, {
+                }
+                if (item.command === 'Videos') {
+                    this.parent.notify(videoToolbarAction, {
                         member: 'video', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
                     });
-                    break;
-                case 'CreateTable':
-                    this.parent.notify(createTable, {
-                        member: 'table', args: args, selection: save
+                }
+                if (item.command === 'Links') {
+                    this.parent.notify(linkToolbarAction, {
+                        member: 'link', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
                     });
-                    break;
-                case 'SourceCode':
-                    this.parent.notify(sourceCode, { member: 'viewSource', args: args });
-                    break;
-                case 'Preview':
-                    this.parent.notify(updateSource, { member: 'updateSource', args: args });
-                    break;
-                case 'FontColor':
-                case 'BackgroundColor':
-                    break;
-                case 'File':
-                    this.parent.notify(renderFileManager, {
-                        member: 'fileManager', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
+                }
+                if (item.command === 'Table') {
+                    this.parent.notify(tableToolbarAction, {
+                        member: 'table', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
                     });
-                    break;
-                default:
-                    this.parent.formatter.process(this.parent, args, args.originalEvent, null);
-                    break;
+                }
+            }
+            else {
+                const linkDialog = document.getElementById(this.parent.getID() + '_rtelink');
+                const imageDialog = document.getElementById(this.parent.getID() + '_image');
+                if (!(item.subCommand === 'SourceCode' || item.subCommand === 'Preview' ||
+                    item.subCommand === 'FontColor' || item.subCommand === 'BackgroundColor')) {
+                    const range = this.nodeSelectionObj.getRange(this.parent.contentModule.getDocument());
+                    if (isNullOrUndefined(linkDialog) && isNullOrUndefined(imageDialog)) {
+                        save = this.nodeSelectionObj.save(range, this.parent.contentModule.getDocument());
+                    }
+                    selectNodeEle = this.nodeSelectionObj.getNodeCollection(range);
+                    selectParentEle = this.nodeSelectionObj.getParentNodeCollection(range);
+                }
+                switch (item.subCommand) {
+                    case 'Maximize':
+                        this.parent.notify(enableFullScreen, { args: args });
+                        break;
+                    case 'Minimize':
+                        this.parent.notify(disableFullScreen, { args: args });
+                        break;
+                    case 'CreateLink':
+                        this.parent.notify(insertLink, {
+                            member: 'link', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
+                        });
+                        break;
+                    case 'RemoveLink':
+                        this.parent.notify(unLink, {
+                            member: 'link', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
+                        });
+                        break;
+                    case 'Print':
+                        this.parent.print();
+                        break;
+                    case 'Image':
+                        this.parent.notify(insertImage, {
+                            member: 'image', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
+                        });
+                        break;
+                    case 'Audio':
+                        this.parent.notify(insertAudio, {
+                            member: 'audio', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
+                        });
+                        break;
+                    case 'Video':
+                        this.parent.notify(insertVideo, {
+                            member: 'video', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
+                        });
+                        break;
+                    case 'CreateTable':
+                        this.parent.notify(createTable, {
+                            member: 'table', args: args, selection: save
+                        });
+                        break;
+                    case 'SourceCode':
+                        this.parent.notify(sourceCode, { member: 'viewSource', args: args });
+                        break;
+                    case 'Preview':
+                        this.parent.notify(updateSource, { member: 'updateSource', args: args });
+                        break;
+                    case 'FontColor':
+                    case 'BackgroundColor':
+                        break;
+                    case 'File':
+                        this.parent.notify(renderFileManager, {
+                            member: 'fileManager', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
+                        });
+                        break;
+                    default:
+                        this.parent.formatter.process(this.parent, args, args.originalEvent, null);
+                        break;
+                }
+            }
+        }
+        else {
+            if (args.originalEvent.detail === 1) {
+                clearTimeout(this.clickTimeout);
+                this.clickTimeout = setTimeout(() => {
+                    this.parent.notify(formatPainterClick, {
+                        member: 'formatPainter', args: args
+                    });
+                }, 200);
+            }
+            else {
+                clearTimeout(this.clickTimeout);
+                this.parent.notify(formatPainterDoubleClick, {
+                    member: 'formatPainter', args: args
+                });
             }
         }
     }
@@ -19290,7 +19982,8 @@ class HtmlEditor {
             const formatterClass = new HTMLFormatter({
                 currentDocument: this.contentRenderer.getDocument(),
                 element: editElement,
-                options: option
+                options: option,
+                formatPainterSettings: this.parent.formatPainterSettings
             });
             this.parent.setProperties({ formatter: formatterClass }, true);
         }
@@ -20771,7 +21464,6 @@ class FullScreen {
                             this.parent.toolbarModule.addFixedTBarClass();
                         }
                     }
-                    this.parent.refreshUI();
                     this.parent.trigger(actionComplete, { requestType: 'Minimize', targetItem: 'Minimize', args: event });
                 }
             });
@@ -20891,6 +21583,145 @@ function setAttributes(htmlAttributes, rte, isFrame, initial) {
     }
 }
 
+class FormatPainter {
+    constructor(parent) {
+        this.isSticky = false;
+        this.isActive = false;
+        this.parent = parent;
+        this.addEventListener();
+    }
+    addEventListener() {
+        this.parent.on(formatPainterClick, this.toolbarClick, this);
+        this.parent.on(formatPainterDoubleClick, this.toolbarDoubleClick, this);
+        this.parent.on(editAreaClick, this.editAreaClick, this);
+        this.parent.on(keyDown, this.onKeyDown, this);
+        this.parent.on(destroy, this.destroy, this);
+    }
+    toolbarClick(args) {
+        this.isActive = true;
+        this.parent.focusIn();
+        this.actionHandler(args, 'click');
+    }
+    toolbarDoubleClick(args) {
+        this.isActive = true;
+        this.isSticky = true;
+        this.parent.focusIn();
+        this.actionHandler(args, 'dbClick');
+    }
+    onKeyDown(event) {
+        const originalEvent = event.args;
+        if ((originalEvent.ctrlKey && originalEvent.shiftKey && (originalEvent.action === 'format-copy' || originalEvent.action === 'format-paste'))
+            || (originalEvent.action === 'escape' && (this.previousAction === 'format-copy' || this.previousAction === 'format-paste'))) {
+            if (!isNullOrUndefined(originalEvent.key) && originalEvent.key.toLowerCase() === 'c') {
+                originalEvent.preventDefault();
+            }
+            if (!isNullOrUndefined(originalEvent.key) && originalEvent.key.toLowerCase() === 'v' &&
+                this.previousAction === 'format-copy' || this.previousAction === 'format-paste' || this.isSticky) {
+                originalEvent.preventDefault();
+            }
+            this.actionHandler(event, 'keyBoard');
+        }
+    }
+    actionHandler(event, type) {
+        let action;
+        let isKeyboard = false;
+        let originalEvent;
+        let args;
+        let item;
+        switch (type) {
+            case 'dbClick':
+                args = event.args;
+                item = args.item;
+                originalEvent = event.args.originalEvent;
+                action = 'format-copy';
+                break;
+            case 'keyBoard':
+                args = null;
+                originalEvent = event.args;
+                isKeyboard = true;
+                action = event.args.action;
+                if (action === 'escape') {
+                    this.isSticky = false;
+                    this.isActive = false;
+                }
+                break;
+            case 'click':
+                args = event.args;
+                item = args.item;
+                originalEvent = event.args.originalEvent;
+                action = 'format-copy';
+                break;
+            case 'docClick':
+                originalEvent = event;
+                action = 'format-paste';
+                break;
+        }
+        this.updateCursor(isKeyboard);
+        const enable = type === 'docClick' || action === 'escape' ? false : true;
+        this.updateToolbarBtn(enable);
+        if (isNullOrUndefined(item)) {
+            item = {
+                command: 'FormatPainter',
+                subCommand: 'FormatPainter'
+            };
+        }
+        const actionBeginArgs = {
+            requestType: 'FormatPainter', originalEvent: originalEvent, name: action, item: item
+        };
+        const value = {
+            formatPainterAction: action
+        };
+        this.parent.formatter.process(this.parent, actionBeginArgs, originalEvent, value);
+        this.previousAction = action;
+    }
+    updateCursor(isKeyboard) {
+        if (!this.parent.inputElement.classList.contains('e-rte-cursor-brush') && !isKeyboard) {
+            addClass([this.parent.inputElement], 'e-rte-cursor-brush');
+        }
+        else if (!this.isSticky) {
+            removeClass([this.parent.inputElement], 'e-rte-cursor-brush');
+        }
+    }
+    updateToolbarBtn(enable) {
+        const toolbarBtn = this.parent.element.querySelector('.e-rte-format-painter').parentElement.parentElement;
+        if (enable) {
+            addClass([toolbarBtn], 'e-active');
+        }
+        else if (!this.isSticky) {
+            removeClass([toolbarBtn], 'e-active');
+        }
+    }
+    editAreaClick(args) {
+        if (this.isActive) {
+            if (!this.isSticky) {
+                this.isActive = false;
+            }
+            this.actionHandler(args, 'docClick');
+            this.updateToolbarBtn(false);
+        }
+    }
+    destroy() {
+        /**Removeeventlistener */
+        if (this.parent.isDestroyed) {
+            return;
+        }
+        this.parent.off(formatPainterClick, this.toolbarClick);
+        this.parent.off(editAreaClick, this.editAreaClick);
+        this.parent.off(formatPainterDoubleClick, this.toolbarDoubleClick);
+        this.parent.off(keyDown, this.onKeyDown);
+        this.parent.off(destroy, this.destroy);
+    }
+    /**
+     * For internal use only - Get the module name.
+     *
+     * @returns {void}
+     * @hidden
+     */
+    getModuleName() {
+        return 'formatPainter';
+    }
+}
+
 /**
  * Action export
  */
@@ -21188,7 +22019,8 @@ class Link {
             const eventArgs = {
                 args: event ? event.args : {
                     item: { command: 'Links', subCommand: 'CreateLink' },
-                    originalEvent: undefined
+                    originalEvent: undefined,
+                    name: !isInternal ? 'showDialog' : null
                 },
                 selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
             };
@@ -21904,7 +22736,8 @@ class Image {
                     img.setAttribute('width', (img.width + this.mouseX).toString());
                 }
                 else {
-                    img.setAttribute('width', (img.offsetWidth + this.mouseX).toString());
+                    const currentWidth = img.offsetWidth === 0 ? img.width + this.mouseX + parseInt(img.style.outlineWidth.split('p')[0]) : img.offsetWidth + this.mouseX;
+                    img.setAttribute('width', (currentWidth).toString());
                 }
             }
         }
@@ -21986,7 +22819,7 @@ class Image {
         const pageX = this.getPointX(e);
         const pageY = this.getPointY(e);
         const mouseX = (this.resizeBtnStat.botLeft || this.resizeBtnStat.topLeft) ? -(pageX - this.pageX) : (pageX - this.pageX);
-        const mouseY = (this.resizeBtnStat.topLeft || this.resizeBtnStat.topRight) ? -(pageY - this.pageY) : (pageY - this.pageY);
+        const mouseY = (this.resizeBtnStat.botLeft || this.resizeBtnStat.topLeft) ? -(pageY - this.pageY) : (pageY - this.pageY);
         const width = parseInt(this.imgDupPos.width, 10) + mouseX;
         const height = parseInt(this.imgDupPos.height, 10) + mouseY;
         this.mouseX = mouseX;
@@ -22157,8 +22990,9 @@ class Image {
         }
         if (originalEvent.keyCode === 8 || originalEvent.keyCode === 46) {
             if (selectNodeEle && selectNodeEle[0].nodeName === 'IMG' && selectNodeEle.length < 1) {
-                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection))
+                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection)) {
                     save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());
+                }
                 originalEvent.preventDefault();
                 const event = {
                     selectNode: selectNodeEle, selection: save, selectParent: selectParentEle,
@@ -22217,8 +23051,9 @@ class Image {
                 }
                 break;
             case 'insert-image':
-                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection))
+                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection)) {
                     save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());
+                }
                 this.openDialog(true, originalEvent, save, selectNodeEle, selectParentEle);
                 originalEvent.preventDefault();
                 break;
@@ -22244,7 +23079,8 @@ class Image {
             this.insertImage({
                 args: {
                     item: { command: 'Images', subCommand: 'Image' },
-                    originalEvent: event
+                    originalEvent: event,
+                    name: !isInternal ? 'showDialog' : null
                 },
                 selectNode: selectNodeEle,
                 selection: save,
@@ -22255,7 +23091,8 @@ class Image {
             this.insertImage({
                 args: {
                     item: { command: 'Images', subCommand: 'Image' },
-                    originalEvent: event
+                    originalEvent: event,
+                    name: !isInternal ? 'showDialog' : null
                 },
                 member: 'image',
                 text: this.parent.formatter.editorManager.markdownSelection.getSelectedText(this.parent.contentModule.getEditPanel()),
@@ -24005,8 +24842,9 @@ class Audio {
         }
         if (originalEvent.keyCode === 8 || originalEvent.keyCode === 46) {
             if (selectNodeEle && this.isAudioElem(selectNodeEle[0]) && selectNodeEle.length < 1) {
-                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection))
+                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection)) {
                     save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());
+                }
                 originalEvent.preventDefault();
                 const event = {
                     selectNode: selectNodeEle, selection: save, selectParent: selectParentEle,
@@ -24055,8 +24893,9 @@ class Audio {
                 }
                 break;
             case 'insert-audio':
-                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection))
+                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection)) {
                     save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());
+                }
                 this.openDialog(true, originalEvent, save, selectNodeEle, selectParentEle);
                 originalEvent.preventDefault();
                 break;
@@ -24082,7 +24921,8 @@ class Audio {
             this.insertAudio({
                 args: {
                     item: { command: 'Audios', subCommand: 'Audio' },
-                    originalEvent: event
+                    originalEvent: event,
+                    name: !isInternal ? 'showDialog' : null
                 },
                 selectNode: selectNodeEle,
                 selection: save,
@@ -25098,7 +25938,7 @@ class Video {
         const height = vidEleStyle.height !== '' ? parseInt(vidEleStyle.height, 10) : vid.style.height !== '' ? vid.style.height : vid.height;
         if (width > height) {
             vid.style.minWidth = this.parent.insertVideoSettings.minWidth === 0 ? '140px' : formatUnit(this.parent.insertVideoSettings.minWidth);
-            vid.style.minHeight = this.parent.insertVideoSettings.minHeight === 0 ? '50px' : formatUnit(this.parent.insertVideoSettings.minHeight);
+            vid.style.minHeight = this.parent.insertVideoSettings.minHeight === 0 ? '60px' : formatUnit(this.parent.insertVideoSettings.minHeight);
             if (this.parent.insertVideoSettings.resizeByPercent) {
                 if (parseInt('' + vid.getBoundingClientRect().width + '', 10) !== 0 && parseInt('' + width + '', 10) !== 0) {
                     const percentageValue = this.pixToPerc((parseInt(width.toString(), 10) / parseInt(height.toString(), 10) * expectedY), (vid.previousElementSibling || vid.parentElement));
@@ -25309,8 +26149,9 @@ class Video {
         }
         if (originalEvent.keyCode === 8 || originalEvent.keyCode === 46) {
             if (selectNodeEle && (selectNodeEle[0].nodeName === 'VIDEO' || this.isEmbedVidElem(selectNodeEle[0])) && selectNodeEle.length < 1) {
-                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection))
+                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection)) {
                     save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());
+                }
                 originalEvent.preventDefault();
                 const event = {
                     selectNode: selectNodeEle, selection: save, selectParent: selectParentEle,
@@ -25363,8 +26204,9 @@ class Video {
                 }
                 break;
             case 'insert-video':
-                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection))
+                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection)) {
                     save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());
+                }
                 this.openDialog(true, originalEvent, save, selectNodeEle, selectParentEle);
                 originalEvent.preventDefault();
                 break;
@@ -25390,7 +26232,8 @@ class Video {
             this.insertVideo({
                 args: {
                     item: { command: 'Videos', subCommand: 'Video' },
-                    originalEvent: event
+                    originalEvent: event,
+                    name: !isInternal ? 'showDialog' : null
                 },
                 selectNode: selectNodeEle,
                 selection: save,
@@ -25638,7 +26481,7 @@ class Video {
         }
     }
     showVideoQuickToolbar(e) {
-        if (e.type !== 'Videos' || e.args.detail === 2 || isNullOrUndefined(this.parent.quickToolbarModule)
+        if (e.type !== 'Videos' || (!isNullOrUndefined(e.args) && e.args.detail === 2) || isNullOrUndefined(this.parent.quickToolbarModule)
             || isNullOrUndefined(this.parent.quickToolbarModule.videoQTBar) || isNullOrUndefined(e.args)) {
             return;
         }
@@ -26186,7 +27029,7 @@ class ViewSource {
                 break;
             case 'toolbar-focus':
                 if (this.parent.toolbarSettings.enable) {
-                    const selector = '.e-toolbar-item[aria-disabled="false"][title] [tabindex]';
+                    const selector = '.e-toolbar-item[title] [tabindex]';
                     this.parent.toolbarModule.baseToolbar.toolbarObj.element.querySelector(selector).focus();
                 }
                 break;
@@ -26555,8 +27398,9 @@ class Table {
             if ((event.keyCode === 8 || event.keyCode === 46) ||
                 (event.ctrlKey && event.keyCode === 88)) {
                 if (ele && ele.tagName === 'TBODY') {
-                    if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection) && this.contentModule)
+                    if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection) && this.contentModule) {
                         selection = this.parent.formatter.editorManager.nodeSelection.save(range, this.contentModule.getDocument());
+                    }
                     event.preventDefault();
                     proxy.removeTable(selection, event, true);
                 }
@@ -26570,8 +27414,9 @@ class Table {
                 ele = !isNullOrUndefined(closestTd) && this.parent.inputElement.contains(closestTd) ? closestTd : ele;
             }
             if (ele && (ele.tagName === 'TD' || ele.tagName === 'TH')) {
-                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection) && this.contentModule)
+                if (!isNullOrUndefined(this.parent.formatter.editorManager.nodeSelection) && this.contentModule) {
                     selection = this.parent.formatter.editorManager.nodeSelection.save(range, this.contentModule.getDocument());
+                }
                 switch (event.keyCode) {
                     case 9:
                     case 37:
@@ -26614,7 +27459,8 @@ class Table {
                 item: {
                     command: 'Table',
                     subCommand: 'CreateTable'
-                }
+                },
+                name: !isInternal ? 'showDialog' : null
             };
             this.insertTableDialog({ self: this, args: args, selection: selection });
         }
@@ -26839,9 +27685,18 @@ class Table {
                 const range = this.parent.formatter.editorManager.nodeSelection.getRange(this.contentModule.getDocument());
                 this.parent.formatter.editorManager.nodeSelection.save(range, this.contentModule.getDocument());
                 this.parent.formatter.editorManager.nodeSelection.Clear(this.contentModule.getDocument());
-                const pageX = (this.parent.iframeSettings.enable) ? window.pageXOffset + this.parent.element.getBoundingClientRect().left + args.clientX : args.pageX;
-                const pageY = (this.parent.iframeSettings.enable) ? window.pageYOffset +
-                    this.parent.element.getBoundingClientRect().top + args.clientY : args.pageY;
+                let pageX;
+                let pageY;
+                if (Browser.isDevice && e.args.touches) {
+                    pageX = e.args.changedTouches[0].pageX;
+                    pageY = e.args.changedTouches[0].pageY;
+                }
+                else {
+                    pageX = (this.parent.iframeSettings.enable) ? window.pageXOffset
+                        + this.parent.element.getBoundingClientRect().left + args.clientX : args.pageX;
+                    pageY = (this.parent.iframeSettings.enable) ? window.pageYOffset +
+                        this.parent.element.getBoundingClientRect().top + args.clientY : args.pageY;
+                }
                 this.quickToolObj.tableQTBar.showPopup(pageX, pageY, target);
                 this.parent.formatter.editorManager.nodeSelection.restore();
             }
@@ -28054,6 +28909,18 @@ const executeGroup = {
     'removeFormat': {
         command: 'Clear',
         subCommand: 'ClearFormat'
+    },
+    'copyFormatPainter': {
+        command: 'FormatPainter',
+        value: 'format-copy'
+    },
+    'applyFormatPainter': {
+        command: 'FormatPainter',
+        value: 'format-paste'
+    },
+    'escapeFormatPainter': {
+        command: 'FormatPainter',
+        value: 'escape'
     }
 };
 
@@ -28305,6 +29172,20 @@ __decorate$2([
 __decorate$2([
     Property(['TableHeader', 'TableRows', 'TableColumns', 'BackgroundColor', '-', 'TableRemove', 'Alignments', 'TableCellVerticalAlign', 'Styles'])
 ], QuickToolbarSettings.prototype, "table", void 0);
+/**
+ * Configure the format painter settings of the Rich Text Editor.
+ */
+class FormatPainterSettings extends ChildProperty {
+}
+__decorate$2([
+    Property(['Text', 'List', 'Table'])
+], FormatPainterSettings.prototype, "allowedContext", void 0);
+__decorate$2([
+    Property('b; em; font; sub; sup; kbd; i; s; u; code; strong; span; p; div; h1; h2; h3; h4; h5; h6; blockquote; table; thead; tbody; tr; td; th; ol; ul; li; pre;')
+], FormatPainterSettings.prototype, "allowedFormats", void 0);
+__decorate$2([
+    Property(null)
+], FormatPainterSettings.prototype, "deniedFormats", void 0);
 /**
  * Configures the Paste Cleanup settings of the RichTextEditor.
  */
@@ -28523,7 +29404,7 @@ class EnterKeyAction {
             isTableEnter = blockElement.tagName === 'TD' || blockElement.tagName === 'TBODY' ? false : true;
         }
         if (e.args.which === 13 && e.args.code === 'Enter') {
-            if (isNullOrUndefined(this.startNode.closest('LI,UL,OL')) && isNullOrUndefined(this.endNode.closest('LI,UL,OL')) && isTableEnter &&
+            if (isNullOrUndefined(this.startNode.closest('LI, UL, OL')) && isNullOrUndefined(this.endNode.closest('LI, UL, OL')) && isTableEnter &&
                 isNullOrUndefined(this.startNode.closest('PRE')) && isNullOrUndefined(this.endNode.closest('PRE'))) {
                 const shiftKey = e.args.shiftKey;
                 const actionBeginArgs = {
@@ -28593,11 +29474,6 @@ class EnterKeyAction {
                         }
                         if (this.range.startContainer === this.range.endContainer &&
                             this.range.startOffset === this.range.endOffset && this.range.startContainer === this.parent.inputElement) {
-                            if (!isNullOrUndefined(this.range.startContainer.childNodes[this.range.startOffset]) &&
-                                !isNullOrUndefined(this.range.startContainer.childNodes[this.range.startOffset].previousElementSibling) &&
-                                this.range.startContainer.childNodes[this.range.startOffset].previousElementSibling.nodeName === 'TABLE') {
-                                this.parent.tableModule.removeResizeElement();
-                            }
                             if (!(this.parent.inputElement.childNodes.length === 1 && this.parent.inputElement.childNodes[0].nodeName === 'TABLE')) {
                                 if (isNullOrUndefined(this.range.startContainer.childNodes[this.range.startOffset])) {
                                     let currentLastElem = this.range.startContainer.childNodes[this.range.startOffset - 1];
@@ -28633,7 +29509,7 @@ class EnterKeyAction {
                                 let isFocusedFirst = false;
                                 if (this.range.startOffset !== 0 && this.range.endOffset !== 0 &&
                                     this.range.startContainer === this.range.endContainer && !(!isNullOrUndefined(nearBlockNode.childNodes[0])
-                                    && nearBlockNode.childNodes[0].nodeName === 'IMG' && nearBlockNode.querySelectorAll('img,audio,video').length > 0)) {
+                                    && nearBlockNode.childNodes[0].nodeName === 'IMG' && nearBlockNode.querySelectorAll('img, audio, video').length > 0)) {
                                     const startNodeText = this.range.startContainer.textContent;
                                     const splitFirstText = startNodeText.substring(0, this.range.startOffset);
                                     // eslint-disable-next-line max-len
@@ -28654,8 +29530,8 @@ class EnterKeyAction {
                                         (this.range.startContainer.previousSibling.nodeName === 'IMG' || this.range.startContainer.previousSibling.nodeName === 'BR'))) {
                                     let isNearBlockLengthZero;
                                     let newElem;
-                                    if (!isNullOrUndefined(this.range.startContainer.childNodes) && this.range.startContainer.textContent.length === 0 &&
-                                        (this.range.startContainer.querySelectorAll('img,audio,video').length > 0 ||
+                                    if (!isNullOrUndefined(this.range.startContainer.childNodes) && this.range.startContainer.textContent.length === 0
+                                        && (this.range.startContainer.querySelectorAll('img, audio, video').length > 0 ||
                                             this.range.startContainer.nodeName === 'IMG' || this.range.startContainer.nodeName === 'TABLE')) {
                                         newElem = this.createInsertElement(shiftKey);
                                         isMediaNode = true;
@@ -28664,7 +29540,7 @@ class EnterKeyAction {
                                     else {
                                         if ((nearBlockNode.textContent.trim().length !== 0 ||
                                             nearBlockNode.childNodes[0].nodeName === 'IMG' ||
-                                            (nearBlockNode.textContent.trim() === '' && nearBlockNode.querySelectorAll('img,audio,video').length > 0))) {
+                                            (nearBlockNode.textContent.trim() === '' && nearBlockNode.querySelectorAll('img, audio, video').length > 0))) {
                                             if ((this.range.startOffset === this.range.endOffset && this.range.startOffset !== 0)) {
                                                 newElem = this.parent.formatter.editorManager.nodeCutter.SplitNode(this.range, nearBlockNode, false).cloneNode(true);
                                             }
@@ -28728,7 +29604,7 @@ class EnterKeyAction {
                                         this.range.startContainer.classList.contains('e-audio-wrap'))) {
                                     if (nearBlockNode.textContent.trim().length > 0) {
                                         const newElem = this.parent.formatter.editorManager.nodeCutter.SplitNode(this.range, nearBlockNode, true);
-                                        let audioVideoElem = !isNullOrUndefined(newElem.previousSibling.querySelector('.e-video-wrap')) ?
+                                        const audioVideoElem = !isNullOrUndefined(newElem.previousSibling.querySelector('.e-video-wrap')) ?
                                             newElem.previousSibling.querySelector('.e-video-wrap') : newElem.previousSibling.querySelector('.e-audio-wrap');
                                         let isBRInserted = false;
                                         let lastNode = audioVideoElem.previousSibling;
@@ -28750,7 +29626,7 @@ class EnterKeyAction {
                                     }
                                     else {
                                         const newElem = this.parent.formatter.editorManager.nodeCutter.SplitNode(this.range, nearBlockNode, true);
-                                        let focusElem = newElem.previousSibling;
+                                        const focusElem = newElem.previousSibling;
                                         while (!isNullOrUndefined(focusElem.firstChild)) {
                                             detach(focusElem.firstChild);
                                         }
@@ -29024,6 +29900,10 @@ let RichTextEditor = class RichTextEditor extends Component {
                 member: 'video',
                 args: [this, this.serviceLocator]
             });
+            modules.push({
+                member: 'formatPainter',
+                args: [this]
+            });
         }
         if (this.fileManagerSettings.enable) {
             modules.push({ member: 'fileManager', args: [this, this.serviceLocator] });
@@ -29093,7 +29973,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         this.setContainer();
         this.persistData();
         setStyleAttribute(this.element, { 'width': formatUnit(this.width) });
-        attributes(this.element, { role: 'application' });
+        attributes(this.element, { role: 'application', 'aria-label': 'Rich Text Editor' });
     }
     persistData() {
         if (this.enablePersistence && this.originalElement.tagName === 'TEXTAREA') {
@@ -29234,6 +30114,7 @@ let RichTextEditor = class RichTextEditor extends Component {
      */
     executeCommand(commandName, value, option) {
         value = this.htmlPurifier(commandName, value);
+        let internalValue;
         if (this.editorMode === 'HTML') {
             const range = this.getRange();
             if (this.iframeSettings.enable) {
@@ -29280,7 +30161,16 @@ let RichTextEditor = class RichTextEditor extends Component {
                 return;
             }
         }
-        this.formatter.editorManager.execCommand(tool.command, tool.subCommand ? tool.subCommand : (value ? value : tool.value), null, null, (value ? value : tool.value), (value ? value : tool.value));
+        internalValue = value;
+        if (tool.command === 'FormatPainter') {
+            if (!isNullOrUndefined(value)) {
+                this.formatPainterSettings = value;
+            }
+            internalValue = {
+                formatPainterAction: tool.value
+            };
+        }
+        this.formatter.editorManager.execCommand(tool.command, tool.subCommand ? tool.subCommand : (internalValue ? internalValue : tool.value), null, null, (internalValue ? internalValue : tool.value), (internalValue ? internalValue : tool.value));
         if (option && option.undo) {
             this.formatter.saveData();
             this.formatter.enableUndo(this);
@@ -29533,6 +30423,7 @@ let RichTextEditor = class RichTextEditor extends Component {
         const currentEndContainer = range.endContainer;
         const currentStartOffset = range.startOffset;
         const isSameContainer = currentStartContainer === currentEndContainer ? true : false;
+        const currentEndOffset = currentEndContainer.textContent.length;
         const endNode = range.endContainer.nodeName === '#text' ? range.endContainer.parentElement :
             range.endContainer;
         const closestLI = closest(endNode, 'LI');
@@ -29618,14 +30509,21 @@ let RichTextEditor = class RichTextEditor extends Component {
             this.formatter.saveData();
         }
         if (e.action !== 'insert-link' &&
+            e.action !== 'format-copy' && e.action !== 'format-paste' &&
             (e.action && e.action !== 'paste' && e.action !== 'space'
                 || e.which === 9 || (e.code === 'Backspace' && e.which === 8))) {
-            this.formatter.process(this, null, e);
+            let FormatPainterEscapeAction = false;
+            if (!isNullOrUndefined(this.formatPainterModule)) {
+                FormatPainterEscapeAction = this.formatPainterModule.previousAction === 'escape';
+            }
+            if (!FormatPainterEscapeAction) {
+                this.formatter.process(this, null, e);
+            }
             switch (e.action) {
                 case 'toolbar-focus':
                     if (this.toolbarSettings.enable) {
                         // eslint-disable-next-line
-                        let selector = '.e-toolbar-item[aria-disabled="false"][title] [tabindex]';
+                        let selector = '.e-toolbar-item[title] [tabindex]';
                         this.toolbarModule.baseToolbar.toolbarObj.element.querySelector(selector).focus();
                     }
                     break;
@@ -30569,6 +31467,7 @@ let RichTextEditor = class RichTextEditor extends Component {
             }
             else {
                 const compiledTemplate = compile(this.valueTemplate)('', this, 'valueTemplate');
+                // eslint-disable-next-line
                 if (typeof this.valueTemplate !== 'string' && this.isReact) {
                     this.displayTempElem = this.createElement('div');
                     for (let i = 0; i < compiledTemplate.length; i++) {
@@ -30608,7 +31507,7 @@ let RichTextEditor = class RichTextEditor extends Component {
             }
         }
     }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    // eslint-disable-next-line
     renderTemplates(callBack) {
         this.renderReactTemplates(callBack);
     }
@@ -30722,7 +31621,9 @@ let RichTextEditor = class RichTextEditor extends Component {
      * @public
      */
     getHtml() {
-        return this.serializeValue(this.contentModule.getEditPanel().innerHTML);
+        const htmlValue = this.contentModule.getEditPanel().innerHTML;
+        return (this.enableXhtml && (htmlValue === '<p><br></p>' || htmlValue === '<div><br></div>' ||
+            htmlValue === '<br>') ? null : this.serializeValue(htmlValue));
     }
     /**
      * Retrieves the Rich Text Editor's XHTML validated HTML content when `enableXhtml` property is enabled.
@@ -30973,8 +31874,8 @@ let RichTextEditor = class RichTextEditor extends Component {
         }
         const getTextArea = this.element.querySelector('.e-rte-srctextarea');
         if (this.editorMode === 'HTML') {
-            value = (this.inputElement.innerHTML === '<p><br></p>' || this.inputElement.innerHTML === '<div><br></div>'
-                || this.inputElement.innerHTML === '<br>') ? null : this.enableHtmlEncode ?
+            value = (this.inputElement.innerHTML === '<p><br></p>' || this.inputElement.innerHTML === '<div><br></div>' ||
+                this.inputElement.innerHTML === '<br>') ? null : this.enableHtmlEncode ?
                 this.encode(decode(this.inputElement.innerHTML)) : this.inputElement.innerHTML;
             if (getTextArea && getTextArea.style.display === 'block') {
                 value = getTextArea.value;
@@ -31324,6 +32225,9 @@ __decorate$1([
 __decorate$1([
     Complex({}, PasteCleanupSettings)
 ], RichTextEditor.prototype, "pasteCleanupSettings", void 0);
+__decorate$1([
+    Complex({}, FormatPainterSettings)
+], RichTextEditor.prototype, "formatPainterSettings", void 0);
 __decorate$1([
     Complex({}, IFrameSettings)
 ], RichTextEditor.prototype, "iframeSettings", void 0);
@@ -31354,6 +32258,9 @@ __decorate$1([
 __decorate$1([
     Property(false)
 ], RichTextEditor.prototype, "enablePersistence", void 0);
+__decorate$1([
+    Property(true)
+], RichTextEditor.prototype, "showTooltip", void 0);
 __decorate$1([
     Property(false)
 ], RichTextEditor.prototype, "enableResize", void 0);
@@ -31592,10 +32499,6 @@ RichTextEditor = __decorate$1([
  * Base export
  */
 
-/**
- * Base export
- */
-
 /**
  * Export all markdown plugins
  */
@@ -31612,5 +32515,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, HTMLFormatter, Formatter, MarkdownFormatter, ContentRender, Render, ToolbarRenderer, Link, 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, 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_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, 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, 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 };
+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, HTMLFormatter, Formatter, MarkdownFormatter, ContentRender, Render, ToolbarRenderer, Link, 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, 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_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, 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, 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 };
 //# sourceMappingURL=ej2-richtexteditor.es2015.js.map