@syncfusion/ej2-richtexteditor 21.2.10 → 22.1.34

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

@@ -729,6 +729,16 @@ var formatPainterClick = 'formatPainterClick';
  * @deprecated
  */
 var formatPainterDoubleClick = 'formatPainterDoubleClick';
+/**
+ * @hidden
+ * @deprecated
+ */
+var emojiPicker = 'emojiPicker';
+/**
+ * @hidden
+ * @deprecated
+ */
+var maximizeMinimizeClick = 'maximizeMinimizeClick';
 /**
  * @hidden
  * @deprecated
@@ -1963,6 +1973,13 @@ var tools = {
         'tooltip': 'Format Painter',
         'command': 'FormatPainter',
         'subCommand': 'FormatPainter'
+    },
+    'emojipicker': {
+        'id': 'EmojiPicker',
+        'icon': 'e-emoji',
+        'tooltip': 'Emoji Icon',
+        'command': 'EmojiPicker',
+        'subCommand': 'EmojiPicker'
     }
 };
 var alignmentLocale = [
@@ -2175,8 +2192,188 @@ var windowKeys = {
     'Clear Format': 'Ctrl + Shift + R',
     'Numbered List': 'Ctrl + Shift + O',
     'Bulleted List': 'Ctrl + Alt + O',
-    'Format Painter': 'Ctrl + Shift + C, Ctrl + Shift + V'
+    'Format Painter': 'Alt + Shift + C, Alt + Shift + V'
 };
+var defaultEmojiIcons = [{
+        name: 'Smilies & People', code: '1F600', iconCss: 'e-emoji', icons: [{ code: '1F600', desc: 'Grinning face' },
+            { code: '1F603', desc: 'Grinning face with big eyes' },
+            { code: '1F604', desc: 'Grinning face with smiling eyes' },
+            { code: '1F606', desc: 'Grinning squinting face' },
+            { code: '1F605', desc: 'Grinning face with sweat' },
+            { code: '1F602', desc: 'Face with tears of joy' },
+            { code: '1F923', desc: 'Rolling on the floor laughing' },
+            { code: '1F60A', desc: 'Smiling face with smiling eyes' },
+            { code: '1F607', desc: 'Smiling face with halo' },
+            { code: '1F642', desc: 'Slightly smiling face' },
+            { code: '1F643', desc: 'Upside-down face' },
+            { code: '1F60D', desc: 'Smiling face with heart-eyes' },
+            { code: '1F618', desc: 'Face blowing a kiss' },
+            { code: '1F61B', desc: 'Face with tongue' },
+            { code: '1F61C', desc: 'Winking face with tongue' },
+            { code: '1F604', desc: 'Grinning face with smiling eyes' },
+            { code: '1F469', desc: 'Woman' },
+            { code: '1F468', desc: 'Man' },
+            { code: '1F467', desc: 'Girl' },
+            { code: '1F466', desc: 'Boy' },
+            { code: '1F476', desc: 'Baby' },
+            { code: '1F475', desc: 'Old woman' },
+            { code: '1F474', desc: 'Old man' },
+            { code: '1F46E', desc: 'Police officer' },
+            { code: '1F477', desc: 'Construction worker' },
+            { code: '1F482', desc: 'Guard' },
+            { code: '1F575', desc: 'Detective' },
+            { code: '1F9D1', desc: 'Cook' }]
+    }, {
+        name: 'Animals & Nature', code: '1F435', iconCss: 'e-animals', icons: [{ code: '1F436', desc: 'Dog face' },
+            { code: '1F431', desc: 'Cat face' },
+            { code: '1F42D', desc: 'Mouse face' },
+            { code: '1F439', desc: 'Hamster face' },
+            { code: '1F430', desc: 'Rabbit face' },
+            { code: '1F98A', desc: 'Fox face' },
+            { code: '1F43B', desc: 'Bear face' },
+            { code: '1F43C', desc: 'Panda face' },
+            { code: '1F428', desc: 'Koala' },
+            { code: '1F42F', desc: 'Tiger face' },
+            { code: '1F981', desc: 'Lion face' },
+            { code: '1F42E', desc: 'Cow face' },
+            { code: '1F437', desc: 'Pig face' },
+            { code: '1F43D', desc: 'Pig nose' },
+            { code: '1F438', desc: 'Frog face' },
+            { code: '1F435', desc: 'Monkey face' },
+            { code: '1F649', desc: 'Hear-no-evil monkey' },
+            { code: '1F64A', desc: 'Speak-no-evil monkey' },
+            { code: '1F412', desc: 'Monkey' },
+            { code: '1F414', desc: 'Chicken' },
+            { code: '1F427', desc: 'Penguin' },
+            { code: '1F426', desc: 'Bird' },
+            { code: '1F424', desc: 'Baby chick' },
+            { code: '1F986', desc: 'Duck' },
+            { code: '1F985', desc: 'Eagle' }]
+    }, {
+        name: 'Food & Drink', code: '1F347', iconCss: 'e-food-and-drinks', icons: [{ code: '1F34E', desc: 'Red apple' },
+            { code: '1F34C', desc: 'Banana' },
+            { code: '1F347', desc: 'Grapes' },
+            { code: '1F353', desc: 'Strawberry' },
+            { code: '1F35E', desc: 'Bread' },
+            { code: '1F950', desc: 'Croissant' },
+            { code: '1F955', desc: 'Carrot' },
+            { code: '1F354', desc: 'Hamburger' },
+            { code: '1F355', desc: 'Pizza' },
+            { code: '1F32D', desc: 'Hot dog' },
+            { code: '1F35F', desc: 'French fries' },
+            { code: '1F37F', desc: 'Popcorn' },
+            { code: '1F366', desc: 'Soft ice cream' },
+            { code: '1F367', desc: 'Shaved ice' },
+            { code: '1F36A', desc: 'Cookie' },
+            { code: '1F382', desc: 'Birthday cake' },
+            { code: '1F370', desc: 'Shortcake' },
+            { code: '1F36B', desc: 'Chocolate bar' },
+            { code: '1F369', desc: 'Donut' },
+            { code: '1F36E', desc: 'Custard' },
+            { code: '1F36D', desc: 'Lollipop' },
+            { code: '1F36C', desc: 'Candy' },
+            { code: '1F377', desc: 'Wine glass' },
+            { code: '1F37A', desc: 'Beer mug' },
+            { code: '1F37E', desc: 'Bottle with popping cork' }]
+    }, {
+        name: 'Activities', code: '1F383', iconCss: 'e-activities', icons: [{ code: '26BD', desc: 'Soccer ball' },
+            { code: '1F3C0', desc: 'Basketball' },
+            { code: '1F3C8', desc: 'American football' },
+            { code: '26BE', desc: 'Baseball' },
+            { code: '1F3BE', desc: 'Tennis' },
+            { code: '1F3D0', desc: 'Volleyball' },
+            { code: '1F3C9', desc: 'Rugby football' },
+            { code: '1F3B1', desc: 'Pool 8 ball' },
+            { code: '1F3D3', desc: 'Ping pong' },
+            { code: '1F3F8', desc: 'Badminton' },
+            { code: '1F94A', desc: 'Boxing glove' },
+            { code: '1F3CA', desc: 'Swimmer' },
+            { code: '1F3CB', desc: 'Weightlifter' },
+            { code: '1F6B4', desc: 'Bicyclist' },
+            { code: '1F6F9', desc: 'Skateboard' },
+            { code: '1F3AE', desc: 'Video game' },
+            { code: '1F579', desc: 'Joystick' },
+            { code: '1F3CF', desc: 'Cricket' },
+            { code: '1F3C7', desc: 'Horse racing' },
+            { code: '1F3AF', desc: 'Direct hit' },
+            { code: '1F3D1', desc: 'Field hockey' },
+            { code: '1F3B0', desc: 'Slot machine' },
+            { code: '1F3B3', desc: 'Bowling' },
+            { code: '1F3B2', desc: 'Game die' },
+            { code: '265F', desc: 'Chess pawn' }]
+    }, {
+        name: 'Travel & Places', code: '1F30D', iconCss: 'e-travel-and-places', icons: [{ code: '2708', desc: 'Airplane' },
+            { code: '1F697', desc: 'Automobile' },
+            { code: '1F695', desc: 'Taxi' },
+            { code: '1F6B2', desc: 'Bicycle' },
+            { code: '1F68C', desc: 'Bus' },
+            { code: '1F682', desc: 'Locomotive' },
+            { code: '1F6F3', desc: 'Passenger ship' },
+            { code: '1F680', desc: 'Rocket' },
+            { code: '1F681', desc: 'Helicopter' },
+            { code: '1F6A2', desc: 'Ship' },
+            { code: '1F3DF', desc: 'Stadium' },
+            { code: '1F54C', desc: 'Mosque' },
+            { code: '26EA', desc: 'Church' },
+            { code: '1F6D5', desc: 'Hindu Temple' },
+            { code: '1F3D4', desc: 'Snow-capped mountain' },
+            { code: '1F3EB', desc: 'School' },
+            { code: '1F30B', desc: 'Volcano' },
+            { code: '1F3D6', desc: 'Beach with umbrella' },
+            { code: '1F3DD', desc: 'Desert island' },
+            { code: '1F3DE', desc: 'National park' },
+            { code: '1F3F0', desc: 'Castle' },
+            { code: '1F5FC', desc: 'Tokyo tower' },
+            { code: '1F5FD', desc: 'Statue of liberty' },
+            { code: '26E9', desc: 'Shinto shrine' },
+            { code: '1F3EF', desc: 'Japanese castle' },
+            { code: '1F3A2', desc: 'Roller coaster' }]
+    }, {
+        name: 'Objects', code: '1F507', iconCss: 'e-objects', icons: [{ code: '1F4A1', desc: 'Light bulb' },
+            { code: '1F526', desc: 'Flashlight' },
+            { code: '1F4BB', desc: 'Laptop computer' },
+            { code: '1F5A5', desc: 'Desktop computer' },
+            { code: '1F5A8', desc: 'Printer' },
+            { code: '1F4F7', desc: 'Camera' },
+            { code: '1F4F8', desc: 'Camera with flash' },
+            { code: '1F4FD', desc: 'Film projector' },
+            { code: '1F3A5', desc: 'Movie camera' },
+            { code: '1F4FA', desc: 'Television' },
+            { code: '1F4FB', desc: 'Radio' },
+            { code: '1F50B', desc: 'Battery' },
+            { code: '231A', desc: 'Watch' },
+            { code: '1F4F1', desc: 'Mobile phone' },
+            { code: '260E', desc: 'Telephone' },
+            { code: '1F4BE', desc: 'Floppy disk' },
+            { code: '1F4BF', desc: 'Optical disk' },
+            { code: '1F4C0', desc: 'Digital versatile disc' },
+            { code: '1F4BD', desc: 'Computer disk' },
+            { code: '1F3A7', desc: 'Headphone' },
+            { code: '1F3A4', desc: 'Microphone' },
+            { code: '1F3B6', desc: 'Multiple musical notes' },
+            { code: '1F4DA', desc: 'Books' }]
+    }, {
+        name: 'Symbols', code: '1F3E7', iconCss: 'e-symbols', icons: [{ code: '274C', desc: 'Cross mark' },
+            { code: '2714', desc: 'Check mark' },
+            { code: '26A0', desc: 'Warning sign' },
+            { code: '1F6AB', desc: 'Prohibited' },
+            { code: '2139', desc: 'Information' },
+            { code: '267B', desc: 'Recycling symbol' },
+            { code: '1F6AD', desc: 'No smoking' },
+            { code: '1F4F5', desc: 'No mobile phones' },
+            { code: '1F6AF', desc: 'No littering' },
+            { code: '1F6B3', desc: 'No bicycles' },
+            { code: '1F6B7', desc: 'No pedestrians' },
+            { code: '2795', desc: 'Plus' },
+            { code: '2796', desc: 'Minus' },
+            { code: '2797', desc: 'Divide' },
+            { code: '2716', desc: 'Multiplication' },
+            { code: '1F4B2', desc: 'Dollar banknote' },
+            { code: '1F4AC', desc: 'Speech balloon' },
+            { code: '2755', desc: 'White exclamation mark' },
+            { code: '2754', desc: 'White question mark' },
+            { code: '2764', desc: 'Red heart' }]
+    }];
 
 /* eslint-disable */
 /**
@@ -2371,7 +2568,13 @@ var defaultLocale = {
     'bulletFormatListSquare': 'Square',
     'numberFormatListNone': 'None',
     'bulletFormatListNone': 'None',
-    'formatPainter': 'Format Painter'
+    'formatPainter': 'Format Painter',
+    'emojiPicker': 'Emoji Picker',
+    'embeddedCode': 'Embedded Code',
+    'pasteEmbeddedCodeHere': 'Paste Embedded Code here',
+    'emojiPickerTypeToFind': 'Type to find',
+    'emojiPickerNoResultFound': 'No results found',
+    'emojiPickerTrySomethingElse': 'Try something else',
 };
 var toolsLocale = {
     'alignments': 'alignments',
@@ -2459,7 +2662,13 @@ var toolsLocale = {
     'insertrowbefore': 'insertRowBefore',
     'insertrowafter': 'insertRowAfter',
     'deleterow': 'deleteRow',
-    'formatpainter': 'formatPainter'
+    'formatpainter': 'formatPainter',
+    'emojipicker': 'emojiPicker',
+    'embeddedCode': 'Embedded Code',
+    'pasteEmbeddedCodeHere': 'Paste Embedded Code here',
+    'emojiPickerTypeToFind': 'Type to find',
+    'emojiPickerNoResultFound': 'No results found',
+    'emojiPickerTrySomethingElse': 'Try something else',
 };
 var fontNameLocale = [
     { locale: 'fontNameSegoeUI', value: 'Segoe UI' },
@@ -2643,7 +2852,8 @@ function setToolbarStatus(e, isPopToolbar, self) {
             var item = e.tbItems[j].subCommand;
             var itemStr = item && item.toLocaleLowerCase();
             if (item && (itemStr === key) || (item === 'UL' && key === 'unorderedlist') || (item === 'OL' && key === 'orderedlist') ||
-                (itemStr === 'pre' && key === 'insertcode')) {
+                (itemStr === 'pre' && key === 'insertcode') || (item === 'NumberFormatList' && key === 'numberFormatList' ||
+                item === 'BulletFormatList' && key === 'bulletFormatList')) {
                 if (typeof data["" + key] === 'boolean') {
                     if (data["" + key] === true) {
                         addClass([e.tbElements[j]], [CLS_ACTIVE]);
@@ -2695,7 +2905,6 @@ function setToolbarStatus(e, isPopToolbar, self) {
                             var fontNameContent = isNullOrUndefined(e.parent.fontFamily.default) ? fontNameItems[0].text :
                                 e.parent.fontFamily.default;
                             var name_1 = (isNullOrUndefined(result) ? fontNameContent : result);
-                            e.tbElements[j].title = name_1;
                             dropDown.fontNameDropDown.content = ('<span style="display: inline-flex;' +
                                 'width:' + e.parent.fontFamily.width + '" >' +
                                 '<span class="e-rte-dropdown-btn-text' + (isNullOrUndefined(e.parent.cssClass) ? '' : ' ' + e.parent.cssClass) + '">'
@@ -3091,6 +3300,10 @@ var ToolbarRenderer = /** @__PURE__ @class */ (function () {
     }
     ToolbarRenderer.prototype.wireEvent = function () {
         this.parent.on(destroy, this.unWireEvent, this);
+        this.parent.on(maximizeMinimizeClick, this.destroyTooltip, this);
+    };
+    ToolbarRenderer.prototype.destroyTooltip = function () {
+        this.tooltip.close();
     };
     ToolbarRenderer.prototype.unWireEvent = function () {
         this.parent.off(destroy, this.unWireEvent);
@@ -3187,12 +3400,13 @@ var ToolbarRenderer = /** @__PURE__ @class */ (function () {
         args.rteToolbarObj.toolbarObj.createElement = this.parent.createElement;
         args.rteToolbarObj.toolbarObj.appendTo(args.target);
         if (this.parent.showTooltip) {
-            var tooltip = new Tooltip({
+            this.tooltip = new Tooltip({
                 target: '#' + this.parent.getID() + '_toolbar_wrapper [title]',
                 showTipPointer: true,
+                openDelay: 400,
                 cssClass: this.parent.cssClass
             });
-            tooltip.appendTo(args.target);
+            this.tooltip.appendTo(args.target);
         }
     };
     /**
@@ -3796,8 +4010,9 @@ var BaseToolbar = /** @__PURE__ @class */ (function () {
                                 _this.parent.formatter.saveData();
                             }
                             callback_1.call(_this);
-                            if ((_this.parent.formatter.getUndoRedoStack()[_this.parent.formatter.getUndoRedoStack().length - 1].text.trim()
-                                === _this.parent.inputElement.innerHTML.trim())) {
+                            var currentContentElem = _this.parent.createElement('div');
+                            currentContentElem.appendChild(_this.parent.formatter.getUndoRedoStack()[_this.parent.formatter.getUndoRedoStack().length - 1].text);
+                            if (currentContentElem.innerHTML.trim() === _this.parent.inputElement.innerHTML.trim()) {
                                 return;
                             }
                             if (proxy_1.undo) {
@@ -5891,7 +6106,8 @@ var BaseQuickToolbar = /** @__PURE__ @class */ (function () {
      */
     BaseQuickToolbar.prototype.showPopup = function (x, y, target) {
         var _this = this;
-        var eventArgs = { popup: this.popupObj, cancel: false, targetElement: target, positionX: x, positionY: y };
+        var eventArgs = { popup: this.popupObj, cancel: false, targetElement: target,
+            positionX: x, positionY: y };
         this.parent.trigger(beforeQuickToolbarOpen, eventArgs, function (beforeQuickToolbarArgs) {
             if (!beforeQuickToolbarArgs.cancel) {
                 var editPanelTop = void 0;
@@ -5927,6 +6143,7 @@ var BaseQuickToolbar = /** @__PURE__ @class */ (function () {
                 if (_this.parent.showTooltip) {
                     _this.tooltip = new Tooltip({
                         target: '#' + _this.element.id + ' [title]',
+                        openDelay: 400,
                         showTipPointer: true
                     });
                     _this.tooltip.appendTo(_this.element);
@@ -6007,6 +6224,11 @@ var BaseQuickToolbar = /** @__PURE__ @class */ (function () {
             }
             this.tooltip.destroy();
         }
+        else {
+            if (!isNullOrUndefined(this.tooltip)) {
+                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);
@@ -7232,6 +7454,8 @@ function getDefaultHtmlTbStatus() {
         strikethrough: false,
         orderedlist: false,
         unorderedlist: false,
+        numberFormatList: false,
+        bulletFormatList: false,
         underline: false,
         alignments: null,
         backgroundcolor: null,
@@ -7399,7 +7623,8 @@ var ExecCommandCallBack = /** @__PURE__ @class */ (function () {
         this.parent.on(destroy, this.removeEventListener, this);
     };
     ExecCommandCallBack.prototype.commandCallBack = function (args) {
-        if (args.requestType !== 'Undo' && args.requestType !== 'Redo') {
+        var formatPainterCopy = !isNullOrUndefined(args.requestType) && args.requestType === 'FormatPainter' && args.action === 'format-copy';
+        if (!isNullOrUndefined(args) && !isNullOrUndefined(args.requestType) && args.requestType !== 'Undo' && args.requestType !== 'Redo' && !formatPainterCopy) {
             this.parent.formatter.saveData();
         }
         this.parent.notify(toolbarRefresh, { args: args });
@@ -7499,6 +7724,12 @@ var SPACE_ACTION = 'actionBegin';
  * @hidden
  */
 var FORMAT_PAINTER_ACTIONS = 'format_painter_actions';
+/**
+ * Emoji picker event constant
+ *
+ * @hidden
+ */
+var EMOJI_PICKER_ACTIONS = 'emoji_picker_actions';
 
 /**
  * Formatter
@@ -7543,6 +7774,7 @@ var Formatter = /** @__PURE__ @class */ (function () {
             && args.item.command !== 'Files'
             && args.item.command !== 'Audios'
             && args.item.command !== 'Videos'
+            && args.item.command !== 'EmojiPicker'
             && range
             && !(self.contentModule.getEditPanel().contains(this.getAncestorNode(range.commonAncestorContainer))
                 || self.contentModule.getEditPanel() === range.commonAncestorContainer
@@ -7608,13 +7840,14 @@ var Formatter = /** @__PURE__ @class */ (function () {
             && 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.item.subCommand === 'FormatPainter')) {
+                && args.name === 'colorPickerChanged') || args.item.subCommand === 'FormatPainter' || args.item.subCommand === 'EmojiPicker')) {
             extend(args, args, { requestType: args.item.subCommand, cancel: false, itemCollection: value, selectType: args.name }, true);
             self.trigger(actionBegin, args, function (actionBeginArgs) {
                 if (!actionBeginArgs.cancel) {
-                    var formatPainterCopyAction = !isNullOrUndefined(actionBeginArgs.name) && actionBeginArgs.name === 'format-copy';
-                    if (_this.getUndoRedoStack().length === 0 && actionBeginArgs.item.command !== 'Links'
-                        && actionBeginArgs.item.command !== 'Images' && !formatPainterCopyAction) {
+                    var formatPainterCopy = !isNullOrUndefined(actionBeginArgs.requestType) && actionBeginArgs.requestType === 'FormatPainter' && actionBeginArgs.name === 'format-copy';
+                    var formatPainterPaste = !isNullOrUndefined(actionBeginArgs.requestType) && actionBeginArgs.requestType === 'FormatPainter' && actionBeginArgs.name === 'format-paste';
+                    if ((_this.getUndoRedoStack().length === 0 && actionBeginArgs.item.command !== 'Links' && actionBeginArgs.item.command !== 'Images' && !formatPainterCopy)
+                        || formatPainterPaste) {
                         _this.saveData();
                     }
                     self.isBlur = false;
@@ -7636,7 +7869,7 @@ var Formatter = /** @__PURE__ @class */ (function () {
                 }
             });
         }
-        if (isNullOrUndefined(event) || event && event.action !== 'copy') {
+        if ((isNullOrUndefined(event) || event && event.action !== 'copy')) {
             this.enableUndo(self);
         }
     };
@@ -8897,8 +9130,8 @@ var htmlKeyConfig = {
     'enter': '13',
     'tab': 'tab',
     'delete': '46',
-    'format-copy': 'ctrl+shift+c',
-    'format-paste': 'ctrl+shift+v'
+    'format-copy': 'alt+shift+c',
+    'format-paste': 'alt+shift+v'
 };
 /**
  * Default  markdown key config for adapter
@@ -11002,7 +11235,11 @@ var DOMNode = /** @__PURE__ @class */ (function () {
         var startTextNode;
         var endTextNode;
         if (start.textContent === '' && isNullOrUndefined(end) && action !== 'tab') {
-            if (start.childNodes.length === 1 && start.childNodes[0].nodeName === 'BR') {
+            if (isNullOrUndefined(action) && save.range.startContainer.nodeType === 1 &&
+                save.range.startContainer.querySelectorAll('audio,video,image').length === 0) {
+                start.innerHTML = '<br>';
+            }
+            else if (start.childNodes.length === 1 && start.childNodes[0].nodeName === 'BR') {
                 start.innerHTML = '&#65279;&#65279;<br>';
             }
             else {
@@ -11091,7 +11328,7 @@ var DOMNode = /** @__PURE__ @class */ (function () {
                 markerStart.appendChild(start);
             }
             else {
-                if (start.nodeType !== 3 && start.nodeName !== '#text') {
+                if (start.nodeType !== 3 && start.nodeName !== '#text' && start.nodeName !== 'BR') {
                     var marker = this.marker(markerClassName.startSelection, '');
                     append([this.parseHTMLFragment(marker)], start);
                 }
@@ -13326,7 +13563,12 @@ var InsertHtml = /** @__PURE__ @class */ (function () {
     InsertHtml.removeEmptyElements = function (element) {
         var emptyElements = element.querySelectorAll(':empty');
         for (var i = 0; i < emptyElements.length; i++) {
-            if (SELF_CLOSING_TAGS.indexOf(emptyElements[i].tagName.toLowerCase()) < 0) {
+            var lineWithDiv = true;
+            if (emptyElements[i].tagName === 'DIV') {
+                lineWithDiv = emptyElements[i].style.borderBottom === 'none' ||
+                    emptyElements[i].style.borderBottom === '' ? true : false;
+            }
+            if (SELF_CLOSING_TAGS.indexOf(emptyElements[i].tagName.toLowerCase()) < 0 && lineWithDiv) {
                 var detachableElement = this.findDetachEmptyElem(emptyElements[i]);
                 if (!isNullOrUndefined(detachableElement)) {
                     detach(detachableElement);
@@ -13433,7 +13675,7 @@ var LinkCommand = /** @__PURE__ @class */ (function () {
             var domSelection = new NodeSelection();
             var range = domSelection.getRange(this.parent.currentDocument);
             if (range.endContainer.nodeName === '#text' && range.startContainer.textContent.length === (range.endOffset + 1) &&
-                range.endContainer.textContent.charAt(range.endOffset) === ' ' && range.endContainer.nextSibling.nodeName === 'A') {
+                range.endContainer.textContent.charAt(range.endOffset) === ' ' && (!isNullOrUndefined(range.endContainer.nextSibling) && range.endContainer.nextSibling.nodeName === 'A')) {
                 domSelection.setSelectionText(this.parent.currentDocument, range.startContainer, range.endContainer, range.startOffset, range.endOffset + 1);
                 range = domSelection.getRange(this.parent.currentDocument);
             }
@@ -15158,10 +15400,10 @@ var TableCommand = /** @__PURE__ @class */ (function () {
         this.updateRowSpanStyle(minMaxIndexes.startRow, minMaxIndexes.endRow, this.getCorrespondingColumns());
         this.updateColSpanStyle(minMaxIndexes.startColumn, minMaxIndexes.endColumn, this.getCorrespondingColumns());
         e.item.selection.setSelectionText(this.parent.currentDocument, e.item.selection.range.startContainer, e.item.selection.range.startContainer, 0, 0);
-        if (this.parent.nodeSelection.range) {
+        if (this.parent.nodeSelection && firstCell) {
             this.parent.nodeSelection.setCursorPoint(this.parent.currentDocument, 
             // eslint-disable-next-line
-            this.parent.nodeSelection.range.endContainer, 0);
+            firstCell, 0);
         }
         if (e.callBack) {
             e.callBack({
@@ -16297,8 +16539,10 @@ var SelectionCommands = /** @__PURE__ @class */ (function () {
                                 while (currentFormatNode) {
                                     var isSameTextContent = currentFormatNode.parentElement.textContent.trim()
                                         === nodes[index].textContent.trim();
-                                    if (!domNode.isBlockNode(currentFormatNode.parentElement) && isSameTextContent) {
-                                        currentFormatNode = currentFormatNode.parentElement;
+                                    var parent_1 = currentFormatNode.parentElement;
+                                    if (!domNode.isBlockNode(parent_1) && isSameTextContent &&
+                                        !(parent_1.nodeName === 'SPAN' && parent_1.classList.contains('e-img-inner'))) {
+                                        currentFormatNode = parent_1;
                                     }
                                     else {
                                         break;
@@ -16479,33 +16723,19 @@ var SelectionCommands = /** @__PURE__ @class */ (function () {
     };
     // Below function is used to insert the element created by the format painter plugin.
     SelectionCommands.insertFormatPainterElem = function (nodes, index, range, nodeCutter, painterValues, domNode) {
-        var parent = nodes[index].parentElement;
+        var parent = !domNode.isBlockNode(nodes[index].parentElement) ?
+            nodes[index].parentElement : nodes[index];
         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);
-                var childELemList = nodes[index].parentElement.childNodes;
-                for (var i = 0; i < childELemList.length; i++) {
-                    if (childELemList[i].textContent.trim() === nodes[i].textContent.trim()) {
-                        parent.parentNode.insertBefore(childELemList[i], parent);
-                        break;
-                    }
-                }
-                var blockChildNodes = parent.parentElement.childNodes;
-                for (var k = 0; k < blockChildNodes.length; k++) {
-                    if (blockChildNodes[k].textContent.trim() === '' || blockChildNodes[k].textContent.length === 0) {
-                        detach(blockChildNodes[k]);
-                    }
-                }
-            }
-            else {
-                InsertMethods.unwrap(parent);
-            }
+        }
+        // The below code is used to remove the already present inline style from the text node.
+        if (!isNullOrUndefined(parent) && parent.nodeType === 1 && !(parent.classList.contains('e-rte-img-caption') || parent.classList.contains('e-img-inner'))) {
+            this.formatPainterCleanup(index, nodes, parent, range, nodeCutter, domNode);
         }
         var elem = painterValues.element;
+        // The below code is used to apply the inline format copied.
         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
@@ -16530,6 +16760,43 @@ var SelectionCommands = /** @__PURE__ @class */ (function () {
         }
         return nodes[index];
     };
+    SelectionCommands.formatPainterCleanup = function (index, nodes, parent, range, nodeCutter, domNode) {
+        var INVALID_TAGS = ['A', 'AUDIO', 'IMG', 'VIDEO', 'IFRAME'];
+        if (index === 0 && parent.textContent.trim() !== nodes[index].textContent.trim()) {
+            nodeCutter.SplitNode(range, parent, true);
+            var childELemList = nodes[index].parentElement.childNodes;
+            for (var i = 0; i < childELemList.length; i++) {
+                if (childELemList[i].textContent.trim() === nodes[i].textContent.trim()) {
+                    parent.parentNode.insertBefore(childELemList[i], parent);
+                    break;
+                }
+            }
+            var blockChildNodes = parent.parentElement.childNodes;
+            for (var k = 0; k < blockChildNodes.length; k++) {
+                if (blockChildNodes[k].textContent.trim() === '' || blockChildNodes[k].textContent.length === 0) {
+                    detach(blockChildNodes[k]);
+                }
+            }
+        }
+        else if (parent.textContent.trim() !== nodes[index].textContent.trim()) {
+            parent.parentElement.insertBefore(nodes[index], parent);
+        }
+        else {
+            while (!isNullOrUndefined(parent) && parent.nodeType !== 3 && !domNode.isBlockNode(parent)) {
+                var temp = void 0;
+                for (var i = 0; i < parent.childNodes.length; i++) {
+                    var currentChild = parent.childNodes[i];
+                    if (currentChild.textContent.trim().length !== 0 && currentChild.nodeType !== 3) {
+                        temp = parent.childNodes[i];
+                    }
+                }
+                if (INVALID_TAGS.indexOf(parent.tagName) === -1) {
+                    InsertMethods.unwrap(parent);
+                }
+                parent = temp;
+            }
+        }
+    };
     SelectionCommands.enterAction = 'P';
     return SelectionCommands;
 }());
@@ -16646,6 +16913,7 @@ var ClearFormat$1 = /** @__PURE__ @class */ (function () {
      * @param {Node} endNode - specifies the end node
      * @param {string} enterAction - specifies the enter key action
      * @param {string} selector - specifies the string value
+     * @param {string} command - specifies the command value
      * @returns {void}
      * @hidden
      * @deprecated
@@ -17013,6 +17281,19 @@ var UndoRedoManager = /** @__PURE__ @class */ (function () {
             this.saveData(e);
         }
     };
+    UndoRedoManager.prototype.getTextContentFromFragment = function (fragment) {
+        var textContent = '';
+        for (var i = 0; i < fragment.childNodes.length; i++) {
+            var childNode = fragment.childNodes[i];
+            if (childNode.nodeType === Node.TEXT_NODE) {
+                textContent += childNode.textContent;
+            }
+            else if (childNode.nodeType === Node.ELEMENT_NODE) {
+                textContent += this.getTextContentFromFragment(childNode);
+            }
+        }
+        return textContent;
+    };
     /**
      * RTE collection stored html format.
      *
@@ -17035,8 +17316,12 @@ var UndoRedoManager = /** @__PURE__ @class */ (function () {
         }
         range = new NodeSelection().getRange(this.parent.currentDocument);
         var save = new NodeSelection().save(range, this.parent.currentDocument);
-        var htmlText = this.parent.editableElement.innerHTML;
-        var changEle = { text: htmlText, range: save };
+        var clonedElement = this.parent.editableElement.cloneNode(true);
+        var fragment = document.createDocumentFragment();
+        while (clonedElement.firstChild) {
+            fragment.appendChild(clonedElement.firstChild);
+        }
+        var changEle = { text: fragment, range: save };
         if (this.undoRedoStack.length >= this.steps) {
             this.undoRedoStack = this.undoRedoStack.slice(0, this.steps + 1);
         }
@@ -17044,7 +17329,8 @@ var UndoRedoManager = /** @__PURE__ @class */ (function () {
             && (this.undoRedoStack[this.undoRedoStack.length - 1].range.startOffset === save.range.startOffset) &&
             (this.undoRedoStack[this.undoRedoStack.length - 1].range.endOffset === save.range.endOffset) &&
             (this.undoRedoStack[this.undoRedoStack.length - 1].range.range.startContainer === save.range.startContainer) &&
-            (this.undoRedoStack[this.undoRedoStack.length - 1].text.trim() === changEle.text.trim())) {
+            (this.getTextContentFromFragment(this.undoRedoStack[this.undoRedoStack.length - 1].text).trim() ===
+                this.getTextContentFromFragment(changEle.text).trim())) {
             return;
         }
         this.undoRedoStack.push(changEle);
@@ -17070,7 +17356,8 @@ var UndoRedoManager = /** @__PURE__ @class */ (function () {
         if (this.steps > 0) {
             var range = this.undoRedoStack[this.steps - 1].range;
             var removedContent = this.undoRedoStack[this.steps - 1].text;
-            this.parent.editableElement.innerHTML = removedContent;
+            this.parent.editableElement.innerHTML = '';
+            this.parent.editableElement.appendChild(removedContent.cloneNode(true));
             this.parent.editableElement.focus();
             if (isIDevice$1()) {
                 setEditFrameFocus(this.parent.editableElement, e.selector);
@@ -17100,7 +17387,9 @@ var UndoRedoManager = /** @__PURE__ @class */ (function () {
     UndoRedoManager.prototype.redo = function (e) {
         if (this.undoRedoStack[this.steps + 1] != null) {
             var range = this.undoRedoStack[this.steps + 1].range;
-            this.parent.editableElement.innerHTML = this.undoRedoStack[this.steps + 1].text;
+            var addedContent = this.undoRedoStack[this.steps + 1].text;
+            this.parent.editableElement.innerHTML = '';
+            this.parent.editableElement.appendChild(addedContent.cloneNode(true));
             this.parent.editableElement.focus();
             if (isIDevice$1()) {
                 setEditFrameFocus(this.parent.editableElement, e.selector);
@@ -17211,6 +17500,8 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
                 listNodes[0].parentElement.tagName !== 'OL') {
                 this.listConverter(listNodes);
             }
+            this.cleanList(elm, 'UL');
+            this.cleanList(elm, 'OL');
             this.styleCorrection(elm, wordPasteStyleConfig);
             this.removingComments(elm);
             this.removeUnwantedElements(elm);
@@ -17236,11 +17527,38 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
             e.callBack(elm.innerHTML);
         }
     };
+    MsWordPaste.prototype.cleanList = function (elm, listTag) {
+        var replacableElem = elm.querySelectorAll(listTag + ' div');
+        for (var j = replacableElem.length - 1; j >= 0; j--) {
+            var parentElem = replacableElem[j].parentNode;
+            while (replacableElem[j].firstChild) {
+                parentElem.insertBefore(replacableElem[j].firstChild, replacableElem[j]);
+            }
+            var closestListElem = this.findClosestListElem(replacableElem[j]);
+            if (closestListElem) {
+                this.insertAfter(replacableElem[j], closestListElem);
+            }
+        }
+    };
+    MsWordPaste.prototype.insertAfter = function (newNode, referenceNode) {
+        referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
+    };
+    MsWordPaste.prototype.findClosestListElem = function (listElem) {
+        var closestListElem;
+        while (!isNullOrUndefined(listElem)) {
+            listElem = !isNullOrUndefined(listElem.closest('ul')) && listElem.tagName !== 'UL' ?
+                listElem.closest('ul') : (listElem.tagName !== 'OL' ? listElem.closest('ol') : null);
+            closestListElem = !isNullOrUndefined(listElem) ? listElem : closestListElem;
+        }
+        return closestListElem;
+    };
     MsWordPaste.prototype.addListClass = function (elm) {
         var allNodes = elm.querySelectorAll('*');
         for (var index = 0; index < allNodes.length; index++) {
             if (!isNullOrUndefined(allNodes[index].getAttribute('style')) && allNodes[index].getAttribute('style').replace(/ /g, '').replace('\n', '').indexOf('mso-list:l') >= 0 &&
-                allNodes[index].className.toLowerCase().indexOf('msolistparagraph') === -1 && allNodes[index].tagName.charAt(0) !== 'H') {
+                allNodes[index].className.toLowerCase().indexOf('msolistparagraph') === -1 &&
+                allNodes[index].tagName.charAt(0) !== 'H' && allNodes[index].tagName !== 'LI' &&
+                allNodes[index].tagName !== 'OL' && allNodes[index].tagName !== 'UL') {
                 allNodes[index].classList.add('msolistparagraph');
             }
         }
@@ -17364,7 +17682,7 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
     MsWordPaste.prototype.hexConversion = function (rtfData) {
         // eslint-disable-next-line
         var picHead = /\{\\pict[\s\S]+?\\bliptag\-?\d+(\\blipupi\-?\d+)?(\{\\\*\\blipuid\s?[\da-fA-F]+)?[\s\}]*?/;
-        // eslint-disable-next-line
+        // eslint-disable-next-line security/detect-non-literal-regexp
         var pic = new RegExp('(?:(' + picHead.source + '))([\\da-fA-F\\s]+)\\}', 'g');
         var fullImg = rtfData.match(pic);
         var imgType;
@@ -17428,9 +17746,9 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
     MsWordPaste.prototype.removeUnwantedElements = function (elm) {
         var innerElement = elm.innerHTML;
         for (var i = 0; i < this.removableElements.length; i++) {
-            // eslint-disable-next-line
+            // eslint-disable-next-line security/detect-non-literal-regexp
             var regExpStartElem = new RegExp('<' + this.removableElements[i] + '>', 'g');
-            // eslint-disable-next-line
+            // eslint-disable-next-line security/detect-non-literal-regexp
             var regExpEndElem = new RegExp('</' + this.removableElements[i] + '>', 'g');
             innerElement = innerElement.replace(regExpStartElem, '');
             innerElement = innerElement.replace(regExpEndElem, '');
@@ -17473,9 +17791,14 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
                 !isNullOrUndefined(emptyElements[i].closest('td').querySelector('.MsoNormal'))) {
                 emptyElements[i].innerHTML = '-';
             }
+            var lineWithDiv = true;
+            if (emptyElements[i].tagName === 'DIV') {
+                lineWithDiv = emptyElements[i].style.borderBottom === 'none' ||
+                    emptyElements[i].style.borderBottom === '' ? true : false;
+            }
             if (emptyElements[i].tagName !== 'IMG' && emptyElements[i].tagName !== 'BR' &&
                 emptyElements[i].tagName !== 'IFRAME' && emptyElements[i].tagName !== 'TD' &&
-                emptyElements[i].tagName !== 'HR') {
+                emptyElements[i].tagName !== 'HR' && lineWithDiv) {
                 var detachableElement = this.findDetachEmptyElem(emptyElements[i]);
                 if (!isNullOrUndefined(detachableElement)) {
                     detach(detachableElement);
@@ -17604,7 +17927,6 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
         elm.innerHTML = innerElement;
     };
     MsWordPaste.prototype.cleanUp = function (node, listNodes) {
-        // eslint-disable-next-line
         var tempCleaner = [];
         var prevflagState;
         var allNodes = node.querySelectorAll('*');
@@ -17805,7 +18127,7 @@ var MsWordPaste = /** @__PURE__ @class */ (function () {
                     break;
                 }
             }
-            if (!isNullOrUndefined(prevList) && index != 0 &&
+            if (!isNullOrUndefined(prevList) && index !== 0 &&
                 collection[index - 1].listType !== collection[index].listType &&
                 !isNormalList) {
                 prevList = null;
@@ -18323,6 +18645,9 @@ var ToolbarStatus = /** @__PURE__ @class */ (function () {
         else if (list === 'none') {
             return 'None';
         }
+        else if (this.isOrderedList(node)) {
+            return true;
+        }
         else {
             return null;
         }
@@ -18341,6 +18666,9 @@ var ToolbarStatus = /** @__PURE__ @class */ (function () {
         else if (list === 'disc') {
             return 'Disc';
         }
+        else if (this.isUnorderedList(node)) {
+            return true;
+        }
         else {
             return null;
         }
@@ -18348,12 +18676,73 @@ var ToolbarStatus = /** @__PURE__ @class */ (function () {
     return ToolbarStatus;
 }());
 
+var EmojiPickerAction = /** @__PURE__ @class */ (function () {
+    function EmojiPickerAction(parent) {
+        this.parent = parent;
+        this.addEventListener();
+    }
+    EmojiPickerAction.prototype.addEventListener = function () {
+        this.parent.observer.on(EMOJI_PICKER_ACTIONS, this.emojiInsert, this);
+    };
+    EmojiPickerAction.prototype.emojiInsert = function (args) {
+        var node = document.createTextNode(args.value);
+        var selection = window.getSelection();
+        var range = selection.getRangeAt(0);
+        var cursorPos = range.startOffset;
+        for (var i = cursorPos - 1; i >= cursorPos - 15; i--) {
+            var prevChar_1 = selection.focusNode.textContent.substring(i - 1, i);
+            var isPrevSpace_1 = /:$/.test(prevChar_1);
+            if (isPrevSpace_1) {
+                this.beforeApplyFormat(true);
+                break;
+            }
+        }
+        var colon = /:$/.test(selection.focusNode.textContent.charAt(cursorPos - 1));
+        var prevChar = selection.focusNode.textContent.charAt(cursorPos - 2);
+        var isPrevSpace = /\s/.test(prevChar);
+        if (colon && (isPrevSpace || selection.focusOffset === 1)) {
+            this.beforeApplyFormat(true);
+        }
+        InsertHtml.Insert(this.parent.currentDocument, node, this.parent.editableElement);
+        if (args.callBack) {
+            args.callBack({
+                requestType: args.subCommand,
+                editorMode: 'HTML',
+                event: args.event,
+                range: this.parent.nodeSelection.getRange(this.parent.currentDocument),
+                elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)
+            });
+        }
+    };
+    EmojiPickerAction.prototype.beforeApplyFormat = function (isBlockFormat) {
+        var range1 = this.parent.nodeSelection.getRange(this.parent.currentDocument);
+        var node = this.parent.nodeSelection.getNodeCollection(range1)[0];
+        var blockNewLine = !(node.parentElement.innerHTML.replace(/&nbsp;|<br>/g, '').trim() === ':' || node.textContent.trim().indexOf('/') === 0);
+        var startNode = node;
+        if (blockNewLine && isBlockFormat) {
+            while (startNode !== this.parent.editableElement) {
+                startNode = startNode.parentElement;
+            }
+        }
+        var startPoint = range1.startOffset;
+        while (this.parent.nodeSelection.getRange(document).toString().indexOf(':') === -1) {
+            this.parent.nodeSelection.setSelectionText(document, node, node, startPoint, range1.endOffset);
+            startPoint--;
+        }
+        var range2 = this.parent.nodeSelection.getRange(this.parent.currentDocument);
+        var node2 = this.parent.nodeCutter.GetSpliceNode(range2, node);
+        node2.parentNode.removeChild(node2);
+    };
+    return EmojiPickerAction;
+}());
+
 /**
  * Base export
  */
 
 var FormatPainterActions = /** @__PURE__ @class */ (function () {
     function FormatPainterActions(parent, options) {
+        this.INVALID_TAGS = ['A', 'AUDIO', 'IMG', 'VIDEO', 'IFRAME'];
         this.parent = parent;
         this.settings = options;
         this.addEventListener();
@@ -18361,8 +18750,43 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
     }
     FormatPainterActions.prototype.addEventListener = function () {
         this.parent.observer.on(FORMAT_PAINTER_ACTIONS, this.actionHandler, this);
+        this.parent.observer.on(MODEL_CHANGED_PLUGIN, this.onPropertyChanged, this);
+    };
+    FormatPainterActions.prototype.onPropertyChanged = function (prop) {
+        if (prop && prop.module === 'formatPainter') {
+            if (!isNullOrUndefined(prop.newProp.formatPainterSettings.allowedFormats)) {
+                this.settings.allowedFormats = prop.newProp.formatPainterSettings.allowedFormats;
+            }
+            if (!isNullOrUndefined(prop.newProp.formatPainterSettings.deniedFormats)) {
+                this.settings.deniedFormats = prop.newProp.formatPainterSettings.deniedFormats;
+                this.setDeniedFormats();
+            }
+        }
+    };
+    FormatPainterActions.prototype.removeEventListener = function () {
+        this.parent.observer.off(FORMAT_PAINTER_ACTIONS, this.actionHandler);
+        this.parent.observer.off(MODEL_CHANGED_PLUGIN, this.onPropertyChanged);
+    };
+    /**
+     * Destroys the format painter.
+     *
+     * @function destroy
+     * @returns {void}
+     * @hidden
+     * @deprecated
+     */
+    FormatPainterActions.prototype.destroy = function () {
+        this.removeEventListener();
+        this.INVALID_TAGS = null;
+        this.copyCollection = null;
+        this.deniedFormatsCollection = null;
+        this.newElem = null;
+        this.newElemLastChild = null;
+        this.settings = null;
+        this.parent = null;
     };
     FormatPainterActions.prototype.actionHandler = function (args) {
+        this.settings.allowedContext = ['Text', 'List', 'Table'];
         if (!isNullOrUndefined(args) && !isNullOrUndefined(args.item) && !isNullOrUndefined(args.item.formatPainterAction)) {
             switch (args.item.formatPainterAction) {
                 case 'format-copy':
@@ -18375,6 +18799,19 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
                     this.escapeAction();
                     break;
             }
+            this.callBack(args);
+        }
+    };
+    FormatPainterActions.prototype.callBack = function (event) {
+        if (event.callBack) {
+            event.callBack({
+                requestType: 'FormatPainter',
+                action: event.item.formatPainterAction,
+                event: event.event,
+                editorMode: 'HTML',
+                range: this.parent.nodeSelection.getRange(this.parent.currentDocument),
+                elements: this.parent.nodeSelection.getSelectedNodes(this.parent.currentDocument)
+            });
         }
     };
     FormatPainterActions.prototype.generateElement = function () {
@@ -18429,7 +18866,6 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
             return;
         }
         this.insertFormatNode(this.newElem, this.newElemLastChild);
-        this.parent.undoRedoManager.saveData();
     };
     FormatPainterActions.prototype.removeDeniedFormats = function (parentElement) {
         if (!isNullOrUndefined(this.deniedFormatsCollection) && this.deniedFormatsCollection.length > 0) {
@@ -18478,13 +18914,23 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
     FormatPainterActions.prototype.copyAction = function () {
         var copyCollection = [];
         var range = this.parent.nodeSelection.getRange(document);
-        var parentElem = range.startContainer.parentElement;
+        var domSelection = this.parent.nodeSelection;
+        var nodes = range.collapsed ? domSelection.getSelectionNodeCollection(range) :
+            domSelection.getSelectionNodeCollectionBr(range);
+        if (nodes.length === 0 && domSelection.getSelectionNodeCollectionBr(range).length === 0) {
+            return;
+        }
+        else {
+            nodes = nodes.length === 0 ? domSelection.getSelectionNodeCollectionBr(range) : nodes;
+        }
+        var parentElem = nodes[0].parentElement;
         var currentContext = this.findCurrentContext(parentElem);
-        var allowedRulesArray = this.settings.allowedFormats.split(';');
+        var allowedRulesArray = this.settings.allowedFormats.indexOf(';') > -1 ? this.settings.allowedFormats.split(';') :
+            [this.settings.allowedFormats];
         for (var i = 0; i < allowedRulesArray.length; i++) {
             allowedRulesArray[i] = allowedRulesArray[i].trim();
         }
-        var _a = this.getRangeParentElem(currentContext, range), rangeParentElem = _a[0], context = _a[1];
+        var _a = this.getRangeParentElem(currentContext, parentElem), rangeParentElem = _a[0], context = _a[1];
         if (currentContext === null) {
             currentContext = context;
         }
@@ -18529,8 +18975,8 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
         }
         this.generateElement();
     };
-    FormatPainterActions.prototype.getRangeParentElem = function (currentContext, range) {
-        var startContainer = range.startContainer;
+    FormatPainterActions.prototype.getRangeParentElem = function (currentContext, rangeParent) {
+        var startContainer = rangeParent;
         var rangeParentELem;
         if (startContainer.nodeType === 3) {
             startContainer = startContainer.parentElement;
@@ -18550,7 +18996,7 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
                 break;
         }
         if (isNullOrUndefined(rangeParentELem)) {
-            var nearBlockParentName = this.getNearestBlockParentElement(range);
+            var nearBlockParentName = this.getNearestBlockParentElement(rangeParent);
             if (!isNullOrUndefined(nearBlockParentName) && nearBlockParentName !== 'UL' &&
                 nearBlockParentName !== 'OL' && nearBlockParentName !== 'LI') {
                 rangeParentELem = closest(startContainer, nearBlockParentName);
@@ -18562,8 +19008,8 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
         }
         return [rangeParentELem, currentContext];
     };
-    FormatPainterActions.prototype.getNearestBlockParentElement = function (range) {
-        var node = range.commonAncestorContainer;
+    FormatPainterActions.prototype.getNearestBlockParentElement = function (rangeParent) {
+        var node = rangeParent;
         if (node.nodeType === 3) {
             node = node.parentNode;
         }
@@ -18606,29 +19052,32 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
         }
     };
     FormatPainterActions.prototype.validateELementTag = function (node) {
-        var INVALID_TAGS = ['A', 'AUDIO', 'IMG', 'VIDEO', 'IFRAME'];
         if (node.nodeType === 3) {
             node = node.parentElement;
         }
-        return INVALID_TAGS.indexOf(node.tagName) > -1;
+        return this.INVALID_TAGS.indexOf(node.tagName) > -1;
     };
     FormatPainterActions.prototype.findCurrentContext = function (parentElem) {
-        if (closest(parentElem, 'td') || closest(parentElem, 'tr') || closest(parentElem, 'tbody')) {
-            return 'Table';
+        if (closest(parentElem, 'p')) {
+            return 'Text';
         }
         else if (closest(parentElem, 'li')) {
             return 'List';
         }
-        else if (closest(parentElem, 'p')) {
-            return 'Text';
+        else if (closest(parentElem, 'td') || closest(parentElem, 'tr') || closest(parentElem, 'th')) {
+            return 'Table';
         }
         return null;
     };
     FormatPainterActions.prototype.insertFormatNode = function (elem, lastChild) {
+        var clonedElem = elem.cloneNode(true);
+        if (!this.isBlockElement(elem)) {
+            var newBlockElem = createElement('P');
+            newBlockElem.appendChild(elem);
+            clonedElem = newBlockElem.cloneNode(true);
+        }
         var endNode = this.parent.editableElement;
         var docElement = this.parent.currentDocument;
-        var domSelection = this.parent.nodeSelection;
-        var clonedElem = elem.cloneNode(true);
         var childElem = clonedElem.firstChild;
         var inlineElement;
         while (childElem) {
@@ -18645,107 +19094,183 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
             lastChild: lastChild
         };
         SelectionCommands.applyFormat(docElement, null, endNode, 'P', 'formatPainter', null, formatValues);
-        var isFullNodeSelected;
         var range = this.parent.nodeSelection.getRange(docElement);
         var isCollapsed = range.collapsed;
-        var 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();
+        var blockNodes = this.parent.domNode.blockNodes();
+        var isFullNodeSelected = false;
+        if (blockNodes.length === 1) {
+            isFullNodeSelected = blockNodes[0].textContent.trim() === range.toString().trim();
         }
-        if (this.isBlockElement(elem) && isCollapsed || nodes.length > 1 || isFullNodeSelected) {
-            this.insertBlockNode(elem, range, docElement, endNode, nodes);
+        if (this.isBlockElement(clonedElem) && isCollapsed || blockNodes.length > 1 || isFullNodeSelected) {
+            this.insertBlockNode(clonedElem, range, docElement, blockNodes);
         }
     };
-    FormatPainterActions.prototype.insertBlockNode = function (element, range, docElement, endNode, nodes) {
+    FormatPainterActions.prototype.insertBlockNode = function (element, range, docElement, nodes) {
         var domSelection = this.parent.nodeSelection;
+        var saveSelection = domSelection.save(range, docElement);
+        this.parent.domNode.setMarker(saveSelection);
         var listElement; // To clone to multiple list elements
         var cloneListParentNode;
+        var sameListType = false;
         if (element.nodeName === 'UL' || element.nodeName === 'OL') {
             cloneListParentNode = element.cloneNode(true);
             listElement = cloneListParentNode.firstChild;
         }
-        var textNode = range.startContainer; // To set cursor position
+        var cloneElementNode = isNullOrUndefined(cloneListParentNode) ? element : element.firstChild;
         for (var index = 0; index < nodes.length; index++) {
-            var lastTextNode = nodes[index];
-            if (nodes[index].nodeType === 3) {
-                nodes[index] = nodes[index].parentElement;
-            }
-            while (!this.isBlockElement(nodes[index])) {
-                nodes[index] = nodes[index].parentElement;
-            }
-            var cloneParentNode = void 0;
-            if (!isNullOrUndefined(cloneListParentNode)) {
-                cloneParentNode = listElement.cloneNode(true);
-            }
-            else {
-                cloneParentNode = element.cloneNode(true);
+            if (this.INVALID_TAGS.indexOf(nodes[index].nodeName) > -1 ||
+                nodes[index].querySelectorAll('a,img,audio,video,iframe').length > 0) {
+                continue;
             }
+            var cloneParentNode = cloneElementNode.cloneNode(false);
             // Appending all the child elements
             while (nodes[index].firstChild) {
-                if (cloneParentNode.nodeName === 'LI') {
+                if (nodes[index].textContent.trim().length !== 0) {
                     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]);
+                    nodes[index].removeChild(nodes[index].firstChild);
                 }
             }
-            if (cloneParentNode.nodeName === 'LI') {
-                // Appending the li nodes to the ol or ul node
-                cloneListParentNode.append(cloneParentNode);
-                if (index === 0) {
-                    var nodeName = nodes[index].nodeName;
-                    nodes[index] = nodes[index].parentNode.replaceChild(cloneListParentNode, nodes[index]);
-                    var parent_1 = 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_1, true);
-                    if (!isNullOrUndefined(parent_1.previousElementSibling)) {
-                        parent_1.parentNode.insertBefore(cloneListParentNode, parent_1.nextElementSibling);
-                    }
-                    else {
-                        parent_1.parentElement.insertBefore(cloneListParentNode, parent_1);
-                    }
+            if (nodes[index].nodeName === 'TD' || nodes[index].nodeName === 'TH') {
+                if (isNullOrUndefined(cloneListParentNode)) {
+                    nodes[index].appendChild(cloneParentNode);
+                    continue;
+                }
+                else if (index === 0 && !isNullOrUndefined(cloneListParentNode)) {
+                    nodes[index].appendChild(cloneListParentNode);
+                    cloneListParentNode.appendChild(cloneParentNode);
+                    continue;
                 }
-                detach(nodes[index]);
+                else {
+                    nodes[index].appendChild(cloneParentNode);
+                    continue;
+                }
+            }
+            if (!isNullOrUndefined(cloneListParentNode)) {
+                sameListType = this.isSameListType(element, nodes[index]);
+            }
+            if (cloneParentNode.nodeName === 'LI' && !sameListType) {
+                this.insertNewList(range, nodes, index, cloneListParentNode, cloneParentNode);
+            }
+            else if (sameListType) {
+                this.insertSameList(nodes, index, cloneListParentNode, cloneParentNode);
+            }
+            else {
+                nodes[index].parentNode.replaceChild(cloneParentNode, 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')) {
-                var parent_2 = cloneParentNode.parentElement;
+                var parent_1 = cloneParentNode.parentElement;
                 // Cutting single ul or ol to two ul or ol based on the range
-                this.parent.nodeCutter.SplitNode(range, parent_2, true);
-                if (!isNullOrUndefined(parent_2.previousElementSibling)) {
-                    parent_2.previousElementSibling.after(cloneParentNode);
+                this.parent.nodeCutter.SplitNode(range, parent_1, true);
+                if (!isNullOrUndefined(parent_1.previousElementSibling)) {
+                    parent_1.previousElementSibling.after(cloneParentNode);
+                    // To remove the nested list items out of the block element
+                    if (cloneParentNode.childNodes.length > 1) {
+                        for (var j = 0; j < cloneParentNode.childNodes.length; j++) {
+                            var currentChild = cloneParentNode.childNodes[j];
+                            if (currentChild.nodeName === 'OL' || currentChild.nodeName === 'UL') {
+                                cloneParentNode.after(currentChild);
+                            }
+                        }
+                    }
                 }
                 else {
-                    parent_2.parentElement.prepend(cloneParentNode);
+                    parent_1.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) {
-            var startSelectNode = nodes[0];
-            var endSelectNode = nodes[nodes.length - 1];
-            domSelection.setSelectionText(docElement, startSelectNode, endSelectNode, 0, endSelectNode.textContent.length);
+        var save = this.parent.domNode.saveMarker(saveSelection, null);
+        save.restore();
+    };
+    FormatPainterActions.prototype.insertNewList = function (range, nodes, index, cloneListParentNode, cloneParentNode) {
+        // Appending the li nodes to the ol or ul node
+        if (index === 0) {
+            var nodeName = nodes[index].nodeName;
+            nodes[index] = nodes[index].parentNode.replaceChild(cloneListParentNode, nodes[index]);
+            var parent_2 = 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_2, true);
+            if (nodes[index].nodeName === 'LI' && !isNullOrUndefined(parent_2)) {
+                cloneListParentNode.append(cloneParentNode);
+                if (!isNullOrUndefined(parent_2.parentNode)) {
+                    parent_2.parentNode.insertBefore(cloneListParentNode, parent_2);
+                }
+            }
+            else {
+                if (!isNullOrUndefined(parent_2)) {
+                    if (!isNullOrUndefined(parent_2.previousElementSibling) && parent_2.previousElementSibling.nodeName === cloneListParentNode.nodeName) {
+                        var currentParent = parent_2.previousElementSibling;
+                        currentParent.append(cloneParentNode);
+                        while (currentParent.firstChild) {
+                            cloneListParentNode.append(currentParent.firstChild);
+                        }
+                    }
+                    else if (!isNullOrUndefined(parent_2.nextElementSibling) && parent_2.nextElementSibling.nodeName === cloneListParentNode.nodeName) {
+                        var currentParent = parent_2.nextElementSibling;
+                        currentParent.prepend(cloneParentNode);
+                        while (currentParent.firstChild) {
+                            cloneListParentNode.append(currentParent.firstChild);
+                        }
+                    }
+                    else {
+                        cloneListParentNode.append(cloneParentNode);
+                    }
+                }
+                else {
+                    cloneListParentNode.append(cloneParentNode);
+                }
+            }
+        }
+        else {
+            cloneListParentNode.append(cloneParentNode);
+        }
+        this.detachEmptyBlockNodes(nodes[index]);
+    };
+    FormatPainterActions.prototype.insertSameList = function (nodes, index, cloneListParentNode, cloneParentNode) {
+        if (index === 0) {
+            if (!isNullOrUndefined(nodes[index].parentNode) && (nodes[index].parentNode.nodeName === 'UL' || nodes[index].parentNode.nodeName === 'OL')) {
+                // append the nodes[index].parentNode.childNodes to the clonelistparentnode
+                if (nodes.length === 1) {
+                    // When clicked with cursor in the single list item
+                    while (cloneParentNode.firstChild) {
+                        nodes[index].append(cloneParentNode.firstChild);
+                    }
+                    for (var i = 0; i < nodes[index].parentNode.childNodes.length; i++) {
+                        var currentChild = nodes[index].parentNode.childNodes[i];
+                        cloneListParentNode.append(currentChild.cloneNode(true));
+                    }
+                }
+                else {
+                    cloneListParentNode.append(cloneParentNode);
+                }
+                // replace the older ol and ul with new ol and ul of clonelistparentnode
+                nodes[index].parentNode.parentNode.replaceChild(cloneListParentNode, nodes[index].parentNode);
+            }
         }
         else {
-            domSelection.setCursorPoint(docElement, textNode, textNode.textContent.length);
+            cloneListParentNode.append(cloneParentNode);
         }
+        this.detachEmptyBlockNodes(nodes[index]);
+    };
+    FormatPainterActions.prototype.isSameListType = function (element, node) {
+        var isSameListType = false;
+        var nearestListNode = closest(node, 'ol, ul');
+        if (!isNullOrUndefined(nearestListNode) && nearestListNode.querySelectorAll('li').length > 0) {
+            if (nearestListNode.nodeName === element.nodeName) {
+                isSameListType = true;
+            }
+            else {
+                isSameListType = false;
+            }
+        }
+        return isSameListType;
     };
     FormatPainterActions.prototype.cleanEmptyLists = function () {
         var listElem = this.parent.editableElement.querySelectorAll('ol, ul');
@@ -18760,7 +19285,8 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
         if (isNullOrUndefined(this.settings) || isNullOrUndefined(this.settings.deniedFormats)) {
             return;
         }
-        var deniedFormats = this.settings.deniedFormats.split(';');
+        var deniedFormats = this.settings.deniedFormats.indexOf(';') > -1 ? this.settings.deniedFormats.split(';') :
+            [this.settings.deniedFormats];
         var length = deniedFormats.length;
         for (var i = 0; i < length; i++) {
             var formatString = deniedFormats[i];
@@ -18774,6 +19300,11 @@ var FormatPainterActions = /** @__PURE__ @class */ (function () {
         }
         this.deniedFormatsCollection = deniedFormatsCollection;
     };
+    FormatPainterActions.prototype.detachEmptyBlockNodes = function (node) {
+        if (!isNullOrUndefined(node) && node.textContent.trim() === '') {
+            detach(node);
+        }
+    };
     FormatPainterActions.prototype.makeDeniedFormatsCollection = function (value) {
         var openParenIndex = value.indexOf('(');
         var closeParenIndex = value.indexOf(')');
@@ -18859,7 +19390,8 @@ var EditorManager = /** @__PURE__ @class */ (function () {
         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.formatPainterEditor = new FormatPainterActions(this, options.formatPainterSettings);
+        this.emojiPickerObj = new EmojiPickerAction(this);
         this.wireEvents();
     }
     EditorManager.prototype.wireEvents = function () {
@@ -19007,6 +19539,9 @@ var EditorManager = /** @__PURE__ @class */ (function () {
             case 'formatpainter':
                 this.observer.notify(FORMAT_PAINTER_ACTIONS, { item: exeValue, subCommand: value, event: event, callBack: callBack });
                 break;
+            case 'emojipicker':
+                this.observer.notify(EMOJI_PICKER_ACTIONS, { item: exeValue, subCommand: value, value: text,
+                    event: event, callBack: callBack });
         }
     };
     return EditorManager;
@@ -19220,7 +19755,7 @@ var __extends$3 = (undefined && undefined.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
-var IFRAMEHEADER = "\n<!DOCTYPE html> \n    <html>\n         <head>\n            <meta charset='utf-8' /> \n            <style>\n                @charset \"UTF-8\";\n                body {\n                    font-family: \"Roboto\", sans-serif;\n                    font-size: 14px;\n                }\n                html, body{height: 100%;margin: 0;}\n                body.e-cursor{cursor:default}\n                span.e-selected-node\t{background-color: #939393;color: white;}\n                span.e-selected-node.e-highlight {background-color: #1d9dd8;}\n                body{color:#333;word-wrap:break-word;padding: 8px;box-sizing: border-box;}\n                .e-rte-image, .e-rte-audio, .e-rte-video  {border: 0;cursor: pointer;display:\n                    block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}\n                .e-rte-image.e-imginline, .e-rte-audio.e-audio-inline, .e-rte-video.e-video-inline {display: inline-block;float: none;max-width: calc(100% - (2 * 5px));padding: 1px;vertical-align: bottom;}\n                .e-rte-image.e-imgcenter, .e-rte-video.e-video-center {cursor: pointer;display: block;float: none;margin: 5px auto;max-width: 100%;position: relative;}\n                .e-rte-image.e-imgright, .e-rte-video.e-video-right { float: right; margin: 0 auto;margin-left: 5px;text-align: right;}\n                .e-rte-image.e-imgleft, .e-rte-video.e-video-left {float: left;margin: 0 auto;margin-right: 5px;text-align: left;}\n                .e-img-caption { display: inline-block; float: none; margin: 5px auto; max-width: 100%;position: relative;}\n                .e-img-caption.e-caption-inline {display: inline-block;float: none;\n                    margin: 5px auto;margin-left: 5px;margin-right: 5px;max-width: calc(100% - (2 * 5px));\n                    position: relativetext-align: center;vertical-align: bottom;}\n                .e-img-inner {box-sizing: border-box;display: block;font-size: 16px;font-weight: initial;\n                    margin: auto;opacity: .9;text-align: center;width: 100%;}\n                .e-img-wrap {display: inline-block;margin: auto;padding: 0;text-align: center;width: 100%;}\n                .e-imgleft, .e-video-left {float: left;margin: 0 5px 0 0;text-align: left;}\n                .e-imgright, .e-video-right {float: right;margin: 0 0 0 5px;text-align: right;}\n                .e-imgcenter, .e-video-center {cursor: pointer;display: block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}\n                .e-control img:not(.e-resize) {border: 2px solid transparent; z-index: 1000}\n                .e-imginline , .e-audio-inline, .e-video-inline {display: inline-block;float: none;margin-left: 5px;margin-right: 5px;\n                    max-width: calc(100% - (2 * 5px));vertical-align: bottom;}\n                .e-imgbreak, .e-audio-break, .e-video-break {border: 0;cursor: pointer;\n                    display: block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}\n                .e-rte-image.e-img-focus:not(.e-resize), .e-audio-focus:not(.e-resize), .e-video-focus:not(.e-resize) {border: solid 2px #4a90e2;}\n                img.e-img-focus::selection, audio.e-audio-focus::selection, .e-video-focus::selection { background: transparent;color: transparent;}\n                span.e-rte-imageboxmark {  width: 10px; height: 10px; position: absolute; display: block;\n                    background: #4a90e2; border: 1px solid #fff; z-index: 1000;}\n                .e-mob-rte.e-mob-span span.e-rte-imageboxmark { background: #4a90e2; border: 1px solid #fff; }\n                .e-mob-rte span.e-rte-imageboxmark { background: #fff; border: 1px solid #4a90e2;\n                    border-radius: 15px; height: 20px; width: 20px; }\n                .e-mob-rte.e-mob-span span.e-rte-imageboxmark { background: #4a90e2; border: 1px solid #fff; }\n                .e-rte-content .e-content img.e-resize, .e-rte-content .e-content video.e-resize { z-index: 1000; }\n                .e-img-caption .e-img-inner { outline: 0; }\n                .e-img-caption a:focus-visible { outline: none; }\n                .e-img-caption .e-rte-image.e-imgright, .e-img-caption .e-rte-image.e-imgleft { float: none; margin: 0;}\n                body{box-sizing: border-box;min-height: 100px;outline: 0 solid transparent;\n                    overflow-x: auto;padding: 16px;position: relative;text-align: inherit;z-index: 2;}\n                p{margin: 0 0 10px;margin-bottom: 10px;}\n                li{margin-bottom: 10px;}\n                h1{font-size: 2.17em;font-weight: 400;line-height: 1;margin: 10px 0;}\n                h2{font-size: 1.74em;font-weight: 400;margin: 10px 0;}\n                h3{font-size: 1.31em;font-weight: 400;margin: 10px 0;}\n                h4{font-size: 16px;font-weight: 400;line-height: 1.5;margin: 0;}\n                h5{font-size: 00.8em;font-weight: 400;margin: 0;}\n                h6{font-size: 00.65em;font-weight: 400;margin: 0;}\n                blockquote{margin: 10px 0;margin-left: 0;padding-left: 5px;border-left: solid 2px #5c5c5c;}\n                pre{background-color: inherit;border: 0;border-radius: 0;color: #333;\n                    font-size: inherit;line-height: inherit;margin: 0 0 10px;overflow: visible;padding: 0;\n                    white-space: pre-wrap;word-break: inherit;word-wrap: break-word;}\n                strong, b{font-weight: 700;}\n                a{text-decoration: none;user-select: auto;}\n                a:hover{text-decoration: underline;};\n                p:last-child, pre:last-child, blockquote:last-child{margin-bottom: 0;}\n                h3+h4, h4+h5, h5+h6{margin-top: 00.6em;}\n                ul:last-child{margin-bottom: 0;}\n                table { border-collapse: collapse; empty-cells: show;}\n                table td,table th {border: 1px solid #BDBDBD; height: 20px; padding: 2px 5px; vertical-align: middle;}\n                table.e-alternate-border tbody tr:nth-child(2n) {background-color: #F5F5F5;}\n                table th {background-color: #E0E0E0;}\n                table.e-dashed-border td,table.e-dashed-border th { border: 1px dashed #BDBDBD} \n                table .e-cell-select {border: 1px double #4a90e2;}\n                span.e-table-box { cursor: nwse-resize; display: block; height: 10px; position: absolute; width: 10px; }\n                span.e-table-box.e-rmob {height: 14px;width: 14px;}\n                .e-row-resize, .e-column-resize { background-color: transparent; background-repeat: repeat;\n                    bottom: 0;cursor: col-resize;height: 1px;overflow: visible;position: absolute;width: 1px; }\n                .e-row-resize { cursor: row-resize; height: 1px;}\n                .e-table-rhelper { cursor: col-resize; opacity: .87;position: absolute;}\n                .e-table-rhelper.e-column-helper { width: 1px; }\n                .e-table-rhelper.e-row-helper {height: 1px;}\n                .e-reicon::before { border-bottom: 6px solid transparent; border-right: 6px solid;\n                    border-top: 6px solid transparent; content: ''; display: block; height: 0;\n                    position: absolute; right: 4px; top: 4px; width: 20px; }\n                .e-reicon::after { border-bottom: 6px solid transparent; border-left: 6px solid;\n                    border-top: 6px solid transparent; content: ''; display: block;\n                    height: 0; left: 4px; position: absolute; top: 4px; width: 20px; z-index: 3; }\n                .e-row-helper.e-reicon::after { top: 10px; transform: rotate(90deg); }\n                .e-row-helper.e-reicon::before { left: 4px; top: -20px; transform: rotate(90deg); }\n                span.e-table-box { background-color: #ffffff; border: 1px solid #BDBDBD; }\n                span.e-table-box.e-rbox-select { background-color: #BDBDBD; border: 1px solid #BDBDBD; }\n                .e-table-rhelper { background-color: #4a90e2;}\n                .e-rtl { direction: rtl; }\n                .e-rte-placeholder::before { content: attr(placeholder); opacity: 0.54; overflow: hidden;\n                     padding-top: 16px; position: absolute; text-align: start; top: 0; z-index: 1; }\n            </style>\n        </head>";
+var IFRAMEHEADER = "\n<!DOCTYPE html> \n    <html>\n         <head>\n            <meta charset='utf-8' /> \n            <style>\n                @charset \"UTF-8\";\n                body {\n                    font-family: \"Roboto\", sans-serif;\n                    font-size: 14px;\n                }\n                html, body{height: 100%;margin: 0;}\n                body.e-cursor{cursor:default}\n                span.e-selected-node\t{background-color: #939393;color: white;}\n                span.e-selected-node.e-highlight {background-color: #1d9dd8;}\n                body{color:#333;word-wrap:break-word;padding: 8px;box-sizing: border-box;}\n                .e-rte-image, .e-rte-audio, .e-rte-video  {border: 0;cursor: pointer;display:\n                    block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}\n                .e-rte-image.e-imginline, .e-rte-audio.e-audio-inline, .e-rte-video.e-video-inline {display: inline-block;float: none;max-width: calc(100% - (2 * 5px));padding: 1px;vertical-align: bottom;}\n                .e-rte-image.e-imgcenter, .e-rte-video.e-video-center {cursor: pointer;display: block;float: none;margin: 5px auto;max-width: 100%;position: relative;}\n                .e-rte-image.e-imgright, .e-rte-video.e-video-right { float: right; margin: 0 auto;margin-left: 5px;text-align: right;}\n                .e-rte-image.e-imgleft, .e-rte-video.e-video-left {float: left;margin: 0 auto;margin-right: 5px;text-align: left;}\n                .e-img-caption { display: inline-block; float: none; margin: 5px auto; max-width: 100%;position: relative;}\n                .e-img-caption.e-caption-inline {display: inline-block;float: none;\n                    margin: 5px auto;margin-left: 5px;margin-right: 5px;max-width: calc(100% - (2 * 5px));\n                    position: relativetext-align: center;vertical-align: bottom;}\n                .e-img-inner {box-sizing: border-box;display: block;font-size: 16px;font-weight: initial;\n                    margin: auto;opacity: .9;text-align: center;width: 100%;}\n                .e-img-wrap {display: inline-block;margin: auto;padding: 0;text-align: center;width: 100%;}\n                .e-imgleft, .e-video-left {float: left;margin: 0 5px 0 0;text-align: left;}\n                .e-imgright, .e-video-right {float: right;margin: 0 0 0 5px;text-align: right;}\n                .e-imgcenter, .e-video-center {cursor: pointer;display: block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}\n                .e-control img:not(.e-resize) {border: 2px solid transparent; z-index: 1000}\n                .e-imginline , .e-audio-inline, .e-video-inline {display: inline-block;float: none;margin-left: 5px;margin-right: 5px;\n                    max-width: calc(100% - (2 * 5px));vertical-align: bottom;}\n                .e-imgbreak, .e-audio-break, .e-video-break {border: 0;cursor: pointer;\n                    display: block;float: none;height: auto;margin: 5px auto;max-width: 100%;position: relative;}\n                .e-rte-image.e-img-focus:not(.e-resize), .e-audio-focus:not(.e-resize), .e-video-focus:not(.e-resize) {border: solid 2px #4a90e2;}\n                img.e-img-focus::selection, audio.e-audio-focus::selection, .e-video-focus::selection { background: transparent;color: transparent;}\n                span.e-rte-imageboxmark {  width: 10px; height: 10px; position: absolute; display: block;\n                    background: #4a90e2; border: 1px solid #fff; z-index: 1000;}\n                .e-mob-rte.e-mob-span span.e-rte-imageboxmark { background: #4a90e2; border: 1px solid #fff; }\n                .e-mob-rte span.e-rte-imageboxmark { background: #fff; border: 1px solid #4a90e2;\n                    border-radius: 15px; height: 20px; width: 20px; }\n                .e-mob-rte.e-mob-span span.e-rte-imageboxmark { background: #4a90e2; border: 1px solid #fff; }\n                .e-rte-content .e-content img.e-resize, .e-rte-content .e-content video.e-resize { z-index: 1000; }\n                .e-img-caption .e-img-inner { outline: 0; }\n                .e-img-caption a:focus-visible { outline: none; }\n                .e-img-caption .e-rte-image.e-imgright, .e-img-caption .e-rte-image.e-imgleft { float: none; margin: 0;}\n                body{box-sizing: border-box;min-height: 100px;outline: 0 solid transparent;\n                    overflow-x: auto;padding: 16px;position: relative;text-align: inherit;z-index: 2;}\n                p{margin: 0 0 10px;margin-bottom: 10px;}\n                li{margin-bottom: 10px;}\n                h1{font-size: 2.17em;font-weight: 400;line-height: 1;margin: 10px 0;}\n                h2{font-size: 1.74em;font-weight: 400;margin: 10px 0;}\n                h3{font-size: 1.31em;font-weight: 400;margin: 10px 0;}\n                h4{font-size: 16px;font-weight: 400;line-height: 1.5;margin: 0;}\n                h5{font-size: 00.8em;font-weight: 400;margin: 0;}\n                h6{font-size: 00.65em;font-weight: 400;margin: 0;}\n                blockquote{margin: 10px 0;margin-left: 0;padding-left: 5px;border-left: solid 2px #5c5c5c;}\n                pre{background-color: inherit;border: 0;border-radius: 0;color: #333;\n                    font-size: inherit;line-height: inherit;margin: 0 0 10px;overflow: visible;padding: 0;\n                    white-space: pre-wrap;word-break: inherit;word-wrap: break-word;}\n                strong, b{font-weight: 700;}\n                a{text-decoration: none;user-select: auto;}\n                a:hover{text-decoration: underline;};\n                p:last-child, pre:last-child, blockquote:last-child{margin-bottom: 0;}\n                h3+h4, h4+h5, h5+h6{margin-top: 00.6em;}\n                ul:last-child{margin-bottom: 0;}\n                table { border-collapse: collapse; empty-cells: show;}\n                table td,table th {border: 1px solid #BDBDBD; height: 20px; padding: 2px 5px; vertical-align: middle;}\n                table.e-alternate-border tbody tr:nth-child(2n) {background-color: #F5F5F5;}\n                table th {background-color: #E0E0E0;}\n                table.e-dashed-border td,table.e-dashed-border th { border: 1px dashed #BDBDBD} \n                table .e-cell-select {border: 1px double #4a90e2;}\n                span.e-table-box { cursor: nwse-resize; display: block; height: 10px; position: absolute; width: 10px; }\n                span.e-table-box.e-rmob {height: 14px;width: 14px;}\n                .e-row-resize, .e-column-resize { background-color: transparent; background-repeat: repeat;\n                    bottom: 0;cursor: col-resize;height: 1px;overflow: visible;position: absolute;width: 1px; }\n                .e-row-resize { cursor: row-resize; height: 1px;}\n                .e-table-rhelper { cursor: col-resize; opacity: .87;position: absolute;}\n                .e-table-rhelper.e-column-helper { width: 1px; }\n                .e-table-rhelper.e-row-helper {height: 1px;}\n                .e-reicon::before { border-bottom: 6px solid transparent; border-right: 6px solid;\n                    border-top: 6px solid transparent; content: ''; display: block; height: 0;\n                    position: absolute; right: 4px; top: 4px; width: 20px; }\n                .e-reicon::after { border-bottom: 6px solid transparent; border-left: 6px solid;\n                    border-top: 6px solid transparent; content: ''; display: block;\n                    height: 0; left: 4px; position: absolute; top: 4px; width: 20px; z-index: 3; }\n                .e-row-helper.e-reicon::after { top: 10px; transform: rotate(90deg); }\n                .e-row-helper.e-reicon::before { left: 4px; top: -20px; transform: rotate(90deg); }\n                span.e-table-box { background-color: #ffffff; border: 1px solid #BDBDBD; }\n                span.e-table-box.e-rbox-select { background-color: #BDBDBD; border: 1px solid #BDBDBD; }\n                .e-table-rhelper { background-color: #4a90e2;}\n                .e-rtl { direction: rtl; }\n                .e-rte-placeholder::before { content: attr(placeholder); opacity: 0.54; overflow: hidden; padding-top: 16px; position: absolute; text-align: start; top: 0; z-index: 1; }\n            </style>\n        </head>";
 /**
  * Content module is used to render Rich Text Editor content
  *
@@ -19746,9 +20281,15 @@ var HtmlEditor = /** @__PURE__ @class */ (function () {
     };
     HtmlEditor.prototype.backSpaceCleanup = function (e, currentRange) {
         var isLiElement = false;
+        var isPreviousNotContentEditable = true;
+        if (!isNullOrUndefined(currentRange.startContainer.previousSibling) &&
+            currentRange.startContainer.previousSibling.nodeName === 'SPAN') {
+            isPreviousNotContentEditable = currentRange.startContainer.previousSibling.contentEditable === 'false' ? false : true;
+        }
         if (e.args.code === 'Backspace' && e.args.keyCode === 8 && currentRange.startOffset === 0 &&
             currentRange.endOffset === 0 && this.parent.getSelection().length === 0 && currentRange.startContainer.textContent.length > 0 &&
-            currentRange.startContainer.parentElement.tagName !== 'TD' && currentRange.startContainer.parentElement.tagName !== 'TH') {
+            currentRange.startContainer.parentElement.tagName !== 'TD' && currentRange.startContainer.parentElement.tagName !== 'TH' &&
+            isPreviousNotContentEditable) {
             var checkNode = currentRange.startContainer.nodeName === '#text' ? currentRange.startContainer.parentElement : currentRange.startContainer;
             if (!this.parent.formatter.editorManager.domNode.isBlockNode(checkNode) &&
                 !isNullOrUndefined(checkNode.previousSibling) && checkNode.previousSibling.nodeName === 'BR') {
@@ -19976,7 +20517,7 @@ var HtmlEditor = /** @__PURE__ @class */ (function () {
                 var resultSplitContent = '';
                 for (var j = 0; j < splitTextContent.length; j++) {
                     if (splitTextContent[j].match(httpRegex) || splitTextContent[j].match(wwwRegex)) {
-                        resultSplitContent += '<a className="e-rte-anchor" href="' + splitTextContent[j] +
+                        resultSplitContent += '<a class="e-rte-anchor" href="' + splitTextContent[j] +
                             '" title="' + splitTextContent[j] + '"target="_blank">' + splitTextContent[j] + ' </a>';
                     }
                     else {
@@ -20133,6 +20674,9 @@ var HtmlEditor = /** @__PURE__ @class */ (function () {
                             member: 'fileManager', args: args, selectNode: selectNodeEle, selection: save, selectParent: selectParentEle
                         });
                         break;
+                    case 'EmojiPicker':
+                        this.parent.notify(emojiPicker, { member: 'emojiPicker', args: args });
+                        break;
                     default:
                         this.parent.formatter.process(this.parent, args, args.originalEvent, null);
                         break;
@@ -20425,6 +20969,7 @@ var PasteCleanup = /** @__PURE__ @class */ (function () {
             if (Browser.userAgent.indexOf('Firefox') !== -1) {
                 var currentFocusNode = _this.nodeSelectionObj.getRange(_this.contentRenderer.getDocument()).startContainer;
                 if (currentFocusNode.nodeName !== '#text') {
+                    // eslint-disable-next-line
                     currentFocusNode = currentFocusNode.childNodes[_this.nodeSelectionObj.getRange(_this.contentRenderer.getDocument()).startOffset];
                 }
                 if (currentFocusNode.previousSibling.nodeName === 'IMG') {
@@ -21337,7 +21882,7 @@ var Resize = /** @__PURE__ @class */ (function () {
         else {
             var eventType = Browser.info.name !== 'msie' ? e.touches[0] : e;
             this.parent.element.style.height = eventType.clientY - boundRect.top + 'px';
-            this.parent.element.style.width = (!this.parent.enableRtl) ? e.clientX - boundRect.left + 'px' : boundRect.right - e.clientX + 'px';
+            this.parent.element.style.width = (!this.parent.enableRtl) ? eventType.clientX - boundRect.left + 'px' : boundRect.right - eventType.clientX + 'px';
         }
         if (!this.parent.toolbarSettings.enable) {
             this.parent.setContentHeight('', false);
@@ -21514,6 +22059,7 @@ var FileManager$1 = /** @__PURE__ @class */ (function () {
             detailsViewSettings: this.parent.fileManagerSettings.detailsViewSettings,
             contextMenuSettings: this.parent.fileManagerSettings.contextMenuSettings,
             navigationPaneSettings: this.parent.fileManagerSettings.navigationPaneSettings,
+            beforeSend: this.parent.fileManagerSettings.beforeSend,
             fileSelect: function (e) {
                 var selectedFile = e.fileDetails;
                 if (selectedFile.isFile && proxy.parent.insertImageSettings.allowedTypes.indexOf(selectedFile.type) > -1) {
@@ -21674,6 +22220,9 @@ var FullScreen = /** @__PURE__ @class */ (function () {
             && !isNullOrUndefined(this.parent.quickToolbarModule)) {
             this.parent.quickToolbarModule.hideQuickToolbars();
         }
+        if (this.parent.showTooltip && !isNullOrUndefined(document.querySelector('.e-tooltip-wrap'))) {
+            this.parent.notify(maximizeMinimizeClick, { args: event });
+        }
         this.scrollableParent = getScrollableParent(this.parent.element);
         if (!this.parent.element.classList.contains(CLS_FULL_SCREEN)) {
             var evenArgs = {
@@ -21726,6 +22275,9 @@ var FullScreen = /** @__PURE__ @class */ (function () {
             && !isNullOrUndefined(this.parent.quickToolbarModule)) {
             this.parent.quickToolbarModule.hideQuickToolbars();
         }
+        if (this.parent.showTooltip && !isNullOrUndefined(document.querySelector('.e-tooltip-wrap'))) {
+            this.parent.notify(maximizeMinimizeClick, { args: event });
+        }
         if (this.parent.element.classList.contains(CLS_FULL_SCREEN)) {
             var evenArgs = {
                 cancel: false,
@@ -21903,14 +22455,10 @@ var FormatPainter = /** @__PURE__ @class */ (function () {
     };
     FormatPainter.prototype.onKeyDown = function (event) {
         var originalEvent = event.args;
-        if ((originalEvent.ctrlKey && originalEvent.shiftKey && (originalEvent.action === 'format-copy' || originalEvent.action === 'format-paste'))
+        if ((originalEvent.altKey && 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();
+            if ((originalEvent.action === 'format-copy' || originalEvent.action === 'format-paste')) {
+                originalEvent.stopPropagation();
             }
             this.actionHandler(event, 'keyBoard');
         }
@@ -21994,8 +22542,7 @@ var FormatPainter = /** @__PURE__ @class */ (function () {
         }
     };
     FormatPainter.prototype.destroy = function () {
-        /**Removeeventlistener */
-        if (this.parent.isDestroyed) {
+        if (isNullOrUndefined(this.parent) || this.parent.isDestroyed) {
             return;
         }
         this.parent.off(formatPainterClick, this.toolbarClick);
@@ -22003,6 +22550,13 @@ var FormatPainter = /** @__PURE__ @class */ (function () {
         this.parent.off(formatPainterDoubleClick, this.toolbarDoubleClick);
         this.parent.off(keyDown, this.onKeyDown);
         this.parent.off(destroy, this.destroy);
+        if (!isNullOrUndefined(this.parent.formatter.editorManager.formatPainterEditor)) {
+            this.parent.formatter.editorManager.formatPainterEditor.destroy();
+        }
+        this.parent = undefined;
+        this.isSticky = undefined;
+        this.isActive = undefined;
+        this.previousAction = undefined;
     };
     /**
      * For internal use only - Get the module name.
@@ -22016,6 +22570,778 @@ var FormatPainter = /** @__PURE__ @class */ (function () {
     return FormatPainter;
 }());
 
+var EmojiPicker = /** @__PURE__ @class */ (function () {
+    function EmojiPicker(parent, serviceLocator) {
+        this.parent = parent;
+        this.locator = serviceLocator;
+        this.i10n = serviceLocator.getService('rteLocale');
+        this.renderFactory = this.locator.getService('rendererFactory');
+        this.baseToolbar = new BaseToolbar(this.parent, this.locator);
+        this.addEventListener();
+    }
+    /**
+     * Destroys the Count.
+     *
+     * @function destroy
+     * @returns {void}
+     * @hidden
+     * @deprecated
+     */
+    EmojiPicker.prototype.destroy = function () {
+        this.removeEventListener();
+    };
+    EmojiPicker.prototype.addEventListener = function () {
+        this.parent.on(emojiPicker, this.toolbarClick, this);
+        this.parent.on(docClick, this.docClick, this);
+        this.parent.on(keyDown, this.onkeyPress, this);
+        this.parent.on(keyUp, this.onkeyUp, this);
+        this.parent.on(contentscroll, this.contentscroll, this);
+        this.parent.on(scroll, this.contentscroll, this);
+    };
+    // eslint-disable-next-line
+    EmojiPicker.prototype.toolbarClick = function (args) {
+        var _this = this;
+        var _a, _b;
+        var spanElement = this.parent.element.querySelector('.e-emoji');
+        this.divElement = spanElement.closest('div');
+        var range = this.parent.formatter.editorManager.nodeSelection.getRange(this.parent.contentModule.getDocument());
+        this.save = this.parent.formatter.editorManager.nodeSelection.save(range, this.parent.contentModule.getDocument());
+        this.clickEvent = args.args;
+        var emojiPicker$$1 = this.parent.emojiPickerSettings.iconsSet;
+        if (this.popupObj) {
+            removeClass([this.divElement], 'e-active');
+            if (this.popupObj.element.querySelector('.e-rte-emoji-search') || !this.parent.emojiPickerSettings.showSearchBox) {
+                this.popupObj.hide();
+                return;
+            }
+            this.popupObj.hide();
+        }
+        this.popDiv = this.parent.createElement('div', { className: 'e-rte-emojipicker-popup', id: this.parent.getID() + '_emojiPicker' });
+        this.parent.getToolbar().appendChild(this.popDiv);
+        EventHandler.add(this.popDiv, 'keydown', this.onKeyDown, this);
+        EventHandler.add(this.popDiv, 'keyup', this.searchFilter, this);
+        var extendEle = this.parent.element.querySelector('.e-toolbar-extended');
+        var zIndex;
+        if (!isNullOrUndefined(extendEle)) {
+            var computedStyle = window.getComputedStyle(extendEle);
+            zIndex = computedStyle.getPropertyValue('z-index');
+        }
+        else {
+            zIndex = '10001';
+        }
+        var target;
+        var xValue;
+        var yValue;
+        if (!isNullOrUndefined(args.args)) {
+            target = args.args.originalEvent.target;
+            target = target.classList.contains('e-toolbar-item') ? target.firstChild : target.parentElement;
+            xValue = 'left';
+            yValue = 'bottom';
+        }
+        else if (isNullOrUndefined(args.x) && isNullOrUndefined(args.y)) {
+            target = this.parent.inputElement;
+            if (window.getSelection().rangeCount > 0) {
+                var coordinates = this.getCoordinates();
+                xValue = coordinates.left;
+                yValue = coordinates.top;
+            }
+        }
+        else {
+            target = this.parent.inputElement;
+            xValue = args.x;
+            yValue = args.y;
+        }
+        this.popupObj = new Popup(this.popDiv, {
+            targetType: 'relative',
+            relateTo: target,
+            collision: { X: 'fit', Y: 'none' },
+            offsetY: 8,
+            viewPortElement: this.parent.element,
+            position: { X: xValue, Y: yValue },
+            enableRtl: this.parent.enableRtl,
+            zIndex: parseInt(zIndex, 10) + 1,
+            actionOnScroll: 'hide',
+            // eslint-disable-next-line
+            close: function (event) {
+                _this.parent.isBlur = false;
+                _this.popupObj.destroy();
+                detach(_this.popupObj.element);
+                _this.popupObj = null;
+            }
+        });
+        addClass([this.popupObj.element], 'e-popup-open');
+        this.popupObj.refreshPosition(target);
+        // header search element
+        if ((!isNullOrUndefined(args.args) || (isNullOrUndefined(args.x) && isNullOrUndefined(args.y))) && this.parent.emojiPickerSettings.showSearchBox) {
+            var inputEle = createElement('input', { id: 'e-rte-emoji-search', className: 'e-rte-emoji-search' });
+            this.popDiv.append(inputEle);
+            var inputobj = new TextBox({
+                placeholder: this.i10n.getConstant('emojiPickerTypeToFind'),
+                showClearButton: true
+            });
+            inputobj.appendTo(inputEle);
+            inputEle.focus();
+        }
+        var closeIcon = this.popupObj.element.querySelector('.e-clear-icon');
+        if (!isNullOrUndefined(closeIcon)) {
+            EventHandler.add(closeIcon, 'mousedown', this.searchFilter, this);
+        }
+        // Header emoji toolbar div
+        var emojiToolBar = this.parent.createElement('div', { className: 'e-rte-emojipicker-toolbar' });
+        this.popDiv.appendChild(emojiToolBar);
+        var pushToolBar = [];
+        for (var i = 0; i < this.parent.emojiPickerSettings.iconsSet.length; i++) {
+            if (!isNullOrUndefined(this.parent.emojiPickerSettings.iconsSet[i].iconCss)) {
+                pushToolBar.push({ prefixIcon: this.parent.emojiPickerSettings.iconsSet[i].iconCss, htmlAttributes: (_a = {}, _a['title'] = this.parent.emojiPickerSettings.iconsSet[i].name, _a) });
+            }
+            else {
+                pushToolBar.push({ text: '&#x' + this.parent.emojiPickerSettings.iconsSet[i].code + ';', htmlAttributes: (_b = {}, _b['title'] = this.parent.emojiPickerSettings.iconsSet[i].name, _b) });
+            }
+        }
+        var toolbarObj = new Toolbar({
+            items: pushToolBar,
+            clicked: this.emojiToolbarClick.bind(this)
+        });
+        toolbarObj.appendTo(emojiToolBar);
+        // emoji btn div
+        var emojiBtnDiv = this.parent.createElement('div', { className: 'e-rte-emojipicker-btn' });
+        this.popDiv.appendChild(emojiBtnDiv);
+        var height;
+        var popupBorder = window.getComputedStyle(this.popDiv);
+        if ((isNullOrUndefined(args.args) && !(isNullOrUndefined(args.x) && isNullOrUndefined(args.y))) || !this.parent.emojiPickerSettings.showSearchBox) {
+            height = (this.popDiv.getBoundingClientRect().height - emojiToolBar.getBoundingClientRect().height - (2 * parseFloat(popupBorder.borderWidth))) + 'px';
+            emojiBtnDiv.style.setProperty('height', height, 'important');
+        }
+        else {
+            var inputELe = this.parent.element.querySelector('.e-rte-emoji-search').parentElement;
+            var getComputedStyle_1 = window.getComputedStyle(inputELe);
+            height = (this.popDiv.getBoundingClientRect().height - emojiToolBar.getBoundingClientRect().height
+                - inputELe.getBoundingClientRect().height
+                - parseFloat(getComputedStyle_1.marginTop) - parseFloat(getComputedStyle_1.marginBottom)
+                - (2 * parseFloat(popupBorder.borderWidth))) + 'px';
+            emojiBtnDiv.style.setProperty('height', height, 'important');
+        }
+        for (var i = 0; i < emojiPicker$$1.length; i++) {
+            var emojiGroupDiv = this.parent.createElement('div', { className: 'e-rte-emojipicker-group' });
+            emojiBtnDiv.appendChild(emojiGroupDiv);
+            var emojiName = this.parent.createElement('div', { className: 'e-rte-emojipicker-name' });
+            emojiName.innerText = this.parent.emojiPickerSettings.iconsSet[i].name;
+            emojiName.setAttribute('aria-label', this.parent.emojiPickerSettings.iconsSet[i].name);
+            emojiGroupDiv.appendChild(emojiName);
+            var emojiBtn = this.parent.createElement('div', { className: 'e-rte-emojipickerbtn-group' });
+            emojiGroupDiv.appendChild(emojiBtn);
+            for (var j = 0; j < emojiPicker$$1[i].icons.length; j++) {
+                var button = this.parent.createElement('button', { className: 'e-btn ' + ' ' + 'e-control' });
+                button.innerHTML = this.buttoncode(this.parent.emojiPickerSettings.iconsSet[i].icons[j].code);
+                button.setAttribute('aria-label', (this.parent.emojiPickerSettings.iconsSet[i].icons[j].desc));
+                button.setAttribute('title', (this.parent.emojiPickerSettings.iconsSet[i].icons[j].desc));
+                emojiBtn.appendChild(button);
+                if (button.innerHTML.length > 2) {
+                    button.style.fontSize = '17px';
+                }
+            }
+        }
+        EventHandler.add(emojiBtnDiv, 'scroll', this.scrollEvent, this);
+        EventHandler.add(emojiBtnDiv, 'click', this.emojiBtnClick, this);
+        var emojiButtons = this.parent.element.querySelectorAll('.e-rte-emojipicker-btn button');
+        if (isNullOrUndefined(this.parent.element.querySelector('.e-rte-emoji-search')) && !isNullOrUndefined(args.args)) {
+            emojiButtons[0].focus();
+            addClass([emojiButtons[0]], 'e-focus');
+        }
+        var popup = this.parent.element.querySelector('.e-rte-emojipicker-btn');
+        var toolbarName = this.parent.element.querySelectorAll('.e-rte-emojipicker-toolbar button');
+        var scrollTop;
+        if (!isNullOrUndefined(popup)) {
+            scrollTop = Math.round(popup.scrollTop);
+        }
+        for (var i = 0; i < toolbarName.length; i++) {
+            /* eslint-disable */
+            if (toolbarName[i].classList.contains('e-selected')) {
+                removeClass([toolbarName[i]], 'e-selected');
+            }
+            /* eslint-enable */
+        }
+        if (scrollTop < toolbarName[0].offsetHeight) {
+            addClass([toolbarName[0]], 'e-selected');
+        }
+        if (this.popupObj) {
+            addClass([this.divElement], 'e-active');
+        }
+    };
+    EmojiPicker.prototype.buttoncode = function (value) {
+        var valueLength = value.split('-');
+        // eslint-disable-next-line
+        var joinedEmoji = valueLength.map(function (cp) { return String.fromCodePoint(parseInt(cp, 16)); }).join('\u200D');
+        return joinedEmoji;
+    };
+    EmojiPicker.prototype.docClick = function (e) {
+        var target = e.args.target;
+        if (target && target.classList && ((this.popupObj && !closest(target, '[id=' + '\'' + this.popupObj.element.id + '\'' + ']')))
+            && (!target.classList.contains('e-emoji') && !target.classList.contains('e-toolbar-item'))) {
+            if (this.popupObj) {
+                removeClass([this.divElement], 'e-active');
+                this.popupObj.hide();
+            }
+        }
+    };
+    EmojiPicker.prototype.scrollEvent = function () {
+        var popup = this.parent.element.querySelector('.e-rte-emojipicker-btn');
+        var emojiSet = this.parent.element.querySelectorAll('.e-rte-emojipicker-group');
+        var toolbarName = this.parent.element.querySelectorAll('.e-rte-emojipicker-toolbar button');
+        var scrollTop;
+        if (!isNullOrUndefined(popup)) {
+            scrollTop = Math.round(popup.scrollTop);
+        }
+        var firstSetWidth = 0;
+        for (var j = 0; j < toolbarName.length; j++) {
+            if (scrollTop < toolbarName[0].offsetHeight) {
+                if (!isNullOrUndefined(toolbarName[j + 1])) {
+                    removeClass([toolbarName[j + 1]], 'e-selected');
+                }
+                addClass([toolbarName[0]], 'e-selected');
+            }
+        }
+        for (var i = 0; i < emojiSet.length; i++) {
+            // eslint-disable-next-line
+            firstSetWidth += Math.round(emojiSet[i].offsetHeight);
+            if (scrollTop >= firstSetWidth) {
+                for (var k = 0; k < toolbarName.length; k++) {
+                    /* eslint-disable */
+                    if (toolbarName[k].classList.contains('e-selected')) {
+                        removeClass([toolbarName[k]], 'e-selected');
+                    }
+                    /* eslint-enable */
+                }
+                if (!isNullOrUndefined(toolbarName[i + 1])) {
+                    addClass([toolbarName[i + 1]], 'e-selected');
+                }
+            }
+        }
+    };
+    EmojiPicker.prototype.contentscroll = function () {
+        if (isNullOrUndefined(this.clickEvent) && this.popupObj) {
+            removeClass([this.divElement], 'e-active');
+            this.popupObj.hide();
+            return;
+        }
+    };
+    EmojiPicker.prototype.emojiToolbarClick = function (e) {
+        var args = {
+            // eslint-disable-next-line
+            text: e.item.htmlAttributes.title,
+        };
+        var currentEleName = args.text;
+        var emojiGroups = this.parent.element.querySelectorAll('.e-rte-emojipicker-group');
+        var emojiButtons = this.parent.element.querySelectorAll('.e-rte-emojipicker-btn button');
+        var toolbarName = this.parent.element.querySelectorAll('.e-rte-emojipicker-toolbar button');
+        for (var i = 0; i < toolbarName.length; i++) {
+            /* eslint-disable */
+            if (toolbarName[i].classList.contains('e-selected')) {
+                removeClass([toolbarName[i]], 'e-selected');
+            }
+            /* eslint-enable */
+        }
+        for (var i = 0; i < emojiButtons.length; i++) {
+            if (emojiButtons[i].classList.contains('e-focus')) {
+                removeClass([emojiButtons[i]], 'e-focus');
+            }
+        }
+        // Loop through the selected elements and perform the same operation on each element
+        var emojiGroupsheight = this.parent.element.querySelector('.e-rte-emojipicker-btn');
+        var emojiHeight = 0;
+        // eslint-disable-next-line
+        emojiGroups.forEach(function (group) {
+            var childNodes = group.childNodes[0];
+            var focusBtn = group.childNodes[1].childNodes[0];
+            var ariaLabel = childNodes.getAttribute('aria-label');
+            if (currentEleName === ariaLabel) {
+                if (childNodes) {
+                    emojiGroupsheight.scrollTop = emojiHeight + 10;
+                    addClass([focusBtn], 'e-focus');
+                    focusBtn.focus();
+                }
+            }
+            else {
+                emojiHeight += group.scrollHeight;
+                removeClass([focusBtn], 'e-focus');
+            }
+        });
+    };
+    EmojiPicker.prototype.onKeyDown = function (e) {
+        // Select all emoji buttons
+        var emojiButtons = this.parent.element.querySelectorAll('.e-rte-emojipicker-btn button');
+        var emojiGroups = this.parent.element.querySelectorAll('.e-rte-emojipickerbtn-group');
+        var searchKeyHandler = this.parent.element.querySelector('.e-rte-emojisearch-btn button');
+        if (e.keyCode === 27) {
+            if (this.popupObj) {
+                removeClass([this.divElement], 'e-active');
+                this.popupObj.hide();
+            }
+        }
+        if (e.keyCode === 13) {
+            var activeEle = document.activeElement;
+            if (activeEle.classList.contains('e-btn')) {
+                this.emojiBtnClick(e);
+                e.preventDefault();
+            }
+        }
+        var srcElement = e.srcElement;
+        if (!isNullOrUndefined(srcElement)) {
+            if (srcElement.classList.contains('e-rte-emoji-search') && e.keyCode === 40) {
+                for (var i = 0; i < emojiButtons.length; i++) {
+                    if (emojiButtons[i].classList.contains('e-focus')) {
+                        removeClass([emojiButtons[i]], 'e-focus');
+                    }
+                }
+            }
+        }
+        if (!isNullOrUndefined(searchKeyHandler)) {
+            this.filterKeyHandler(e);
+        }
+        else {
+            for (var i = 0; i < emojiButtons.length; i++) {
+                var focusIndex = i;
+                if (emojiButtons[i].classList.contains('e-focus')) {
+                    if (e.keyCode === 40) {
+                        // Move focus to next row if there is one
+                        if (emojiButtons.length - 4 > i) {
+                            var count$$1 = 0;
+                            for (var j = 0; j < emojiGroups.length; j++) {
+                                for (var k = 0; k < emojiGroups[j].childNodes.length; k++) {
+                                    // eslint-disable-next-line
+                                    var childNodes = emojiGroups[j].childNodes[k];
+                                    if (childNodes.classList.contains('e-focus') && count$$1 !== 1) {
+                                        var currentIndex = k;
+                                        var lastChild = emojiGroups[j].lastChild;
+                                        var lastRowIndex = Math.floor((k) % 6);
+                                        var lastEleLength = emojiGroups[j].childNodes.length - 1;
+                                        var lastEleIndex = Math.floor((lastEleLength) % 6);
+                                        if (currentIndex !== -1) {
+                                            var nextRowIndex = currentIndex + 6;
+                                            if (!isNullOrUndefined(emojiGroups[j].childNodes[nextRowIndex])) {
+                                                // next row has six buttons
+                                                // handle focus change here
+                                                var firstFocusEle = emojiButtons[i];
+                                                removeClass([firstFocusEle], 'e-focus');
+                                                var focusEle = emojiButtons[focusIndex += 6];
+                                                addClass([focusEle], 'e-focus');
+                                                focusEle.focus();
+                                                break;
+                                            }
+                                            else if (isNullOrUndefined(emojiGroups[j].childNodes[nextRowIndex]) && !lastChild.classList.contains('e-focus') && lastEleIndex < lastRowIndex) {
+                                                var firstFocusEle = emojiButtons[i];
+                                                removeClass([firstFocusEle], 'e-focus');
+                                                var focusEle = emojiGroups[j].lastChild;
+                                                addClass([focusEle], 'e-focus');
+                                                focusEle.focus();
+                                                count$$1 = 1;
+                                                break;
+                                            }
+                                            else {
+                                                var firstFocusEle = emojiButtons[i];
+                                                removeClass([firstFocusEle], 'e-focus');
+                                                var focusEle = emojiGroups[j + 1]
+                                                    .childNodes[lastRowIndex];
+                                                addClass([focusEle], 'e-focus');
+                                                focusEle.focus();
+                                                count$$1 = 1;
+                                                break;
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                            break;
+                        }
+                    }
+                    else if (e.keyCode === 38) {
+                        // Move focus to previous row if there is one
+                        if (i >= 6) {
+                            var count$$1 = 0;
+                            for (var j = 0; j < emojiGroups.length; j++) {
+                                for (var k = 0; k < emojiGroups[j].childNodes.length; k++) {
+                                    var childNodes = emojiGroups[j].childNodes[k];
+                                    if (childNodes.classList.contains('e-focus') && count$$1 !== 1) {
+                                        // eslint-disable-next-line
+                                        var currentIndex = k;
+                                        var previousRowLength = isNullOrUndefined(emojiGroups[j - 1]) ? null :
+                                            emojiGroups[j - 1].childNodes.length % 6 || 6;
+                                        if (currentIndex !== -1) {
+                                            var previousRowIndex = currentIndex - 6;
+                                            if (!isNullOrUndefined(emojiGroups[j].childNodes[previousRowIndex])) {
+                                                // previous row has six buttons
+                                                // handle focus change here
+                                                var firstFocusEle = emojiButtons[i];
+                                                removeClass([firstFocusEle], 'e-focus');
+                                                var focusEle = emojiButtons[focusIndex -= 6];
+                                                addClass([focusEle], 'e-focus');
+                                                focusEle.focus();
+                                                break;
+                                            }
+                                            else if (isNullOrUndefined(emojiGroups[j - 1].childNodes[emojiGroups[j - 1]
+                                                .childNodes.length - (previousRowLength - k)])) {
+                                                var firstFocusEle = emojiButtons[i];
+                                                removeClass([firstFocusEle], 'e-focus');
+                                                var focusEle = emojiGroups[j - 1].lastChild;
+                                                addClass([focusEle], 'e-focus');
+                                                focusEle.focus();
+                                                count$$1 = 1;
+                                                break;
+                                            }
+                                            else {
+                                                // previous row has less than six buttons
+                                                // handle focus change here
+                                                var firstFocusEle = emojiButtons[i];
+                                                removeClass([firstFocusEle], 'e-focus');
+                                                var focusEle = emojiGroups[j - 1].childNodes[emojiGroups[j - 1].
+                                                    childNodes.length - (previousRowLength - k)];
+                                                addClass([focusEle], 'e-focus');
+                                                focusEle.focus();
+                                                count$$1 = 1;
+                                                break;
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                        else {
+                            var firstFocusEle = emojiButtons[i];
+                            removeClass([firstFocusEle], 'e-focus');
+                            var focusEle = emojiButtons[focusIndex -= 1];
+                            var inputELe = this.popupObj.element.querySelector('.e-rte-emoji-search');
+                            if (isNullOrUndefined(focusEle) && !isNullOrUndefined(inputELe)) {
+                                inputELe.focus();
+                                break;
+                            }
+                            addClass([focusEle], 'e-focus');
+                            focusEle.focus();
+                        }
+                        break;
+                    }
+                    else if (e.keyCode === 39) {
+                        // Move focus to next button in current row
+                        if (emojiButtons.length !== i + 1) {
+                            var firstFocusEle = emojiButtons[i];
+                            removeClass([firstFocusEle], 'e-focus');
+                            var focusEle = emojiButtons[focusIndex += 1];
+                            addClass([focusEle], 'e-focus');
+                            emojiButtons[focusIndex].focus();
+                        }
+                        break;
+                    }
+                    else if (e.keyCode === 37) {
+                        // Move focus to previous button in current row
+                        if (i > 0) {
+                            var firstFocusEle = emojiButtons[i];
+                            removeClass([firstFocusEle], 'e-focus');
+                            var focusEle = emojiButtons[focusIndex -= 1];
+                            addClass([focusEle], 'e-focus');
+                            emojiButtons[focusIndex].focus();
+                        }
+                        break;
+                    }
+                }
+            }
+        }
+        if (e.keyCode === 40) {
+            var firstFocusEle = this.parent.element.querySelector('.e-focus');
+            if (isNullOrUndefined(firstFocusEle)) {
+                var focusEle = emojiButtons[0];
+                addClass([focusEle], 'e-focus');
+                emojiButtons[0].focus();
+            }
+        }
+    };
+    EmojiPicker.prototype.filterKeyHandler = function (e) {
+        var emojiButtons = this.parent.element.querySelectorAll('.e-rte-emojisearch-btn button');
+        var firstFocusEle = this.parent.element.querySelector('.e-focus');
+        if (isNullOrUndefined(firstFocusEle) && e.keyCode === 40) {
+            var focusEle = emojiButtons[0];
+            addClass([focusEle], 'e-focus');
+            emojiButtons[0].focus();
+        }
+        else {
+            for (var i = 0; i < emojiButtons.length; i++) {
+                var focusIndex = i;
+                // eslint-disable-next-line
+                var childNodes = emojiButtons[i];
+                if (childNodes.classList.contains('e-focus')) {
+                    if (e.keyCode === 38) {
+                        if (i >= 6) {
+                            var firstFocusEle_1 = emojiButtons[i];
+                            removeClass([firstFocusEle_1], 'e-focus');
+                            var focusEle = emojiButtons[focusIndex -= 6];
+                            addClass([focusEle], 'e-focus');
+                            focusEle.focus();
+                            break;
+                        }
+                        else {
+                            var firstFocusEle_2 = emojiButtons[i];
+                            removeClass([firstFocusEle_2], 'e-focus');
+                            var focusEle = emojiButtons[focusIndex -= 1];
+                            var inputELe = this.popupObj.element.querySelector('.e-rte-emoji-search');
+                            if (isNullOrUndefined(focusEle) && !isNullOrUndefined(inputELe)) {
+                                inputELe.focus();
+                                break;
+                            }
+                            addClass([focusEle], 'e-focus');
+                            focusEle.focus();
+                        }
+                    }
+                    else if (e.keyCode === 40) {
+                        if (emojiButtons.length - 6 > i) {
+                            var firstFocusEle_3 = emojiButtons[i];
+                            removeClass([firstFocusEle_3], 'e-focus');
+                            var focusEle = emojiButtons[focusIndex += 6];
+                            addClass([focusEle], 'e-focus');
+                            focusEle.focus();
+                            break;
+                        }
+                    }
+                    else if (e.keyCode === 39) {
+                        if (emojiButtons.length !== i + 1) {
+                            var firstFocusEle_4 = emojiButtons[i];
+                            removeClass([firstFocusEle_4], 'e-focus');
+                            var focusEle = emojiButtons[focusIndex += 1];
+                            addClass([focusEle], 'e-focus');
+                            emojiButtons[focusIndex].focus();
+                        }
+                        break;
+                    }
+                    else if (e.keyCode === 37) {
+                        if (i > 0) {
+                            var firstFocusEle_5 = emojiButtons[i];
+                            removeClass([firstFocusEle_5], 'e-focus');
+                            var focusEle = emojiButtons[focusIndex -= 1];
+                            addClass([focusEle], 'e-focus');
+                            emojiButtons[focusIndex].focus();
+                            break;
+                        }
+                    }
+                }
+            }
+        }
+    };
+    EmojiPicker.prototype.searchFilter = function (e, value) {
+        var inputElement = this.parent.element.querySelector('.e-rte-emoji-search');
+        var contentELe = this.parent.element.querySelector('.e-content');
+        if (document.activeElement === inputElement || document.activeElement === contentELe) {
+            var trimmedStr = void 0;
+            if (value !== ':' && !isNullOrUndefined(value)) {
+                trimmedStr = value.replace(/^:/, '');
+            }
+            else if (!isNullOrUndefined(value)) {
+                trimmedStr = value;
+            }
+            var inputValue = isNullOrUndefined(inputElement) ? trimmedStr : inputElement.value;
+            var emojiButtons = this.parent.element.querySelectorAll('.e-rte-emojipicker-btn button');
+            var emojipickerAll = this.parent.element.querySelector('.e-rte-emojipicker-btn');
+            var emojiGroups = this.parent.element.querySelectorAll('.e-rte-emojipicker-group');
+            var toolbarGroup = this.parent.element.querySelector('.e-rte-emojipicker-toolbar');
+            var excludedDiv_1 = this.parent.element.querySelector('.e-rte-emojisearch-btn');
+            var firstChild = this.popDiv.childNodes[0];
+            var getComputedStyle_2 = window.getComputedStyle(firstChild);
+            var inputHeight = firstChild.nodeName === 'SPAN' ? (firstChild.getBoundingClientRect().height + parseFloat(getComputedStyle_2.marginTop) +
+                parseFloat(getComputedStyle_2.marginBottom)) : 0;
+            var popupBorder = window.getComputedStyle(this.popDiv);
+            // eslint-disable-next-line @typescript-eslint/tslint/config
+            var filteredButtons = isNullOrUndefined(excludedDiv_1) ? emojiButtons :
+                // eslint-disable-next-line @typescript-eslint/tslint/config
+                Array.from(emojiButtons).filter(function (button) { return !excludedDiv_1.contains(button); });
+            if (inputValue === '' || value === ':') {
+                toolbarGroup.style.display = '';
+                emojipickerAll.style.height = (this.popDiv.getBoundingClientRect().height - toolbarGroup.getBoundingClientRect().height - inputHeight - (2 * parseFloat(popupBorder.borderWidth))) + 'px';
+                // eslint-disable-next-line @typescript-eslint/tslint/config
+                emojiGroups.forEach(function (element) {
+                    element.style.display = '';
+                });
+            }
+            else {
+                // eslint-disable-next-line @typescript-eslint/tslint/config
+                emojiGroups.forEach(function (element) {
+                    element.style.display = 'none';
+                });
+                toolbarGroup.style.display = 'none';
+                emojipickerAll.style.height = (this.popDiv.getBoundingClientRect().height - inputHeight - (2 * parseFloat(popupBorder.borderWidth))) + 'px';
+            }
+            var emojiBtnDiv = this.parent.createElement('div', { className: 'e-rte-emojisearch-btn' });
+            var emojis = this.parent.element.querySelector('.e-rte-emojisearch-btn');
+            if (emojis) {
+                emojis.remove();
+            }
+            var noEmojiObj = this.parent.createElement('div', { className: 'e-rte-emojiSearch-noEmoji' });
+            var noEMoji = true;
+            for (var i = 0; i < filteredButtons.length; i++) {
+                if (!isNullOrUndefined(filteredButtons[i].getAttribute('title'))) {
+                    var title = filteredButtons[i].getAttribute('title').toLowerCase();
+                    var titleLength = title.split(' ');
+                    for (var j = 0; j < titleLength.length; j++) {
+                        if (titleLength[j].startsWith(inputValue.toLowerCase()) && inputValue !== '') {
+                            var emoji = filteredButtons[i].cloneNode(true);
+                            emojiBtnDiv.appendChild(emoji);
+                            noEMoji = false;
+                            break;
+                        }
+                    }
+                }
+            }
+            if (noEMoji && !this.parent.element.querySelector('.e-rte-emojiSearch-noEmoji') && (inputValue !== '' && value !== ':')) {
+                noEmojiObj.innerHTML = '<span style="color: rgba(0, 0, 0, 0.75); font-weight: 500; font-size: 16px;">' + this.i10n.getConstant('emojiPickerNoResultFound') + ' 😥 </span>' + '<br>' + '<span style="color: rgba(0, 0, 0, 0.75);"> ' + this.i10n.getConstant('emojiPickerTrySomethingElse') + ' ? </span>';
+                noEmojiObj.style.margin = '55px';
+                emojipickerAll.appendChild(noEmojiObj);
+            }
+            else if (!noEMoji && this.parent.element.querySelector('.e-rte-emojiSearch-noEmoji') || (inputValue === '' && value === ':')) {
+                emojipickerAll.removeChild(this.parent.element.querySelector('.e-rte-emojiSearch-noEmoji'));
+            }
+            emojipickerAll.appendChild(emojiBtnDiv);
+        }
+        else {
+            return;
+        }
+    };
+    EmojiPicker.prototype.emojiBtnClick = function (e) {
+        var event = new MouseEvent('mouseleave', { bubbles: true, cancelable: true });
+        // Includes the emote button element tooltip and toolbar tooltip
+        var emotePickerTooltips = this.parent.element.querySelectorAll('.e-rte-emojipicker-popup [data-tooltip-id]');
+        for (var i = 0; i < emotePickerTooltips.length; i++) {
+            emotePickerTooltips[i].dispatchEvent(event);
+        }
+        var targetEle = e.target;
+        if (targetEle.tagName !== 'BUTTON') {
+            return;
+        }
+        targetEle.focus();
+        if (!isNullOrUndefined(this.clickEvent)) {
+            this.save.restore();
+        }
+        if (this.popupObj) {
+            removeClass([this.divElement], 'e-active');
+            this.popupObj.hide();
+        }
+        var originalEvent = e;
+        this.parent.formatter.process(this.parent, {
+            item: {
+                'command': 'EmojiPicker',
+                'subCommand': 'EmojiPicker',
+                value: targetEle.innerHTML
+            }
+        }, e, originalEvent);
+    };
+    EmojiPicker.prototype.onkeyPress = function (e) {
+        var originalEvent = e.args;
+        var selection = window.getSelection();
+        if (selection.rangeCount <= 0) {
+            return;
+        }
+        var range = selection.getRangeAt(0);
+        var cursorPos = range.startOffset;
+        var prevChar = selection.focusNode.textContent.substring(cursorPos - 1, cursorPos);
+        var isPrevSpace = /\s/.test(prevChar);
+        var isPrevColon = selection.focusNode.textContent.substring(cursorPos - 1, cursorPos) === ':';
+        var colon = selection.focusNode.textContent.charAt(cursorPos - 1) === ':';
+        if (originalEvent.keyCode === 186 && originalEvent.shiftKey && (isPrevSpace || selection.focusOffset === 0)) {
+            var coordinates = this.getCoordinates();
+            this.parent.showEmojiPicker(coordinates.left, coordinates.top);
+        }
+        if (originalEvent.keyCode === 8 && colon && this.popupObj) {
+            removeClass([this.divElement], 'e-active');
+            this.popupObj.hide();
+        }
+        if (originalEvent.keyCode === 32 && isPrevColon && this.popupObj) {
+            removeClass([this.divElement], 'e-active');
+            this.popupObj.hide();
+        }
+        if (this.popupObj && (originalEvent.keyCode === 37 || originalEvent.keyCode === 38 || originalEvent.keyCode === 39
+            || originalEvent.keyCode === 27 || originalEvent.keyCode === 40)) {
+            this.onKeyDown(originalEvent);
+            originalEvent.preventDefault();
+        }
+    };
+    EmojiPicker.prototype.onkeyUp = function (e) {
+        var originalEvent = e.args;
+        var selection = window.getSelection();
+        var range = selection.getRangeAt(0);
+        var cursorPos = range.startOffset;
+        // eslint-disable-next-line
+        var selectedValue;
+        var count$$1 = 0;
+        for (var i = cursorPos - 1; i >= cursorPos - 15; i--) {
+            var prevChar = selection.focusNode.textContent.substring(i - 1, i);
+            var isPrevSpace = /:$/.test(prevChar);
+            if (isPrevSpace && !isNullOrUndefined(this.popDiv) && count$$1 === 0) {
+                selectedValue = range.startContainer.textContent.substring(i - 1, cursorPos);
+                this.searchFilter(originalEvent, selectedValue);
+                count$$1 = 1;
+            }
+        }
+        var colon = selection.focusNode.textContent.substring(cursorPos - 1, cursorPos);
+        if (colon === ':' && !isNullOrUndefined(this.popupObj)) {
+            selectedValue = colon;
+            this.searchFilter(originalEvent, selectedValue);
+        }
+    };
+    EmojiPicker.prototype.getCoordinates = function () {
+        var coordinates;
+        var selection = window.getSelection();
+        var range = selection.getRangeAt(0);
+        var firstChild;
+        if (range.startContainer.nodeName === 'P' || range.startContainer.nodeName === 'DIV') {
+            if (range.startContainer.childNodes[0].nodeName !== '#text') {
+                firstChild = range.startContainer.childNodes[0];
+            }
+        }
+        // eslint-disable-next-line
+        var rect = isNullOrUndefined(firstChild) ? range.getBoundingClientRect() : firstChild.getBoundingClientRect();
+        var rteContent = this.parent.element.querySelector('.e-rte-content');
+        var rteEle = this.parent.element;
+        var toolbarHeight = rteEle.offsetHeight - rteContent.offsetHeight;
+        var cursorTop = rect.top - this.parent.inputElement.getBoundingClientRect().top;
+        var cursorLeft = rect.left - this.parent.inputElement.getBoundingClientRect().left;
+        var screenHeight = window.innerHeight;
+        var popupHeight = 330;
+        var popupTop = cursorTop;
+        var popupLeft = cursorLeft + rect.width;
+        if (rteEle.getBoundingClientRect().top < 0) {
+            popupTop = popupTop + rteContent.getBoundingClientRect().top - toolbarHeight;
+        }
+        if (rect.top < popupHeight) {
+            // eslint-disable-next-line
+            popupTop = popupTop;
+        }
+        else if (rect.top + popupHeight > screenHeight) {
+            popupTop -= popupHeight + 20;
+        }
+        if (this.parent.inputElement) {
+            coordinates = {
+                top: popupTop + 60,
+                left: popupLeft + 8
+            };
+        }
+        return coordinates;
+    };
+    EmojiPicker.prototype.removeEventListener = function () {
+        if (this.parent.isDestroyed) {
+            return;
+        }
+        this.parent.off(emojiPicker, this.toolbarClick);
+        this.parent.off(docClick, this.docClick);
+        this.parent.off(keyDown, this.onkeyPress);
+        this.parent.off(keyUp, this.onkeyUp);
+        this.parent.off(contentscroll, this.contentscroll);
+        this.parent.off(scroll, this.contentscroll);
+    };
+    /**
+     * For internal use only - Get the module name.
+     *
+     * @returns {string} - returns the string value
+     */
+    EmojiPicker.prototype.getModuleName = function () {
+        return 'emojiPicker';
+    };
+    return EmojiPicker;
+}());
+
 /**
  * Action export
  */
@@ -22796,15 +24122,20 @@ var Image = /** @__PURE__ @class */ (function () {
         if (args.subCommand.toLowerCase() === 'undo' || args.subCommand.toLowerCase() === 'redo') {
             for (var i = 0; i < this.parent.formatter.getUndoRedoStack().length; i++) {
                 var temp = this.parent.createElement('div');
-                var contentElem = parseHtml(this.parent.formatter.getUndoRedoStack()[i].text);
-                temp.appendChild(contentElem);
+                var contentElem = this.parent.formatter.getUndoRedoStack()[i].text;
+                temp.appendChild(contentElem.cloneNode(true));
                 var img = temp.querySelectorAll('img');
                 if (temp.querySelector('.e-img-resize') && img.length > 0) {
                     for (var j = 0; j < img.length; j++) {
                         img[j].style.outline = '';
                     }
                     detach(temp.querySelector('.e-img-resize'));
-                    this.parent.formatter.getUndoRedoStack()[i].text = temp.innerHTML;
+                    var clonedElement = temp.cloneNode(true);
+                    var fragment = document.createDocumentFragment();
+                    while (clonedElement.firstChild) {
+                        fragment.appendChild(clonedElement.firstChild);
+                    }
+                    this.parent.formatter.getUndoRedoStack()[i].text = fragment;
                 }
             }
         }
@@ -22997,7 +24328,7 @@ var Image = /** @__PURE__ @class */ (function () {
         if (isNullOrUndefined(img.width)) {
             return;
         }
-        // eslint-disable-next-line
+        // eslint-disable-next-line security/detect-unsafe-regex
         var width = img.style.width !== '' ? img.style.width.match(/^\d+(\.\d*)?%$/g) ? parseFloat(img.style.width) :
             parseInt(img.style.width, 10) : img.width;
         var height = img.style.height !== '' ? parseInt(img.style.height, 10) : img.height;
@@ -23276,7 +24607,7 @@ var Image = /** @__PURE__ @class */ (function () {
             selectNodeEle = this.parent.formatter.editorManager.nodeSelection.getNodeCollection(range);
             selectParentEle = this.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);
             if (!originalEvent.ctrlKey && originalEvent.key && (originalEvent.key.length === 1 || originalEvent.action === 'enter') &&
-                (selectParentEle[0].tagName === 'IMG') && selectParentEle[0].parentElement) {
+                (!isNullOrUndefined(selectParentEle[0]) && selectParentEle[0].tagName === 'IMG') && selectParentEle[0].parentElement) {
                 var prev = selectParentEle[0].parentElement.childNodes[0];
                 if (this.contentModule.getEditPanel().querySelector('.e-img-resize')) {
                     this.removeResizeEle();
@@ -23925,7 +25256,7 @@ var Image = /** @__PURE__ @class */ (function () {
             var dialogContent = this.imgsizeInput(e);
             var selectObj_1 = { args: e.args, selfImage: this, selection: e.selection, selectNode: e.selectNode };
             this.dialogObj.setProperties({
-                height: 'inherit', width: '290px', header: imgSizeHeader, content: dialogContent, position: { X: 'center', Y: 'center' },
+                height: (Browser.isDevice) ? '300px' : 'inherit', width: '290px', header: imgSizeHeader, content: dialogContent, position: { X: 'center', Y: 'center' },
                 buttons: [{
                         // eslint-disable-next-line
                         click: function (e) {
@@ -25071,8 +26402,8 @@ var Audio = /** @__PURE__ @class */ (function () {
         if (args.subCommand.toLowerCase() === 'undo' || args.subCommand.toLowerCase() === 'redo') {
             for (var i = 0; i < this.parent.formatter.getUndoRedoStack().length; i++) {
                 var temp = this.parent.createElement('div');
-                var contentElem = parseHtml(this.parent.formatter.getUndoRedoStack()[i].text);
-                temp.appendChild(contentElem);
+                var contentElem = this.parent.formatter.getUndoRedoStack()[i].text;
+                temp.appendChild(contentElem.cloneNode(true));
             }
         }
     };
@@ -25958,15 +27289,20 @@ var Video = /** @__PURE__ @class */ (function () {
         if (args.subCommand.toLowerCase() === 'undo' || args.subCommand.toLowerCase() === 'redo') {
             for (var i = 0; i < this.parent.formatter.getUndoRedoStack().length; i++) {
                 var temp = this.parent.createElement('div');
-                var contentElem = parseHtml(this.parent.formatter.getUndoRedoStack()[i].text);
-                temp.appendChild(contentElem);
+                var contentElem = this.parent.formatter.getUndoRedoStack()[i].text;
+                temp.appendChild(contentElem.cloneNode(true));
                 var vid = temp.querySelectorAll('video');
                 if (temp.querySelector('.e-vid-resize') && vid.length > 0) {
                     for (var j = 0; j < vid.length; j++) {
                         vid[j].style.outline = '';
                     }
                     detach(temp.querySelector('.e-vid-resize'));
-                    this.parent.formatter.getUndoRedoStack()[i].text = temp.innerHTML;
+                    var clonedElement = temp.cloneNode(true);
+                    var fragment = document.createDocumentFragment();
+                    while (clonedElement.firstChild) {
+                        fragment.appendChild(clonedElement.firstChild);
+                    }
+                    this.parent.formatter.getUndoRedoStack()[i].text = fragment;
                 }
             }
         }
@@ -26262,8 +27598,8 @@ var Video = /** @__PURE__ @class */ (function () {
             parseInt(vidEleStyle.width, 10) : vid.style.width !== '' ? vid.style.width : vid.width;
         var 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 ? '60px' : formatUnit(this.parent.insertVideoSettings.minHeight);
+            vid.style.minWidth = this.parent.insertVideoSettings.minWidth === 0 ? '200px' : formatUnit(this.parent.insertVideoSettings.minWidth);
+            vid.style.minHeight = this.parent.insertVideoSettings.minHeight === 0 ? '90px' : formatUnit(this.parent.insertVideoSettings.minHeight);
             if (this.parent.insertVideoSettings.resizeByPercent) {
                 if (parseInt('' + vid.getBoundingClientRect().width + '', 10) !== 0 && parseInt('' + width + '', 10) !== 0) {
                     var percentageValue = this.pixToPerc((parseInt(width.toString(), 10) / parseInt(height.toString(), 10) * expectedY), (vid.previousElementSibling || vid.parentElement));
@@ -26459,7 +27795,7 @@ var Video = /** @__PURE__ @class */ (function () {
             selectNodeEle = this.parent.formatter.editorManager.nodeSelection.getNodeCollection(range);
             selectParentEle = this.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);
             if (!originalEvent.ctrlKey && originalEvent.key && (originalEvent.key.length === 1 || originalEvent.action === 'enter') &&
-                ((selectParentEle[0].tagName === 'VIDEO' || this.isEmbedVidElem(selectParentEle[0]))) &&
+                ((!isNullOrUndefined(selectParentEle[0]) && selectParentEle[0].tagName === 'VIDEO' || this.isEmbedVidElem(selectParentEle[0]))) &&
                 selectParentEle[0].parentElement) {
                 var prev = selectParentEle[0].parentElement.childNodes[0];
                 if (this.contentModule.getEditPanel().querySelector('.e-vid-resize')) {
@@ -26975,7 +28311,7 @@ var Video = /** @__PURE__ @class */ (function () {
         videoUrl.appendChild(urlContent);
         this.embedInputUrl = this.parent.createElement('textarea', {
             className: 'e-input e-embed-video-url',
-            attrs: { placeholder: 'Paste Embedded Code here', type: 'text', tabindex: '-1', 'aria-label': this.i10n.getConstant('embedVideoLinkHeader') }
+            attrs: { placeholder: this.i10n.getConstant('pasteEmbeddedCodeHere'), type: 'text', tabindex: '-1', 'aria-label': this.i10n.getConstant('embedVideoLinkHeader') }
         });
         this.embedInputUrl.addEventListener('keyup', function () {
             if (!isNullOrUndefined(_this.embedInputUrl)) {
@@ -27002,7 +28338,7 @@ var Video = /** @__PURE__ @class */ (function () {
             }
         });
         var embedUrlBtn = new RadioButton({
-            label: 'Embedded Code',
+            label: this.i10n.getConstant('embeddedCode'),
             checked: true,
             name: 'URL',
             created: function () {
@@ -27016,7 +28352,7 @@ var Video = /** @__PURE__ @class */ (function () {
         });
         embedUrlBtn.appendTo(videoUrl.querySelector('#embedURL'));
         var webUrlBtn = new RadioButton({
-            label: 'Web URL',
+            label: this.i10n.getConstant('webUrl'),
             name: 'URL',
             change: function () {
                 urlContent.innerHTML = '';
@@ -29449,6 +30785,9 @@ var FileManagerSettings = /** @__PURE__ @class */ (function (_super) {
     function FileManagerSettings() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
+    __decorate$2([
+        Event()
+    ], FileManagerSettings.prototype, "beforeSend", void 0);
     __decorate$2([
         Complex({ getImageUrl: null, url: null, uploadUrl: null }, AjaxSettings)
     ], FileManagerSettings.prototype, "ajaxSettings", void 0);
@@ -29570,16 +30909,29 @@ var FormatPainterSettings = /** @__PURE__ @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     __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;')
+        Property('b; em; font; sub; sup; kbd; i; s; u; code; strong; span; p; div; h1; h2; h3; h4; h5; h6; blockquote; ol; ul; li; pre;')
     ], FormatPainterSettings.prototype, "allowedFormats", void 0);
     __decorate$2([
         Property(null)
     ], FormatPainterSettings.prototype, "deniedFormats", void 0);
     return FormatPainterSettings;
 }(ChildProperty));
+/**
+ * Specifies the emoji picker options in Rich Text Editor with the following properties.
+ */
+var EmojiSettings = /** @__PURE__ @class */ (function (_super) {
+    __extends$5(EmojiSettings, _super);
+    function EmojiSettings() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    __decorate$2([
+        Property(defaultEmojiIcons)
+    ], EmojiSettings.prototype, "iconsSet", void 0);
+    __decorate$2([
+        Property(true)
+    ], EmojiSettings.prototype, "showSearchBox", void 0);
+    return EmojiSettings;
+}(ChildProperty));
 /**
  * Configures the Paste Cleanup settings of the RichTextEditor.
  */
@@ -29879,7 +31231,7 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
             }
             isTableEnter = blockElement.tagName === 'TD' || blockElement.tagName === 'TBODY' ? false : true;
         }
-        if (e.args.which === 13 && e.args.code === 'Enter') {
+        if (e.args.which === 13 && (!Browser.isDevice ? e.args.code === 'Enter' : e.args.key === 'Enter')) {
             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'))) {
                 var shiftKey_1 = e.args.shiftKey;
@@ -29985,7 +31337,7 @@ var EnterKeyAction = /** @__PURE__ @class */ (function () {
                                 var 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))) {
                                     var startNodeText = _this.range.startContainer.textContent;
                                     var splitFirstText = startNodeText.substring(0, _this.range.startOffset);
                                     // eslint-disable-next-line max-len
@@ -30407,6 +31759,10 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
                 member: 'formatPainter',
                 args: [this]
             });
+            modules.push({
+                member: 'emojiPicker',
+                args: [this, this.serviceLocator]
+            });
         }
         if (this.fileManagerSettings.enable) {
             modules.push({ member: 'fileManager', args: [this, this.serviceLocator] });
@@ -30606,6 +31962,20 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
         });
         return str;
     };
+    /**
+     * Shows the emoji picker
+     *
+     * @param {number} x - specifies the number value.
+     * @param {number} y - specifies the number value.
+     * @returns {void}
+     * @public
+     */
+    RichTextEditor.prototype.showEmojiPicker = function (x, y) {
+        if (this.readonly) {
+            return;
+        }
+        this.notify(emojiPicker, { x: x, y: y });
+    };
     /**
      * Executes the commands
      *
@@ -30841,7 +32211,7 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
             this.valueContainer.defaultValue = this.value;
         }
         // eslint-disable-next-line
-        (!this.enabled) ? this.unWireEvents() : this.eventInitializer();
+        (this.enabled && !this.readonly) ? this.eventInitializer() : this.unWireEvents();
         this.notify(bindCssClass, { cssClass: this.cssClass });
         this.addAudioVideoWrapper();
         this.notify(tableclass, {});
@@ -30927,6 +32297,7 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
         var currentEndContainer = range.endContainer;
         var currentStartOffset = range.startOffset;
         var isSameContainer = currentStartContainer === currentEndContainer ? true : false;
+        // eslint-disable-next-line
         var currentEndOffset = currentEndContainer.textContent.length;
         var endNode = range.endContainer.nodeName === '#text' ? range.endContainer.parentElement :
             range.endContainer;
@@ -31009,7 +32380,8 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
                 this.formatter.editorManager.nodeSelection.setCursorPoint(this.contentModule.getDocument(), range.startContainer, range.startOffset);
             }
         }
-        if (this.formatter.getUndoRedoStack().length === 0) {
+        var notFormatPainterCopy = !isNullOrUndefined(e.action) && e.action !== 'format-copy';
+        if (this.formatter.getUndoRedoStack().length === 0 && notFormatPainterCopy) {
             this.formatter.saveData();
         }
         if (e.action !== 'insert-link' &&
@@ -31041,8 +32413,8 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
             if ((!isNullOrUndefined(this.placeHolderWrapper)) && (this.inputElement.textContent.length !== 1)) {
                 this.placeHolderWrapper.style.display = 'none';
             }
-            else if (this.iframeSettings.enable && this.inputElement.classList.contains("e-rte-placeholder")) {
-                removeClass([this.inputElement], "e-rte-placeholder");
+            else if (this.iframeSettings.enable && this.inputElement.classList.contains('e-rte-placeholder')) {
+                removeClass([this.inputElement], 'e-rte-placeholder');
             }
             else {
                 this.setPlaceHolder();
@@ -31071,7 +32443,9 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
             this.inputElement.innerHTML = getEditValue(getDefaultValue(this), this);
         }
         var allowedKeys = e.which === 32 || e.which === 13 || e.which === 8 || e.which === 46;
-        if (((e.key !== 'shift' && !e.ctrlKey) && e.key && e.key.length === 1 || allowedKeys) || (this.editorMode === 'Markdown'
+        var formatPainterCopy = e.key === 'C' && e.altKey && e.shiftKey;
+        var formatPainterPaste = e.key === 'V' && e.altKey && e.shiftKey;
+        if ((!formatPainterCopy && !formatPainterPaste) && ((e.key !== 'shift' && !e.ctrlKey) && e.key && e.key.length === 1 || allowedKeys) || (this.editorMode === 'Markdown'
             && ((e.key !== 'shift' && !e.ctrlKey) && e.key && e.key.length === 1 || allowedKeys)) && !this.inlineMode.enable) {
             this.formatter.onKeyHandler(this, e);
         }
@@ -31622,6 +32996,9 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
                     newProp.quickToolbarSettings.showOnRightClick ? this.wireContextEvent() : this.unWireContextEvent();
                     this.notify(modelChanged, { newProp: newProp, oldProp: oldProp });
                     break;
+                case 'formatPainterSettings':
+                    this.formatter.editorManager.observer.notify(MODEL_CHANGED, { module: 'formatPainter', newProp: newProp });
+                    break;
                 default:
                     this.notify(modelChanged, { newProp: newProp, oldProp: oldProp });
                     break;
@@ -31751,11 +33128,11 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
             if (this.inputElement.textContent.length === 0 && this.inputElement.childNodes.length < 2 && !isNullOrUndefined(this.inputElement.firstChild) && (this.inputElement.firstChild.nodeName === 'BR' ||
                 ((this.inputElement.firstChild.nodeName === 'P' || this.inputElement.firstChild.nodeName === 'DIV') && !isNullOrUndefined(this.inputElement.firstChild.firstChild) &&
                     this.inputElement.firstChild.firstChild.nodeName === 'BR'))) {
-                addClass([this.inputElement], "e-rte-placeholder");
+                addClass([this.inputElement], 'e-rte-placeholder');
                 this.inputElement.setAttribute('placeholder', this.placeholder);
             }
             else {
-                removeClass([this.inputElement], "e-rte-placeholder");
+                removeClass([this.inputElement], 'e-rte-placeholder');
             }
         }
     };
@@ -31985,7 +33362,7 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
         var _this = this;
         if (this.valueTemplate) {
             var regEx = new RegExp(/<(?=.*? .*?\/ ?>|br|hr|input|!--|wbr)[a-z]+.*?>|<([a-z]+).*?<\/\1>/i);
-            if (regEx.test(this.valueTemplate)) {
+            if (typeof this.valueTemplate === 'string' && regEx.test(this.valueTemplate)) {
                 this.setProperties({ value: this.valueTemplate });
             }
             else {
@@ -32484,7 +33861,7 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
                 this.timeInterval = null;
             }
             if (!isNullOrUndefined(this.placeHolderWrapper) && this.element.querySelector('[title = Preview]')) {
-                this.placeHolderWrapper.style.display = "none";
+                this.placeHolderWrapper.style.display = 'none';
             }
             EventHandler.remove(document, 'mousedown', this.onDocumentClick);
         }
@@ -32543,7 +33920,8 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
             EventHandler.add(element, 'scroll', this.scrollHandler, this);
         }
         if (!this.iframeSettings.enable) {
-            EventHandler.add(this.contentModule.getPanel(), 'scroll', this.contentScrollHandler, this);
+            // Add the scroll event handler from the inputElement
+            EventHandler.add(this.inputElement, 'scroll', this.contentScrollHandler, this);
         }
     };
     RichTextEditor.prototype.wireContextEvent = function () {
@@ -32572,7 +33950,8 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
             EventHandler.remove(element, 'scroll', this.scrollHandler);
         }
         if (!this.iframeSettings.enable) {
-            EventHandler.remove(this.contentModule.getPanel(), 'scroll', this.contentScrollHandler);
+            // Remove the scroll event handler from the inputElement
+            EventHandler.remove(this.inputElement, 'scroll', this.contentScrollHandler);
         }
     };
     RichTextEditor.prototype.touchHandler = function (e) {
@@ -32755,6 +34134,9 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
     __decorate$1([
         Complex({}, FormatPainterSettings)
     ], RichTextEditor.prototype, "formatPainterSettings", void 0);
+    __decorate$1([
+        Complex({}, EmojiSettings)
+    ], RichTextEditor.prototype, "emojiPickerSettings", void 0);
     __decorate$1([
         Complex({}, IFrameSettings)
     ], RichTextEditor.prototype, "iframeSettings", void 0);
@@ -33044,5 +34426,5 @@ var RichTextEditor = /** @__PURE__ @class */ (function (_super) {
  * Rich Text Editor component exported items
  */
 
-export { Toolbar$2 as Toolbar, KeyboardEvents$1 as KeyboardEvents, BaseToolbar, BaseQuickToolbar, QuickToolbar, Count, ColorPickerInput, MarkdownToolbarStatus, ExecCommandCallBack, ToolbarAction, MarkdownEditor, HtmlEditor, PasteCleanup, Resize, DropDownButtons, FileManager$1 as FileManager, FullScreen, setAttributes, HtmlToolbarStatus, XhtmlValidation, FormatPainter, 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 };
+export { Toolbar$2 as Toolbar, KeyboardEvents$1 as KeyboardEvents, BaseToolbar, BaseQuickToolbar, QuickToolbar, Count, ColorPickerInput, MarkdownToolbarStatus, ExecCommandCallBack, ToolbarAction, MarkdownEditor, HtmlEditor, PasteCleanup, Resize, DropDownButtons, FileManager$1 as FileManager, FullScreen, setAttributes, HtmlToolbarStatus, XhtmlValidation, FormatPainter, EmojiPicker, HTMLFormatter, Formatter, MarkdownFormatter, ContentRender, Render, ToolbarRenderer, Link, Image, Audio, Video, ViewSource, Table, DialogRenderer, IframeContentRender, MarkdownRender, PopupRenderer, RichTextEditor, RenderType, ToolbarType, DialogType, executeGroup, created, destroyed, tableclass, load, initialLoad, contentChanged, initialEnd, iframeMouseDown, destroy, toolbarClick, toolbarRefresh, refreshBegin, toolbarUpdated, bindOnEnd, renderColorPicker, htmlToolbarClick, markdownToolbarClick, destroyColorPicker, modelChanged, tableModulekeyUp, keyUp, keyDown, mouseUp, toolbarCreated, toolbarRenderComplete, enableFullScreen, disableFullScreen, dropDownSelect, beforeDropDownItemRender, execCommandCallBack, imageToolbarAction, audioToolbarAction, videoToolbarAction, linkToolbarAction, windowResize, resizeStart, onResize, resizeStop, undo, redo, insertLink, unLink, editLink, openLink, actionBegin, actionComplete, updatedToolbarStatus, actionSuccess, updateToolbarItem, insertImage, insertAudio, insertVideo, insertCompleted, imageLeft, imageRight, imageCenter, imageBreak, imageInline, imageLink, imageAlt, imageDelete, audioDelete, videoDelete, imageCaption, imageSize, videoSize, sourceCode, updateSource, toolbarOpen, beforeDropDownOpen, selectionSave, selectionRestore, expandPopupClick, count, contentFocus, contentBlur, mouseDown, sourceCodeMouseDown, editAreaClick, scroll, contentscroll, colorPickerChanged, tableColorPickerChanged, focusChange, selectAll$1 as selectAll, selectRange, getSelectedHtml, renderInlineToolbar, paste, imgModule, rtlMode, createTable, docClick, tableToolbarAction, checkUndo, readOnlyMode, moduleDestroy, pasteClean, enterHandler, beforeDialogOpen, clearDialogObj, dialogOpen, beforeDialogClose, dialogClose, beforeQuickToolbarOpen, quickToolbarOpen, quickToolbarClose, popupHide, imageSelected, imageUploading, imageUploadSuccess, imageUploadFailed, imageRemoving, fileSelected, fileUploading, fileUploadSuccess, fileUploadFailed, fileRemoving, afterImageDelete, afterMediaDelete, drop, xhtmlValidation, beforeImageUpload, beforeFileUpload, resizeInitialized, renderFileManager, beforeImageDrop, dynamicModule, beforePasteCleanup, afterPasteCleanup, updateTbItemsStatus, showLinkDialog, closeLinkDialog, showImageDialog, showAudioDialog, showVideoDialog, closeImageDialog, closeAudioDialog, closeVideoDialog, showTableDialog, closeTableDialog, bindCssClass, formatPainterClick, formatPainterDoubleClick, emojiPicker, maximizeMinimizeClick, 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, EmojiPickerAction, NodeSelection, MarkdownParser, LISTS_COMMAND, selectionCommand, LINK_COMMAND, CLEAR_COMMAND, MD_TABLE, INSERT_TEXT_COMMAND, ClearFormat, MDLists, MDFormats, MarkdownSelection, UndoRedoCommands, MDSelectionFormats, MDLink, MDTable, markdownFormatTags, markdownSelectionTags, markdownListsTags, htmlKeyConfig, markdownKeyConfig, pasteCleanupGroupingTags, listConversionFilters, selfClosingTags, KEY_DOWN, ACTION, FORMAT_TYPE, KEY_DOWN_HANDLER, LIST_TYPE, KEY_UP_HANDLER, KEY_UP, MODEL_CHANGED_PLUGIN, MODEL_CHANGED, MS_WORD_CLEANUP_PLUGIN, MS_WORD_CLEANUP, ON_BEGIN, SPACE_ACTION, FORMAT_PAINTER_ACTIONS, EMOJI_PICKER_ACTIONS };
 //# sourceMappingURL=ej2-richtexteditor.es5.js.map