Skip to content

prosekit/vue

ProseKitProps

editor

Type: Editor<any>

UseExtensionOptions

editor

The editor to add the extension to. If not provided, it will use the editor from the nearest ProseKit component.

Type: MaybeRefOrGetter<Editor<any>>

priority

Optional priority to add the extension with.

Type: Priority

VueNodeViewOptions

Options for defineVueNodeView.

as

The wrapping DOM element for the node view. Defaults to div for block nodes and span for inline nodes.

Type: string | HTMLElement | ((node: Node) => HTMLElement)

component

The Vue component to render the node.

Type: VueNodeViewComponent

contentAs

The wrapping DOM element for the node view's content. Defaults to div for block nodes and span for inline nodes.

Type: string | HTMLElement | ((node: Node) => HTMLElement)

deselectNode

Type: () => void

destroy

Type: () => void

ignoreMutation

Type: (mutation: MutationRecord) => boolean

name

The name of the node type.

Type: string

onUpdate

Type: () => void

selectNode

Type: () => void

setSelection

Type: (anchor: number, head: number, root: Document | ShadowRoot) => void

stopEvent

Type: (event: Event) => boolean

update

Type: (node: Node, decorations: readonly Decoration[], innerDecorations: DecorationSource) => boolean

VueNodeViewProps

contentRef

Type: VNodeRef

decorations

Type: ShallowRef<readonly Decoration[]>

getPos

Type: () => undefined | number

innerDecorations

Type: ShallowRef<DecorationSource>

node

Type: ShallowRef<Node>

selected

Type: ShallowRef<boolean>

setAttrs

Type: (attrs: Attrs) => void

view

Type: EditorView

VueNodeViewComponent

Type: DefineComponent<VueNodeViewProps, any, any>

ProseKit

The root component for a ProseKit editor.

Type: DefineSetupFnComponent<ProseKitProps, {}, {}, ProseKitProps & {}, PublicProps>

defineVueNodeView

ts
function defineVueNodeView(options: VueNodeViewOptions): Extension

Defines a node view using a Vue component.

useDocChange

ts
function useDocChange(handler: (doc: Node) => void, options?: UseExtensionOptions): void

Calls the given handler whenever the editor document changes.

useEditor

ts
function useEditor<E extends Extension<ExtensionTyping<any, any, any>>>(options?: { update?: boolean }): ShallowRef<Editor<E>>

Retrieves the editor instance from the nearest ProseKit component.

useExtension

ts
function useExtension(extension: MaybeRefOrGetter<null | Extension<ExtensionTyping<any, any, any>>>, options?: UseExtensionOptions): void

Add an extension to the editor.

useKeymap

ts
function useKeymap(keymap: MaybeRefOrGetter<Keymap>, options?: UseExtensionOptions): void

useStateUpdate

ts
function useStateUpdate(handler: (state: EditorState) => void, options?: UseExtensionOptions): void

Calls the given handler whenever the editor state changes.