@ckeditor/ckeditor5-editor-multi-root 44.1.0-alpha.5 → 44.2.0-alpha.0

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.
@@ -1,548 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, 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
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
8
- */
9
- /**
10
- * @module editor-multi-root/multirooteditor
11
- */
12
- import { Editor, type EditorConfig } from 'ckeditor5/src/core.js';
13
- import { type DecoratedMethodEvent } from 'ckeditor5/src/utils.js';
14
- import MultiRootEditorUI from './multirooteditorui.js';
15
- import { type RootElement } from 'ckeditor5/src/engine.js';
16
- /**
17
- * The multi-root editor implementation.
18
- *
19
- * The multi-root editor provides multiple inline editable elements and a toolbar. All editable areas are controlled by one editor
20
- * instance, which means that they share common configuration, document ID, or undo stack.
21
- *
22
- * This type of editor is dedicated to integrations which require a customized UI with an open structure, featuring multiple editable areas,
23
- * allowing developers to have a control over the exact location of these editable areas.
24
- *
25
- * In order to create a multi-root editor instance, use the static
26
- * {@link module:editor-multi-root/multirooteditor~MultiRootEditor.create `MultiRootEditor.create()`} method.
27
- *
28
- * Note that you will need to attach the editor toolbar to your web page manually, in a desired place, after the editor is initialized.
29
- */
30
- export default class MultiRootEditor extends Editor {
31
- /**
32
- * @inheritDoc
33
- */
34
- static get editorName(): 'MultiRootEditor';
35
- /**
36
- * @inheritDoc
37
- */
38
- readonly ui: MultiRootEditorUI;
39
- /**
40
- * The elements on which the editor has been initialized.
41
- */
42
- readonly sourceElements: Record<string, HTMLElement>;
43
- /**
44
- * Holds attributes keys that were passed in {@link module:core/editor/editorconfig~EditorConfig#rootsAttributes `rootsAttributes`}
45
- * config property and should be returned by {@link #getRootsAttributes}.
46
- */
47
- private readonly _registeredRootsAttributesKeys;
48
- /**
49
- * A set of lock IDs for enabling or disabling particular root.
50
- */
51
- private readonly _readOnlyRootLocks;
52
- /**
53
- * Creates an instance of the multi-root editor.
54
- *
55
- * **Note:** Do not use the constructor to create editor instances. Use the static
56
- * {@link module:editor-multi-root/multirooteditor~MultiRootEditor.create `MultiRootEditor.create()`} method instead.
57
- *
58
- * @param sourceElementsOrData The DOM elements that will be the source for the created editor
59
- * or the editor's initial data. The editor will initialize multiple roots with names according to the keys in the passed object.
60
- * For more information see {@link module:editor-multi-root/multirooteditor~MultiRootEditor.create `MultiRootEditor.create()`}.
61
- * @param config The editor configuration.
62
- */
63
- protected constructor(sourceElementsOrData: Record<string, HTMLElement> | Record<string, string>, config?: EditorConfig);
64
- /**
65
- * Destroys the editor instance, releasing all resources used by it.
66
- *
67
- * Updates the original editor element with the data if the
68
- * {@link module:core/editor/editorconfig~EditorConfig#updateSourceElementOnDestroy `updateSourceElementOnDestroy`}
69
- * configuration option is set to `true`.
70
- *
71
- * **Note**: The multi-root editor does not remove the toolbar and editable when destroyed. You can
72
- * do that yourself in the destruction chain, if you need to:
73
- *
74
- * ```ts
75
- * editor.destroy().then( () => {
76
- * // Remove the toolbar from DOM.
77
- * editor.ui.view.toolbar.element.remove();
78
- *
79
- * // Remove editable elements from DOM.
80
- * for ( const editable of Object.values( editor.ui.view.editables ) ) {
81
- * editable.element.remove();
82
- * }
83
- *
84
- * console.log( 'Editor was destroyed' );
85
- * } );
86
- * ```
87
- */
88
- destroy(): Promise<unknown>;
89
- /**
90
- * Adds a new root to the editor.
91
- *
92
- * ```ts
93
- * editor.addRoot( 'myRoot', { data: '<p>Initial root data.</p>' } );
94
- * ```
95
- *
96
- * After a root is added, you will be able to modify and retrieve its data.
97
- *
98
- * All root names must be unique. An error will be thrown if you will try to create a root with the name same as
99
- * an already existing, attached root. However, you can call this method for a detached root. See also {@link #detachRoot}.
100
- *
101
- * Whenever a root is added, the editor instance will fire {@link #event:addRoot `addRoot` event}. The event is also called when
102
- * the root is added indirectly, e.g. by the undo feature or on a remote client during real-time collaboration.
103
- *
104
- * Note, that this method only adds a root to the editor model. It **does not** create a DOM editable element for the new root.
105
- * Until such element is created (and attached to the root), the root is "virtual": it is not displayed anywhere and its data can
106
- * be changed only using the editor API.
107
- *
108
- * To create a DOM editable element for the root, listen to {@link #event:addRoot `addRoot` event} and call {@link #createEditable}.
109
- * Then, insert the DOM element in a desired place, that will depend on the integration with your application and your requirements.
110
- *
111
- * ```ts
112
- * editor.on( 'addRoot', ( evt, root ) => {
113
- * const editableElement = editor.createEditable( root );
114
- *
115
- * // You may want to create a more complex DOM structure here.
116
- * //
117
- * // Alternatively, you may want to create a DOM structure before
118
- * // calling `editor.addRoot()` and only append `editableElement` at
119
- * // a proper place.
120
- *
121
- * document.querySelector( '#editors' ).appendChild( editableElement );
122
- * } );
123
- *
124
- * // ...
125
- *
126
- * editor.addRoot( 'myRoot' ); // Will create a root, a DOM editable element and append it to `#editors` container element.
127
- * ```
128
- *
129
- * You can set root attributes on the new root while you add it:
130
- *
131
- * ```ts
132
- * // Add a collapsed root at fourth position from top.
133
- * // Keep in mind that these are just examples of attributes. You need to provide your own features that will handle the attributes.
134
- * editor.addRoot( 'myRoot', { attributes: { isCollapsed: true, index: 4 } } );
135
- * ```
136
- *
137
- * Note that attributes added together with a root are automatically registered.
138
- *
139
- * See also {@link ~MultiRootEditor#registerRootAttribute `MultiRootEditor#registerRootAttribute()`} and
140
- * {@link module:core/editor/editorconfig~EditorConfig#rootsAttributes `config.rootsAttributes` configuration option}.
141
- *
142
- * By setting `isUndoable` flag to `true`, you can allow for detaching the root using the undo feature.
143
- *
144
- * Additionally, you can group adding multiple roots in one undo step. This can be useful if you add multiple roots that are
145
- * combined into one, bigger UI element, and want them all to be undone together.
146
- *
147
- * ```ts
148
- * let rowId = 0;
149
- *
150
- * editor.model.change( () => {
151
- * editor.addRoot( 'left-row-' + rowId, { isUndoable: true } );
152
- * editor.addRoot( 'center-row-' + rowId, { isUndoable: true } );
153
- * editor.addRoot( 'right-row-' + rowId, { isUndoable: true } );
154
- *
155
- * rowId++;
156
- * } );
157
- * ```
158
- *
159
- * @param rootName Name of the root to add.
160
- * @param options Additional options for the added root.
161
- */
162
- addRoot(rootName: string, { data, attributes, elementName, isUndoable }?: AddRootOptions): void;
163
- /**
164
- * Detaches a root from the editor.
165
- *
166
- * ```ts
167
- * editor.detachRoot( 'myRoot' );
168
- * ```
169
- *
170
- * A detached root is not entirely removed from the editor model, however it can be considered removed.
171
- *
172
- * After a root is detached all its children are removed, all markers inside it are removed, and whenever something is inserted to it,
173
- * it is automatically removed as well. Finally, a detached root is not returned by
174
- * {@link module:engine/model/document~Document#getRootNames} by default.
175
- *
176
- * It is possible to re-add a previously detached root calling {@link #addRoot}.
177
- *
178
- * Whenever a root is detached, the editor instance will fire {@link #event:detachRoot `detachRoot` event}. The event is also
179
- * called when the root is detached indirectly, e.g. by the undo feature or on a remote client during real-time collaboration.
180
- *
181
- * Note, that this method only detached a root in the editor model. It **does not** destroy the DOM editable element linked with
182
- * the root and it **does not** remove the DOM element from the DOM structure of your application.
183
- *
184
- * To properly remove a DOM editable element after a root was detached, listen to {@link #event:detachRoot `detachRoot` event}
185
- * and call {@link #detachEditable}. Then, remove the DOM element from your application.
186
- *
187
- * ```ts
188
- * editor.on( 'detachRoot', ( evt, root ) => {
189
- * const editableElement = editor.detachEditable( root );
190
- *
191
- * // You may want to do an additional DOM clean-up here.
192
- *
193
- * editableElement.remove();
194
- * } );
195
- *
196
- * // ...
197
- *
198
- * editor.detachRoot( 'myRoot' ); // Will detach the root, and remove the DOM editable element.
199
- * ```
200
- *
201
- * By setting `isUndoable` flag to `true`, you can allow for re-adding the root using the undo feature.
202
- *
203
- * Additionally, you can group detaching multiple roots in one undo step. This can be useful if the roots are combined into one,
204
- * bigger UI element, and you want them all to be re-added together.
205
- *
206
- * ```ts
207
- * editor.model.change( () => {
208
- * editor.detachRoot( 'left-row-3', true );
209
- * editor.detachRoot( 'center-row-3', true );
210
- * editor.detachRoot( 'right-row-3', true );
211
- * } );
212
- * ```
213
- *
214
- * @param rootName Name of the root to detach.
215
- * @param isUndoable Whether detaching the root can be undone (using the undo feature) or not.
216
- */
217
- detachRoot(rootName: string, isUndoable?: boolean): void;
218
- /**
219
- * Creates and returns a new DOM editable element for the given root element.
220
- *
221
- * The new DOM editable is attached to the model root and can be used to modify the root content.
222
- *
223
- * @param root Root for which the editable element should be created.
224
- * @param placeholder Placeholder for the editable element. If not set, placeholder value from the
225
- * {@link module:core/editor/editorconfig~EditorConfig#placeholder editor configuration} will be used (if it was provided).
226
- * @param label The accessible label text describing the editable to the assistive technologies.
227
- * @returns The created DOM element. Append it in a desired place in your application.
228
- */
229
- createEditable(root: RootElement, placeholder?: string, label?: string): HTMLElement;
230
- /**
231
- * Detaches the DOM editable element that was attached to the given root.
232
- *
233
- * @param root Root for which the editable element should be detached.
234
- * @returns The DOM element that was detached. You may want to remove it from your application DOM structure.
235
- */
236
- detachEditable(root: RootElement): HTMLElement;
237
- /**
238
- * Loads a root that has previously been declared in {@link module:core/editor/editorconfig~EditorConfig#lazyRoots `lazyRoots`}
239
- * configuration option.
240
- *
241
- * Only roots specified in the editor config can be loaded. A root cannot be loaded multiple times. A root cannot be unloaded and
242
- * loading a root cannot be reverted using the undo feature.
243
- *
244
- * When a root becomes loaded, it will be treated by the editor as though it was just added. This, among others, means that all
245
- * related events and mechanisms will be fired, including {@link ~MultiRootEditor#event:addRoot `addRoot` event},
246
- * {@link module:engine/model/document~Document#event:change `model.Document` `change` event}, model post-fixers and conversion.
247
- *
248
- * Until the root becomes loaded, all above mechanisms are suppressed.
249
- *
250
- * This method is {@link module:utils/observablemixin~Observable#decorate decorated}.
251
- *
252
- * Note that attributes loaded together with a root are automatically registered.
253
- *
254
- * See also {@link ~MultiRootEditor#registerRootAttribute `MultiRootEditor#registerRootAttribute()`} and
255
- * {@link module:core/editor/editorconfig~EditorConfig#rootsAttributes `config.rootsAttributes` configuration option}.
256
- *
257
- * When this method is used in real-time collaboration environment, its effects become asynchronous as the editor will first synchronize
258
- * with the remote editing session, before the root is added to the editor.
259
- *
260
- * If the root has been already loaded by any other client, the additional data passed in `loadRoot()` parameters will be ignored.
261
- *
262
- * @param rootName Name of the root to load.
263
- * @param options Additional options for the loaded root.
264
- * @fires loadRoot
265
- */
266
- loadRoot(rootName: string, { data, attributes }?: LoadRootOptions): void;
267
- /**
268
- * Returns the document data for all attached roots.
269
- *
270
- * @param options Additional configuration for the retrieved data.
271
- * Editor features may introduce more configuration options that can be set through this parameter.
272
- * @param options.trim Whether returned data should be trimmed. This option is set to `'empty'` by default,
273
- * which means that whenever editor content is considered empty, an empty string is returned. To turn off trimming
274
- * use `'none'`. In such cases exact content will be returned (for example `'<p>&nbsp;</p>'` for an empty editor).
275
- * @returns The full document data.
276
- */
277
- getFullData(options?: Record<string, unknown>): Record<string, string>;
278
- /**
279
- * Returns attributes for all attached roots.
280
- *
281
- * Note: all and only {@link ~MultiRootEditor#registerRootAttribute registered} roots attributes will be returned.
282
- * If a registered root attribute is not set for a given root, `null` will be returned.
283
- *
284
- * @returns Object with roots attributes. Keys are roots names, while values are attributes set on given root.
285
- */
286
- getRootsAttributes(): Record<string, RootAttributes>;
287
- /**
288
- * Returns attributes for the specified root.
289
- *
290
- * Note: all and only {@link ~MultiRootEditor#registerRootAttribute registered} roots attributes will be returned.
291
- * If a registered root attribute is not set for a given root, `null` will be returned.
292
- */
293
- getRootAttributes(rootName: string): RootAttributes;
294
- /**
295
- * Registers given string as a root attribute key. Registered root attributes are added to
296
- * {@link module:engine/model/schema~Schema schema}, and also returned by
297
- * {@link ~MultiRootEditor#getRootAttributes `getRootAttributes()`} and
298
- * {@link ~MultiRootEditor#getRootsAttributes `getRootsAttributes()`}.
299
- *
300
- * Note: attributes passed in {@link module:core/editor/editorconfig~EditorConfig#rootsAttributes `config.rootsAttributes`} are
301
- * automatically registered as the editor is initialized. However, registering the same attribute twice does not have any negative
302
- * impact, so it is recommended to use this method in any feature that uses roots attributes.
303
- */
304
- registerRootAttribute(key: string): void;
305
- /**
306
- * Switches given editor root to the read-only mode.
307
- *
308
- * In contrary to {@link module:core/editor/editor~Editor#enableReadOnlyMode `enableReadOnlyMode()`}, which switches the whole editor
309
- * to the read-only mode, this method turns only a particular root to the read-only mode. This can be useful when you want to prevent
310
- * editing only a part of the editor content.
311
- *
312
- * When you switch a root to the read-only mode, you need provide a unique identifier (`lockId`) that will identify this request. You
313
- * will need to provide the same `lockId` when you will want to
314
- * {@link module:editor-multi-root/multirooteditor~MultiRootEditor#enableRoot re-enable} the root.
315
- *
316
- * ```ts
317
- * const model = editor.model;
318
- * const myRoot = model.document.getRoot( 'myRoot' );
319
- *
320
- * editor.disableRoot( 'myRoot', 'my-lock' );
321
- * model.canEditAt( myRoot ); // `false`
322
- *
323
- * editor.disableRoot( 'myRoot', 'other-lock' );
324
- * editor.disableRoot( 'myRoot', 'other-lock' ); // Multiple locks with the same ID have no effect.
325
- * model.canEditAt( myRoot ); // `false`
326
- *
327
- * editor.enableRoot( 'myRoot', 'my-lock' );
328
- * model.canEditAt( myRoot ); // `false`
329
- *
330
- * editor.enableRoot( 'myRoot', 'other-lock' );
331
- * model.canEditAt( myRoot ); // `true`
332
- * ```
333
- *
334
- * See also {@link module:core/editor/editor~Editor#enableReadOnlyMode `Editor#enableReadOnlyMode()`} and
335
- * {@link module:editor-multi-root/multirooteditor~MultiRootEditor#enableRoot `MultiRootEditor#enableRoot()`}.
336
- *
337
- * @param rootName Name of the root to switch to read-only mode.
338
- * @param lockId A unique ID for setting the editor to the read-only state.
339
- */
340
- disableRoot(rootName: string, lockId: string | symbol): void;
341
- /**
342
- * Removes given read-only lock from the given root.
343
- *
344
- * See {@link module:editor-multi-root/multirooteditor~MultiRootEditor#disableRoot `disableRoot()`}.
345
- *
346
- * @param rootName Name of the root to switch back from the read-only mode.
347
- * @param lockId A unique ID for setting the editor to the read-only state.
348
- */
349
- enableRoot(rootName: string, lockId: string | symbol): void;
350
- /**
351
- * Creates a new multi-root editor instance.
352
- *
353
- * **Note:** remember that `MultiRootEditor` does not append the toolbar element to your web page, so you have to do it manually
354
- * after the editor has been initialized.
355
- *
356
- * There are a few different ways to initialize the multi-root editor.
357
- *
358
- * # Using existing DOM elements:
359
- *
360
- * ```ts
361
- * MultiRootEditor.create( {
362
- * intro: document.querySelector( '#editor-intro' ),
363
- * content: document.querySelector( '#editor-content' ),
364
- * sidePanelLeft: document.querySelector( '#editor-side-left' ),
365
- * sidePanelRight: document.querySelector( '#editor-side-right' ),
366
- * outro: document.querySelector( '#editor-outro' )
367
- * } )
368
- * .then( editor => {
369
- * console.log( 'Editor was initialized', editor );
370
- *
371
- * // Append the toolbar inside a provided DOM element.
372
- * document.querySelector( '#toolbar-container' ).appendChild( editor.ui.view.toolbar.element );
373
- * } )
374
- * .catch( err => {
375
- * console.error( err.stack );
376
- * } );
377
- * ```
378
- *
379
- * The elements' content will be used as the editor data and elements will become editable elements.
380
- *
381
- * # Creating a detached editor
382
- *
383
- * Alternatively, you can initialize the editor by passing the initial data directly as strings.
384
- * In this case, you will have to manually append both the toolbar element and the editable elements to your web page.
385
- *
386
- * ```ts
387
- * MultiRootEditor.create( {
388
- * intro: '<p><strong>Exciting</strong> intro text to an article.</p>',
389
- * content: '<p>Lorem ipsum dolor sit amet.</p>',
390
- * sidePanelLeft: '<blockquote>Strong quotation from article.</blockquote>',
391
- * sidePanelRight: '<p>List of similar articles...</p>',
392
- * outro: '<p>Closing text.</p>'
393
- * } )
394
- * .then( editor => {
395
- * console.log( 'Editor was initialized', editor );
396
- *
397
- * // Append the toolbar inside a provided DOM element.
398
- * document.querySelector( '#toolbar-container' ).appendChild( editor.ui.view.toolbar.element );
399
- *
400
- * // Append DOM editable elements created by the editor.
401
- * const editables = editor.ui.view.editables;
402
- * const container = document.querySelector( '#editable-container' );
403
- *
404
- * container.appendChild( editables.intro.element );
405
- * container.appendChild( editables.content.element );
406
- * container.appendChild( editables.outro.element );
407
- * } )
408
- * .catch( err => {
409
- * console.error( err.stack );
410
- * } );
411
- * ```
412
- *
413
- * This lets you dynamically append the editor to your web page whenever it is convenient for you. You may use this method if your
414
- * web page content is generated on the client side and the DOM structure is not ready at the moment when you initialize the editor.
415
- *
416
- * # Using an existing DOM element (and data provided in `config.initialData`)
417
- *
418
- * You can also mix these two ways by providing a DOM element to be used and passing the initial data through the configuration:
419
- *
420
- * ```ts
421
- * MultiRootEditor.create( {
422
- * intro: document.querySelector( '#editor-intro' ),
423
- * content: document.querySelector( '#editor-content' ),
424
- * sidePanelLeft: document.querySelector( '#editor-side-left' ),
425
- * sidePanelRight: document.querySelector( '#editor-side-right' ),
426
- * outro: document.querySelector( '#editor-outro' )
427
- * }, {
428
- * initialData: {
429
- * intro: '<p><strong>Exciting</strong> intro text to an article.</p>',
430
- * content: '<p>Lorem ipsum dolor sit amet.</p>',
431
- * sidePanelLeft '<blockquote>Strong quotation from article.</blockquote>':
432
- * sidePanelRight '<p>List of similar articles...</p>':
433
- * outro: '<p>Closing text.</p>'
434
- * }
435
- * } )
436
- * .then( editor => {
437
- * console.log( 'Editor was initialized', editor );
438
- *
439
- * // Append the toolbar inside a provided DOM element.
440
- * document.querySelector( '#toolbar-container' ).appendChild( editor.ui.view.toolbar.element );
441
- * } )
442
- * .catch( err => {
443
- * console.error( err.stack );
444
- * } );
445
- * ```
446
- *
447
- * This method can be used to initialize the editor on an existing element with the specified content in case if your integration
448
- * makes it difficult to set the content of the source element.
449
- *
450
- * Note that an error will be thrown if you pass the initial data both as the first parameter and also in the configuration.
451
- *
452
- * # Configuring the editor
453
- *
454
- * See the {@link module:core/editor/editorconfig~EditorConfig editor configuration documentation} to learn more about
455
- * customizing plugins, toolbar and more.
456
- *
457
- * @param sourceElementsOrData The DOM elements that will be the source for the created editor
458
- * or the editor's initial data. The editor will initialize multiple roots with names according to the keys in the passed object.
459
- *
460
- * If DOM elements are passed, their content will be automatically loaded to the editor upon initialization and the elements will be
461
- * used as the editor's editable areas. The editor data will be set back to the original element once the editor is destroyed if the
462
- * {@link module:core/editor/editorconfig~EditorConfig#updateSourceElementOnDestroy updateSourceElementOnDestroy} option
463
- * is set to `true`.
464
- *
465
- * If the initial data is passed, a detached editor will be created. For each entry in the passed object, one editor root and one
466
- * editable DOM element will be created. You will need to attach the editable elements into the DOM manually. The elements are available
467
- * through the {@link module:editor-multi-root/multirooteditorui~MultiRootEditorUI#getEditableElement `editor.ui.getEditableElement()`}
468
- * method.
469
- * @param config The editor configuration.
470
- * @returns A promise resolved once the editor is ready. The promise resolves with the created editor instance.
471
- */
472
- static create(sourceElementsOrData: Record<string, HTMLElement> | Record<string, string>, config?: EditorConfig): Promise<MultiRootEditor>;
473
- /**
474
- * @internal
475
- */
476
- private _verifyRootsWithInitialData;
477
- }
478
- /**
479
- * Fired whenever a root is {@link ~MultiRootEditor#addRoot added or re-added} to the editor model.
480
- *
481
- * Use this event to {@link ~MultiRootEditor#createEditable create a DOM editable} for the added root and append the DOM element
482
- * in a desired place in your application.
483
- *
484
- * The event is fired after all changes from a given batch are applied. The event is not fired, if the root was added and detached
485
- * in the same batch.
486
- *
487
- * @eventName ~MultiRootEditor#addRoot
488
- * @param root The root that was added.
489
- */
490
- export type AddRootEvent = {
491
- name: 'addRoot';
492
- args: [root: RootElement];
493
- };
494
- /**
495
- * Fired whenever a root is {@link ~MultiRootEditor#detachRoot detached} from the editor model.
496
- *
497
- * Use this event to {@link ~MultiRootEditor#detachEditable destroy a DOM editable} for the detached root and remove the DOM element
498
- * from your application.
499
- *
500
- * The event is fired after all changes from a given batch are applied. The event is not fired, if the root was detached and re-added
501
- * in the same batch.
502
- *
503
- * @eventName ~MultiRootEditor#detachRoot
504
- * @param root The root that was detached.
505
- */
506
- export type DetachRootEvent = {
507
- name: 'detachRoot';
508
- args: [root: RootElement];
509
- };
510
- /**
511
- * Event fired when {@link ~MultiRootEditor#loadRoot} method is called.
512
- *
513
- * The {@link ~MultiRootEditor#loadRoot default action of that method} is implemented as a
514
- * listener to this event, so it can be fully customized by the features.
515
- *
516
- * @eventName ~MultiRootEditor#loadRoot
517
- * @param args The arguments passed to the original method.
518
- */
519
- export type LoadRootEvent = DecoratedMethodEvent<MultiRootEditor, 'loadRoot'>;
520
- /**
521
- * Additional options available when adding a root.
522
- */
523
- export type AddRootOptions = {
524
- /**
525
- * Initial data for the root.
526
- */
527
- data?: string;
528
- /**
529
- * Initial attributes for the root.
530
- */
531
- attributes?: RootAttributes;
532
- /**
533
- * Element name for the root element in the model. It can be used to set different schema rules for different roots.
534
- */
535
- elementName?: string;
536
- /**
537
- * Whether creating the root can be undone (using the undo feature) or not.
538
- */
539
- isUndoable?: boolean;
540
- };
541
- /**
542
- * Additional options available when loading a root.
543
- */
544
- export type LoadRootOptions = Omit<AddRootOptions, 'elementName' | 'isUndoable'>;
545
- /**
546
- * Attributes set on a model root element.
547
- */
548
- export type RootAttributes = Record<string, unknown>;
@@ -1,78 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2024, 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
- * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
7
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
8
- */
9
- /**
10
- * @module editor-multi-root/multirooteditorui
11
- */
12
- import { type Editor } from 'ckeditor5/src/core.js';
13
- import { EditorUI, type InlineEditableUIView } from 'ckeditor5/src/ui.js';
14
- import type MultiRootEditorUIView from './multirooteditoruiview.js';
15
- /**
16
- * The multi-root editor UI class.
17
- */
18
- export default class MultiRootEditorUI extends EditorUI {
19
- /**
20
- * The main (top–most) view of the editor UI.
21
- */
22
- readonly view: MultiRootEditorUIView;
23
- /**
24
- * The editable element that was focused the last time when any of the editables had focus.
25
- */
26
- private _lastFocusedEditableElement;
27
- /**
28
- * Creates an instance of the multi-root editor UI class.
29
- *
30
- * @param editor The editor instance.
31
- * @param view The view of the UI.
32
- */
33
- constructor(editor: Editor, view: MultiRootEditorUIView);
34
- /**
35
- * Initializes the UI.
36
- */
37
- init(): void;
38
- /**
39
- * Adds the editable to the editor UI.
40
- *
41
- * After the editable is added to the editor UI it can be considered "active".
42
- *
43
- * The editable is attached to the editor editing pipeline, which means that it will be updated as the editor model updates and
44
- * changing its content will be reflected in the editor model. Keystrokes, focus handling and placeholder are initialized.
45
- *
46
- * @param editable The editable instance to add.
47
- * @param placeholder Placeholder for the editable element. If not set, placeholder value from the
48
- * {@link module:core/editor/editorconfig~EditorConfig#placeholder editor configuration} will be used (if it was provided).
49
- */
50
- addEditable(editable: InlineEditableUIView, placeholder?: string): void;
51
- /**
52
- * Removes the editable instance from the editor UI.
53
- *
54
- * Removed editable can be considered "deactivated".
55
- *
56
- * The editable is detached from the editing pipeline, so model changes are no longer reflected in it. All handling added in
57
- * {@link #addEditable} is removed.
58
- *
59
- * @param editable Editable to remove from the editor UI.
60
- */
61
- removeEditable(editable: InlineEditableUIView): void;
62
- /**
63
- * @inheritDoc
64
- */
65
- destroy(): void;
66
- /**
67
- * Initializes the editor main toolbar and its panel.
68
- */
69
- private _initToolbar;
70
- /**
71
- * Enables the placeholder text on a given editable.
72
- *
73
- * @param editable Editable on which the placeholder should be set.
74
- * @param placeholder Placeholder for the editable element. If not set, placeholder value from the
75
- * {@link module:core/editor/editorconfig~EditorConfig#placeholder editor configuration} will be used (if it was provided).
76
- */
77
- private _initPlaceholder;
78
- }