@syncfusion/ej2-react-richtexteditor 20.3.60 → 20.4.38

package/CHANGELOG.md

@@ -2,25 +2,6 @@
 
 ## [Unreleased]
 
-### RichTextEditor
-
-#### Bug Fixes
-
-- `#I416708` - Now, pasting the content from MS Word will maintain the DOM structure properly.
-- `#I418749` - Now, pasted texts get inside the `contentEditable div` when using the `enterKey` as `BR` or `DIV`.
-
-## 20.3.59 (2022-11-29)
-
-### RichTextEditor
-
-#### Bug Fixes
-
-- `#I411229` - Now, pressing the enter key at the start of a line after deleting the previous line works properly.
-- `#I412883` - Now, pressing the enter key at the start of the dynamically inserted text works properly.
-- `#I412540` - Now, the indentation format is maintained properly when pasting content from MS Word.
-- `#I416708` - Now, pressing the backspace key after pasting contents from MS Word works properly.
-- `#I417838` - Now, Underline and Strike through toolbar styles will work properly when we change the font size in RTE.
-
 ## 20.3.47 (2022-09-29)
 
 ### RichTextEditor

package/README.md

@@ -1,67 +1,129 @@
-# ej2-react-richtexteditor
+# React RichTextEditor Component
 
-The [React Rich Text Editor](https://www.syncfusion.com/react-ui-components/react-wysiwyg-rich-text-editor?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm) component is a HTML and markdown editor that provides best user experience for creating and updating the content.
+The [React Rich Text Editor](https://www.syncfusion.com/react-ui-components/react-wysiwyg-rich-text-editor?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm) component is a feature-rich WYSIWYG HTML editor and WYSIWYG Markdown editor. The Rich Text Editor is widely used to create blogs, forum posts, notes sections, comment sections, messaging applications, and more. The control provides an efficient user interface for a better editing experience with mobile support. It has a variety of tools to edit and format rich content, and it return a valid HTML markup or Markdown (MD) content. It allows users to insert images, links, tables, media files and lists with modular architectures.
 
-![](../../ReadMe_Images/RTE.GIF)
+<p align="center">
+    <a href="https://ej2.syncfusion.com/react/documentation/rich-text-editor/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=react-richtexteditor-npm">Getting started</a> . 
+    <a href="https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-richtexteditor-npm#/bootstrap5/rich-text-editor/tools">Online demos</a> . 
+    <a href="https://www.syncfusion.com/react-components/react-wysiwyg-rich-text-editor?utm_source=npm&utm_medium=listing&utm_campaign=react-richtexteditor-npm">Learn more</a>
+</p>
 
+<p align="center">
+    <img src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/react/react-rich-text-editor.gif" alt="React RichTextEditor Component"/>
+</p>
 
->Note: This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's EULA (https://www.syncfusion.com/eula/es/). To acquire a license, you can purchase one at https://www.syncfusion.com/sales/products or start a free 30-day trial here (https://www.syncfusion.com/account/manage-trials/start-trials).
+<p align="center">
+Trusted by the world's leading companies
+  <a href="https://www.syncfusion.com">
+    <img src="https://raw.githubusercontent.com/SyncfusionExamples/nuget-img/master/syncfusion/syncfusion-trusted-companies.webp" alt="Bootstrap logo">
+  </a>
+</p>
 
->A free community license (https://www.syncfusion.com/products/communitylicense) is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers..
+## Setup
 
-## 1. Setup To install this package and its dependent packages, use the following command
+### Create a React Application
 
-Use the following commands to install rich text editor components and its dependent packages.
+You can use [`create-react-app`](https://github.com/facebookincubator/create-react-app) to setup applications. To create React app use the following command.
 
+```bash
+npx create-react-app my-app --template typescript
+cd my-app
+npm start
 ```
-npm install @syncfusion/ej2-react-richtexteditor
 
+### Adding Syncfusion Rich Text Editor package
+
+To install RichTextEditor component and its dependent packages, use the following command.
+
+```
+npm install @syncfusion/ej2-react-richtexteditor --save
+
+```
+
+### Adding CSS references for Rich Text Editor
+
+Add CSS references needed for Rich Text Editor in **src/App.css** from **../node_modules/@syncfusion** package folder.
+
+```css
+@import '../../node_modules/@syncfusion/ej2-base/styles/bootstrap5.css';
+@import '../../node_modules/@syncfusion/ej2-icons/styles/bootstrap5.css';
+@import '../../node_modules/@syncfusion/ej2-buttons/styles/bootstrap5.css';
+@import '../../node_modules/@syncfusion/ej2-splitbuttons/styles/bootstrap5.css';
+@import '../../node_modules/@syncfusion/ej2-inputs/styles/bootstrap5.css';
+@import '../../node_modules/@syncfusion/ej2-lists/styles/bootstrap5.css';
+@import '../../node_modules/@syncfusion/ej2-navigations/styles/bootstrap5.css';
+@import '../../node_modules/@syncfusion/ej2-popups/styles/bootstrap5.css';
+@import '../../node_modules/@syncfusion/ej2-richtexteditor/styles/bootstrap5.css';
+```
+
+### Add Rich Text Editor Component
+
+In **src/App.tsx** file, use the following code snippet to render the Syncfusion React Rich Text Editor control and import **App.css** to apply styles to the richtexteditor:
+
+```typescript
+import { HtmlEditor, Image, Inject, Link, QuickToolbar, RichTextEditorComponent, Toolbar } from '@syncfusion/ej2-react-richtexteditor';
+import * as React from 'react';
+import './App.css';
+
+function App() {
+    return (
+            <div className="App">
+                <RichTextEditorComponent>
+                    <p>The Rich Text Editor component is WYSIWYG ("what you see is what you get") editor that provides the best user experience to create and update the content. Users can format their content using standard toolbar commands.</p>
+                    <Inject services={[Toolbar, Image, Link, HtmlEditor, QuickToolbar]} />
+                </RichTextEditorComponent>
+            </div>
+        );
+};
+export default App;
 ```
 
-## 2. Components included
-
-* [GettingStarted](https://ej2.syncfusion.com/react/documentation/rich-text-editor/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
-* [View Online Demos](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/material/rich-text-editor/tools.html)
-* [Product Page](https://www.syncfusion.com/react-ui-components/react-wysiwyg-rich-text-editor?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
-
-## 3. Supported frameworks
-Rich text editor component also supports the following frameworks:
-1.  [TypeScript Rich Text Editor](https://www.syncfusion.com/javascript-ui-controls/js-wysiwyg-rich-text-editor?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
-2.	[Angular Rich Text Editor](https://www.syncfusion.com/angular-ui-components/angular-wysiwyg-rich-text-editor?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
-3.	[Vue Rich Text Editor](https://www.syncfusion.com/vue-ui-components/vue-wysiwyg-rich-text-editor?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
-4.	[ASP.NET Core Rich Text Editor](https://www.syncfusion.com/aspnet-core-ui-controls/wysiwyg-rich-text-editor?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
-5.	[ASP.NET MVC Rich Text Editor](https://www.syncfusion.com/aspnet-mvc-ui-controls/wysiwyg-rich-text-editor?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
-
-## 4. Use-case samples / Showcase samples
-
-* [React HTML editor Demo](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/material/rich-text-editor/tools)
-* [Blog posting Demo in React](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/material/rich-text-editor/blog-posting)
-* [React Markdown editor Demo](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/material/rich-text-editor/markdown-editor)
-* [Inline edit Demo in React](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/material/rich-text-editor/inline)
-
-## 5. Key features
-
-* [Mode](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/material/rich-text-editor/iframe): Provides &lt;IFRAME&gt; and &lt;DIV&gt; mode.
-* [Markdown](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/material/rich-text-editor/markdown-editor-preview): Handles markdown editing.
-* [Module](https://ej2.syncfusion.com/react/documentation/rich-text-editor/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#module-injection): Contains a modular library to load the necessary functionality on demand.
-* [Toolbar](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/material/rich-text-editor/types): Provides a fully customizable toolbar.
-* [Editing](https://ej2.syncfusion.com/react/documentation/rich-text-editor/miscellaneous/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/rich-text-editor/#code-view): HTML view to edit the source directly for developers.
-* [Third-party Integration](https://ej2.syncfusion.com/react/documentation/rich-text-editor/third-party-integration/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm): Integrates third-party library.
-* [Preview](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/material/rich-text-editor/markdown-editor-preview): Preview the modified content before saving it.
-* [Tools](https://ej2.syncfusion.com/react/documentation/rich-text-editor/toolbar/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#toolbar-items): Handles images, hyperlinks, uploads, and more.
-* [Undo and Redo](https://ej2.syncfusion.com/react/documentation/rich-text-editor/miscellaneous/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#undoredo-manager): Contains undo/redo manager.
-
-## 6. Support
-
-Product support can be obtained through the following mediums:
-* Creating incident in Syncfusion [Direct-trac](https://www.syncfusion.com/support/directtrac/incidents?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm) support system or [Community forum.](https://www.syncfusion.com/forums/essential-js2?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
-* New [GitHub issue](https://github.com/syncfusion/ej2-react-ui-components/issues/new?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm).
-* Ask your query in Stack Overflow with tag ‘syncfusion’, ‘ej2’.
+## Supported frameworks
+
+RichTextEditor component is also offered in the following frameworks.
+
+| [<img src="https://ej2.syncfusion.com/github/images/js.svg" height="50" />](https://www.syncfusion.com/javascript-ui-controls?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[JavaScript](https://www.syncfusion.com/javascript-ui-controls?utm_medium=listing&utm_source=github)&nbsp;&nbsp;&nbsp;&nbsp; | [<img src="https://ej2.syncfusion.com/github/images/angular.svg"  height="50" />](https://www.syncfusion.com/angular-components/?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[Angular](https://www.syncfusion.com/angular-components/?utm_medium=listing&utm_source=github)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; | [<img src="https://ej2.syncfusion.com/github/images/vue.svg" height="50" />](https://www.syncfusion.com/vue-ui-components?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[Vue](https://www.syncfusion.com/vue-ui-components?utm_medium=listing&utm_source=github)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; | [<img src="https://ej2.syncfusion.com/github/images/netcore.svg" height="50" />](https://www.syncfusion.com/aspnet-core-ui-controls?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;[ASP.NET&nbsp;Core](https://www.syncfusion.com/aspnet-core-ui-controls?utm_medium=listing&utm_source=github)&nbsp;&nbsp; | [<img src="https://ej2.syncfusion.com/github/images/netmvc.svg" height="50" />](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_medium=listing&utm_source=github)<br/>&nbsp;&nbsp;[ASP.NET&nbsp;MVC](https://www.syncfusion.com/aspnet-mvc-ui-controls?utm_medium=listing&utm_source=github)&nbsp;&nbsp; | 
+| :-----: | :-----: | :-----: | :-----: | :-----: |
+
+## Showcase samples
+
+* [React HTML editor demo](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/bootstrap5/rich-text-editor/tools)
+* [Blog posting using react rich text editor demo](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/bootstrap5/rich-text-editor/blog-posting)
+* [React Markdown editor demo](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/bootstrap5/rich-text-editor/markdown-editor)
+* [React live HTML editor demo](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/bootstrap5/rich-text-editor/online-html-editor)
+
+## Key features
+
+* [Edit mode](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/bootstrap5/rich-text-editor/iframe) - HTML content is possible to edit in a `div` element or an `iframe` in the rich text editor.
+* [Markdown editor](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/bootstrap5/rich-text-editor/markdown-editor-preview) - The rich text editor allows you to edit Markdown content using the Markdown syntax.
+* [Markdown content preview](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/bootstrap5/rich-text-editor/markdown-editor-preview) - Preview of the modified Markdown content in the editor, you can give users the ability to see what the formatted content will look like before they save it.
+* [HTML code editing](https://ej2.syncfusion.com/react/documentation/rich-text-editor/miscellaneous/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/rich-text-editor/#code-view) - The rich text editor allows users to edit the HTML code directly in the HTML code view. This can be useful for users who are familiar with HTML and want to have more control over the formatting and layout of their content.
+* [Tools](https://ej2.syncfusion.com/react/documentation/rich-text-editor/toolbar/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#toolbar-items) - The rich text editor handles a wide range of features, including inserting images, hyperlinks, tables, formatting tools, and more.
+* [Toolbar appearance](https://ej2.syncfusion.com/react/demos/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#/bootstrap5/rich-text-editor/types) - The rich text editor can provide a fully customizable toolbar that allows users to access the various formatting and editing options that are available.
+* [Undo and redo](https://ej2.syncfusion.com/react/documentation/rich-text-editor/miscellaneous/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#undoredo-manager) - Users can use undo and redo actions to reverse or repeat actions they took while editing the content.
+* [Module injection](https://ej2.syncfusion.com/react/documentation/rich-text-editor/getting-started/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm/#module-injection) - It is possible to create a editor that utilizes a modular library to load the necessary functionality on demand. This can be useful for optimizing the performance of the editor.
+* [Third-party integration](https://ej2.syncfusion.com/react/documentation/rich-text-editor/third-party-integration/?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm) - It is possible to integrate a third-party library into a rich text editor to add additional functionality or features to the editor like `Code-mirror`, `Embedly` and more.
+
+## Support
+
+Product support is available through the following mediums.
+
+* [Support ticket](https://support.syncfusion.com/support/tickets/create) - Guaranteed Response in 24 hours | Unlimited tickets | Holiday support
+* [Community forum](https://www.syncfusion.com/forums/react-js2?utm_source=npm&utm_medium=listing&utm_campaign=react-richtexteditor-npm)
+* [GitHub issues](https://github.com/syncfusion/ej2-react-ui-components/issues/new)
+* [Request feature or report bug](https://www.syncfusion.com/feedback/react?utm_source=npm&utm_medium=listing&utm_campaign=react-richtexteditor-npm)
+* Live chat
+
+## Changelog
  
-## 7. License 
-Check the license details [here](https://github.com/syncfusion/ej2/blob/master/license?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
+Check the changelog [here](https://github.com/syncfusion/ej2-react-ui-components/blob/master/components/richtexteditor/CHANGELOG.md?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm). Get minor improvements and bug fixes every week to stay up to date with frequent updates.
+
+## License and copyright
+
+> This is a commercial product and requires a paid license for possession or use. Syncfusion’s licensed software, including this component, is subject to the terms and conditions of Syncfusion's [EULA](https://www.syncfusion.com/eula/es/). To acquire a license for 80+ [React UI components](https://www.syncfusion.com/react-components), you can [purchase](https://www.syncfusion.com/sales/products) or [start a free 30-day trial](https://www.syncfusion.com/account/manage-trials/start-trials).
+
+> A free community [license](https://github.com/syncfusion/ej2-react-ui-components/blob/master/license?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm) is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.
 
-## 8. Change log 
- Check the changelog [here](https://github.com/syncfusion/ej2-react-ui-components/blob/master/components/richtexteditor/CHANGELOG.md?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm)
+See [LICENSE FILE](https://github.com/syncfusion/ej2/blob/master/license?utm_source=npm&utm_medium=listing&utm_campaign=react-rich-text-editor-npm) for more info.
 
 © Copyright 2022 Syncfusion, Inc. All Rights Reserved. The Syncfusion Essential Studio license and copyright applies to this distribution.

package/diConfig.json

@@ -2,10 +2,10 @@
     "name": "RichTextEditor",
     "description": "RichTextEditor Components",
      "keywords": {
-   "common": ["markdown editor", "HTML5 rich text editor", "wysiwyg", "wysiwyg html editor", "wysiwyg markdown editor"],
-   "angular": ["angular rich text editor", "angular html editor", "angular markdown editor", "angular wysiwyg editor"],
-   "react": ["react rich text editor", "react html editor", "react markdown editor", "react wysiwyg editor"],
-   "vue": ["vue rich text editor", "vue html editor", "vue markdown editor", "vue wysiwyg editor"]
+   "common": ["rich-text-editor","markdown-editor", "HTML5-rich-text-editor", "wysiwyg-html-editor", "wysiwyg-markdown-editor"],
+   "angular": ["angular-rich-text-editor", "angular-html-editor", "angular-markdown-editor", "angular-wysiwyg-editor"],
+   "react": ["react-rich-text-editor", "react-html-editor", "react-markdown-editor", "react-wysiwyg-editor"],
+   "vue": ["vue-rich-text-editor", "vue-html-editor", "vue-markdown-editor", "vue-wysiwyg-editor"]
    },
     "repository": {
         "type": "git",

package/dist/ej2-react-richtexteditor.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-react-richtexteditor.min.js
-*  version : 20.3.60
+*  version : 20.4.38
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/dist/ej2-react-richtexteditor.umd.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-react-richtexteditor.umd.min.js
-*  version : 20.3.60
+*  version : 20.4.38
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-react-richtexteditor@*",
-  "_id": "@syncfusion/ej2-react-richtexteditor@20.3.59",
+  "_id": "@syncfusion/ej2-react-richtexteditor@19.12.13",
   "_inBundle": false,
-  "_integrity": "sha512-0tYTj1MIBHgpCDWODtUO8a+PB9B3QEUkWEoEsyO/gf3L3IKZNrioQFTlSNz59RGq0oSNSEa7Vkfgt+TRKgE/wA==",
+  "_integrity": "sha512-F7BmiexL8dbte35Bdch0zhN568inwLdbnJ9E+Njsht2iVWnUhIP/PgRW3OHEZvBWYMmiluCKczHF8ENOORKu6w==",
   "_location": "/@syncfusion/ej2-react-richtexteditor",
   "_phantomChildren": {},
   "_requested": {
@@ -19,8 +19,8 @@
   "_requiredBy": [
     "/"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-react-richtexteditor/-/ej2-react-richtexteditor-20.3.59.tgz",
-  "_shasum": "deaa158addaa5dd64f44ea6872aa53a237675666",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-react-richtexteditor/-/ej2-react-richtexteditor-19.12.13.tgz",
+  "_shasum": "741b7ef211d358e03b033b4a9bfc41ea6ce25e97",
   "_spec": "@syncfusion/ej2-react-richtexteditor@*",
   "_where": "/jenkins/workspace/ease-automation_release_19.1.0.1/packages/included",
   "author": {
@@ -31,9 +31,9 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~20.3.56",
-    "@syncfusion/ej2-react-base": "~20.3.56",
-    "@syncfusion/ej2-richtexteditor": "20.3.60"
+    "@syncfusion/ej2-base": "~20.4.38",
+    "@syncfusion/ej2-react-base": "~20.4.38",
+    "@syncfusion/ej2-richtexteditor": "20.4.38"
   },
   "deprecated": false,
   "description": "Essential JS 2 RichTextEditor component for React",
@@ -41,15 +41,15 @@
   "es2015": "dist/es6/ej2-react-richtexteditor.es2015.js",
   "homepage": "https://github.com/syncfusion/ej2-react-ui-components#readme",
   "keywords": [
-    "markdown editor",
-    "HTML5 rich text editor",
-    "wysiwyg",
-    "wysiwyg html editor",
-    "wysiwyg markdown editor",
-    "react rich text editor",
-    "react html editor",
-    "react markdown editor",
-    "react wysiwyg editor"
+    "rich-text-editor",
+    "markdown-editor",
+    "HTML5-rich-text-editor",
+    "wysiwyg-html-editor",
+    "wysiwyg-markdown-editor",
+    "react-rich-text-editor",
+    "react-html-editor",
+    "react-markdown-editor",
+    "react-wysiwyg-editor"
   ],
   "license": "SEE LICENSE IN license",
   "main": "./dist/ej2-react-richtexteditor.umd.min.js",
@@ -59,6 +59,6 @@
     "type": "git",
     "url": "git+https://github.com/syncfusion/ej2-react-ui-components.git"
   },
-  "version": "20.3.60",
+  "version": "20.4.38",
   "sideEffects": false
 }

package/styles/bootstrap-dark.css

@@ -2618,15 +2618,17 @@
   width: 300px;
 }
 
-.e-dialog .e-vid-uploadwrap .e-droptext {
-  height: 108px;
-}
-
-.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext {
+.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap .e-droptext {
   margin: 0 auto;
   width: 250px;
 }
 
+.e-dialog.e-device .e-video-url-wrap .e-radio-wrapper {
+  padding: 8px 4px;
+}
+
 .e-linkheader {
   color: #fff;
 }
@@ -2705,6 +2707,11 @@ span.e-rte-videoboxmark {
   color: #f0f0f0;
 }
 
+.e-richtexteditor .e-rte-toolbar .e-hor-nav:hover {
+  border: solid rgba(0, 0, 0, 0.12);
+  border-width: 0 0 0 1px;
+}
+
 .e-rte-table-popup .e-span-border {
   border: 1px solid #505050;
   display: block;

package/styles/bootstrap.css

@@ -2759,15 +2759,17 @@
   width: 300px;
 }
 
-.e-dialog .e-vid-uploadwrap .e-droptext {
-  height: 108px;
-}
-
-.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext {
+.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap .e-droptext {
   margin: 0 auto;
   width: 250px;
 }
 
+.e-dialog.e-device .e-video-url-wrap .e-radio-wrapper {
+  padding: 8px 4px;
+}
+
 .e-linkheader {
   color: #333;
 }
@@ -2846,6 +2848,11 @@ span.e-rte-videoboxmark {
   color: #000;
 }
 
+.e-richtexteditor .e-rte-toolbar .e-hor-nav:hover {
+  border: solid rgba(0, 0, 0, 0.12);
+  border-width: 0 0 0 1px;
+}
+
 .e-rte-table-popup .e-span-border {
   border: 1px solid #ddd;
   display: block;

package/styles/bootstrap4.css

@@ -2846,15 +2846,17 @@
   width: 300px;
 }
 
-.e-dialog .e-vid-uploadwrap .e-droptext {
-  height: 108px;
-}
-
-.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext {
+.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap .e-droptext {
   margin: 0 auto;
   width: 250px;
 }
 
+.e-dialog.e-device .e-video-url-wrap .e-radio-wrapper {
+  padding: 8px 4px;
+}
+
 .e-linkheader {
   color: #212529;
 }
@@ -2933,6 +2935,11 @@ span.e-rte-videoboxmark {
   color: #212529;
 }
 
+.e-richtexteditor .e-rte-toolbar .e-hor-nav:hover {
+  border: solid rgba(0, 0, 0, 0.12);
+  border-width: 0 0 0 1px;
+}
+
 .e-rte-table-popup .e-span-border {
   border: 1px solid #dee2e6;
   display: block;

package/styles/bootstrap5-dark.css

@@ -2711,15 +2711,17 @@
   width: 300px;
 }
 
-.e-dialog .e-vid-uploadwrap .e-droptext {
-  height: 108px;
-}
-
-.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext {
+.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap .e-droptext {
   margin: 0 auto;
   width: 250px;
 }
 
+.e-dialog.e-device .e-video-url-wrap .e-radio-wrapper {
+  padding: 8px 4px;
+}
+
 .e-linkheader {
   color: #fff;
 }
@@ -2798,6 +2800,11 @@ span.e-rte-videoboxmark {
   color: #fff;
 }
 
+.e-richtexteditor .e-rte-toolbar .e-hor-nav:hover {
+  border: solid rgba(0, 0, 0, 0.12);
+  border-width: 0 0 0 1px;
+}
+
 .e-rte-table-popup.e-popup.e-popup-open {
   background-color: #343a40;
 }

package/styles/bootstrap5.css

@@ -2711,15 +2711,17 @@
   width: 300px;
 }
 
-.e-dialog .e-vid-uploadwrap .e-droptext {
-  height: 108px;
-}
-
-.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext {
+.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap .e-droptext {
   margin: 0 auto;
   width: 250px;
 }
 
+.e-dialog.e-device .e-video-url-wrap .e-radio-wrapper {
+  padding: 8px 4px;
+}
+
 .e-linkheader {
   color: #212529;
 }
@@ -2798,6 +2800,11 @@ span.e-rte-videoboxmark {
   color: #212529;
 }
 
+.e-richtexteditor .e-rte-toolbar .e-hor-nav:hover {
+  border: solid rgba(0, 0, 0, 0.12);
+  border-width: 0 0 0 1px;
+}
+
 .e-rte-table-popup.e-popup.e-popup-open {
   background-color: #fff;
 }

package/styles/fabric-dark.css

@@ -2599,15 +2599,17 @@
   width: 300px;
 }
 
-.e-dialog .e-vid-uploadwrap .e-droptext {
-  height: 108px;
-}
-
-.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext {
+.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap .e-droptext {
   margin: 0 auto;
   width: 250px;
 }
 
+.e-dialog.e-device .e-video-url-wrap .e-radio-wrapper {
+  padding: 8px 4px;
+}
+
 .e-linkheader {
   color: #dadada;
 }
@@ -2686,6 +2688,11 @@ span.e-rte-videoboxmark {
   color: #dadada;
 }
 
+.e-richtexteditor .e-rte-toolbar .e-hor-nav:hover {
+  border: solid rgba(0, 0, 0, 0.12);
+  border-width: 0 0 0 1px;
+}
+
 .e-rte-table-popup .e-span-border {
   border: 1px solid #414040;
   display: block;

package/styles/fabric.css

@@ -2599,15 +2599,17 @@
   width: 290px;
 }
 
-.e-dialog .e-vid-uploadwrap .e-droptext {
-  height: 108px;
-}
-
-.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext {
+.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap .e-droptext {
   margin: 0 auto;
   width: 240px;
 }
 
+.e-dialog.e-device .e-video-url-wrap .e-radio-wrapper {
+  padding: 8px 4px;
+}
+
 .e-linkheader {
   color: #333;
 }
@@ -2686,6 +2688,11 @@ span.e-rte-videoboxmark {
   color: #000;
 }
 
+.e-richtexteditor .e-rte-toolbar .e-hor-nav:hover {
+  border: solid rgba(0, 0, 0, 0.12);
+  border-width: 0 0 0 1px;
+}
+
 .e-rte-table-popup .e-span-border {
   border: 1px solid #dadada;
   display: block;

package/styles/fluent-dark.css

@@ -2661,15 +2661,17 @@
   width: 292px;
 }
 
-.e-dialog .e-vid-uploadwrap .e-droptext {
-  height: 108px;
-}
-
-.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext {
+.e-dialog.e-device.e-dlg-modal .e-img-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-vid-uploadwrap .e-droptext,
+.e-dialog.e-device.e-dlg-modal .e-aud-uploadwrap .e-droptext {
   margin: 0 auto;
   width: 242px;
 }
 
+.e-dialog.e-device .e-video-url-wrap .e-radio-wrapper {
+  padding: 8px 4px;
+}
+
 .e-linkheader {
   color: #f3f2f1;
 }
@@ -2748,6 +2750,11 @@ span.e-rte-videoboxmark {
   color: #a19f9d;
 }
 
+.e-richtexteditor .e-rte-toolbar .e-hor-nav:hover {
+  border: solid rgba(0, 0, 0, 0.12);
+  border-width: 0 0 0 1px;
+}
+
 .e-rte-table-popup .e-span-border {
   border: 1px solid #292827;
   display: block;