@syncfusion/ej2-richtexteditor 24.1.41 → 24.1.43-569781

package/src/markdown-parser/plugin/undo.d.ts

@@ -24,7 +24,7 @@ export declare class UndoRedoCommands {
      * @function destroy
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     destroy(): void;
     /**
@@ -33,7 +33,7 @@ export declare class UndoRedoCommands {
      * @param {IMarkdownSubCommands} e - specifies the sub commands
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     onAction(e: IMarkdownSubCommands): void;
     private keyDown;
@@ -45,7 +45,7 @@ export declare class UndoRedoCommands {
      * @function saveData
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     saveData(e?: KeyboardEvent | MouseEvent | IUndoCallBack): void;
     /**
@@ -55,7 +55,7 @@ export declare class UndoRedoCommands {
      * @function undo
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     undo(e?: IMarkdownSubCommands | IMDKeyboardEvent): void;
     /**
@@ -65,7 +65,7 @@ export declare class UndoRedoCommands {
      * @function redo
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     redo(e?: IMarkdownSubCommands | IMDKeyboardEvent): void;
     private restore;
@@ -74,7 +74,7 @@ export declare class UndoRedoCommands {
      *
      * @returns {boolean} - returns the boolean value
      * @hidden
-
+     * @deprecated
      */
     getUndoStatus(): {
         [key: string]: boolean;

package/src/markdown-parser/plugin/undo.js

@@ -45,7 +45,7 @@ var UndoRedoCommands = /** @class */ (function () {
      * @function destroy
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     UndoRedoCommands.prototype.destroy = function () {
         this.removeEventListener();
@@ -56,7 +56,7 @@ var UndoRedoCommands = /** @class */ (function () {
      * @param {IMarkdownSubCommands} e - specifies the sub commands
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     UndoRedoCommands.prototype.onAction = function (e) {
         if (e.subCommand === 'Undo') {
@@ -93,7 +93,7 @@ var UndoRedoCommands = /** @class */ (function () {
      * @function saveData
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     UndoRedoCommands.prototype.saveData = function (e) {
         var textArea = this.parent.element;
@@ -126,7 +126,7 @@ var UndoRedoCommands = /** @class */ (function () {
      * @function undo
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     UndoRedoCommands.prototype.undo = function (e) {
         if (this.steps > 0) {
@@ -147,7 +147,7 @@ var UndoRedoCommands = /** @class */ (function () {
      * @function redo
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     UndoRedoCommands.prototype.redo = function (e) {
         if (this.undoRedoStack[this.steps + 1] != null) {
@@ -177,7 +177,7 @@ var UndoRedoCommands = /** @class */ (function () {
      *
      * @returns {boolean} - returns the boolean value
      * @hidden
-
+     * @deprecated
      */
     UndoRedoCommands.prototype.getUndoStatus = function () {
         var status = { undo: false, redo: false };

package/src/rich-text-editor/actions/base-quick-toolbar.d.ts

@@ -1,5 +1,5 @@
 import { Popup } from '@syncfusion/ej2-popups';
-import { IRichTextEditor } from '../base/interface';
+import { IRichTextEditor, IBaseQuickToolbar } from '../base/interface';
 import { IToolbarItems, IQuickToolbarOptions } from '../base/interface';
 import { ServiceLocator } from '../services/service-locator';
 import { BaseToolbar } from './base-toolbar';
@@ -7,10 +7,10 @@ import { RichTextEditorModel } from '../base/rich-text-editor-model';
 /**
  * `Quick toolbar` module is used to handle Quick toolbar actions.
  */
-export declare class BaseQuickToolbar {
+export declare class BaseQuickToolbar implements IBaseQuickToolbar {
     popupObj: Popup;
     element: HTMLElement;
-    private isDOMElement;
+    isRendered: boolean;
     quickTBarObj: BaseToolbar;
     private stringItems;
     private dropDownButtons;
@@ -30,7 +30,7 @@ export declare class BaseQuickToolbar {
      * @param {IQuickToolbarOptions} args - specifies the arguments
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     render(args: IQuickToolbarOptions): void;
     private createToolbar;
@@ -45,7 +45,7 @@ export declare class BaseQuickToolbar {
      * @param {string} type - specifies the type
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     showPopup(x: number, y: number, target: Element, type?: string): void;
     /**
@@ -53,7 +53,7 @@ export declare class BaseQuickToolbar {
      *
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     hidePopup(): void;
     /**
@@ -61,14 +61,14 @@ export declare class BaseQuickToolbar {
      * @param {number} index - specifies the index value
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     addQTBarItem(item: (string | IToolbarItems)[], index: number): void;
     /**
      * @param {number} index - specifies the index value
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     removeQTBarItem(index: number | HTMLElement[] | Element[]): void;
     private removeEleFromDOM;
@@ -79,7 +79,7 @@ export declare class BaseQuickToolbar {
      * @function destroy
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     destroy(): void;
     /**
@@ -87,7 +87,7 @@ export declare class BaseQuickToolbar {
      *
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     addEventListener(): void;
     /**
@@ -96,7 +96,7 @@ export declare class BaseQuickToolbar {
      * @param {RichTextEditorModel} e - specifies the model element
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     protected onPropertyChanged(e: {
         [key: string]: RichTextEditorModel;
@@ -106,7 +106,7 @@ export declare class BaseQuickToolbar {
      *
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     removeEventListener(): void;
 }

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

@@ -15,7 +15,7 @@ var BaseQuickToolbar = /** @class */ (function () {
     function BaseQuickToolbar(parent, locator) {
         this.parent = parent;
         this.locator = locator;
-        this.isDOMElement = false;
+        this.isRendered = false;
         this.renderFactory = this.locator.getService('rendererFactory');
         this.contentRenderer = this.renderFactory.getRenderer(RenderType.Content);
         this.popupRenderer = this.renderFactory.getRenderer(RenderType.Popup);
@@ -35,7 +35,7 @@ var BaseQuickToolbar = /** @class */ (function () {
      * @param {IQuickToolbarOptions} args - specifies the arguments
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseQuickToolbar.prototype.render = function (args) {
         var className;
@@ -79,7 +79,18 @@ var BaseQuickToolbar = /** @class */ (function () {
             e.target.classList.contains('e-imgbreak')) ? false : true;
         var target = !isNOU(imgWrapper) ? imgWrapper : e.target;
         addClass([this.toolbarElement], [classes.CLS_RM_WHITE_SPACE]);
-        var targetOffsetTop = target.offsetTop;
+        var targetOffsetTop;
+        if (!isNOU(closest(target, 'table'))) {
+            targetOffsetTop = target.offsetTop;
+            var parentTable = closest(target, 'table');
+            while (!isNOU(parentTable)) {
+                targetOffsetTop += parentTable.offsetTop;
+                parentTable = closest(parentTable.parentElement, 'table');
+            }
+        }
+        else {
+            targetOffsetTop = (target.classList.contains("e-rte-audio")) ? target.parentElement.offsetTop : target.offsetTop;
+        }
         var parentOffsetTop = window.pageYOffset + e.parentData.top;
         if ((targetOffsetTop - e.editTop) > e.popHeight) {
             y = parentOffsetTop + e.tBarElementHeight + (targetOffsetTop - e.editTop) - e.popHeight - 5;
@@ -91,11 +102,30 @@ var BaseQuickToolbar = /** @class */ (function () {
             y = e.y;
         }
         target = isAligned ? e.target : target;
-        if (target.offsetWidth > e.popWidth) {
-            x = (target.offsetWidth / 2) - (e.popWidth / 2) + e.parentData.left + target.offsetLeft;
+        var targetOffsetLeft;
+        var currentOffsetWidth;
+        if (!isNOU(closest(target, 'table'))) {
+            targetOffsetLeft = target.offsetLeft;
+            var parentTable = closest(target, 'table');
+            var checkOffSetParentWidth = false;
+            if (!isNOU(closest(parentTable, 'TD'))) {
+                checkOffSetParentWidth = true;
+            }
+            while (!isNOU(parentTable)) {
+                targetOffsetLeft += parentTable.offsetLeft;
+                currentOffsetWidth = checkOffSetParentWidth ? parentTable.offsetWidth : target.offsetWidth;
+                parentTable = closest(parentTable.parentElement, 'table');
+            }
         }
         else {
-            x = e.parentData.left + target.offsetLeft;
+            currentOffsetWidth = target.offsetWidth;
+            targetOffsetLeft = (target.classList.contains("e-rte-audio")) ? target.parentElement.offsetLeft : target.offsetLeft;
+        }
+        if (currentOffsetWidth > e.popWidth) {
+            x = (currentOffsetWidth / 2) - (e.popWidth / 2) + e.parentData.left + targetOffsetLeft;
+        }
+        else {
+            x = e.parentData.left + targetOffsetLeft;
         }
         this.popupObj.position.X = ((x + e.popWidth) > e.parentData.right) ? e.parentData.right - e.popWidth : x;
         this.popupObj.position.Y = (y >= 0) ? y : e.y + 5;
@@ -186,7 +216,7 @@ var BaseQuickToolbar = /** @class */ (function () {
      * @param {string} type - specifies the type
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseQuickToolbar.prototype.showPopup = function (x, y, target, type) {
         var _this = this;
@@ -223,6 +253,9 @@ var BaseQuickToolbar = /** @class */ (function () {
                     _this.parent.disableToolbarItem(_this.parent.toolbarSettings.items);
                     _this.parent.enableToolbarItem(['Undo', 'Redo']);
                 }
+                else {
+                    _this.parent.enableToolbarItem(_this.parent.toolbarSettings.items);
+                }
                 append([_this.element], document.body);
                 if (_this.parent.showTooltip) {
                     _this.tooltip = new Tooltip({
@@ -230,7 +263,8 @@ var BaseQuickToolbar = /** @class */ (function () {
                         openDelay: 400,
                         showTipPointer: true,
                         windowCollision: true,
-                        position: 'BottomCenter'
+                        position: 'BottomCenter',
+                        cssClass: _this.parent.getCssClass()
                     });
                     _this.tooltip.appendTo(_this.element);
                 }
@@ -264,9 +298,9 @@ var BaseQuickToolbar = /** @class */ (function () {
                     parentData: parent_1.getBoundingClientRect(),
                     tBarElementHeight: tBarHeight
                 };
-                if (target.tagName === 'IMG' || target.tagName === 'AUDIO' || target.tagName === 'VIDEO' || target.tagName === 'IFRAME' || (target.classList &&
+                if ((closest(target, 'TABLE') || target.tagName === 'IMG' || target.tagName === 'AUDIO' || target.tagName === 'VIDEO' || target.tagName === 'IFRAME' || (target.classList &&
                     (target.classList.contains(classes.CLS_AUDIOWRAP) || target.classList.contains(classes.CLS_CLICKELEM) ||
-                        target.classList.contains(classes.CLS_VID_CLICK_ELEM)))) {
+                        target.classList.contains(classes.CLS_VID_CLICK_ELEM)))) && (x == beforeQuickToolbarArgs.positionX || y == beforeQuickToolbarArgs.positionY)) {
                     _this.setPosition(showPopupData);
                 }
                 if (!_this.parent.inlineMode.enable) {
@@ -284,7 +318,7 @@ var BaseQuickToolbar = /** @class */ (function () {
                     maxWidth: window.outerWidth + 'px'
                 });
                 addClass([_this.element], [classes.CLS_POP]);
-                _this.isDOMElement = true;
+                _this.isRendered = true;
             }
         });
     };
@@ -293,7 +327,7 @@ var BaseQuickToolbar = /** @class */ (function () {
      *
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseQuickToolbar.prototype.hidePopup = function () {
         var viewSourcePanel = this.parent.sourceCodeModule.getViewPanel();
@@ -320,15 +354,18 @@ var BaseQuickToolbar = /** @class */ (function () {
                 this.parent.enableToolbarItem(this.parent.toolbarSettings.items);
             }
         }
+        if (this.parent.showTooltip && !isNOU(document.querySelector('.e-tooltip-wrap'))) {
+            this.parent.notify(events.destroyTooltip, { args: event });
+        }
         this.removeEleFromDOM();
-        this.isDOMElement = false;
+        this.isRendered = false;
     };
     /**
      * @param {string} item - specifies the string value
      * @param {number} index - specifies the index value
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseQuickToolbar.prototype.addQTBarItem = function (item, index) {
         this.quickTBarObj.toolbarObj.addItems(this.quickTBarObj.getItems(item, 'toolbar'), index);
@@ -337,14 +374,14 @@ var BaseQuickToolbar = /** @class */ (function () {
      * @param {number} index - specifies the index value
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseQuickToolbar.prototype.removeQTBarItem = function (index) {
         this.quickTBarObj.toolbarObj.removeItems(index);
     };
     BaseQuickToolbar.prototype.removeEleFromDOM = function () {
         var element = this.popupObj.element;
-        if (this.isDOMElement) {
+        if (this.isRendered) {
             this.dropDownButtons.destroyDropDowns();
             this.colorPickerObj.destroyColorPicker();
             removeClass([this.element], [classes.CLS_POP]);
@@ -383,7 +420,7 @@ var BaseQuickToolbar = /** @class */ (function () {
      * @function destroy
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseQuickToolbar.prototype.destroy = function () {
         if (this.popupObj && !this.popupObj.isDestroyed) {
@@ -397,7 +434,7 @@ var BaseQuickToolbar = /** @class */ (function () {
      *
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseQuickToolbar.prototype.addEventListener = function () {
         if (this.parent.isDestroyed) {
@@ -415,7 +452,7 @@ var BaseQuickToolbar = /** @class */ (function () {
      * @param {RichTextEditorModel} e - specifies the model element
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseQuickToolbar.prototype.onPropertyChanged = function (e) {
         if (!isNullOrUndefined(e.newProp.inlineMode)) {
@@ -439,7 +476,7 @@ var BaseQuickToolbar = /** @class */ (function () {
      *
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseQuickToolbar.prototype.removeEventListener = function () {
         if (this.parent.isDestroyed) {

package/src/rich-text-editor/actions/base-toolbar.d.ts

@@ -32,7 +32,7 @@ export declare class BaseToolbar {
      * @param {string} container - specifies the value of string
      * @returns {IToolbarItemModel} - returns the model element
      * @hidden
-
+     * @deprecated
      */
     getObject(item: string, container: string): IToolbarItemModel;
     /**
@@ -40,7 +40,7 @@ export declare class BaseToolbar {
      * @param {string} container - specifies the container value
      * @returns {ItemModel} - retunrs the model element
      * @hidden
-
+     * @deprecated
      */
     getItems(tbItems: (string | IToolbarItems)[], container: string): ItemModel[];
     private getToolbarOptions;
@@ -50,7 +50,7 @@ export declare class BaseToolbar {
      * @param {IToolbarRenderOptions} args - specifies the toolbar options
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     render(args: IToolbarRenderOptions): void;
 }

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

@@ -1,9 +1,9 @@
 import { RenderType } from '../base/enum';
 import { CLS_HR_SEPARATOR } from '../base/classes';
 import * as events from '../base/constant';
-import { getTooltipText, isIDevice, toObjectLowerCase } from '../base/util';
+import { getTooltipText, toObjectLowerCase } from '../base/util';
 import { tools, templateItems, windowKeys } from '../models/items';
-import { isNullOrUndefined, extend, Browser } from '@syncfusion/ej2-base';
+import { isNullOrUndefined, extend } from '@syncfusion/ej2-base';
 /**
  * `Toolbar` module is used to handle Toolbar actions.
  */
@@ -93,7 +93,7 @@ var BaseToolbar = /** @class */ (function () {
      * @param {string} container - specifies the value of string
      * @returns {IToolbarItemModel} - returns the model element
      * @hidden
-
+     * @deprecated
      */
     BaseToolbar.prototype.getObject = function (item, container) {
         var itemStr = item.toLowerCase();
@@ -107,23 +107,13 @@ var BaseToolbar = /** @class */ (function () {
                 case '-':
                     return { type: 'Separator', cssClass: CLS_HR_SEPARATOR };
                 default:
-                    if (this.parent.showTooltip) {
-                        return {
-                            id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
-                            prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
-                            tooltipText: getTooltipText(itemStr, this.locator),
-                            command: this.tools[itemStr.toLocaleLowerCase()].command,
-                            subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
-                        };
-                    }
-                    else {
-                        return {
-                            id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
-                            prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
-                            command: this.tools[itemStr.toLocaleLowerCase()].command,
-                            subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
-                        };
-                    }
+                    return {
+                        id: this.parent.getID() + '_' + container + '_' + this.tools[itemStr.toLocaleLowerCase()].id,
+                        prefixIcon: this.tools[itemStr.toLocaleLowerCase()].icon,
+                        tooltipText: getTooltipText(itemStr, this.locator),
+                        command: this.tools[itemStr.toLocaleLowerCase()].command,
+                        subCommand: this.tools[itemStr.toLocaleLowerCase()].subCommand
+                    };
             }
         }
     };
@@ -132,7 +122,7 @@ var BaseToolbar = /** @class */ (function () {
      * @param {string} container - specifies the container value
      * @returns {ItemModel} - retunrs the model element
      * @hidden
-
+     * @deprecated
      */
     BaseToolbar.prototype.getItems = function (tbItems, container) {
         var _this = this;
@@ -154,10 +144,14 @@ var BaseToolbar = /** @class */ (function () {
                                 _this.parent.formatter.saveData();
                             }
                             callback_1.call(_this);
-                            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 (_this.parent.formatter.getUndoRedoStack().length > 0) {
+                                var currentContentElem = _this.parent.createElement('div');
+                                var stackItem = _this.parent.formatter.getUndoRedoStack()[_this.parent.formatter.getUndoRedoStack().length - 1];
+                                var clonedItem = (stackItem.text).cloneNode(true);
+                                currentContentElem.appendChild(clonedItem);
+                                if (currentContentElem.innerHTML.trim() === _this.parent.inputElement.innerHTML.trim()) {
+                                    return;
+                                }
                             }
                             if (proxy_1.undo) {
                                 _this.parent.formatter.saveData();
@@ -172,17 +166,21 @@ var BaseToolbar = /** @class */ (function () {
             var item = tbItems_1[_i];
             _loop_1(item);
         }
-        for (var num = 0; num < items.length; num++) {
-            var tooltipText = items[num].tooltipText;
-            var shortCutKey = void 0;
-            if (windowKeys["" + tooltipText]) {
-                shortCutKey = Browser.isDevice && isIDevice() ? windowKeys["" + tooltipText].replace('Ctrl', 'Cmd') : windowKeys["" + tooltipText];
-            }
-            else {
-                shortCutKey = tooltipText;
-            }
-            if (shortCutKey) {
-                items[num].tooltipText = (tooltipText !== shortCutKey) ? tooltipText + ' (' + shortCutKey + ')' : tooltipText;
+        if (this.parent.showTooltip) {
+            for (var num = 0; num < items.length; num++) {
+                var tooltipText = items[num].tooltipText;
+                var shortCutKey = void 0;
+                if (windowKeys["" + tooltipText]) {
+                    shortCutKey = window.navigator.platform.toLocaleLowerCase().includes('mac') ? windowKeys["" + tooltipText].replace('Ctrl', 'Cmd') : windowKeys["" + tooltipText];
+                }
+                else {
+                    shortCutKey = tooltipText;
+                }
+                if (shortCutKey) {
+                    if (!(items[num].command === "Images" && items[num].subCommand === "InsertLink")) {
+                        items[num].tooltipText = (tooltipText !== shortCutKey) ? tooltipText + ' (' + shortCutKey + ')' : tooltipText;
+                    }
+                }
             }
         }
         return items;
@@ -204,7 +202,7 @@ var BaseToolbar = /** @class */ (function () {
      * @param {IToolbarRenderOptions} args - specifies the toolbar options
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     BaseToolbar.prototype.render = function (args) {
         this.toolbarRenderer = this.renderFactory.getRenderer(RenderType.Toolbar);

package/src/rich-text-editor/actions/color-picker.d.ts

@@ -23,7 +23,7 @@ export declare class ColorPickerInput {
      * @param {IColorPickerRenderArgs} args - specify the arguments.
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     renderColorPickerInput(args: IColorPickerRenderArgs): void;
     private destroy;
@@ -32,13 +32,14 @@ export declare class ColorPickerInput {
      *
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     destroyColorPicker(): void;
     private setRtl;
     private setCssClass;
     private updateCss;
     protected addEventListener(): void;
+    private showColorPicker;
     private onPropertyChanged;
     protected removeEventListener(): void;
 }

package/src/rich-text-editor/actions/color-picker.js

@@ -30,7 +30,7 @@ var ColorPickerInput = /** @class */ (function () {
      * @param {IColorPickerRenderArgs} args - specify the arguments.
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     ColorPickerInput.prototype.renderColorPickerInput = function (args) {
         var _this = this;
@@ -112,7 +112,7 @@ var ColorPickerInput = /** @class */ (function () {
      *
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     ColorPickerInput.prototype.destroyColorPicker = function () {
         if (this.fontColorPicker && !this.fontColorPicker.isDestroyed) {
@@ -170,6 +170,15 @@ var ColorPickerInput = /** @class */ (function () {
         this.parent.on(events.destroyColorPicker, this.destroyColorPicker, this);
         this.parent.on(events.modelChanged, this.onPropertyChanged, this);
         this.parent.on(events.bindCssClass, this.setCssClass, this);
+        this.parent.on(events.showColorPicker, this.showColorPicker, this);
+    };
+    ColorPickerInput.prototype.showColorPicker = function (e) {
+        if (!isNullOrUndefined(this.fontColorPicker) && (e.toolbarClick === "fontcolor")) {
+            this.fontColorDropDown.toggle();
+        }
+        else if (!isNullOrUndefined(this.backgroundColorPicker) && (e.toolbarClick === "backgroundcolor")) {
+            this.backgroundColorDropDown.toggle();
+        }
     };
     ColorPickerInput.prototype.onPropertyChanged = function (model) {
         var newProp = model.newProp;
@@ -243,6 +252,7 @@ var ColorPickerInput = /** @class */ (function () {
         this.parent.off(events.destroyColorPicker, this.destroyColorPicker);
         this.parent.off(events.modelChanged, this.onPropertyChanged);
         this.parent.off(events.bindCssClass, this.setCssClass);
+        this.parent.off(events.showColorPicker, this.showColorPicker);
     };
     return ColorPickerInput;
 }());

package/src/rich-text-editor/actions/count.d.ts

@@ -22,7 +22,7 @@ export declare class Count {
      *
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     renderCount(): void;
     private appendCount;
@@ -30,7 +30,7 @@ export declare class Count {
     /**
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     refresh(): void;
     /**
@@ -39,7 +39,7 @@ export declare class Count {
      * @function destroy
      * @returns {void}
      * @hidden
-
+     * @deprecated
      */
     destroy(): void;
     private toggle;