prosekit/svelte

editor: Editor

---

Options for defineSvelteMarkView.

• CoreMarkViewUserOptions<SvelteMarkViewComponent>

as?: MarkViewDOMSpec

component: SvelteMarkViewComponent

contentAs?: MarkViewDOMSpec

destroy?: () => void

ignoreMutation?: (mutation: ViewMutationRecord) => boolean | void

name: string

The name of the mark type.

---

• MarkViewContext

contentRef: (element: null | HTMLElement) => void

mark: Writable<Mark>

view: EditorView

---

Options for defineSvelteNodeView.

• CoreNodeViewUserOptions<SvelteNodeViewComponent>

as?: NodeViewDOMSpec

component: SvelteNodeViewComponent

contentAs?: NodeViewDOMSpec

deselectNode?: () => void

destroy?: () => void

ignoreMutation?: (mutation: ViewMutationRecord) => boolean | void

name: string

The name of the node type.

onUpdate?: () => void

selectNode?: () => void

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

stopEvent?: (event: Event) => boolean

update?: (node: ProseMirrorNode, decorations: readonly Decoration[], innerDecorations: DecorationSource) => boolean | void

---

• NodeViewContext

contentRef: (element: null | HTMLElement) => void

decorations: Writable<readonly Decoration[]>

getPos: () => undefined | number

innerDecorations: Writable<DecorationSource>

node: Writable<ProseMirrorNode>

selected: Writable<boolean>

setAttrs: (attrs: Attrs) => void

view: EditorView

---

editor?: Editor<any>

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

priority?: Priority

Optional priority to add the extension with.

type SvelteMarkViewComponent = Component<SvelteMarkViewProps>

---

type SvelteNodeViewComponent = Component<SvelteNodeViewProps>

const ProseKit: typeof SvelteComponent

The root component for a ProseKit editor.

function defineSvelteMarkView(options: SvelteMarkViewOptions): Extension

Defines a mark view using a Svelte component.

---

function defineSvelteNodeView(options: SvelteNodeViewOptions): Extension

Defines a node view using a Svelte component.

---

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

Calls the given handler whenever the editor document changes.

---

function useEditor<E>(options?: object): Readable<Editor<E>>

Retrieves the editor instance from the nearest ProseKit component.

---

function useExtension<T>(extension: Readable<null | T>, options?: UseExtensionOptions): void

Add an extension to the editor.

---

function useKeymap(keymapStore: Readable<Keymap>, options?: UseExtensionOptions): void

---

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

Calls the given handler whenever the editor state changes.