feat!: provide more context to update function of node views, fix #1611

* add more powerful update option to node views

* add object params for all node view option props
This commit is contained in:
Philipp Kühn
2021-07-27 12:26:24 +02:00
committed by GitHub
parent 651e6911e3
commit d720edbe24
5 changed files with 111 additions and 38 deletions

View File

@@ -6,12 +6,18 @@ import { Node } from './Node'
import isiOS from './utilities/isiOS'
import { NodeViewRendererProps, NodeViewRendererOptions } from './types'
export class NodeView<Component, Editor extends CoreEditor = CoreEditor> implements ProseMirrorNodeView {
export class NodeView<
Component,
Editor extends CoreEditor = CoreEditor,
Options extends NodeViewRendererOptions = NodeViewRendererOptions,
> implements ProseMirrorNodeView {
component: Component
editor: Editor
options: Options
extension: Node
node: ProseMirrorNode
@@ -22,16 +28,14 @@ export class NodeView<Component, Editor extends CoreEditor = CoreEditor> impleme
isDragging = false
options: NodeViewRendererOptions = {
stopEvent: null,
update: null,
ignoreMutation: null,
}
constructor(component: Component, props: NodeViewRendererProps, options?: Partial<NodeViewRendererOptions>) {
constructor(component: Component, props: NodeViewRendererProps, options?: Partial<Options>) {
this.component = component
this.options = { ...this.options, ...options }
this.editor = props.editor as Editor
this.options = {
stopEvent: null,
ignoreMutation: null,
...options,
} as Options
this.extension = props.extension
this.node = props.node
this.decorations = props.decorations
@@ -98,7 +102,7 @@ export class NodeView<Component, Editor extends CoreEditor = CoreEditor> impleme
}
if (typeof this.options.stopEvent === 'function') {
return this.options.stopEvent(event)
return this.options.stopEvent({ event })
}
const target = (event.target as HTMLElement)
@@ -178,7 +182,7 @@ export class NodeView<Component, Editor extends CoreEditor = CoreEditor> impleme
}
if (typeof this.options.ignoreMutation === 'function') {
return this.options.ignoreMutation(mutation)
return this.options.ignoreMutation({ mutation })
}
// a leaf/atom node is like a black box for ProseMirror

View File

@@ -146,9 +146,12 @@ export type NodeViewProps = {
}
export interface NodeViewRendererOptions {
stopEvent: ((event: Event) => boolean) | null,
update: ((node: ProseMirrorNode, decorations: Decoration[]) => boolean) | null,
ignoreMutation: ((mutation: MutationRecord | { type: 'selection', target: Element }) => boolean) | null,
stopEvent: ((props: {
event: Event
}) => boolean) | null,
ignoreMutation: ((props: {
mutation: MutationRecord | { type: 'selection', target: Element }
}) => boolean) | null,
}
export type NodeViewRendererProps = {