@syncfusion/ej2-richtexteditor 26.2.4 → 26.2.7

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 26.2.4
+*  version : 26.2.7
 *  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@26.1.42",
+  "_id": "@syncfusion/ej2-richtexteditor@26.2.5",
   "_inBundle": false,
-  "_integrity": "sha512-+J5Gcfx+Iy1jkGYJSc91pqv+Gk9ZGDhmyIanP++dUVEI5yXAEUTetX7LTTe0C9PNu51rauOHW57z2NdKnx1dmg==",
+  "_integrity": "sha512-FH3/ajh5xDss4l/7hmKai/Zf8+vn0cuPbN//GiPILPfKwkCX7b4iUQDycSF3gFGiATUID48cMuWp4EfO629Ibg==",
   "_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-hotfix-new/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-26.1.42.tgz",
-  "_shasum": "b6e37c254d3fa473264c42e80c6b919f5d1ddad5",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-richtexteditor/-/ej2-richtexteditor-26.2.5.tgz",
+  "_shasum": "f7cbd3a9c28d9420011a5af406c2a397639de4aa",
   "_spec": "@syncfusion/ej2-richtexteditor@*",
   "_where": "/jenkins/workspace/elease-automation_release_26.1.1/packages/included",
   "author": {
@@ -37,13 +37,13 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~26.2.4",
-    "@syncfusion/ej2-buttons": "~26.2.4",
-    "@syncfusion/ej2-filemanager": "~26.2.4",
-    "@syncfusion/ej2-inputs": "~26.2.4",
-    "@syncfusion/ej2-navigations": "~26.2.4",
-    "@syncfusion/ej2-popups": "~26.2.4",
-    "@syncfusion/ej2-splitbuttons": "~26.2.4"
+    "@syncfusion/ej2-base": "~26.2.5",
+    "@syncfusion/ej2-buttons": "~26.2.7",
+    "@syncfusion/ej2-filemanager": "~26.2.7",
+    "@syncfusion/ej2-inputs": "~26.2.5",
+    "@syncfusion/ej2-navigations": "~26.2.7",
+    "@syncfusion/ej2-popups": "~26.2.5",
+    "@syncfusion/ej2-splitbuttons": "~26.2.5"
   },
   "deprecated": false,
   "description": "Essential JS 2 RichTextEditor component",
@@ -79,6 +79,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "26.2.4",
+  "version": "26.2.7",
   "sideEffects": false
 }

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

@@ -317,12 +317,12 @@ var Lists = /** @class */ (function () {
             var commonAncestor = range.commonAncestorContainer;
             var startEle = range.startContainer;
             var endEle = range.endContainer;
-            var startNode = startEle.nodeType === 3 ? startEle.parentElement : startEle;
-            var endNode = endEle.nodeType === 3 ? endEle.parentElement : endEle;
+            var startNode = startEle.nodeType === 3 ? this.domNode.blockParentNode(startEle) : startEle;
+            var endNode = endEle.nodeType === 3 ? this.domNode.blockParentNode(endEle) : endEle;
             if ((commonAncestor.nodeName === 'UL' || commonAncestor.nodeName === 'OL') && startNode !== endNode
                 && (!isNullOrUndefined(closest(startNode, 'ul')) || !isNullOrUndefined(closest(startNode, 'ol')))
                 && (!isNullOrUndefined(closest(endNode, 'ul')) || !isNullOrUndefined(closest(endNode, 'ol')))
-                && (commonAncestor.lastElementChild === closest(endNode, 'li')) && !range.collapsed) {
+                && ((commonAncestor.lastElementChild === closest(endNode, 'li') && commonAncestor.lastChild !== endNode)) && !range.collapsed) {
                 detach(commonAncestor);
             }
             this.removeList(range, e);

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

@@ -255,7 +255,6 @@ var BaseQuickToolbar = /** @class */ (function () {
                     _this.tooltip = new Tooltip({
                         target: '#' + _this.element.id + ' [title]',
                         openDelay: 400,
-                        container: _this.parent.rootContainer,
                         showTipPointer: true,
                         beforeRender: _this.tooltipBeforeRender.bind(_this),
                         windowCollision: true,

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

@@ -228,6 +228,13 @@ var HtmlEditor = /** @class */ (function () {
         var isRootParent = false;
         if (restrictKeys.indexOf(args.keyCode) < 0 && !args.shiftKey && !args.ctrlKey && !args.altKey && !isEmptyNode) {
             pointer = range.startOffset;
+            var container = range.startContainer;
+            // Check if the container is a text node and contains a zero-width space
+            if (container.nodeType === Node.TEXT_NODE && container.nodeValue.includes("\u200B")) {
+                var beforeZeroWidthSpace = container.splitText(container.nodeValue.indexOf("\u200B"));
+                beforeZeroWidthSpace.splitText(1); // The zero-width space is at the beginning of this node
+                beforeZeroWidthSpace.parentNode.removeChild(beforeZeroWidthSpace);
+            }
             // eslint-disable-next-line @typescript-eslint/no-unused-expressions
             range.startContainer.nodeName === '#text' ? range.startContainer.parentElement !== this.parent.inputElement ? range.startContainer.parentElement.classList.add('currentStartMark')
                 : isRootParent = true : range.startContainer.classList.add('currentStartMark');

package/src/rich-text-editor/renderer/toolbar-renderer.d.ts

@@ -1,4 +1,5 @@
 import { DropDownButton } from '@syncfusion/ej2-splitbuttons';
+import { TooltipEventArgs } from '@syncfusion/ej2-popups';
 import { IRenderer, IRichTextEditor, IToolbarOptions, IDropDownModel, IColorPickerModel } from '../base/interface';
 import { ColorPicker } from '@syncfusion/ej2-inputs';
 import { ServiceLocator } from '../services/service-locator';
@@ -50,6 +51,7 @@ export declare class ToolbarRenderer implements IRenderer {
 
      */
     renderToolbar(args: IToolbarOptions): void;
+    tooltipBeforeOpen(args: TooltipEventArgs): void;
     /**
      * renderDropDownButton method
      *

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

@@ -1,4 +1,4 @@
-import { addClass, Browser, removeClass, formatUnit, isNullOrUndefined, isNullOrUndefined as isNOU, EventHandler } from '@syncfusion/ej2-base';
+import { addClass, Browser, removeClass, formatUnit, isNullOrUndefined, isNullOrUndefined as isNOU, EventHandler, detach } from '@syncfusion/ej2-base';
 import { getInstance, closest, selectAll } from '@syncfusion/ej2-base';
 import { Toolbar } from '@syncfusion/ej2-navigations';
 import { DropDownButton } from '@syncfusion/ej2-splitbuttons';
@@ -153,7 +153,6 @@ var ToolbarRenderer = /** @class */ (function () {
         if (this.parent.showTooltip && args.type === 'toolbar') {
             this.tooltip = new Tooltip({
                 target: '#' + this.parent.getID() + '_toolbar_wrapper [title]',
-                container: this.toolbarPanel,
                 showTipPointer: true,
                 openDelay: 400,
                 opensOn: 'Hover',
@@ -165,6 +164,11 @@ var ToolbarRenderer = /** @class */ (function () {
             this.tooltip.appendTo(args.target.parentElement);
         }
     };
+    ToolbarRenderer.prototype.tooltipBeforeOpen = function (args) {
+        if (args.element) {
+            args.element.setAttribute('data-rte-id', this.parent.getID());
+        }
+    };
     /**
      * renderDropDownButton method
      *
@@ -710,6 +714,13 @@ var ToolbarRenderer = /** @class */ (function () {
         }
         if (this.tooltip && !this.tooltip.isDestroyed) {
             this.tooltip.destroy();
+            var tooltipElements = document.querySelectorAll('[data-rte-id="' + this.parent.getID() + '"]');
+            for (var i = 0; i < tooltipElements.length; i++) {
+                var tooltipEle = tooltipElements[i];
+                if (this.parent.getID() === tooltipEle.getAttribute('data-rte-id')) {
+                    detach(tooltipEle);
+                }
+            }
         }
         this.unWireEvent();
         this.mode = null;

package/styles/fluent2.css

@@ -47,7 +47,7 @@
   --color-sf-flyout-bg-color-pressed: #e0e0e0;
   --color-sf-flyout-bg-color-selected: #ebebeb;
   --color-sf-flyout-bg-color-focus: #f5f5f5;
-  --color-sf-overlay-bg-color: #000;
+  --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
   --color-sf-table-bg-color-hover: #f5f5f5;
   --color-sf-table-bg-color-pressed: #e0e0e0;
   --color-sf-table-bg-color-selected: #ebf3fc;
@@ -369,7 +369,7 @@
   --color-sf-flyout-bg-color-pressed: var(--color-sf-black);
   --color-sf-flyout-bg-color-selected: #383838;
   --color-sf-flyout-bg-color-focus: var(--color-sf-flyout-bg-color-hover);
-  --color-sf-overlay-bg-color: rgba($black, .4);
+  --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
   --color-sf-table-bg-color-hover: #383838;
   --color-sf-table-bg-color-pressed: #2e2e2e;
   --color-sf-table-bg-color-selected: #082338;
@@ -711,9 +711,9 @@
   --color-sf-flyout-bg-color-pressed: var(--color-sf-content-bg-color-hover);
   --color-sf-flyout-bg-color-selected: var(--color-sf-content-bg-color-hover);
   --color-sf-flyout-bg-color-focus: var(--color-sf-content-bg-color-hover);
-  --color-sf-overlay-bg-color: rgba($black, .4);
-  --color-sf-table-bg-color-hover: var(--color-sf-black);
-  --color-sf-table-bg-color-pressed: var(--color-sf-black);
+  --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
+  --color-sf-table-bg-color-hover: #1a3bff;
+  --color-sf-table-bg-color-pressed: #1a3bff;
   --color-sf-table-bg-color-selected: #1a3bff;
   --color-sf-content-text-color: #fff;
   --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
@@ -732,12 +732,12 @@
   --color-sf-flyout-text-color-selected: var(--color-sf-content-text-color-hover);
   --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color-hover);
   --color-sf-flyout-text-color-disabled: var(--color-sf-content-text-color-disabled);
-  --color-sf-table-text-color-hover: var(--color-sf-content-text-color-hover);
-  --color-sf-table-text-color-pressed: var(--color-sf-content-text-color-hover);
-  --color-sf-table-text-color-selected: var(--color-sf-content-text-color-hover);
+  --color-sf-table-text-color-hover: #000;
+  --color-sf-table-text-color-pressed: #000;
+  --color-sf-table-text-color-selected: #000;
   --color-sf-icon-color: #fff;
-  --color-sf-icon-color-hover: var(--color-sf-content-text-color-hover);
-  --color-sf-icon-color-pressed: var(--color-sf-content-text-color-hover);
+  --color-sf-icon-color-hover: #000;
+  --color-sf-icon-color-pressed: #000;
   --color-sf-icon-color-disabled: var(--color-sf-content-text-color-disabled);
   --color-sf-border-light: #fff;
   --color-sf-border: var(--color-sf-border-light);
@@ -4613,7 +4613,7 @@ span.e-rte-videoboxmark {
 }
 
 .e-popup-overlay {
-  background-color: rgba(var(--color-sf-overlay-bg-color), 0.4);
+  background-color: var(--color-sf-overlay-bg-color);
 }
 
 .e-rte-toolbar.e-extended-toolbar .e-toolbar-item.e-overlay .e-dropdown-btn {

package/styles/rich-text-editor/fluent2.css

@@ -47,7 +47,7 @@
   --color-sf-flyout-bg-color-pressed: #e0e0e0;
   --color-sf-flyout-bg-color-selected: #ebebeb;
   --color-sf-flyout-bg-color-focus: #f5f5f5;
-  --color-sf-overlay-bg-color: #000;
+  --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
   --color-sf-table-bg-color-hover: #f5f5f5;
   --color-sf-table-bg-color-pressed: #e0e0e0;
   --color-sf-table-bg-color-selected: #ebf3fc;
@@ -369,7 +369,7 @@
   --color-sf-flyout-bg-color-pressed: var(--color-sf-black);
   --color-sf-flyout-bg-color-selected: #383838;
   --color-sf-flyout-bg-color-focus: var(--color-sf-flyout-bg-color-hover);
-  --color-sf-overlay-bg-color: rgba($black, .4);
+  --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
   --color-sf-table-bg-color-hover: #383838;
   --color-sf-table-bg-color-pressed: #2e2e2e;
   --color-sf-table-bg-color-selected: #082338;
@@ -711,9 +711,9 @@
   --color-sf-flyout-bg-color-pressed: var(--color-sf-content-bg-color-hover);
   --color-sf-flyout-bg-color-selected: var(--color-sf-content-bg-color-hover);
   --color-sf-flyout-bg-color-focus: var(--color-sf-content-bg-color-hover);
-  --color-sf-overlay-bg-color: rgba($black, .4);
-  --color-sf-table-bg-color-hover: var(--color-sf-black);
-  --color-sf-table-bg-color-pressed: var(--color-sf-black);
+  --color-sf-overlay-bg-color: rgba(0, 0, 0, .4);
+  --color-sf-table-bg-color-hover: #1a3bff;
+  --color-sf-table-bg-color-pressed: #1a3bff;
   --color-sf-table-bg-color-selected: #1a3bff;
   --color-sf-content-text-color: #fff;
   --color-sf-content-text-color-alt1: var(--color-sf-content-text-color);
@@ -732,12 +732,12 @@
   --color-sf-flyout-text-color-selected: var(--color-sf-content-text-color-hover);
   --color-sf-flyout-text-color-focus: var(--color-sf-content-text-color-hover);
   --color-sf-flyout-text-color-disabled: var(--color-sf-content-text-color-disabled);
-  --color-sf-table-text-color-hover: var(--color-sf-content-text-color-hover);
-  --color-sf-table-text-color-pressed: var(--color-sf-content-text-color-hover);
-  --color-sf-table-text-color-selected: var(--color-sf-content-text-color-hover);
+  --color-sf-table-text-color-hover: #000;
+  --color-sf-table-text-color-pressed: #000;
+  --color-sf-table-text-color-selected: #000;
   --color-sf-icon-color: #fff;
-  --color-sf-icon-color-hover: var(--color-sf-content-text-color-hover);
-  --color-sf-icon-color-pressed: var(--color-sf-content-text-color-hover);
+  --color-sf-icon-color-hover: #000;
+  --color-sf-icon-color-pressed: #000;
   --color-sf-icon-color-disabled: var(--color-sf-content-text-color-disabled);
   --color-sf-border-light: #fff;
   --color-sf-border: var(--color-sf-border-light);
@@ -4613,7 +4613,7 @@ span.e-rte-videoboxmark {
 }
 
 .e-popup-overlay {
-  background-color: rgba(var(--color-sf-overlay-bg-color), 0.4);
+  background-color: var(--color-sf-overlay-bg-color);
 }
 
 .e-rte-toolbar.e-extended-toolbar .e-toolbar-item.e-overlay .e-dropdown-btn {