/
editor.ts
694 lines (627 loc) · 23.8 KB
/
editor.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
/**
* @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
*/
/**
* @module core/editor/editor
*/
import {
Config,
CKEditorError,
ObservableMixin,
type Locale,
type LocaleTranslate,
type ObservableChangeEvent
} from '@ckeditor/ckeditor5-utils';
import {
Conversion,
DataController,
EditingController,
Model,
StylesProcessor
} from '@ckeditor/ckeditor5-engine';
import type { EditorUI } from '@ckeditor/ckeditor5-ui';
import Context from '../context.js';
import PluginCollection from '../plugincollection.js';
import CommandCollection, { type CommandsMap } from '../commandcollection.js';
import EditingKeystrokeHandler from '../editingkeystrokehandler.js';
import Accessibility from '../accessibility.js';
import type { LoadedPlugins, PluginConstructor } from '../plugin.js';
import type { EditorConfig } from './editorconfig.js';
/**
* The class representing a basic, generic editor.
*
* Check out the list of its subclasses to learn about specific editor implementations.
*
* All editor implementations (like {@link module:editor-classic/classiceditor~ClassicEditor} or
* {@link module:editor-inline/inlineeditor~InlineEditor}) should extend this class. They can add their
* own methods and properties.
*
* When you are implementing a plugin, this editor represents the API
* which your plugin can expect to get when using its {@link module:core/plugin~Plugin#editor} property.
*
* This API should be sufficient in order to implement the "editing" part of your feature
* (schema definition, conversion, commands, keystrokes, etc.).
* It does not define the editor UI, which is available only if
* the specific editor implements also the {@link ~Editor#ui} property
* (as most editor implementations do).
*/
export default abstract class Editor extends ObservableMixin() {
/**
* A namespace for the accessibility features of the editor.
*/
public readonly accessibility: Accessibility;
/**
* Commands registered to the editor.
*
* Use the shorthand {@link #execute `editor.execute()`} method to execute commands:
*
* ```ts
* // Execute the bold command:
* editor.execute( 'bold' );
*
* // Check the state of the bold command:
* editor.commands.get( 'bold' ).value;
* ```
*/
public readonly commands: CommandCollection;
/**
* Stores all configurations specific to this editor instance.
*
* ```ts
* editor.config.get( 'image.toolbar' );
* // -> [ 'imageStyle:block', 'imageStyle:side', '|', 'toggleImageCaption', 'imageTextAlternative' ]
* ```
*/
public readonly config: Config<EditorConfig>;
/**
* Conversion manager through which you can register model-to-view and view-to-model converters.
*
* See the {@link module:engine/conversion/conversion~Conversion} documentation to learn how to add converters.
*/
public readonly conversion: Conversion;
/**
* The {@link module:engine/controller/datacontroller~DataController data controller}.
* Used e.g. for setting and retrieving the editor data.
*/
public readonly data: DataController;
/**
* The {@link module:engine/controller/editingcontroller~EditingController editing controller}.
* Controls user input and rendering the content for editing.
*/
public readonly editing: EditingController;
/**
* The locale instance.
*/
public readonly locale: Locale;
/**
* The editor's model.
*
* The central point of the editor's abstract data model.
*/
public readonly model: Model;
/**
* The plugins loaded and in use by this editor instance.
*
* ```ts
* editor.plugins.get( 'ClipboardPipeline' ); // -> An instance of the clipboard pipeline plugin.
* ```
*/
public readonly plugins: PluginCollection<Editor>;
/**
* An instance of the {@link module:core/editingkeystrokehandler~EditingKeystrokeHandler}.
*
* It allows setting simple keystrokes:
*
* ```ts
* // Execute the bold command on Ctrl+E:
* editor.keystrokes.set( 'Ctrl+E', 'bold' );
*
* // Execute your own callback:
* editor.keystrokes.set( 'Ctrl+E', ( data, cancel ) => {
* console.log( data.keyCode );
*
* // Prevent the default (native) action and stop the underlying keydown event
* // so no other editor feature will interfere.
* cancel();
* } );
* ```
*
* Note: Certain typing-oriented keystrokes (like <kbd>Backspace</kbd> or <kbd>Enter</kbd>) are handled
* by a low-level mechanism and trying to listen to them via the keystroke handler will not work reliably.
* To handle these specific keystrokes, see the events fired by the
* {@link module:engine/view/document~Document editing view document} (`editor.editing.view.document`).
*/
public readonly keystrokes: EditingKeystrokeHandler;
/**
* Shorthand for {@link module:utils/locale~Locale#t}.
*
* @see module:utils/locale~Locale#t
*/
public readonly t: LocaleTranslate;
public declare readonly id: string;
/**
* Indicates the editor life-cycle state.
*
* The editor is in one of the following states:
*
* * `initializing` – During the editor initialization (before
* {@link module:core/editor/editor~Editor.create `Editor.create()`}) finished its job.
* * `ready` – After the promise returned by the {@link module:core/editor/editor~Editor.create `Editor.create()`}
* method is resolved.
* * `destroyed` – Once the {@link #destroy `editor.destroy()`} method was called.
*
* @observable
*/
public declare state: 'initializing' | 'ready' | 'destroyed';
/**
* The default configuration which is built into the editor class.
*
* It is used in CKEditor 5 builds to provide the default configuration options which are later used during the editor initialization.
*
* ```ts
* ClassicEditor.defaultConfig = {
* foo: 1,
* bar: 2
* };
*
* ClassicEditor
* .create( sourceElement )
* .then( editor => {
* editor.config.get( 'foo' ); // -> 1
* editor.config.get( 'bar' ); // -> 2
* } );
*
* // The default options can be overridden by the configuration passed to create().
* ClassicEditor
* .create( sourceElement, { bar: 3 } )
* .then( editor => {
* editor.config.get( 'foo' ); // -> 1
* editor.config.get( 'bar' ); // -> 3
* } );
* ```
*
* See also {@link module:core/editor/editor~Editor.builtinPlugins}.
*/
public static defaultConfig?: EditorConfig;
/**
* An array of plugins built into this editor class.
*
* It is used in CKEditor 5 builds to provide a list of plugins which are later automatically initialized
* during the editor initialization.
*
* They will be automatically initialized by the editor, unless listed in `config.removePlugins` and
* unless `config.plugins` is passed.
*
* ```ts
* // Build some plugins into the editor class first.
* ClassicEditor.builtinPlugins = [ FooPlugin, BarPlugin ];
*
* // Normally, you need to define config.plugins, but since ClassicEditor.builtinPlugins was
* // defined, now you can call create() without any configuration.
* ClassicEditor
* .create( sourceElement )
* .then( editor => {
* editor.plugins.get( FooPlugin ); // -> An instance of the Foo plugin.
* editor.plugins.get( BarPlugin ); // -> An instance of the Bar plugin.
* } );
*
* ClassicEditor
* .create( sourceElement, {
* // Do not initialize these plugins (note: it is defined by a string):
* removePlugins: [ 'Foo' ]
* } )
* .then( editor => {
* editor.plugins.get( FooPlugin ); // -> Undefined.
* editor.config.get( BarPlugin ); // -> An instance of the Bar plugin.
* } );
*
* ClassicEditor
* .create( sourceElement, {
* // Load only this plugin. It can also be defined by a string if
* // this plugin was built into the editor class.
* plugins: [ FooPlugin ]
* } )
* .then( editor => {
* editor.plugins.get( FooPlugin ); // -> An instance of the Foo plugin.
* editor.config.get( BarPlugin ); // -> Undefined.
* } );
* ```
*
* See also {@link module:core/editor/editor~Editor.defaultConfig}.
*/
public static builtinPlugins?: Array<PluginConstructor<Editor>>;
/**
* The editor UI instance.
*/
public abstract get ui(): EditorUI;
/**
* The editor context.
* When it is not provided through the configuration, the editor creates it.
*/
protected readonly _context: Context;
/**
* A set of lock IDs for the {@link #isReadOnly} getter.
*/
protected readonly _readOnlyLocks: Set<symbol | string>;
/**
* Creates a new instance of the editor class.
*
* Usually, not to be used directly. See the static {@link module:core/editor/editor~Editor.create `create()`} method.
*
* @param config The editor configuration.
*/
constructor( config: EditorConfig = {} ) {
super();
const constructor = this.constructor as typeof Editor;
// We don't pass translations to the config, because its behavior of splitting keys
// with dots (e.g. `resize.width` => `resize: { width }`) breaks the translations.
const { translations: defaultTranslations, ...defaultConfig } = constructor.defaultConfig || {};
const { translations = defaultTranslations, ...rest } = config;
// Prefer the language passed as the argument to the constructor instead of the constructor's `defaultConfig`, if both are set.
const language = config.language || defaultConfig.language;
this._context = config.context || new Context( { language, translations } );
this._context._addEditor( this, !config.context );
// Clone the plugins to make sure that the plugin array will not be shared
// between editors and make the watchdog feature work correctly.
const availablePlugins = Array.from( constructor.builtinPlugins || [] );
this.config = new Config<EditorConfig>( rest, defaultConfig );
this.config.define( 'plugins', availablePlugins );
this.config.define( this._context._getEditorConfig() );
this.plugins = new PluginCollection<Editor>( this, availablePlugins, this._context.plugins );
this.locale = this._context.locale;
this.t = this.locale.t;
this._readOnlyLocks = new Set();
this.commands = new CommandCollection();
this.set( 'state', 'initializing' );
this.once<EditorReadyEvent>( 'ready', () => ( this.state = 'ready' ), { priority: 'high' } );
this.once<EditorDestroyEvent>( 'destroy', () => ( this.state = 'destroyed' ), { priority: 'high' } );
this.model = new Model();
this.on( 'change:isReadOnly', () => {
this.model.document.isReadOnly = this.isReadOnly;
} );
const stylesProcessor = new StylesProcessor();
this.data = new DataController( this.model, stylesProcessor );
this.editing = new EditingController( this.model, stylesProcessor );
this.editing.view.document.bind( 'isReadOnly' ).to( this );
this.conversion = new Conversion( [ this.editing.downcastDispatcher, this.data.downcastDispatcher ], this.data.upcastDispatcher );
this.conversion.addAlias( 'dataDowncast', this.data.downcastDispatcher );
this.conversion.addAlias( 'editingDowncast', this.editing.downcastDispatcher );
this.keystrokes = new EditingKeystrokeHandler( this );
this.keystrokes.listenTo( this.editing.view.document );
this.accessibility = new Accessibility( this );
}
/**
* Defines whether the editor is in the read-only mode.
*
* In read-only mode the editor {@link #commands commands} are disabled so it is not possible
* to modify the document by using them. Also, the editable element(s) become non-editable.
*
* In order to make the editor read-only, you need to call the {@link #enableReadOnlyMode} method:
*
* ```ts
* editor.enableReadOnlyMode( 'feature-id' );
* ```
*
* Later, to turn off the read-only mode, call {@link #disableReadOnlyMode}:
*
* ```ts
* editor.disableReadOnlyMode( 'feature-id' );
* ```
*
* @readonly
* @observable
*/
public get isReadOnly(): boolean {
return this._readOnlyLocks.size > 0;
}
public set isReadOnly( value: boolean ) {
/**
* The {@link module:core/editor/editor~Editor#isReadOnly Editor#isReadOnly} property is read-only since version `34.0.0`
* and can be set only using {@link module:core/editor/editor~Editor#enableReadOnlyMode `Editor#enableReadOnlyMode( lockId )`} and
* {@link module:core/editor/editor~Editor#disableReadOnlyMode `Editor#disableReadOnlyMode( lockId )`}.
*
* Usage before version `34.0.0`:
*
* ```ts
* editor.isReadOnly = true;
* editor.isReadOnly = false;
* ```
*
* Usage since version `34.0.0`:
*
* ```ts
* editor.enableReadOnlyMode( 'my-feature-id' );
* editor.disableReadOnlyMode( 'my-feature-id' );
* ```
*
* @error editor-isreadonly-has-no-setter
*/
throw new CKEditorError( 'editor-isreadonly-has-no-setter' );
}
/**
* Turns on the read-only mode in the editor.
*
* Editor can be switched to or out of the read-only mode by many features, under various circumstances. The editor supports locking
* mechanism for the read-only mode. It enables easy control over the read-only mode when many features wants to turn it on or off at
* the same time, without conflicting with each other. It guarantees that you will not make the editor editable accidentally (which
* could lead to errors).
*
* Each read-only mode request is identified by a unique id (also called "lock"). If multiple plugins requested to turn on the
* read-only mode, then, the editor will become editable only after all these plugins turn the read-only mode off (using the same ids).
*
* Note, that you cannot force the editor to disable the read-only mode if other plugins set it.
*
* After the first `enableReadOnlyMode()` call, the {@link #isReadOnly `isReadOnly` property} will be set to `true`:
*
* ```ts
* editor.isReadOnly; // `false`.
* editor.enableReadOnlyMode( 'my-feature-id' );
* editor.isReadOnly; // `true`.
* ```
*
* You can turn off the read-only mode ("clear the lock") using the {@link #disableReadOnlyMode `disableReadOnlyMode()`} method:
*
* ```ts
* editor.enableReadOnlyMode( 'my-feature-id' );
* // ...
* editor.disableReadOnlyMode( 'my-feature-id' );
* editor.isReadOnly; // `false`.
* ```
*
* All "locks" need to be removed to enable editing:
*
* ```ts
* editor.enableReadOnlyMode( 'my-feature-id' );
* editor.enableReadOnlyMode( 'my-other-feature-id' );
* // ...
* editor.disableReadOnlyMode( 'my-feature-id' );
* editor.isReadOnly; // `true`.
* editor.disableReadOnlyMode( 'my-other-feature-id' );
* editor.isReadOnly; // `false`.
* ```
*
* @param lockId A unique ID for setting the editor to the read-only state.
*/
public enableReadOnlyMode( lockId: string | symbol ): void {
if ( typeof lockId !== 'string' && typeof lockId !== 'symbol' ) {
/**
* The lock ID is missing or it is not a string or symbol.
*
* @error editor-read-only-lock-id-invalid
*/
throw new CKEditorError( 'editor-read-only-lock-id-invalid', null, { lockId } );
}
if ( this._readOnlyLocks.has( lockId ) ) {
return;
}
this._readOnlyLocks.add( lockId );
if ( this._readOnlyLocks.size === 1 ) {
// Manually fire the `change:isReadOnly` event as only getter is provided.
this.fire<ObservableChangeEvent<boolean>>( 'change:isReadOnly', 'isReadOnly', true, false );
}
}
/**
* Removes the read-only lock from the editor with given lock ID.
*
* When no lock is present on the editor anymore, then the {@link #isReadOnly `isReadOnly` property} will be set to `false`.
*
* @param lockId The lock ID for setting the editor to the read-only state.
*/
public disableReadOnlyMode( lockId: string | symbol ): void {
if ( typeof lockId !== 'string' && typeof lockId !== 'symbol' ) {
throw new CKEditorError( 'editor-read-only-lock-id-invalid', null, { lockId } );
}
if ( !this._readOnlyLocks.has( lockId ) ) {
return;
}
this._readOnlyLocks.delete( lockId );
if ( this._readOnlyLocks.size === 0 ) {
// Manually fire the `change:isReadOnly` event as only getter is provided.
this.fire<ObservableChangeEvent<boolean>>( 'change:isReadOnly', 'isReadOnly', false, true );
}
}
/**
* Sets the data in the editor.
*
* ```ts
* editor.setData( '<p>This is editor!</p>' );
* ```
*
* If your editor implementation uses multiple roots, you should pass an object with keys corresponding
* to the editor root names and values equal to the data that should be set in each root:
*
* ```ts
* editor.setData( {
* header: '<p>Content for header part.</p>',
* content: '<p>Content for main part.</p>',
* footer: '<p>Content for footer part.</p>'
* } );
* ```
*
* By default the editor accepts HTML. This can be controlled by injecting a different data processor.
* See the {@glink features/markdown Markdown output} guide for more details.
*
* @param data Input data.
*/
public setData( data: string | Record<string, string> ): void {
this.data.set( data );
}
/**
* Gets the data from the editor.
*
* ```ts
* editor.getData(); // -> '<p>This is editor!</p>'
* ```
*
* If your editor implementation uses multiple roots, you should pass root name as one of the options:
*
* ```ts
* editor.getData( { rootName: 'header' } ); // -> '<p>Content for header part.</p>'
* ```
*
* By default, the editor outputs HTML. This can be controlled by injecting a different data processor.
* See the {@glink features/markdown Markdown output} guide for more details.
*
* A warning is logged when you try to retrieve data for a detached root, as most probably this is a mistake. A detached root should
* be treated like it is removed, and you should not save its data. Note, that the detached root data is always an empty string.
*
* @param options Additional configuration for the retrieved data.
* Editor features may introduce more configuration options that can be set through this parameter.
* @param options.rootName Root name. Defaults to `'main'`.
* @param options.trim Whether returned data should be trimmed. This option is set to `'empty'` by default,
* which means that whenever editor content is considered empty, an empty string is returned. To turn off trimming
* use `'none'`. In such cases exact content will be returned (for example `'<p> </p>'` for an empty editor).
* @returns Output data.
*/
public getData( options?: {
rootName?: string;
trim?: 'empty' | 'none';
[ key: string ]: unknown;
} ): string {
return this.data.get( options );
}
/**
* Loads and initializes plugins specified in the configuration.
*
* @returns A promise which resolves once the initialization is completed, providing an array of loaded plugins.
*/
public initPlugins(): Promise<LoadedPlugins> {
const config = this.config;
const plugins = config.get( 'plugins' )!;
const removePlugins = config.get( 'removePlugins' ) || [];
const extraPlugins = config.get( 'extraPlugins' ) || [];
const substitutePlugins = config.get( 'substitutePlugins' ) || [];
return this.plugins.init( plugins.concat( extraPlugins ), removePlugins, substitutePlugins );
}
/**
* Destroys the editor instance, releasing all resources used by it.
*
* **Note** The editor cannot be destroyed during the initialization phase so if it is called
* while the editor {@link #state is being initialized}, it will wait for the editor initialization before destroying it.
*
* @fires destroy
* @returns A promise that resolves once the editor instance is fully destroyed.
*/
public destroy(): Promise<unknown> {
let readyPromise: Promise<unknown> = Promise.resolve();
if ( this.state == 'initializing' ) {
readyPromise = new Promise( resolve => this.once<EditorReadyEvent>( 'ready', resolve ) );
}
return readyPromise
.then( () => {
this.fire<EditorDestroyEvent>( 'destroy' );
this.stopListening();
this.commands.destroy();
} )
.then( () => this.plugins.destroy() )
.then( () => {
this.model.destroy();
this.data.destroy();
this.editing.destroy();
this.keystrokes.destroy();
} )
// Remove the editor from the context.
// When the context was created by this editor, the context will be destroyed.
.then( () => this._context._removeEditor( this ) );
}
/**
* Executes the specified command with given parameters.
*
* Shorthand for:
*
* ```ts
* editor.commands.get( commandName ).execute( ... );
* ```
*
* @param commandName The name of the command to execute.
* @param commandParams Command parameters.
* @returns The value returned by the {@link module:core/commandcollection~CommandCollection#execute `commands.execute()`}.
*/
public execute<TName extends string>(
commandName: TName,
...commandParams: Parameters<CommandsMap[ TName ][ 'execute' ]>
): ReturnType<CommandsMap[ TName ][ 'execute' ]> {
try {
return this.commands.execute( commandName, ...commandParams );
} catch ( err: any ) {
// @if CK_DEBUG // throw err;
/* istanbul ignore next -- @preserve */
CKEditorError.rethrowUnexpectedError( err, this );
}
}
/**
* Focuses the editor.
*
* **Note** To explicitly focus the editing area of the editor, use the
* {@link module:engine/view/view~View#focus `editor.editing.view.focus()`} method of the editing view.
*
* Check out the {@glink framework/deep-dive/ui/focus-tracking#focus-in-the-editor-ui Focus in the editor UI} section
* of the {@glink framework/deep-dive/ui/focus-tracking Deep dive into focus tracking} guide to learn more.
*/
public focus(): void {
this.editing.view.focus();
}
/* istanbul ignore next -- @preserve */
/**
* Creates and initializes a new editor instance.
*
* This is an abstract method. Every editor type needs to implement its own initialization logic.
*
* See the `create()` methods of the existing editor types to learn how to use them:
*
* * {@link module:editor-classic/classiceditor~ClassicEditor.create `ClassicEditor.create()`}
* * {@link module:editor-balloon/ballooneditor~BalloonEditor.create `BalloonEditor.create()`}
* * {@link module:editor-decoupled/decouplededitor~DecoupledEditor.create `DecoupledEditor.create()`}
* * {@link module:editor-inline/inlineeditor~InlineEditor.create `InlineEditor.create()`}
*/
public static create( ...args: Array<unknown> ): void { // eslint-disable-line @typescript-eslint/no-unused-vars
throw new Error( 'This is an abstract method.' );
}
}
/**
* Fired when the {@link module:engine/controller/datacontroller~DataController#event:ready data} and all additional
* editor components are ready.
*
* Note: This event is most useful for plugin developers. When integrating the editor with your website or
* application, you do not have to listen to `editor#ready` because when the promise returned by the static
* {@link module:core/editor/editor~Editor.create `Editor.create()`} event is resolved, the editor is already ready.
* In fact, since the first moment when the editor instance is available to you is inside `then()`'s callback,
* you cannot even add a listener to the `editor#ready` event.
*
* See also the {@link module:core/editor/editor~Editor#state `editor.state`} property.
*
* @eventName ~Editor#ready
*/
export type EditorReadyEvent = {
name: 'ready';
args: [];
};
/**
* Fired when this editor instance is destroyed. The editor at this point is not usable and this event should be used to
* perform the clean-up in any plugin.
*
* See also the {@link module:core/editor/editor~Editor#state `editor.state`} property.
*
* @eventName ~Editor#destroy
*/
export type EditorDestroyEvent = {
name: 'destroy';
args: [];
};
/**
* This error is thrown when trying to pass a `<textarea>` element to a `create()` function of an editor class.
*
* The only editor type which can be initialized on `<textarea>` elements is
* the {@glink installation/getting-started/predefined-builds#classic-editor classic editor}.
* This editor hides the passed element and inserts its own UI next to it. Other types of editors reuse the passed element as their root
* editable element and therefore `<textarea>` is not appropriate for them. Use a `<div>` or another text container instead:
*
* ```html
* <div id="editor">
* <p>Initial content.</p>
* </div>
* ```
*
* @error editor-wrong-element
*/