@syncfusion/ej2-richtexteditor 26.1.35 → 26.1.40

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 26.1.35
+*  version : 26.1.40
 *  Copyright Syncfusion Inc. 2001 - 2023. 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@23.1.54",
+  "_id": "@syncfusion/ej2-richtexteditor@26.1.38",
   "_inBundle": false,
-  "_integrity": "sha512-nRcPQ0OfOscw8zBLuMrz7CIfxcpRf3sbkCqffFybabE7NbwtxHo13omNlYpOwISOBnSLaj5gsHV/0zXnN8Sg3g==",
+  "_integrity": "sha512-7x3b7CZyM0LWJX6JHTv8pbtJiHCY3NgyX85gtXTIjSdzEMKYwFdd0/t32rdLWXxw+rFI21YLOxIXqluPFN7FIA==",
   "_location": "/@syncfusion/ej2-richtexteditor",
   "_phantomChildren": {},
   "_requested": {
@@ -25,8 +25,8 @@
     "/@syncfusion/ej2-react-richtexteditor",
     "/@syncfusion/ej2-vue-richtexteditor"
   ],
-  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-release/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-23.1.54.tgz",
-  "_shasum": "db04bfc3080175248eaf85d189ce8ce7df183f7e",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-26.1.38.tgz",
+  "_shasum": "eea83cd8e45f03e16016a5fe21f82c2db91094d8",
   "_spec": "@syncfusion/ej2-richtexteditor@*",
   "_where": "/jenkins/workspace/elease-automation_release_26.1.1/packages/included",
   "author": {
@@ -37,12 +37,12 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~26.1.35",
-    "@syncfusion/ej2-buttons": "~26.1.35",
-    "@syncfusion/ej2-filemanager": "~26.1.35",
-    "@syncfusion/ej2-inputs": "~26.1.35",
-    "@syncfusion/ej2-navigations": "~26.1.35",
-    "@syncfusion/ej2-popups": "~26.1.35",
+    "@syncfusion/ej2-base": "~26.1.37",
+    "@syncfusion/ej2-buttons": "~26.1.40",
+    "@syncfusion/ej2-filemanager": "~26.1.40",
+    "@syncfusion/ej2-inputs": "~26.1.40",
+    "@syncfusion/ej2-navigations": "~26.1.40",
+    "@syncfusion/ej2-popups": "~26.1.38",
     "@syncfusion/ej2-splitbuttons": "~26.1.35"
   },
   "deprecated": false,
@@ -79,6 +79,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "26.1.35",
+  "version": "26.1.40",
   "sideEffects": false
 }

package/src/editor-manager/plugin/ms-word-clean-up.js

@@ -487,12 +487,13 @@ var MsWordPaste = /** @class */ (function () {
                 this.filterStyles(elm, wordPasteStyleConfig);
                 var resultElem = void 0;
                 var fromClass = false;
+                var regex = /^(p|div|li)\.(1|10|11)$/;
                 for (var i = 0; i < keys.length; i++) {
                     if (keys[i].split('.')[0] === '') {
                         resultElem = elm.getElementsByClassName(keys[i].split('.')[1]);
                         fromClass = true;
                     }
-                    else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') >= 0) {
+                    else if ((keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') >= 0) || (regex.test(keys[i]))) {
                         continue;
                     }
                     else if (keys[i].split('.').length === 1 && keys[i].split('.')[0].indexOf('@') < 0) {
@@ -668,7 +669,7 @@ var MsWordPaste = /** @class */ (function () {
             if (content && content.indexOf('mso-list:') !== -1) {
                 var msoListValue = void 0;
                 if (content.match(/mso-list:[^;]+;?/)) {
-                    var changedContent = content.replace('\n', '').split(' ').join('');
+                    var changedContent = content.replace(new RegExp('\n', 'g'), '').split(' ').join('');
                     msoListValue = changedContent.match(/mso-list:[^;]+;?/)[0].split(':l');
                     listFormatOverride = isNOU(msoListValue) ? null : parseInt(msoListValue[1].split('level')[0], 10);
                 }

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

@@ -1,4 +1,4 @@
-import { createElement, isNullOrUndefined as isNOU, detach, addClass, Browser, formatUnit } from '@syncfusion/ej2-base';
+import { createElement, isNullOrUndefined as isNOU, detach, addClass, Browser, formatUnit, removeClass } from '@syncfusion/ej2-base';
 import * as CONSTANT from './../base/constant';
 import * as classes from './../base/classes';
 import { InsertHtml } from './inserthtml';
@@ -121,6 +121,7 @@ var VideoCommand = /** @class */ (function () {
             clickElement.appendChild(temp.content);
             this.vidElement = sourceElement = clickElement.firstElementChild;
             this.setStyle(sourceElement, e, this.vidElement);
+            wrapElement.style.display = (e.item.cssClass === classes.CLASS_VIDEO_INLINE) ? 'inline-block' : 'block';
             wrapElement.appendChild(clickElement);
         }
         else {
@@ -253,6 +254,16 @@ var VideoCommand = /** @class */ (function () {
         if (!isNOU(e.item.height) && !isNOU(e.item.height.maxHeight)) {
             videoEle.style.maxHeight = formatUnit(e.item.height.maxHeight);
         }
+        if (!isNOU(e.item.cssClass)) {
+            if (e.item.cssClass === classes.CLASS_VIDEO_BREAK) {
+                addClass([videoEle], [classes.CLASS_VIDEO_BREAK]);
+                removeClass([videoEle], [classes.CLASS_VIDEO_INLINE]);
+            }
+            else {
+                addClass([videoEle], [classes.CLASS_VIDEO_INLINE]);
+                removeClass([videoEle], [classes.CLASS_VIDEO_BREAK]);
+            }
+        }
     };
     VideoCommand.prototype.videoDimension = function (e) {
         var selectNode = !(e.item.selectNode[0].classList.contains(classes.CLASS_VIDEO_CLICK_ELEM)) ? e.item.selectNode[0] :

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

@@ -304,7 +304,7 @@ var BaseQuickToolbar = /** @class */ (function () {
                 _this.checkCollision(showPopupData, 'document', ((_this.parent.inlineMode.enable) ? 'inline' : (type === 'text') ? 'text' : ''));
                 _this.popupObj.element.classList.remove('e-popup-open');
                 removeClass([_this.element], [classes.CLS_HIDE]);
-                _this.popupObj.show({ name: 'ZoomIn', duration: (Browser.isIE ? 250 : 400) });
+                _this.popupObj.show({ name: 'ZoomIn', duration: (Browser.isIE ? 250 : 400) }, target);
                 if (_this.popupObj && _this.parent.cssClass) {
                     removeClass([_this.popupObj.element], _this.parent.cssClass.replace(/\s+/g, ' ').trim().split(' '));
                     addClass([_this.popupObj.element], _this.parent.cssClass.replace(/\s+/g, ' ').trim().split(' '));

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

@@ -39,7 +39,7 @@ var Count = /** @class */ (function () {
     };
     Count.prototype.appendCount = function () {
         var htmlText = this.parent.editorMode === 'Markdown' ? this.editPanel.value :
-            (this.parent.getText().replace(/(\r\n|\n|\r|\t)/gm, ''));
+            (isNullOrUndefined(this.parent.getText()) ? '' : (this.parent.getText().replace(/(\r\n|\n|\r|\t)/gm, '')));
         if (this.parent.editorMode !== 'Markdown' && htmlText.indexOf('\u200B') !== -1) {
             this.htmlLength = htmlText.replace(/\u200B/g, '').length;
         }

package/src/rich-text-editor/actions/enter-key.js

@@ -408,8 +408,17 @@ var EnterKeyAction = /** @class */ (function () {
                                     }
                                     else {
                                         var lineBreakBRElem = _this.parent.createElement('br');
-                                        _this.parent.formatter.editorManager.domNode.insertAfter(focusBRElem, _this.range.startContainer);
-                                        _this.parent.formatter.editorManager.domNode.insertAfter(lineBreakBRElem, _this.range.startContainer);
+                                        var anchorElement = (!isNOU(_this.range.startContainer.parentElement) && _this.range.startContainer.parentElement.nodeName === 'A'
+                                            && _this.range.startContainer.parentElement.textContent.length === _this.range.startOffset)
+                                            ? _this.range.startContainer.parentElement : _this.range.startContainer;
+                                        _this.parent.formatter.editorManager.domNode.insertAfter(focusBRElem, anchorElement);
+                                        _this.parent.formatter.editorManager.domNode.insertAfter(lineBreakBRElem, anchorElement);
+                                        var brSibling = anchorElement.nextElementSibling;
+                                        var brNextSibling = !isNOU(brSibling) ? brSibling.nextElementSibling : null;
+                                        if (!isNOU(brSibling) && !isNOU(brNextSibling) && !isNOU(brNextSibling.nextElementSibling) &&
+                                            brSibling.nodeName === 'BR' && brNextSibling.nodeName === 'BR' && brNextSibling.nextElementSibling.nodeName === 'BR') {
+                                            brNextSibling.nextElementSibling.remove();
+                                        }
                                     }
                                 }
                                 _this.parent.formatter.editorManager.nodeSelection.setCursorPoint(_this.parent.contentModule.getDocument(), focusBRElem, 0);
@@ -478,6 +487,13 @@ var EnterKeyAction = /** @class */ (function () {
             isFocusTextNode = false;
         }
         var brElm = this.parent.createElement('br');
+        var findAnchorLastChild = this.startNode;
+        while (findAnchorLastChild.lastChild) {
+            findAnchorLastChild = findAnchorLastChild.lastChild;
+        }
+        var findAnchorElement = this.startNode.nodeName === 'A' && this.endNode.nodeName === 'A' &&
+            !isNOU(this.range.startContainer.parentElement) && this.range.startOffset === this.range.endOffset &&
+            this.range.startContainer.textContent.trim().length === findAnchorLastChild.textContent.trim().length;
         if (this.startNode.nodeName === 'BR' && this.endNode.nodeName === 'BR' && this.range.startOffset === 0 && this.range.startOffset === this.range.endOffset) {
             this.parent.formatter.editorManager.domNode.insertAfter(brElm, this.startNode);
             isEmptyBrInserted = true;
@@ -487,15 +503,25 @@ var EnterKeyAction = /** @class */ (function () {
                 this.range.startContainer.previousSibling.nodeName === 'BR' && this.range.startContainer.textContent.length === 0) {
                 isEmptyBrInserted = true;
             }
-            this.range.insertNode(brElm);
+            if (findAnchorElement) {
+                this.parent.formatter.editorManager.domNode.insertAfter(brElm, this.startNode);
+            }
+            else {
+                this.range.insertNode(brElm);
+            }
         }
         if (isEmptyBrInserted || (!isNOU(brElm.nextElementSibling) && brElm.nextElementSibling.tagName === 'BR') || (!isNOU(brElm.nextSibling) && brElm.nextSibling.textContent.length > 0)) {
             this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), !isNOU(brElm.nextSibling) && isFocusTextNode ? brElm.nextSibling : brElm, 0);
             isEmptyBrInserted = false;
         }
         else {
-            var brElm2 = this.parent.createElement('br');
-            this.range.insertNode(brElm2);
+            var brElements = this.parent.createElement('br');
+            if (findAnchorElement) {
+                this.parent.formatter.editorManager.domNode.insertAfter(brElements, this.startNode);
+            }
+            else {
+                this.range.insertNode(brElements);
+            }
             this.parent.formatter.editorManager.nodeSelection.setCursorPoint(this.parent.contentModule.getDocument(), brElm, 0);
         }
     };

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

@@ -702,6 +702,10 @@ var HtmlEditor = /** @class */ (function () {
                 }
                 paraElem[i].innerHTML = resultSplitContent.trim();
             }
+            var anchorElement = divElement.childNodes[0];
+            if (!isNullOrUndefined(anchorElement) && !isNullOrUndefined(anchorElement.childNodes[0]) && anchorElement.nodeName === 'SPAN' && anchorElement.childNodes[0].nodeName === 'A') {
+                divElement.innerHTML = divElement.innerHTML.replace('<span>', '').replace('</span>', '');
+            }
             if (!isNullOrUndefined(this.parent.pasteCleanupModule)) {
                 e.callBack(divElement.innerHTML);
             }

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

@@ -250,9 +250,10 @@ var Toolbar = /** @class */ (function () {
      */
     Toolbar.prototype.updateItem = function (args) {
         var item = this.tools[args.updateItem.toLocaleLowerCase()];
-        if (this.parent.locale !== 'en-US') {
+        if ((getTooltipText(args.updateItem.toLocaleLowerCase(), this.locator) !== 'Code View' && getTooltipText(args.updateItem.toLocaleLowerCase(), this.locator) !== 'Preview') || this.parent.locale !== 'en-US') {
             item.tooltip = getTooltipText(args.updateItem.toLocaleLowerCase(), this.locator);
         }
+        ;
         var trgItem = this.tools[args.targetItem.toLocaleLowerCase()];
         var index = getTBarItemsIndex(getCollection(trgItem.subCommand), args.baseToolbar.toolbarObj.items)[0];
         if (!isNOU(index)) {

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

@@ -1078,15 +1078,6 @@ var RichTextEditor = /** @class */ (function (_super) {
                 detach(tooltipEle);
             }
         }
-        if (this.element.offsetParent === null) {
-            if (!isNOU(this.toolbarModule)) {
-                this.toolbarModule.destroy();
-            }
-            this.notify(events.moduleDestroy, {});
-            _super.prototype.destroy.call(this);
-            this.isRendered = false;
-            return;
-        }
         this.notify(events.destroy, {});
         this.destroyDependentModules();
         this.unWireEvents();
@@ -2178,7 +2169,7 @@ var RichTextEditor = /** @class */ (function (_super) {
             }
         }
         this.removeSelectionClassStates(valueElementWrapper);
-        return valueElementWrapper.innerHTML;
+        return (this.editorMode === 'Markdown') ? valueElementWrapper.innerHTML.replace(/&lt;/g, '<').replace(/&gt;/g, '>').replace(/&amp;/g, '&') : valueElementWrapper.innerHTML;
     };
     RichTextEditor.prototype.updateStatus = function (e) {
         if (!isNOU(e.html) || !isNOU(e.markdown)) {

package/src/rich-text-editor/renderer/image-module.d.ts

@@ -39,6 +39,10 @@ export declare class Image {
     private removingImgName;
     private currentResizeHandler;
     private aspectRatio;
+    private drop;
+    private drag;
+    private enter;
+    private start;
     private constructor();
     protected addEventListener(): void;
     protected removeEventListener(): void;

package/src/rich-text-editor/renderer/image-module.js

@@ -25,6 +25,10 @@ var Image = /** @class */ (function () {
         this.rendererFactory = serviceLocator.getService('rendererFactory');
         this.dialogRenderObj = serviceLocator.getService('dialogRenderObject');
         this.addEventListener();
+        this.drop = this.dragDrop.bind(this);
+        this.drag = this.dragOver.bind(this);
+        this.enter = this.dragEnter.bind(this);
+        this.start = this.dragStart.bind(this);
     }
     Image.prototype.addEventListener = function () {
         if (this.parent.isDestroyed) {
@@ -83,10 +87,14 @@ var Image = /** @class */ (function () {
         this.parent.off(events.moduleDestroy, this.moduleDestroy);
         var dropElement = this.parent.iframeSettings.enable ? this.parent.inputElement.ownerDocument
             : this.parent.inputElement;
-        dropElement.removeEventListener('drop', this.dragDrop.bind(this), true);
-        dropElement.removeEventListener('dragstart', this.dragStart.bind(this), true);
-        dropElement.removeEventListener('dragenter', this.dragEnter.bind(this), true);
-        dropElement.removeEventListener('dragover', this.dragOver.bind(this), true);
+        dropElement.removeEventListener('drop', this.drop, true);
+        dropElement.removeEventListener('dragstart', this.drag, true);
+        dropElement.removeEventListener('dragenter', this.enter, true);
+        dropElement.removeEventListener('dragover', this.start, true);
+        this.drop = null;
+        this.drag = null;
+        this.enter = null;
+        this.start = null;
         if (!isNOU(this.contentModule)) {
             EventHandler.remove(this.contentModule.getEditPanel(), Browser.touchEndEvent, this.imageClick);
             this.parent.formatter.editorManager.observer.off(events.checkUndo, this.undoStack);
@@ -140,10 +148,10 @@ var Image = /** @class */ (function () {
         }
         var dropElement = this.parent.iframeSettings.enable ? this.parent.inputElement.ownerDocument :
             this.parent.inputElement;
-        dropElement.addEventListener('drop', this.dragDrop.bind(this), true);
-        dropElement.addEventListener('dragstart', this.dragStart.bind(this), true);
-        dropElement.addEventListener('dragenter', this.dragOver.bind(this), true);
-        dropElement.addEventListener('dragover', this.dragOver.bind(this), true);
+        dropElement.addEventListener('drop', this.drop, true);
+        dropElement.addEventListener('dragstart', this.drag, true);
+        dropElement.addEventListener('dragenter', this.enter, true);
+        dropElement.addEventListener('dragover', this.start, true);
     };
     Image.prototype.undoStack = function (args) {
         if (args.subCommand.toLowerCase() === 'undo' || args.subCommand.toLowerCase() === 'redo') {

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

@@ -2019,7 +2019,7 @@ var Table = /** @class */ (function () {
             var argument = ((Browser.isDevice || (!isNullOrUndefined(args.args)
                 && !isNullOrUndefined(args.args.originalEvent) &&
                 args.args.originalEvent.action === 'insert-table')
-                || proxy.parent.inlineMode.enable || !isNullOrUndefined(proxy.parent.quickToolbarSettings.text)) ? args :
+                || proxy.parent.inlineMode.enable || ((!isNullOrUndefined(proxy.parent.quickToolbarSettings.text)) && !(args instanceof PointerEvent))) ? args :
                 this);
             proxy.tableInsert(proxy.rowTextBox.value, proxy.columnTextBox.value, e, argument);
         }

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

@@ -617,9 +617,8 @@ var ToolbarRenderer = /** @class */ (function () {
             cssClass: ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass + ' ' + 'e-rte-picker-init',
             created: function () {
                 var value = (item === 'backgroundcolor') ? proxy.parent.backgroundColor.default : proxy.parent.fontColor.default;
-                colorPicker.setProperties({ value: value });
-                colorPicker.cssClass = ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass;
-                colorPicker.value = value;
+                var cssClass = ((item === 'backgroundcolor') ? CLS_BACKGROUND_COLOR_PICKER : CLS_FONT_COLOR_PICKER) + ' ' + args.cssClass;
+                colorPicker.setProperties({ value: value, cssClass: cssClass });
             },
             mode: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.mode : proxy.parent.fontColor.mode),
             modeSwitcher: ((item === 'backgroundcolor') ? proxy.parent.backgroundColor.modeSwitcher : proxy.parent.fontColor.modeSwitcher),

package/src/rich-text-editor/renderer/video-module.js

@@ -1399,6 +1399,14 @@ var Video = /** @class */ (function () {
         if (!isNullOrUndefined(proxy.uploadUrl) && proxy.uploadUrl.url !== '') {
             proxy.uploadUrl.cssClass = (proxy.parent.insertVideoSettings.layoutOption === 'Inline' ?
                 classes.CLS_VIDEOINLINE : classes.CLS_VIDEOBREAK);
+            proxy.uploadUrl.width = {
+                width: proxy.parent.insertVideoSettings.width, minWidth: proxy.parent.insertVideoSettings.minWidth,
+                maxWidth: proxy.parent.getInsertImgMaxWidth()
+            };
+            proxy.uploadUrl.height = {
+                height: proxy.parent.insertVideoSettings.height, minHeight: proxy.parent.insertVideoSettings.minHeight,
+                maxHeight: proxy.parent.insertVideoSettings.maxHeight
+            };
             proxy.dialogObj.hide({ returnValue: false });
             proxy.parent.formatter.process(proxy.parent, this.args, this.args.originalEvent, proxy.uploadUrl);
             proxy.uploadUrl.url = '';

package/styles/fluent2.css

@@ -207,7 +207,7 @@
   --color-sf-info-outline: var(--color-sf-info-border-color);
   --color-sf-tooltip-bg-color: var(--color-sf-content-bg-color-alt1);
   --color-sf-tooltip-border: var(--color-sf-content-bg-color-alt1);
-  --color-sf-toooltip-text-color: var(--color-sf-content-text-color);
+  --color-sf-tooltip-text-color: var(--color-sf-content-text-color);
   --color-sf-toast-text-color: var(--color-sf-content-text-color);
   --color-sf-toast-alt-text-color: var(--color-sf-content-text-color-alt1);
   --color-sf-appbar-bg-color-alt1: var(--color-sf-content-bg-color-alt2);
@@ -478,7 +478,7 @@
   --color-sf-success-bg-color: #218c21;
   --color-sf-success-border-color: var(--color-sf-success-bg-color);
   --color-sf-success-text: var(--color-sf-primary-text-color);
-  --color-sf-success-bg-color-hover: var(--color-sf-success-bg-color);
+  --color-sf-success-bg-color-hover: #0e700e;
   --color-sf-success-border-color-hover: var(--color-sf-success-bg-color-hover);
   --color-sf-success-text-hover: var(--color-sf-primary-text-color);
   --color-sf-success-bg-color-pressed: #052505;
@@ -496,7 +496,7 @@
   --color-sf-warning-bg-color: #f87528;
   --color-sf-warning-border-color: var(--color-sf-warning-bg-color);
   --color-sf-warning-text: #242424;
-  --color-sf-warning-bg-color-hover: var(--color-sf-warning-bg-color);
+  --color-sf-warning-bg-color-hover: #de590b;
   --color-sf-warning-border-color-hover: var(--color-sf-warning-bg-color-hover);
   --color-sf-warning-text-hover: var(--color-sf-primary-text-color);
   --color-sf-warning-bg-color-pressed: #4a1e04;
@@ -555,7 +555,7 @@
   --color-sf-info-outline: #0099bc;
   --color-sf-tooltip-bg-color: var(--color-sf-content-bg-color-alt1);
   --color-sf-tooltip-border: var(--color-sf-tooltip-bg-color);
-  --color-sf-toooltip-text-color: var(--color-sf-content-text-color);
+  --color-sf-tooltip-text-color: var(--color-sf-content-text-color);
   --color-sf-toast-text-color: var(--color-sf-content-text-color);
   --color-sf-toast-alt-text-color: var(--color-sf-content-text-color-alt1);
   --color-sf-appbar-bg-color-alt1: var(--color-sf-content-bg-color-alt2);
@@ -897,7 +897,7 @@
   --color-sf-info-outline: #0099bc;
   --color-sf-tooltip-bg-color: var(--color-sf-content-bg-color-alt1);
   --color-sf-tooltip-border: var(--color-sf-border-light);
-  --color-sf-toooltip-text-color: var(--color-sf-content-text-color);
+  --color-sf-tooltip-text-color: var(--color-sf-content-text-color);
   --color-sf-toast-text-color: var(--color-sf-content-text-color);
   --color-sf-toast-alt-text-color: var(--color-sf-content-text-color);
   --color-sf-appbar-bg-color-alt1: #fff;
@@ -2780,13 +2780,13 @@
   font-size: 2em;
   font-weight: bold;
   height: 40px;
-  line-height: 40px;
+  line-height: 25px;
 }
 .e-rte-dropdown-popup ul .e-item.e-h2 {
   font-size: 1.5em;
   font-weight: bold;
   height: 40px;
-  line-height: 40px;
+  line-height: 25px;
 }
 .e-rte-dropdown-popup ul .e-item.e-h3 {
   font-size: 1.16em;
@@ -3160,13 +3160,13 @@
   margin: 0 auto;
   padding: 6px 12px 6px 12px;
   position: relative;
-  top: -50px;
+  top: -120px;
 }
 .e-richtexteditor .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
 .e-richtexteditor .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn,
 .e-rte-elements .e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
 .e-rte-elements .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {
-  top: -50px;
+  top: -120px;
 }
 .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-img-uploadwrap.e-droparea .e-browsebtn,
 .e-richtexteditor .e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap.e-droparea .e-browsebtn,
@@ -4068,7 +4068,7 @@
   margin: 0 auto;
   padding: 6px 12px 6px 12px;
   position: relative;
-  top: -50px;
+  top: -120px;
 }
 .e-rte-elements.e-dialog .e-vid-uploadwrap.e-droparea .e-browsebtn,
 .e-rte-elements.e-dialog .e-rte-video-dialog.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap.e-droparea .e-browsebtn {

package/styles/material3-dark.css

@@ -1318,7 +1318,7 @@
 .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-items .e-toolbar-item .e-background-color.e-icons::before,
 .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-background-color.e-icons::before {
   display: inline;
-  font-size: 18px;
+  font-size: 16px;
 }
 .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn .e-order-list.e-icons,
 .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn .e-unorder-list.e-icons,
@@ -1672,7 +1672,7 @@
 }
 .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn,
 .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended.e-toolbar-pop .e-toolbar-item .e-tbar-btn {
-  font-size: 14px;
+  font-size: 16px;
 }
 .e-richtexteditor .e-clickelem::after,
 .e-richtexteditor .e-video-clickelem::after {
@@ -3164,7 +3164,7 @@
 .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-dropdown-btn-text,
 .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-background-color,
 .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-font-color {
-  font-size: 14px;
+  font-size: 16px;
 }
 
 .e-bigger .e-rte-text-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-dropdown-btn-text,
@@ -3173,17 +3173,17 @@
 .e-bigger .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-dropdown-btn-text,
 .e-bigger .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-background-color,
 .e-bigger .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-font-color {
-  font-size: 16px;
+  font-size: 18px;
 }
 
 .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-background-color,
 .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-font-color {
-  font-size: 14px;
+  font-size: 16px;
 }
 
 .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-background-color,
 .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-font-color {
-  font-size: 16px;
+  font-size: 18px;
 }
 .e-bigger .e-rte-container {
   border-radius: 4px;

package/styles/material3.css

@@ -1374,7 +1374,7 @@
 .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-items .e-toolbar-item .e-background-color.e-icons::before,
 .e-richtexteditor .e-rte-toolbar.e-toolbar.e-extended-toolbar .e-toolbar-extended .e-toolbar-item .e-background-color.e-icons::before {
   display: inline;
-  font-size: 18px;
+  font-size: 16px;
 }
 .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn .e-order-list.e-icons,
 .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn .e-unorder-list.e-icons,
@@ -1728,7 +1728,7 @@
 }
 .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn,
 .e-richtexteditor .e-toolbar.e-extended-toolbar .e-toolbar-extended.e-toolbar-pop .e-toolbar-item .e-tbar-btn {
-  font-size: 14px;
+  font-size: 16px;
 }
 .e-richtexteditor .e-clickelem::after,
 .e-richtexteditor .e-video-clickelem::after {
@@ -3220,7 +3220,7 @@
 .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-dropdown-btn-text,
 .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-background-color,
 .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-font-color {
-  font-size: 14px;
+  font-size: 16px;
 }
 
 .e-bigger .e-rte-text-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-dropdown-btn-text,
@@ -3229,17 +3229,17 @@
 .e-bigger .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-dropdown-btn-text,
 .e-bigger .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-background-color,
 .e-bigger .e-rte-inline-popup .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-font-color {
-  font-size: 16px;
+  font-size: 18px;
 }
 
 .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-background-color,
 .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-font-color {
-  font-size: 14px;
+  font-size: 16px;
 }
 
 .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-background-color,
 .e-bigger .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn .e-rte-font-color {
-  font-size: 16px;
+  font-size: 18px;
 }
 .e-bigger .e-rte-container {
   border-radius: 4px;

package/styles/rich-text-editor/_fluent2-definition.scss

@@ -92,7 +92,7 @@ $rte-default-character-count-opacity: 1;
 $rte-droparea-line-height: 10;
 $rte-droparea-browsebtn-height: 32px;
 $rte-droparea-browsebtn-padding: 6px 12px 6px 12px;
-$rte-droparea-browsebtn-top: -50px;
+$rte-droparea-browsebtn-top: -120px;
 $rte-big-droparea-browsebtn-top: -120px;
 $rte-insert-dialog-font-size: 14px;
 $rte-big-insert-dialog-font-size: 15px;

package/styles/rich-text-editor/_layout.scss

@@ -1190,14 +1190,24 @@
           font-size: 2em;
           font-weight: bold;
           height: 40px;
-          line-height: 40px;
+          @if $skin-name =='fluent2' {
+            line-height: 25px;
+          }
+          @else {
+            line-height: 40px;
+          }
         }
 
         &.e-h2 {
           font-size: 1.5em;
           font-weight: bold;
           height: 40px;
-          line-height: 40px;
+          @if $skin-name =='fluent2' {
+            line-height: 25px;
+          }
+          @else {
+            line-height: 40px;
+          }
         }
 
         &.e-h3 {
@@ -2539,7 +2549,7 @@
       .e-rte-dropdown-btn-text,
       .e-background-color,
       .e-rte-font-color {
-        font-size: 14px;
+        font-size: 16px;
       }
     }
     .e-bigger {
@@ -2548,27 +2558,27 @@
         .e-rte-dropdown-btn-text,
         .e-background-color,
         .e-rte-font-color {
-          font-size: 16px;
+          font-size: 18px;
         }
       }
     }
     .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn {
       .e-background-color,
-      .e-rte-font-color{
-        font-size: 14px;
+      .e-rte-font-color {
+        font-size: 16px;
       }
     }
     .e-bigger {
       .e-richtexteditor .e-rte-toolbar .e-toolbar-items .e-toolbar-item .e-dropdown-btn {
         .e-background-color,
-        .e-rte-font-color{
-          font-size: 16px;
+        .e-rte-font-color {
+          font-size: 18px;
         }
       }
-      .e-rte-container{
+      .e-rte-container {
         border-radius: 4px;
       }
-      .e-richtexteditor{
+      .e-richtexteditor {
         border-radius: 4px;
         .e-toolbar {
           border-radius: 4px 4px 0 0;

package/styles/rich-text-editor/_material3-definition.scss

@@ -242,8 +242,8 @@ $rte-tbar-default-bg: $content-bg-color-alt2 !default;
 $rte-extended-toolbar-items-padding: 0;
 $rte-expand-tbar-hover-bg: $content-bg-color-hover !default;
 $rte-big-insert-dialog-label-padding-top: 12px;
-$rte-tbar-icon-size: 14px;
-$rte-background-color-icon-fontsize: 18px;
+$rte-tbar-icon-size: 16px;
+$rte-background-color-icon-fontsize: 16px;
 $rte-big-background-color-icon-fontsize: 20px;
 $rte-dropdown-btn-color-content-padding: 0 !default;
 $rte-big-dropdown-btn-color-content-padding: 9.5px !default;