@tiptap/vue-3 - npm Package Compare versions

Comparing version 2.0.0-beta.46 to 2.0.0-beta.47

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log
 
+# [2.0.0-beta.47](https://github.com/ueberdosis/tiptap/compare/@tiptap/vue-3@2.0.0-beta.46...@tiptap/vue-3@2.0.0-beta.47) (2021-07-27)
+
+
+### Features
+
+* add ignoreMutation option to NodeViewRenderer, fix [#1538](https://github.com/ueberdosis/tiptap/issues/1538) ([651e691](https://github.com/ueberdosis/tiptap/commit/651e6911e3ea5407df6a48783ee16733e0a4f474))
+
+
+
+
+
 # [2.0.0-beta.46](https://github.com/ueberdosis/tiptap/compare/@tiptap/vue-3@2.0.0-beta.45...@tiptap/vue-3@2.0.0-beta.46) (2021-07-26)
@@ -8,0 +19,0 @@

dist/packages/vue-3/src/VueNodeViewRenderer.d.ts

@@ -1,2 +0,2 @@
-import { NodeViewRenderer } from '@tiptap/core';
+import { NodeViewRenderer, NodeViewRendererOptions } from '@tiptap/core';
 import { PropType, Component } from 'vue';
@@ -41,7 +41,11 @@ import { Decoration } from 'prosemirror-view';
 };
-interface VueNodeViewRendererOptions {
-    stopEvent: ((event: Event) => boolean) | null;
-    update: ((node: ProseMirrorNode, decorations: Decoration[]) => boolean) | null;
+export interface VueNodeViewRendererOptions extends NodeViewRendererOptions {
+    update: ((props: {
+        oldNode: ProseMirrorNode;
+        oldDecorations: Decoration[];
+        newNode: ProseMirrorNode;
+        newDecorations: Decoration[];
+        updateProps: () => void;
+    }) => boolean) | null;
 }
 export declare function VueNodeViewRenderer(component: Component, options?: Partial<VueNodeViewRendererOptions>): NodeViewRenderer;
-export {};

dist/tiptap-vue-3.cjs.js

@@ -316,4 +316,18 @@ 'use strict';
     update(node, decorations) {
+        const updateProps = (props) => {
+            this.decorationClasses.value = this.getDecorationClasses();
+            this.renderer.updateProps(props);
+        };
         if (typeof this.options.update === 'function') {
-            return this.options.update(node, decorations);
+            const oldNode = this.node;
+            const oldDecorations = this.decorations;
+            this.node = node;
+            this.decorations = decorations;
+            return this.options.update({
+                oldNode,
+                oldDecorations,
+                newNode: node,
+                newDecorations: decorations,
+                updateProps,
+            });
         }
@@ -328,4 +342,3 @@ if (node.type !== this.node.type) {
         this.decorations = decorations;
-        this.decorationClasses.value = this.getDecorationClasses();
-        this.renderer.updateProps({ node, decorations });
+        updateProps();
         return true;
@@ -332,0 +345,0 @@ }

dist/tiptap-vue-3.esm.js

@@ -313,4 +313,18 @@ import { Editor as Editor$1, NodeView } from '@tiptap/core';
     update(node, decorations) {
+        const updateProps = (props) => {
+            this.decorationClasses.value = this.getDecorationClasses();
+            this.renderer.updateProps(props);
+        };
         if (typeof this.options.update === 'function') {
-            return this.options.update(node, decorations);
+            const oldNode = this.node;
+            const oldDecorations = this.decorations;
+            this.node = node;
+            this.decorations = decorations;
+            return this.options.update({
+                oldNode,
+                oldDecorations,
+                newNode: node,
+                newDecorations: decorations,
+                updateProps,
+            });
         }
@@ -325,4 +339,3 @@ if (node.type !== this.node.type) {
         this.decorations = decorations;
-        this.decorationClasses.value = this.getDecorationClasses();
-        this.renderer.updateProps({ node, decorations });
+        updateProps();
         return true;
@@ -329,0 +342,0 @@ }

dist/tiptap-vue-3.umd.js

@@ -313,4 +313,18 @@ (function (global, factory) {
       update(node, decorations) {
+          const updateProps = (props) => {
+              this.decorationClasses.value = this.getDecorationClasses();
+              this.renderer.updateProps(props);
+          };
           if (typeof this.options.update === 'function') {
-              return this.options.update(node, decorations);
+              const oldNode = this.node;
+              const oldDecorations = this.decorations;
+              this.node = node;
+              this.decorations = decorations;
+              return this.options.update({
+                  oldNode,
+                  oldDecorations,
+                  newNode: node,
+                  newDecorations: decorations,
+                  updateProps,
+              });
           }
@@ -325,4 +339,3 @@ if (node.type !== this.node.type) {
           this.decorations = decorations;
-          this.decorationClasses.value = this.getDecorationClasses();
-          this.renderer.updateProps({ node, decorations });
+          updateProps();
           return true;
@@ -329,0 +342,0 @@ }

package.json

 {
   "name": "@tiptap/vue-3",
   "description": "Vue components for tiptap",
-  "version": "2.0.0-beta.46",
+  "version": "2.0.0-beta.47",
   "homepage": "https://tiptap.dev",
@@ -38,3 +38,3 @@ "keywords": [
   },
-  "gitHead": "345ea8cf8abba6422dabc6e548594fb8e2c30409"
+  "gitHead": "51fef7d49aad78310b20c174e425553a878ffbe6"
 }

src/VueNodeViewRenderer.ts

@@ -6,2 +6,3 @@ import {
   NodeViewRendererProps,
+  NodeViewRendererOptions,
 } from '@tiptap/core'
@@ -56,8 +57,13 @@ import {
 
-interface VueNodeViewRendererOptions {
-  stopEvent: ((event: Event) => boolean) | null,
-  update: ((node: ProseMirrorNode, decorations: Decoration[]) => boolean) | null,
+export interface VueNodeViewRendererOptions extends NodeViewRendererOptions {
+  update: ((props: {
+    oldNode: ProseMirrorNode,
+    oldDecorations: Decoration[],
+    newNode: ProseMirrorNode,
+    newDecorations: Decoration[],
+    updateProps: () => void,
+  }) => boolean) | null,
 }
 
-class VueNodeView extends NodeView<Component, Editor> {
+class VueNodeView extends NodeView<Component, Editor, VueNodeViewRendererOptions> {
 
@@ -120,4 +126,21 @@ renderer!: VueRenderer
   update(node: ProseMirrorNode, decorations: Decoration[]) {
+    const updateProps = (props?: Record<string, any>) => {
+      this.decorationClasses.value = this.getDecorationClasses()
+      this.renderer.updateProps(props)
+    }
+
     if (typeof this.options.update === 'function') {
-      return this.options.update(node, decorations)
+      const oldNode = this.node
+      const oldDecorations = this.decorations
+
+      this.node = node
+      this.decorations = decorations
+
+      return this.options.update({
+        oldNode,
+        oldDecorations,
+        newNode: node,
+        newDecorations: decorations,
+        updateProps,
+      })
     }
@@ -135,5 +158,5 @@
     this.decorations = decorations
-    this.decorationClasses.value = this.getDecorationClasses()
-    this.renderer.updateProps({ node, decorations })
 
+    updateProps()
+
     return true
@@ -140,0 +163,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

150575

increased by3.14%

Lines of code

1962

increased by3.26%

No dependency changes