@prosekit/vue 0.4.4 → 0.4.6

package/dist/_tsup-dts-rollup.d.ts

@@ -1,4 +1,3 @@
-import type { Attrs } from '@prosekit/pm/model';
 import { AutocompleteEmptyEvents } from '@prosekit/web/autocomplete';
 import { AutocompleteEmptyProps as AutocompleteEmptyProps_2 } from '@prosekit/web/autocomplete';
 import { AutocompleteItemEvents } from '@prosekit/web/autocomplete';
@@ -7,7 +6,6 @@ import { AutocompleteListEvents } from '@prosekit/web/autocomplete';
 import { AutocompleteListProps as AutocompleteListProps_2 } from '@prosekit/web/autocomplete';
 import { AutocompletePopoverEvents } from '@prosekit/web/autocomplete';
 import { AutocompletePopoverProps as AutocompletePopoverProps_2 } from '@prosekit/web/autocomplete';
-import { BaseNodeViewOptions } from '@prosekit/core';
 import { BlockHandleAddEvents } from '@prosekit/web/block-handle';
 import { BlockHandleAddProps as BlockHandleAddProps_2 } from '@prosekit/web/block-handle';
 import { BlockHandleDraggableEvents } from '@prosekit/web/block-handle';
@@ -17,21 +15,22 @@ import { BlockHandlePopoverProps as BlockHandlePopoverProps_2 } from '@prosekit/
 import { ComponentOptionsMixin } from 'vue';
 import { ComponentProvideOptions } from 'vue';
 import { ComputedRef } from 'vue';
-import type { Decoration } from '@prosekit/pm/view';
-import type { DecorationSource } from '@prosekit/pm/view';
+import type { CoreMarkViewUserOptions } from '@prosemirror-adapter/core';
+import type { CoreNodeViewUserOptions } from '@prosemirror-adapter/core';
 import { config as default_alias_1 } from '@prosekit/dev/config-vitest';
 import { DefineComponent } from 'vue';
 import { DefineSetupFnComponent } from 'vue';
 import { Editor } from '@prosekit/core';
 import type { EditorState } from '@prosekit/pm/state';
-import type { EditorView } from '@prosekit/pm/view';
 import { EmitsOptions } from 'vue';
 import { Extension } from '@prosekit/core';
 import { HTMLAttributes } from 'vue';
 import { InlinePopoverEvents } from '@prosekit/web/inline-popover';
 import { InlinePopoverProps as InlinePopoverProps_2 } from '@prosekit/web/inline-popover';
 import { Keymap } from '@prosekit/core';
+import { MarkViewContext } from '@prosemirror-adapter/vue';
 import { MaybeRefOrGetter } from 'vue';
+import { NodeViewContext } from '@prosemirror-adapter/vue';
 import { Options } from 'tsup';
 import { PopoverContentEvents } from '@prosekit/web/popover';
 import { PopoverContentProps as PopoverContentProps_2 } from '@prosekit/web/popover';
@@ -67,7 +66,6 @@ import { TooltipRootEvents } from '@prosekit/web/tooltip';
 import { TooltipRootProps as TooltipRootProps_2 } from '@prosekit/web/tooltip';
 import { TooltipTriggerEvents } from '@prosekit/web/tooltip';
 import { TooltipTriggerProps as TooltipTriggerProps_2 } from '@prosekit/web/tooltip';
-import { VNodeRef } from 'vue';
 
 declare const AutocompleteEmpty: DefineSetupFnComponent<AutocompleteEmptyProps & HTMLAttributes, AutocompleteEmptyEmits>;
 export { AutocompleteEmpty }
@@ -223,6 +221,15 @@ export declare const default_alias: Options | Options[] | ((overrideOptions: Opt
 
 export { default_alias_1 }
 
+/**
+ * Defines a mark view using a Vue component.
+ *
+ * @public
+ */
+declare function defineVueMarkView(options: VueMarkViewOptions): Extension;
+export { defineVueMarkView }
+export { defineVueMarkView as defineVueMarkView_alias_1 }
+
 /**
  * Defines a node view using a Vue component.
  *
@@ -661,6 +668,40 @@ declare function useStateUpdate(handler: (state: EditorState) => void, options?:
 export { useStateUpdate }
 export { useStateUpdate as useStateUpdate_alias_1 }
 
+/**
+ * @public
+ */
+declare type VueMarkViewComponent = DefineComponent<VueMarkViewProps, any, any>;
+export { VueMarkViewComponent }
+export { VueMarkViewComponent as VueMarkViewComponent_alias_1 }
+
+/**
+ * Options for {@link defineVueMarkView}.
+ *
+ * @public
+ */
+declare interface VueMarkViewOptions extends CoreMarkViewUserOptions<VueMarkViewComponent> {
+    /**
+     * The name of the mark type.
+     */
+    name: string;
+}
+export { VueMarkViewOptions }
+export { VueMarkViewOptions as VueMarkViewOptions_alias_1 }
+
+/**
+ * @public
+ */
+declare interface VueMarkViewProps extends MarkViewContext {
+}
+export { VueMarkViewProps }
+export { VueMarkViewProps as VueMarkViewProps_alias_1 }
+
+/**
+ * @internal
+ */
+export declare const VueMarkViewsConsumer: DefineComponent<{}, () => null, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
 /**
  * @public
  */
@@ -673,15 +714,11 @@ export { VueNodeViewComponent as VueNodeViewComponent_alias_1 }
  *
  * @public
  */
-declare interface VueNodeViewOptions extends BaseNodeViewOptions {
+declare interface VueNodeViewOptions extends CoreNodeViewUserOptions<VueNodeViewComponent> {
     /**
      * The name of the node type.
      */
     name: string;
-    /**
-     * The Vue component to render the node.
-     */
-    component: VueNodeViewComponent;
 }
 export { VueNodeViewOptions }
 export { VueNodeViewOptions as VueNodeViewOptions_alias_1 }
@@ -689,15 +726,7 @@ export { VueNodeViewOptions as VueNodeViewOptions_alias_1 }
 /**
  * @public
  */
-declare interface VueNodeViewProps {
-    contentRef: VNodeRef;
-    view: EditorView;
-    getPos: () => number | undefined;
-    setAttrs: (attrs: Attrs) => void;
-    node: ShallowRef<ProseMirrorNode>;
-    selected: ShallowRef<boolean>;
-    decorations: ShallowRef<readonly Decoration[]>;
-    innerDecorations: ShallowRef<DecorationSource>;
+declare interface VueNodeViewProps extends NodeViewContext {
 }
 export { VueNodeViewProps }
 export { VueNodeViewProps as VueNodeViewProps_alias_1 }
@@ -705,6 +734,6 @@ export { VueNodeViewProps as VueNodeViewProps_alias_1 }
 /**
  * @internal
  */
-export declare const VueViewsConsumer: DefineComponent<{}, () => null, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+export declare const VueNodeViewsConsumer: DefineComponent<{}, () => null, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 
 export { }

package/dist/{chunk-YWS6VK6K.js → chunk-BD3KKHO6.js}

@@ -1,5 +1,8 @@
 // src/injection/editor-context.ts
-import { inject, provide } from "vue";
+import {
+  inject,
+  provide
+} from "vue";
 var symbol = Symbol("prosekit-vue-editor-context");
 function provideEditor(editor) {
   provide(symbol, editor);

package/dist/{chunk-PDO4DKNH.js → chunk-VTKZWBOS.js}

@@ -1,6 +1,6 @@
 import {
   useEditorContext
-} from "./chunk-YWS6VK6K.js";
+} from "./chunk-BD3KKHO6.js";
 
 // src/components/create-component.ts
 import {

package/dist/prosekit-vue-autocomplete.js

@@ -1,7 +1,7 @@
 import {
   createComponent
-} from "./chunk-PDO4DKNH.js";
-import "./chunk-YWS6VK6K.js";
+} from "./chunk-VTKZWBOS.js";
+import "./chunk-BD3KKHO6.js";
 
 // src/components/autocomplete/autocomplete-empty.gen.ts
 import {

package/dist/prosekit-vue-block-handle.js

@@ -1,7 +1,7 @@
 import {
   createComponent
-} from "./chunk-PDO4DKNH.js";
-import "./chunk-YWS6VK6K.js";
+} from "./chunk-VTKZWBOS.js";
+import "./chunk-BD3KKHO6.js";
 
 // src/components/block-handle/block-handle-add.gen.ts
 import {

package/dist/prosekit-vue-inline-popover.js

@@ -1,7 +1,7 @@
 import {
   createComponent
-} from "./chunk-PDO4DKNH.js";
-import "./chunk-YWS6VK6K.js";
+} from "./chunk-VTKZWBOS.js";
+import "./chunk-BD3KKHO6.js";
 
 // src/components/inline-popover/inline-popover.gen.ts
 import {

package/dist/prosekit-vue-popover.js

@@ -1,7 +1,7 @@
 import {
   createComponent
-} from "./chunk-PDO4DKNH.js";
-import "./chunk-YWS6VK6K.js";
+} from "./chunk-VTKZWBOS.js";
+import "./chunk-BD3KKHO6.js";
 
 // src/components/popover/popover-content.gen.ts
 import {

package/dist/prosekit-vue-resizable.js

@@ -1,7 +1,7 @@
 import {
   createComponent
-} from "./chunk-PDO4DKNH.js";
-import "./chunk-YWS6VK6K.js";
+} from "./chunk-VTKZWBOS.js";
+import "./chunk-BD3KKHO6.js";
 
 // src/components/resizable/resizable-handle.gen.ts
 import {

package/dist/prosekit-vue-table-handle.js

@@ -1,7 +1,7 @@
 import {
   createComponent
-} from "./chunk-PDO4DKNH.js";
-import "./chunk-YWS6VK6K.js";
+} from "./chunk-VTKZWBOS.js";
+import "./chunk-BD3KKHO6.js";
 
 // src/components/table-handle/table-handle-column-root.gen.ts
 import {

package/dist/prosekit-vue-tooltip.js

@@ -1,7 +1,7 @@
 import {
   createComponent
-} from "./chunk-PDO4DKNH.js";
-import "./chunk-YWS6VK6K.js";
+} from "./chunk-VTKZWBOS.js";
+import "./chunk-BD3KKHO6.js";
 
 // src/components/tooltip/tooltip-content.gen.ts
 import {

package/dist/prosekit-vue.d.ts

@@ -1,5 +1,9 @@
 export { ProseKit } from './_tsup-dts-rollup.js';
 export { ProseKitProps } from './_tsup-dts-rollup.js';
+export { defineVueMarkView } from './_tsup-dts-rollup.js';
+export { VueMarkViewComponent } from './_tsup-dts-rollup.js';
+export { VueMarkViewOptions } from './_tsup-dts-rollup.js';
+export { VueMarkViewProps } from './_tsup-dts-rollup.js';
 export { defineVueNodeView } from './_tsup-dts-rollup.js';
 export { VueNodeViewComponent } from './_tsup-dts-rollup.js';
 export { VueNodeViewOptions } from './_tsup-dts-rollup.js';

package/dist/prosekit-vue.js

@@ -1,20 +1,23 @@
 import {
   provideEditor,
   useEditorContext
-} from "./chunk-YWS6VK6K.js";
+} from "./chunk-BD3KKHO6.js";
 
 // src/components/prosekit.ts
 import { ProsemirrorAdapterProvider } from "@prosemirror-adapter/vue";
-import { defineComponent as defineComponent2, h as h2 } from "vue";
+import {
+  defineComponent as defineComponent3,
+  h as h3
+} from "vue";
 
-// src/extensions/vue-node-view.ts
+// src/extensions/vue-mark-view.ts
 import {
-  defineNodeViewComponent,
-  defineNodeViewFactory
+  defineMarkViewComponent,
+  defineMarkViewFactory
 } from "@prosekit/core";
 import {
-  useNodeViewContext,
-  useNodeViewFactory
+  useMarkViewContext,
+  useMarkViewFactory
 } from "@prosemirror-adapter/vue";
 import {
   computed as computed2,
@@ -26,7 +29,10 @@ import {
 import {
   EditorNotFoundError
 } from "@prosekit/core";
-import { toValue, watchPostEffect } from "vue";
+import {
+  toValue,
+  watchPostEffect
+} from "vue";
 function useEditorExtension(editorRef, extensionRef) {
   const editorContext = useEditorContext();
   watchPostEffect((onCleanup) => {
@@ -42,8 +48,13 @@ function useEditorExtension(editorRef, extensionRef) {
 }
 
 // src/hooks/use-priority-extension.ts
-import { withPriority } from "@prosekit/core";
-import { computed, toValue as toValue2 } from "vue";
+import {
+  withPriority
+} from "@prosekit/core";
+import {
+  computed,
+  toValue as toValue2
+} from "vue";
 function usePriorityExtension(extension, priority) {
   return computed(() => {
     const ext = toValue2(extension);
@@ -59,21 +70,74 @@ function useExtension(extension, options) {
   );
 }
 
+// src/extensions/vue-mark-view.ts
+function withMarkViewProps(component) {
+  return defineComponent({
+    name: "MarkViewPropsWrapper",
+    setup: () => {
+      const props = useMarkViewContext();
+      return () => h(component, props);
+    }
+  });
+}
+var VueMarkViewsConsumer = /* @__PURE__ */ defineComponent({
+  name: "VueMarkViewsConsumer",
+  setup: () => {
+    const markViewFactory = useMarkViewFactory();
+    const extension = computed2(() => {
+      return defineVueMarkViewFactory(markViewFactory);
+    });
+    useExtension(extension);
+    return () => null;
+  }
+});
+function defineVueMarkView(options) {
+  const { name, component, ...userOptions } = options;
+  const args = {
+    ...userOptions,
+    component: withMarkViewProps(component)
+  };
+  return defineMarkViewComponent({
+    group: "vue",
+    name,
+    args
+  });
+}
+function defineVueMarkViewFactory(factory) {
+  return defineMarkViewFactory({
+    group: "vue",
+    factory
+  });
+}
+
 // src/extensions/vue-node-view.ts
+import {
+  defineNodeViewComponent,
+  defineNodeViewFactory
+} from "@prosekit/core";
+import {
+  useNodeViewContext,
+  useNodeViewFactory
+} from "@prosemirror-adapter/vue";
+import {
+  computed as computed3,
+  defineComponent as defineComponent2,
+  h as h2
+} from "vue";
 function withNodeViewProps(component) {
-  return defineComponent({
+  return defineComponent2({
     name: "NodeViewPropsWrapper",
     setup: () => {
       const props = useNodeViewContext();
-      return () => h(component, props);
+      return () => h2(component, props);
     }
   });
 }
-var VueViewsConsumer = /* @__PURE__ */ defineComponent({
-  name: "VueViewsConsumer",
+var VueNodeViewsConsumer = /* @__PURE__ */ defineComponent2({
+  name: "VueNodeViewsConsumer",
   setup: () => {
     const nodeViewFactory = useNodeViewFactory();
-    const extension = computed2(() => {
+    const extension = computed3(() => {
       return defineVueNodeViewFactory(nodeViewFactory);
     });
     useExtension(extension);
@@ -100,14 +164,15 @@ function defineVueNodeViewFactory(factory) {
 }
 
 // src/components/prosekit.ts
-var ProseKit = defineComponent2(
+var ProseKit = defineComponent3(
   (props, { slots }) => {
     provideEditor(props.editor);
     return () => {
-      return h2(ProsemirrorAdapterProvider, null, () => {
+      return h3(ProsemirrorAdapterProvider, null, () => {
         var _a;
         return [
-          h2(VueViewsConsumer),
+          h3(VueNodeViewsConsumer),
+          h3(VueMarkViewsConsumer),
           (_a = slots.default) == null ? void 0 : _a.call(slots)
         ];
       });
@@ -125,9 +190,9 @@ function useDocChange(handler, options) {
 
 // src/hooks/use-editor.ts
 import {
-  ProseKitError,
   defineMountHandler,
   defineUpdateHandler,
+  ProseKitError,
   union
 } from "@prosekit/core";
 import {
@@ -161,10 +226,15 @@ function useEditor(options) {
 }
 
 // src/hooks/use-keymap.ts
-import { defineKeymap } from "@prosekit/core";
-import { computed as computed3, toValue as toValue3 } from "vue";
+import {
+  defineKeymap
+} from "@prosekit/core";
+import {
+  computed as computed4,
+  toValue as toValue3
+} from "vue";
 function useKeymap(keymap, options) {
-  const extension = computed3(() => defineKeymap(toValue3(keymap)));
+  const extension = computed4(() => defineKeymap(toValue3(keymap)));
   return useExtension(extension, options);
 }
 
@@ -176,6 +246,7 @@ function useStateUpdate(handler, options) {
 }
 export {
   ProseKit,
+  defineVueMarkView,
   defineVueNodeView,
   useDocChange,
   useEditor,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@prosekit/vue",
   "type": "module",
-  "version": "0.4.4",
+  "version": "0.4.6",
   "private": false,
   "author": {
     "name": "ocavue",
@@ -70,10 +70,11 @@
     "dist"
   ],
   "dependencies": {
-    "@prosemirror-adapter/vue": "^0.2.6",
-    "@prosekit/core": "^0.7.12",
-    "@prosekit/web": "^0.5.0",
-    "@prosekit/pm": "^0.1.8"
+    "@prosemirror-adapter/core": "^0.4.0",
+    "@prosemirror-adapter/vue": "^0.4.0",
+    "@prosekit/core": "^0.7.13",
+    "@prosekit/web": "^0.5.1",
+    "@prosekit/pm": "^0.1.9"
   },
   "peerDependencies": {
     "vue": ">= 3.0.0"
@@ -86,9 +87,9 @@
   "devDependencies": {
     "@vue/test-utils": "^2.4.6",
     "tsup": "^8.3.5",
-    "typescript": "^5.6.3",
-    "vitest": "^2.1.4",
-    "vue": "^3.5.12",
+    "typescript": "~5.6.3",
+    "vitest": "^2.1.8",
+    "vue": "^3.5.13",
     "@prosekit/dev": "0.0.0"
   },
   "scripts": {