@prosekit/vue 0.4.3 → 0.4.4

package/dist/{chunk-742J24VD.js → chunk-PDO4DKNH.js}

@@ -7,7 +7,8 @@ import {
   defineComponent,
   h,
   onMounted,
-  ref
+  ref,
+  watchEffect
 } from "vue";
 function createComponent(tagName, displayName, propNames, eventNames) {
   const hasEditor = propNames.includes("editor");
@@ -18,6 +19,29 @@ function createComponent(tagName, displayName, propNames, eventNames) {
       onMounted(() => {
         mounted.value = true;
       });
+      const elementRef = ref(null);
+      watchEffect((onCleanup) => {
+        const element = elementRef.value;
+        if (!element) return;
+        const eventHandlers = {};
+        for (const eventName of eventNames) {
+          const extractDetail = eventName.endsWith("Change");
+          eventHandlers[eventName] = (event) => {
+            emit(
+              eventName,
+              extractDetail ? event.detail : event
+            );
+          };
+        }
+        for (const [eventName, handler] of Object.entries(eventHandlers)) {
+          element.addEventListener(eventName, handler);
+        }
+        onCleanup(() => {
+          for (const [eventName, handler] of Object.entries(eventHandlers)) {
+            element.removeEventListener(eventName, handler);
+          }
+        });
+      });
       return () => {
         var _a;
         const properties = {};
@@ -29,16 +53,8 @@ function createComponent(tagName, displayName, propNames, eventNames) {
         if (hasEditor && editor && !properties["editor"]) {
           properties.editor = editor;
         }
-        for (const eventName of eventNames) {
-          const extractDetail = eventName.endsWith("Change");
-          properties["on" + eventName[0].toUpperCase() + eventName.slice(1)] = (event) => {
-            emit(
-              eventName,
-              extractDetail ? event.detail : event
-            );
-          };
-        }
         properties.key = mounted.value ? 1 : 0;
+        properties.ref = elementRef;
         return h(tagName, properties, (_a = slots.default) == null ? void 0 : _a.call(slots));
       };
     },

package/dist/prosekit-vue-autocomplete.js

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

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

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

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

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

package/dist/prosekit-vue-popover.js

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

package/dist/prosekit-vue-resizable.js

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

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

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

package/dist/prosekit-vue-tooltip.js

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

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@prosekit/vue",
   "type": "module",
-  "version": "0.4.3",
+  "version": "0.4.4",
   "private": false,
   "author": {
     "name": "ocavue",
@@ -72,8 +72,8 @@
   "dependencies": {
     "@prosemirror-adapter/vue": "^0.2.6",
     "@prosekit/core": "^0.7.12",
-    "@prosekit/pm": "^0.1.8",
-    "@prosekit/web": "^0.4.3"
+    "@prosekit/web": "^0.5.0",
+    "@prosekit/pm": "^0.1.8"
   },
   "peerDependencies": {
     "vue": ">= 3.0.0"