Skip to content

Commit 0655d7c

Browse files
Integrated latest changes at 04-24-2025 1:30:38 AM
1 parent c9ad963 commit 0655d7c

File tree

182 files changed

+1174
-161
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

182 files changed

+1174
-161
lines changed

ej2-angular-toc.html

Lines changed: 30 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2348,15 +2348,12 @@
23482348
<li><a href="/ej2-angular/rich-text-editor/getting-started">Getting Started</a></li>
23492349
<li><a href="/ej2-angular/rich-text-editor/module">Feature Module Injection</a></li>
23502350
<li><a href="/ej2-angular/rich-text-editor/editor-value">Managing Editor Value</a></li>
2351-
<li><a href="/ej2-angular/rich-text-editor/editor-mode">Editor Render Mode</a></li>
23522351
<li>Toolbar
23532352
<ul>
23542353
<li><a href="/ej2-angular/rich-text-editor/toolbar/toolbar-types">Toolbar Types</a></li>
23552354
<li><a href="/ej2-angular/rich-text-editor/toolbar/quick-toolbar">Quick Toolbar</a></li>
23562355
</ul>
23572356
</li>
2358-
<li><a href="/ej2-angular/rich-text-editor/iframe">Iframe Editor</a></li>
2359-
<li><a href="/ej2-angular/rich-text-editor/inline-editing">Inline Editor</a></li>
23602357
<li>Tools
23612358
<ul>
23622359
<li><a href="/ej2-angular/rich-text-editor/tools/built-in-tools">Built-in Tools</a></li>
@@ -2365,24 +2362,43 @@
23652362
<li><a href="/ej2-angular/rich-text-editor/tools/styling-tools">Styling Tools</a></li>
23662363
</ul>
23672364
</li>
2368-
<li><a href="/ej2-angular/rich-text-editor/insert-images">Insert Image</a></li>
2369-
<li><a href="/ej2-angular/rich-text-editor/audio">Insert Audio</a></li>
2370-
<li><a href="/ej2-angular/rich-text-editor/video">Insert Video</a></li>
2365+
<li>Editor Types
2366+
<ul>
2367+
<li><a href="/ej2-angular/rich-text-editor/editor-types/editor-mode">Editor Render Mode</a></li>
2368+
<li><a href="/ej2-angular/rich-text-editor/editor-types/iframe">Iframe Editor</a></li>
2369+
<li><a href="/ej2-angular/rich-text-editor/editor-types/inline-editing">Inline Editor</a></li>
2370+
<li><a href="/ej2-angular/rich-text-editor/editor-types/resizable-editor">Resizable Editor</a></li>
2371+
</ul>
2372+
</li>
2373+
<li>Insert Image and Media
2374+
<ul>
2375+
<li><a href="/ej2-angular/rich-text-editor/insert-image-media/insert-images">Insert Image</a></li>
2376+
<li><a href="/ej2-angular/rich-text-editor/insert-image-media/audio">Insert Audio</a></li>
2377+
<li><a href="/ej2-angular/rich-text-editor/insert-image-media/video">Insert Video</a></li>
2378+
<li><a href="/ej2-angular/rich-text-editor/insert-image-media/file-browser">File Browser Support</a></li>
2379+
</ul>
2380+
</li>
23712381
<li><a href="/ej2-angular/rich-text-editor/link">Link Manipulation</a></li>
23722382
<li><a href="/ej2-angular/rich-text-editor/table">Table Manipulation</a></li>
23732383
<li><a href="/ej2-angular/rich-text-editor/paste-cleanup">Paste Clean-up</a></li>
2374-
<li><a href="/ej2-angular/rich-text-editor/slash-menu">Slash Commands</a></li>
2375-
<li><a href="/ej2-angular/rich-text-editor/mentions">Mention Integration</a></li>
2376-
<li><a href="/ej2-angular/rich-text-editor/file-browser">File Browser Support</a></li>
2384+
<li>Smart Editing
2385+
<ul>
2386+
<li><a href="/ej2-angular/rich-text-editor/smart-editing/mentions">Mention Integration</a></li>
2387+
<li><a href="/ej2-angular/rich-text-editor/smart-editing/slash-menu">Slash Commands</a></li>
2388+
<li><a href="/ej2-angular/rich-text-editor/smart-editing/emoji-picker">Emoji Picker</a></li>
2389+
</ul>
2390+
</li>
2391+
<li>Validation and Security
2392+
<ul>
2393+
<li><a href="/ej2-angular/rich-text-editor/validation-security/form-validation">Forms Support</a></li>
2394+
<li><a href="/ej2-angular/rich-text-editor/validation-security/xhtml-validation">Content Validation and Security in XHTML</a></li>
2395+
<li><a href="/ej2-angular/rich-text-editor/validation-security/read-only-mode">Controlling Editor Access</a></li>
2396+
</ul>
2397+
</li>
23772398
<li><a href="/ej2-angular/rich-text-editor/enter-key-configuration">Enter Key Configuration</a></li>
2378-
<li><a href="/ej2-angular/rich-text-editor/emoji-picker">Emoji Picker</a></li>
23792399
<li><a href="/ej2-angular/rich-text-editor/undo-redo">Undo and Redo</a></li>
2380-
<li><a href="/ej2-angular/rich-text-editor/form-validation">Forms Support</a></li>
2381-
<li><a href="/ej2-angular/rich-text-editor/xhtml-validation">Content Validation and Security in XHTML</a></li>
23822400
<li><a href="/ej2-angular/rich-text-editor/import-and-export">Content Import/Export</a></li>
23832401
<li><a href="/ej2-angular/rich-text-editor/exec-command">Execute Command</a></li>
2384-
<li><a href="/ej2-angular/rich-text-editor/resizable-editor">Resizable Editor</a></li>
2385-
<li><a href="/ej2-angular/rich-text-editor/read-only-mode">Controlling Editor Access</a></li>
23862402
<li><a href="/ej2-angular/rich-text-editor/style">Style and Appearance Customization</a></li>
23872403
<li><a href="/ej2-angular/rich-text-editor/style-encapsulation">Style Encapsulation</a></li>
23882404
<li><a href="/ej2-angular/rich-text-editor/spell-grammar-check">Spell and Grammar Check</a></li>
Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
{
2+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"version": 1,
4+
"newProjectRoot": "projects",
5+
"projects": {
6+
"syncfusion-component": {
7+
"projectType": "application",
8+
"schematics": {},
9+
"root": "",
10+
"sourceRoot": "src",
11+
"prefix": "app",
12+
"architect": {
13+
"build": {
14+
"builder": "@angular-devkit/build-angular:browser",
15+
"options": {
16+
"outputPath": "dist",
17+
"index": "index.html",
18+
"main": "src/main.ts",
19+
"tsConfig": "tsconfig.json",
20+
"styles": [
21+
"src/styles.css"
22+
],
23+
"assets": []
24+
},
25+
"configurations": {
26+
"production": {
27+
"budgets": [
28+
{
29+
"type": "initial",
30+
"maximumWarning": "500kb",
31+
"maximumError": "10mb"
32+
},
33+
{
34+
"type": "anyComponentStyle",
35+
"maximumWarning": "2kb",
36+
"maximumError": "4kb"
37+
}
38+
],
39+
"outputHashing": "all"
40+
},
41+
"development": {
42+
"buildOptimizer": false,
43+
"optimization": false,
44+
"vendorChunk": true,
45+
"extractLicenses": false,
46+
"sourceMap": true,
47+
"namedChunks": true
48+
}
49+
},
50+
"defaultConfiguration": "production"
51+
},
52+
"serve": {
53+
"builder": "@angular-devkit/build-angular:dev-server",
54+
"configurations": {
55+
"production": {
56+
"buildTarget": "syncfusion-component:build:production"
57+
},
58+
"development": {
59+
"buildTarget": "syncfusion-component:build:development"
60+
}
61+
},
62+
"defaultConfiguration": "development"
63+
}
64+
}
65+
}
66+
},
67+
"cli": {
68+
"analytics": false
69+
}
70+
}
Lines changed: 131 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,131 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<title>Syncfusion Angular Rich Text Editor</title>
5+
<meta charset="utf-8" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<meta name="description" content="Typescript UI Controls" />
8+
9+
<meta name="author" content="Syncfusion" />
10+
<link href="https://jsplayground.syncfusion.com/16.1.0.24/scripts/web/codemirror/codemirror.min.css" rel="stylesheet" />
11+
<style>
12+
#loader {
13+
color: #008cff;
14+
font-family: 'Helvetica Neue','calibiri';
15+
font-size: 16px;
16+
height: 40px;
17+
left: 45%;
18+
position: absolute;
19+
top: 45%;
20+
width: 30%;
21+
}
22+
.e-code-mirror::before {
23+
content: '\e345';
24+
}
25+
.CodeMirror-linenumber,
26+
.CodeMirror-gutters {
27+
display: none;
28+
}
29+
#special_char,
30+
.char_block {
31+
display: inline-block;
32+
}
33+
.char_block.e-active {
34+
/* box-shadow: inset 3px 3px 7px 0px; */
35+
outline: 1.5px solid;
36+
}
37+
.char_block {
38+
width: 30px;
39+
height: 30px;
40+
line-height: 30px;
41+
margin: 0 5px 5px 0;
42+
text-align: center;
43+
vertical-align: middle;
44+
border: 1px solid #DDDDDD;
45+
font-size: 20px;
46+
cursor: pointer;
47+
user-select: none;
48+
}
49+
#custom_tbar,
50+
#custom_tbar div{
51+
cursor: pointer;
52+
}
53+
#rteSection {
54+
height: 500px;
55+
}
56+
.e-rte-quick-popup .e-rte-quick-toolbar .e-roatate-left::before {
57+
content: "\e76e";
58+
}
59+
.e-rte-quick-popup .e-rte-quick-toolbar .e-roatate-right::before {
60+
content: "\e726";
61+
}
62+
.e-richtexteditor textarea.e-content {
63+
float: left;
64+
}
65+
.e-richtexteditor .e-rte-content {
66+
overflow: hidden;
67+
}
68+
.e-rte-content .e-content.e-pre-source{
69+
width: 100%;
70+
}
71+
.property-panel-content td{
72+
width: 50%;
73+
}
74+
.property-panel-content td div {
75+
padding-left: 10px;
76+
padding-top: 10px;
77+
}
78+
.e-icon-btn.e-active .e-md-preview::before {
79+
content: '\e350';
80+
}
81+
.e-icon-btn .e-md-preview.e-icons::before {
82+
content: '\e345';
83+
}
84+
.e-icon-btn.e-active .e-md-preview::before,
85+
#mdCustom .e-icon-btn.e-active .e-md-preview.e-icons::before {
86+
content: '\e350';
87+
}
88+
#mdCustom .e-icon-btn .e-md-preview.e-icons::before {
89+
content: '\e345';
90+
}
91+
#rteDialog.e-dialog .e-dlg-content {
92+
padding: 0px 0px 5px 16px;
93+
}
94+
#custom_tbar .e-tbar-btn-text {
95+
font-size: 16px;
96+
}
97+
.e-bigger #custom_tbar .e-tbar-btn-text {
98+
font-size: 18px;
99+
}
100+
@media (min-width: 320px) and (max-width: 480px) {
101+
.fabric.e-bigger #rteDialog {
102+
min-width: 281px;
103+
}
104+
.fabric #rteDialog {
105+
min-width: 241px;
106+
}
107+
.bootstrap.e-bigger #rteDialog,
108+
.bootstrap #rteDialog {
109+
min-width: 223px;
110+
}
111+
.highcontrast.e-bigger #rteDialog {
112+
min-width: 283px;
113+
}
114+
.highcontrast #rteDialog {
115+
min-width: 243px;
116+
}
117+
.material #rteDialog {
118+
min-width: 224px;
119+
}
120+
.material.e-bigger #rteDialog {
121+
min-width: 236px;
122+
}
123+
}
124+
</style>
125+
</head>
126+
<body style="margin-top: 125px">
127+
<app-root>
128+
<div id='loader'>Loading....</div>
129+
</app-root>
130+
</body>
131+
</html>
Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
{
2+
"name": "syncfusion-component",
3+
"version": "0.0.0",
4+
"scripts": {
5+
"ng": "ng",
6+
"start": "ng serve",
7+
"build": "ng build",
8+
"watch": "ng build --watch --configuration development",
9+
"test": "ng test"
10+
},
11+
"private": true,
12+
"dependencies": {
13+
"@angular/core": "17.1.2",
14+
"@angular/platform-browser": "17.1.2",
15+
"@angular/platform-browser-dynamic": "17.1.2",
16+
"@syncfusion/ej2-angular-popups": "*",
17+
"@syncfusion/ej2-angular-richtexteditor": "*",
18+
"@syncfusion/ej2-base": "*",
19+
"@syncfusion/ej2-icons": "*",
20+
"@syncfusion/ej2-buttons": "*",
21+
"@syncfusion/ej2-splitbuttons": "*",
22+
"@syncfusion/ej2-inputs": "*",
23+
"@syncfusion/ej2-lists": "*",
24+
"@syncfusion/ej2-navigations": "*",
25+
"@syncfusion/ej2-popups": "*",
26+
"@syncfusion/ej2-richtexteditor": "*",
27+
"@syncfusion/ej2-angular-buttons": "*",
28+
"@syncfusion/ej2-angular-base": "*",
29+
"@syncfusion/ej2-angular-dropdowns": "*",
30+
"@syncfusion/ej2-angular-inputs": "*",
31+
"@angular/animations": "17.1.2",
32+
"@angular/common": "17.1.2",
33+
"@angular/compiler": "17.1.2",
34+
"@angular/forms": "17.1.2",
35+
"@angular/router": "17.1.2",
36+
"moment": "2.29.4",
37+
"rxjs": "7.8.0",
38+
"tslib": "2.3.0",
39+
"zone.js": "0.14.3"
40+
},
41+
"devDependencies": {
42+
"@angular-devkit/build-angular": "17.1.2",
43+
"@angular/cli": "17.1.2",
44+
"@angular/compiler-cli": "17.1.2",
45+
"@types/jasmine": "4.3.0",
46+
"jasmine-core": "4.5.0",
47+
"karma": "6.4.0",
48+
"karma-chrome-launcher": "3.1.0",
49+
"karma-coverage": "2.2.0",
50+
"karma-jasmine": "5.1.0",
51+
"karma-jasmine-html-reporter": "2.0.0",
52+
"typescript": "5.3.3"
53+
}
54+
}
Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import { RichTextEditorAllModule } from '@syncfusion/ej2-angular-richtexteditor'
2+
import { Component } from '@angular/core';
3+
import { ToolbarService, LinkService, ImageService, HtmlEditorService, QuickToolbarService } from '@syncfusion/ej2-angular-richtexteditor';
4+
@Component({
5+
imports: [
6+
RichTextEditorAllModule,
7+
],
8+
standalone: true,
9+
selector: 'app-root',
10+
template: `<ejs-richtexteditor id='defaultRTE' [value]="value" [toolbarSettings]='tools'></ejs-richtexteditor>`,
11+
providers: [ToolbarService, LinkService, ImageService, HtmlEditorService, QuickToolbarService]
12+
})
13+
export class AppComponent {
14+
public tools: object = {
15+
items: ['Undo', 'Redo', '|',
16+
'Bold', 'Italic', 'Underline', 'StrikeThrough', '|',
17+
'FontName', 'FontSize', 'FontColor', 'BackgroundColor', '|',
18+
'SubScript', 'SuperScript', '|',
19+
'LowerCase', 'UpperCase', '|',
20+
'Formats', 'Alignments', '|', 'OrderedList', 'UnorderedList', '|',
21+
'Indent', 'Outdent', '|', 'CreateLink',
22+
'Image', '|', 'ClearFormat', 'Print', 'SourceCode', '|', 'FullScreen']
23+
};
24+
25+
public value: string = `<p>The Syncfudion Rich Text Editor, a WYSIWYG (what you see is what you get) editor, is a user interface that allows you to create, edit, and format rich text content. You can try out a demo of this editor here.</p><p><b>Key features:</b></p><ul>
26+
<li>
27+
<p>Provides &lt;IFRAME&gt; and &lt;DIV&gt; modes.</p>
28+
</li>
29+
<li>
30+
<p>Bulleted and numbered lists.</p>
31+
</li>
32+
<li>
33+
<p>Handles images, hyperlinks, videos, hyperlinks, uploads, etc.</p>
34+
</li>
35+
<li>
36+
<p>Contains undo/redo manager. </p>
37+
</li>
38+
</ul><div style="display: inline-block; width: 60%; vertical-align: top; cursor: auto;"><img alt="Sky with sun" src="https://cdn.syncfusion.com/ej2/richtexteditor-resources/RTE-Overview.png" width="309" style="min-width: 10px; min-height: 10px; width: 309px; height: 174px;" class="e-rte-image e-imginline e-rte-drag-image" height="174" /></div> `;
39+
40+
}
41+
42+
43+

0 commit comments

Comments
 (0)