@syncfusion/ej2-richtexteditor 21.2.10 → 22.1.34

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 21.2.10
+*  version : 22.1.34
 *  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@21.2.9",
+  "_id": "@syncfusion/ej2-richtexteditor@21.8.0",
   "_inBundle": false,
-  "_integrity": "sha512-ISaeZrVvp/ekmd+F2kcZWR/vVih9rcyg7p1tFl6Cf+AAiESStZ6jlkxWmPbb/wnZr65rdjbbkQoND0vjejQtow==",
+  "_integrity": "sha512-KKugUmllHAC97zgvz2Bo3y8SB95H4fuecSj40S5i6oXXbNLdkOsYoPr66a38Di+/igSY9RgzG7R9BedERFsMQg==",
   "_location": "/@syncfusion/ej2-richtexteditor",
   "_phantomChildren": {},
   "_requested": {
@@ -26,8 +26,8 @@
     "/@syncfusion/ej2-react-richtexteditor",
     "/@syncfusion/ej2-vue-richtexteditor"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-21.2.9.tgz",
-  "_shasum": "836aa3ae47ee1d0a5d0cd6657c5432fdef49dedd",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-21.8.0.tgz",
+  "_shasum": "11fb16ec178e4100183ec60405ad3ed21c7b38e9",
   "_spec": "@syncfusion/ej2-richtexteditor@*",
   "_where": "/jenkins/workspace/elease-automation_release_21.1.1/packages/included",
   "author": {
@@ -38,13 +38,13 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~21.2.9",
-    "@syncfusion/ej2-buttons": "~21.2.10",
-    "@syncfusion/ej2-filemanager": "~21.2.5",
-    "@syncfusion/ej2-inputs": "~21.2.9",
-    "@syncfusion/ej2-navigations": "~21.2.9",
-    "@syncfusion/ej2-popups": "~21.2.10",
-    "@syncfusion/ej2-splitbuttons": "~21.2.5"
+    "@syncfusion/ej2-base": "~22.1.34",
+    "@syncfusion/ej2-buttons": "~22.1.34",
+    "@syncfusion/ej2-filemanager": "~22.1.34",
+    "@syncfusion/ej2-inputs": "~22.1.34",
+    "@syncfusion/ej2-navigations": "~22.1.34",
+    "@syncfusion/ej2-popups": "~22.1.34",
+    "@syncfusion/ej2-splitbuttons": "~22.1.34"
   },
   "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": "21.2.10",
+  "version": "22.1.34",
   "sideEffects": false
 }

package/src/common/config.js

@@ -73,8 +73,8 @@ export 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

package/src/common/constant.d.ts

@@ -85,3 +85,9 @@ export declare const SPACE_ACTION: string;
  * @hidden
  */
 export declare const FORMAT_PAINTER_ACTIONS: string;
+/**
+ * Emoji picker event constant
+ *
+ * @hidden
+ */
+export declare const EMOJI_PICKER_ACTIONS: string;

package/src/common/constant.js

@@ -85,3 +85,9 @@ export var SPACE_ACTION = 'actionBegin';
  * @hidden
  */
 export var FORMAT_PAINTER_ACTIONS = 'format_painter_actions';
+/**
+ * Emoji picker event constant
+ *
+ * @hidden
+ */
+export var EMOJI_PICKER_ACTIONS = 'emoji_picker_actions';

package/src/common/interface.d.ts

@@ -74,6 +74,6 @@ export interface IToolbarStatus {
     lowercase?: boolean;
     createlink?: boolean;
     insertcode?: boolean;
-    numberFormatList?: string;
-    bulletFormatList?: string;
+    numberFormatList?: string | boolean;
+    bulletFormatList?: string | boolean;
 }

package/src/common/util.js

@@ -147,6 +147,8 @@ export function getDefaultHtmlTbStatus() {
         strikethrough: false,
         orderedlist: false,
         unorderedlist: false,
+        numberFormatList: false,
+        bulletFormatList: false,
         underline: false,
         alignments: null,
         backgroundcolor: null,

package/src/editor-manager/base/editor-manager.d.ts

@@ -1,5 +1,5 @@
 import { Observer } from '@syncfusion/ej2-base';
-import { ICommandModel } from './interface';
+import { ICommandModel, IFormatPainterEditor } from './interface';
 import { EditorExecCommand as ExecCommand } from './types';
 import { Lists } from './../plugin/lists';
 import { NodeSelection } from './../../selection/index';
@@ -19,7 +19,7 @@ import { UndoRedoManager } from './../plugin/undo';
 import { MsWordPaste } from '../plugin/ms-word-clean-up';
 import { InsertTextExec } from '../plugin/insert-text';
 import { NodeCutter } from '../plugin/nodecutter';
-import { FormatPainterActions } from '../plugin/format-painter-actions';
+import { EmojiPickerAction } from '../plugin/emoji-picker-action';
 /**
  * EditorManager internal component
  *
@@ -47,8 +47,9 @@ export declare class EditorManager {
     clearObj: ClearFormatExec;
     undoRedoManager: UndoRedoManager;
     msWordPaste: MsWordPaste;
-    formatPaintetrObj: FormatPainterActions;
+    formatPainterEditor: IFormatPainterEditor;
     editableElement: Element;
+    emojiPickerObj: EmojiPickerAction;
     /**
      * Constructor for creating the component
      *

package/src/editor-manager/base/editor-manager.js

@@ -20,6 +20,7 @@ import * as EVENTS from './../../common/constant';
 import { InsertTextExec } from '../plugin/insert-text';
 import { NodeCutter } from '../plugin/nodecutter';
 import { FormatPainterActions } from '../plugin/format-painter-actions';
+import { EmojiPickerAction } from '../plugin/emoji-picker-action';
 /**
  * EditorManager internal component
  *
@@ -56,7 +57,8 @@ var EditorManager = /** @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 () {
@@ -204,6 +206,9 @@ var EditorManager = /** @class */ (function () {
             case 'formatpainter':
                 this.observer.notify(EVENTS.FORMAT_PAINTER_ACTIONS, { item: exeValue, subCommand: value, event: event, callBack: callBack });
                 break;
+            case 'emojipicker':
+                this.observer.notify(EVENTS.EMOJI_PICKER_ACTIONS, { item: exeValue, subCommand: value, value: text,
+                    event: event, callBack: callBack });
         }
     };
     return EditorManager;

package/src/editor-manager/base/interface.d.ts

@@ -123,12 +123,13 @@ export interface IHtmlItemArgs {
     insertElement?: Element;
     captionClass?: string;
     action?: string;
+    formatPainterAction?: IFormatPainterActionValue;
 }
 /**
 
  */
 export interface IHtmlUndoRedoData {
-    text?: string;
+    text?: DocumentFragment;
     range?: NodeSelection;
 }
 /**
@@ -176,18 +177,52 @@ export interface IFormatPainterSettings {
  * @hidden
  *
  */
-export interface IFormatPainterActionArgs {
-    name: string;
-    event: MouseEvent | KeyboardEvent;
-    item: IFormatPainterAction;
-    subCommand: string;
+export interface IFormatPainterAction {
+    formatPainterAction: IFormatPainterActionValue;
 }
 /**
+ * @private
+ * @hidden
  *
-
+ */
+export interface IFormatPainterEditor {
+    destroy: Function;
+}
+/**
+ * @private
+ * @hidden
+ */
+export interface FormatPainterCollection {
+    attrs: Attr[];
+    className: string;
+    styles: CSSPropCollection[];
+    tagName: string;
+}
+/**
+ * @private
  * @hidden
  *
  */
-export interface IFormatPainterAction {
-    formatPainterAction: IFormatPainterActionValue;
+export interface FormatPainterValue {
+    element: HTMLElement;
+    lastChild: HTMLElement;
+}
+/**
+ * @private
+ * @hidden
+ */
+export interface DeniedFormatsCollection {
+    tag: string;
+    styles: string[];
+    attributes: string[];
+    classes: string[];
+}
+/**
+ * @private
+ * @hidden
+ */
+export interface CSSPropCollection {
+    property: string;
+    value: string;
+    priority: string;
 }

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

@@ -12,6 +12,7 @@ export declare class ClearFormat {
      * @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
 

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

@@ -18,6 +18,7 @@ var ClearFormat = /** @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
 

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

@@ -1,5 +1,5 @@
 import * as CONSTANT from './../base/constant';
-import { append, detach, createElement, isNullOrUndefined } from '@syncfusion/ej2-base';
+import { append, detach, createElement, isNullOrUndefined as isNOU } from '@syncfusion/ej2-base';
 import { NodeSelection } from './../../selection/index';
 import { selfClosingTags } from '../../common/config';
 import { getLastTextNode } from '../../common/util';
@@ -451,8 +451,12 @@ var DOMNode = /** @class */ (function () {
         var end = this.parent.querySelector('.' + markerClassName.endSelection);
         var startTextNode;
         var endTextNode;
-        if (start.textContent === '' && isNullOrUndefined(end) && action !== 'tab') {
-            if (start.childNodes.length === 1 && start.childNodes[0].nodeName === 'BR') {
+        if (start.textContent === '' && isNOU(end) && action !== 'tab') {
+            if (isNOU(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 {
@@ -541,7 +545,7 @@ var DOMNode = /** @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);
                 }
@@ -595,7 +599,7 @@ var DOMNode = /** @class */ (function () {
                 if (start.textContent === '') {
                     var tdNode = start.querySelectorAll('td');
                     start = tdNode[tdNode.length - 1];
-                    start = !isNullOrUndefined(start.childNodes[0]) ? start.childNodes[0] : start;
+                    start = !isNOU(start.childNodes[0]) ? start.childNodes[0] : start;
                 }
                 else {
                     var lastNode = start.lastChild;
@@ -755,7 +759,7 @@ var DOMNode = /** @class */ (function () {
                 }
                 parentNode = this.blockParentNode(endNode);
                 if (parentNode && this.ignoreTableTag(parentNode) && collectionNodes.indexOf(parentNode) < 0 &&
-                    (!isNullOrUndefined(parentNode.previousElementSibling) && parentNode.previousElementSibling.tagName !== 'IMG')) {
+                    (!isNOU(parentNode.previousElementSibling) && parentNode.previousElementSibling.tagName !== 'IMG')) {
                     collectionNodes.push(parentNode);
                 }
             }

package/src/editor-manager/plugin/emoji-picker-action.d.ts

@@ -0,0 +1,8 @@
+import { EditorManager } from './../base/editor-manager';
+export declare class EmojiPickerAction {
+    private parent;
+    constructor(parent?: EditorManager);
+    private addEventListener;
+    private emojiInsert;
+    private beforeApplyFormat;
+}

package/src/editor-manager/plugin/emoji-picker-action.js

@@ -0,0 +1,62 @@
+import * as EVENTS from './../../common/constant';
+import { InsertHtml } from './inserthtml';
+var EmojiPickerAction = /** @class */ (function () {
+    function EmojiPickerAction(parent) {
+        this.parent = parent;
+        this.addEventListener();
+    }
+    EmojiPickerAction.prototype.addEventListener = function () {
+        this.parent.observer.on(EVENTS.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;
+}());
+export { EmojiPickerAction };

package/src/editor-manager/plugin/format-painter-actions.d.ts

@@ -1,6 +1,7 @@
-import { IFormatPainterSettings } from '../base';
+import { IFormatPainterEditor, IFormatPainterSettings } from '../base';
 import { EditorManager } from '../base';
-export declare class FormatPainterActions {
+export declare class FormatPainterActions implements IFormatPainterEditor {
+    private INVALID_TAGS;
     private parent;
     private copyCollection;
     private deniedFormatsCollection;
@@ -9,7 +10,19 @@ export declare class FormatPainterActions {
     private settings;
     constructor(parent?: EditorManager, options?: IFormatPainterSettings);
     private addEventListener;
+    private onPropertyChanged;
+    private removeEventListener;
+    /**
+     * Destroys the format painter.
+     *
+     * @function destroy
+     * @returns {void}
+     * @hidden
+
+     */
+    destroy(): void;
     private actionHandler;
+    private callBack;
     private generateElement;
     private pasteAction;
     private removeDeniedFormats;
@@ -23,41 +36,11 @@ export declare class FormatPainterActions {
     private findCurrentContext;
     private insertFormatNode;
     private insertBlockNode;
+    private insertNewList;
+    private insertSameList;
+    private isSameListType;
     private cleanEmptyLists;
     private setDeniedFormats;
+    private detachEmptyBlockNodes;
     private makeDeniedFormatsCollection;
 }
-/**
- * @hidden
- */
-export interface FormatPainterCollection {
-    attrs: Attr[];
-    className: string;
-    styles: CSSPropCollection[];
-    tagName: string;
-}
-/**
- * @hidden
- *
- */
-export interface FormatPainterValue {
-    element: HTMLElement;
-    lastChild: HTMLElement;
-}
-/**
- * @hidden
- */
-export interface DeniedFormatsCollection {
-    tag: string;
-    styles: string[];
-    attributes: string[];
-    classes: string[];
-}
-/**
- * @hidden
- */
-export interface CSSPropCollection {
-    property: string;
-    value: string;
-    priority: string;
-}