@syncfusion/ej2-richtexteditor 22.2.12 → 23.1.39

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

@@ -314,7 +314,7 @@ export interface RichTextEditorModel extends ComponentModel{
     /**
      * Specify the value whether tooltip will be displayed for the Rich Text Editor toolbar.
      *
-     * @default false.
+     * @default true.
      */
     showTooltip?: boolean;
 
@@ -685,7 +685,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Set the cancel argument to true to cancel the command execution.
      *
      * @event 'actionBegin'
-     * @blazorProperty 'OnActionBegin'
      */
     actionBegin?: EmitType<ActionBeginEventArgs>;
 
@@ -693,7 +692,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers after command execution using toolbar items or executeCommand method.
      *
      * @event 'actionComplete'
-     * @blazorProperty 'OnActionComplete'
      */
     actionComplete?: EmitType<ActionCompleteEventArgs>;
 
@@ -703,8 +701,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Set the cancel argument to true to cancel the open of a dialog.
      *
      * @event 'beforeDialogOpen'
-     * @blazorProperty 'OnDialogOpen'
-     * @blazorType Syncfusion.EJ2.Blazor.Popups.BeforeOpenEventArgs
      */
 
     beforeDialogOpen?: EmitType<BeforeOpenEventArgs>;
@@ -713,8 +709,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers when a dialog is opened.
      *
      * @event 'dialogOpen'
-     * @blazorProperty 'DialogOpened'
-     * @blazorType DialogOpenEventArgs
      */
     dialogOpen?: EmitType<Object>;
 
@@ -724,8 +718,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Set the cancel argument to true to prevent closing a dialog.
      *
      * @event 'beforeDialogClose'
-     * @blazorProperty 'OnDialogClose'
-     * @blazorType Syncfusion.EJ2.Blazor.Popups.BeforeOpenEventArgs
      */
     beforeDialogClose?: EmitType<BeforeCloseEventArgs>;
 
@@ -733,8 +725,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers after the dialog has been closed.
      *
      * @event 'dialogClose'
-     * @blazorProperty 'DialogClosed'
-     * @blazorType DialogCloseEventArgs
      */
     dialogClose?: EmitType<Object>;
 
@@ -742,7 +732,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers when the quick toolbar is being opened.
      *
      * @event 'beforeQuickToolbarOpen'
-     * @blazorProperty 'OnQuickToolbarOpen'
      */
     beforeQuickToolbarOpen?: EmitType<BeforeQuickToolbarOpenArgs>;
 
@@ -750,8 +739,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers when a quick toolbar is opened.
      *
      * @event 'quickToolbarOpen'
-     * @blazorProperty 'QuickToolbarOpened'
-     * @blazorType QuickToolbarEventArgs
      */
     quickToolbarOpen?: EmitType<Object>;
 
@@ -759,8 +746,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers after the quick toolbar has been closed.
      *
      * @event 'quickToolbarClose'
-     * @blazorProperty 'QuickToolbarClosed'
-     * @blazorType QuickToolbarEventArgs
      */
     quickToolbarClose?: EmitType<Object>;
 
@@ -776,7 +761,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers when the toolbar items status is updated.
      *
      * @event 'updatedToolbarStatus'
-     * @blazorType ToolbarUpdateEventArgs
      */
     updatedToolbarStatus?: EmitType<ToolbarStatusEventArgs>;
 
@@ -784,7 +768,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers when the image is selected or dragged into the insert image dialog.
      *
      * @event 'imageSelected'
-     * @blazorProperty 'OnImageSelected'
      */
     imageSelected?: EmitType<SelectedEventArgs>;
 
@@ -799,7 +782,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers when the selected image begins to upload in the insert image dialog.
      *
      * @event 'imageUploading'
-     * @blazorProperty 'OnImageUploading'
      */
     imageUploading?: EmitType<UploadingEventArgs>;
 
@@ -807,8 +789,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers when the image is successfully uploaded to the server side.
      *
      * @event 'imageUploadSuccess'
-     * @blazorProperty 'OnImageUploadSuccess'
-     * @blazorType ImageSuccessEventArgs
      */
     imageUploadSuccess?: EmitType<Object>;
 
@@ -816,8 +796,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers when there is an error in the image upload.
      *
      * @event 'imageUploadFailed'
-     * @blazorProperty 'OnImageUploadFailed'
-     * @blazorType ImageFailedEventArgs
      */
     imageUploadFailed?: EmitType<Object>;
 
@@ -825,7 +803,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers when the selected image is cleared from the insert image dialog.
      *
      * @event 'imageRemoving'
-     * @blazorProperty 'OnImageRemoving'
      */
     imageRemoving?: EmitType<RemovingEventArgs>;
 
@@ -833,7 +810,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers when the selected image is cleared from the Rich Text Editor Content.
      *
      * @event 'afterImageDelete'
-     * @blazorProperty 'OnImageDelete'
      */
     afterImageDelete?: EmitType<AfterImageDeleteEventArgs>;
 
@@ -890,7 +866,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers when the Rich Text Editor is rendered.
      *
      * @event 'created'
-     * @blazorProperty 'Created'
      */
     created?: EmitType<Object>;
 
@@ -898,8 +873,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers when the Rich Text Editor is destroyed.
      *
      * @event 'destroyed'
-     * @blazorProperty 'Destroyed'
-     * @blazorType DestroyedEventArgs
      */
     destroyed?: EmitType<Object>;
 
@@ -907,7 +880,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Event triggers before sanitize the value. It's only applicable to editorMode as `HTML`.
      *
      * @event 'beforeSanitizeHtml'
-     * @blazorProperty 'OnSanitizeHtml'
      */
     beforeSanitizeHtml?: EmitType<BeforeSanitizeHtmlArgs>;
 
@@ -915,7 +887,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers when Rich Text Editor is focused out.
      *
      * @event 'blur'
-     * @blazorType BlurEventArgs
      */
     blur?: EmitType<Object>;
 
@@ -923,8 +894,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers when Rich Text Editor Toolbar items is clicked.
      *
      * @event 'toolbarClick'
-     * @blazorProperty 'OnToolbarClick'
-     * @blazorType ToolbarClickEventArgs
      */
     toolbarClick?: EmitType<Object>;
 
@@ -932,7 +901,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers when Rich Text Editor is focused in
      *
      * @event 'focus'
-     * @blazorType FocusEventArgs
      */
     focus?: EmitType<Object>;
 
@@ -940,7 +908,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers only when Rich Text Editor is blurred and changes are done to the content.
      *
      * @event 'change'
-     * @blazorProperty 'ValueChange'
      */
     change?: EmitType<ChangeEventArgs>;
 
@@ -948,7 +915,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers only when resizing the image.
      *
      * @event 'resizing'
-     * @blazorProperty 'Resizing'
      */
     resizing?: EmitType<ResizeArgs>;
 
@@ -956,7 +922,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers only when start resize the image.
      *
      * @event 'resizeStart'
-     * @blazorProperty 'OnResizeStart'
      */
     resizeStart?: EmitType<ResizeArgs>;
 
@@ -964,7 +929,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers only when stop resize the image.
      *
      * @event 'resizeStop'
-     * @blazorProperty 'OnResizeStop'
      */
     resizeStop?: EmitType<ResizeArgs>;
 
@@ -986,7 +950,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * Triggers before drop the image.
      *
      * @event 'beforeImageDrop'
-     * @blazorProperty 'OnImageDrop'
      */
     beforeImageDrop?: EmitType<ImageDropEventArgs>;
 
@@ -996,7 +959,6 @@ export interface RichTextEditorModel extends ComponentModel{
      * {% codeBlock src='rich-text-editor/formatter/index.md' %}{% endcodeBlock %}
      *
      * @default null
-     * @blazorType object
      */
     formatter?: IFormatter;
 

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

@@ -484,7 +484,7 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
     /**
      * Specify the value whether tooltip will be displayed for the Rich Text Editor toolbar.
      *
-     * @default false.
+     * @default true.
      */
     showTooltip: boolean;
     /**
@@ -827,14 +827,12 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
      * Set the cancel argument to true to cancel the command execution.
      *
      * @event 'actionBegin'
-     * @blazorProperty 'OnActionBegin'
      */
     actionBegin: EmitType<ActionBeginEventArgs>;
     /**
      * Triggers after command execution using toolbar items or executeCommand method.
      *
      * @event 'actionComplete'
-     * @blazorProperty 'OnActionComplete'
      */
     actionComplete: EmitType<ActionCompleteEventArgs>;
     /**
@@ -843,16 +841,12 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
      * Set the cancel argument to true to cancel the open of a dialog.
      *
      * @event 'beforeDialogOpen'
-     * @blazorProperty 'OnDialogOpen'
-     * @blazorType Syncfusion.EJ2.Blazor.Popups.BeforeOpenEventArgs
      */
     beforeDialogOpen: EmitType<BeforeOpenEventArgs>;
     /**
      * Event triggers when a dialog is opened.
      *
      * @event 'dialogOpen'
-     * @blazorProperty 'DialogOpened'
-     * @blazorType DialogOpenEventArgs
      */
     dialogOpen: EmitType<Object>;
     /**
@@ -861,39 +855,30 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
      * Set the cancel argument to true to prevent closing a dialog.
      *
      * @event 'beforeDialogClose'
-     * @blazorProperty 'OnDialogClose'
-     * @blazorType Syncfusion.EJ2.Blazor.Popups.BeforeOpenEventArgs
      */
     beforeDialogClose: EmitType<BeforeCloseEventArgs>;
     /**
      * Event triggers after the dialog has been closed.
      *
      * @event 'dialogClose'
-     * @blazorProperty 'DialogClosed'
-     * @blazorType DialogCloseEventArgs
      */
     dialogClose: EmitType<Object>;
     /**
      * Event triggers when the quick toolbar is being opened.
      *
      * @event 'beforeQuickToolbarOpen'
-     * @blazorProperty 'OnQuickToolbarOpen'
      */
     beforeQuickToolbarOpen: EmitType<BeforeQuickToolbarOpenArgs>;
     /**
      * Event triggers when a quick toolbar is opened.
      *
      * @event 'quickToolbarOpen'
-     * @blazorProperty 'QuickToolbarOpened'
-     * @blazorType QuickToolbarEventArgs
      */
     quickToolbarOpen: EmitType<Object>;
     /**
      * Event triggers after the quick toolbar has been closed.
      *
      * @event 'quickToolbarClose'
-     * @blazorProperty 'QuickToolbarClosed'
-     * @blazorType QuickToolbarEventArgs
      */
     quickToolbarClose: EmitType<Object>;
     /**
@@ -907,14 +892,12 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
      * Triggers when the toolbar items status is updated.
      *
      * @event 'updatedToolbarStatus'
-     * @blazorType ToolbarUpdateEventArgs
      */
     updatedToolbarStatus: EmitType<ToolbarStatusEventArgs>;
     /**
      * Event triggers when the image is selected or dragged into the insert image dialog.
      *
      * @event 'imageSelected'
-     * @blazorProperty 'OnImageSelected'
      */
     imageSelected: EmitType<SelectedEventArgs>;
     /**
@@ -927,37 +910,30 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
      * Event triggers when the selected image begins to upload in the insert image dialog.
      *
      * @event 'imageUploading'
-     * @blazorProperty 'OnImageUploading'
      */
     imageUploading: EmitType<UploadingEventArgs>;
     /**
      * Event triggers when the image is successfully uploaded to the server side.
      *
      * @event 'imageUploadSuccess'
-     * @blazorProperty 'OnImageUploadSuccess'
-     * @blazorType ImageSuccessEventArgs
      */
     imageUploadSuccess: EmitType<Object>;
     /**
      * Event triggers when there is an error in the image upload.
      *
      * @event 'imageUploadFailed'
-     * @blazorProperty 'OnImageUploadFailed'
-     * @blazorType ImageFailedEventArgs
      */
     imageUploadFailed: EmitType<Object>;
     /**
      * Event triggers when the selected image is cleared from the insert image dialog.
      *
      * @event 'imageRemoving'
-     * @blazorProperty 'OnImageRemoving'
      */
     imageRemoving: EmitType<RemovingEventArgs>;
     /**
      * Event triggers when the selected image is cleared from the Rich Text Editor Content.
      *
      * @event 'afterImageDelete'
-     * @blazorProperty 'OnImageDelete'
      */
     afterImageDelete: EmitType<AfterImageDeleteEventArgs>;
     /**
@@ -1006,72 +982,60 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
      * Triggers when the Rich Text Editor is rendered.
      *
      * @event 'created'
-     * @blazorProperty 'Created'
      */
     created: EmitType<Object>;
     /**
      * Triggers when the Rich Text Editor is destroyed.
      *
      * @event 'destroyed'
-     * @blazorProperty 'Destroyed'
-     * @blazorType DestroyedEventArgs
      */
     destroyed: EmitType<Object>;
     /**
      * Event triggers before sanitize the value. It's only applicable to editorMode as `HTML`.
      *
      * @event 'beforeSanitizeHtml'
-     * @blazorProperty 'OnSanitizeHtml'
      */
     beforeSanitizeHtml: EmitType<BeforeSanitizeHtmlArgs>;
     /**
      * Triggers when Rich Text Editor is focused out.
      *
      * @event 'blur'
-     * @blazorType BlurEventArgs
      */
     blur: EmitType<Object>;
     /**
      * Triggers when Rich Text Editor Toolbar items is clicked.
      *
      * @event 'toolbarClick'
-     * @blazorProperty 'OnToolbarClick'
-     * @blazorType ToolbarClickEventArgs
      */
     toolbarClick: EmitType<Object>;
     /**
      * Triggers when Rich Text Editor is focused in
      *
      * @event 'focus'
-     * @blazorType FocusEventArgs
      */
     focus: EmitType<Object>;
     /**
      * Triggers only when Rich Text Editor is blurred and changes are done to the content.
      *
      * @event 'change'
-     * @blazorProperty 'ValueChange'
      */
     change: EmitType<ChangeEventArgs>;
     /**
      * Triggers only when resizing the image.
      *
      * @event 'resizing'
-     * @blazorProperty 'Resizing'
      */
     resizing: EmitType<ResizeArgs>;
     /**
      * Triggers only when start resize the image.
      *
      * @event 'resizeStart'
-     * @blazorProperty 'OnResizeStart'
      */
     resizeStart: EmitType<ResizeArgs>;
     /**
      * Triggers only when stop resize the image.
      *
      * @event 'resizeStop'
-     * @blazorProperty 'OnResizeStop'
      */
     resizeStop: EmitType<ResizeArgs>;
     /**
@@ -1090,7 +1054,6 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
      * Triggers before drop the image.
      *
      * @event 'beforeImageDrop'
-     * @blazorProperty 'OnImageDrop'
      */
     beforeImageDrop: EmitType<ImageDropEventArgs>;
     /**
@@ -1099,7 +1062,6 @@ export declare class RichTextEditor extends Component<HTMLElement> implements IN
      * {% codeBlock src='rich-text-editor/formatter/index.md' %}{% endcodeBlock %}
      *
      * @default null
-     * @blazorType object
      */
     formatter: IFormatter;
     keyboardModule: KeyboardEvents;

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

@@ -749,7 +749,7 @@ var RichTextEditor = /** @class */ (function (_super) {
         }
         if (e.action !== 'insert-link' &&
             e.action !== 'format-copy' && e.action !== 'format-paste' &&
-            (!e.target || !e.target.classList.contains('e-mention')) &&
+            (!e.target || (e.target.classList.contains('e-mention') && e.code !== 'Tab')) &&
             (e.action && e.action !== 'paste' && e.action !== 'space'
                 || e.which === 9 || (e.code === 'Backspace' && e.which === 8))) {
             var FormatPainterEscapeAction = false;
@@ -1055,6 +1055,8 @@ var RichTextEditor = /** @class */ (function (_super) {
                 this.toolbarModule.destroy();
             }
             this.notify(events.moduleDestroy, {});
+            _super.prototype.destroy.call(this);
+            this.isRendered = false;
             return;
         }
         this.notify(events.destroy, {});
@@ -1108,9 +1110,6 @@ var RichTextEditor = /** @class */ (function (_super) {
         this.removeAttributes();
         _super.prototype.destroy.call(this);
         this.isRendered = false;
-        if (this.enablePersistence) {
-            window.localStorage.removeItem(this.getModuleName() + this.element.id);
-        }
     };
     RichTextEditor.prototype.removeHtmlAttributes = function () {
         if (this.htmlAttributes) {
@@ -1240,9 +1239,10 @@ var RichTextEditor = /** @class */ (function (_super) {
                     else {
                         nVal = newProp[prop];
                     }
+                    nVal = this.serializeValue(nVal);
                     var val = this.editorMode === 'HTML' ? getEditValue(nVal, this) : nVal;
                     if ((!isNOU(nVal) && nVal !== '') || prop === 'enterKey') {
-                        this.value = this.serializeValue(((this.enableHtmlEncode) ? this.encode(decode(val)) : val));
+                        this.setProperties({ value: ((this.enableHtmlEncode) ? this.encode(decode(val)) : val) }, true);
                     }
                     this.updatePanelValue();
                     if (this.inputElement) {
@@ -1790,10 +1790,6 @@ var RichTextEditor = /** @class */ (function (_super) {
         // eslint-disable-next-line
         var imgPadding = 12;
         var imgResizeBorder = 2;
-        if (isNOU(this.contentModule) || isNOU(this.contentModule.getEditPanel())) {
-            EventHandler.remove(this.contentModule.getDocument(), Browser.touchMoveEvent, this.imageModule.resizing);
-            return maxWidth;
-        }
         var editEle = this.contentModule.getEditPanel();
         var eleStyle = window.getComputedStyle(editEle);
         var editEleMaxWidth = editEle.offsetWidth - (imgPadding + imgResizeBorder +
@@ -1860,13 +1856,17 @@ var RichTextEditor = /** @class */ (function (_super) {
                 heightValue = heightPercent && rteHeightPercent ? rteHeightPercent : rteHeight - (tbHeight + rzHeight) + 'px';
             }
         }
-        if (target !== 'windowResize') {
+        if (target !== 'windowResize' || heightPercent) {
             if (this.iframeSettings.enable) {
                 if (heightValue !== 'auto') {
                     setStyleAttribute(cntEle, { height: heightValue, marginTop: topValue + 'px' });
                 }
             }
             else {
+                if (target === 'windowResize' && heightPercent) {
+                    // cntEle hide the borderBottom of RichTextEditor. so removed the 2px of cntEle height. 
+                    heightValue = parseInt(heightValue) - 2 + 'px';
+                }
                 setStyleAttribute(cntEle, { height: heightValue, marginTop: topValue + 'px' });
             }
         }
@@ -2075,6 +2075,10 @@ var RichTextEditor = /** @class */ (function (_super) {
             this.toolbarModule.refreshToolbarOverflow();
             isExpand = this.toolbarModule.baseToolbar.toolbarObj.element.classList.contains(classes.CLS_EXPAND_OPEN);
         }
+        if (this.iframeSettings.enable !== true) {
+            // When resize the window,border bottom of cntEle and this.element border visible separatly.so none the cntEle borderBottom.
+            this.contentModule.getPanel().style.borderBottom = 'none';
+        }
         this.setContentHeight('windowResize', isExpand);
         this.notify(events.windowResize, null);
     };

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

@@ -163,7 +163,7 @@ export function setToolbarStatus(e, isPopToolbar, self) {
                     }
                 }
                 else if ((typeof data["" + key] === 'string' || data["" + key] === null) &&
-                    getIndex(key, e.parent.toolbarSettings.items) > -1) {
+                    getIndex(key, e.parent.toolbarSettings.items) >= -1) {
                     var value = ((data["" + key]) ? data["" + key] : '');
                     var result = '';
                     switch (key) {
@@ -228,6 +228,10 @@ export function setToolbarStatus(e, isPopToolbar, self) {
                             dropDown.fontSizeDropDown.dataBind();
                             break;
                         }
+                        case 'bulletFormatList':
+                        case 'numberFormatList': {
+                            removeClass([e.tbElements[j]], [classes.CLS_ACTIVE]);
+                        }
                     }
                 }
             }

package/src/rich-text-editor/models/items.js

@@ -755,29 +755,41 @@ export function updateDropDownLocale(self) {
     });
 }
 export var windowKeys = {
-    'Insert Link': 'Ctrl + K',
-    'Insert Image': 'Ctrl + Shift + I',
-    'Create Table': 'Ctrl + Shift + E',
-    'Undo': 'Ctrl + Z',
-    'Redo': 'Ctrl + Y',
-    'Copy': 'Ctrl + C',
-    'Cut': 'Ctrl + X',
-    'Paste': 'Ctrl + V',
-    'Bold': 'Ctrl + B',
-    'Italic': 'Ctrl + I',
-    'Underline': 'Ctrl + U',
-    'Strikethrough': 'Ctrl + Shift + S',
-    'Upper Case': 'Ctrl + Shift + U',
-    'Lower Case': 'Ctrl + Shift + L',
-    'Superscript': 'Ctrl + Shift + =',
-    'Subscript': 'Ctrl + =',
-    'Source Code': 'Ctrl + Shift + H',
-    'Maximize': 'Ctrl + Shift + F',
+    'Insert Link': 'Ctrl+K',
+    'Insert Image': 'Ctrl+Shift+I',
+    'Create Table': 'Ctrl+Shift+E',
+    'Undo': 'Ctrl+Z',
+    'Redo': 'Ctrl+Y',
+    'Copy': 'Ctrl+C',
+    'Cut': 'Ctrl+X',
+    'Paste': 'Ctrl+V',
+    'Bold': 'Ctrl+B',
+    'Italic': 'Ctrl+I',
+    'Underline': 'Ctrl+U',
+    'Strikethrough': 'Ctrl+Shift+S',
+    'Upper Case': 'Ctrl+Shift+U',
+    'Lower Case': 'Ctrl+Shift+L',
+    'Superscript': 'Ctrl+Shift+=',
+    'Subscript': 'Ctrl+=',
+    'Code View': 'Ctrl+Shift+H',
+    'Maximize': 'Ctrl+Shift+F',
     'Minimize': 'Esc',
-    'Clear Format': 'Ctrl + Shift + R',
-    'Numbered List': 'Ctrl + Shift + O',
-    'Bulleted List': 'Ctrl + Alt + O',
-    'Format Painter': 'Alt + Shift + C, Alt + Shift + V'
+    'Clear Format': 'Ctrl+Shift+R',
+    'Numbered List': 'Ctrl+Shift+O',
+    'Bulleted List': 'Ctrl+Alt+O',
+    'Number Format List': 'Ctrl+Shift+O',
+    'Bullet Format List': 'Ctrl+Alt+O',
+    'Insert Audio': 'Ctrl+Shift+A',
+    'Insert Video': 'Ctrl+Shift+V',
+    'Increase Indent': 'Ctrl+]',
+    'Decrease Indent': 'Ctrl+[',
+    'Decrease Fontsize': 'Ctrl+Shift+<',
+    'Increase Fontsize': 'Ctrl+Shift+>',
+    'Justify Center': 'Ctrl+E',
+    'Justify Full': 'Ctrl+J',
+    'Justify Left': 'Ctrl+L',
+    'Justify Right': 'Ctrl+R',
+    'Format Painter': 'Alt+Shift+C, Alt+Shift+V'
 };
 export var defaultEmojiIcons = [{
         name: 'Smilies & People', code: '1F600', iconCss: 'e-emoji', icons: [{ code: '1F600', desc: 'Grinning face' },

package/src/rich-text-editor/models/toolbar-settings-model.d.ts

@@ -1,4 +1,4 @@
-import { Property, ChildProperty, Complex, Event, EmitType } from '@syncfusion/ej2-base';import { AjaxSettings, AjaxSettingsModel, ContextMenuSettings, ContextMenuSettingsModel, BeforeSendEventArgs } from '@syncfusion/ej2-filemanager';import { DetailsViewSettings, DetailsViewSettingsModel, NavigationPaneSettings } from '@syncfusion/ej2-filemanager';import { NavigationPaneSettingsModel, SearchSettings, SearchSettingsModel, SortOrder } from '@syncfusion/ej2-filemanager';import { ToolbarSettingsModel as FileToolbarSettingsModel, ToolbarSettings as FileToolbarSettings } from '@syncfusion/ej2-filemanager';import { UploadSettings, UploadSettingsModel, ViewType } from '@syncfusion/ej2-filemanager';import { SaveFormat, DisplayLayoutOptions } from '../../common';import { ToolbarType, ActionOnScroll, ToolbarItems } from '../base/enum';import { IToolbarItems, IDropDownItemModel, ColorModeType, IToolsItemConfigs, IListDropDownModel, EmojiIconsSet } from '../base/interface';import { backgroundColor, fontColor, fontFamily, fontSize, formatItems, predefinedItems, TableStyleItems, numberFormatList, bulletFormatList, defaultEmojiIcons } from './items';
+import { Property, ChildProperty, Complex, Event, EmitType } from '@syncfusion/ej2-base';import { AjaxSettings, AjaxSettingsModel, ContextMenuSettings, ContextMenuSettingsModel, BeforeSendEventArgs } from '@syncfusion/ej2-filemanager';import { DetailsViewSettings, DetailsViewSettingsModel, NavigationPaneSettings } from '@syncfusion/ej2-filemanager';import { NavigationPaneSettingsModel, SearchSettings, SearchSettingsModel, SortOrder } from '@syncfusion/ej2-filemanager';import { ToolbarSettingsModel as FileToolbarSettingsModel, ToolbarSettings as FileToolbarSettings } from '@syncfusion/ej2-filemanager';import { UploadSettings, UploadSettingsModel, ViewType } from '@syncfusion/ej2-filemanager';import { SaveFormat, DisplayLayoutOptions } from '../../common';import { ToolbarType, ActionOnScroll, ToolbarItems, ToolbarConfigItems } from '../base/enum';import { IToolbarItems, IDropDownItemModel, ColorModeType, IToolsItemConfigs, IListDropDownModel, EmojiIconsSet } from '../base/interface';import { backgroundColor, fontColor, fontFamily, fontSize, formatItems, predefinedItems, TableStyleItems, numberFormatList, bulletFormatList, defaultEmojiIcons } from './items';
 
 /**
  * Interface for a class ToolbarSettings
@@ -36,7 +36,7 @@ export interface ToolbarSettingsModel {
      * @default ['Bold', 'Italic', 'Underline', '|', 'Formats', 'Alignments', 'OrderedList',
      * 'UnorderedList', '|', 'CreateLink', 'Image', '|', 'SourceCode', 'Undo', 'Redo']
      */
-    items?: (string | IToolbarItems)[];
+    items?: (string |ToolbarConfigItems | IToolbarItems)[];
 
     /**
      * Using this property, Modify the default toolbar item configuration like icon class.
@@ -570,10 +570,9 @@ export interface QuickToolbarSettingsModel {
     /**
      * Specifies the items to render in quick toolbar, when text selected.
      *
-     * @default ['Cut', 'Copy', 'Paste']
-
+     * @default null
      */
-    text?: (string | IToolbarItems)[];
+    text?: (string | ToolbarConfigItems | IToolbarItems)[];
 
     /**
      * Specifies the items to render in quick toolbar, when table selected.