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:
@@ -3,6 +3,7 @@ import {
|
||||
NodeViewProps,
|
||||
NodeViewRenderer,
|
||||
NodeViewRendererProps,
|
||||
NodeViewRendererOptions,
|
||||
} from '@tiptap/core'
|
||||
import {
|
||||
ref,
|
||||
@@ -52,13 +53,17 @@ export const nodeViewProps = {
|
||||
},
|
||||
}
|
||||
|
||||
export interface VueNodeViewRendererOptions {
|
||||
stopEvent: ((event: Event) => boolean) | null,
|
||||
update: ((node: ProseMirrorNode, decorations: Decoration[]) => boolean) | null,
|
||||
ignoreMutation: ((mutation: MutationRecord | { type: 'selection', target: Element }) => boolean) | null,
|
||||
export interface VueNodeViewRendererOptions extends NodeViewRendererOptions {
|
||||
update: ((props: {
|
||||
oldNode: ProseMirrorNode,
|
||||
oldDecorations: Decoration[],
|
||||
newNode: ProseMirrorNode,
|
||||
newDecorations: Decoration[],
|
||||
updateProps: () => void,
|
||||
}) => boolean) | null,
|
||||
}
|
||||
|
||||
class VueNodeView extends NodeView<Component, Editor> {
|
||||
class VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions> {
|
||||
|
||||
renderer!: VueRenderer
|
||||
|
||||
@@ -116,8 +121,25 @@ class VueNodeView extends NodeView<Component, Editor> {
|
||||
}
|
||||
|
||||
update(node: ProseMirrorNode, decorations: Decoration[]) {
|
||||
const updateProps = (props?: Record<string, any>) => {
|
||||
this.decorationClasses.value = this.getDecorationClasses()
|
||||
this.renderer.updateProps(props)
|
||||
}
|
||||
|
||||
if (typeof this.options.update === 'function') {
|
||||
return this.options.update(node, decorations)
|
||||
const oldNode = this.node
|
||||
const oldDecorations = this.decorations
|
||||
|
||||
this.node = node
|
||||
this.decorations = decorations
|
||||
|
||||
return this.options.update({
|
||||
oldNode,
|
||||
oldDecorations,
|
||||
newNode: node,
|
||||
newDecorations: decorations,
|
||||
updateProps,
|
||||
})
|
||||
}
|
||||
|
||||
if (node.type !== this.node.type) {
|
||||
@@ -130,8 +152,8 @@ class VueNodeView extends NodeView<Component, Editor> {
|
||||
|
||||
this.node = node
|
||||
this.decorations = decorations
|
||||
this.decorationClasses.value = this.getDecorationClasses()
|
||||
this.renderer.updateProps({ node, decorations })
|
||||
|
||||
updateProps()
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user