@tiptap/vue-3 3.23.2 → 3.23.5
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.
- package/dist/index.cjs +37 -38
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +38 -39
- package/dist/index.js.map +1 -1
- package/package.json +7 -7
- package/src/VueNodeViewRenderer.ts +61 -58
package/dist/index.cjs
CHANGED
|
@@ -433,14 +433,24 @@ var nodeViewProps = {
|
|
|
433
433
|
}
|
|
434
434
|
};
|
|
435
435
|
var VueNodeView = class extends import_core3.NodeView {
|
|
436
|
-
constructor() {
|
|
437
|
-
super(
|
|
436
|
+
constructor(component, props, options) {
|
|
437
|
+
super(component, props, options);
|
|
438
|
+
this.cachedExtensionWithSyncedStorage = null;
|
|
438
439
|
/**
|
|
439
|
-
*
|
|
440
|
-
*
|
|
440
|
+
* Fires on editor updates when trackNodeViewPosition is enabled.
|
|
441
|
+
* Detects position shifts where update() is NOT called.
|
|
441
442
|
*/
|
|
442
|
-
this.
|
|
443
|
-
|
|
443
|
+
this.handlePositionUpdate = () => {
|
|
444
|
+
const newPos = this.getPos();
|
|
445
|
+
if (typeof newPos !== "number" || newPos === this.currentPos) {
|
|
446
|
+
return;
|
|
447
|
+
}
|
|
448
|
+
this.currentPos = newPos;
|
|
449
|
+
this.renderer.updateProps({ getPos: () => this.getPos() });
|
|
450
|
+
};
|
|
451
|
+
if (this.options.trackNodeViewPosition) {
|
|
452
|
+
this.editor.on("update", this.handlePositionUpdate);
|
|
453
|
+
}
|
|
444
454
|
}
|
|
445
455
|
/**
|
|
446
456
|
* Returns a proxy of the extension that redirects storage access to the editor's mutable storage.
|
|
@@ -477,6 +487,7 @@ var VueNodeView = class extends import_core3.NodeView {
|
|
|
477
487
|
updateAttributes: (attributes = {}) => this.updateAttributes(attributes),
|
|
478
488
|
deleteNode: () => this.deleteNode()
|
|
479
489
|
};
|
|
490
|
+
const mountProps = props;
|
|
480
491
|
const onDragStart = this.onDragStart.bind(this);
|
|
481
492
|
this.decorationClasses = (0, import_vue8.ref)(this.getDecorationClasses());
|
|
482
493
|
const extendedComponent = (0, import_vue8.defineComponent)({
|
|
@@ -510,21 +521,9 @@ var VueNodeView = class extends import_core3.NodeView {
|
|
|
510
521
|
this.handleSelectionUpdate = this.handleSelectionUpdate.bind(this);
|
|
511
522
|
this.editor.on("selectionUpdate", this.handleSelectionUpdate);
|
|
512
523
|
this.currentPos = this.getPos();
|
|
513
|
-
this.positionCheckCallback = () => {
|
|
514
|
-
if (!this.renderer) {
|
|
515
|
-
return;
|
|
516
|
-
}
|
|
517
|
-
const newPos = this.getPos();
|
|
518
|
-
if (typeof newPos !== "number" || newPos === this.currentPos) {
|
|
519
|
-
return;
|
|
520
|
-
}
|
|
521
|
-
this.currentPos = newPos;
|
|
522
|
-
this.renderer.updateProps({ getPos: () => this.getPos() });
|
|
523
|
-
};
|
|
524
|
-
(0, import_core3.schedulePositionCheck)(this.editor, this.positionCheckCallback);
|
|
525
524
|
this.renderer = new VueRenderer(extendedComponent, {
|
|
526
525
|
editor: this.editor,
|
|
527
|
-
props
|
|
526
|
+
props: mountProps
|
|
528
527
|
});
|
|
529
528
|
}
|
|
530
529
|
/**
|
|
@@ -590,7 +589,6 @@ var VueNodeView = class extends import_core3.NodeView {
|
|
|
590
589
|
this.node = node;
|
|
591
590
|
this.decorations = decorations;
|
|
592
591
|
this.innerDecorations = innerDecorations;
|
|
593
|
-
this.currentPos = this.getPos();
|
|
594
592
|
return this.options.update({
|
|
595
593
|
oldNode,
|
|
596
594
|
oldDecorations,
|
|
@@ -604,26 +602,28 @@ var VueNodeView = class extends import_core3.NodeView {
|
|
|
604
602
|
if (node.type !== this.node.type) {
|
|
605
603
|
return false;
|
|
606
604
|
}
|
|
607
|
-
const
|
|
608
|
-
if (
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
this.
|
|
613
|
-
rerenderComponent({
|
|
614
|
-
node,
|
|
615
|
-
decorations,
|
|
616
|
-
innerDecorations,
|
|
617
|
-
extension: this.extensionWithSyncedStorage,
|
|
618
|
-
getPos: () => this.getPos()
|
|
619
|
-
});
|
|
605
|
+
const nodeChanged = node !== this.node;
|
|
606
|
+
if (!nodeChanged) {
|
|
607
|
+
this.node = node;
|
|
608
|
+
this.decorations = decorations;
|
|
609
|
+
this.innerDecorations = innerDecorations;
|
|
610
|
+
this.decorationClasses.value = this.getDecorationClasses();
|
|
620
611
|
return true;
|
|
621
612
|
}
|
|
622
613
|
this.node = node;
|
|
623
614
|
this.decorations = decorations;
|
|
624
615
|
this.innerDecorations = innerDecorations;
|
|
625
|
-
this.currentPos =
|
|
626
|
-
|
|
616
|
+
this.currentPos = this.getPos();
|
|
617
|
+
const extraProps = {
|
|
618
|
+
node,
|
|
619
|
+
decorations,
|
|
620
|
+
innerDecorations,
|
|
621
|
+
extension: this.extensionWithSyncedStorage
|
|
622
|
+
};
|
|
623
|
+
if (this.options.trackNodeViewPosition) {
|
|
624
|
+
extraProps.getPos = () => this.getPos();
|
|
625
|
+
}
|
|
626
|
+
rerenderComponent(extraProps);
|
|
627
627
|
return true;
|
|
628
628
|
}
|
|
629
629
|
/**
|
|
@@ -656,9 +656,8 @@ var VueNodeView = class extends import_core3.NodeView {
|
|
|
656
656
|
destroy() {
|
|
657
657
|
this.renderer.destroy();
|
|
658
658
|
this.editor.off("selectionUpdate", this.handleSelectionUpdate);
|
|
659
|
-
if (this.
|
|
660
|
-
|
|
661
|
-
this.positionCheckCallback = null;
|
|
659
|
+
if (this.options.trackNodeViewPosition) {
|
|
660
|
+
this.editor.off("update", this.handlePositionUpdate);
|
|
662
661
|
}
|
|
663
662
|
}
|
|
664
663
|
};
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/Editor.ts","../src/EditorContent.ts","../src/NodeViewContent.ts","../src/NodeViewWrapper.ts","../src/useEditor.ts","../src/VueMarkViewRenderer.ts","../src/VueRenderer.ts","../src/VueNodeViewRenderer.ts"],"sourcesContent":["export { Editor } from './Editor.js'\nexport * from './EditorContent.js'\nexport * from './NodeViewContent.js'\nexport * from './NodeViewWrapper.js'\nexport * from './useEditor.js'\nexport * from './VueMarkViewRenderer.js'\nexport * from './VueNodeViewRenderer.js'\nexport * from './VueRenderer.js'\nexport * from '@tiptap/core'\n","/* eslint-disable react-hooks/rules-of-hooks */\nimport type { EditorOptions, Storage } from '@tiptap/core'\nimport { Editor as CoreEditor } from '@tiptap/core'\nimport type { EditorState, Plugin, PluginKey } from '@tiptap/pm/state'\nimport type { AppContext, ComponentInternalInstance, ComponentPublicInstance, Ref } from 'vue'\nimport { customRef, markRaw } from 'vue'\n\nfunction useDebouncedRef<T>(value: T) {\n return customRef<T>((track, trigger) => {\n return {\n get() {\n track()\n return value\n },\n set(newValue) {\n // update state\n value = newValue\n\n // update view as soon as possible\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n trigger()\n })\n })\n },\n }\n })\n}\n\nexport type ContentComponent = ComponentInternalInstance & {\n ctx: ComponentPublicInstance\n}\n\nexport class Editor extends CoreEditor {\n private reactiveState: Ref<EditorState>\n\n private reactiveExtensionStorage: Ref<Storage>\n\n public contentComponent: ContentComponent | null = null\n\n public appContext: AppContext | null = null\n\n constructor(options: Partial<EditorOptions> = {}) {\n super(options)\n\n this.reactiveState = useDebouncedRef(this.view.state)\n this.reactiveExtensionStorage = useDebouncedRef(this.extensionStorage)\n\n this.on('beforeTransaction', ({ nextState }) => {\n this.reactiveState.value = nextState\n this.reactiveExtensionStorage.value = this.extensionStorage\n })\n\n return markRaw(this) // eslint-disable-line\n }\n\n get state() {\n return this.reactiveState ? this.reactiveState.value : this.view.state\n }\n\n get storage() {\n return this.reactiveExtensionStorage ? this.reactiveExtensionStorage.value : super.storage\n }\n\n /**\n * Register a ProseMirror plugin.\n */\n public registerPlugin(\n plugin: Plugin,\n handlePlugins?: (newPlugin: Plugin, plugins: Plugin[]) => Plugin[],\n ): EditorState {\n const nextState = super.registerPlugin(plugin, handlePlugins)\n\n if (this.reactiveState) {\n this.reactiveState.value = nextState\n }\n\n return nextState\n }\n\n /**\n * Unregister a ProseMirror plugin.\n */\n public unregisterPlugin(nameOrPluginKey: string | PluginKey): EditorState | undefined {\n const nextState = super.unregisterPlugin(nameOrPluginKey)\n\n if (this.reactiveState && nextState) {\n this.reactiveState.value = nextState\n }\n\n return nextState\n }\n}\n","import type { PropType, Ref } from 'vue'\nimport { defineComponent, getCurrentInstance, h, nextTick, onBeforeUnmount, ref, unref, watchEffect } from 'vue'\n\nimport type { Editor } from './Editor.js'\n\nexport const EditorContent = defineComponent({\n name: 'EditorContent',\n\n props: {\n editor: {\n default: null,\n type: Object as PropType<Editor>,\n },\n },\n\n setup(props) {\n const rootEl: Ref<Element | undefined> = ref()\n const instance = getCurrentInstance()\n\n watchEffect(() => {\n const editor = props.editor\n\n if (editor && editor.options.element && rootEl.value) {\n nextTick(() => {\n if (!rootEl.value || !editor.view.dom?.parentNode) {\n return\n }\n\n // TODO using the new editor.mount method might allow us to remove this\n const element = unref(rootEl.value)\n\n rootEl.value.append(...editor.view.dom.parentNode.childNodes)\n\n // @ts-ignore\n editor.contentComponent = instance.ctx._\n\n if (instance) {\n editor.appContext = {\n ...instance.appContext,\n // Vue internally uses prototype chain to forward/shadow injects across the entire component chain\n // so don't use object spread operator or 'Object.assign' and just set `provides` as is on editor's appContext\n // @ts-expect-error forward instance's 'provides' into appContext\n provides: instance.provides,\n }\n }\n\n editor.setOptions({\n element,\n })\n\n editor.createNodeViews()\n })\n }\n })\n\n onBeforeUnmount(() => {\n const editor = props.editor\n\n if (!editor) {\n return\n }\n\n editor.contentComponent = null\n editor.appContext = null\n })\n\n return { rootEl }\n },\n\n render() {\n return h('div', {\n ref: (el: any) => {\n this.rootEl = el\n },\n })\n },\n})\n","import { defineComponent, h } from 'vue'\n\nexport const NodeViewContent = defineComponent({\n name: 'NodeViewContent',\n\n props: {\n as: {\n type: String,\n default: 'div',\n },\n },\n\n render() {\n return h(this.as, {\n style: {\n whiteSpace: 'pre-wrap',\n },\n 'data-node-view-content': '',\n })\n },\n})\n","import { defineComponent, h } from 'vue'\n\nexport const NodeViewWrapper = defineComponent({\n name: 'NodeViewWrapper',\n\n props: {\n as: {\n type: String,\n default: 'div',\n },\n },\n\n inject: ['onDragStart', 'decorationClasses'],\n\n render() {\n return h(\n this.as,\n {\n // @ts-ignore\n class: this.decorationClasses,\n style: {\n whiteSpace: 'normal',\n },\n 'data-node-view-wrapper': '',\n // @ts-ignore (https://github.com/vuejs/vue-next/issues/3031)\n onDragstart: this.onDragStart,\n },\n this.$slots.default?.(),\n )\n },\n})\n","import type { EditorOptions } from '@tiptap/core'\nimport { onBeforeUnmount, onMounted, shallowRef } from 'vue'\n\nimport { Editor } from './Editor.js'\n\nexport const useEditor = (options: Partial<EditorOptions> = {}) => {\n const editor = shallowRef<Editor>()\n\n onMounted(() => {\n editor.value = new Editor(options)\n })\n\n onBeforeUnmount(() => {\n editor.value?.destroy()\n })\n\n return editor\n}\n","/* eslint-disable no-underscore-dangle */\nimport type { MarkViewProps, MarkViewRenderer, MarkViewRendererOptions } from '@tiptap/core'\nimport { MarkView } from '@tiptap/core'\nimport type { Component, PropType } from 'vue'\nimport { defineComponent, h, toRaw } from 'vue'\n\nimport type { Editor } from './Editor.js'\nimport { VueRenderer } from './VueRenderer.js'\n\nexport interface VueMarkViewRendererOptions extends MarkViewRendererOptions {\n as?: string\n className?: string\n attrs?: { [key: string]: string }\n}\n\nexport const markViewProps = {\n editor: {\n type: Object as PropType<MarkViewProps['editor']>,\n required: true as const,\n },\n mark: {\n type: Object as PropType<MarkViewProps['mark']>,\n required: true as const,\n },\n extension: {\n type: Object as PropType<MarkViewProps['extension']>,\n required: true as const,\n },\n inline: {\n type: Boolean as PropType<MarkViewProps['inline']>,\n required: true as const,\n },\n view: {\n type: Object as PropType<MarkViewProps['view']>,\n required: true as const,\n },\n updateAttributes: {\n type: Function as PropType<MarkViewProps['updateAttributes']>,\n required: true as const,\n },\n HTMLAttributes: {\n type: Object as PropType<MarkViewProps['HTMLAttributes']>,\n required: true as const,\n },\n}\n\nexport const MarkViewContent = defineComponent({\n name: 'MarkViewContent',\n\n props: {\n as: {\n type: String,\n default: 'span',\n },\n },\n\n render() {\n return h(this.as, {\n style: {\n whiteSpace: 'inherit',\n },\n 'data-mark-view-content': '',\n })\n },\n})\n\nexport class VueMarkView extends MarkView<Component, VueMarkViewRendererOptions> {\n renderer: VueRenderer\n\n constructor(component: Component, props: MarkViewProps, options?: Partial<VueMarkViewRendererOptions>) {\n super(component, props, options)\n\n const componentProps = { ...props, updateAttributes: this.updateAttributes.bind(this) } satisfies MarkViewProps\n\n // Create extended component with provide\n const extendedComponent = defineComponent({\n extends: { ...component },\n props: Object.keys(componentProps),\n template: (this.component as any).template,\n setup: reactiveProps => {\n return (component as any).setup?.(reactiveProps, {\n expose: () => undefined,\n })\n },\n // Add support for scoped styles\n __scopeId: (component as any).__scopeId,\n __cssModules: (component as any).__cssModules,\n __name: (component as any).__name,\n __file: (component as any).__file,\n })\n this.renderer = new VueRenderer(extendedComponent, {\n editor: this.editor,\n props: componentProps,\n })\n }\n\n get dom() {\n return this.renderer.element as HTMLElement\n }\n\n get contentDOM() {\n return this.dom.querySelector('[data-mark-view-content]') as HTMLElement | null\n }\n\n updateAttributes(attrs: Record<string, any>): void {\n // since this.mark is now an proxy, we need to get the actual mark from it\n const unproxiedMark = toRaw(this.mark)\n super.updateAttributes(attrs, unproxiedMark)\n }\n\n destroy() {\n this.renderer.destroy()\n }\n}\n\nexport function VueMarkViewRenderer(\n component: Component,\n options: Partial<VueMarkViewRendererOptions> = {},\n): MarkViewRenderer {\n return props => {\n // try to get the parent component\n // this is important for vue devtools to show the component hierarchy correctly\n // maybe it’s `undefined` because <editor-content> isn’t rendered yet\n if (!(props.editor as Editor).contentComponent) {\n return {} as unknown as MarkView<any, any>\n }\n\n return new VueMarkView(component, props, options)\n }\n}\n","import type { Editor } from '@tiptap/core'\nimport type { Component, DefineComponent } from 'vue'\nimport { h, markRaw, reactive, render } from 'vue'\n\nimport type { Editor as ExtendedEditor } from './Editor.js'\n\nexport interface VueRendererOptions {\n editor: Editor\n props?: Record<string, any>\n}\n\ntype ExtendedVNode = ReturnType<typeof h> | null\n\ninterface RenderedComponent {\n vNode: ExtendedVNode\n destroy: () => void\n el: Element | null\n}\n\n/**\n * This class is used to render Vue components inside the editor.\n */\nexport class VueRenderer {\n renderedComponent!: RenderedComponent\n\n editor: ExtendedEditor\n\n component: Component\n\n el: Element | null\n\n props: Record<string, any>\n\n /**\n * Flag to track if the renderer has been destroyed, preventing queued or asynchronous renders from executing after teardown.\n */\n destroyed = false\n\n constructor(component: Component, { props = {}, editor }: VueRendererOptions) {\n this.editor = editor as ExtendedEditor\n this.component = markRaw(component)\n this.el = document.createElement('div')\n this.props = reactive(props)\n this.renderedComponent = this.renderComponent()\n }\n\n get element(): Element | null {\n return this.renderedComponent.el\n }\n\n get ref(): any {\n // Composition API\n if (this.renderedComponent.vNode?.component?.exposed) {\n return this.renderedComponent.vNode.component.exposed\n }\n // Option API\n return this.renderedComponent.vNode?.component?.proxy\n }\n\n renderComponent() {\n if (this.destroyed) {\n return this.renderedComponent\n }\n\n let vNode: ExtendedVNode = h(this.component as DefineComponent, this.props)\n\n if (this.editor.appContext) {\n vNode.appContext = this.editor.appContext\n }\n if (typeof document !== 'undefined' && this.el) {\n render(vNode, this.el)\n }\n\n const destroy = () => {\n if (this.el) {\n render(null, this.el)\n }\n this.el = null\n vNode = null\n }\n\n return { vNode, destroy, el: this.el ? this.el.firstElementChild : null }\n }\n\n updateProps(props: Record<string, any> = {}): void {\n if (this.destroyed) {\n return\n }\n\n Object.entries(props).forEach(([key, value]) => {\n this.props[key] = value\n })\n this.renderComponent()\n }\n\n destroy(): void {\n if (this.destroyed) {\n return\n }\n\n this.destroyed = true\n this.renderedComponent.destroy()\n }\n}\n","/* eslint-disable no-underscore-dangle */\nimport type { DecorationWithType, NodeViewProps, NodeViewRenderer, NodeViewRendererOptions } from '@tiptap/core'\nimport { cancelPositionCheck, isNodeViewSelected, NodeView, schedulePositionCheck } from '@tiptap/core'\nimport type { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { Decoration, DecorationSource, NodeView as ProseMirrorNodeView } from '@tiptap/pm/view'\nimport type { Component, PropType, Ref } from 'vue'\nimport { defineComponent, provide, ref } from 'vue'\n\nimport type { Editor } from './Editor.js'\nimport { VueRenderer } from './VueRenderer.js'\n\nexport const nodeViewProps = {\n editor: {\n type: Object as PropType<NodeViewProps['editor']>,\n required: true as const,\n },\n node: {\n type: Object as PropType<NodeViewProps['node']>,\n required: true as const,\n },\n decorations: {\n type: Object as PropType<NodeViewProps['decorations']>,\n required: true as const,\n },\n selected: {\n type: Boolean as PropType<NodeViewProps['selected']>,\n required: true as const,\n },\n extension: {\n type: Object as PropType<NodeViewProps['extension']>,\n required: true as const,\n },\n getPos: {\n type: Function as PropType<NodeViewProps['getPos']>,\n required: true as const,\n },\n updateAttributes: {\n type: Function as PropType<NodeViewProps['updateAttributes']>,\n required: true as const,\n },\n deleteNode: {\n type: Function as PropType<NodeViewProps['deleteNode']>,\n required: true as const,\n },\n view: {\n type: Object as PropType<NodeViewProps['view']>,\n required: true as const,\n },\n innerDecorations: {\n type: Object as PropType<NodeViewProps['innerDecorations']>,\n required: true as const,\n },\n HTMLAttributes: {\n type: Object as PropType<NodeViewProps['HTMLAttributes']>,\n required: true as const,\n },\n}\n\nexport interface VueNodeViewRendererOptions extends NodeViewRendererOptions {\n update:\n | ((props: {\n oldNode: ProseMirrorNode\n oldDecorations: readonly Decoration[]\n oldInnerDecorations: DecorationSource\n newNode: ProseMirrorNode\n newDecorations: readonly Decoration[]\n innerDecorations: DecorationSource\n updateProps: () => void\n }) => boolean)\n | null\n}\n\nclass VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions> {\n renderer!: VueRenderer\n\n decorationClasses!: Ref<string>\n\n /**\n * The last known position of this node view, used to detect position-only\n * changes that don't produce a new node object reference.\n */\n private currentPos: number | undefined\n\n /**\n * Callback registered with the per-editor position-update registry.\n * Stored so it can be unregistered in destroy().\n */\n private positionCheckCallback: (() => void) | null = null\n\n private cachedExtensionWithSyncedStorage: NodeViewProps['extension'] | null = null\n\n /**\n * Returns a proxy of the extension that redirects storage access to the editor's mutable storage.\n * This preserves the original prototype chain (instanceof checks, methods like configure/extend work).\n * Cached to avoid proxy creation on every update.\n */\n get extensionWithSyncedStorage(): NodeViewProps['extension'] {\n if (!this.cachedExtensionWithSyncedStorage) {\n const editor = this.editor\n const extension = this.extension\n\n this.cachedExtensionWithSyncedStorage = new Proxy(extension, {\n get(target, prop, receiver) {\n if (prop === 'storage') {\n return editor.storage[extension.name as keyof typeof editor.storage] ?? {}\n }\n return Reflect.get(target, prop, receiver)\n },\n })\n }\n\n return this.cachedExtensionWithSyncedStorage\n }\n\n mount() {\n const props = {\n editor: this.editor,\n node: this.node,\n decorations: this.decorations as DecorationWithType[],\n innerDecorations: this.innerDecorations,\n view: this.view,\n selected: false,\n extension: this.extensionWithSyncedStorage,\n HTMLAttributes: this.HTMLAttributes,\n getPos: () => this.getPos(),\n updateAttributes: (attributes = {}) => this.updateAttributes(attributes),\n deleteNode: () => this.deleteNode(),\n } satisfies NodeViewProps\n\n const onDragStart = this.onDragStart.bind(this)\n\n this.decorationClasses = ref(this.getDecorationClasses())\n\n const extendedComponent = defineComponent({\n extends: { ...this.component },\n props: Object.keys(props),\n template: (this.component as any).template,\n setup: reactiveProps => {\n provide('onDragStart', onDragStart)\n provide('decorationClasses', this.decorationClasses)\n\n return (this.component as any).setup?.(reactiveProps, {\n expose: () => undefined,\n })\n },\n // add support for scoped styles\n // @ts-ignore\n // eslint-disable-next-line\n __scopeId: this.component.__scopeId,\n // add support for CSS Modules\n // @ts-ignore\n // eslint-disable-next-line\n __cssModules: this.component.__cssModules,\n // add support for vue devtools\n // @ts-ignore\n // eslint-disable-next-line\n __name: this.component.__name,\n // @ts-ignore\n // eslint-disable-next-line\n __file: this.component.__file,\n })\n\n this.handleSelectionUpdate = this.handleSelectionUpdate.bind(this)\n this.editor.on('selectionUpdate', this.handleSelectionUpdate)\n this.currentPos = this.getPos()\n\n this.positionCheckCallback = () => {\n // Guard against the callback firing before the renderer is fully initialized.\n if (!this.renderer) {\n return\n }\n\n const newPos = this.getPos()\n\n if (typeof newPos !== 'number' || newPos === this.currentPos) {\n return\n }\n\n this.currentPos = newPos\n\n // Pass a fresh getPos reference so Vue's reactivity detects a prop change.\n this.renderer.updateProps({ getPos: () => this.getPos() })\n }\n\n schedulePositionCheck(this.editor, this.positionCheckCallback)\n\n this.renderer = new VueRenderer(extendedComponent, {\n editor: this.editor,\n props,\n })\n }\n\n /**\n * Return the DOM element.\n * This is the element that will be used to display the node view.\n */\n get dom() {\n if (!this.renderer.element || !this.renderer.element.hasAttribute('data-node-view-wrapper')) {\n throw Error('Please use the NodeViewWrapper component for your node view.')\n }\n\n return this.renderer.element as HTMLElement\n }\n\n /**\n * Return the content DOM element.\n * This is the element that will be used to display the rich-text content of the node.\n */\n get contentDOM() {\n if (this.node.isLeaf) {\n return null\n }\n\n return this.dom.querySelector('[data-node-view-content]') as HTMLElement | null\n }\n\n /**\n * On editor selection update, check if the node is selected.\n * If it is, call `selectNode`, otherwise call `deselectNode`.\n */\n handleSelectionUpdate() {\n const pos = this.getPos()\n\n if (typeof pos !== 'number') {\n return\n }\n\n const isSelected = isNodeViewSelected({\n selection: this.editor.state.selection,\n pos,\n nodeSize: this.node.nodeSize,\n selectedOnTextSelection: this.options.selectedOnTextSelection,\n })\n\n if (isSelected) {\n if (this.renderer.props.selected) {\n return\n }\n\n this.selectNode()\n } else {\n if (!this.renderer.props.selected) {\n return\n }\n\n this.deselectNode()\n }\n }\n\n /**\n * On update, update the React component.\n * To prevent unnecessary updates, the `update` option can be used.\n */\n update(node: ProseMirrorNode, decorations: readonly Decoration[], innerDecorations: DecorationSource): boolean {\n const rerenderComponent = (props?: Record<string, any>) => {\n this.decorationClasses.value = this.getDecorationClasses()\n this.renderer.updateProps(props)\n }\n\n if (typeof this.options.update === 'function') {\n const oldNode = this.node\n const oldDecorations = this.decorations\n const oldInnerDecorations = this.innerDecorations\n\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n this.currentPos = this.getPos()\n\n return this.options.update({\n oldNode,\n oldDecorations,\n newNode: node,\n newDecorations: decorations,\n oldInnerDecorations,\n innerDecorations,\n updateProps: () =>\n rerenderComponent({ node, decorations, innerDecorations, extension: this.extensionWithSyncedStorage }),\n })\n }\n\n if (node.type !== this.node.type) {\n return false\n }\n\n const newPos = this.getPos()\n\n if (node === this.node && this.decorations === decorations && this.innerDecorations === innerDecorations) {\n if (newPos === this.currentPos) {\n return true\n }\n\n // Position changed without a content/decoration change — trigger re-render\n // so the component receives an up-to-date value from getPos().\n // Pass a fresh getPos reference so Vue's reactivity detects a prop change.\n this.currentPos = newPos\n rerenderComponent({\n node,\n decorations,\n innerDecorations,\n extension: this.extensionWithSyncedStorage,\n getPos: () => this.getPos(),\n })\n return true\n }\n\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n this.currentPos = newPos\n\n rerenderComponent({ node, decorations, innerDecorations, extension: this.extensionWithSyncedStorage })\n\n return true\n }\n\n /**\n * Select the node.\n * Add the `selected` prop and the `ProseMirror-selectednode` class.\n */\n selectNode() {\n this.renderer.updateProps({\n selected: true,\n })\n if (this.renderer.element) {\n this.renderer.element.classList.add('ProseMirror-selectednode')\n }\n }\n\n /**\n * Deselect the node.\n * Remove the `selected` prop and the `ProseMirror-selectednode` class.\n */\n deselectNode() {\n this.renderer.updateProps({\n selected: false,\n })\n if (this.renderer.element) {\n this.renderer.element.classList.remove('ProseMirror-selectednode')\n }\n }\n\n getDecorationClasses() {\n return (\n this.decorations\n // @ts-ignore\n .flatMap(item => item.type.attrs.class)\n .join(' ')\n )\n }\n\n destroy() {\n this.renderer.destroy()\n this.editor.off('selectionUpdate', this.handleSelectionUpdate)\n\n if (this.positionCheckCallback) {\n cancelPositionCheck(this.editor, this.positionCheckCallback)\n this.positionCheckCallback = null\n }\n }\n}\n\nexport function VueNodeViewRenderer(\n component: Component<NodeViewProps>,\n options?: Partial<VueNodeViewRendererOptions>,\n): NodeViewRenderer {\n return props => {\n // try to get the parent component\n // this is important for vue devtools to show the component hierarchy correctly\n // maybe it’s `undefined` because <editor-content> isn’t rendered yet\n if (!(props.editor as Editor).contentComponent) {\n return {} as unknown as ProseMirrorNodeView\n }\n // check for class-component and normalize if neccessary\n const normalizedComponent =\n typeof component === 'function' && '__vccOpts' in component ? (component.__vccOpts as Component) : component\n\n return new VueNodeView(normalizedComponent, props, options)\n }\n}\n"],"mappings":"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","names":["CoreEditor","import_vue","import_vue","import_vue","import_vue","import_core","import_vue","import_vue","import_core","import_vue"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/Editor.ts","../src/EditorContent.ts","../src/NodeViewContent.ts","../src/NodeViewWrapper.ts","../src/useEditor.ts","../src/VueMarkViewRenderer.ts","../src/VueRenderer.ts","../src/VueNodeViewRenderer.ts"],"sourcesContent":["export { Editor } from './Editor.js'\nexport * from './EditorContent.js'\nexport * from './NodeViewContent.js'\nexport * from './NodeViewWrapper.js'\nexport * from './useEditor.js'\nexport * from './VueMarkViewRenderer.js'\nexport * from './VueNodeViewRenderer.js'\nexport * from './VueRenderer.js'\nexport * from '@tiptap/core'\n","/* eslint-disable react-hooks/rules-of-hooks */\nimport type { EditorOptions, Storage } from '@tiptap/core'\nimport { Editor as CoreEditor } from '@tiptap/core'\nimport type { EditorState, Plugin, PluginKey } from '@tiptap/pm/state'\nimport type { AppContext, ComponentInternalInstance, ComponentPublicInstance, Ref } from 'vue'\nimport { customRef, markRaw } from 'vue'\n\nfunction useDebouncedRef<T>(value: T) {\n return customRef<T>((track, trigger) => {\n return {\n get() {\n track()\n return value\n },\n set(newValue) {\n // update state\n value = newValue\n\n // update view as soon as possible\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n trigger()\n })\n })\n },\n }\n })\n}\n\nexport type ContentComponent = ComponentInternalInstance & {\n ctx: ComponentPublicInstance\n}\n\nexport class Editor extends CoreEditor {\n private reactiveState: Ref<EditorState>\n\n private reactiveExtensionStorage: Ref<Storage>\n\n public contentComponent: ContentComponent | null = null\n\n public appContext: AppContext | null = null\n\n constructor(options: Partial<EditorOptions> = {}) {\n super(options)\n\n this.reactiveState = useDebouncedRef(this.view.state)\n this.reactiveExtensionStorage = useDebouncedRef(this.extensionStorage)\n\n this.on('beforeTransaction', ({ nextState }) => {\n this.reactiveState.value = nextState\n this.reactiveExtensionStorage.value = this.extensionStorage\n })\n\n return markRaw(this) // eslint-disable-line\n }\n\n get state() {\n return this.reactiveState ? this.reactiveState.value : this.view.state\n }\n\n get storage() {\n return this.reactiveExtensionStorage ? this.reactiveExtensionStorage.value : super.storage\n }\n\n /**\n * Register a ProseMirror plugin.\n */\n public registerPlugin(\n plugin: Plugin,\n handlePlugins?: (newPlugin: Plugin, plugins: Plugin[]) => Plugin[],\n ): EditorState {\n const nextState = super.registerPlugin(plugin, handlePlugins)\n\n if (this.reactiveState) {\n this.reactiveState.value = nextState\n }\n\n return nextState\n }\n\n /**\n * Unregister a ProseMirror plugin.\n */\n public unregisterPlugin(nameOrPluginKey: string | PluginKey): EditorState | undefined {\n const nextState = super.unregisterPlugin(nameOrPluginKey)\n\n if (this.reactiveState && nextState) {\n this.reactiveState.value = nextState\n }\n\n return nextState\n }\n}\n","import type { PropType, Ref } from 'vue'\nimport { defineComponent, getCurrentInstance, h, nextTick, onBeforeUnmount, ref, unref, watchEffect } from 'vue'\n\nimport type { Editor } from './Editor.js'\n\nexport const EditorContent = defineComponent({\n name: 'EditorContent',\n\n props: {\n editor: {\n default: null,\n type: Object as PropType<Editor>,\n },\n },\n\n setup(props) {\n const rootEl: Ref<Element | undefined> = ref()\n const instance = getCurrentInstance()\n\n watchEffect(() => {\n const editor = props.editor\n\n if (editor && editor.options.element && rootEl.value) {\n nextTick(() => {\n if (!rootEl.value || !editor.view.dom?.parentNode) {\n return\n }\n\n // TODO using the new editor.mount method might allow us to remove this\n const element = unref(rootEl.value)\n\n rootEl.value.append(...editor.view.dom.parentNode.childNodes)\n\n // @ts-ignore\n editor.contentComponent = instance.ctx._\n\n if (instance) {\n editor.appContext = {\n ...instance.appContext,\n // Vue internally uses prototype chain to forward/shadow injects across the entire component chain\n // so don't use object spread operator or 'Object.assign' and just set `provides` as is on editor's appContext\n // @ts-expect-error forward instance's 'provides' into appContext\n provides: instance.provides,\n }\n }\n\n editor.setOptions({\n element,\n })\n\n editor.createNodeViews()\n })\n }\n })\n\n onBeforeUnmount(() => {\n const editor = props.editor\n\n if (!editor) {\n return\n }\n\n editor.contentComponent = null\n editor.appContext = null\n })\n\n return { rootEl }\n },\n\n render() {\n return h('div', {\n ref: (el: any) => {\n this.rootEl = el\n },\n })\n },\n})\n","import { defineComponent, h } from 'vue'\n\nexport const NodeViewContent = defineComponent({\n name: 'NodeViewContent',\n\n props: {\n as: {\n type: String,\n default: 'div',\n },\n },\n\n render() {\n return h(this.as, {\n style: {\n whiteSpace: 'pre-wrap',\n },\n 'data-node-view-content': '',\n })\n },\n})\n","import { defineComponent, h } from 'vue'\n\nexport const NodeViewWrapper = defineComponent({\n name: 'NodeViewWrapper',\n\n props: {\n as: {\n type: String,\n default: 'div',\n },\n },\n\n inject: ['onDragStart', 'decorationClasses'],\n\n render() {\n return h(\n this.as,\n {\n // @ts-ignore\n class: this.decorationClasses,\n style: {\n whiteSpace: 'normal',\n },\n 'data-node-view-wrapper': '',\n // @ts-ignore (https://github.com/vuejs/vue-next/issues/3031)\n onDragstart: this.onDragStart,\n },\n this.$slots.default?.(),\n )\n },\n})\n","import type { EditorOptions } from '@tiptap/core'\nimport { onBeforeUnmount, onMounted, shallowRef } from 'vue'\n\nimport { Editor } from './Editor.js'\n\nexport const useEditor = (options: Partial<EditorOptions> = {}) => {\n const editor = shallowRef<Editor>()\n\n onMounted(() => {\n editor.value = new Editor(options)\n })\n\n onBeforeUnmount(() => {\n editor.value?.destroy()\n })\n\n return editor\n}\n","/* eslint-disable no-underscore-dangle */\nimport type { MarkViewProps, MarkViewRenderer, MarkViewRendererOptions } from '@tiptap/core'\nimport { MarkView } from '@tiptap/core'\nimport type { Component, PropType } from 'vue'\nimport { defineComponent, h, toRaw } from 'vue'\n\nimport type { Editor } from './Editor.js'\nimport { VueRenderer } from './VueRenderer.js'\n\nexport interface VueMarkViewRendererOptions extends MarkViewRendererOptions {\n as?: string\n className?: string\n attrs?: { [key: string]: string }\n}\n\nexport const markViewProps = {\n editor: {\n type: Object as PropType<MarkViewProps['editor']>,\n required: true as const,\n },\n mark: {\n type: Object as PropType<MarkViewProps['mark']>,\n required: true as const,\n },\n extension: {\n type: Object as PropType<MarkViewProps['extension']>,\n required: true as const,\n },\n inline: {\n type: Boolean as PropType<MarkViewProps['inline']>,\n required: true as const,\n },\n view: {\n type: Object as PropType<MarkViewProps['view']>,\n required: true as const,\n },\n updateAttributes: {\n type: Function as PropType<MarkViewProps['updateAttributes']>,\n required: true as const,\n },\n HTMLAttributes: {\n type: Object as PropType<MarkViewProps['HTMLAttributes']>,\n required: true as const,\n },\n}\n\nexport const MarkViewContent = defineComponent({\n name: 'MarkViewContent',\n\n props: {\n as: {\n type: String,\n default: 'span',\n },\n },\n\n render() {\n return h(this.as, {\n style: {\n whiteSpace: 'inherit',\n },\n 'data-mark-view-content': '',\n })\n },\n})\n\nexport class VueMarkView extends MarkView<Component, VueMarkViewRendererOptions> {\n renderer: VueRenderer\n\n constructor(component: Component, props: MarkViewProps, options?: Partial<VueMarkViewRendererOptions>) {\n super(component, props, options)\n\n const componentProps = { ...props, updateAttributes: this.updateAttributes.bind(this) } satisfies MarkViewProps\n\n // Create extended component with provide\n const extendedComponent = defineComponent({\n extends: { ...component },\n props: Object.keys(componentProps),\n template: (this.component as any).template,\n setup: reactiveProps => {\n return (component as any).setup?.(reactiveProps, {\n expose: () => undefined,\n })\n },\n // Add support for scoped styles\n __scopeId: (component as any).__scopeId,\n __cssModules: (component as any).__cssModules,\n __name: (component as any).__name,\n __file: (component as any).__file,\n })\n this.renderer = new VueRenderer(extendedComponent, {\n editor: this.editor,\n props: componentProps,\n })\n }\n\n get dom() {\n return this.renderer.element as HTMLElement\n }\n\n get contentDOM() {\n return this.dom.querySelector('[data-mark-view-content]') as HTMLElement | null\n }\n\n updateAttributes(attrs: Record<string, any>): void {\n // since this.mark is now an proxy, we need to get the actual mark from it\n const unproxiedMark = toRaw(this.mark)\n super.updateAttributes(attrs, unproxiedMark)\n }\n\n destroy() {\n this.renderer.destroy()\n }\n}\n\nexport function VueMarkViewRenderer(\n component: Component,\n options: Partial<VueMarkViewRendererOptions> = {},\n): MarkViewRenderer {\n return props => {\n // try to get the parent component\n // this is important for vue devtools to show the component hierarchy correctly\n // maybe it’s `undefined` because <editor-content> isn’t rendered yet\n if (!(props.editor as Editor).contentComponent) {\n return {} as unknown as MarkView<any, any>\n }\n\n return new VueMarkView(component, props, options)\n }\n}\n","import type { Editor } from '@tiptap/core'\nimport type { Component, DefineComponent } from 'vue'\nimport { h, markRaw, reactive, render } from 'vue'\n\nimport type { Editor as ExtendedEditor } from './Editor.js'\n\nexport interface VueRendererOptions {\n editor: Editor\n props?: Record<string, any>\n}\n\ntype ExtendedVNode = ReturnType<typeof h> | null\n\ninterface RenderedComponent {\n vNode: ExtendedVNode\n destroy: () => void\n el: Element | null\n}\n\n/**\n * This class is used to render Vue components inside the editor.\n */\nexport class VueRenderer {\n renderedComponent!: RenderedComponent\n\n editor: ExtendedEditor\n\n component: Component\n\n el: Element | null\n\n props: Record<string, any>\n\n /**\n * Flag to track if the renderer has been destroyed, preventing queued or asynchronous renders from executing after teardown.\n */\n destroyed = false\n\n constructor(component: Component, { props = {}, editor }: VueRendererOptions) {\n this.editor = editor as ExtendedEditor\n this.component = markRaw(component)\n this.el = document.createElement('div')\n this.props = reactive(props)\n this.renderedComponent = this.renderComponent()\n }\n\n get element(): Element | null {\n return this.renderedComponent.el\n }\n\n get ref(): any {\n // Composition API\n if (this.renderedComponent.vNode?.component?.exposed) {\n return this.renderedComponent.vNode.component.exposed\n }\n // Option API\n return this.renderedComponent.vNode?.component?.proxy\n }\n\n renderComponent() {\n if (this.destroyed) {\n return this.renderedComponent\n }\n\n let vNode: ExtendedVNode = h(this.component as DefineComponent, this.props)\n\n if (this.editor.appContext) {\n vNode.appContext = this.editor.appContext\n }\n if (typeof document !== 'undefined' && this.el) {\n render(vNode, this.el)\n }\n\n const destroy = () => {\n if (this.el) {\n render(null, this.el)\n }\n this.el = null\n vNode = null\n }\n\n return { vNode, destroy, el: this.el ? this.el.firstElementChild : null }\n }\n\n updateProps(props: Record<string, any> = {}): void {\n if (this.destroyed) {\n return\n }\n\n Object.entries(props).forEach(([key, value]) => {\n this.props[key] = value\n })\n this.renderComponent()\n }\n\n destroy(): void {\n if (this.destroyed) {\n return\n }\n\n this.destroyed = true\n this.renderedComponent.destroy()\n }\n}\n","/* eslint-disable no-underscore-dangle */\nimport type {\n DecorationWithType,\n NodeViewProps,\n NodeViewRenderer,\n NodeViewRendererOptions,\n NodeViewRendererProps,\n} from '@tiptap/core'\nimport { isNodeViewSelected, NodeView } from '@tiptap/core'\nimport type { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { Decoration, DecorationSource, NodeView as ProseMirrorNodeView } from '@tiptap/pm/view'\nimport type { Component, PropType, Ref } from 'vue'\nimport { defineComponent, provide, ref } from 'vue'\n\nimport type { Editor } from './Editor.js'\nimport { VueRenderer } from './VueRenderer.js'\n\nexport const nodeViewProps = {\n editor: {\n type: Object as PropType<NodeViewProps['editor']>,\n required: true as const,\n },\n node: {\n type: Object as PropType<NodeViewProps['node']>,\n required: true as const,\n },\n decorations: {\n type: Object as PropType<NodeViewProps['decorations']>,\n required: true as const,\n },\n selected: {\n type: Boolean as PropType<NodeViewProps['selected']>,\n required: true as const,\n },\n extension: {\n type: Object as PropType<NodeViewProps['extension']>,\n required: true as const,\n },\n getPos: {\n type: Function as PropType<NodeViewProps['getPos']>,\n required: true as const,\n },\n updateAttributes: {\n type: Function as PropType<NodeViewProps['updateAttributes']>,\n required: true as const,\n },\n deleteNode: {\n type: Function as PropType<NodeViewProps['deleteNode']>,\n required: true as const,\n },\n view: {\n type: Object as PropType<NodeViewProps['view']>,\n required: true as const,\n },\n innerDecorations: {\n type: Object as PropType<NodeViewProps['innerDecorations']>,\n required: true as const,\n },\n HTMLAttributes: {\n type: Object as PropType<NodeViewProps['HTMLAttributes']>,\n required: true as const,\n },\n}\n\nexport interface VueNodeViewRendererOptions extends NodeViewRendererOptions {\n update:\n | ((props: {\n oldNode: ProseMirrorNode\n oldDecorations: readonly Decoration[]\n oldInnerDecorations: DecorationSource\n newNode: ProseMirrorNode\n newDecorations: readonly Decoration[]\n innerDecorations: DecorationSource\n updateProps: () => void\n }) => boolean)\n | null\n}\n\nclass VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions> {\n renderer!: VueRenderer\n\n decorationClasses!: Ref<string>\n\n private currentPos: number | undefined\n\n private cachedExtensionWithSyncedStorage: NodeViewProps['extension'] | null = null\n\n constructor(component: Component, props: NodeViewRendererProps, options?: Partial<VueNodeViewRendererOptions>) {\n super(component, props, options)\n\n if (this.options.trackNodeViewPosition) {\n this.editor.on('update', this.handlePositionUpdate)\n }\n }\n\n /**\n * Returns a proxy of the extension that redirects storage access to the editor's mutable storage.\n * This preserves the original prototype chain (instanceof checks, methods like configure/extend work).\n * Cached to avoid proxy creation on every update.\n */\n get extensionWithSyncedStorage(): NodeViewProps['extension'] {\n if (!this.cachedExtensionWithSyncedStorage) {\n const editor = this.editor\n const extension = this.extension\n\n this.cachedExtensionWithSyncedStorage = new Proxy(extension, {\n get(target, prop, receiver) {\n if (prop === 'storage') {\n return editor.storage[extension.name as keyof typeof editor.storage] ?? {}\n }\n return Reflect.get(target, prop, receiver)\n },\n })\n }\n\n return this.cachedExtensionWithSyncedStorage\n }\n\n mount() {\n const props: Record<string, any> = {\n editor: this.editor,\n node: this.node,\n decorations: this.decorations as DecorationWithType[],\n innerDecorations: this.innerDecorations,\n view: this.view,\n selected: false,\n extension: this.extensionWithSyncedStorage,\n HTMLAttributes: this.HTMLAttributes,\n getPos: () => this.getPos(),\n updateAttributes: (attributes = {}) => this.updateAttributes(attributes),\n deleteNode: () => this.deleteNode(),\n }\n\n const mountProps = props as NodeViewProps\n\n const onDragStart = this.onDragStart.bind(this)\n\n this.decorationClasses = ref(this.getDecorationClasses())\n\n const extendedComponent = defineComponent({\n extends: { ...this.component },\n props: Object.keys(props),\n template: (this.component as any).template,\n setup: reactiveProps => {\n provide('onDragStart', onDragStart)\n provide('decorationClasses', this.decorationClasses)\n\n return (this.component as any).setup?.(reactiveProps, {\n expose: () => undefined,\n })\n },\n // add support for scoped styles\n // @ts-ignore\n // eslint-disable-next-line\n __scopeId: this.component.__scopeId,\n // add support for CSS Modules\n // @ts-ignore\n // eslint-disable-next-line\n __cssModules: this.component.__cssModules,\n // add support for vue devtools\n // @ts-ignore\n // eslint-disable-next-line\n __name: this.component.__name,\n // @ts-ignore\n // eslint-disable-next-line\n __file: this.component.__file,\n })\n\n this.handleSelectionUpdate = this.handleSelectionUpdate.bind(this)\n this.editor.on('selectionUpdate', this.handleSelectionUpdate)\n\n this.currentPos = this.getPos()\n\n this.renderer = new VueRenderer(extendedComponent, {\n editor: this.editor,\n props: mountProps,\n })\n }\n\n /**\n * Fires on editor updates when trackNodeViewPosition is enabled.\n * Detects position shifts where update() is NOT called.\n */\n private handlePositionUpdate = () => {\n const newPos = this.getPos()\n if (typeof newPos !== 'number' || newPos === this.currentPos) {\n return\n }\n this.currentPos = newPos\n this.renderer.updateProps({ getPos: () => this.getPos() })\n }\n\n /**\n * Return the DOM element.\n * This is the element that will be used to display the node view.\n */\n get dom() {\n if (!this.renderer.element || !this.renderer.element.hasAttribute('data-node-view-wrapper')) {\n throw Error('Please use the NodeViewWrapper component for your node view.')\n }\n\n return this.renderer.element as HTMLElement\n }\n\n /**\n * Return the content DOM element.\n * This is the element that will be used to display the rich-text content of the node.\n */\n get contentDOM() {\n if (this.node.isLeaf) {\n return null\n }\n\n return this.dom.querySelector('[data-node-view-content]') as HTMLElement | null\n }\n\n /**\n * On editor selection update, check if the node is selected.\n * If it is, call `selectNode`, otherwise call `deselectNode`.\n */\n handleSelectionUpdate() {\n const pos = this.getPos()\n\n if (typeof pos !== 'number') {\n return\n }\n\n const isSelected = isNodeViewSelected({\n selection: this.editor.state.selection,\n pos,\n nodeSize: this.node.nodeSize,\n selectedOnTextSelection: this.options.selectedOnTextSelection,\n })\n\n if (isSelected) {\n if (this.renderer.props.selected) {\n return\n }\n\n this.selectNode()\n } else {\n if (!this.renderer.props.selected) {\n return\n }\n\n this.deselectNode()\n }\n }\n\n /**\n * On update, update the React component.\n * To prevent unnecessary updates, the `update` option can be used.\n */\n update(node: ProseMirrorNode, decorations: readonly Decoration[], innerDecorations: DecorationSource): boolean {\n const rerenderComponent = (props?: Record<string, any>) => {\n this.decorationClasses.value = this.getDecorationClasses()\n this.renderer.updateProps(props)\n }\n\n if (typeof this.options.update === 'function') {\n const oldNode = this.node\n const oldDecorations = this.decorations\n const oldInnerDecorations = this.innerDecorations\n\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n\n return this.options.update({\n oldNode,\n oldDecorations,\n newNode: node,\n newDecorations: decorations,\n oldInnerDecorations,\n innerDecorations,\n updateProps: () =>\n rerenderComponent({ node, decorations, innerDecorations, extension: this.extensionWithSyncedStorage }),\n })\n }\n\n if (node.type !== this.node.type) {\n return false\n }\n\n const nodeChanged = node !== this.node\n\n // Node reference unchanged — only decorations may have changed.\n // ProseMirror renders decorations independently on the contentDOM,\n // and the getPos closure (bound in mount()) calls through to\n // ProseMirror's position function at call time, so it is always\n // current. Update internal refs, refresh decoration classes for\n // the wrapper component, and skip the Vue re-render.\n if (!nodeChanged) {\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n this.decorationClasses.value = this.getDecorationClasses()\n return true\n }\n\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n this.currentPos = this.getPos()\n\n const extraProps: Record<string, any> = {\n node,\n decorations,\n innerDecorations,\n extension: this.extensionWithSyncedStorage,\n }\n\n if (this.options.trackNodeViewPosition) {\n extraProps.getPos = () => this.getPos()\n }\n\n rerenderComponent(extraProps)\n return true\n }\n\n /**\n * Select the node.\n * Add the `selected` prop and the `ProseMirror-selectednode` class.\n */\n selectNode() {\n this.renderer.updateProps({\n selected: true,\n })\n if (this.renderer.element) {\n this.renderer.element.classList.add('ProseMirror-selectednode')\n }\n }\n\n /**\n * Deselect the node.\n * Remove the `selected` prop and the `ProseMirror-selectednode` class.\n */\n deselectNode() {\n this.renderer.updateProps({\n selected: false,\n })\n if (this.renderer.element) {\n this.renderer.element.classList.remove('ProseMirror-selectednode')\n }\n }\n\n getDecorationClasses() {\n return (\n this.decorations\n // @ts-ignore\n .flatMap(item => item.type.attrs.class)\n .join(' ')\n )\n }\n\n destroy() {\n this.renderer.destroy()\n this.editor.off('selectionUpdate', this.handleSelectionUpdate)\n\n if (this.options.trackNodeViewPosition) {\n this.editor.off('update', this.handlePositionUpdate)\n }\n }\n}\n\nexport function VueNodeViewRenderer(\n component: Component<NodeViewProps>,\n options?: Partial<VueNodeViewRendererOptions>,\n): NodeViewRenderer {\n return props => {\n // try to get the parent component\n // this is important for vue devtools to show the component hierarchy correctly\n // maybe it’s `undefined` because <editor-content> isn’t rendered yet\n if (!(props.editor as Editor).contentComponent) {\n return {} as unknown as ProseMirrorNodeView\n }\n // check for class-component and normalize if neccessary\n const normalizedComponent =\n typeof component === 'function' && '__vccOpts' in component ? (component.__vccOpts as Component) : component\n\n return new VueNodeView(normalizedComponent, props, options)\n }\n}\n"],"mappings":"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","names":["CoreEditor","import_vue","import_vue","import_vue","import_vue","import_core","import_vue","import_vue","import_core","import_vue"]}
|
package/dist/index.js
CHANGED
|
@@ -346,7 +346,7 @@ function VueMarkViewRenderer(component, options = {}) {
|
|
|
346
346
|
}
|
|
347
347
|
|
|
348
348
|
// src/VueNodeViewRenderer.ts
|
|
349
|
-
import {
|
|
349
|
+
import { isNodeViewSelected, NodeView } from "@tiptap/core";
|
|
350
350
|
import { defineComponent as defineComponent5, provide, ref as ref2 } from "vue";
|
|
351
351
|
var nodeViewProps = {
|
|
352
352
|
editor: {
|
|
@@ -395,14 +395,24 @@ var nodeViewProps = {
|
|
|
395
395
|
}
|
|
396
396
|
};
|
|
397
397
|
var VueNodeView = class extends NodeView {
|
|
398
|
-
constructor() {
|
|
399
|
-
super(
|
|
398
|
+
constructor(component, props, options) {
|
|
399
|
+
super(component, props, options);
|
|
400
|
+
this.cachedExtensionWithSyncedStorage = null;
|
|
400
401
|
/**
|
|
401
|
-
*
|
|
402
|
-
*
|
|
402
|
+
* Fires on editor updates when trackNodeViewPosition is enabled.
|
|
403
|
+
* Detects position shifts where update() is NOT called.
|
|
403
404
|
*/
|
|
404
|
-
this.
|
|
405
|
-
|
|
405
|
+
this.handlePositionUpdate = () => {
|
|
406
|
+
const newPos = this.getPos();
|
|
407
|
+
if (typeof newPos !== "number" || newPos === this.currentPos) {
|
|
408
|
+
return;
|
|
409
|
+
}
|
|
410
|
+
this.currentPos = newPos;
|
|
411
|
+
this.renderer.updateProps({ getPos: () => this.getPos() });
|
|
412
|
+
};
|
|
413
|
+
if (this.options.trackNodeViewPosition) {
|
|
414
|
+
this.editor.on("update", this.handlePositionUpdate);
|
|
415
|
+
}
|
|
406
416
|
}
|
|
407
417
|
/**
|
|
408
418
|
* Returns a proxy of the extension that redirects storage access to the editor's mutable storage.
|
|
@@ -439,6 +449,7 @@ var VueNodeView = class extends NodeView {
|
|
|
439
449
|
updateAttributes: (attributes = {}) => this.updateAttributes(attributes),
|
|
440
450
|
deleteNode: () => this.deleteNode()
|
|
441
451
|
};
|
|
452
|
+
const mountProps = props;
|
|
442
453
|
const onDragStart = this.onDragStart.bind(this);
|
|
443
454
|
this.decorationClasses = ref2(this.getDecorationClasses());
|
|
444
455
|
const extendedComponent = defineComponent5({
|
|
@@ -472,21 +483,9 @@ var VueNodeView = class extends NodeView {
|
|
|
472
483
|
this.handleSelectionUpdate = this.handleSelectionUpdate.bind(this);
|
|
473
484
|
this.editor.on("selectionUpdate", this.handleSelectionUpdate);
|
|
474
485
|
this.currentPos = this.getPos();
|
|
475
|
-
this.positionCheckCallback = () => {
|
|
476
|
-
if (!this.renderer) {
|
|
477
|
-
return;
|
|
478
|
-
}
|
|
479
|
-
const newPos = this.getPos();
|
|
480
|
-
if (typeof newPos !== "number" || newPos === this.currentPos) {
|
|
481
|
-
return;
|
|
482
|
-
}
|
|
483
|
-
this.currentPos = newPos;
|
|
484
|
-
this.renderer.updateProps({ getPos: () => this.getPos() });
|
|
485
|
-
};
|
|
486
|
-
schedulePositionCheck(this.editor, this.positionCheckCallback);
|
|
487
486
|
this.renderer = new VueRenderer(extendedComponent, {
|
|
488
487
|
editor: this.editor,
|
|
489
|
-
props
|
|
488
|
+
props: mountProps
|
|
490
489
|
});
|
|
491
490
|
}
|
|
492
491
|
/**
|
|
@@ -552,7 +551,6 @@ var VueNodeView = class extends NodeView {
|
|
|
552
551
|
this.node = node;
|
|
553
552
|
this.decorations = decorations;
|
|
554
553
|
this.innerDecorations = innerDecorations;
|
|
555
|
-
this.currentPos = this.getPos();
|
|
556
554
|
return this.options.update({
|
|
557
555
|
oldNode,
|
|
558
556
|
oldDecorations,
|
|
@@ -566,26 +564,28 @@ var VueNodeView = class extends NodeView {
|
|
|
566
564
|
if (node.type !== this.node.type) {
|
|
567
565
|
return false;
|
|
568
566
|
}
|
|
569
|
-
const
|
|
570
|
-
if (
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
this.
|
|
575
|
-
rerenderComponent({
|
|
576
|
-
node,
|
|
577
|
-
decorations,
|
|
578
|
-
innerDecorations,
|
|
579
|
-
extension: this.extensionWithSyncedStorage,
|
|
580
|
-
getPos: () => this.getPos()
|
|
581
|
-
});
|
|
567
|
+
const nodeChanged = node !== this.node;
|
|
568
|
+
if (!nodeChanged) {
|
|
569
|
+
this.node = node;
|
|
570
|
+
this.decorations = decorations;
|
|
571
|
+
this.innerDecorations = innerDecorations;
|
|
572
|
+
this.decorationClasses.value = this.getDecorationClasses();
|
|
582
573
|
return true;
|
|
583
574
|
}
|
|
584
575
|
this.node = node;
|
|
585
576
|
this.decorations = decorations;
|
|
586
577
|
this.innerDecorations = innerDecorations;
|
|
587
|
-
this.currentPos =
|
|
588
|
-
|
|
578
|
+
this.currentPos = this.getPos();
|
|
579
|
+
const extraProps = {
|
|
580
|
+
node,
|
|
581
|
+
decorations,
|
|
582
|
+
innerDecorations,
|
|
583
|
+
extension: this.extensionWithSyncedStorage
|
|
584
|
+
};
|
|
585
|
+
if (this.options.trackNodeViewPosition) {
|
|
586
|
+
extraProps.getPos = () => this.getPos();
|
|
587
|
+
}
|
|
588
|
+
rerenderComponent(extraProps);
|
|
589
589
|
return true;
|
|
590
590
|
}
|
|
591
591
|
/**
|
|
@@ -618,9 +618,8 @@ var VueNodeView = class extends NodeView {
|
|
|
618
618
|
destroy() {
|
|
619
619
|
this.renderer.destroy();
|
|
620
620
|
this.editor.off("selectionUpdate", this.handleSelectionUpdate);
|
|
621
|
-
if (this.
|
|
622
|
-
|
|
623
|
-
this.positionCheckCallback = null;
|
|
621
|
+
if (this.options.trackNodeViewPosition) {
|
|
622
|
+
this.editor.off("update", this.handlePositionUpdate);
|
|
624
623
|
}
|
|
625
624
|
}
|
|
626
625
|
};
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Editor.ts","../src/EditorContent.ts","../src/NodeViewContent.ts","../src/NodeViewWrapper.ts","../src/useEditor.ts","../src/VueMarkViewRenderer.ts","../src/VueRenderer.ts","../src/VueNodeViewRenderer.ts","../src/index.ts"],"sourcesContent":["/* eslint-disable react-hooks/rules-of-hooks */\nimport type { EditorOptions, Storage } from '@tiptap/core'\nimport { Editor as CoreEditor } from '@tiptap/core'\nimport type { EditorState, Plugin, PluginKey } from '@tiptap/pm/state'\nimport type { AppContext, ComponentInternalInstance, ComponentPublicInstance, Ref } from 'vue'\nimport { customRef, markRaw } from 'vue'\n\nfunction useDebouncedRef<T>(value: T) {\n return customRef<T>((track, trigger) => {\n return {\n get() {\n track()\n return value\n },\n set(newValue) {\n // update state\n value = newValue\n\n // update view as soon as possible\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n trigger()\n })\n })\n },\n }\n })\n}\n\nexport type ContentComponent = ComponentInternalInstance & {\n ctx: ComponentPublicInstance\n}\n\nexport class Editor extends CoreEditor {\n private reactiveState: Ref<EditorState>\n\n private reactiveExtensionStorage: Ref<Storage>\n\n public contentComponent: ContentComponent | null = null\n\n public appContext: AppContext | null = null\n\n constructor(options: Partial<EditorOptions> = {}) {\n super(options)\n\n this.reactiveState = useDebouncedRef(this.view.state)\n this.reactiveExtensionStorage = useDebouncedRef(this.extensionStorage)\n\n this.on('beforeTransaction', ({ nextState }) => {\n this.reactiveState.value = nextState\n this.reactiveExtensionStorage.value = this.extensionStorage\n })\n\n return markRaw(this) // eslint-disable-line\n }\n\n get state() {\n return this.reactiveState ? this.reactiveState.value : this.view.state\n }\n\n get storage() {\n return this.reactiveExtensionStorage ? this.reactiveExtensionStorage.value : super.storage\n }\n\n /**\n * Register a ProseMirror plugin.\n */\n public registerPlugin(\n plugin: Plugin,\n handlePlugins?: (newPlugin: Plugin, plugins: Plugin[]) => Plugin[],\n ): EditorState {\n const nextState = super.registerPlugin(plugin, handlePlugins)\n\n if (this.reactiveState) {\n this.reactiveState.value = nextState\n }\n\n return nextState\n }\n\n /**\n * Unregister a ProseMirror plugin.\n */\n public unregisterPlugin(nameOrPluginKey: string | PluginKey): EditorState | undefined {\n const nextState = super.unregisterPlugin(nameOrPluginKey)\n\n if (this.reactiveState && nextState) {\n this.reactiveState.value = nextState\n }\n\n return nextState\n }\n}\n","import type { PropType, Ref } from 'vue'\nimport { defineComponent, getCurrentInstance, h, nextTick, onBeforeUnmount, ref, unref, watchEffect } from 'vue'\n\nimport type { Editor } from './Editor.js'\n\nexport const EditorContent = defineComponent({\n name: 'EditorContent',\n\n props: {\n editor: {\n default: null,\n type: Object as PropType<Editor>,\n },\n },\n\n setup(props) {\n const rootEl: Ref<Element | undefined> = ref()\n const instance = getCurrentInstance()\n\n watchEffect(() => {\n const editor = props.editor\n\n if (editor && editor.options.element && rootEl.value) {\n nextTick(() => {\n if (!rootEl.value || !editor.view.dom?.parentNode) {\n return\n }\n\n // TODO using the new editor.mount method might allow us to remove this\n const element = unref(rootEl.value)\n\n rootEl.value.append(...editor.view.dom.parentNode.childNodes)\n\n // @ts-ignore\n editor.contentComponent = instance.ctx._\n\n if (instance) {\n editor.appContext = {\n ...instance.appContext,\n // Vue internally uses prototype chain to forward/shadow injects across the entire component chain\n // so don't use object spread operator or 'Object.assign' and just set `provides` as is on editor's appContext\n // @ts-expect-error forward instance's 'provides' into appContext\n provides: instance.provides,\n }\n }\n\n editor.setOptions({\n element,\n })\n\n editor.createNodeViews()\n })\n }\n })\n\n onBeforeUnmount(() => {\n const editor = props.editor\n\n if (!editor) {\n return\n }\n\n editor.contentComponent = null\n editor.appContext = null\n })\n\n return { rootEl }\n },\n\n render() {\n return h('div', {\n ref: (el: any) => {\n this.rootEl = el\n },\n })\n },\n})\n","import { defineComponent, h } from 'vue'\n\nexport const NodeViewContent = defineComponent({\n name: 'NodeViewContent',\n\n props: {\n as: {\n type: String,\n default: 'div',\n },\n },\n\n render() {\n return h(this.as, {\n style: {\n whiteSpace: 'pre-wrap',\n },\n 'data-node-view-content': '',\n })\n },\n})\n","import { defineComponent, h } from 'vue'\n\nexport const NodeViewWrapper = defineComponent({\n name: 'NodeViewWrapper',\n\n props: {\n as: {\n type: String,\n default: 'div',\n },\n },\n\n inject: ['onDragStart', 'decorationClasses'],\n\n render() {\n return h(\n this.as,\n {\n // @ts-ignore\n class: this.decorationClasses,\n style: {\n whiteSpace: 'normal',\n },\n 'data-node-view-wrapper': '',\n // @ts-ignore (https://github.com/vuejs/vue-next/issues/3031)\n onDragstart: this.onDragStart,\n },\n this.$slots.default?.(),\n )\n },\n})\n","import type { EditorOptions } from '@tiptap/core'\nimport { onBeforeUnmount, onMounted, shallowRef } from 'vue'\n\nimport { Editor } from './Editor.js'\n\nexport const useEditor = (options: Partial<EditorOptions> = {}) => {\n const editor = shallowRef<Editor>()\n\n onMounted(() => {\n editor.value = new Editor(options)\n })\n\n onBeforeUnmount(() => {\n editor.value?.destroy()\n })\n\n return editor\n}\n","/* eslint-disable no-underscore-dangle */\nimport type { MarkViewProps, MarkViewRenderer, MarkViewRendererOptions } from '@tiptap/core'\nimport { MarkView } from '@tiptap/core'\nimport type { Component, PropType } from 'vue'\nimport { defineComponent, h, toRaw } from 'vue'\n\nimport type { Editor } from './Editor.js'\nimport { VueRenderer } from './VueRenderer.js'\n\nexport interface VueMarkViewRendererOptions extends MarkViewRendererOptions {\n as?: string\n className?: string\n attrs?: { [key: string]: string }\n}\n\nexport const markViewProps = {\n editor: {\n type: Object as PropType<MarkViewProps['editor']>,\n required: true as const,\n },\n mark: {\n type: Object as PropType<MarkViewProps['mark']>,\n required: true as const,\n },\n extension: {\n type: Object as PropType<MarkViewProps['extension']>,\n required: true as const,\n },\n inline: {\n type: Boolean as PropType<MarkViewProps['inline']>,\n required: true as const,\n },\n view: {\n type: Object as PropType<MarkViewProps['view']>,\n required: true as const,\n },\n updateAttributes: {\n type: Function as PropType<MarkViewProps['updateAttributes']>,\n required: true as const,\n },\n HTMLAttributes: {\n type: Object as PropType<MarkViewProps['HTMLAttributes']>,\n required: true as const,\n },\n}\n\nexport const MarkViewContent = defineComponent({\n name: 'MarkViewContent',\n\n props: {\n as: {\n type: String,\n default: 'span',\n },\n },\n\n render() {\n return h(this.as, {\n style: {\n whiteSpace: 'inherit',\n },\n 'data-mark-view-content': '',\n })\n },\n})\n\nexport class VueMarkView extends MarkView<Component, VueMarkViewRendererOptions> {\n renderer: VueRenderer\n\n constructor(component: Component, props: MarkViewProps, options?: Partial<VueMarkViewRendererOptions>) {\n super(component, props, options)\n\n const componentProps = { ...props, updateAttributes: this.updateAttributes.bind(this) } satisfies MarkViewProps\n\n // Create extended component with provide\n const extendedComponent = defineComponent({\n extends: { ...component },\n props: Object.keys(componentProps),\n template: (this.component as any).template,\n setup: reactiveProps => {\n return (component as any).setup?.(reactiveProps, {\n expose: () => undefined,\n })\n },\n // Add support for scoped styles\n __scopeId: (component as any).__scopeId,\n __cssModules: (component as any).__cssModules,\n __name: (component as any).__name,\n __file: (component as any).__file,\n })\n this.renderer = new VueRenderer(extendedComponent, {\n editor: this.editor,\n props: componentProps,\n })\n }\n\n get dom() {\n return this.renderer.element as HTMLElement\n }\n\n get contentDOM() {\n return this.dom.querySelector('[data-mark-view-content]') as HTMLElement | null\n }\n\n updateAttributes(attrs: Record<string, any>): void {\n // since this.mark is now an proxy, we need to get the actual mark from it\n const unproxiedMark = toRaw(this.mark)\n super.updateAttributes(attrs, unproxiedMark)\n }\n\n destroy() {\n this.renderer.destroy()\n }\n}\n\nexport function VueMarkViewRenderer(\n component: Component,\n options: Partial<VueMarkViewRendererOptions> = {},\n): MarkViewRenderer {\n return props => {\n // try to get the parent component\n // this is important for vue devtools to show the component hierarchy correctly\n // maybe it’s `undefined` because <editor-content> isn’t rendered yet\n if (!(props.editor as Editor).contentComponent) {\n return {} as unknown as MarkView<any, any>\n }\n\n return new VueMarkView(component, props, options)\n }\n}\n","import type { Editor } from '@tiptap/core'\nimport type { Component, DefineComponent } from 'vue'\nimport { h, markRaw, reactive, render } from 'vue'\n\nimport type { Editor as ExtendedEditor } from './Editor.js'\n\nexport interface VueRendererOptions {\n editor: Editor\n props?: Record<string, any>\n}\n\ntype ExtendedVNode = ReturnType<typeof h> | null\n\ninterface RenderedComponent {\n vNode: ExtendedVNode\n destroy: () => void\n el: Element | null\n}\n\n/**\n * This class is used to render Vue components inside the editor.\n */\nexport class VueRenderer {\n renderedComponent!: RenderedComponent\n\n editor: ExtendedEditor\n\n component: Component\n\n el: Element | null\n\n props: Record<string, any>\n\n /**\n * Flag to track if the renderer has been destroyed, preventing queued or asynchronous renders from executing after teardown.\n */\n destroyed = false\n\n constructor(component: Component, { props = {}, editor }: VueRendererOptions) {\n this.editor = editor as ExtendedEditor\n this.component = markRaw(component)\n this.el = document.createElement('div')\n this.props = reactive(props)\n this.renderedComponent = this.renderComponent()\n }\n\n get element(): Element | null {\n return this.renderedComponent.el\n }\n\n get ref(): any {\n // Composition API\n if (this.renderedComponent.vNode?.component?.exposed) {\n return this.renderedComponent.vNode.component.exposed\n }\n // Option API\n return this.renderedComponent.vNode?.component?.proxy\n }\n\n renderComponent() {\n if (this.destroyed) {\n return this.renderedComponent\n }\n\n let vNode: ExtendedVNode = h(this.component as DefineComponent, this.props)\n\n if (this.editor.appContext) {\n vNode.appContext = this.editor.appContext\n }\n if (typeof document !== 'undefined' && this.el) {\n render(vNode, this.el)\n }\n\n const destroy = () => {\n if (this.el) {\n render(null, this.el)\n }\n this.el = null\n vNode = null\n }\n\n return { vNode, destroy, el: this.el ? this.el.firstElementChild : null }\n }\n\n updateProps(props: Record<string, any> = {}): void {\n if (this.destroyed) {\n return\n }\n\n Object.entries(props).forEach(([key, value]) => {\n this.props[key] = value\n })\n this.renderComponent()\n }\n\n destroy(): void {\n if (this.destroyed) {\n return\n }\n\n this.destroyed = true\n this.renderedComponent.destroy()\n }\n}\n","/* eslint-disable no-underscore-dangle */\nimport type { DecorationWithType, NodeViewProps, NodeViewRenderer, NodeViewRendererOptions } from '@tiptap/core'\nimport { cancelPositionCheck, isNodeViewSelected, NodeView, schedulePositionCheck } from '@tiptap/core'\nimport type { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { Decoration, DecorationSource, NodeView as ProseMirrorNodeView } from '@tiptap/pm/view'\nimport type { Component, PropType, Ref } from 'vue'\nimport { defineComponent, provide, ref } from 'vue'\n\nimport type { Editor } from './Editor.js'\nimport { VueRenderer } from './VueRenderer.js'\n\nexport const nodeViewProps = {\n editor: {\n type: Object as PropType<NodeViewProps['editor']>,\n required: true as const,\n },\n node: {\n type: Object as PropType<NodeViewProps['node']>,\n required: true as const,\n },\n decorations: {\n type: Object as PropType<NodeViewProps['decorations']>,\n required: true as const,\n },\n selected: {\n type: Boolean as PropType<NodeViewProps['selected']>,\n required: true as const,\n },\n extension: {\n type: Object as PropType<NodeViewProps['extension']>,\n required: true as const,\n },\n getPos: {\n type: Function as PropType<NodeViewProps['getPos']>,\n required: true as const,\n },\n updateAttributes: {\n type: Function as PropType<NodeViewProps['updateAttributes']>,\n required: true as const,\n },\n deleteNode: {\n type: Function as PropType<NodeViewProps['deleteNode']>,\n required: true as const,\n },\n view: {\n type: Object as PropType<NodeViewProps['view']>,\n required: true as const,\n },\n innerDecorations: {\n type: Object as PropType<NodeViewProps['innerDecorations']>,\n required: true as const,\n },\n HTMLAttributes: {\n type: Object as PropType<NodeViewProps['HTMLAttributes']>,\n required: true as const,\n },\n}\n\nexport interface VueNodeViewRendererOptions extends NodeViewRendererOptions {\n update:\n | ((props: {\n oldNode: ProseMirrorNode\n oldDecorations: readonly Decoration[]\n oldInnerDecorations: DecorationSource\n newNode: ProseMirrorNode\n newDecorations: readonly Decoration[]\n innerDecorations: DecorationSource\n updateProps: () => void\n }) => boolean)\n | null\n}\n\nclass VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions> {\n renderer!: VueRenderer\n\n decorationClasses!: Ref<string>\n\n /**\n * The last known position of this node view, used to detect position-only\n * changes that don't produce a new node object reference.\n */\n private currentPos: number | undefined\n\n /**\n * Callback registered with the per-editor position-update registry.\n * Stored so it can be unregistered in destroy().\n */\n private positionCheckCallback: (() => void) | null = null\n\n private cachedExtensionWithSyncedStorage: NodeViewProps['extension'] | null = null\n\n /**\n * Returns a proxy of the extension that redirects storage access to the editor's mutable storage.\n * This preserves the original prototype chain (instanceof checks, methods like configure/extend work).\n * Cached to avoid proxy creation on every update.\n */\n get extensionWithSyncedStorage(): NodeViewProps['extension'] {\n if (!this.cachedExtensionWithSyncedStorage) {\n const editor = this.editor\n const extension = this.extension\n\n this.cachedExtensionWithSyncedStorage = new Proxy(extension, {\n get(target, prop, receiver) {\n if (prop === 'storage') {\n return editor.storage[extension.name as keyof typeof editor.storage] ?? {}\n }\n return Reflect.get(target, prop, receiver)\n },\n })\n }\n\n return this.cachedExtensionWithSyncedStorage\n }\n\n mount() {\n const props = {\n editor: this.editor,\n node: this.node,\n decorations: this.decorations as DecorationWithType[],\n innerDecorations: this.innerDecorations,\n view: this.view,\n selected: false,\n extension: this.extensionWithSyncedStorage,\n HTMLAttributes: this.HTMLAttributes,\n getPos: () => this.getPos(),\n updateAttributes: (attributes = {}) => this.updateAttributes(attributes),\n deleteNode: () => this.deleteNode(),\n } satisfies NodeViewProps\n\n const onDragStart = this.onDragStart.bind(this)\n\n this.decorationClasses = ref(this.getDecorationClasses())\n\n const extendedComponent = defineComponent({\n extends: { ...this.component },\n props: Object.keys(props),\n template: (this.component as any).template,\n setup: reactiveProps => {\n provide('onDragStart', onDragStart)\n provide('decorationClasses', this.decorationClasses)\n\n return (this.component as any).setup?.(reactiveProps, {\n expose: () => undefined,\n })\n },\n // add support for scoped styles\n // @ts-ignore\n // eslint-disable-next-line\n __scopeId: this.component.__scopeId,\n // add support for CSS Modules\n // @ts-ignore\n // eslint-disable-next-line\n __cssModules: this.component.__cssModules,\n // add support for vue devtools\n // @ts-ignore\n // eslint-disable-next-line\n __name: this.component.__name,\n // @ts-ignore\n // eslint-disable-next-line\n __file: this.component.__file,\n })\n\n this.handleSelectionUpdate = this.handleSelectionUpdate.bind(this)\n this.editor.on('selectionUpdate', this.handleSelectionUpdate)\n this.currentPos = this.getPos()\n\n this.positionCheckCallback = () => {\n // Guard against the callback firing before the renderer is fully initialized.\n if (!this.renderer) {\n return\n }\n\n const newPos = this.getPos()\n\n if (typeof newPos !== 'number' || newPos === this.currentPos) {\n return\n }\n\n this.currentPos = newPos\n\n // Pass a fresh getPos reference so Vue's reactivity detects a prop change.\n this.renderer.updateProps({ getPos: () => this.getPos() })\n }\n\n schedulePositionCheck(this.editor, this.positionCheckCallback)\n\n this.renderer = new VueRenderer(extendedComponent, {\n editor: this.editor,\n props,\n })\n }\n\n /**\n * Return the DOM element.\n * This is the element that will be used to display the node view.\n */\n get dom() {\n if (!this.renderer.element || !this.renderer.element.hasAttribute('data-node-view-wrapper')) {\n throw Error('Please use the NodeViewWrapper component for your node view.')\n }\n\n return this.renderer.element as HTMLElement\n }\n\n /**\n * Return the content DOM element.\n * This is the element that will be used to display the rich-text content of the node.\n */\n get contentDOM() {\n if (this.node.isLeaf) {\n return null\n }\n\n return this.dom.querySelector('[data-node-view-content]') as HTMLElement | null\n }\n\n /**\n * On editor selection update, check if the node is selected.\n * If it is, call `selectNode`, otherwise call `deselectNode`.\n */\n handleSelectionUpdate() {\n const pos = this.getPos()\n\n if (typeof pos !== 'number') {\n return\n }\n\n const isSelected = isNodeViewSelected({\n selection: this.editor.state.selection,\n pos,\n nodeSize: this.node.nodeSize,\n selectedOnTextSelection: this.options.selectedOnTextSelection,\n })\n\n if (isSelected) {\n if (this.renderer.props.selected) {\n return\n }\n\n this.selectNode()\n } else {\n if (!this.renderer.props.selected) {\n return\n }\n\n this.deselectNode()\n }\n }\n\n /**\n * On update, update the React component.\n * To prevent unnecessary updates, the `update` option can be used.\n */\n update(node: ProseMirrorNode, decorations: readonly Decoration[], innerDecorations: DecorationSource): boolean {\n const rerenderComponent = (props?: Record<string, any>) => {\n this.decorationClasses.value = this.getDecorationClasses()\n this.renderer.updateProps(props)\n }\n\n if (typeof this.options.update === 'function') {\n const oldNode = this.node\n const oldDecorations = this.decorations\n const oldInnerDecorations = this.innerDecorations\n\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n this.currentPos = this.getPos()\n\n return this.options.update({\n oldNode,\n oldDecorations,\n newNode: node,\n newDecorations: decorations,\n oldInnerDecorations,\n innerDecorations,\n updateProps: () =>\n rerenderComponent({ node, decorations, innerDecorations, extension: this.extensionWithSyncedStorage }),\n })\n }\n\n if (node.type !== this.node.type) {\n return false\n }\n\n const newPos = this.getPos()\n\n if (node === this.node && this.decorations === decorations && this.innerDecorations === innerDecorations) {\n if (newPos === this.currentPos) {\n return true\n }\n\n // Position changed without a content/decoration change — trigger re-render\n // so the component receives an up-to-date value from getPos().\n // Pass a fresh getPos reference so Vue's reactivity detects a prop change.\n this.currentPos = newPos\n rerenderComponent({\n node,\n decorations,\n innerDecorations,\n extension: this.extensionWithSyncedStorage,\n getPos: () => this.getPos(),\n })\n return true\n }\n\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n this.currentPos = newPos\n\n rerenderComponent({ node, decorations, innerDecorations, extension: this.extensionWithSyncedStorage })\n\n return true\n }\n\n /**\n * Select the node.\n * Add the `selected` prop and the `ProseMirror-selectednode` class.\n */\n selectNode() {\n this.renderer.updateProps({\n selected: true,\n })\n if (this.renderer.element) {\n this.renderer.element.classList.add('ProseMirror-selectednode')\n }\n }\n\n /**\n * Deselect the node.\n * Remove the `selected` prop and the `ProseMirror-selectednode` class.\n */\n deselectNode() {\n this.renderer.updateProps({\n selected: false,\n })\n if (this.renderer.element) {\n this.renderer.element.classList.remove('ProseMirror-selectednode')\n }\n }\n\n getDecorationClasses() {\n return (\n this.decorations\n // @ts-ignore\n .flatMap(item => item.type.attrs.class)\n .join(' ')\n )\n }\n\n destroy() {\n this.renderer.destroy()\n this.editor.off('selectionUpdate', this.handleSelectionUpdate)\n\n if (this.positionCheckCallback) {\n cancelPositionCheck(this.editor, this.positionCheckCallback)\n this.positionCheckCallback = null\n }\n }\n}\n\nexport function VueNodeViewRenderer(\n component: Component<NodeViewProps>,\n options?: Partial<VueNodeViewRendererOptions>,\n): NodeViewRenderer {\n return props => {\n // try to get the parent component\n // this is important for vue devtools to show the component hierarchy correctly\n // maybe it’s `undefined` because <editor-content> isn’t rendered yet\n if (!(props.editor as Editor).contentComponent) {\n return {} as unknown as ProseMirrorNodeView\n }\n // check for class-component and normalize if neccessary\n const normalizedComponent =\n typeof component === 'function' && '__vccOpts' in component ? (component.__vccOpts as Component) : component\n\n return new VueNodeView(normalizedComponent, props, options)\n }\n}\n","export { Editor } from './Editor.js'\nexport * from './EditorContent.js'\nexport * from './NodeViewContent.js'\nexport * from './NodeViewWrapper.js'\nexport * from './useEditor.js'\nexport * from './VueMarkViewRenderer.js'\nexport * from './VueNodeViewRenderer.js'\nexport * from './VueRenderer.js'\nexport * from '@tiptap/core'\n"],"mappings":"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","names":["defineComponent","h","defineComponent","h","onBeforeUnmount","onBeforeUnmount","defineComponent","h","h","markRaw","defineComponent","h","defineComponent","ref","ref","defineComponent"]}
|
|
1
|
+
{"version":3,"sources":["../src/Editor.ts","../src/EditorContent.ts","../src/NodeViewContent.ts","../src/NodeViewWrapper.ts","../src/useEditor.ts","../src/VueMarkViewRenderer.ts","../src/VueRenderer.ts","../src/VueNodeViewRenderer.ts","../src/index.ts"],"sourcesContent":["/* eslint-disable react-hooks/rules-of-hooks */\nimport type { EditorOptions, Storage } from '@tiptap/core'\nimport { Editor as CoreEditor } from '@tiptap/core'\nimport type { EditorState, Plugin, PluginKey } from '@tiptap/pm/state'\nimport type { AppContext, ComponentInternalInstance, ComponentPublicInstance, Ref } from 'vue'\nimport { customRef, markRaw } from 'vue'\n\nfunction useDebouncedRef<T>(value: T) {\n return customRef<T>((track, trigger) => {\n return {\n get() {\n track()\n return value\n },\n set(newValue) {\n // update state\n value = newValue\n\n // update view as soon as possible\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n trigger()\n })\n })\n },\n }\n })\n}\n\nexport type ContentComponent = ComponentInternalInstance & {\n ctx: ComponentPublicInstance\n}\n\nexport class Editor extends CoreEditor {\n private reactiveState: Ref<EditorState>\n\n private reactiveExtensionStorage: Ref<Storage>\n\n public contentComponent: ContentComponent | null = null\n\n public appContext: AppContext | null = null\n\n constructor(options: Partial<EditorOptions> = {}) {\n super(options)\n\n this.reactiveState = useDebouncedRef(this.view.state)\n this.reactiveExtensionStorage = useDebouncedRef(this.extensionStorage)\n\n this.on('beforeTransaction', ({ nextState }) => {\n this.reactiveState.value = nextState\n this.reactiveExtensionStorage.value = this.extensionStorage\n })\n\n return markRaw(this) // eslint-disable-line\n }\n\n get state() {\n return this.reactiveState ? this.reactiveState.value : this.view.state\n }\n\n get storage() {\n return this.reactiveExtensionStorage ? this.reactiveExtensionStorage.value : super.storage\n }\n\n /**\n * Register a ProseMirror plugin.\n */\n public registerPlugin(\n plugin: Plugin,\n handlePlugins?: (newPlugin: Plugin, plugins: Plugin[]) => Plugin[],\n ): EditorState {\n const nextState = super.registerPlugin(plugin, handlePlugins)\n\n if (this.reactiveState) {\n this.reactiveState.value = nextState\n }\n\n return nextState\n }\n\n /**\n * Unregister a ProseMirror plugin.\n */\n public unregisterPlugin(nameOrPluginKey: string | PluginKey): EditorState | undefined {\n const nextState = super.unregisterPlugin(nameOrPluginKey)\n\n if (this.reactiveState && nextState) {\n this.reactiveState.value = nextState\n }\n\n return nextState\n }\n}\n","import type { PropType, Ref } from 'vue'\nimport { defineComponent, getCurrentInstance, h, nextTick, onBeforeUnmount, ref, unref, watchEffect } from 'vue'\n\nimport type { Editor } from './Editor.js'\n\nexport const EditorContent = defineComponent({\n name: 'EditorContent',\n\n props: {\n editor: {\n default: null,\n type: Object as PropType<Editor>,\n },\n },\n\n setup(props) {\n const rootEl: Ref<Element | undefined> = ref()\n const instance = getCurrentInstance()\n\n watchEffect(() => {\n const editor = props.editor\n\n if (editor && editor.options.element && rootEl.value) {\n nextTick(() => {\n if (!rootEl.value || !editor.view.dom?.parentNode) {\n return\n }\n\n // TODO using the new editor.mount method might allow us to remove this\n const element = unref(rootEl.value)\n\n rootEl.value.append(...editor.view.dom.parentNode.childNodes)\n\n // @ts-ignore\n editor.contentComponent = instance.ctx._\n\n if (instance) {\n editor.appContext = {\n ...instance.appContext,\n // Vue internally uses prototype chain to forward/shadow injects across the entire component chain\n // so don't use object spread operator or 'Object.assign' and just set `provides` as is on editor's appContext\n // @ts-expect-error forward instance's 'provides' into appContext\n provides: instance.provides,\n }\n }\n\n editor.setOptions({\n element,\n })\n\n editor.createNodeViews()\n })\n }\n })\n\n onBeforeUnmount(() => {\n const editor = props.editor\n\n if (!editor) {\n return\n }\n\n editor.contentComponent = null\n editor.appContext = null\n })\n\n return { rootEl }\n },\n\n render() {\n return h('div', {\n ref: (el: any) => {\n this.rootEl = el\n },\n })\n },\n})\n","import { defineComponent, h } from 'vue'\n\nexport const NodeViewContent = defineComponent({\n name: 'NodeViewContent',\n\n props: {\n as: {\n type: String,\n default: 'div',\n },\n },\n\n render() {\n return h(this.as, {\n style: {\n whiteSpace: 'pre-wrap',\n },\n 'data-node-view-content': '',\n })\n },\n})\n","import { defineComponent, h } from 'vue'\n\nexport const NodeViewWrapper = defineComponent({\n name: 'NodeViewWrapper',\n\n props: {\n as: {\n type: String,\n default: 'div',\n },\n },\n\n inject: ['onDragStart', 'decorationClasses'],\n\n render() {\n return h(\n this.as,\n {\n // @ts-ignore\n class: this.decorationClasses,\n style: {\n whiteSpace: 'normal',\n },\n 'data-node-view-wrapper': '',\n // @ts-ignore (https://github.com/vuejs/vue-next/issues/3031)\n onDragstart: this.onDragStart,\n },\n this.$slots.default?.(),\n )\n },\n})\n","import type { EditorOptions } from '@tiptap/core'\nimport { onBeforeUnmount, onMounted, shallowRef } from 'vue'\n\nimport { Editor } from './Editor.js'\n\nexport const useEditor = (options: Partial<EditorOptions> = {}) => {\n const editor = shallowRef<Editor>()\n\n onMounted(() => {\n editor.value = new Editor(options)\n })\n\n onBeforeUnmount(() => {\n editor.value?.destroy()\n })\n\n return editor\n}\n","/* eslint-disable no-underscore-dangle */\nimport type { MarkViewProps, MarkViewRenderer, MarkViewRendererOptions } from '@tiptap/core'\nimport { MarkView } from '@tiptap/core'\nimport type { Component, PropType } from 'vue'\nimport { defineComponent, h, toRaw } from 'vue'\n\nimport type { Editor } from './Editor.js'\nimport { VueRenderer } from './VueRenderer.js'\n\nexport interface VueMarkViewRendererOptions extends MarkViewRendererOptions {\n as?: string\n className?: string\n attrs?: { [key: string]: string }\n}\n\nexport const markViewProps = {\n editor: {\n type: Object as PropType<MarkViewProps['editor']>,\n required: true as const,\n },\n mark: {\n type: Object as PropType<MarkViewProps['mark']>,\n required: true as const,\n },\n extension: {\n type: Object as PropType<MarkViewProps['extension']>,\n required: true as const,\n },\n inline: {\n type: Boolean as PropType<MarkViewProps['inline']>,\n required: true as const,\n },\n view: {\n type: Object as PropType<MarkViewProps['view']>,\n required: true as const,\n },\n updateAttributes: {\n type: Function as PropType<MarkViewProps['updateAttributes']>,\n required: true as const,\n },\n HTMLAttributes: {\n type: Object as PropType<MarkViewProps['HTMLAttributes']>,\n required: true as const,\n },\n}\n\nexport const MarkViewContent = defineComponent({\n name: 'MarkViewContent',\n\n props: {\n as: {\n type: String,\n default: 'span',\n },\n },\n\n render() {\n return h(this.as, {\n style: {\n whiteSpace: 'inherit',\n },\n 'data-mark-view-content': '',\n })\n },\n})\n\nexport class VueMarkView extends MarkView<Component, VueMarkViewRendererOptions> {\n renderer: VueRenderer\n\n constructor(component: Component, props: MarkViewProps, options?: Partial<VueMarkViewRendererOptions>) {\n super(component, props, options)\n\n const componentProps = { ...props, updateAttributes: this.updateAttributes.bind(this) } satisfies MarkViewProps\n\n // Create extended component with provide\n const extendedComponent = defineComponent({\n extends: { ...component },\n props: Object.keys(componentProps),\n template: (this.component as any).template,\n setup: reactiveProps => {\n return (component as any).setup?.(reactiveProps, {\n expose: () => undefined,\n })\n },\n // Add support for scoped styles\n __scopeId: (component as any).__scopeId,\n __cssModules: (component as any).__cssModules,\n __name: (component as any).__name,\n __file: (component as any).__file,\n })\n this.renderer = new VueRenderer(extendedComponent, {\n editor: this.editor,\n props: componentProps,\n })\n }\n\n get dom() {\n return this.renderer.element as HTMLElement\n }\n\n get contentDOM() {\n return this.dom.querySelector('[data-mark-view-content]') as HTMLElement | null\n }\n\n updateAttributes(attrs: Record<string, any>): void {\n // since this.mark is now an proxy, we need to get the actual mark from it\n const unproxiedMark = toRaw(this.mark)\n super.updateAttributes(attrs, unproxiedMark)\n }\n\n destroy() {\n this.renderer.destroy()\n }\n}\n\nexport function VueMarkViewRenderer(\n component: Component,\n options: Partial<VueMarkViewRendererOptions> = {},\n): MarkViewRenderer {\n return props => {\n // try to get the parent component\n // this is important for vue devtools to show the component hierarchy correctly\n // maybe it’s `undefined` because <editor-content> isn’t rendered yet\n if (!(props.editor as Editor).contentComponent) {\n return {} as unknown as MarkView<any, any>\n }\n\n return new VueMarkView(component, props, options)\n }\n}\n","import type { Editor } from '@tiptap/core'\nimport type { Component, DefineComponent } from 'vue'\nimport { h, markRaw, reactive, render } from 'vue'\n\nimport type { Editor as ExtendedEditor } from './Editor.js'\n\nexport interface VueRendererOptions {\n editor: Editor\n props?: Record<string, any>\n}\n\ntype ExtendedVNode = ReturnType<typeof h> | null\n\ninterface RenderedComponent {\n vNode: ExtendedVNode\n destroy: () => void\n el: Element | null\n}\n\n/**\n * This class is used to render Vue components inside the editor.\n */\nexport class VueRenderer {\n renderedComponent!: RenderedComponent\n\n editor: ExtendedEditor\n\n component: Component\n\n el: Element | null\n\n props: Record<string, any>\n\n /**\n * Flag to track if the renderer has been destroyed, preventing queued or asynchronous renders from executing after teardown.\n */\n destroyed = false\n\n constructor(component: Component, { props = {}, editor }: VueRendererOptions) {\n this.editor = editor as ExtendedEditor\n this.component = markRaw(component)\n this.el = document.createElement('div')\n this.props = reactive(props)\n this.renderedComponent = this.renderComponent()\n }\n\n get element(): Element | null {\n return this.renderedComponent.el\n }\n\n get ref(): any {\n // Composition API\n if (this.renderedComponent.vNode?.component?.exposed) {\n return this.renderedComponent.vNode.component.exposed\n }\n // Option API\n return this.renderedComponent.vNode?.component?.proxy\n }\n\n renderComponent() {\n if (this.destroyed) {\n return this.renderedComponent\n }\n\n let vNode: ExtendedVNode = h(this.component as DefineComponent, this.props)\n\n if (this.editor.appContext) {\n vNode.appContext = this.editor.appContext\n }\n if (typeof document !== 'undefined' && this.el) {\n render(vNode, this.el)\n }\n\n const destroy = () => {\n if (this.el) {\n render(null, this.el)\n }\n this.el = null\n vNode = null\n }\n\n return { vNode, destroy, el: this.el ? this.el.firstElementChild : null }\n }\n\n updateProps(props: Record<string, any> = {}): void {\n if (this.destroyed) {\n return\n }\n\n Object.entries(props).forEach(([key, value]) => {\n this.props[key] = value\n })\n this.renderComponent()\n }\n\n destroy(): void {\n if (this.destroyed) {\n return\n }\n\n this.destroyed = true\n this.renderedComponent.destroy()\n }\n}\n","/* eslint-disable no-underscore-dangle */\nimport type {\n DecorationWithType,\n NodeViewProps,\n NodeViewRenderer,\n NodeViewRendererOptions,\n NodeViewRendererProps,\n} from '@tiptap/core'\nimport { isNodeViewSelected, NodeView } from '@tiptap/core'\nimport type { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { Decoration, DecorationSource, NodeView as ProseMirrorNodeView } from '@tiptap/pm/view'\nimport type { Component, PropType, Ref } from 'vue'\nimport { defineComponent, provide, ref } from 'vue'\n\nimport type { Editor } from './Editor.js'\nimport { VueRenderer } from './VueRenderer.js'\n\nexport const nodeViewProps = {\n editor: {\n type: Object as PropType<NodeViewProps['editor']>,\n required: true as const,\n },\n node: {\n type: Object as PropType<NodeViewProps['node']>,\n required: true as const,\n },\n decorations: {\n type: Object as PropType<NodeViewProps['decorations']>,\n required: true as const,\n },\n selected: {\n type: Boolean as PropType<NodeViewProps['selected']>,\n required: true as const,\n },\n extension: {\n type: Object as PropType<NodeViewProps['extension']>,\n required: true as const,\n },\n getPos: {\n type: Function as PropType<NodeViewProps['getPos']>,\n required: true as const,\n },\n updateAttributes: {\n type: Function as PropType<NodeViewProps['updateAttributes']>,\n required: true as const,\n },\n deleteNode: {\n type: Function as PropType<NodeViewProps['deleteNode']>,\n required: true as const,\n },\n view: {\n type: Object as PropType<NodeViewProps['view']>,\n required: true as const,\n },\n innerDecorations: {\n type: Object as PropType<NodeViewProps['innerDecorations']>,\n required: true as const,\n },\n HTMLAttributes: {\n type: Object as PropType<NodeViewProps['HTMLAttributes']>,\n required: true as const,\n },\n}\n\nexport interface VueNodeViewRendererOptions extends NodeViewRendererOptions {\n update:\n | ((props: {\n oldNode: ProseMirrorNode\n oldDecorations: readonly Decoration[]\n oldInnerDecorations: DecorationSource\n newNode: ProseMirrorNode\n newDecorations: readonly Decoration[]\n innerDecorations: DecorationSource\n updateProps: () => void\n }) => boolean)\n | null\n}\n\nclass VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions> {\n renderer!: VueRenderer\n\n decorationClasses!: Ref<string>\n\n private currentPos: number | undefined\n\n private cachedExtensionWithSyncedStorage: NodeViewProps['extension'] | null = null\n\n constructor(component: Component, props: NodeViewRendererProps, options?: Partial<VueNodeViewRendererOptions>) {\n super(component, props, options)\n\n if (this.options.trackNodeViewPosition) {\n this.editor.on('update', this.handlePositionUpdate)\n }\n }\n\n /**\n * Returns a proxy of the extension that redirects storage access to the editor's mutable storage.\n * This preserves the original prototype chain (instanceof checks, methods like configure/extend work).\n * Cached to avoid proxy creation on every update.\n */\n get extensionWithSyncedStorage(): NodeViewProps['extension'] {\n if (!this.cachedExtensionWithSyncedStorage) {\n const editor = this.editor\n const extension = this.extension\n\n this.cachedExtensionWithSyncedStorage = new Proxy(extension, {\n get(target, prop, receiver) {\n if (prop === 'storage') {\n return editor.storage[extension.name as keyof typeof editor.storage] ?? {}\n }\n return Reflect.get(target, prop, receiver)\n },\n })\n }\n\n return this.cachedExtensionWithSyncedStorage\n }\n\n mount() {\n const props: Record<string, any> = {\n editor: this.editor,\n node: this.node,\n decorations: this.decorations as DecorationWithType[],\n innerDecorations: this.innerDecorations,\n view: this.view,\n selected: false,\n extension: this.extensionWithSyncedStorage,\n HTMLAttributes: this.HTMLAttributes,\n getPos: () => this.getPos(),\n updateAttributes: (attributes = {}) => this.updateAttributes(attributes),\n deleteNode: () => this.deleteNode(),\n }\n\n const mountProps = props as NodeViewProps\n\n const onDragStart = this.onDragStart.bind(this)\n\n this.decorationClasses = ref(this.getDecorationClasses())\n\n const extendedComponent = defineComponent({\n extends: { ...this.component },\n props: Object.keys(props),\n template: (this.component as any).template,\n setup: reactiveProps => {\n provide('onDragStart', onDragStart)\n provide('decorationClasses', this.decorationClasses)\n\n return (this.component as any).setup?.(reactiveProps, {\n expose: () => undefined,\n })\n },\n // add support for scoped styles\n // @ts-ignore\n // eslint-disable-next-line\n __scopeId: this.component.__scopeId,\n // add support for CSS Modules\n // @ts-ignore\n // eslint-disable-next-line\n __cssModules: this.component.__cssModules,\n // add support for vue devtools\n // @ts-ignore\n // eslint-disable-next-line\n __name: this.component.__name,\n // @ts-ignore\n // eslint-disable-next-line\n __file: this.component.__file,\n })\n\n this.handleSelectionUpdate = this.handleSelectionUpdate.bind(this)\n this.editor.on('selectionUpdate', this.handleSelectionUpdate)\n\n this.currentPos = this.getPos()\n\n this.renderer = new VueRenderer(extendedComponent, {\n editor: this.editor,\n props: mountProps,\n })\n }\n\n /**\n * Fires on editor updates when trackNodeViewPosition is enabled.\n * Detects position shifts where update() is NOT called.\n */\n private handlePositionUpdate = () => {\n const newPos = this.getPos()\n if (typeof newPos !== 'number' || newPos === this.currentPos) {\n return\n }\n this.currentPos = newPos\n this.renderer.updateProps({ getPos: () => this.getPos() })\n }\n\n /**\n * Return the DOM element.\n * This is the element that will be used to display the node view.\n */\n get dom() {\n if (!this.renderer.element || !this.renderer.element.hasAttribute('data-node-view-wrapper')) {\n throw Error('Please use the NodeViewWrapper component for your node view.')\n }\n\n return this.renderer.element as HTMLElement\n }\n\n /**\n * Return the content DOM element.\n * This is the element that will be used to display the rich-text content of the node.\n */\n get contentDOM() {\n if (this.node.isLeaf) {\n return null\n }\n\n return this.dom.querySelector('[data-node-view-content]') as HTMLElement | null\n }\n\n /**\n * On editor selection update, check if the node is selected.\n * If it is, call `selectNode`, otherwise call `deselectNode`.\n */\n handleSelectionUpdate() {\n const pos = this.getPos()\n\n if (typeof pos !== 'number') {\n return\n }\n\n const isSelected = isNodeViewSelected({\n selection: this.editor.state.selection,\n pos,\n nodeSize: this.node.nodeSize,\n selectedOnTextSelection: this.options.selectedOnTextSelection,\n })\n\n if (isSelected) {\n if (this.renderer.props.selected) {\n return\n }\n\n this.selectNode()\n } else {\n if (!this.renderer.props.selected) {\n return\n }\n\n this.deselectNode()\n }\n }\n\n /**\n * On update, update the React component.\n * To prevent unnecessary updates, the `update` option can be used.\n */\n update(node: ProseMirrorNode, decorations: readonly Decoration[], innerDecorations: DecorationSource): boolean {\n const rerenderComponent = (props?: Record<string, any>) => {\n this.decorationClasses.value = this.getDecorationClasses()\n this.renderer.updateProps(props)\n }\n\n if (typeof this.options.update === 'function') {\n const oldNode = this.node\n const oldDecorations = this.decorations\n const oldInnerDecorations = this.innerDecorations\n\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n\n return this.options.update({\n oldNode,\n oldDecorations,\n newNode: node,\n newDecorations: decorations,\n oldInnerDecorations,\n innerDecorations,\n updateProps: () =>\n rerenderComponent({ node, decorations, innerDecorations, extension: this.extensionWithSyncedStorage }),\n })\n }\n\n if (node.type !== this.node.type) {\n return false\n }\n\n const nodeChanged = node !== this.node\n\n // Node reference unchanged — only decorations may have changed.\n // ProseMirror renders decorations independently on the contentDOM,\n // and the getPos closure (bound in mount()) calls through to\n // ProseMirror's position function at call time, so it is always\n // current. Update internal refs, refresh decoration classes for\n // the wrapper component, and skip the Vue re-render.\n if (!nodeChanged) {\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n this.decorationClasses.value = this.getDecorationClasses()\n return true\n }\n\n this.node = node\n this.decorations = decorations\n this.innerDecorations = innerDecorations\n this.currentPos = this.getPos()\n\n const extraProps: Record<string, any> = {\n node,\n decorations,\n innerDecorations,\n extension: this.extensionWithSyncedStorage,\n }\n\n if (this.options.trackNodeViewPosition) {\n extraProps.getPos = () => this.getPos()\n }\n\n rerenderComponent(extraProps)\n return true\n }\n\n /**\n * Select the node.\n * Add the `selected` prop and the `ProseMirror-selectednode` class.\n */\n selectNode() {\n this.renderer.updateProps({\n selected: true,\n })\n if (this.renderer.element) {\n this.renderer.element.classList.add('ProseMirror-selectednode')\n }\n }\n\n /**\n * Deselect the node.\n * Remove the `selected` prop and the `ProseMirror-selectednode` class.\n */\n deselectNode() {\n this.renderer.updateProps({\n selected: false,\n })\n if (this.renderer.element) {\n this.renderer.element.classList.remove('ProseMirror-selectednode')\n }\n }\n\n getDecorationClasses() {\n return (\n this.decorations\n // @ts-ignore\n .flatMap(item => item.type.attrs.class)\n .join(' ')\n )\n }\n\n destroy() {\n this.renderer.destroy()\n this.editor.off('selectionUpdate', this.handleSelectionUpdate)\n\n if (this.options.trackNodeViewPosition) {\n this.editor.off('update', this.handlePositionUpdate)\n }\n }\n}\n\nexport function VueNodeViewRenderer(\n component: Component<NodeViewProps>,\n options?: Partial<VueNodeViewRendererOptions>,\n): NodeViewRenderer {\n return props => {\n // try to get the parent component\n // this is important for vue devtools to show the component hierarchy correctly\n // maybe it’s `undefined` because <editor-content> isn’t rendered yet\n if (!(props.editor as Editor).contentComponent) {\n return {} as unknown as ProseMirrorNodeView\n }\n // check for class-component and normalize if neccessary\n const normalizedComponent =\n typeof component === 'function' && '__vccOpts' in component ? (component.__vccOpts as Component) : component\n\n return new VueNodeView(normalizedComponent, props, options)\n }\n}\n","export { Editor } from './Editor.js'\nexport * from './EditorContent.js'\nexport * from './NodeViewContent.js'\nexport * from './NodeViewWrapper.js'\nexport * from './useEditor.js'\nexport * from './VueMarkViewRenderer.js'\nexport * from './VueNodeViewRenderer.js'\nexport * from './VueRenderer.js'\nexport * from '@tiptap/core'\n"],"mappings":"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","names":["defineComponent","h","defineComponent","h","onBeforeUnmount","onBeforeUnmount","defineComponent","h","h","markRaw","defineComponent","h","defineComponent","ref","ref","defineComponent"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tiptap/vue-3",
|
|
3
3
|
"description": "Vue components for tiptap",
|
|
4
|
-
"version": "3.23.
|
|
4
|
+
"version": "3.23.5",
|
|
5
5
|
"homepage": "https://tiptap.dev",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"tiptap",
|
|
@@ -40,18 +40,18 @@
|
|
|
40
40
|
],
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"vue": "^3.5.13",
|
|
43
|
-
"@tiptap/core": "^3.23.
|
|
44
|
-
"@tiptap/pm": "^3.23.
|
|
43
|
+
"@tiptap/core": "^3.23.5",
|
|
44
|
+
"@tiptap/pm": "^3.23.5"
|
|
45
45
|
},
|
|
46
46
|
"optionalDependencies": {
|
|
47
|
-
"@tiptap/extension-bubble-menu": "^3.23.
|
|
48
|
-
"@tiptap/extension-floating-menu": "^3.23.
|
|
47
|
+
"@tiptap/extension-bubble-menu": "^3.23.5",
|
|
48
|
+
"@tiptap/extension-floating-menu": "^3.23.5"
|
|
49
49
|
},
|
|
50
50
|
"peerDependencies": {
|
|
51
51
|
"vue": "^3.0.0",
|
|
52
52
|
"@floating-ui/dom": "^1.0.0",
|
|
53
|
-
"@tiptap/core": "3.23.
|
|
54
|
-
"@tiptap/pm": "3.23.
|
|
53
|
+
"@tiptap/core": "3.23.5",
|
|
54
|
+
"@tiptap/pm": "3.23.5"
|
|
55
55
|
},
|
|
56
56
|
"repository": {
|
|
57
57
|
"type": "git",
|
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
/* eslint-disable no-underscore-dangle */
|
|
2
|
-
import type {
|
|
3
|
-
|
|
2
|
+
import type {
|
|
3
|
+
DecorationWithType,
|
|
4
|
+
NodeViewProps,
|
|
5
|
+
NodeViewRenderer,
|
|
6
|
+
NodeViewRendererOptions,
|
|
7
|
+
NodeViewRendererProps,
|
|
8
|
+
} from '@tiptap/core'
|
|
9
|
+
import { isNodeViewSelected, NodeView } from '@tiptap/core'
|
|
4
10
|
import type { Node as ProseMirrorNode } from '@tiptap/pm/model'
|
|
5
11
|
import type { Decoration, DecorationSource, NodeView as ProseMirrorNodeView } from '@tiptap/pm/view'
|
|
6
12
|
import type { Component, PropType, Ref } from 'vue'
|
|
@@ -75,20 +81,18 @@ class VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions
|
|
|
75
81
|
|
|
76
82
|
decorationClasses!: Ref<string>
|
|
77
83
|
|
|
78
|
-
/**
|
|
79
|
-
* The last known position of this node view, used to detect position-only
|
|
80
|
-
* changes that don't produce a new node object reference.
|
|
81
|
-
*/
|
|
82
84
|
private currentPos: number | undefined
|
|
83
85
|
|
|
84
|
-
/**
|
|
85
|
-
* Callback registered with the per-editor position-update registry.
|
|
86
|
-
* Stored so it can be unregistered in destroy().
|
|
87
|
-
*/
|
|
88
|
-
private positionCheckCallback: (() => void) | null = null
|
|
89
|
-
|
|
90
86
|
private cachedExtensionWithSyncedStorage: NodeViewProps['extension'] | null = null
|
|
91
87
|
|
|
88
|
+
constructor(component: Component, props: NodeViewRendererProps, options?: Partial<VueNodeViewRendererOptions>) {
|
|
89
|
+
super(component, props, options)
|
|
90
|
+
|
|
91
|
+
if (this.options.trackNodeViewPosition) {
|
|
92
|
+
this.editor.on('update', this.handlePositionUpdate)
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
|
|
92
96
|
/**
|
|
93
97
|
* Returns a proxy of the extension that redirects storage access to the editor's mutable storage.
|
|
94
98
|
* This preserves the original prototype chain (instanceof checks, methods like configure/extend work).
|
|
@@ -113,7 +117,7 @@ class VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions
|
|
|
113
117
|
}
|
|
114
118
|
|
|
115
119
|
mount() {
|
|
116
|
-
const props = {
|
|
120
|
+
const props: Record<string, any> = {
|
|
117
121
|
editor: this.editor,
|
|
118
122
|
node: this.node,
|
|
119
123
|
decorations: this.decorations as DecorationWithType[],
|
|
@@ -125,7 +129,9 @@ class VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions
|
|
|
125
129
|
getPos: () => this.getPos(),
|
|
126
130
|
updateAttributes: (attributes = {}) => this.updateAttributes(attributes),
|
|
127
131
|
deleteNode: () => this.deleteNode(),
|
|
128
|
-
}
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
const mountProps = props as NodeViewProps
|
|
129
135
|
|
|
130
136
|
const onDragStart = this.onDragStart.bind(this)
|
|
131
137
|
|
|
@@ -162,34 +168,28 @@ class VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions
|
|
|
162
168
|
|
|
163
169
|
this.handleSelectionUpdate = this.handleSelectionUpdate.bind(this)
|
|
164
170
|
this.editor.on('selectionUpdate', this.handleSelectionUpdate)
|
|
165
|
-
this.currentPos = this.getPos()
|
|
166
171
|
|
|
167
|
-
this.
|
|
168
|
-
// Guard against the callback firing before the renderer is fully initialized.
|
|
169
|
-
if (!this.renderer) {
|
|
170
|
-
return
|
|
171
|
-
}
|
|
172
|
-
|
|
173
|
-
const newPos = this.getPos()
|
|
174
|
-
|
|
175
|
-
if (typeof newPos !== 'number' || newPos === this.currentPos) {
|
|
176
|
-
return
|
|
177
|
-
}
|
|
178
|
-
|
|
179
|
-
this.currentPos = newPos
|
|
180
|
-
|
|
181
|
-
// Pass a fresh getPos reference so Vue's reactivity detects a prop change.
|
|
182
|
-
this.renderer.updateProps({ getPos: () => this.getPos() })
|
|
183
|
-
}
|
|
184
|
-
|
|
185
|
-
schedulePositionCheck(this.editor, this.positionCheckCallback)
|
|
172
|
+
this.currentPos = this.getPos()
|
|
186
173
|
|
|
187
174
|
this.renderer = new VueRenderer(extendedComponent, {
|
|
188
175
|
editor: this.editor,
|
|
189
|
-
props,
|
|
176
|
+
props: mountProps,
|
|
190
177
|
})
|
|
191
178
|
}
|
|
192
179
|
|
|
180
|
+
/**
|
|
181
|
+
* Fires on editor updates when trackNodeViewPosition is enabled.
|
|
182
|
+
* Detects position shifts where update() is NOT called.
|
|
183
|
+
*/
|
|
184
|
+
private handlePositionUpdate = () => {
|
|
185
|
+
const newPos = this.getPos()
|
|
186
|
+
if (typeof newPos !== 'number' || newPos === this.currentPos) {
|
|
187
|
+
return
|
|
188
|
+
}
|
|
189
|
+
this.currentPos = newPos
|
|
190
|
+
this.renderer.updateProps({ getPos: () => this.getPos() })
|
|
191
|
+
}
|
|
192
|
+
|
|
193
193
|
/**
|
|
194
194
|
* Return the DOM element.
|
|
195
195
|
* This is the element that will be used to display the node view.
|
|
@@ -265,7 +265,6 @@ class VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions
|
|
|
265
265
|
this.node = node
|
|
266
266
|
this.decorations = decorations
|
|
267
267
|
this.innerDecorations = innerDecorations
|
|
268
|
-
this.currentPos = this.getPos()
|
|
269
268
|
|
|
270
269
|
return this.options.update({
|
|
271
270
|
oldNode,
|
|
@@ -283,34 +282,39 @@ class VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions
|
|
|
283
282
|
return false
|
|
284
283
|
}
|
|
285
284
|
|
|
286
|
-
const
|
|
287
|
-
|
|
288
|
-
if (node === this.node && this.decorations === decorations && this.innerDecorations === innerDecorations) {
|
|
289
|
-
if (newPos === this.currentPos) {
|
|
290
|
-
return true
|
|
291
|
-
}
|
|
285
|
+
const nodeChanged = node !== this.node
|
|
292
286
|
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
287
|
+
// Node reference unchanged — only decorations may have changed.
|
|
288
|
+
// ProseMirror renders decorations independently on the contentDOM,
|
|
289
|
+
// and the getPos closure (bound in mount()) calls through to
|
|
290
|
+
// ProseMirror's position function at call time, so it is always
|
|
291
|
+
// current. Update internal refs, refresh decoration classes for
|
|
292
|
+
// the wrapper component, and skip the Vue re-render.
|
|
293
|
+
if (!nodeChanged) {
|
|
294
|
+
this.node = node
|
|
295
|
+
this.decorations = decorations
|
|
296
|
+
this.innerDecorations = innerDecorations
|
|
297
|
+
this.decorationClasses.value = this.getDecorationClasses()
|
|
304
298
|
return true
|
|
305
299
|
}
|
|
306
300
|
|
|
307
301
|
this.node = node
|
|
308
302
|
this.decorations = decorations
|
|
309
303
|
this.innerDecorations = innerDecorations
|
|
310
|
-
this.currentPos =
|
|
304
|
+
this.currentPos = this.getPos()
|
|
311
305
|
|
|
312
|
-
|
|
306
|
+
const extraProps: Record<string, any> = {
|
|
307
|
+
node,
|
|
308
|
+
decorations,
|
|
309
|
+
innerDecorations,
|
|
310
|
+
extension: this.extensionWithSyncedStorage,
|
|
311
|
+
}
|
|
312
|
+
|
|
313
|
+
if (this.options.trackNodeViewPosition) {
|
|
314
|
+
extraProps.getPos = () => this.getPos()
|
|
315
|
+
}
|
|
313
316
|
|
|
317
|
+
rerenderComponent(extraProps)
|
|
314
318
|
return true
|
|
315
319
|
}
|
|
316
320
|
|
|
@@ -353,9 +357,8 @@ class VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions
|
|
|
353
357
|
this.renderer.destroy()
|
|
354
358
|
this.editor.off('selectionUpdate', this.handleSelectionUpdate)
|
|
355
359
|
|
|
356
|
-
if (this.
|
|
357
|
-
|
|
358
|
-
this.positionCheckCallback = null
|
|
360
|
+
if (this.options.trackNodeViewPosition) {
|
|
361
|
+
this.editor.off('update', this.handlePositionUpdate)
|
|
359
362
|
}
|
|
360
363
|
}
|
|
361
364
|
}
|