@ckeditor/ckeditor5-editor-classic 38.1.1 → 38.2.0-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +3 -2
- package/src/classiceditor.d.ts +180 -180
- package/src/classiceditor.js +219 -219
- package/src/classiceditorui.d.ts +67 -67
- package/src/classiceditorui.js +151 -151
- package/src/classiceditoruiview.d.ts +47 -47
- package/src/classiceditoruiview.js +43 -43
- package/src/index.d.ts +8 -8
- package/src/index.js +8 -8
- package/build/editor-classic.js.map +0 -1
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@ckeditor/ckeditor5-editor-classic",
|
3
|
-
"version": "38.
|
3
|
+
"version": "38.2.0-alpha.1",
|
4
4
|
"description": "Classic editor implementation for CKEditor 5.",
|
5
5
|
"keywords": [
|
6
6
|
"ckeditor",
|
@@ -10,8 +10,9 @@
|
|
10
10
|
"ckeditor5-dll"
|
11
11
|
],
|
12
12
|
"main": "src/index.js",
|
13
|
+
"type": "module",
|
13
14
|
"dependencies": {
|
14
|
-
"ckeditor5": "38.
|
15
|
+
"ckeditor5": "38.2.0-alpha.1",
|
15
16
|
"lodash-es": "^4.17.15"
|
16
17
|
},
|
17
18
|
"engines": {
|
package/src/classiceditor.d.ts
CHANGED
@@ -1,180 +1,180 @@
|
|
1
|
-
/**
|
2
|
-
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
3
|
-
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
4
|
-
*/
|
5
|
-
/**
|
6
|
-
* @module editor-classic/classiceditor
|
7
|
-
*/
|
8
|
-
import ClassicEditorUI from './classiceditorui';
|
9
|
-
import { Editor, Context, type EditorConfig } from 'ckeditor5/src/core';
|
10
|
-
import { ContextWatchdog, EditorWatchdog } from 'ckeditor5/src/watchdog';
|
11
|
-
declare const ClassicEditor_base: import("ckeditor5/src/utils").Mixed<import("ckeditor5/src/utils").Mixed<typeof Editor, import("ckeditor5/src/core").ElementApi>, import("ckeditor5/src/core").DataApi>;
|
12
|
-
/**
|
13
|
-
* The {@glink installation/getting-started/predefined-builds#classic-editor classic editor} implementation.
|
14
|
-
* It uses an inline editable and a sticky toolbar, all enclosed in a boxed UI.
|
15
|
-
* See the {@glink examples/builds/classic-editor demo}.
|
16
|
-
*
|
17
|
-
* In order to create a classic editor instance, use the static
|
18
|
-
* {@link module:editor-classic/classiceditor~ClassicEditor.create `ClassicEditor.create()`} method.
|
19
|
-
*
|
20
|
-
* # Classic editor and classic build
|
21
|
-
*
|
22
|
-
* The classic editor can be used directly from source (if you installed the
|
23
|
-
* [`@ckeditor/ckeditor5-editor-classic`](https://www.npmjs.com/package/@ckeditor/ckeditor5-editor-classic) package)
|
24
|
-
* but it is also available in the {@glink installation/getting-started/predefined-builds#classic-editor classic build}.
|
25
|
-
*
|
26
|
-
* {@glink installation/getting-started/predefined-builds Builds}
|
27
|
-
* are ready-to-use editors with plugins bundled in. When using the editor from
|
28
|
-
* source you need to take care of loading all plugins by yourself
|
29
|
-
* (through the {@link module:core/editor/editorconfig~EditorConfig#plugins `config.plugins`} option).
|
30
|
-
* Using the editor from source gives much better flexibility and allows easier customization.
|
31
|
-
*
|
32
|
-
* Read more about initializing the editor from source or as a build in
|
33
|
-
* {@link module:editor-classic/classiceditor~ClassicEditor.create `ClassicEditor.create()`}.
|
34
|
-
*/
|
35
|
-
export default class ClassicEditor extends ClassicEditor_base {
|
36
|
-
/**
|
37
|
-
* @inheritDoc
|
38
|
-
*/
|
39
|
-
readonly ui: ClassicEditorUI;
|
40
|
-
/**
|
41
|
-
* Creates an instance of the classic editor.
|
42
|
-
*
|
43
|
-
* **Note:** do not use the constructor to create editor instances. Use the static
|
44
|
-
* {@link module:editor-classic/classiceditor~ClassicEditor.create `ClassicEditor.create()`} method instead.
|
45
|
-
*
|
46
|
-
* @param sourceElementOrData The DOM element that will be the source for the created editor
|
47
|
-
* or the editor's initial data. For more information see
|
48
|
-
* {@link module:editor-classic/classiceditor~ClassicEditor.create `ClassicEditor.create()`}.
|
49
|
-
* @param config The editor configuration.
|
50
|
-
*/
|
51
|
-
protected constructor(sourceElementOrData: HTMLElement | string, config?: EditorConfig);
|
52
|
-
/**
|
53
|
-
* Destroys the editor instance, releasing all resources used by it.
|
54
|
-
*
|
55
|
-
* Updates the original editor element with the data if the
|
56
|
-
* {@link module:core/editor/editorconfig~EditorConfig#updateSourceElementOnDestroy `updateSourceElementOnDestroy`}
|
57
|
-
* configuration option is set to `true`.
|
58
|
-
*/
|
59
|
-
destroy(): Promise<unknown>;
|
60
|
-
/**
|
61
|
-
* Creates a new classic editor instance.
|
62
|
-
*
|
63
|
-
* There are three ways how the editor can be initialized.
|
64
|
-
*
|
65
|
-
* # Replacing a DOM element (and loading data from it)
|
66
|
-
*
|
67
|
-
* You can initialize the editor using an existing DOM element:
|
68
|
-
*
|
69
|
-
* ```ts
|
70
|
-
* ClassicEditor
|
71
|
-
* .create( document.querySelector( '#editor' ) )
|
72
|
-
* .then( editor => {
|
73
|
-
* console.log( 'Editor was initialized', editor );
|
74
|
-
* } )
|
75
|
-
* .catch( err => {
|
76
|
-
* console.error( err.stack );
|
77
|
-
* } );
|
78
|
-
* ```
|
79
|
-
*
|
80
|
-
* The element's content will be used as the editor data and the element will be replaced by the editor UI.
|
81
|
-
*
|
82
|
-
* # Creating a detached editor
|
83
|
-
*
|
84
|
-
* Alternatively, you can initialize the editor by passing the initial data directly as a string.
|
85
|
-
* In this case, the editor will render an element that must be inserted into the DOM:
|
86
|
-
*
|
87
|
-
* ```ts
|
88
|
-
* ClassicEditor
|
89
|
-
* .create( '<p>Hello world!</p>' )
|
90
|
-
* .then( editor => {
|
91
|
-
* console.log( 'Editor was initialized', editor );
|
92
|
-
*
|
93
|
-
* // Initial data was provided so the editor UI element needs to be added manually to the DOM.
|
94
|
-
* document.body.appendChild( editor.ui.element );
|
95
|
-
* } )
|
96
|
-
* .catch( err => {
|
97
|
-
* console.error( err.stack );
|
98
|
-
* } );
|
99
|
-
* ```
|
100
|
-
*
|
101
|
-
* This lets you dynamically append the editor to your web page whenever it is convenient for you. You may use this method if your
|
102
|
-
* web page content is generated on the client side and the DOM structure is not ready at the moment when you initialize the editor.
|
103
|
-
*
|
104
|
-
* # Replacing a DOM element (and data provided in `config.initialData`)
|
105
|
-
*
|
106
|
-
* You can also mix these two ways by providing a DOM element to be used and passing the initial data through the configuration:
|
107
|
-
*
|
108
|
-
* ```ts
|
109
|
-
* ClassicEditor
|
110
|
-
* .create( document.querySelector( '#editor' ), {
|
111
|
-
* initialData: '<h2>Initial data</h2><p>Foo bar.</p>'
|
112
|
-
* } )
|
113
|
-
* .then( editor => {
|
114
|
-
* console.log( 'Editor was initialized', editor );
|
115
|
-
* } )
|
116
|
-
* .catch( err => {
|
117
|
-
* console.error( err.stack );
|
118
|
-
* } );
|
119
|
-
* ```
|
120
|
-
*
|
121
|
-
* This method can be used to initialize the editor on an existing element with the specified content in case if your integration
|
122
|
-
* makes it difficult to set the content of the source element.
|
123
|
-
*
|
124
|
-
* Note that an error will be thrown if you pass the initial data both as the first parameter and also in the configuration.
|
125
|
-
*
|
126
|
-
* # Configuring the editor
|
127
|
-
*
|
128
|
-
* See the {@link module:core/editor/editorconfig~EditorConfig editor configuration documentation} to learn more about
|
129
|
-
* customizing plugins, toolbar and more.
|
130
|
-
*
|
131
|
-
* # Using the editor from source
|
132
|
-
*
|
133
|
-
* The code samples listed in the previous sections of this documentation assume that you are using an
|
134
|
-
* {@glink installation/getting-started/predefined-builds editor build} (for example – `@ckeditor/ckeditor5-build-classic`).
|
135
|
-
*
|
136
|
-
* If you want to use the classic editor from source (`@ckeditor/ckeditor5-editor-classic/src/classiceditor`),
|
137
|
-
* you need to define the list of
|
138
|
-
* {@link module:core/editor/editorconfig~EditorConfig#plugins plugins to be initialized} and
|
139
|
-
* {@link module:core/editor/editorconfig~EditorConfig#toolbar toolbar items}. Read more about using the editor from
|
140
|
-
* source in the {@glink installation/advanced/alternative-setups/integrating-from-source-webpack dedicated guide}.
|
141
|
-
*
|
142
|
-
* @param sourceElementOrData The DOM element that will be the source for the created editor
|
143
|
-
* or the editor's initial data.
|
144
|
-
*
|
145
|
-
* If a DOM element is passed, its content will be automatically loaded to the editor upon initialization
|
146
|
-
* and the {@link module:editor-classic/classiceditorui~ClassicEditorUI#element editor element} will replace the passed element
|
147
|
-
* in the DOM (the original one will be hidden and the editor will be injected next to it).
|
148
|
-
*
|
149
|
-
* If the {@link module:core/editor/editorconfig~EditorConfig#updateSourceElementOnDestroy updateSourceElementOnDestroy}
|
150
|
-
* option is set to `true`, the editor data will be set back to the original element once the editor is destroyed and when a form,
|
151
|
-
* in which this element is contained, is submitted (if the original element is a `<textarea>`). This ensures seamless integration
|
152
|
-
* with native web forms.
|
153
|
-
*
|
154
|
-
* If the initial data is passed, a detached editor will be created. In this case you need to insert it into the DOM manually.
|
155
|
-
* It is available under the {@link module:editor-classic/classiceditorui~ClassicEditorUI#element `editor.ui.element`} property.
|
156
|
-
*
|
157
|
-
* @param config The editor configuration.
|
158
|
-
* @returns A promise resolved once the editor is ready. The promise resolves with the created editor instance.
|
159
|
-
*/
|
160
|
-
static create(sourceElementOrData: HTMLElement | string, config?: EditorConfig): Promise<ClassicEditor>;
|
161
|
-
/**
|
162
|
-
* The {@link module:core/context~Context} class.
|
163
|
-
*
|
164
|
-
* Exposed as static editor field for easier access in editor builds.
|
165
|
-
*/
|
166
|
-
static Context: typeof Context;
|
167
|
-
/**
|
168
|
-
* The {@link module:watchdog/editorwatchdog~EditorWatchdog} class.
|
169
|
-
*
|
170
|
-
* Exposed as static editor field for easier access in editor builds.
|
171
|
-
*/
|
172
|
-
static EditorWatchdog: typeof EditorWatchdog;
|
173
|
-
/**
|
174
|
-
* The {@link module:watchdog/contextwatchdog~ContextWatchdog} class.
|
175
|
-
*
|
176
|
-
* Exposed as static editor field for easier access in editor builds.
|
177
|
-
*/
|
178
|
-
static ContextWatchdog: typeof ContextWatchdog;
|
179
|
-
}
|
180
|
-
export {};
|
1
|
+
/**
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
4
|
+
*/
|
5
|
+
/**
|
6
|
+
* @module editor-classic/classiceditor
|
7
|
+
*/
|
8
|
+
import ClassicEditorUI from './classiceditorui.js';
|
9
|
+
import { Editor, Context, type EditorConfig } from 'ckeditor5/src/core.js';
|
10
|
+
import { ContextWatchdog, EditorWatchdog } from 'ckeditor5/src/watchdog.js';
|
11
|
+
declare const ClassicEditor_base: import("ckeditor5/src/utils.js").Mixed<import("ckeditor5/src/utils.js").Mixed<typeof Editor, import("ckeditor5/src/core.js").ElementApi>, import("ckeditor5/src/core.js").DataApi>;
|
12
|
+
/**
|
13
|
+
* The {@glink installation/getting-started/predefined-builds#classic-editor classic editor} implementation.
|
14
|
+
* It uses an inline editable and a sticky toolbar, all enclosed in a boxed UI.
|
15
|
+
* See the {@glink examples/builds/classic-editor demo}.
|
16
|
+
*
|
17
|
+
* In order to create a classic editor instance, use the static
|
18
|
+
* {@link module:editor-classic/classiceditor~ClassicEditor.create `ClassicEditor.create()`} method.
|
19
|
+
*
|
20
|
+
* # Classic editor and classic build
|
21
|
+
*
|
22
|
+
* The classic editor can be used directly from source (if you installed the
|
23
|
+
* [`@ckeditor/ckeditor5-editor-classic`](https://www.npmjs.com/package/@ckeditor/ckeditor5-editor-classic) package)
|
24
|
+
* but it is also available in the {@glink installation/getting-started/predefined-builds#classic-editor classic build}.
|
25
|
+
*
|
26
|
+
* {@glink installation/getting-started/predefined-builds Builds}
|
27
|
+
* are ready-to-use editors with plugins bundled in. When using the editor from
|
28
|
+
* source you need to take care of loading all plugins by yourself
|
29
|
+
* (through the {@link module:core/editor/editorconfig~EditorConfig#plugins `config.plugins`} option).
|
30
|
+
* Using the editor from source gives much better flexibility and allows easier customization.
|
31
|
+
*
|
32
|
+
* Read more about initializing the editor from source or as a build in
|
33
|
+
* {@link module:editor-classic/classiceditor~ClassicEditor.create `ClassicEditor.create()`}.
|
34
|
+
*/
|
35
|
+
export default class ClassicEditor extends ClassicEditor_base {
|
36
|
+
/**
|
37
|
+
* @inheritDoc
|
38
|
+
*/
|
39
|
+
readonly ui: ClassicEditorUI;
|
40
|
+
/**
|
41
|
+
* Creates an instance of the classic editor.
|
42
|
+
*
|
43
|
+
* **Note:** do not use the constructor to create editor instances. Use the static
|
44
|
+
* {@link module:editor-classic/classiceditor~ClassicEditor.create `ClassicEditor.create()`} method instead.
|
45
|
+
*
|
46
|
+
* @param sourceElementOrData The DOM element that will be the source for the created editor
|
47
|
+
* or the editor's initial data. For more information see
|
48
|
+
* {@link module:editor-classic/classiceditor~ClassicEditor.create `ClassicEditor.create()`}.
|
49
|
+
* @param config The editor configuration.
|
50
|
+
*/
|
51
|
+
protected constructor(sourceElementOrData: HTMLElement | string, config?: EditorConfig);
|
52
|
+
/**
|
53
|
+
* Destroys the editor instance, releasing all resources used by it.
|
54
|
+
*
|
55
|
+
* Updates the original editor element with the data if the
|
56
|
+
* {@link module:core/editor/editorconfig~EditorConfig#updateSourceElementOnDestroy `updateSourceElementOnDestroy`}
|
57
|
+
* configuration option is set to `true`.
|
58
|
+
*/
|
59
|
+
destroy(): Promise<unknown>;
|
60
|
+
/**
|
61
|
+
* Creates a new classic editor instance.
|
62
|
+
*
|
63
|
+
* There are three ways how the editor can be initialized.
|
64
|
+
*
|
65
|
+
* # Replacing a DOM element (and loading data from it)
|
66
|
+
*
|
67
|
+
* You can initialize the editor using an existing DOM element:
|
68
|
+
*
|
69
|
+
* ```ts
|
70
|
+
* ClassicEditor
|
71
|
+
* .create( document.querySelector( '#editor' ) )
|
72
|
+
* .then( editor => {
|
73
|
+
* console.log( 'Editor was initialized', editor );
|
74
|
+
* } )
|
75
|
+
* .catch( err => {
|
76
|
+
* console.error( err.stack );
|
77
|
+
* } );
|
78
|
+
* ```
|
79
|
+
*
|
80
|
+
* The element's content will be used as the editor data and the element will be replaced by the editor UI.
|
81
|
+
*
|
82
|
+
* # Creating a detached editor
|
83
|
+
*
|
84
|
+
* Alternatively, you can initialize the editor by passing the initial data directly as a string.
|
85
|
+
* In this case, the editor will render an element that must be inserted into the DOM:
|
86
|
+
*
|
87
|
+
* ```ts
|
88
|
+
* ClassicEditor
|
89
|
+
* .create( '<p>Hello world!</p>' )
|
90
|
+
* .then( editor => {
|
91
|
+
* console.log( 'Editor was initialized', editor );
|
92
|
+
*
|
93
|
+
* // Initial data was provided so the editor UI element needs to be added manually to the DOM.
|
94
|
+
* document.body.appendChild( editor.ui.element );
|
95
|
+
* } )
|
96
|
+
* .catch( err => {
|
97
|
+
* console.error( err.stack );
|
98
|
+
* } );
|
99
|
+
* ```
|
100
|
+
*
|
101
|
+
* This lets you dynamically append the editor to your web page whenever it is convenient for you. You may use this method if your
|
102
|
+
* web page content is generated on the client side and the DOM structure is not ready at the moment when you initialize the editor.
|
103
|
+
*
|
104
|
+
* # Replacing a DOM element (and data provided in `config.initialData`)
|
105
|
+
*
|
106
|
+
* You can also mix these two ways by providing a DOM element to be used and passing the initial data through the configuration:
|
107
|
+
*
|
108
|
+
* ```ts
|
109
|
+
* ClassicEditor
|
110
|
+
* .create( document.querySelector( '#editor' ), {
|
111
|
+
* initialData: '<h2>Initial data</h2><p>Foo bar.</p>'
|
112
|
+
* } )
|
113
|
+
* .then( editor => {
|
114
|
+
* console.log( 'Editor was initialized', editor );
|
115
|
+
* } )
|
116
|
+
* .catch( err => {
|
117
|
+
* console.error( err.stack );
|
118
|
+
* } );
|
119
|
+
* ```
|
120
|
+
*
|
121
|
+
* This method can be used to initialize the editor on an existing element with the specified content in case if your integration
|
122
|
+
* makes it difficult to set the content of the source element.
|
123
|
+
*
|
124
|
+
* Note that an error will be thrown if you pass the initial data both as the first parameter and also in the configuration.
|
125
|
+
*
|
126
|
+
* # Configuring the editor
|
127
|
+
*
|
128
|
+
* See the {@link module:core/editor/editorconfig~EditorConfig editor configuration documentation} to learn more about
|
129
|
+
* customizing plugins, toolbar and more.
|
130
|
+
*
|
131
|
+
* # Using the editor from source
|
132
|
+
*
|
133
|
+
* The code samples listed in the previous sections of this documentation assume that you are using an
|
134
|
+
* {@glink installation/getting-started/predefined-builds editor build} (for example – `@ckeditor/ckeditor5-build-classic`).
|
135
|
+
*
|
136
|
+
* If you want to use the classic editor from source (`@ckeditor/ckeditor5-editor-classic/src/classiceditor`),
|
137
|
+
* you need to define the list of
|
138
|
+
* {@link module:core/editor/editorconfig~EditorConfig#plugins plugins to be initialized} and
|
139
|
+
* {@link module:core/editor/editorconfig~EditorConfig#toolbar toolbar items}. Read more about using the editor from
|
140
|
+
* source in the {@glink installation/advanced/alternative-setups/integrating-from-source-webpack dedicated guide}.
|
141
|
+
*
|
142
|
+
* @param sourceElementOrData The DOM element that will be the source for the created editor
|
143
|
+
* or the editor's initial data.
|
144
|
+
*
|
145
|
+
* If a DOM element is passed, its content will be automatically loaded to the editor upon initialization
|
146
|
+
* and the {@link module:editor-classic/classiceditorui~ClassicEditorUI#element editor element} will replace the passed element
|
147
|
+
* in the DOM (the original one will be hidden and the editor will be injected next to it).
|
148
|
+
*
|
149
|
+
* If the {@link module:core/editor/editorconfig~EditorConfig#updateSourceElementOnDestroy updateSourceElementOnDestroy}
|
150
|
+
* option is set to `true`, the editor data will be set back to the original element once the editor is destroyed and when a form,
|
151
|
+
* in which this element is contained, is submitted (if the original element is a `<textarea>`). This ensures seamless integration
|
152
|
+
* with native web forms.
|
153
|
+
*
|
154
|
+
* If the initial data is passed, a detached editor will be created. In this case you need to insert it into the DOM manually.
|
155
|
+
* It is available under the {@link module:editor-classic/classiceditorui~ClassicEditorUI#element `editor.ui.element`} property.
|
156
|
+
*
|
157
|
+
* @param config The editor configuration.
|
158
|
+
* @returns A promise resolved once the editor is ready. The promise resolves with the created editor instance.
|
159
|
+
*/
|
160
|
+
static create(sourceElementOrData: HTMLElement | string, config?: EditorConfig): Promise<ClassicEditor>;
|
161
|
+
/**
|
162
|
+
* The {@link module:core/context~Context} class.
|
163
|
+
*
|
164
|
+
* Exposed as static editor field for easier access in editor builds.
|
165
|
+
*/
|
166
|
+
static Context: typeof Context;
|
167
|
+
/**
|
168
|
+
* The {@link module:watchdog/editorwatchdog~EditorWatchdog} class.
|
169
|
+
*
|
170
|
+
* Exposed as static editor field for easier access in editor builds.
|
171
|
+
*/
|
172
|
+
static EditorWatchdog: typeof EditorWatchdog;
|
173
|
+
/**
|
174
|
+
* The {@link module:watchdog/contextwatchdog~ContextWatchdog} class.
|
175
|
+
*
|
176
|
+
* Exposed as static editor field for easier access in editor builds.
|
177
|
+
*/
|
178
|
+
static ContextWatchdog: typeof ContextWatchdog;
|
179
|
+
}
|
180
|
+
export {};
|