@syncfusion/ej2-richtexteditor - npm Package Compare versions

Comparing version 17.2.28-beta to 17.2.34

CHANGELOG.md

@@ -7,2 +7,22 @@ # Changelog
 
+#### Bug Fixes
+
+- `#F145376` - The issue, "action complete event is not triggered when deleting the content with text and images" has been resolved.
+
+- `#237729` - The issue "table column width is shown as pixel instead of percentage while resizing" has been fixed.
+
+- `#237729` - Pickers mode throws script error when selecting the color in table's quick toolbar, that issue has been fixed.
+
+- `#237729` - Color picker value doesn't set as RGBA(alpha) value in content editor, that issue has been fixed.
+
+- `#240808` - The issue "opening a link in new window throws an error for auto generated link" has been fixed.
+
+- `#240024` - The issue, "spacing between words is removed when focus out the editor" has been resolved.
+
+- `#234519`, `#234586`, `#F138909` - The issues with table and its functionalities in IE11 has been resolved.
+
+## 17.2.28-beta (2019-06-27)
+
+### RichTextEditor
+
 #### New Features
@@ -19,3 +39,3 @@
 
-- #238872 - Issue with cursor position when enabled list with empty editor that issue has been resolved.
+- `#238872` - Issue with cursor position when enabled list with empty editor that issue has been resolved.
 
@@ -28,3 +48,3 @@ ## 17.1.49 (2019-05-29)
 
-- #235461 - Thrown the console error while rendering the RichTextEditor within a table element and pressing the tab key from edit area that issue has been resolved.
+- `#235461` - Thrown the console error while rendering the RichTextEditor within a table element and pressing the tab key from edit area that issue has been resolved.
 
@@ -37,7 +57,7 @@ ## 17.1.48 (2019-05-21)
 
-- #230976 - Opens a quick toolbar on right-click support has been provided.
+- `#230976` - Opens a quick toolbar on right-click support has been provided.
 
 #### Bug Fixes
 
-- #235120 - RichTextEditor's paste as plain text doesn't preserve line break that issue has been resolved.
+- `#235120` - RichTextEditor's paste as plain text doesn't preserve line break that issue has been resolved.
 
@@ -50,3 +70,3 @@ ## 17.1.43 (2019-04-30)
 
-- #234280 - RichTextEditor's toolbar is broken when using ES2015 target that issue has been resolved.
+- `#234280` - RichTextEditor's toolbar is broken when using ES2015 target that issue has been resolved.
 
@@ -69,6 +89,2 @@ ## 17.1.42 (2019-04-23)
 
-- #237729 - Pickers mode throws script error when selecting the color in table's quick toolbar, that issue has been fixed.
-
-- #237729 - Color picker value doesn't set as RGBA(alpha) value in content editor, that issue has been fixed.
-
 ## 17.1.32-beta (2019-03-13)
@@ -75,0 +91,0 @@

dist/global/index.d.ts

 /*!
 *  filename: index.d.ts
-*  version : 17.2.28-beta
+*  version : 17.2.34
 *  Copyright Syncfusion Inc. 2001 - 2019. All rights reserved.
@@ -5,0 +5,0 @@ *  Use of this code is subject to the terms of our license.

package.json

 {
   "_from": "@syncfusion/ej2-richtexteditor@*",
-  "_id": "@syncfusion/ej2-richtexteditor@17.1.38",
+  "_id": "@syncfusion/ej2-richtexteditor@17.2.28",
   "_inBundle": false,
-  "_integrity": "sha512-2Xe6Q2xOnj8uQBrZqvWrsHGB2hZ4wgxLTYQQ/7uc6KJmdGWSQcyDE5ZJeM+br0ag4MezfvTuYp4PDcgaEw0dnw==",
+  "_integrity": "sha512-wv8IaHZqQh8RV4AnjD0ytEHzwyx/ilctSCs0xlNhU1KAwqiC9oAAYf9Xe/QioAquKkZ3nP+UHSKeEH8wCPI4RA==",
   "_location": "/@syncfusion/ej2-richtexteditor",
@@ -29,4 +29,4 @@ "_phantomChildren": {},
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-17.1.38.tgz",
-  "_shasum": "7bf7af34affd420b3c33d206edeea681a4dba70a",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-17.2.28.tgz",
+  "_shasum": "35aa7d90c046a50084e5a9df825f1fbf99cff9fc",
   "_spec": "@syncfusion/ej2-richtexteditor@*",
@@ -42,6 +42,6 @@ "_where": "/jenkins/workspace/ation_hotfix_16.4.0.42_Vol4-CJVRBFC7Z7RSISPRJNEMNQSRMCB6XTG67IJD6R2DVNXFIKQEITTQ/packages/included",
   "dependencies": {
-    "@syncfusion/ej2-base": "~17.2.28-beta",
-    "@syncfusion/ej2-navigations": "~17.2.28-beta",
-    "@syncfusion/ej2-popups": "~17.2.28-beta",
-    "@syncfusion/ej2-splitbuttons": "~17.2.28-beta"
+    "@syncfusion/ej2-base": "~17.2.34",
+    "@syncfusion/ej2-navigations": "~17.2.34",
+    "@syncfusion/ej2-popups": "~17.2.34",
+    "@syncfusion/ej2-splitbuttons": "~17.2.34"
   },
@@ -71,4 +71,4 @@ "deprecated": false,
   },
-  "version": "17.2.28-beta",
+  "version": "17.2.34",
   "sideEffects": false
 }

src/common/config.js

@@ -72,3 +72,4 @@ /**
     'enter': '13',
-    'tab': '9'
+    'tab': '9',
+    'delete': '46'
 };
@@ -75,0 +76,0 @@ /**

src/common/util.js

@@ -14,4 +14,7 @@ /**
     if (editableElement.nodeName === 'BODY' && !isNullOrUndefined(selector)) {
-        top.window.document.querySelector(selector).contentWindow.focus();
+        var iframe = top.window.document.querySelector(selector);
+        if (!isNullOrUndefined(iframe)) {
+            iframe.contentWindow.focus();
+        }
     }
 }

src/editor-manager/plugin/alignments.js

@@ -50,4 +50,4 @@ import * as CONSTANT from './../base/constant';
         var startNode = range.startContainer.nodeType === Node.ELEMENT_NODE ? range.startContainer : range.startContainer.parentNode;
-        var tdNode = closest(startNode, 'td');
-        return [tdNode];
+        var cellNode = closest(startNode, 'td,th');
+        return [cellNode];
     };
@@ -54,0 +54,0 @@ Alignments.prototype.applyAlignment = function (e) {

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

@@ -205,5 +205,5 @@ import * as CONSTANT from './../base/constant';
     DOMNode.prototype.getPreviousNode = function (element) {
-        element = element.previousSibling;
+        element = element.previousElementSibling;
         for (; element && element.textContent === '\n'; null) {
-            element = element.previousSibling;
+            element = element.previousElementSibling;
         }
@@ -222,5 +222,3 @@ return element;
         var endTextNode;
-        if (start.textContent === '' && isNullOrUndefined(end) && action !== 'tab' &&
-            (!isNullOrUndefined(start.parentElement) && start.parentElement.tagName !== 'LI' &&
-                this.parent.textContent !== '')) {
+        if (start.textContent === '' && isNullOrUndefined(end) && action !== 'tab') {
             if (start.childNodes.length === 1 && start.childNodes[0].nodeName === 'BR') {
@@ -409,5 +407,6 @@ start.innerHTML = '&#65279;&#65279;<br>';
                     }
-                    else if (node && (node.tagName === 'BR' || node.nodeType === Node.TEXT_NODE ||
-                        node.classList.contains(markerClassName.startSelection) ||
-                        node.classList.contains(markerClassName.endSelection)) &&
+                    else if (node && (node.tagName === 'BR' || (node.nodeType === Node.TEXT_NODE &&
+                        node.textContent.trim() !== '') || (node.nodeType !== Node.TEXT_NODE &&
+                        (node.classList.contains(markerClassName.startSelection) ||
+                            node.classList.contains(markerClassName.endSelection)))) &&
                         CONSTANT.IGNORE_BLOCK_TAGS.indexOf(node.parentNode.tagName.toLocaleLowerCase()) >= 0) {
@@ -414,0 +413,0 @@ node = this.createTempNode(node);

src/editor-manager/plugin/inserthtml.js

 import { NodeSelection } from './../../selection/index';
 import { NodeCutter } from './nodecutter';
 import * as CONSTANT from './../base/constant';
-import { detach, Browser } from '@syncfusion/ej2-base';
+import { detach, Browser, isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';
 import { InsertMethods } from './insert-methods';
@@ -29,6 +29,6 @@ /**
         var closestParentNode = (node.nodeName.toLowerCase() === 'table') ? this.closestEle(nodes[0].parentNode, editNode) : nodes[0];
-        if ((!isCollapsed && !(closestParentNode.nodeType === Node.ELEMENT_NODE &&
+        if (editNode !== range.startContainer && ((!isCollapsed && !(closestParentNode.nodeType === Node.ELEMENT_NODE &&
             CONSTANT.TABLE_BLOCK_TAGS.indexOf(closestParentNode.tagName.toLocaleLowerCase()) !== -1))
             || (node.nodeName.toLowerCase() === 'table' && closestParentNode &&
-                CONSTANT.TABLE_BLOCK_TAGS.indexOf(closestParentNode.tagName.toLocaleLowerCase()) === -1)) {
+                CONSTANT.TABLE_BLOCK_TAGS.indexOf(closestParentNode.tagName.toLocaleLowerCase()) === -1))) {
             var preNode = nodeCutter.GetSpliceNode(range, closestParentNode);
@@ -50,2 +50,5 @@ var sibNode = preNode.previousSibling;
                 if (nodes[index].nodeType !== 3 && nodes[index].parentNode != null) {
+                    if (nodes[index].nodeName === 'IMG') {
+                        continue;
+                    }
                     nodes[index].parentNode.removeChild(nodes[index]);
@@ -113,3 +116,4 @@ }
             if (el.parentNode === editNode ||
-                CONSTANT.IGNORE_BLOCK_TAGS.indexOf(el.parentNode.tagName.toLocaleLowerCase()) !== -1) {
+                (!isNOU(el.parentNode.tagName) &&
+                    CONSTANT.IGNORE_BLOCK_TAGS.indexOf(el.parentNode.tagName.toLocaleLowerCase()) !== -1)) {
                 return el;
@@ -116,0 +120,0 @@ }

src/editor-manager/plugin/link.js

@@ -51,2 +51,3 @@ import { createElement, isNullOrUndefined, closest } from '@syncfusion/ej2-base';
             e.item.selection.setSelectionText(this.parent.currentDocument, anchorEle, anchorEle, 1, 1);
+            e.item.selection.restore();
         }
@@ -66,5 +67,6 @@ else {
             InsertHtml.Insert(this.parent.currentDocument, anchor, this.parent.editableElement);
-            if (e.event && e.event.type === 'keydown' && e.event.keyCode === 32) {
+            if (e.event && e.event.type === 'keydown' && (e.event.keyCode === 32
+                || e.event.keyCode === 13)) {
                 var startContainer = e.item.selection.range.startContainer;
-                startContainer.textContent = this.removeText(startContainer.textContent, e.item.url);
+                startContainer.textContent = this.removeText(startContainer.textContent, e.item.text);
             }
@@ -71,0 +73,0 @@ else {

src/editor-manager/plugin/lists.d.ts

@@ -29,2 +29,3 @@ import { EditorManager } from './../base/editor-manager';
     private applyLists;
+    private removeEmptyListElements;
     private isRevert;
@@ -31,0 +32,0 @@ private checkLists;

src/editor-manager/plugin/lists.js

@@ -307,2 +307,3 @@ import * as CONSTANT from './../base/constant';
             this.revertList(elements);
+            this.removeEmptyListElements();
         }
@@ -335,2 +336,10 @@ else {
     };
+    Lists.prototype.removeEmptyListElements = function () {
+        var listElem = this.parent.editableElement.querySelectorAll('ol, ul');
+        for (var i = 0; i < listElem.length; i++) {
+            if (listElem[i].textContent.trim() === '') {
+                detach(listElem[i]);
+            }
+        }
+    };
     Lists.prototype.isRevert = function (nodes, tagName) {
@@ -367,7 +376,7 @@ var isRevert = true;
             var node = liParents[c];
-            if (this.domNode.isList(node.previousSibling) &&
-                this.domNode.openTagString(node) === this.domNode.openTagString(node.previousSibling)) {
+            if (this.domNode.isList(node.previousElementSibling) &&
+                this.domNode.openTagString(node) === this.domNode.openTagString(node.previousElementSibling)) {
                 var contentNodes = this.domNode.contents(node);
                 for (var f = 0; f < contentNodes.length; f++) {
-                    node.previousSibling.appendChild(contentNodes[f]);
+                    node.previousElementSibling.appendChild(contentNodes[f]);
                 }
@@ -374,0 +383,0 @@ node.parentNode.removeChild(node);

src/editor-manager/plugin/nodecutter.js

 import { NodeSelection } from './../../selection/index';
+import { isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';
 import { InsertMethods } from './insert-methods';
@@ -29,13 +30,17 @@ /**
                 fragment = this.spliceEmptyNode(fragment, false);
-                if (fragment && fragment.textContent !== '') {
-                    if (node) {
-                        InsertMethods.AppendBefore(fragment, node);
+                if (fragment && fragment.childNodes.length > 0) {
+                    var isEmpty = (fragment.childNodes.length === 1 && fragment.childNodes[0].nodeName !== 'IMG'
+                        && isNOU(fragment.querySelector('img')) && fragment.textContent === '') ? true : false;
+                    if (!isEmpty) {
+                        if (node) {
+                            InsertMethods.AppendBefore(fragment, node);
+                        }
+                        else {
+                            parent_1.appendChild(fragment);
+                            var divNode = document.createElement('div');
+                            divNode.innerHTML = '';
+                            node = divNode.firstChild;
+                            parent_1.appendChild(node);
+                        }
                     }
-                    else {
-                        parent_1.appendChild(fragment);
-                        var divNode = document.createElement('div');
-                        divNode.innerHTML = '';
-                        node = divNode.firstChild;
-                        parent_1.appendChild(node);
-                    }
                 }
@@ -47,13 +52,17 @@ }
                 fragment = this.spliceEmptyNode(fragment, true);
-                if (fragment && fragment.textContent !== '') {
-                    if (node) {
-                        InsertMethods.AppendBefore(fragment, node, true);
+                if (fragment && fragment.childNodes.length > 0) {
+                    var isEmpty = (fragment.childNodes.length === 1 && fragment.childNodes[0].nodeName !== 'IMG'
+                        && isNOU(fragment.querySelector('img')) && fragment.textContent === '') ? true : false;
+                    if (!isEmpty) {
+                        if (node) {
+                            InsertMethods.AppendBefore(fragment, node, true);
+                        }
+                        else {
+                            parent_1.appendChild(fragment);
+                            var divNode = document.createElement('div');
+                            divNode.innerHTML = '';
+                            parent_1.insertBefore(divNode.firstChild, parent_1.firstChild);
+                            node = parent_1.firstChild;
+                        }
                     }
-                    else {
-                        parent_1.appendChild(fragment);
-                        var divNode = document.createElement('div');
-                        divNode.innerHTML = '';
-                        parent_1.insertBefore(divNode.firstChild, parent_1.firstChild);
-                        node = parent_1.firstChild;
-                    }
                 }
@@ -60,0 +69,0 @@ }

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

@@ -9,3 +9,3 @@ /**
 import { isIDevice, setEditFrameFocus } from '../../common/util';
-import { isNullOrUndefined } from '@syncfusion/ej2-base';
+import { isNullOrUndefined, Browser } from '@syncfusion/ej2-base';
 var SelectionCommands = /** @class */ (function () {
@@ -34,3 +34,3 @@ function SelectionCommands() {
                 else if (range.startContainer.nodeName.toLowerCase() !== 'td') {
-                    var cursorNode = this.insertCursorNode(domSelection, range, isFormatted, nodeCutter, format, value, endNode);
+                    var cursorNode = this.insertCursorNode(docElement, domSelection, range, isFormatted, nodeCutter, format, value, endNode);
                     domSelection.endContainer = domSelection.startContainer = domSelection.getNodeArray(cursorNode, true);
@@ -50,3 +50,3 @@ domSelection.endOffset = domSelection.startOffset = 1;
                 else {
-                    nodes[index] = this.insertFormat(nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value);
+                    nodes[index] = this.insertFormat(docElement, nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value);
                 }
@@ -61,3 +61,3 @@ domSelection = this.applySelection(nodes, domSelection, nodeCutter, index, isCollapsed);
     };
-    SelectionCommands.insertCursorNode = function (domSelection, range, isFormatted, nodeCutter, format, value, endNode) {
+    SelectionCommands.insertCursorNode = function (docElement, domSelection, range, isFormatted, nodeCutter, format, value, endNode) {
         var cursorNodes = domSelection.getNodeCollection(range);
@@ -71,3 +71,3 @@ var cursorFormat = (cursorNodes.length > 0) ? isFormatted.getFormattedNode(cursorNodes[0], format, endNode) : null;
         else {
-            cursorNode = this.getInsertNode(range, format, value).firstChild;
+            cursorNode = this.getInsertNode(docElement, range, format, value).firstChild;
         }
@@ -124,6 +124,18 @@ return cursorNode;
             }
+            if (format === 'fontsize') {
+                var liElement = nodes[index].parentElement;
+                var parentElement = nodes[index].parentElement;
+                while (!isNullOrUndefined(parentElement) && parentElement.tagName.toLowerCase() !== 'li') {
+                    parentElement = parentElement.parentElement;
+                    liElement = parentElement;
+                }
+                if (!isNullOrUndefined(liElement) && liElement.tagName.toLowerCase() === 'li' &&
+                    liElement.textContent === nodes[index].textContent) {
+                    liElement.style.fontSize = value;
+                }
+            }
         }
         return nodes[index];
     };
-    SelectionCommands.insertFormat = function (nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value) {
+    SelectionCommands.insertFormat = function (docElement, nodes, index, formatNode, isCursor, isFormat, isFontStyle, range, nodeCutter, format, value) {
         if (!isCursor) {
@@ -150,5 +162,3 @@ if ((formatNode === null && isFormat) || isFontStyle) {
                         }
-                        else {
-                            nodes[index] = this.applyStyles(nodes, index, element);
-                        }
+                        nodes[index] = this.applyStyles(nodes, index, element);
                     }
@@ -166,3 +176,3 @@ else {
             if (format !== 'uppercase' && format !== 'lowercase') {
-                var element = this.getInsertNode(range, format, value);
+                var element = this.getInsertNode(docElement, range, format, value);
                 nodes[index] = element.firstChild;
@@ -183,6 +193,13 @@ nodeCutter.position = 1;
     };
-    SelectionCommands.getInsertNode = function (range, format, value) {
+    SelectionCommands.getInsertNode = function (docElement, range, format, value) {
         var element = this.GetFormatNode(format, value);
         element.innerHTML = '';
-        range.insertNode(element);
+        if (Browser.isIE) {
+            var frag = docElement.createDocumentFragment();
+            frag.appendChild(element);
+            range.insertNode(frag);
+        }
+        else {
+            range.insertNode(element);
+        }
         return element;
@@ -189,0 +206,0 @@ };

src/editor-manager/plugin/table.js

@@ -191,3 +191,8 @@ import { createElement, closest, detach, Browser } from '@syncfusion/ej2-base';
         else {
-            parentTable.deleteRow(selectedRowIndex);
+            if (selectedCell.tagName === 'TH') {
+                detach(parentTable.querySelector('thead'));
+            }
+            else {
+                parentTable.deleteRow(selectedRowIndex);
+            }
             e.item.selection.setSelectionText(this.parent.currentDocument, parentTable.querySelector('td'), parentTable.querySelector('td'), 0, 0);
@@ -225,7 +230,13 @@ parentTable.querySelector('td, th').classList.add('e-cell-select');
     TableCommand.prototype.tableHeader = function (e) {
+        var headerExit = false;
         var selectedCell = e.item.selection.range.startContainer;
         selectedCell = (selectedCell.nodeType === 3) ? selectedCell.parentNode : selectedCell;
         var table = closest(selectedCell.parentElement, 'table');
-        if (table && 0 === table.querySelectorAll('thead').length) {
-            var cellCount = table.querySelector('tr').querySelectorAll('td').length;
+        [].slice.call(table.childNodes).forEach(function (el) {
+            if (el.nodeName === 'THEAD') {
+                headerExit = true;
+            }
+        });
+        if (table && !headerExit) {
+            var cellCount = table.querySelector('tr').childElementCount;
             var header = table.createTHead();
@@ -232,0 +243,0 @@ var row = header.insertRow(0);

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

@@ -33,4 +33,5 @@ import { IsFormatted } from './isformatted';
         var nodes = documentNode ? [documentNode] : nodeSelection.getNodeCollection(nodeSelection.getRange(docElement));
+        var nodesLength = nodes.length;
         for (var index = 0; index < nodes.length; index++) {
-            if (nodes[index].nodeType !== 3) {
+            if (nodes[index].nodeType !== 3 || (nodesLength > 1 && nodes[index].nodeType === 3 && nodes[index].textContent.trim() === '')) {
                 nodes.splice(index, 1);
@@ -37,0 +38,0 @@ index--;

src/rich-text-editor/actions/full-screen.js

@@ -15,3 +15,3 @@ import { Browser, isNullOrUndefined } from '@syncfusion/ej2-base';
     FullScreen.prototype.showFullScreen = function (event) {
-        if (this.parent.toolbarSettings.enable === true) {
+        if (this.parent.toolbarSettings.enable === true && this.parent.editorMode !== 'Markdown') {
             this.parent.quickToolbarModule.hideQuickToolbars();
@@ -47,3 +47,3 @@ }
     FullScreen.prototype.hideFullScreen = function (event) {
-        if (this.parent.toolbarSettings.enable === true) {
+        if (this.parent.toolbarSettings.enable === true && this.parent.editorMode !== 'Markdown') {
             this.parent.quickToolbarModule.hideQuickToolbars();
@@ -50,0 +50,0 @@ }

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

@@ -163,3 +163,3 @@ import * as events from '../base/constant';
         var selectNodeEle = this.nodeSelectionObj.getParentNodeCollection(range);
-        var text = range.startContainer.textContent;
+        var text = range.startContainer.textContent.substr(0, range.endOffset);
         var splitText = text.split(' ');
@@ -172,9 +172,10 @@ var urlText = splitText[splitText.length - 1];
             var selection = this.nodeSelectionObj.save(range, this.parent.contentModule.getDocument());
+            var url = urlText.indexOf('http') > -1 ? urlText : 'http://' + urlText;
             var selectParent = this.parent.formatter.editorManager.nodeSelection.getParentNodeCollection(range);
             var value = {
-                url: urlText,
+                url: url,
                 selection: selection, selectParent: selectParent,
-                text: '',
+                text: urlText,
                 title: '',
-                target: ''
+                target: '_blank'
             };
@@ -181,0 +182,0 @@ this.parent.formatter.process(this.parent, {

src/rich-text-editor/actions/markdown-toolbar-status.d.ts

@@ -18,2 +18,6 @@ import { MarkdownSelection } from '../../markdown-parser/plugin/markdown-selection';
     private currentFormat;
+    private codeFormat;
+    private getSelectedText;
+    private isCode;
+    private multiCharRegx;
 }
@@ -20,0 +24,0 @@ export interface ITextAreaElement extends HTMLTextAreaElement {

src/rich-text-editor/actions/markdown-toolbar-status.js

@@ -54,2 +54,5 @@ import { MarkdownSelection } from '../../markdown-parser/plugin/markdown-selection';
         };
+        if (this.parent.formatter.editorManager.mdSelectionFormats.isAppliedCommand('InlineCode')) {
+            this.toolbarStatus.formats = 'pre';
+        }
         this.parent.notify(events.toolbarUpdated, this.toolbarStatus);
@@ -89,7 +92,3 @@ };
             else if (keys[i] === 'pre') {
-                var parentLines = this.selection.getAllParents(this.element.value);
-                var firstPrevText = parentLines[lines[0].line - 1];
-                var lastNextText = parentLines[lines.length + 1];
-                if (this.selection.isStartWith(firstPrevText, this.parent.formatter.formatTags[keys[i]].split('\n')[0]) &&
-                    this.selection.isStartWith(lastNextText, this.parent.formatter.formatTags[keys[i]].split('\n')[0])) {
+                if (this.codeFormat()) {
                     format = keys[i];
@@ -102,4 +101,39 @@ break;
     };
+    MarkdownToolbarStatus.prototype.codeFormat = function () {
+        var isFormat = false;
+        var textArea = this.parent.inputElement;
+        var start = textArea.selectionStart;
+        var splitAt = function (index) { return function (x) { return [x.slice(0, index), x.slice(index)]; }; };
+        var splitText = splitAt(start)(textArea.value);
+        var cmdPre = this.parent.formatter.formatTags.pre;
+        var selectedText = this.getSelectedText(textArea);
+        if (selectedText !== '' && selectedText === selectedText.toLocaleUpperCase()) {
+            return true;
+        }
+        else if (selectedText === '') {
+            var beforeText = textArea.value.substr(splitText[0].length - 1, 1);
+            var afterText = splitText[1].substr(0, 1);
+            if ((beforeText !== '' && afterText !== '' && beforeText.match(/[a-z]/i)) &&
+                beforeText === beforeText.toLocaleUpperCase() && afterText === afterText.toLocaleUpperCase()) {
+                return true;
+            }
+        }
+        if ((this.isCode(splitText[0], cmdPre) && this.isCode(splitText[1], cmdPre)) &&
+            (splitText[0].match(this.multiCharRegx(cmdPre)).length % 2 === 1 &&
+                splitText[1].match(this.multiCharRegx(cmdPre)).length % 2 === 1)) {
+            isFormat = true;
+        }
+        return isFormat;
+    };
+    MarkdownToolbarStatus.prototype.getSelectedText = function (textarea) {
+        return textarea.value.substring(textarea.selectionStart, textarea.selectionEnd);
+    };
+    MarkdownToolbarStatus.prototype.isCode = function (text, cmd) {
+        return text.search('\\' + cmd + '') !== -1;
+    };
+    MarkdownToolbarStatus.prototype.multiCharRegx = function (cmd) {
+        return new RegExp('(\\' + cmd + ')', 'g');
+    };
     return MarkdownToolbarStatus;
 }());
 export { MarkdownToolbarStatus };

src/rich-text-editor/actions/paste-clean-up.js

@@ -139,8 +139,11 @@ import * as events from '../base/constant';
         var keepRadioButton = new RadioButton({ label: 'Keep', name: 'pasteOption', checked: true });
+        keepRadioButton.isStringTemplate = true;
         var keepFormatElement = this.parent.element.querySelector('#keepFormating');
         keepRadioButton.appendTo(keepFormatElement);
         var cleanRadioButton = new RadioButton({ label: 'Clean', name: 'pasteOption' });
+        cleanRadioButton.isStringTemplate = true;
         var cleanFormatElement = this.parent.element.querySelector('#cleanFormat');
         cleanRadioButton.appendTo(cleanFormatElement);
         var plainTextRadioButton = new RadioButton({ label: 'Plain Text', name: 'pasteOption' });
+        plainTextRadioButton.isStringTemplate = true;
         var plainTextElement = this.parent.element.querySelector('#plainTextFormat');
@@ -147,0 +150,0 @@ plainTextRadioButton.appendTo(plainTextElement);

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

@@ -117,12 +117,12 @@ import { select, isNullOrUndefined, Browser, addClass, removeClass, EventHandler, closest } from '@syncfusion/ej2-base';
     QuickToolbar.prototype.hideQuickToolbars = function () {
-        if (this.linkQTBar && !hasClass(this.linkQTBar.element, 'e-popup-close')) {
+        if (this.linkQTBar && !hasClass(this.linkQTBar.element, 'e-popup-close') && document.body.contains(this.linkQTBar.element)) {
             this.linkQTBar.hidePopup();
         }
-        if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close')) {
+        if (this.textQTBar && !hasClass(this.textQTBar.element, 'e-popup-close') && document.body.contains(this.textQTBar.element)) {
             this.textQTBar.hidePopup();
         }
-        if (this.imageQTBar && !hasClass(this.imageQTBar.element, 'e-popup-close')) {
+        if (this.imageQTBar && !hasClass(this.imageQTBar.element, 'e-popup-close') && document.body.contains(this.imageQTBar.element)) {
             this.imageQTBar.hidePopup();
         }
-        if (this.tableQTBar && !hasClass(this.tableQTBar.element, 'e-popup-close')) {
+        if (this.tableQTBar && !hasClass(this.tableQTBar.element, 'e-popup-close') && document.body.contains(this.tableQTBar.element)) {
             this.tableQTBar.hidePopup();
@@ -129,0 +129,0 @@ }

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

@@ -131,3 +131,6 @@ import { addClass, Browser, EventHandler, detach, removeClass, select, selectAll, KeyboardEvents } from '@syncfusion/ej2-base';
         var floatOffset = this.parent.floatingToolbarOffset;
-        if (e && e.target !== document) {
+        if (e && this.parent.iframeSettings.enable && this.parent.inputElement.ownerDocument === e.target) {
+            scrollParent = e.target.body;
+        }
+        else if (e && e.target !== document) {
             scrollParent = e.target;
@@ -234,2 +237,12 @@ }
         }
+        var divEle = this.parent.element.querySelector('.e-rte-srctextarea');
+        var iframeEle = this.parent.element.querySelector('.e-source-content');
+        if ((!this.parent.iframeSettings.enable && (!isNOU(divEle) && divEle.style.display === 'block')) ||
+            (this.parent.iframeSettings.enable && (!isNOU(iframeEle) && iframeEle.style.display === 'block'))) {
+            this.parent.notify(events.updateToolbarItem, {
+                targetItem: 'SourceCode', updateItem: 'Preview',
+                baseToolbar: this.parent.getBaseToolbarObject()
+            });
+            this.parent.disableToolbarItem(this.parent.toolbarSettings.items);
+        }
     };
@@ -236,0 +249,0 @@ Toolbar.prototype.addFixedTBarClass = function () {

src/rich-text-editor/base/enum.d.ts

@@ -10,3 +10,3 @@ /**
     Content = 1,
-    /**  Defines RenderType as Content */
+    /**  Defines RenderType as Popup */
     Popup = 2,
@@ -19,11 +19,7 @@ /**  Defines RenderType as LinkToolbar */
     ImageToolbar = 5,
-    /**  Defines RenderType as ImageToolbar */
+    /**  Defines RenderType as InlineToolbar */
     InlineToolbar = 6,
+    /**  Defines RenderType as TableToolbar */
     TableToolbar = 7
 }
-export declare type Action = 
-/**  Defines current Action as Refresh */
-'refresh' | 
-/** Defines current Action as Print */
-'print' | 'Undo' | 'Redo';
 export declare type ActionOnScroll = 'hide' | 'none';
@@ -30,0 +26,0 @@ export declare enum ToolbarType {

src/rich-text-editor/base/enum.js

@@ -11,3 +11,3 @@ /**
     RenderType[RenderType["Content"] = 1] = "Content";
-    /**  Defines RenderType as Content */
+    /**  Defines RenderType as Popup */
     RenderType[RenderType["Popup"] = 2] = "Popup";
@@ -20,4 +20,5 @@ /**  Defines RenderType as LinkToolbar */
     RenderType[RenderType["ImageToolbar"] = 5] = "ImageToolbar";
-    /**  Defines RenderType as ImageToolbar */
+    /**  Defines RenderType as InlineToolbar */
     RenderType[RenderType["InlineToolbar"] = 6] = "InlineToolbar";
+    /**  Defines RenderType as TableToolbar */
     RenderType[RenderType["TableToolbar"] = 7] = "TableToolbar";
@@ -24,0 +25,0 @@ })(RenderType || (RenderType = {}));

src/rich-text-editor/base/interface.d.ts

 import { Component, Observer, L10n, KeyboardEventArgs } from '@syncfusion/ej2-base';
 import { ItemModel, OverflowMode } from '@syncfusion/ej2-navigations';
 import { ItemModel as DropDownItemModel, DropDownButton } from '@syncfusion/ej2-splitbuttons';
-import { Action, ToolbarType, RenderType } from './enum';
+import { ToolbarType, RenderType } from './enum';
 import { Toolbar } from '../actions/toolbar';
@@ -152,3 +152,3 @@ import { UndoRedoManager } from '../../editor-manager/plugin/undo';
     cancel?: boolean;
-    requestType?: Action;
+    requestType?: string;
     enable?: boolean;
@@ -214,3 +214,3 @@ properties?: Object;
     cancel?: boolean;
-    requestType?: Action;
+    requestType?: string;
     enable?: boolean;
@@ -276,3 +276,3 @@ properties?: Object;
     cancel?: boolean;
-    requestType?: Action;
+    requestType?: string;
     enable?: boolean;
@@ -350,3 +350,3 @@ properties?: Object;
     /** Defines the current action. */
-    requestType?: Action;
+    requestType?: string;
     /** Defines the event name. */
@@ -365,3 +365,3 @@ name?: string;
     /** Defines the current action. */
-    requestType?: Action;
+    requestType?: string;
     /** Cancel the print action */
@@ -368,0 +368,0 @@ cancel?: boolean;

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

@@ -406,2 +406,3 @@ import { Component, ModuleDeclaration, EventHandler, Complex, Browser, EmitType, addClass, select, detach } from '@syncfusion/ej2-base';import { Property, NotifyPropertyChanges, INotifyPropertyChanged, formatUnit, L10n, closest } from '@syncfusion/ej2-base';import { setStyleAttribute, Event, removeClass, print as printWindow, attributes } from '@syncfusion/ej2-base';import { isNullOrUndefined as isNOU, compile, append, extend, debounce } from '@syncfusion/ej2-base';import { Touch as EJ2Touch, TapEventArgs } from '@syncfusion/ej2-base';import { getScrollableParent, BeforeOpenEventArgs } from '@syncfusion/ej2-popups';import * as events from '../base/constant';import * as classes from '../base/classes';import { Render } from '../renderer/render';import { ViewSource } from '../renderer/view-source';import { IRenderer, IFormatter, PrintEventArgs, ActionCompleteEventArgs, ActionBeginEventArgs } from './interface';import { BeforeQuickToolbarOpenArgs } from './interface';import { IExecutionGroup, executeGroup, CommandName, ResizeArgs } from './interface';import { ILinkCommandsArgs, IImageCommandsArgs, BeforeSanitizeHtmlArgs } from './interface';import { ServiceLocator } from '../services/service-locator';import { RendererFactory } from '../services/renderer-factory';import { RenderType, ToolbarType } from './enum';import { EditorMode } from './../../common/types';import { Toolbar } from '../actions/toolbar';import { ExecCommandCallBack } from '../actions/execute-command-callback';import { KeyboardEvents, KeyboardEventArgs } from '../actions/keyboard';import { FontFamilyModel, FontSizeModel, FontColorModel, FormatModel, BackgroundColorModel } from '../models/models';import { ToolbarSettingsModel, IFrameSettingsModel, ImageSettingsModel, TableSettingsModel } from '../models/models';import { QuickToolbarSettingsModel, InlineModeModel, PasteCleanupSettingsModel } from '../models/models';import { ToolbarSettings, ImageSettings, QuickToolbarSettings, FontFamily, FontSize, Format } from '../models/toolbar-settings';import { TableSettings, PasteCleanupSettings } from '../models/toolbar-settings';import { FontColor, BackgroundColor } from '../models/toolbar-settings';import { IFrameSettings } from '../models/iframe-settings';import { InlineMode } from '../models/inline-mode';import { Link } from '../renderer/link-module';import { Image } from '../renderer/image-module';import { Table } from '../renderer/table-module';import { Count } from '../actions/count';import { HtmlEditor } from '../actions/html-editor';import { MarkdownEditor } from '../actions/markdown-editor';import { defaultLocale } from '../models/default-locale';import { setAttributes } from '../actions/html-attributes';import { BaseToolbar } from '../actions/base-toolbar';import { QuickToolbar } from '../actions/quick-toolbar';import { FullScreen } from '../actions/full-screen';import { PasteCleanup } from '../actions/paste-clean-up';import * as CONSTANT from '../../common/constant';import { IHtmlKeyboardEvent } from '../../editor-manager/base/interface';import { dispatchEvent, getEditValue, isIDevice, decode, isEditableValueEmpty } from '../base/util';import { DialogRenderer } from '../renderer/dialog-renderer';
      * @blazorProperty 'OnDialogOpen'
+     * @blazorType Syncfusion.EJ2.Blazor.Popups.BeforeOpenEventArgs
      */
@@ -477,3 +478,2 @@
      * @event
-     * @blazorProperty 'OnBlur'
      */
@@ -492,3 +492,2 @@ blur?: EmitType<Object>;
      * @event
-     * @blazorProperty 'OnFocus'
      */
@@ -495,0 +494,0 @@ focus?: EmitType<Object>;

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

@@ -55,2 +55,3 @@ import { Component, ModuleDeclaration, EmitType } from '@syncfusion/ej2-base';
     private touchModule;
+    private defaultResetValue;
     /**
@@ -496,2 +497,3 @@ * @hidden
      * @blazorProperty 'OnDialogOpen'
+     * @blazorType Syncfusion.EJ2.Blazor.Popups.BeforeOpenEventArgs
      */
@@ -555,3 +557,2 @@ beforeDialogOpen: EmitType<BeforeOpenEventArgs>;
      * @event
-     * @blazorProperty 'OnBlur'
      */
@@ -568,3 +569,2 @@ blur: EmitType<Object>;
      * @event
-     * @blazorProperty 'OnFocus'
      */
@@ -694,4 +694,13 @@ focus: EmitType<Object>;
     ensureModuleInjected(module: Function): boolean;
+    /**
+     * @hidden
+     */
     onCopy(): void;
+    /**
+     * @hidden
+     */
     onCut(): void;
+    /**
+     * @hidden
+     */
     onPaste(e?: KeyboardEvent | ClipboardEvent): void;
@@ -792,2 +801,3 @@ /**
     private createStyleElement;
+    private isBlazor;
     private setValue;
@@ -794,0 +804,0 @@ setContentHeight(target?: string, isExpand?: boolean): void;

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

@@ -273,7 +273,8 @@ /**
     var tempNode = document.createElement('div');
-    tempNode.innerHTML = value.replace(/>\s+</g, '><');
+    tempNode.innerHTML = value;
     var childNodes = tempNode.childNodes;
     if (childNodes.length > 0) {
         [].slice.call(childNodes).forEach(function (childNode) {
-            if (childNode.nodeType === Node.TEXT_NODE && childNode.parentNode === tempNode) {
+            if (childNode.nodeType === Node.TEXT_NODE && childNode.parentNode === tempNode
+                && childNode.textContent.trim() !== '') {
                 var defaultTag = document.createElement('p');
@@ -280,0 +281,0 @@ var parentNode = childNode.parentNode;

src/rich-text-editor/renderer/dialog-renderer.js

@@ -12,2 +12,3 @@ import { Dialog } from '@syncfusion/ej2-popups';
     DialogRenderer.prototype.render = function (e) {
+        var dlgObj;
         if (isNOU(e.beforeOpen)) {
@@ -22,3 +23,5 @@ e.beforeOpen = this.beforeOpen.bind(this);
         }
-        return new Dialog(e);
+        dlgObj = new Dialog(e);
+        dlgObj.isStringTemplate = true;
+        return dlgObj;
     };
@@ -25,0 +28,0 @@ DialogRenderer.prototype.beforeOpen = function (args) {

src/rich-text-editor/renderer/link-module.js

@@ -215,2 +215,3 @@ import { EventHandler, detach, isNullOrUndefined, select } from '@syncfusion/ej2-base';
         this.checkBoxObj = new CheckBox({ label: linkOpenLabel, checked: true, enableRtl: this.parent.enableRtl });
+        this.checkBoxObj.isStringTemplate = true;
         this.checkBoxObj.createElement = this.parent.createElement;
@@ -296,3 +297,3 @@ this.checkBoxObj.appendTo(linkTarget);
             linkText = (linkText === '') ? linkUrl : linkText;
-            linkUrl = 'http://' + linkUrl;
+            linkUrl = linkUrl.indexOf('http') > -1 ? linkUrl : 'http://' + linkUrl;
         }
@@ -359,3 +360,3 @@ else {
         else {
-            this.contentModule.getEditPanel().focus();
+            this.parent.contentModule.getEditPanel().focus();
         }
@@ -362,0 +363,0 @@ this.hideLinkQuickToolbar();

src/rich-text-editor/renderer/table-module.d.ts

@@ -65,2 +65,3 @@ import { IRichTextEditor } from '../base/interface';
     private resizing;
+    private convertPixelToPercentage;
     private cancelResizeAction;
@@ -67,0 +68,0 @@ private resizeEnd;

src/rich-text-editor/renderer/table-module.js

@@ -1,2 +0,2 @@
-import { detach, closest, Browser } from '@syncfusion/ej2-base';
+import { detach, closest, Browser, isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';
 import { isNullOrUndefined, EventHandler, addClass, removeClass } from '@syncfusion/ej2-base';
@@ -9,3 +9,3 @@ import { Popup } from '@syncfusion/ej2-popups';
 import * as classes from '../base/classes';
-import { dispatchEvent, parseHtml } from '../base/util';
+import { dispatchEvent, parseHtml, hasClass } from '../base/util';
 /**
@@ -174,4 +174,4 @@ * `Table` module is used to handle table actions.
         var tdEle = (args.selection.range.startContainer.nodeName === 'TD' ||
-            args.selection.range.startContainer.nodeName === 'TH') ?
-            args.selection.range.startContainer : args.selection.range.startContainer.parentElement;
+            args.selection.range.startContainer.nodeName === 'TH') ? args.selection.range.startContainer :
+            args.selection.range.startContainer.parentNode;
         if (tdEle.nodeName !== 'TD' && tdEle.nodeName !== 'TH') {
@@ -387,3 +387,10 @@ return;
         var proxy = (selectionObj.self) ? selectionObj.self : this;
-        if (proxy.parent.editorMode === 'HTML' && isNullOrUndefined(closest(selectionObj.selection.range.startContainer.parentNode, '#' + proxy.contentModule.getPanel().id))) {
+        var startContainer = selectionObj.selection.range.startContainer;
+        if (startContainer.nodeName === 'P' && startContainer.textContent.trim() === '' && !(startContainer.childNodes.length > 0)) {
+            startContainer.innerHTML = '<br />';
+        }
+        var parentNode = startContainer.parentNode;
+        if (proxy.parent.editorMode === 'HTML' &&
+            ((proxy.parent.iframeSettings.enable && !hasClass(parentNode.ownerDocument.querySelector('body'), 'e-lib')) ||
+                (!proxy.parent.iframeSettings.enable && isNOU(closest(parentNode, '#' + proxy.contentModule.getPanel().id))))) {
             proxy.contentModule.getEditPanel().focus();
@@ -642,14 +649,18 @@ var range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.contentModule.getDocument());
                 var tableHeight = parseInt(getComputedStyle(_this.curTable).height, 10);
+                var paddingSize = +getComputedStyle(_this.contentModule.getEditPanel()).paddingRight.match(/\d/g).join('');
+                var rteWidth = _this.contentModule.getEditPanel().offsetWidth - paddingSize * 2;
                 if (_this.resizeBtnStat.column) {
                     var cellColl = _this.curTable.rows[0].cells;
-                    var width = parseFloat(getComputedStyle(_this.columnEle).width);
+                    var width = parseFloat(_this.columnEle.offsetWidth.toLocaleString());
                     var actualwid = width - mouseX;
-                    var totalwid = parseFloat(getComputedStyle(_this.columnEle).width) +
-                        parseFloat(getComputedStyle(cellColl[_this.colIndex - 1]).width);
+                    var totalwid = parseFloat(_this.columnEle.offsetWidth.toLocaleString()) +
+                        parseFloat(cellColl[_this.colIndex - 1].offsetWidth.toLocaleString());
                     for (var i = 0; i < _this.curTable.rows.length; i++) {
                         if ((totalwid - actualwid) > 20 && actualwid > 20) {
+                            var leftColumnWidth = totalwid - actualwid;
+                            var rightColWidth = actualwid;
                             _this.curTable.rows[i].cells[_this.colIndex - 1].style.width =
-                                totalwid - actualwid + 'px';
+                                _this.convertPixelToPercentage(leftColumnWidth, tableWidth) + '%';
                             _this.curTable.rows[i].cells[_this.colIndex].style.width =
-                                actualwid + 'px';
+                                _this.convertPixelToPercentage(rightColWidth, tableWidth) + '%';
                         }
@@ -674,3 +685,5 @@ }
                     }
-                    _this.curTable.style.width = tableWidth + mouseX + 'px';
+                    var widthType = _this.curTable.style.width.indexOf('%') > -1;
+                    _this.curTable.style.width = widthType ? _this.convertPixelToPercentage(tableWidth + mouseX, rteWidth) + '%'
+                        : tableWidth + mouseX + 'px';
                     _this.curTable.style.height = tableHeight + mouseY + 'px';
@@ -684,2 +697,5 @@ tableReBox.classList.add('e-rbox-select');
     };
+    Table.prototype.convertPixelToPercentage = function (value, offsetValue) {
+        return (value / offsetValue) * 100;
+    };
     Table.prototype.cancelResizeAction = function () {
@@ -779,2 +795,3 @@ EventHandler.remove(this.contentModule.getDocument(), Browser.touchMoveEvent, this.resizing);
         });
+        button.isStringTemplate = true;
         button.appendTo(btnEle);
@@ -826,2 +843,5 @@ EventHandler.add(btnEle, 'click', this.insertTableDialog, { self: this, args: args.args, selection: args.selection });
             removeClass(this.parent.element.querySelectorAll('table td'), classes.CLS_TABLE_SEL);
+            if (!Browser.isIE) {
+                this.hideTableQuickToolbar();
+            }
         }
@@ -915,2 +935,3 @@ if (target && target.classList && !target.classList.contains(classes.CLS_TB_COL_RES) &&
         });
+        this.columnTextBox.isStringTemplate = true;
         this.columnTextBox.appendTo(tableWrap.querySelector('#tableColumn'));
@@ -926,2 +947,3 @@ this.rowTextBox = new NumericTextBox({
         });
+        this.rowTextBox.isStringTemplate = true;
         this.rowTextBox.appendTo(tableWrap.querySelector('#tableRow'));
@@ -1015,2 +1037,3 @@ return tableWrap;
         });
+        widthNum.isStringTemplate = true;
         widthNum.appendTo(tableWrap.querySelector('#tableWidth'));
@@ -1025,2 +1048,3 @@ var padding = new NumericTextBox({
         });
+        padding.isStringTemplate = true;
         padding.appendTo(tableWrap.querySelector('#cellPadding'));
@@ -1035,2 +1059,3 @@ var spacing = new NumericTextBox({
         });
+        spacing.isStringTemplate = true;
         spacing.appendTo(tableWrap.querySelector('#cellSpacing'));
@@ -1037,0 +1062,0 @@ return tableWrap;

src/rich-text-editor/renderer/toolbar-renderer.d.ts

@@ -35,2 +35,3 @@ import { DropDownButton } from '@syncfusion/ej2-splitbuttons';
     renderColorPickerDropDown(args: IColorPickerModel, item: string, colorPicker: ColorPicker): DropDownButton;
+    private pickerRefresh;
     private popupModal;
@@ -37,0 +38,0 @@ private setColorPickerContentWidth;

src/rich-text-editor/renderer/toolbar-renderer.js

@@ -10,2 +10,3 @@ import { addClass, Browser, removeClass, EventHandler, formatUnit, isNullOrUndefined } from '@syncfusion/ej2-base';
 import { ColorPicker } from '@syncfusion/ej2-inputs';
+import { hasClass } from '../base/util';
 /**
@@ -80,2 +81,3 @@ * `Toolbar renderer` module is used to render toolbar in RichTextEditor.
         });
+        args.rteToolbarObj.toolbarObj.isStringTemplate = true;
         args.rteToolbarObj.toolbarObj.createElement = this.parent.createElement;
@@ -125,2 +127,3 @@ args.rteToolbarObj.toolbarObj.appendTo(args.target);
         });
+        dropDown.isStringTemplate = true;
         dropDown.createElement = proxy.parent.createElement;
@@ -187,6 +190,4 @@ dropDown.appendTo(args.element);
         var dropDown = new DropDownButton({
-            target: colorPicker.element.parentElement,
-            cssClass: css,
-            enablePersistence: this.parent.enablePersistence,
-            enableRtl: this.parent.enableRtl,
+            target: colorPicker.element.parentElement, cssClass: css,
+            enablePersistence: this.parent.enablePersistence, enableRtl: this.parent.enableRtl,
             beforeOpen: function (dropDownArgs) {
@@ -206,5 +207,9 @@ if (proxy.parent.readonly || !proxy.parent.enabled) {
                         element.querySelector('.' + CLS_RTE_ELEMENTS).style.borderBottomColor;
+                    proxy.parent.notify(events.selectionRestore, {});
                     range = proxy.parent.formatter.editorManager.nodeSelection.getRange(proxy.parent.contentModule.getDocument());
+                    var parentNode = range.startContainer.parentNode;
                     if ((range.startContainer.nodeName === 'TD' || range.startContainer.nodeName === 'TH' ||
-                        closest(range.startContainer.parentNode, 'td,th')) && range.collapsed) {
+                        (closest(range.startContainer.parentNode, 'td,th')) ||
+                        (proxy.parent.iframeSettings.enable && !hasClass(parentNode.ownerDocument.querySelector('body'), 'e-lib')))
+                        && range.collapsed) {
                         proxy.parent.notify(events.tableColorPickerChanged, { item: { command: args.command, subCommand: args.subCommand,
@@ -249,2 +254,3 @@ value: colorpickerValue }
                 }
+                _this.pickerRefresh(dropDownArgs);
             },
@@ -283,2 +289,3 @@ beforeClose: function (dropDownArgs) {
         });
+        dropDown.isStringTemplate = true;
         dropDown.createElement = proxy.parent.createElement;
@@ -294,2 +301,10 @@ dropDown.appendTo(args.element);
     };
+    ToolbarRenderer.prototype.pickerRefresh = function (dropDownArgs) {
+        if (this.parent.backgroundColor.mode === 'Picker') {
+            var popupElem = dropDownArgs.element.parentElement;
+            popupElem.style.width = (popupElem.offsetWidth + 5).toString() + 'px';
+            getInstance(popupElem, Popup).refreshPosition(popupElem);
+            popupElem.style.width = (popupElem.offsetWidth - 5).toString() + 'px';
+        }
+    };
     ToolbarRenderer.prototype.popupModal = function (element) {
@@ -353,2 +368,3 @@ var popupInst = getInstance(element, Popup);
         });
+        this.colorPicker.isStringTemplate = true;
         this.colorPicker.columns = (item === 'backgroundcolor') ? this.parent.backgroundColor.columns : this.parent.fontColor.columns;
@@ -355,0 +371,0 @@ this.colorPicker.presetColors = (item === 'backgroundcolor') ? this.parent.backgroundColor.colorCode :

src/rich-text-editor/renderer/view-source.js

@@ -129,3 +129,3 @@ import { removeClass, selectAll, isNullOrUndefined, EventHandler } from '@syncfusion/ej2-base';
         removeClass(tbItems, [CLS_ACTIVE]);
-        this.parent.setContentHeight('sourceCode');
+        this.parent.setContentHeight('sourceCode', true);
         this.wireEvent(this.previewElement);
@@ -167,3 +167,3 @@ this.unWireBaseKeyDown();
         }
-        this.parent.setContentHeight();
+        this.parent.setContentHeight('preview', true);
         this.unWireEvent();
@@ -170,0 +170,0 @@ this.wireBaseKeyDown();

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

11268430

increased by1.08%

Lines of code

99002

increased by0.8%

Number of low quality alerts

1

decreased by-50%

Dependency changes

• Updated@syncfusion/ej2-base@~17.2.34

• Updated@syncfusion/ej2-navigations@~17.2.34

• Updated@syncfusion/ej2-popups@~17.2.34

• Updated@syncfusion/ej2-splitbuttons@~17.2.34