lexical 0.8.1 → 0.9.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.
- package/Lexical.dev.js +2960 -701
- package/Lexical.prod.js +195 -193
- package/LexicalEditor.d.ts +215 -0
- package/LexicalEditorState.d.ts +3 -3
- package/LexicalNode.d.ts +241 -0
- package/LexicalUtils.d.ts +2 -0
- package/index.d.ts +1 -1
- package/nodes/LexicalElementNode.d.ts +3 -2
- package/nodes/LexicalGridCellNode.d.ts +3 -0
- package/nodes/LexicalRootNode.d.ts +2 -2
- package/package.json +1 -1
package/LexicalEditor.d.ts
CHANGED
|
@@ -194,63 +194,278 @@ export declare type SerializedEditor = {
|
|
|
194
194
|
editorState: SerializedEditorState;
|
|
195
195
|
};
|
|
196
196
|
export declare function resetEditor(editor: LexicalEditor, prevRootElement: null | HTMLElement, nextRootElement: null | HTMLElement, pendingEditorState: EditorState): void;
|
|
197
|
+
/**
|
|
198
|
+
* Creates a new LexicalEditor attached to a single contentEditable (provided in the config). This is
|
|
199
|
+
* the lowest-level initialization API for a LexicalEditor. If you're using React or another framework,
|
|
200
|
+
* consider using the appropriate abstractions, such as LexicalComposer
|
|
201
|
+
* @param editorConfig - the editor configuration.
|
|
202
|
+
* @returns a LexicalEditor instance
|
|
203
|
+
*/
|
|
197
204
|
export declare function createEditor(editorConfig?: CreateEditorArgs): LexicalEditor;
|
|
198
205
|
export declare class LexicalEditor {
|
|
206
|
+
/** @internal */
|
|
199
207
|
_headless: boolean;
|
|
208
|
+
/** @internal */
|
|
200
209
|
_parentEditor: null | LexicalEditor;
|
|
210
|
+
/** @internal */
|
|
201
211
|
_rootElement: null | HTMLElement;
|
|
212
|
+
/** @internal */
|
|
202
213
|
_editorState: EditorState;
|
|
214
|
+
/** @internal */
|
|
203
215
|
_pendingEditorState: null | EditorState;
|
|
216
|
+
/** @internal */
|
|
204
217
|
_compositionKey: null | NodeKey;
|
|
218
|
+
/** @internal */
|
|
205
219
|
_deferred: Array<() => void>;
|
|
220
|
+
/** @internal */
|
|
206
221
|
_keyToDOMMap: Map<NodeKey, HTMLElement>;
|
|
222
|
+
/** @internal */
|
|
207
223
|
_updates: Array<[() => void, EditorUpdateOptions | undefined]>;
|
|
224
|
+
/** @internal */
|
|
208
225
|
_updating: boolean;
|
|
226
|
+
/** @internal */
|
|
209
227
|
_listeners: Listeners;
|
|
228
|
+
/** @internal */
|
|
210
229
|
_commands: Commands;
|
|
230
|
+
/** @internal */
|
|
211
231
|
_nodes: RegisteredNodes;
|
|
232
|
+
/** @internal */
|
|
212
233
|
_decorators: Record<NodeKey, unknown>;
|
|
234
|
+
/** @internal */
|
|
213
235
|
_pendingDecorators: null | Record<NodeKey, unknown>;
|
|
236
|
+
/** @internal */
|
|
214
237
|
_config: EditorConfig;
|
|
238
|
+
/** @internal */
|
|
215
239
|
_dirtyType: 0 | 1 | 2;
|
|
240
|
+
/** @internal */
|
|
216
241
|
_cloneNotNeeded: Set<NodeKey>;
|
|
242
|
+
/** @internal */
|
|
217
243
|
_dirtyLeaves: Set<NodeKey>;
|
|
244
|
+
/** @internal */
|
|
218
245
|
_dirtyElements: Map<NodeKey, IntentionallyMarkedAsDirtyElement>;
|
|
246
|
+
/** @internal */
|
|
219
247
|
_normalizedNodes: Set<NodeKey>;
|
|
248
|
+
/** @internal */
|
|
220
249
|
_updateTags: Set<string>;
|
|
250
|
+
/** @internal */
|
|
221
251
|
_observer: null | MutationObserver;
|
|
252
|
+
/** @internal */
|
|
222
253
|
_key: string;
|
|
254
|
+
/** @internal */
|
|
223
255
|
_onError: ErrorHandler;
|
|
256
|
+
/** @internal */
|
|
224
257
|
_htmlConversions: DOMConversionCache;
|
|
258
|
+
/** @internal */
|
|
225
259
|
_window: null | Window;
|
|
260
|
+
/** @internal */
|
|
226
261
|
_editable: boolean;
|
|
262
|
+
/** @internal */
|
|
227
263
|
_blockCursorElement: null | HTMLDivElement;
|
|
264
|
+
/** @internal */
|
|
228
265
|
constructor(editorState: EditorState, parentEditor: null | LexicalEditor, nodes: RegisteredNodes, config: EditorConfig, onError: ErrorHandler, htmlConversions: DOMConversionCache, editable: boolean);
|
|
266
|
+
/**
|
|
267
|
+
*
|
|
268
|
+
* @returns true if the editor is currently in "composition" mode due to receiving input
|
|
269
|
+
* through an IME, or 3P extension, for example. Returns false otherwise.
|
|
270
|
+
*/
|
|
229
271
|
isComposing(): boolean;
|
|
272
|
+
/**
|
|
273
|
+
* Registers a listener for Editor update event. Will trigger the provided callback
|
|
274
|
+
* each time the editor goes through an update (via {@link LexicalEditor.update}) until the
|
|
275
|
+
* teardown function is called.
|
|
276
|
+
*
|
|
277
|
+
* @returns a teardown function that can be used to cleanup the listener.
|
|
278
|
+
*/
|
|
230
279
|
registerUpdateListener(listener: UpdateListener): () => void;
|
|
280
|
+
/**
|
|
281
|
+
* Registers a listener for for when the editor changes between editable and non-editable states.
|
|
282
|
+
* Will trigger the provided callback each time the editor transitions between these states until the
|
|
283
|
+
* teardown function is called.
|
|
284
|
+
*
|
|
285
|
+
* @returns a teardown function that can be used to cleanup the listener.
|
|
286
|
+
*/
|
|
231
287
|
registerEditableListener(listener: EditableListener): () => void;
|
|
288
|
+
/**
|
|
289
|
+
* Registers a listener for when the editor's decorator object changes. The decorator object contains
|
|
290
|
+
* all DecoratorNode keys -> their decorated value. This is primarily used with external UI frameworks.
|
|
291
|
+
*
|
|
292
|
+
* Will trigger the provided callback each time the editor transitions between these states until the
|
|
293
|
+
* teardown function is called.
|
|
294
|
+
*
|
|
295
|
+
* @returns a teardown function that can be used to cleanup the listener.
|
|
296
|
+
*/
|
|
232
297
|
registerDecoratorListener<T>(listener: DecoratorListener<T>): () => void;
|
|
298
|
+
/**
|
|
299
|
+
* Registers a listener for when Lexical commits an update to the DOM and the text content of
|
|
300
|
+
* the editor changes from the previous state of the editor. If the text content is the
|
|
301
|
+
* same between updates, no notifications to the listeners will happen.
|
|
302
|
+
*
|
|
303
|
+
* Will trigger the provided callback each time the editor transitions between these states until the
|
|
304
|
+
* teardown function is called.
|
|
305
|
+
*
|
|
306
|
+
* @returns a teardown function that can be used to cleanup the listener.
|
|
307
|
+
*/
|
|
233
308
|
registerTextContentListener(listener: TextContentListener): () => void;
|
|
309
|
+
/**
|
|
310
|
+
* Registers a listener for when the editor's root DOM element (the content editable
|
|
311
|
+
* Lexical attaches to) changes. This is primarily used to attach event listeners to the root
|
|
312
|
+
* element. The root listener function is executed directly upon registration and then on
|
|
313
|
+
* any subsequent update.
|
|
314
|
+
*
|
|
315
|
+
* Will trigger the provided callback each time the editor transitions between these states until the
|
|
316
|
+
* teardown function is called.
|
|
317
|
+
*
|
|
318
|
+
* @returns a teardown function that can be used to cleanup the listener.
|
|
319
|
+
*/
|
|
234
320
|
registerRootListener(listener: RootListener): () => void;
|
|
321
|
+
/**
|
|
322
|
+
* Registers a listener that will trigger anytime the provided command
|
|
323
|
+
* is dispatched, subject to priority. Listeners that run at a higher priority can "intercept"
|
|
324
|
+
* commands and prevent them from propagating to other handlers by returning true.
|
|
325
|
+
*
|
|
326
|
+
* Listeners registered at the same priority level will run deterministically in the order of registration.
|
|
327
|
+
*
|
|
328
|
+
* @param command - the command that will trigger the callback.
|
|
329
|
+
* @param listener - the function that will execute when the command is dispatched.
|
|
330
|
+
* @param priority - the relative priority of the listener. 0 | 1 | 2 | 3 | 4
|
|
331
|
+
* @returns a teardown function that can be used to cleanup the listener.
|
|
332
|
+
*/
|
|
235
333
|
registerCommand<P>(command: LexicalCommand<P>, listener: CommandListener<P>, priority: CommandListenerPriority): () => void;
|
|
334
|
+
/**
|
|
335
|
+
* Registers a listener that will run when a Lexical node of the provided class is
|
|
336
|
+
* mutated. The listener will receive a list of nodes along with the type of mutation
|
|
337
|
+
* that was performed on each: created, destroyed, or updated.
|
|
338
|
+
*
|
|
339
|
+
* One common use case for this is to attach DOM event listeners to the underlying DOM nodes as Lexical nodes are created.
|
|
340
|
+
* {@link LexicalEditor.getElementByKey} can be used for this.
|
|
341
|
+
*
|
|
342
|
+
* @param klass - The class of the node that you want to listen to mutations on.
|
|
343
|
+
* @param listener - The logic you want to run when the node is mutated.
|
|
344
|
+
* @returns a teardown function that can be used to cleanup the listener.
|
|
345
|
+
*/
|
|
236
346
|
registerMutationListener(klass: Klass<LexicalNode>, listener: MutationListener): () => void;
|
|
347
|
+
/** @internal */
|
|
237
348
|
private registerNodeTransformToKlass;
|
|
349
|
+
/**
|
|
350
|
+
* Registers a listener that will run when a Lexical node of the provided class is
|
|
351
|
+
* marked dirty during an update. The listener will continue to run as long as the node
|
|
352
|
+
* is marked dirty. There are no guarantees around the order of transform execution!
|
|
353
|
+
*
|
|
354
|
+
* Watch out for infinite loops. See [Node Transforms](https://lexical.dev/docs/concepts/transforms)
|
|
355
|
+
* @param klass - The class of the node that you want to run transforms on.
|
|
356
|
+
* @param listener - The logic you want to run when the node is updated.
|
|
357
|
+
* @returns a teardown function that can be used to cleanup the listener.
|
|
358
|
+
*/
|
|
238
359
|
registerNodeTransform<T extends LexicalNode>(klass: Klass<T>, listener: Transform<T>): () => void;
|
|
360
|
+
/**
|
|
361
|
+
* Used to assert that certain nodes are registered, usually by plugins to ensure nodes that they
|
|
362
|
+
* depend on have been registered.
|
|
363
|
+
* @returns True if the editor has registered all of the provided node types, false otherwise.
|
|
364
|
+
*/
|
|
239
365
|
hasNodes<T extends Klass<LexicalNode>>(nodes: Array<T>): boolean;
|
|
366
|
+
/**
|
|
367
|
+
* Dispatches a command of the specified type with the specified payload.
|
|
368
|
+
* This triggers all command listeners (set by {@link LexicalEditor.registerCommand})
|
|
369
|
+
* for this type, passing them the provided payload.
|
|
370
|
+
* @param type - the type of command listeners to trigger.
|
|
371
|
+
* @param payload - the data to pass as an argument to the command listeners.
|
|
372
|
+
*/
|
|
240
373
|
dispatchCommand<TCommand extends LexicalCommand<unknown>>(type: TCommand, payload: CommandPayloadType<TCommand>): boolean;
|
|
374
|
+
/**
|
|
375
|
+
* Gets a map of all decorators in the editor.
|
|
376
|
+
* @returns A mapping of call decorator keys to their decorated content
|
|
377
|
+
*/
|
|
241
378
|
getDecorators<T>(): Record<NodeKey, T>;
|
|
379
|
+
/**
|
|
380
|
+
*
|
|
381
|
+
* @returns the current root element of the editor. If you want to register
|
|
382
|
+
* an event listener, do it via {@link LexicalEditor.registerRootListener}, since
|
|
383
|
+
* this reference may not be stable.
|
|
384
|
+
*/
|
|
242
385
|
getRootElement(): null | HTMLElement;
|
|
386
|
+
/**
|
|
387
|
+
* Gets the key of the editor
|
|
388
|
+
* @returns The editor key
|
|
389
|
+
*/
|
|
243
390
|
getKey(): string;
|
|
391
|
+
/**
|
|
392
|
+
* Imperatively set the root contenteditable element that Lexical listens
|
|
393
|
+
* for events on.
|
|
394
|
+
*/
|
|
244
395
|
setRootElement(nextRootElement: null | HTMLElement): void;
|
|
396
|
+
/**
|
|
397
|
+
* Gets the underlying HTMLElement associated with the LexicalNode for the given key.
|
|
398
|
+
* @returns the HTMLElement rendered by the LexicalNode associated with the key.
|
|
399
|
+
* @param key - the key of the LexicalNode.
|
|
400
|
+
*/
|
|
245
401
|
getElementByKey(key: NodeKey): HTMLElement | null;
|
|
402
|
+
/**
|
|
403
|
+
* Gets the active editor state.
|
|
404
|
+
* @returns The editor state
|
|
405
|
+
*/
|
|
246
406
|
getEditorState(): EditorState;
|
|
407
|
+
/**
|
|
408
|
+
* Imperatively set the EditorState. Triggers reconciliation like an update.
|
|
409
|
+
* @param editorState - the state to set the editor
|
|
410
|
+
* @param options - options for the update.
|
|
411
|
+
*/
|
|
247
412
|
setEditorState(editorState: EditorState, options?: EditorSetOptions): void;
|
|
413
|
+
/**
|
|
414
|
+
* Parses a SerializedEditorState (usually produced by {@link EditorState.toJSON}) and returns
|
|
415
|
+
* and EditorState object that can be, for example, passed to {@link LexicalEditor.setEditorState}. Typically,
|
|
416
|
+
* deserliazation from JSON stored in a database uses this method.
|
|
417
|
+
* @param maybeStringifiedEditorState
|
|
418
|
+
* @param updateFn
|
|
419
|
+
* @returns
|
|
420
|
+
*/
|
|
248
421
|
parseEditorState(maybeStringifiedEditorState: string | SerializedEditorState, updateFn?: () => void): EditorState;
|
|
422
|
+
/**
|
|
423
|
+
* Executes an update to the editor state. The updateFn callback is the ONLY place
|
|
424
|
+
* where Lexical editor state can be safely mutated.
|
|
425
|
+
* @param updateFn - A function that has access to writable editor state.
|
|
426
|
+
* @param options - A bag of options to control the behavior of the update.
|
|
427
|
+
* @param options.onUpdate - A function to run once the update is complete.
|
|
428
|
+
* Useful for synchronizing updates in some cases.
|
|
429
|
+
* @param options.skipTransforms - Setting this to true will suppress all node
|
|
430
|
+
* transforms for this update cycle.
|
|
431
|
+
* @param options.tag - A tag to identify this update, in an update listener, for instance.
|
|
432
|
+
* Some tags are reserved by the core and control update behavior in different ways.
|
|
433
|
+
* @param options.discrete - If true, prevents this update from being batched, forcing it to
|
|
434
|
+
* run synchronously.
|
|
435
|
+
*/
|
|
249
436
|
update(updateFn: () => void, options?: EditorUpdateOptions): void;
|
|
437
|
+
/**
|
|
438
|
+
* Focuses the editor
|
|
439
|
+
* @param callbackFn - A function to run after the editor is focused.
|
|
440
|
+
* @param options - A bag of options
|
|
441
|
+
* @param options.defaultSelection - Where to move selection when the editor is
|
|
442
|
+
* focused. Can be rootStart, rootEnd, or undefined. Defaults to rootEnd.
|
|
443
|
+
*/
|
|
250
444
|
focus(callbackFn?: () => void, options?: EditorFocusOptions): void;
|
|
445
|
+
/**
|
|
446
|
+
* Removes focus from the editor.
|
|
447
|
+
*/
|
|
251
448
|
blur(): void;
|
|
449
|
+
/**
|
|
450
|
+
* Returns true if the editor is editable, false otherwise.
|
|
451
|
+
* @returns True if the editor is editable, false otherwise.
|
|
452
|
+
*/
|
|
252
453
|
isEditable(): boolean;
|
|
454
|
+
/**
|
|
455
|
+
* Sets the editable property of the editor. When false, the
|
|
456
|
+
* editor will not listen for user events on the underling contenteditable.
|
|
457
|
+
* @param editable - the value to set the editable mode to.
|
|
458
|
+
*/
|
|
253
459
|
setEditable(editable: boolean): void;
|
|
460
|
+
/**
|
|
461
|
+
* Returns a JSON-serializable javascript object NOT a JSON string.
|
|
462
|
+
* You still must call JSON.stringify (or something else) to turn the
|
|
463
|
+
* state into a string you can transfer over the wire and store in a database.
|
|
464
|
+
*
|
|
465
|
+
* See {@link LexicalNode.exportJSON}
|
|
466
|
+
*
|
|
467
|
+
* @returns A JSON-serializable javascript object
|
|
468
|
+
*/
|
|
254
469
|
toJSON(): SerializedEditor;
|
|
255
470
|
}
|
|
256
471
|
export {};
|
package/LexicalEditorState.d.ts
CHANGED
|
@@ -6,11 +6,11 @@
|
|
|
6
6
|
*
|
|
7
7
|
*/
|
|
8
8
|
import type { LexicalEditor } from './LexicalEditor';
|
|
9
|
-
import type { NodeMap } from './LexicalNode';
|
|
9
|
+
import type { NodeMap, SerializedLexicalNode } from './LexicalNode';
|
|
10
10
|
import type { GridSelection, NodeSelection, RangeSelection } from './LexicalSelection';
|
|
11
11
|
import type { SerializedRootNode } from './nodes/LexicalRootNode';
|
|
12
|
-
export interface SerializedEditorState {
|
|
13
|
-
root: SerializedRootNode
|
|
12
|
+
export interface SerializedEditorState<T extends SerializedLexicalNode = SerializedLexicalNode> {
|
|
13
|
+
root: SerializedRootNode<T>;
|
|
14
14
|
}
|
|
15
15
|
export declare function editorStateHasDirtySelection(editorState: EditorState, editor: LexicalEditor): boolean;
|
|
16
16
|
export declare function cloneEditorState(current: EditorState): EditorState;
|
package/LexicalNode.d.ts
CHANGED
|
@@ -45,47 +45,288 @@ export declare class LexicalNode {
|
|
|
45
45
|
__prev: null | NodeKey;
|
|
46
46
|
/** @internal */
|
|
47
47
|
__next: null | NodeKey;
|
|
48
|
+
/**
|
|
49
|
+
* Returns the string type of this node. Every node must
|
|
50
|
+
* implement this and it MUST BE UNIQUE amongst nodes registered
|
|
51
|
+
* on the editor.
|
|
52
|
+
*
|
|
53
|
+
*/
|
|
48
54
|
static getType(): string;
|
|
55
|
+
/**
|
|
56
|
+
* Clones this node, creating a new node with a different key
|
|
57
|
+
* and adding it to the EditorState (but not attaching it anywhere!). All nodes must
|
|
58
|
+
* implement this method.
|
|
59
|
+
*
|
|
60
|
+
*/
|
|
49
61
|
static clone(_data: unknown): LexicalNode;
|
|
50
62
|
constructor(key?: NodeKey);
|
|
63
|
+
/**
|
|
64
|
+
* Returns the string type of this node.
|
|
65
|
+
*/
|
|
51
66
|
getType(): string;
|
|
67
|
+
/**
|
|
68
|
+
* Returns true if there is a path between this node and the RootNode, false otherwise.
|
|
69
|
+
* This is a way of determining if the node is "attached" EditorState. Unattached nodes
|
|
70
|
+
* won't be reconciled and will ultimatelt be cleaned up by the Lexical GC.
|
|
71
|
+
*/
|
|
52
72
|
isAttached(): boolean;
|
|
73
|
+
/**
|
|
74
|
+
* Returns true if this node is contained within the provided Selection., false otherwise.
|
|
75
|
+
* Relies on the algorithms implemented in {@link BaseSelection.getNodes} to determine
|
|
76
|
+
* what's included.
|
|
77
|
+
*
|
|
78
|
+
* @param selection - The selection that we want to determine if the node is in.
|
|
79
|
+
*/
|
|
53
80
|
isSelected(selection?: null | RangeSelection | NodeSelection | GridSelection): boolean;
|
|
81
|
+
/**
|
|
82
|
+
* Returns this nodes key.
|
|
83
|
+
*/
|
|
54
84
|
getKey(): NodeKey;
|
|
85
|
+
/**
|
|
86
|
+
* Returns the zero-based index of this node within the parent.
|
|
87
|
+
*/
|
|
55
88
|
getIndexWithinParent(): number;
|
|
89
|
+
/**
|
|
90
|
+
* Returns the parent of this node, or null if none is found.
|
|
91
|
+
*/
|
|
56
92
|
getParent<T extends ElementNode>(): T | null;
|
|
93
|
+
/**
|
|
94
|
+
* Returns the parent of this node, or throws if none is found.
|
|
95
|
+
*/
|
|
57
96
|
getParentOrThrow<T extends ElementNode>(): T;
|
|
97
|
+
/**
|
|
98
|
+
* Returns the highest (in the EditorState tree)
|
|
99
|
+
* non-root ancestor of this node, or null if none is found. See {@link lexical!$isRootOrShadowRoot}
|
|
100
|
+
* for more information on which Elements comprise "roots".
|
|
101
|
+
*/
|
|
58
102
|
getTopLevelElement(): ElementNode | this | null;
|
|
103
|
+
/**
|
|
104
|
+
* Returns the highest (in the EditorState tree)
|
|
105
|
+
* non-root ancestor of this node, or throws if none is found. See {@link lexical!$isRootOrShadowRoot}
|
|
106
|
+
* for more information on which Elements comprise "roots".
|
|
107
|
+
*/
|
|
59
108
|
getTopLevelElementOrThrow(): ElementNode | this;
|
|
109
|
+
/**
|
|
110
|
+
* Returns a list of the every ancestor of this node,
|
|
111
|
+
* all the way up to the RootNode.
|
|
112
|
+
*
|
|
113
|
+
*/
|
|
60
114
|
getParents(): Array<ElementNode>;
|
|
115
|
+
/**
|
|
116
|
+
* Returns a list of the keys of every ancestor of this node,
|
|
117
|
+
* all the way up to the RootNode.
|
|
118
|
+
*
|
|
119
|
+
*/
|
|
61
120
|
getParentKeys(): Array<NodeKey>;
|
|
121
|
+
/**
|
|
122
|
+
* Returns the "previous" siblings - that is, the node that comes
|
|
123
|
+
* before this one in the same parent.
|
|
124
|
+
*
|
|
125
|
+
*/
|
|
62
126
|
getPreviousSibling<T extends LexicalNode>(): T | null;
|
|
127
|
+
/**
|
|
128
|
+
* Returns the "previous" siblings - that is, the nodes that come between
|
|
129
|
+
* this one and the first child of it's parent, inclusive.
|
|
130
|
+
*
|
|
131
|
+
*/
|
|
63
132
|
getPreviousSiblings<T extends LexicalNode>(): Array<T>;
|
|
133
|
+
/**
|
|
134
|
+
* Returns the "next" siblings - that is, the node that comes
|
|
135
|
+
* after this one in the same parent
|
|
136
|
+
*
|
|
137
|
+
*/
|
|
64
138
|
getNextSibling<T extends LexicalNode>(): T | null;
|
|
139
|
+
/**
|
|
140
|
+
* Returns all "next" siblings - that is, the nodes that come between this
|
|
141
|
+
* one and the last child of it's parent, inclusive.
|
|
142
|
+
*
|
|
143
|
+
*/
|
|
65
144
|
getNextSiblings<T extends LexicalNode>(): Array<T>;
|
|
145
|
+
/**
|
|
146
|
+
* Returns the closest common ancestor of this node and the provided one or null
|
|
147
|
+
* if one cannot be found.
|
|
148
|
+
*
|
|
149
|
+
* @param node - the other node to find the common ancestor of.
|
|
150
|
+
*/
|
|
66
151
|
getCommonAncestor<T extends ElementNode = ElementNode>(node: LexicalNode): T | null;
|
|
152
|
+
/**
|
|
153
|
+
* Returns true if the provided node is the exact same one as this node, from Lexical's perspective.
|
|
154
|
+
* Always use this instead of referential equality.
|
|
155
|
+
*
|
|
156
|
+
* @param object - the node to perform the equality comparison on.
|
|
157
|
+
*/
|
|
67
158
|
is(object: LexicalNode | null | undefined): boolean;
|
|
159
|
+
/**
|
|
160
|
+
* Returns true if this node logical precedes the target node in the editor state.
|
|
161
|
+
*
|
|
162
|
+
* @param targetNode - the node we're testing to see if it's after this one.
|
|
163
|
+
*/
|
|
68
164
|
isBefore(targetNode: LexicalNode): boolean;
|
|
165
|
+
/**
|
|
166
|
+
* Returns true if this node is the parent of the target node, false otherwise.
|
|
167
|
+
*
|
|
168
|
+
* @param targetNode - the would-be child node.
|
|
169
|
+
*/
|
|
69
170
|
isParentOf(targetNode: LexicalNode): boolean;
|
|
171
|
+
/**
|
|
172
|
+
* Returns a list of nodes that are between this node and
|
|
173
|
+
* the target node in the EditorState.
|
|
174
|
+
*
|
|
175
|
+
* @param targetNode - the node that marks the other end of the range of nodes to be returned.
|
|
176
|
+
*/
|
|
70
177
|
getNodesBetween(targetNode: LexicalNode): Array<LexicalNode>;
|
|
178
|
+
/**
|
|
179
|
+
* Returns true if this node has been marked dirty during this update cycle.
|
|
180
|
+
*
|
|
181
|
+
*/
|
|
71
182
|
isDirty(): boolean;
|
|
183
|
+
/**
|
|
184
|
+
* Returns the latest version of the node from the active EditorState.
|
|
185
|
+
* This is used to avoid getting values from stale node references.
|
|
186
|
+
*
|
|
187
|
+
*/
|
|
72
188
|
getLatest(): this;
|
|
189
|
+
/**
|
|
190
|
+
* Returns a mutable version of the node. Will throw an error if
|
|
191
|
+
* called outside of a Lexical Editor {@link LexicalEditor.update} callback.
|
|
192
|
+
*
|
|
193
|
+
*/
|
|
73
194
|
getWritable(): this;
|
|
195
|
+
/**
|
|
196
|
+
* Returns the text content of the node. Override this for
|
|
197
|
+
* custom nodes that should have a representation in plain text
|
|
198
|
+
* format (for copy + paste, for example)
|
|
199
|
+
*
|
|
200
|
+
*/
|
|
74
201
|
getTextContent(): string;
|
|
202
|
+
/**
|
|
203
|
+
* Returns the length of the string produced by calling getTextContent on this node.
|
|
204
|
+
*
|
|
205
|
+
*/
|
|
75
206
|
getTextContentSize(): number;
|
|
207
|
+
/**
|
|
208
|
+
* Called during the reconciliation process to determine which nodes
|
|
209
|
+
* to insert into the DOM for this Lexical Node.
|
|
210
|
+
*
|
|
211
|
+
* This method must return exactly one HTMLElement. Nested elements are not supported.
|
|
212
|
+
*
|
|
213
|
+
* Do not attempt to update the Lexical EditorState during this phase of the update lifecyle.
|
|
214
|
+
*
|
|
215
|
+
* @param _config - allows access to things like the EditorTheme (to apply classes) during reconciliation.
|
|
216
|
+
* @param _editor - allows access to the editor for context during reconciliation.
|
|
217
|
+
*
|
|
218
|
+
* */
|
|
76
219
|
createDOM(_config: EditorConfig, _editor: LexicalEditor): HTMLElement;
|
|
220
|
+
/**
|
|
221
|
+
* Called when a node changes and should update the DOM
|
|
222
|
+
* in whatever way is necessary to make it align with any changes that might
|
|
223
|
+
* have happened during the update.
|
|
224
|
+
*
|
|
225
|
+
* Returning "true" here will cause lexical to unmount and recreate the DOM node
|
|
226
|
+
* (by calling createDOM). You would need to do this if the element tag changes,
|
|
227
|
+
* for instance.
|
|
228
|
+
*
|
|
229
|
+
* */
|
|
77
230
|
updateDOM(_prevNode: unknown, _dom: HTMLElement, _config: EditorConfig): boolean;
|
|
231
|
+
/**
|
|
232
|
+
* Controls how the this node is serialized to HTML. This is important for
|
|
233
|
+
* copy and paste between Lexical and non-Lexical editors, or Lexical editors with different namespaces,
|
|
234
|
+
* in which case the primary transfer format is HTML. It's also important if you're serializing
|
|
235
|
+
* to HTML for any other reason via {@link @lexical/html!$generateHtmlFromNodes}. You could
|
|
236
|
+
* also use this method to build your own HTML renderer.
|
|
237
|
+
*
|
|
238
|
+
* */
|
|
78
239
|
exportDOM(editor: LexicalEditor): DOMExportOutput;
|
|
240
|
+
/**
|
|
241
|
+
* Controls how the this node is serialized to JSON. This is important for
|
|
242
|
+
* copy and paste between Lexical editors sharing the same namespace. It's also important
|
|
243
|
+
* if you're serializing to JSON for persistent storage somewhere.
|
|
244
|
+
* See [Serialization & Deserialization](https://lexical.dev/docs/concepts/serialization#lexical---html).
|
|
245
|
+
*
|
|
246
|
+
* */
|
|
79
247
|
exportJSON(): SerializedLexicalNode;
|
|
248
|
+
/**
|
|
249
|
+
* Controls how the this node is deserialized from JSON. This is usually boilerplate,
|
|
250
|
+
* but provides an abstraction betweent he node implementation and serialized interfaec that can
|
|
251
|
+
* be important if you ever make breaking changes to a node schema (by adding or removing properties).
|
|
252
|
+
* See [Serialization & Deserialization](https://lexical.dev/docs/concepts/serialization#lexical---html).
|
|
253
|
+
*
|
|
254
|
+
* */
|
|
80
255
|
static importJSON(_serializedNode: SerializedLexicalNode): LexicalNode;
|
|
256
|
+
/**
|
|
257
|
+
* @experimental
|
|
258
|
+
*
|
|
259
|
+
* Registers the returned function as a transform on the node during
|
|
260
|
+
* Editor initialization. Most such use cases should be addressed via
|
|
261
|
+
* the {@link LexicalEditor.registerNodeTransform} API.
|
|
262
|
+
*
|
|
263
|
+
* Experimental - use at your own risk.
|
|
264
|
+
*/
|
|
265
|
+
static transform(): ((node: LexicalNode) => void) | null;
|
|
266
|
+
/**
|
|
267
|
+
* Removes this LexicalNode from the EditorState. If the node isn't re-inserted
|
|
268
|
+
* somewhere, the Lexical garbage collector will eventually clean it up.
|
|
269
|
+
*
|
|
270
|
+
* @param preserveEmptyParent - If falsy, the node's parent will be removed if
|
|
271
|
+
* it's empty after the removal operation. This is the default behavior, subject to
|
|
272
|
+
* other node heuristics such as {@link ElementNode#canBeEmpty}
|
|
273
|
+
* */
|
|
81
274
|
remove(preserveEmptyParent?: boolean): void;
|
|
275
|
+
/**
|
|
276
|
+
* Replaces this LexicalNode with the provided node, optionally transferring the children
|
|
277
|
+
* of the replaced node to the replacing node.
|
|
278
|
+
*
|
|
279
|
+
* @param replaceWith - The node to replace this one with.
|
|
280
|
+
* @param includeChildren - Whether or not to transfer the children of this node to the replacing node.
|
|
281
|
+
* */
|
|
82
282
|
replace<N extends LexicalNode>(replaceWith: N, includeChildren?: boolean): N;
|
|
283
|
+
/**
|
|
284
|
+
* Inserts a node after this LexicalNode (as the next sibling).
|
|
285
|
+
*
|
|
286
|
+
* @param nodeToInsert - The node to insert after this one.
|
|
287
|
+
* @param restoreSelection - Whether or not to attempt to resolve the
|
|
288
|
+
* selection to the appropriate place after the operation is complete.
|
|
289
|
+
* */
|
|
83
290
|
insertAfter(nodeToInsert: LexicalNode, restoreSelection?: boolean): LexicalNode;
|
|
291
|
+
/**
|
|
292
|
+
* Inserts a node before this LexicalNode (as the previous sibling).
|
|
293
|
+
*
|
|
294
|
+
* @param nodeToInsert - The node to insert after this one.
|
|
295
|
+
* @param restoreSelection - Whether or not to attempt to resolve the
|
|
296
|
+
* selection to the appropriate place after the operation is complete.
|
|
297
|
+
* */
|
|
84
298
|
insertBefore(nodeToInsert: LexicalNode, restoreSelection?: boolean): LexicalNode;
|
|
299
|
+
/**
|
|
300
|
+
* Whether or not this node has a required parent. Used during copy + paste operations
|
|
301
|
+
* to normalize nodes that would otherwise be orphaned. For example, ListItemNodes without
|
|
302
|
+
* a ListNode parent or TextNodes with a ParagraphNode parent.
|
|
303
|
+
*
|
|
304
|
+
* */
|
|
85
305
|
isParentRequired(): boolean;
|
|
306
|
+
/**
|
|
307
|
+
* The creation logic for any required parent. Should be implemented if {@link isParentRequired} returns true.
|
|
308
|
+
*
|
|
309
|
+
* */
|
|
86
310
|
createParentElementNode(): ElementNode;
|
|
311
|
+
/**
|
|
312
|
+
* Moves selection to the previous sibling of this node, at the specified offsets.
|
|
313
|
+
*
|
|
314
|
+
* @param anchorOffset - The anchor offset for selection.
|
|
315
|
+
* @param focusOffset - The focus offset for selection
|
|
316
|
+
* */
|
|
87
317
|
selectPrevious(anchorOffset?: number, focusOffset?: number): RangeSelection;
|
|
318
|
+
/**
|
|
319
|
+
* Moves selection to the next sibling of this node, at the specified offsets.
|
|
320
|
+
*
|
|
321
|
+
* @param anchorOffset - The anchor offset for selection.
|
|
322
|
+
* @param focusOffset - The focus offset for selection
|
|
323
|
+
* */
|
|
88
324
|
selectNext(anchorOffset?: number, focusOffset?: number): RangeSelection;
|
|
325
|
+
/**
|
|
326
|
+
* Marks a node dirty, triggering transforms and
|
|
327
|
+
* forcing it to be reconciled during the update cycle.
|
|
328
|
+
*
|
|
329
|
+
* */
|
|
89
330
|
markDirty(): void;
|
|
90
331
|
}
|
|
91
332
|
export {};
|
package/LexicalUtils.d.ts
CHANGED
|
@@ -110,3 +110,5 @@ export declare function removeDOMBlockCursorElement(blockCursorElement: HTMLElem
|
|
|
110
110
|
export declare function updateDOMBlockCursorElement(editor: LexicalEditor, rootElement: HTMLElement, nextSelection: null | RangeSelection | NodeSelection | GridSelection): void;
|
|
111
111
|
export declare function getDOMSelection(targetWindow: null | Window): null | Selection;
|
|
112
112
|
export declare function $splitNode(node: ElementNode, offset: number): [ElementNode | null, ElementNode];
|
|
113
|
+
export declare function $findMatchingParent(startingNode: LexicalNode, findFn: (node: LexicalNode) => boolean): LexicalNode | null;
|
|
114
|
+
export declare function $getChildrenRecursively(node: LexicalNode): Array<LexicalNode>;
|
package/index.d.ts
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
*
|
|
8
8
|
*/
|
|
9
9
|
export type { PasteCommandType } from './LexicalCommands';
|
|
10
|
-
export type { CommandListenerPriority, CommandPayloadType, CreateEditorArgs, EditableListener, EditorConfig, EditorThemeClasses, Klass, LexicalCommand, LexicalEditor, MutationListener, NodeMutation, SerializedEditor, Spread, } from './LexicalEditor';
|
|
10
|
+
export type { CommandListener, CommandListenerPriority, CommandPayloadType, CreateEditorArgs, EditableListener, EditorConfig, EditorThemeClasses, Klass, LexicalCommand, LexicalEditor, MutationListener, NodeMutation, SerializedEditor, Spread, } from './LexicalEditor';
|
|
11
11
|
export type { EditorState, SerializedEditorState } from './LexicalEditorState';
|
|
12
12
|
export type { DOMChildConversion, DOMConversion, DOMConversionFn, DOMConversionMap, DOMConversionOutput, DOMExportOutput, LexicalNode, NodeKey, NodeMap, SerializedLexicalNode, } from './LexicalNode';
|
|
13
13
|
export type { BaseSelection, ElementPointType as ElementPoint, GridSelection, GridSelectionShape, NodeSelection, Point, RangeSelection, TextPointType as TextPoint, } from './LexicalSelection';
|
|
@@ -10,8 +10,8 @@ import type { GridSelection, NodeSelection, RangeSelection } from '../LexicalSel
|
|
|
10
10
|
import type { Spread } from 'lexical';
|
|
11
11
|
import { TextNode } from '../';
|
|
12
12
|
import { LexicalNode } from '../LexicalNode';
|
|
13
|
-
export declare type SerializedElementNode = Spread<{
|
|
14
|
-
children: Array<
|
|
13
|
+
export declare type SerializedElementNode<T extends SerializedLexicalNode = SerializedLexicalNode> = Spread<{
|
|
14
|
+
children: Array<T>;
|
|
15
15
|
direction: 'ltr' | 'rtl' | null;
|
|
16
16
|
format: ElementFormatType;
|
|
17
17
|
indent: number;
|
|
@@ -51,6 +51,7 @@ export declare class ElementNode extends LexicalNode {
|
|
|
51
51
|
getLastChildOrThrow<T extends LexicalNode>(): T;
|
|
52
52
|
getChildAtIndex<T extends LexicalNode>(index: number): null | T;
|
|
53
53
|
getTextContent(): string;
|
|
54
|
+
getTextContentSize(): number;
|
|
54
55
|
getDirection(): 'ltr' | 'rtl' | null;
|
|
55
56
|
hasFormat(type: ElementFormatType): boolean;
|
|
56
57
|
select(_anchorOffset?: number, _focusOffset?: number): RangeSelection;
|
|
@@ -14,7 +14,10 @@ export declare type SerializedGridCellNode = Spread<{
|
|
|
14
14
|
export declare class DEPRECATED_GridCellNode extends ElementNode {
|
|
15
15
|
/** @internal */
|
|
16
16
|
__colSpan: number;
|
|
17
|
+
__rowSpan: number;
|
|
17
18
|
constructor(colSpan: number, key?: NodeKey);
|
|
18
19
|
exportJSON(): SerializedGridCellNode;
|
|
20
|
+
setColSpan(colSpan: number): this;
|
|
21
|
+
setRowSpan(rowSpan: number): this;
|
|
19
22
|
}
|
|
20
23
|
export declare function DEPRECATED_$isGridCellNode(node: DEPRECATED_GridCellNode | LexicalNode | null | undefined): node is DEPRECATED_GridCellNode;
|
|
@@ -5,10 +5,10 @@
|
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*
|
|
7
7
|
*/
|
|
8
|
-
import type { LexicalNode } from '../LexicalNode';
|
|
8
|
+
import type { LexicalNode, SerializedLexicalNode } from '../LexicalNode';
|
|
9
9
|
import type { SerializedElementNode } from './LexicalElementNode';
|
|
10
10
|
import { ElementNode } from './LexicalElementNode';
|
|
11
|
-
export declare type SerializedRootNode = SerializedElementNode
|
|
11
|
+
export declare type SerializedRootNode<T extends SerializedLexicalNode = SerializedLexicalNode> = SerializedElementNode<T>;
|
|
12
12
|
/** @noInheritDoc */
|
|
13
13
|
export declare class RootNode extends ElementNode {
|
|
14
14
|
/** @internal */
|