@syncfusion/ej2-richtexteditor 20.1.56 → 20.1.59

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 20.1.56
+*  version : 20.1.59
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-richtexteditor@*",
-  "_id": "@syncfusion/ej2-richtexteditor@20.1.55",
+  "_id": "@syncfusion/ej2-richtexteditor@20.1.58",
   "_inBundle": false,
-  "_integrity": "sha512-62Rvxj/EQwsiPPPAy15EYFm6lX3GcnRVlhtzmuePAa0UZWJQza9JKYpyJJDouMKozDsa/ekG+reDFrCeswoJLw==",
+  "_integrity": "sha512-qxEXYEGIaR0st9tRaWcOOpDp4IexL/rHxDx6XL/BnRjTE56hfHyn12zKW9i8FcCA2wFfDGRA8NUWcfqplZGtpg==",
   "_location": "/@syncfusion/ej2-richtexteditor",
   "_phantomChildren": {},
   "_requested": {
@@ -26,8 +26,8 @@
     "/@syncfusion/ej2-react-richtexteditor",
     "/@syncfusion/ej2-vue-richtexteditor"
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-20.1.55.tgz",
-  "_shasum": "250a94b80e644648ab21dda7654ac57331425f4d",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-20.1.58.tgz",
+  "_shasum": "f3ebd6ff60aea3ee6079960ba07c001bd2bf12a4",
   "_spec": "@syncfusion/ej2-richtexteditor@*",
   "_where": "/jenkins/workspace/automation_release_19.1.0.1-ZPMUBNQ6AUYH6YGEFBPVYMEQLRRW2SLD4XCZ6GATNZJFYJ3RIAOA/packages/included",
   "author": {
@@ -38,13 +38,13 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~20.1.56",
+    "@syncfusion/ej2-base": "~20.1.57",
     "@syncfusion/ej2-buttons": "~20.1.55",
-    "@syncfusion/ej2-filemanager": "~20.1.56",
-    "@syncfusion/ej2-inputs": "~20.1.55",
-    "@syncfusion/ej2-navigations": "~20.1.56",
-    "@syncfusion/ej2-popups": "~20.1.55",
-    "@syncfusion/ej2-splitbuttons": "~20.1.55"
+    "@syncfusion/ej2-filemanager": "~20.1.59",
+    "@syncfusion/ej2-inputs": "~20.1.59",
+    "@syncfusion/ej2-navigations": "~20.1.58",
+    "@syncfusion/ej2-popups": "~20.1.58",
+    "@syncfusion/ej2-splitbuttons": "~20.1.57"
   },
   "deprecated": false,
   "description": "Essential JS 2 RichTextEditor component",
@@ -70,6 +70,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "20.1.56",
+  "version": "20.1.59",
   "sideEffects": false
 }

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

@@ -26,6 +26,7 @@ export declare class Lists {
     private spaceList;
     private enterList;
     private backspaceList;
+    private removeList;
     private keyDownHandler;
     private spaceKeyAction;
     private getAction;

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

@@ -1,5 +1,5 @@
 import * as CONSTANT from './../base/constant';
-import { createElement, detach, prepend, append, attributes } from '@syncfusion/ej2-base';
+import { createElement, detach, prepend, append, attributes, Browser } from '@syncfusion/ej2-base';
 import { markerClassName } from './dom-node';
 import * as EVENTS from './../../common/constant';
 import { setStyleAttribute } from '@syncfusion/ej2-base';
@@ -178,6 +178,29 @@ var Lists = /** @class */ (function () {
                 parentList.parentElement.insertBefore(startNode.children[1], parentList);
             }
         }
+        this.removeList(range, e);
+    };
+    Lists.prototype.removeList = function (range, e) {
+        var startNode = this.parent.domNode.getSelectedNode(range.startContainer, range.startOffset);
+        var endNode = this.parent.domNode.getSelectedNode(range.endContainer, range.endOffset);
+        startNode = startNode.nodeName === 'BR' ? startNode.parentElement : startNode;
+        endNode = endNode.nodeName === 'BR' ? endNode.parentElement : endNode;
+        if (((range.commonAncestorContainer.nodeName === 'OL' || range.commonAncestorContainer.nodeName === 'UL' || range.commonAncestorContainer.nodeName === 'LI') &&
+            isNOU(endNode.nextElementSibling) && endNode.textContent.length === range.endOffset &&
+            isNOU(startNode.previousElementSibling) && range.startOffset === 0) ||
+            (Browser.userAgent.indexOf('Firefox') != -1 && range.startContainer === range.endContainer && range.startContainer === this.parent.editableElement &&
+                range.startOffset === 0 && range.endOffset === 1)) {
+            if (Browser.userAgent.indexOf('Firefox') != -1) {
+                detach(range.commonAncestorContainer.childNodes[0]);
+            }
+            else if (range.commonAncestorContainer.nodeName === 'LI') {
+                detach(range.commonAncestorContainer.parentElement);
+            }
+            else {
+                detach(range.commonAncestorContainer);
+            }
+            e.event.preventDefault();
+        }
     };
     Lists.prototype.keyDownHandler = function (e) {
         if (e.event.which === 13) {
@@ -202,6 +225,7 @@ var Lists = /** @class */ (function () {
                 && (commonAncestor.lastElementChild === closest(endNode, 'li')) && !range.collapsed) {
                 detach(commonAncestor);
             }
+            this.removeList(range, e);
         }
         if (e.event.which === 9) {
             var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
@@ -417,6 +441,19 @@ var Lists = /** @class */ (function () {
     };
     Lists.prototype.applyListsHandler = function (e) {
         var range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
+        if (Browser.userAgent.indexOf('Firefox') != -1 && range.startContainer === range.endContainer && range.startContainer === this.parent.editableElement) {
+            var startChildNodes = range.startContainer.childNodes;
+            var startNode = ((startChildNodes[(range.startOffset > 0) ? (range.startOffset - 1) : range.startOffset]) || range.startContainer);
+            var endNode = (range.endContainer.childNodes[(range.endOffset > 0) ? (range.endOffset - 1) : range.endOffset] || range.endContainer);
+            var lastSelectionNode = endNode.lastChild.nodeName === 'BR' ? (isNOU(endNode.lastChild.previousSibling) ? endNode
+                : endNode.lastChild.previousSibling) : endNode.lastChild;
+            while (!isNOU(lastSelectionNode) && lastSelectionNode.nodeName !== '#text' && lastSelectionNode.nodeName !== 'IMG' &&
+                lastSelectionNode.nodeName !== 'BR' && lastSelectionNode.nodeName !== 'HR') {
+                lastSelectionNode = lastSelectionNode.lastChild;
+            }
+            this.parent.nodeSelection.setSelectionText(this.parent.currentDocument, startNode, lastSelectionNode, 0, lastSelectionNode.textContent.length);
+            range = this.parent.nodeSelection.getRange(this.parent.currentDocument);
+        }
         if (range.startContainer === range.endContainer && range.startContainer === this.parent.editableElement &&
             range.startOffset === range.endOffset && range.startOffset === 0 &&
             this.parent.editableElement.textContent.length === 0 && (this.parent.editableElement.childNodes[0].nodeName != 'TABLE' &&

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

@@ -270,8 +270,16 @@ var SelectionCommands = /** @class */ (function () {
             for (; nodeTraverse && nodeTraverse.parentElement && nodeTraverse.parentElement !== endNode; 
             // eslint-disable-next-line
             nodeTraverse = nodeTraverse) {
-                if (nodeTraverse.parentElement && nodeTraverse.parentElement.tagName.toLocaleLowerCase()
-                    === formatNode.tagName.toLocaleLowerCase() &&
+                var nodeTraverseCondition = void 0;
+                if (formatNode.nodeName === 'SPAN') {
+                    nodeTraverseCondition = nodeTraverse.parentElement.tagName.toLocaleLowerCase()
+                        === formatNode.tagName.toLocaleLowerCase() && nodeTraverse.parentElement.getAttribute('style') === formatNodeStyles;
+                }
+                else {
+                    nodeTraverseCondition = nodeTraverse.parentElement.tagName.toLocaleLowerCase()
+                        === formatNode.tagName.toLocaleLowerCase();
+                }
+                if (nodeTraverse.parentElement && nodeTraverseCondition &&
                     (nodeTraverse.parentElement.childElementCount > 1 || range.startOffset > 1)) {
                     if (textNode.parentElement && textNode.parentElement.tagName.toLocaleLowerCase()
                         === formatNode.tagName.toLocaleLowerCase()) {

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

@@ -153,7 +153,17 @@ var HtmlEditor = /** @class */ (function () {
             e.args.keyCode === 13) {
             this.spaceLink(e.args);
             if (this.parent.editorMode === 'HTML' && !this.parent.readonly) {
-                this.parent.notify(events.enterHandler, { args: e.args });
+                var currentLength = this.parent.getText().trim().length;
+                var selectionLength = this.parent.getSelection().length;
+                var totalLength = (currentLength - selectionLength) + 1;
+                if (!(this.parent.maxLength === -1 || totalLength <= this.parent.maxLength) &&
+                    e.args.keyCode === 13) {
+                    e.args.preventDefault();
+                    return;
+                }
+                else {
+                    this.parent.notify(events.enterHandler, { args: e.args });
+                }
             }
         }
         if (e.args.action === 'space') {

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

@@ -633,7 +633,9 @@ var Toolbar = /** @class */ (function () {
         }
     };
     Toolbar.prototype.onRefresh = function () {
-        this.refreshToolbarOverflow();
+        if (!this.parent.inlineMode.enable) {
+            this.refreshToolbarOverflow();
+        }
         this.parent.setContentHeight('', true);
     };
     /**

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

@@ -606,3 +606,8 @@ export declare const closeTableDialog: string;
 
  */
 export declare const bindCssClass: string;
+/**
+ * @hidden
+
+ */
+export declare const blockInlineEmptyNodes: string;

package/src/rich-text-editor/base/constant.js

@@ -606,3 +606,8 @@ export var closeTableDialog = 'closeTableDialog';
 
  */
 export var bindCssClass = 'closeTableDialog';
+/**
+ * @hidden
+
+ */
+export var blockInlineEmptyNodes = "address:empty, article:empty, aside:empty, blockquote:empty,\ndetails:empty, dd:empty, div:empty, dl:empty, dt:empty, fieldset:empty, footer:empty,form:empty, h1:empty,\nh2:empty, h3:empty, h4:empty, h5:empty, h6:empty, header:empty, hgroup:empty, hr:empty, li:empty, main:empty, nav:empty,\nnoscript:empty, output:empty, p:empty, pre:empty, section:empty, td:empty, th:empty,\na:empty, abbr:empty, acronym:empty, b:empty, bdi:empty, bdo:empty, big:empty, button:empty,\ncanvas:empty, cite:empty, code:empty, data:empty, datalist:empty, del:empty, dfn:empty, em:empty, font:empty, i:empty, iframe:empty,\nins:empty, kbd:empty, label:empty, map:empty, mark:empty, meter:empty, noscript:empty, object:empty, output:empty, picture:empty, progress:empty,\nq:empty, ruby:empty, s:empty, samp:empty, script:empty, select:empty, slot:empty, small:empty, span:empty, strong:empty, strike:empty, sub:empty, sup:empty, svg:empty,\ntemplate:empty, textarea:empty, time:empty, u:empty, tt:empty, var:empty, wbr:empty";

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

@@ -118,6 +118,7 @@ export interface IRichTextEditor extends Component<HTMLElement> {
     getCollection?(items: string | string[]): string[];
     getRange(): Range;
     getID(): string;
+    getText(): string;
     updateValueData?(): void;
     getBaseToolbarObject(): BaseToolbar;
     setContentHeight(target?: string, isExpand?: boolean): void;
@@ -225,6 +226,8 @@ export interface IItemCollectionArgs {
     selectParent?: Node[];
     /** Defines the URL action details for link element */
     url?: string;
+    /** Defines the Display Text action details for link element */
+    text?: string;
     /** Defines the title of the link action details */
     title?: string;
     /** Defines the target as string for link element */

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

@@ -339,6 +339,35 @@ var RichTextEditor = /** @class */ (function (_super) {
                 this.formatter.saveData();
             }
         }
+        if (this.maxLength !== -1 && !isNOU(tool.command)) {
+            var currentInsertContentLength = 0;
+            if (tool.command === 'Links') {
+                currentInsertContentLength = value.text.length === 0 ?
+                    value.url.length : value.text.length;
+            }
+            if (tool.command === 'Images' || tool.command === 'Table' || tool.command === 'Files') {
+                currentInsertContentLength = 1;
+            }
+            if (tool.command === 'InsertHTML') {
+                if (!isNOU(value)) {
+                    var tempElem = this.createElement('div');
+                    tempElem.innerHTML = value;
+                    currentInsertContentLength = tempElem.textContent.length;
+                }
+                else if (!isNOU(tool.value) && (tool.value === '<hr/>' || tool.value === '<br/>')) {
+                    currentInsertContentLength = 1;
+                }
+            }
+            if (tool.command === 'InsertText') {
+                currentInsertContentLength = value.length;
+            }
+            var currentLength = this.getText().trim().length;
+            var selectionLength = this.getSelection().length;
+            var totalLength = (currentLength - selectionLength) + currentInsertContentLength;
+            if (!(this.maxLength === -1 || totalLength <= this.maxLength)) {
+                return;
+            }
+        }
         this.formatter.editorManager.execCommand(tool.command, tool.subCommand ? tool.subCommand : (value ? value : tool.value), null, null, (value ? value : tool.value), (value ? value : tool.value));
         if (option && option.undo) {
             this.formatter.saveData();
@@ -475,7 +504,7 @@ var RichTextEditor = /** @class */ (function (_super) {
             range.endContainer;
         var closestLI = closest(endNode, 'LI');
         if (!isNOU(closestLI) && endNode.textContent.length === range.endOffset &&
-            !range.collapsed) {
+            !range.collapsed && isNOU(endNode.nextElementSibling)) {
             closestLI.textContent = closestLI.textContent.trim();
             currentEndOffset = closestLI.textContent.length - 1;
             var currentLastElem = closestLI;
@@ -571,6 +600,17 @@ var RichTextEditor = /** @class */ (function (_super) {
         this.autoResize();
     };
     RichTextEditor.prototype.keyUp = function (e) {
+        if (this.editorMode === "HTML") {
+            var range = this.getRange();
+            if (Browser.userAgent.indexOf('Firefox') != -1 && range.startContainer.nodeName === '#text' &&
+                range.startContainer.parentElement === this.inputElement && this.enterKey !== 'BR') {
+                var range_1 = this.getRange();
+                var tempElem = this.createElement(this.enterKey);
+                range_1.startContainer.parentElement.insertBefore(tempElem, range_1.startContainer);
+                tempElem.appendChild(range_1.startContainer);
+                this.formatter.editorManager.nodeSelection.setSelectionText(this.contentModule.getDocument(), tempElem.childNodes[0], tempElem.childNodes[0], tempElem.childNodes[0].textContent.length, tempElem.childNodes[0].textContent.length);
+            }
+        }
         this.notify(events.keyUp, { member: 'keyup', args: e });
         if (e.code === 'KeyX' && e.which === 88 && e.keyCode === 88 && e.ctrlKey && (this.inputElement.innerHTML === '' ||
             this.inputElement.innerHTML === '<br>')) {
@@ -723,7 +763,7 @@ var RichTextEditor = /** @class */ (function (_super) {
             requestType: 'Paste'
         };
         this.trigger(events.actionBegin, evenArgs, function (pasteArgs) {
-            var currentLength = _this.getText().trim().length;
+            var currentLength = _this.inputElement.textContent.length;
             var selectionLength = _this.getSelection().length;
             var pastedContentLength = (isNOU(e) || isNOU(e.clipboardData))
                 ? 0 : e.clipboardData.getData('text/plain').length;

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

@@ -4,6 +4,7 @@
 import { isNullOrUndefined as isNOU, addClass, removeClass, selectAll, createElement } from '@syncfusion/ej2-base';
 import { Browser, detach, SanitizeHtmlHelper, extend } from '@syncfusion/ej2-base';
 import * as classes from '../base/classes';
+import * as CONSTANT from '../base/constant';
 import * as model from '../models/items';
 import { toolsLocale, fontNameLocale, formatsLocale, numberFormatListLocale, bulletFormatListLocale } from '../models/default-locale';
 var undoRedoItems = ['Undo', 'Redo'];
@@ -413,6 +414,10 @@ export function updateTextNode(value, rteObj) {
         var previousParent = void 0;
         var insertElem = void 0;
         while (tempNode.firstChild) {
+            var emptyElem = tempNode.querySelectorAll(CONSTANT.blockInlineEmptyNodes);
+            for (var i = 0; i < emptyElem.length; i++) {
+                emptyElem[i].innerHTML = '<br>';
+            }
             if (rteObj.enterKey !== 'BR' && ((tempNode.firstChild.nodeName === '#text' &&
                 (tempNode.firstChild.textContent.indexOf('\n') < 0 || tempNode.firstChild.textContent.trim() !== '')) ||
                 inlineNode.indexOf(tempNode.firstChild.nodeName.toLocaleLowerCase()) >= 0)) {

package/src/rich-text-editor/formatter/formatter.js

@@ -43,6 +43,21 @@ var Formatter = /** @class */ (function () {
                 || self.contentModule.getPanel() === range.commonAncestorContainer)) {
             return;
         }
+        if (!isNullOrUndefined(args) && self.maxLength !== -1 && !isNullOrUndefined(args.item.command)) {
+            var currentInsertContentLength = 0;
+            if (args.item.command === 'Links') {
+                currentInsertContentLength = value.text.length === 0 ? value.url.length : value.text.length;
+            }
+            if (args.item.command === 'Images' || args.item.command === 'Table' || args.item.command === 'Files') {
+                currentInsertContentLength = 1;
+            }
+            var currentLength = self.getText().trim().length;
+            var selectionLength = self.getSelection().length;
+            var totalLength = (currentLength - selectionLength) + currentInsertContentLength;
+            if (!(self.maxLength === -1 || totalLength <= self.maxLength)) {
+                return;
+            }
+        }
         if (isNullOrUndefined(args)) {
             var action_1 = event.action;
             if (action_1 !== 'tab' && action_1 !== 'enter' && action_1 !== 'space' && action_1 !== 'escape') {