Merge branch 'master' into master

README.md

@@ -419,7 +419,10 @@ export default class IframeNode extends Node {
       // `updateAttrs` is a function to update attributes defined in `schema`
       // `view` is the ProseMirror view instance
       // `options` is an array of your extension options
-      // `selected`
+      // `selected` is a boolean which is true when selected
+      // `editor` is a reference to the TipTap editor instance
+      // `getPos` is a function to retrieve the start position of the node
+      // `decorations` is an array of decorations around the node
       props: ['node', 'updateAttrs', 'view'],
       computed: {
         src: {

packages/tiptap-commands/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tiptap-commands",
-  "version": "1.12.5",
+  "version": "1.12.7",
   "description": "Commands for tiptap",
   "homepage": "https://tiptap.scrumpy.io",
   "license": "MIT",
@@ -20,13 +20,13 @@
     "url": "https://github.com/scrumpy/tiptap/issues"
   },
   "dependencies": {
-    "prosemirror-commands": "1.1.2",
+    "prosemirror-commands": "1.1.3",
     "prosemirror-inputrules": "1.1.2",
-    "prosemirror-model": "1.8.2",
+    "prosemirror-model": "1.9.1",
     "prosemirror-schema-list": "1.1.2",
-    "prosemirror-state": "1.3.2",
+    "prosemirror-state": "1.3.3",
     "prosemirror-tables": "1.0.0",
     "prosemirror-utils": "0.9.6",
-    "tiptap-utils": "^1.8.3"
+    "tiptap-utils": "^1.8.4"
   }
 }

packages/tiptap-commands/src/commands/markPasteRule.js

@@ -3,7 +3,7 @@ import { Slice, Fragment } from 'prosemirror-model'
 
 export default function (regexp, type, getAttrs) {
 
-  const handler = fragment => {
+  const handler = (fragment, parent) => {
     const nodes = []
 
     fragment.forEach(child => {
@@ -16,7 +16,7 @@ export default function (regexp, type, getAttrs) {
 
         // eslint-disable-next-line
         while (!isLink && (match = regexp.exec(text)) !== null) {
-          if (match[1]) {
+          if (parent.type.allowsMarkType(type) && match[1]) {
             const start = match.index
             const end = start + match[0].length
             const textStart = start + match[0].indexOf(match[1])
@@ -43,7 +43,7 @@ export default function (regexp, type, getAttrs) {
           nodes.push(child.cut(pos))
         }
       } else {
-        nodes.push(child.copy(handler(child.content)))
+        nodes.push(child.copy(handler(child.content, child)))
       }
     })
 

packages/tiptap-extensions/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tiptap-extensions",
-  "version": "1.28.6",
+  "version": "1.28.8",
   "description": "Extensions for tiptap",
   "homepage": "https://tiptap.scrumpy.io",
   "license": "MIT",
@@ -21,17 +21,17 @@
     "url": "https://github.com/scrumpy/tiptap/issues"
   },
   "dependencies": {
-    "lowlight": "1.13.0",
+    "lowlight": "1.13.1",
     "prosemirror-collab": "1.2.2",
     "prosemirror-history": "1.1.3",
-    "prosemirror-model": "1.8.2",
-    "prosemirror-state": "1.3.2",
+    "prosemirror-model": "1.9.1",
+    "prosemirror-state": "1.3.3",
     "prosemirror-tables": "1.0.0",
-    "prosemirror-transform": "1.2.3",
+    "prosemirror-transform": "1.2.4",
     "prosemirror-utils": "0.9.6",
-    "prosemirror-view": "1.13.7",
-    "tiptap": "^1.26.6",
-    "tiptap-commands": "^1.12.5"
+    "prosemirror-view": "1.14.6",
+    "tiptap": "^1.26.8",
+    "tiptap-commands": "^1.12.7"
   },
   "peerDependencies": {
     "vue": "^2.5.17",

packages/tiptap-extensions/src/extensions/Placeholder.js

@@ -17,12 +17,6 @@ export default class Placeholder extends Extension {
     }
   }
 
-  get update() {
-    return view => {
-      view.updateState(view.state)
-    }
-  }
-
   get plugins() {
     return [
       new Plugin({

packages/tiptap-extensions/src/plugins/Highlight.js

@@ -62,17 +62,20 @@ export default function HighlightPlugin({ name }) {
     name: new PluginKey('highlight'),
     state: {
       init: (_, { doc }) => getDecorations({ doc, name }),
-      apply: (transaction, decorationSet, oldState, state) => {
+      apply: (transaction, decorationSet, oldState, newState) => {
         // TODO: find way to cache decorations
-        // see: https://discuss.prosemirror.net/t/how-to-update-multiple-inline-decorations-on-node-change/1493
-
-        const nodeName = state.selection.$head.parent.type.name
-        const previousNodeName = oldState.selection.$head.parent.type.name
-
-        if (transaction.docChanged && [nodeName, previousNodeName].includes(name)) {
+        // https://discuss.prosemirror.net/t/how-to-update-multiple-inline-decorations-on-node-change/1493
+        const oldNodeName = oldState.selection.$head.parent.type.name
+        const newNodeName = newState.selection.$head.parent.type.name
+        const oldNodes = findBlockNodes(oldState.doc)
+          .filter(item => item.node.type.name === name)
+        const newNodes = findBlockNodes(newState.doc)
+          .filter(item => item.node.type.name === name)
+        // Apply decorations if selection includes named node, or transaction changes named node.
+        if (transaction.docChanged && ([oldNodeName, newNodeName].includes(name)
+          || newNodes.length !== oldNodes.length)) {
           return getDecorations({ doc: transaction.doc, name })
         }
-
         return decorationSet.map(transaction.mapping, transaction.doc)
       },
     },

packages/tiptap-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tiptap-utils",
-  "version": "1.8.3",
+  "version": "1.8.4",
   "description": "Utility functions for tiptap",
   "homepage": "https://tiptap.scrumpy.io",
   "license": "MIT",
@@ -20,8 +20,8 @@
     "url": "https://github.com/scrumpy/tiptap/issues"
   },
   "dependencies": {
-    "prosemirror-model": "1.8.2",
-    "prosemirror-state": "1.3.2",
+    "prosemirror-model": "1.9.1",
+    "prosemirror-state": "1.3.3",
     "prosemirror-tables": "1.0.0",
     "prosemirror-utils": "0.9.6"
   }

packages/tiptap/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tiptap",
-  "version": "1.26.6",
+  "version": "1.26.8",
   "description": "A rich-text editor for Vue.js",
   "homepage": "https://tiptap.scrumpy.io",
   "license": "MIT",
@@ -20,16 +20,16 @@
     "url": "https://github.com/scrumpy/tiptap/issues"
   },
   "dependencies": {
-    "prosemirror-commands": "1.1.2",
+    "prosemirror-commands": "1.1.3",
     "prosemirror-dropcursor": "1.3.2",
-    "prosemirror-gapcursor": "1.1.2",
+    "prosemirror-gapcursor": "1.1.4",
     "prosemirror-inputrules": "1.1.2",
     "prosemirror-keymap": "1.1.3",
-    "prosemirror-model": "1.8.2",
-    "prosemirror-state": "1.3.2",
-    "prosemirror-view": "1.13.7",
-    "tiptap-commands": "^1.12.5",
-    "tiptap-utils": "^1.8.3"
+    "prosemirror-model": "1.9.1",
+    "prosemirror-state": "1.3.3",
+    "prosemirror-view": "1.14.6",
+    "tiptap-commands": "^1.12.7",
+    "tiptap-utils": "^1.8.4"
   },
   "peerDependencies": {
     "vue": "^2.5.17",

packages/tiptap/src/Plugins/FloatingMenu.js

@@ -18,20 +18,22 @@ class Menu {
 
     // the mousedown event is fired before blur so we can prevent it
     this.mousedownHandler = this.handleClick.bind(this)
-    this.options.element.addEventListener('mousedown', this.mousedownHandler)
+    this.options.element.addEventListener('mousedown', this.mousedownHandler, { capture: true })
 
-    this.options.editor.on('focus', ({ view }) => {
+    this.focusHandler = ({ view }) => {
       this.update(view)
-    })
+    }
+    this.options.editor.on('focus', this.focusHandler)
 
-    this.options.editor.on('blur', ({ event }) => {
+    this.blurHandler = ({ event }) => {
       if (this.preventHide) {
         this.preventHide = false
         return
       }
 
       this.hide(event)
-    })
+    }
+    this.options.editor.on('blur', this.blurHandler)
 
     // sometimes we have to update the position
     // because of a loaded images for example
@@ -116,6 +118,9 @@ class Menu {
     if (this.resizeObserver) {
       this.resizeObserver.unobserve(this.editorView.dom)
     }
+
+    this.options.editor.off('focus', this.focusHandler)
+    this.options.editor.off('blur', this.blurHandler)
   }
 
 }

packages/tiptap/src/Plugins/MenuBar.js

@@ -8,16 +8,17 @@ class Menu {
 
     // the mousedown event is fired before blur so we can prevent it
     this.mousedownHandler = this.handleClick.bind(this)
-    this.options.element.addEventListener('mousedown', this.mousedownHandler)
+    this.options.element.addEventListener('mousedown', this.mousedownHandler, { capture: true })
 
-    this.options.editor.on('blur', () => {
+    this.blurHandler = () => {
       if (this.preventHide) {
         this.preventHide = false
         return
       }
 
       this.options.editor.emit('menubar:focusUpdate', false)
-    })
+    }
+    this.options.editor.on('blur', this.blurHandler)
   }
 
   handleClick() {
@@ -26,6 +27,7 @@ class Menu {
 
   destroy() {
     this.options.element.removeEventListener('mousedown', this.mousedownHandler)
+    this.options.editor.off('blur', this.blurHandler)
   }
 
 }

packages/tiptap/src/Plugins/MenuBubble.js

@@ -71,20 +71,22 @@ class Menu {
 
     // the mousedown event is fired before blur so we can prevent it
     this.mousedownHandler = this.handleClick.bind(this)
-    this.options.element.addEventListener('mousedown', this.mousedownHandler)
+    this.options.element.addEventListener('mousedown', this.mousedownHandler, { capture: true })
 
-    this.options.editor.on('focus', ({ view }) => {
+    this.focusHandler = ({ view }) => {
       this.update(view)
-    })
+    }
+    this.options.editor.on('focus', this.focusHandler)
 
-    this.options.editor.on('blur', ({ event }) => {
+    this.blurHandler = ({ event }) => {
       if (this.preventHide) {
         this.preventHide = false
         return
       }
 
       this.hide(event)
-    })
+    }
+    this.options.editor.on('blur', this.blurHandler)
   }
 
   handleClick() {
@@ -167,6 +169,8 @@ class Menu {
 
   destroy() {
     this.options.element.removeEventListener('mousedown', this.mousedownHandler)
+    this.options.editor.off('focus', this.focusHandler)
+    this.options.editor.off('blur', this.blurHandler)
   }
 
 }

packages/tiptap/src/Utils/ComponentView.js

@@ -45,6 +45,10 @@ export default class ComponentView {
       this.setSelection = this.extension.setSelection
     }
 
+    if (typeof this.extension.update === 'function') {
+      this.update = this.extension.update
+    }
+
     this.vm = new Component({
       parent: this.parent,
       propsData: props,

packages/tiptap/src/Utils/Extension.js

@@ -23,10 +23,6 @@ export default class Extension {
     return 'extension'
   }
 
-  get update() {
-    return () => {}
-  }
-
   get defaultOptions() {
     return {}
   }

packages/tiptap/src/Utils/ExtensionManager.js

@@ -31,7 +31,7 @@ export default class ExtensionManager {
               Object.assign(obj, { [prop]: value })
 
               if (changed) {
-                extension.update(view)
+                view.updateState(view.state)
               }
 
               return true