prosemirror-view 1.23.13 → 1.24.0-beta.3

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.
@@ -0,0 +1,799 @@
1
+ import { EditorState, Transaction, Selection, Plugin } from 'prosemirror-state';
2
+ import { Mark, Node, ParseRule, Slice, ResolvedPos, DOMParser, DOMSerializer } from 'prosemirror-model';
3
+ import { Mapping } from 'prosemirror-transform';
4
+
5
+ declare type DOMNode = InstanceType<typeof window.Node>;
6
+
7
+ declare type WidgetConstructor = ((view: EditorView, getPos: () => number | undefined) => DOMNode) | DOMNode;
8
+ /**
9
+ Decoration objects can be provided to the view through the
10
+ [`decorations` prop](https://prosemirror.net/docs/ref/#view.EditorProps.decorations). They come in
11
+ several variants—see the static members of this class for details.
12
+ */
13
+ declare class Decoration {
14
+ /**
15
+ The start position of the decoration.
16
+ */
17
+ readonly from: number;
18
+ /**
19
+ The end position. Will be the same as `from` for [widget
20
+ decorations](https://prosemirror.net/docs/ref/#view.Decoration^widget).
21
+ */
22
+ readonly to: number;
23
+ /**
24
+ Creates a widget decoration, which is a DOM node that's shown in
25
+ the document at the given position. It is recommended that you
26
+ delay rendering the widget by passing a function that will be
27
+ called when the widget is actually drawn in a view, but you can
28
+ also directly pass a DOM node. `getPos` can be used to find the
29
+ widget's current document position.
30
+ */
31
+ static widget(pos: number, toDOM: WidgetConstructor, spec?: {
32
+ /**
33
+ Controls which side of the document position this widget is
34
+ associated with. When negative, it is drawn before a cursor
35
+ at its position, and content inserted at that position ends
36
+ up after the widget. When zero (the default) or positive, the
37
+ widget is drawn after the cursor and content inserted there
38
+ ends up before the widget.
39
+
40
+ When there are multiple widgets at a given position, their
41
+ `side` values determine the order in which they appear. Those
42
+ with lower values appear first. The ordering of widgets with
43
+ the same `side` value is unspecified.
44
+
45
+ When `marks` is null, `side` also determines the marks that
46
+ the widget is wrapped in—those of the node before when
47
+ negative, those of the node after when positive.
48
+ */
49
+ side?: number;
50
+ /**
51
+ The precise set of marks to draw around the widget.
52
+ */
53
+ marks?: readonly Mark[];
54
+ /**
55
+ Can be used to control which DOM events, when they bubble out
56
+ of this widget, the editor view should ignore.
57
+ */
58
+ stopEvent?: (event: Event) => boolean;
59
+ /**
60
+ When set (defaults to false), selection changes inside the
61
+ widget are ignored, and don't cause ProseMirror to try and
62
+ re-sync the selection with its selection state.
63
+ */
64
+ ignoreSelection?: boolean;
65
+ /**
66
+ When comparing decorations of this type (in order to decide
67
+ whether it needs to be redrawn), ProseMirror will by default
68
+ compare the widget DOM node by identity. If you pass a key,
69
+ that key will be compared instead, which can be useful when
70
+ you generate decorations on the fly and don't want to store
71
+ and reuse DOM nodes. Make sure that any widgets with the same
72
+ key are interchangeable—if widgets differ in, for example,
73
+ the behavior of some event handler, they should get
74
+ different keys.
75
+ */
76
+ key?: string;
77
+ /**
78
+ Called when the widget decoration is removed as a result of
79
+ mapping
80
+ */
81
+ destroy?: (node: DOMNode) => void;
82
+ }): Decoration;
83
+ /**
84
+ Creates an inline decoration, which adds the given attributes to
85
+ each inline node between `from` and `to`.
86
+ */
87
+ static inline(from: number, to: number, attrs: DecorationAttrs, spec?: {
88
+ /**
89
+ Determines how the left side of the decoration is
90
+ [mapped](https://prosemirror.net/docs/ref/#transform.Position_Mapping) when content is
91
+ inserted directly at that position. By default, the decoration
92
+ won't include the new content, but you can set this to `true`
93
+ to make it inclusive.
94
+ */
95
+ inclusiveStart?: boolean;
96
+ /**
97
+ Determines how the right side of the decoration is mapped.
98
+ See
99
+ [`inclusiveStart`](https://prosemirror.net/docs/ref/#view.Decoration^inline^spec.inclusiveStart).
100
+ */
101
+ inclusiveEnd?: boolean;
102
+ }): Decoration;
103
+ /**
104
+ Creates a node decoration. `from` and `to` should point precisely
105
+ before and after a node in the document. That node, and only that
106
+ node, will receive the given attributes.
107
+ */
108
+ static node(from: number, to: number, attrs: DecorationAttrs, spec?: any): Decoration;
109
+ /**
110
+ The spec provided when creating this decoration. Can be useful
111
+ if you've stored extra information in that object.
112
+ */
113
+ get spec(): any;
114
+ }
115
+ /**
116
+ A set of attributes to add to a decorated node. Most properties
117
+ simply directly correspond to DOM attributes of the same name,
118
+ which will be set to the property's value. These are exceptions:
119
+ */
120
+ declare type DecorationAttrs = {
121
+ /**
122
+ When non-null, the target node is wrapped in a DOM element of
123
+ this type (and the other attributes are applied to this element).
124
+ */
125
+ nodeName?: string;
126
+ /**
127
+ A CSS class name or a space-separated set of class names to be
128
+ _added_ to the classes that the node already had.
129
+ */
130
+ class?: string;
131
+ /**
132
+ A string of CSS to be _added_ to the node's existing `style` property.
133
+ */
134
+ style?: string;
135
+ /**
136
+ Any other properties are treated as regular DOM attributes.
137
+ */
138
+ [attribute: string]: string | undefined;
139
+ };
140
+ /**
141
+ An object that can [provide](https://prosemirror.net/docs/ref/#view.EditorProps.decorations)
142
+ decorations. Implemented by [`DecorationSet`](https://prosemirror.net/docs/ref/#view.DecorationSet),
143
+ and passed to [node views](https://prosemirror.net/docs/ref/#view.EditorProps.nodeViews).
144
+ */
145
+ interface DecorationSource {
146
+ /**
147
+ Map the set of decorations in response to a change in the
148
+ document.
149
+ */
150
+ map: (mapping: Mapping, node: Node) => DecorationSource;
151
+ }
152
+ /**
153
+ A collection of [decorations](https://prosemirror.net/docs/ref/#view.Decoration), organized in such
154
+ a way that the drawing algorithm can efficiently use and compare
155
+ them. This is a persistent data structure—it is not modified,
156
+ updates create a new value.
157
+ */
158
+ declare class DecorationSet implements DecorationSource {
159
+ /**
160
+ Create a set of decorations, using the structure of the given
161
+ document.
162
+ */
163
+ static create(doc: Node, decorations: Decoration[]): DecorationSet;
164
+ /**
165
+ Find all decorations in this set which touch the given range
166
+ (including decorations that start or end directly at the
167
+ boundaries) and match the given predicate on their spec. When
168
+ `start` and `end` are omitted, all decorations in the set are
169
+ considered. When `predicate` isn't given, all decorations are
170
+ assumed to match.
171
+ */
172
+ find(start?: number, end?: number, predicate?: (spec: any) => boolean): Decoration[];
173
+ private findInner;
174
+ /**
175
+ Map the set of decorations in response to a change in the
176
+ document.
177
+ */
178
+ map(mapping: Mapping, doc: Node, options?: {
179
+ /**
180
+ When given, this function will be called for each decoration
181
+ that gets dropped as a result of the mapping, passing the
182
+ spec of that decoration.
183
+ */
184
+ onRemove?: (decorationSpec: any) => void;
185
+ }): DecorationSet;
186
+ /**
187
+ Add the given array of decorations to the ones in the set,
188
+ producing a new set. Needs access to the current document to
189
+ create the appropriate tree structure.
190
+ */
191
+ add(doc: Node, decorations: Decoration[]): DecorationSet;
192
+ private addInner;
193
+ /**
194
+ Create a new set that contains the decorations in this set, minus
195
+ the ones in the given array.
196
+ */
197
+ remove(decorations: Decoration[]): DecorationSet;
198
+ private removeInner;
199
+ /**
200
+ The empty set of decorations.
201
+ */
202
+ static empty: DecorationSet;
203
+ }
204
+
205
+ declare global {
206
+ interface Node {
207
+ pmViewDesc?: ViewDesc;
208
+ }
209
+ }
210
+ /**
211
+ By default, document nodes are rendered using the result of the
212
+ [`toDOM`](https://prosemirror.net/docs/ref/#model.NodeSpec.toDOM) method of their spec, and managed
213
+ entirely by the editor. For some use cases, such as embedded
214
+ node-specific editing interfaces, you want more control over
215
+ the behavior of a node's in-editor representation, and need to
216
+ [define](https://prosemirror.net/docs/ref/#view.EditorProps.nodeViews) a custom node view.
217
+
218
+ Mark views only support `dom` and `contentDOM`, and don't support
219
+ any of the node view methods.
220
+
221
+ Objects returned as node views must conform to this interface.
222
+ */
223
+ interface NodeView {
224
+ /**
225
+ The outer DOM node that represents the document node.
226
+ */
227
+ dom: DOMNode;
228
+ /**
229
+ The DOM node that should hold the node's content. Only meaningful
230
+ if the node view also defines a `dom` property and if its node
231
+ type is not a leaf node type. When this is present, ProseMirror
232
+ will take care of rendering the node's children into it. When it
233
+ is not present, the node view itself is responsible for rendering
234
+ (or deciding not to render) its child nodes.
235
+ */
236
+ contentDOM?: HTMLElement | null;
237
+ /**
238
+ When given, this will be called when the view is updating itself.
239
+ It will be given a node (possibly of a different type), an array
240
+ of active decorations around the node (which are automatically
241
+ drawn, and the node view may ignore if it isn't interested in
242
+ them), and a [decoration source](https://prosemirror.net/docs/ref/#view.DecorationSource) that
243
+ represents any decorations that apply to the content of the node
244
+ (which again may be ignored). It should return true if it was
245
+ able to update to that node, and false otherwise. If the node
246
+ view has a `contentDOM` property (or no `dom` property), updating
247
+ its child nodes will be handled by ProseMirror.
248
+ */
249
+ update?: (node: Node, decorations: readonly Decoration[], innerDecorations: DecorationSource) => boolean;
250
+ /**
251
+ Can be used to override the way the node's selected status (as a
252
+ node selection) is displayed.
253
+ */
254
+ selectNode?: () => void;
255
+ /**
256
+ When defining a `selectNode` method, you should also provide a
257
+ `deselectNode` method to remove the effect again.
258
+ */
259
+ deselectNode?: () => void;
260
+ /**
261
+ This will be called to handle setting the selection inside the
262
+ node. The `anchor` and `head` positions are relative to the start
263
+ of the node. By default, a DOM selection will be created between
264
+ the DOM positions corresponding to those positions, but if you
265
+ override it you can do something else.
266
+ */
267
+ setSelection?: (anchor: number, head: number, root: Document | ShadowRoot) => void;
268
+ /**
269
+ Can be used to prevent the editor view from trying to handle some
270
+ or all DOM events that bubble up from the node view. Events for
271
+ which this returns true are not handled by the editor.
272
+ */
273
+ stopEvent?: (event: Event) => boolean;
274
+ /**
275
+ Called when a DOM
276
+ [mutation](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver)
277
+ or a selection change happens within the view. When the change is
278
+ a selection change, the record will have a `type` property of
279
+ `"selection"` (which doesn't occur for native mutation records).
280
+ Return false if the editor should re-read the selection or
281
+ re-parse the range around the mutation, true if it can safely be
282
+ ignored.
283
+ */
284
+ ignoreMutation?: (mutation: MutationRecord) => boolean;
285
+ /**
286
+ Called when the node view is removed from the editor or the whole
287
+ editor is destroyed. (Not available for marks.)
288
+ */
289
+ destroy?: () => void;
290
+ }
291
+ declare class ViewDesc {
292
+ parent: ViewDesc | undefined;
293
+ children: ViewDesc[];
294
+ dom: DOMNode;
295
+ contentDOM: HTMLElement | null;
296
+ dirty: number;
297
+ node: Node | null;
298
+ constructor(parent: ViewDesc | undefined, children: ViewDesc[], dom: DOMNode, contentDOM: HTMLElement | null);
299
+ matchesWidget(widget: Decoration): boolean;
300
+ matchesMark(mark: Mark): boolean;
301
+ matchesNode(node: Node, outerDeco: readonly Decoration[], innerDeco: DecorationSource): boolean;
302
+ matchesHack(nodeName: string): boolean;
303
+ parseRule(): ParseRule | null;
304
+ stopEvent(event: Event): boolean;
305
+ get size(): number;
306
+ get border(): number;
307
+ destroy(): void;
308
+ posBeforeChild(child: ViewDesc): number;
309
+ get posBefore(): number;
310
+ get posAtStart(): number;
311
+ get posAfter(): number;
312
+ get posAtEnd(): number;
313
+ localPosFromDOM(dom: DOMNode, offset: number, bias: number): number;
314
+ nearestDesc(dom: DOMNode, onlyNodes?: boolean): ViewDesc | undefined;
315
+ getDesc(dom: DOMNode): ViewDesc | undefined;
316
+ posFromDOM(dom: DOMNode, offset: number, bias: number): number;
317
+ descAt(pos: number): ViewDesc | undefined;
318
+ domFromPos(pos: number, side: number): {
319
+ node: DOMNode;
320
+ offset: number;
321
+ };
322
+ parseRange(from: number, to: number, base?: number): {
323
+ node: DOMNode;
324
+ from: number;
325
+ to: number;
326
+ fromOffset: number;
327
+ toOffset: number;
328
+ };
329
+ emptyChildAt(side: number): boolean;
330
+ domAfterPos(pos: number): DOMNode;
331
+ setSelection(anchor: number, head: number, root: Document | ShadowRoot, force?: boolean): void;
332
+ ignoreMutation(mutation: MutationRecord): boolean;
333
+ get contentLost(): boolean | null;
334
+ markDirty(from: number, to: number): void;
335
+ markParentsDirty(): void;
336
+ get domAtom(): boolean;
337
+ get ignoreForCoords(): boolean;
338
+ }
339
+
340
+ /**
341
+ An editor view manages the DOM structure that represents an
342
+ editable document. Its state and behavior are determined by its
343
+ [props](https://prosemirror.net/docs/ref/#view.DirectEditorProps).
344
+ */
345
+ declare class EditorView {
346
+ private _props;
347
+ private directPlugins;
348
+ private _root;
349
+ private mounted;
350
+ private prevDirectPlugins;
351
+ private pluginViews;
352
+ /**
353
+ The view's current [state](https://prosemirror.net/docs/ref/#state.EditorState).
354
+ */
355
+ state: EditorState;
356
+ /**
357
+ Create a view. `place` may be a DOM node that the editor should
358
+ be appended to, a function that will place it into the document,
359
+ or an object whose `mount` property holds the node to use as the
360
+ document container. If it is `null`, the editor will not be
361
+ added to the document.
362
+ */
363
+ constructor(place: null | DOMNode | ((editor: HTMLElement) => void) | {
364
+ mount: HTMLElement;
365
+ }, props: DirectEditorProps);
366
+ /**
367
+ An editable DOM node containing the document. (You probably
368
+ should not directly interfere with its content.)
369
+ */
370
+ readonly dom: HTMLElement;
371
+ /**
372
+ Indicates whether the editor is currently [editable](https://prosemirror.net/docs/ref/#view.EditorProps.editable).
373
+ */
374
+ editable: boolean;
375
+ /**
376
+ When editor content is being dragged, this object contains
377
+ information about the dragged slice and whether it is being
378
+ copied or moved. At any other time, it is null.
379
+ */
380
+ dragging: null | {
381
+ slice: Slice;
382
+ move: boolean;
383
+ };
384
+ /**
385
+ Holds `true` when a
386
+ [composition](https://w3c.github.io/uievents/#events-compositionevents)
387
+ is active.
388
+ */
389
+ get composing(): boolean;
390
+ /**
391
+ The view's current [props](https://prosemirror.net/docs/ref/#view.EditorProps).
392
+ */
393
+ get props(): DirectEditorProps;
394
+ /**
395
+ Update the view's props. Will immediately cause an update to
396
+ the DOM.
397
+ */
398
+ update(props: DirectEditorProps): void;
399
+ /**
400
+ Update the view by updating existing props object with the object
401
+ given as argument. Equivalent to `view.update(Object.assign({},
402
+ view.props, props))`.
403
+ */
404
+ setProps(props: Partial<DirectEditorProps>): void;
405
+ /**
406
+ Update the editor's `state` prop, without touching any of the
407
+ other props.
408
+ */
409
+ updateState(state: EditorState): void;
410
+ private updateStateInner;
411
+ private destroyPluginViews;
412
+ private updatePluginViews;
413
+ /**
414
+ Goes over the values of a prop, first those provided directly,
415
+ then those from plugins given to the view, then from plugins in
416
+ the state (in order), and calls `f` every time a non-undefined
417
+ value is found. When `f` returns a truthy value, that is
418
+ immediately returned. When `f` isn't provided, it is treated as
419
+ the identity function (the prop value is returned directly).
420
+ */
421
+ someProp<PropName extends keyof EditorProps, Result>(propName: PropName, f: (value: NonNullable<EditorProps[PropName]>) => Result): Result | undefined;
422
+ someProp<PropName extends keyof EditorProps>(propName: PropName): NonNullable<EditorProps[PropName]> | undefined;
423
+ /**
424
+ Query whether the view has focus.
425
+ */
426
+ hasFocus(): boolean;
427
+ /**
428
+ Focus the editor.
429
+ */
430
+ focus(): void;
431
+ /**
432
+ Get the document root in which the editor exists. This will
433
+ usually be the top-level `document`, but might be a [shadow
434
+ DOM](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Shadow_DOM)
435
+ root if the editor is inside one.
436
+ */
437
+ get root(): Document | ShadowRoot;
438
+ /**
439
+ Given a pair of viewport coordinates, return the document
440
+ position that corresponds to them. May return null if the given
441
+ coordinates aren't inside of the editor. When an object is
442
+ returned, its `pos` property is the position nearest to the
443
+ coordinates, and its `inside` property holds the position of the
444
+ inner node that the position falls inside of, or -1 if it is at
445
+ the top level, not in any node.
446
+ */
447
+ posAtCoords(coords: {
448
+ left: number;
449
+ top: number;
450
+ }): {
451
+ pos: number;
452
+ inside: number;
453
+ } | null;
454
+ /**
455
+ Returns the viewport rectangle at a given document position.
456
+ `left` and `right` will be the same number, as this returns a
457
+ flat cursor-ish rectangle. If the position is between two things
458
+ that aren't directly adjacent, `side` determines which element
459
+ is used. When < 0, the element before the position is used,
460
+ otherwise the element after.
461
+ */
462
+ coordsAtPos(pos: number, side?: number): {
463
+ left: number;
464
+ right: number;
465
+ top: number;
466
+ bottom: number;
467
+ };
468
+ /**
469
+ Find the DOM position that corresponds to the given document
470
+ position. When `side` is negative, find the position as close as
471
+ possible to the content before the position. When positive,
472
+ prefer positions close to the content after the position. When
473
+ zero, prefer as shallow a position as possible.
474
+
475
+ Note that you should **not** mutate the editor's internal DOM,
476
+ only inspect it (and even that is usually not necessary).
477
+ */
478
+ domAtPos(pos: number, side?: number): {
479
+ node: DOMNode;
480
+ offset: number;
481
+ };
482
+ /**
483
+ Find the DOM node that represents the document node after the
484
+ given position. May return `null` when the position doesn't point
485
+ in front of a node or if the node is inside an opaque node view.
486
+
487
+ This is intended to be able to call things like
488
+ `getBoundingClientRect` on that DOM node. Do **not** mutate the
489
+ editor DOM directly, or add styling this way, since that will be
490
+ immediately overriden by the editor as it redraws the node.
491
+ */
492
+ nodeDOM(pos: number): DOMNode | null;
493
+ /**
494
+ Find the document position that corresponds to a given DOM
495
+ position. (Whenever possible, it is preferable to inspect the
496
+ document structure directly, rather than poking around in the
497
+ DOM, but sometimes—for example when interpreting an event
498
+ target—you don't have a choice.)
499
+
500
+ The `bias` parameter can be used to influence which side of a DOM
501
+ node to use when the position is inside a leaf node.
502
+ */
503
+ posAtDOM(node: DOMNode, offset: number, bias?: number): number;
504
+ /**
505
+ Find out whether the selection is at the end of a textblock when
506
+ moving in a given direction. When, for example, given `"left"`,
507
+ it will return true if moving left from the current cursor
508
+ position would leave that position's parent textblock. Will apply
509
+ to the view's current state by default, but it is possible to
510
+ pass a different state.
511
+ */
512
+ endOfTextblock(dir: "up" | "down" | "left" | "right" | "forward" | "backward", state?: EditorState): boolean;
513
+ /**
514
+ Removes the editor from the DOM and destroys all [node
515
+ views](https://prosemirror.net/docs/ref/#view.NodeView).
516
+ */
517
+ destroy(): void;
518
+ /**
519
+ This is true when the view has been
520
+ [destroyed](https://prosemirror.net/docs/ref/#view.EditorView.destroy) (and thus should not be
521
+ used anymore).
522
+ */
523
+ get isDestroyed(): boolean;
524
+ /**
525
+ Used for testing.
526
+ */
527
+ dispatchEvent(event: Event): void;
528
+ /**
529
+ Dispatch a transaction. Will call
530
+ [`dispatchTransaction`](https://prosemirror.net/docs/ref/#view.DirectEditorProps.dispatchTransaction)
531
+ when given, and otherwise defaults to applying the transaction to
532
+ the current state and calling
533
+ [`updateState`](https://prosemirror.net/docs/ref/#view.EditorView.updateState) with the result.
534
+ This method is bound to the view instance, so that it can be
535
+ easily passed around.
536
+ */
537
+ dispatch(tr: Transaction): void;
538
+ }
539
+ declare type NodeViewConstructor = (node: Node, view: EditorView, getPos: () => number | undefined, decorations: readonly Decoration[], innerDecorations: DecorationSource) => NodeView;
540
+ /**
541
+ Helper type that maps event names to event object types, but
542
+ includes events that TypeScript's HTMLElementEventMap doesn't know
543
+ about.
544
+ */
545
+ interface DOMEventMap extends HTMLElementEventMap {
546
+ [event: string]: Event;
547
+ }
548
+ /**
549
+ Props are configuration values that can be passed to an editor view
550
+ or included in a plugin. This interface lists the supported props.
551
+
552
+ The various event-handling functions may all return `true` to
553
+ indicate that they handled the given event. The view will then take
554
+ care to call `preventDefault` on the event, except with
555
+ `handleDOMEvents`, where the handler itself is responsible for that.
556
+
557
+ How a prop is resolved depends on the prop. Handler functions are
558
+ called one at a time, starting with the base props and then
559
+ searching through the plugins (in order of appearance) until one of
560
+ them returns true. For some props, the first plugin that yields a
561
+ value gets precedence.
562
+ */
563
+ interface EditorProps {
564
+ /**
565
+ Can be an object mapping DOM event type names to functions that
566
+ handle them. Such functions will be called before any handling
567
+ ProseMirror does of events fired on the editable DOM element.
568
+ Contrary to the other event handling props, when returning true
569
+ from such a function, you are responsible for calling
570
+ `preventDefault` yourself (or not, if you want to allow the
571
+ default behavior).
572
+ */
573
+ handleDOMEvents?: {
574
+ [event in string]: (view: EditorView, event: DOMEventMap[event]) => boolean | void;
575
+ };
576
+ /**
577
+ Called when the editor receives a `keydown` event.
578
+ */
579
+ handleKeyDown?: (view: EditorView, event: KeyboardEvent) => boolean | void;
580
+ /**
581
+ Handler for `keypress` events.
582
+ */
583
+ handleKeyPress?: (view: EditorView, event: KeyboardEvent) => boolean | void;
584
+ /**
585
+ Whenever the user directly input text, this handler is called
586
+ before the input is applied. If it returns `true`, the default
587
+ behavior of actually inserting the text is suppressed.
588
+ */
589
+ handleTextInput?: (view: EditorView, from: number, to: number, text: string) => boolean | void;
590
+ /**
591
+ Called for each node around a click, from the inside out. The
592
+ `direct` flag will be true for the inner node.
593
+ */
594
+ handleClickOn?: (view: EditorView, pos: number, node: Node, nodePos: number, event: MouseEvent, direct: boolean) => boolean | void;
595
+ /**
596
+ Called when the editor is clicked, after `handleClickOn` handlers
597
+ have been called.
598
+ */
599
+ handleClick?: (view: EditorView, pos: number, event: MouseEvent) => boolean | void;
600
+ /**
601
+ Called for each node around a double click.
602
+ */
603
+ handleDoubleClickOn?: (view: EditorView, pos: number, node: Node, nodePos: number, event: MouseEvent, direct: boolean) => boolean | void;
604
+ /**
605
+ Called when the editor is double-clicked, after `handleDoubleClickOn`.
606
+ */
607
+ handleDoubleClick?: (view: EditorView, pos: number, event: MouseEvent) => boolean | void;
608
+ /**
609
+ Called for each node around a triple click.
610
+ */
611
+ handleTripleClickOn?: (view: EditorView, pos: number, node: Node, nodePos: number, event: MouseEvent, direct: boolean) => boolean | void;
612
+ /**
613
+ Called when the editor is triple-clicked, after `handleTripleClickOn`.
614
+ */
615
+ handleTripleClick?: (view: EditorView, pos: number, event: MouseEvent) => boolean | void;
616
+ /**
617
+ Can be used to override the behavior of pasting. `slice` is the
618
+ pasted content parsed by the editor, but you can directly access
619
+ the event to get at the raw content.
620
+ */
621
+ handlePaste?: (view: EditorView, event: ClipboardEvent, slice: Slice) => boolean | void;
622
+ /**
623
+ Called when something is dropped on the editor. `moved` will be
624
+ true if this drop moves from the current selection (which should
625
+ thus be deleted).
626
+ */
627
+ handleDrop?: (view: EditorView, event: MouseEvent, slice: Slice, moved: boolean) => boolean | void;
628
+ /**
629
+ Called when the view, after updating its state, tries to scroll
630
+ the selection into view. A handler function may return false to
631
+ indicate that it did not handle the scrolling and further
632
+ handlers or the default behavior should be tried.
633
+ */
634
+ handleScrollToSelection?: (view: EditorView) => boolean;
635
+ /**
636
+ Can be used to override the way a selection is created when
637
+ reading a DOM selection between the given anchor and head.
638
+ */
639
+ createSelectionBetween?: (view: EditorView, anchor: ResolvedPos, head: ResolvedPos) => Selection | null;
640
+ /**
641
+ The [parser](https://prosemirror.net/docs/ref/#model.DOMParser) to use when reading editor changes
642
+ from the DOM. Defaults to calling
643
+ [`DOMParser.fromSchema`](https://prosemirror.net/docs/ref/#model.DOMParser^fromSchema) on the
644
+ editor's schema.
645
+ */
646
+ domParser?: DOMParser;
647
+ /**
648
+ Can be used to transform pasted HTML text, _before_ it is parsed,
649
+ for example to clean it up.
650
+ */
651
+ transformPastedHTML?: (html: string) => string;
652
+ /**
653
+ The [parser](https://prosemirror.net/docs/ref/#model.DOMParser) to use when reading content from
654
+ the clipboard. When not given, the value of the
655
+ [`domParser`](https://prosemirror.net/docs/ref/#view.EditorProps.domParser) prop is used.
656
+ */
657
+ clipboardParser?: DOMParser;
658
+ /**
659
+ Transform pasted plain text. The `plain` flag will be true when
660
+ the text is pasted as plain text.
661
+ */
662
+ transformPastedText?: (text: string, plain: boolean) => string;
663
+ /**
664
+ A function to parse text from the clipboard into a document
665
+ slice. Called after
666
+ [`transformPastedText`](https://prosemirror.net/docs/ref/#view.EditorProps.transformPastedText).
667
+ The default behavior is to split the text into lines, wrap them
668
+ in `<p>` tags, and call
669
+ [`clipboardParser`](https://prosemirror.net/docs/ref/#view.EditorProps.clipboardParser) on it.
670
+ The `plain` flag will be true when the text is pasted as plain text.
671
+ */
672
+ clipboardTextParser?: (text: string, $context: ResolvedPos, plain: boolean) => Slice;
673
+ /**
674
+ Can be used to transform pasted content before it is applied to
675
+ the document.
676
+ */
677
+ transformPasted?: (slice: Slice) => Slice;
678
+ /**
679
+ Allows you to pass custom rendering and behavior logic for nodes
680
+ and marks. Should map node and mark names to constructor
681
+ functions that produce a [`NodeView`](https://prosemirror.net/docs/ref/#view.NodeView) object
682
+ implementing the node's display behavior. For nodes, the third
683
+ argument `getPos` is a function that can be called to get the
684
+ node's current position, which can be useful when creating
685
+ transactions to update it. For marks, the third argument is a
686
+ boolean that indicates whether the mark's content is inline.
687
+
688
+ `decorations` is an array of node or inline decorations that are
689
+ active around the node. They are automatically drawn in the
690
+ normal way, and you will usually just want to ignore this, but
691
+ they can also be used as a way to provide context information to
692
+ the node view without adding it to the document itself.
693
+
694
+ `innerDecorations` holds the decorations for the node's content.
695
+ You can safely ignore this if your view has no content or a
696
+ `contentDOM` property, since the editor will draw the decorations
697
+ on the content. But if you, for example, want to create a nested
698
+ editor with the content, it may make sense to provide it with the
699
+ inner decorations.
700
+ */
701
+ nodeViews?: {
702
+ [node: string]: NodeViewConstructor;
703
+ };
704
+ /**
705
+ The DOM serializer to use when putting content onto the
706
+ clipboard. If not given, the result of
707
+ [`DOMSerializer.fromSchema`](https://prosemirror.net/docs/ref/#model.DOMSerializer^fromSchema)
708
+ will be used. This object will only have its
709
+ [`serializeFragment`](https://prosemirror.net/docs/ref/#model.DOMSerializer.serializeFragment)
710
+ method called, and you may provide an alternative object type
711
+ implementing a compatible method.
712
+ */
713
+ clipboardSerializer?: DOMSerializer;
714
+ /**
715
+ A function that will be called to get the text for the current
716
+ selection when copying text to the clipboard. By default, the
717
+ editor will use [`textBetween`](https://prosemirror.net/docs/ref/#model.Node.textBetween) on the
718
+ selected range.
719
+ */
720
+ clipboardTextSerializer?: (content: Slice) => string;
721
+ /**
722
+ A set of [document decorations](https://prosemirror.net/docs/ref/#view.Decoration) to show in the
723
+ view.
724
+ */
725
+ decorations?: (state: EditorState) => DecorationSource | null;
726
+ /**
727
+ When this returns false, the content of the view is not directly
728
+ editable.
729
+ */
730
+ editable?: (state: EditorState) => boolean;
731
+ /**
732
+ Control the DOM attributes of the editable element. May be either
733
+ an object or a function going from an editor state to an object.
734
+ By default, the element will get a class `"ProseMirror"`, and
735
+ will have its `contentEditable` attribute determined by the
736
+ [`editable` prop](https://prosemirror.net/docs/ref/#view.EditorProps.editable). Additional classes
737
+ provided here will be added to the class. For other attributes,
738
+ the value provided first (as in
739
+ [`someProp`](https://prosemirror.net/docs/ref/#view.EditorView.someProp)) will be used.
740
+ */
741
+ attributes?: {
742
+ [name: string]: string;
743
+ } | ((state: EditorState) => {
744
+ [name: string]: string;
745
+ });
746
+ /**
747
+ Determines the distance (in pixels) between the cursor and the
748
+ end of the visible viewport at which point, when scrolling the
749
+ cursor into view, scrolling takes place. Defaults to 0.
750
+ */
751
+ scrollThreshold?: number | {
752
+ top: number;
753
+ right: number;
754
+ bottom: number;
755
+ left: number;
756
+ };
757
+ /**
758
+ Determines the extra space (in pixels) that is left above or
759
+ below the cursor when it is scrolled into view. Defaults to 5.
760
+ */
761
+ scrollMargin?: number | {
762
+ top: number;
763
+ right: number;
764
+ bottom: number;
765
+ left: number;
766
+ };
767
+ }
768
+ /**
769
+ The props object given directly to the editor view supports some
770
+ fields that can't be used in plugins:
771
+ */
772
+ interface DirectEditorProps extends EditorProps {
773
+ /**
774
+ The current state of the editor.
775
+ */
776
+ state: EditorState;
777
+ /**
778
+ A set of plugins to use in the view, applying their [plugin
779
+ view](https://prosemirror.net/docs/ref/#state.PluginSpec.view) and
780
+ [props](https://prosemirror.net/docs/ref/#state.PluginSpec.props). Passing plugins with a state
781
+ component (a [state field](https://prosemirror.net/docs/ref/#state.PluginSpec.state) field or a
782
+ [transaction](https://prosemirror.net/docs/ref/#state.PluginSpec.filterTransaction) filter or
783
+ appender) will result in an error, since such plugins must be
784
+ present in the state to work.
785
+ */
786
+ plugins?: readonly Plugin[];
787
+ /**
788
+ The callback over which to send transactions (state updates)
789
+ produced by the view. If you specify this, you probably want to
790
+ make sure this ends up calling the view's
791
+ [`updateState`](https://prosemirror.net/docs/ref/#view.EditorView.updateState) method with a new
792
+ state that has the transaction
793
+ [applied](https://prosemirror.net/docs/ref/#state.EditorState.apply). The callback will be bound to have
794
+ the view instance as its `this` binding.
795
+ */
796
+ dispatchTransaction?: (tr: Transaction) => void;
797
+ }
798
+
799
+ export { DOMEventMap, Decoration, DecorationAttrs, DecorationSet, DecorationSource, DirectEditorProps, EditorProps, EditorView, NodeView };