@prosekit/vue 0.0.12 → 0.0.14

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

@@ -12,6 +12,7 @@ import { Extension } from '@prosekit/core';
 import { Keymap } from '@prosekit/core';
 import { Options } from 'tsup';
 import { PopoverOptions } from '@prosekit/lit/components/autocomplete-popover';
+import { ShallowRef } from 'vue';
 import { UserProjectConfigExport } from 'vitest/dist/config.js';
 
 declare const AutocompleteEmpty: (props: {
@@ -126,6 +127,10 @@ declare function useEditor<E extends Extension = any>(): Editor<E>;
 export { useEditor }
 export { useEditor as useEditor_alias_1 }
 
+declare function useEditorRef<E extends Extension = any>(): ShallowRef<Editor<E>>;
+export { useEditorRef }
+export { useEditorRef as useEditorRef_alias_1 }
+
 export declare function useExtension({ extension }: UseExtensionProps): void;
 
 declare interface UseExtensionProps<T extends Extension = Extension> {

package/dist/prosekit-vue.d.ts

@@ -2,3 +2,4 @@ export { ProseKit } from './_tsup-dts-rollup';
 export { ProseKitProps } from './_tsup-dts-rollup';
 export { useKeymap } from './_tsup-dts-rollup';
 export { useEditor } from './_tsup-dts-rollup';
+export { useEditorRef } from './_tsup-dts-rollup';

package/dist/prosekit-vue.js

@@ -35,7 +35,7 @@ import { computed } from "vue";
 
 // src/hooks/use-extension.ts
 import "@prosekit/core";
-import { effect } from "vue";
+import { onMounted, onUnmounted } from "vue";
 
 // src/hooks/use-editor.ts
 import "@prosekit/core";
@@ -46,7 +46,10 @@ function useEditor() {
 // src/hooks/use-extension.ts
 function useExtension({ extension }) {
   const editor = useEditor();
-  effect(() => editor.use(extension));
+  onMounted(() => {
+    const dispose = editor.use(extension);
+    onUnmounted(dispose);
+  });
 }
 
 // src/hooks/use-keymap.ts
@@ -54,8 +57,28 @@ function useKeymap({ keymap }) {
   const extension = computed(() => addKeymap(keymap));
   useExtension({ extension: extension.value });
 }
+
+// src/hooks/use-editor-ref.ts
+import { addEventHandler } from "@prosekit/core";
+import {
+  onMounted as onMounted2,
+  onUnmounted as onUnmounted2,
+  shallowRef,
+  triggerRef
+} from "vue";
+function useEditorRef() {
+  const editor = useEditor();
+  const editorRef = shallowRef(editor);
+  onMounted2(() => {
+    const forceUpdate = () => triggerRef(editorRef);
+    const dispose = editor.use(addEventHandler({ update: forceUpdate }));
+    onUnmounted2(dispose);
+  });
+  return editorRef;
+}
 export {
   ProseKit,
   useEditor,
+  useEditorRef,
   useKeymap
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@prosekit/vue",
   "type": "module",
-  "version": "0.0.12",
+  "version": "0.0.14",
   "private": false,
   "author": {
     "name": "ocavue",
@@ -80,8 +80,8 @@
     "dist"
   ],
   "dependencies": {
-    "@prosekit/core": "^0.0.9",
-    "@prosekit/lit": "^0.0.12"
+    "@prosekit/core": "^0.0.10",
+    "@prosekit/lit": "^0.0.13"
   },
   "peerDependencies": {
     "vue": ">= 3.0.0"
@@ -95,7 +95,7 @@
     "@prosekit/dev": "*",
     "tsup": "^7.2.0",
     "typescript": "^5.2.2",
-    "vitest": "^0.34.3",
+    "vitest": "^0.34.4",
     "vue": "^3.3.4"
   },
   "scripts": {

package/src/index.ts

@@ -1,3 +1,4 @@
 export { ProseKit, type ProseKitProps } from './components/prosekit'
 export { useKeymap } from './hooks/use-keymap'
 export { useEditor } from './hooks/use-editor'
+export { useEditorRef } from './hooks/use-editor-ref'