Merge branch 'main' of github.com:ueberdosis/tiptap into main

docs/package.json

@@ -36,11 +36,11 @@
     "yjs": "^13.5.10"
   },
   "devDependencies": {
-    "@babel/plugin-proposal-class-properties": "^7.13.0",
+    "@babel/plugin-proposal-class-properties": "^7.14.5",
-    "@babel/plugin-proposal-optional-chaining": "^7.14.2",
+    "@babel/plugin-proposal-optional-chaining": "^7.14.5",
     "@babel/plugin-syntax-class-properties": "^7.12.13",
-    "@babel/preset-env": "^7.14.4",
+    "@babel/preset-env": "^7.14.5",
-    "@babel/preset-react": "^7.13.13",
+    "@babel/preset-react": "^7.14.5",
     "html-loader": "^1.3.2",
     "node-sass": "^5.0.0",
     "sass-loader": "^10.1.1",

docs/src/demos/Examples/Community/React/index.jsx

@@ -72,7 +72,7 @@ export default () => {
     ],
     content: `
       <p>
-        What do you all think about the new <span data-mention="Winona Ryder"></span> movie?
+        What do you all think about the new <span data-mention data-id="Winona Ryder"></span> movie?
       </p>
     `,
   })

docs/src/demos/Examples/Community/Vue/index.vue

@@ -123,7 +123,7 @@ export default {
       ],
       content: `
         <p>
-          What do you all think about the new <span data-mention="Winona Ryder"></span> movie?
+          What do you all think about the new <span data-mention data-id="Winona Ryder"></span> movie?
         </p>
       `,
     })

docs/src/demos/Nodes/Mention/index.vue

@@ -82,9 +82,9 @@ export default {
       ],
       content: `
         <p>Hi everyone! Don’t forget the daily stand up at 8 AM.</p>
-        <p><span data-mention="Jennifer Grey"></span> Would you mind to share what you’ve been working on lately? We fear not much happened since Dirty Dancing.
+        <p><span data-mention data-id="Jennifer Grey"></span> Would you mind to share what you’ve been working on lately? We fear not much happened since Dirty Dancing.
-        <p><span data-mention="Winona Ryder"></span> <span data-mention="Axl Rose"></span> Let’s go through your most important points quickly.</p>
+        <p><span data-mention data-id="Winona Ryder"></span> <span data-mention data-id="Axl Rose"></span> Let’s go through your most important points quickly.</p>
-        <p>I have a meeting with <span data-mention="Christina Applegate"></span> and don’t want to come late.</p>
+        <p>I have a meeting with <span data-mention data-id="Christina Applegate"></span> and don’t want to come late.</p>
         <p>– Thanks, your big boss</p>
       `,
     })

docs/src/demos/Nodes/TaskItem/index.vue

@@ -33,7 +33,7 @@ export default {
         TaskItem,
       ],
       content: `
-        <ul data-type="task_list">
+        <ul data-type="taskList">
           <li data-type="taskItem" data-checked="true">A list item</li>
           <li data-type="taskItem" data-checked="false">And another one</li>
         </ul>

docs/src/demos/Nodes/TaskList/index.vue

@@ -37,7 +37,7 @@ export default {
         TaskItem,
       ],
       content: `
-        <ul data-type="task_list">
+        <ul data-type="taskList">
           <li data-type="taskItem" data-checked="true">A list item</li>
           <li data-type="taskItem" data-checked="false">And another one</li>
         </ul>

docs/src/docPages/api/nodes/mention.md

@@ -42,10 +42,11 @@ And yes, we plan to support React, too. Meanwhile, you can roll your own `ReactR
 It’s also possible to use Vanilla JavaScript, but that is probably a lot more work.
 
 ## Settings
-| Option         | Type     | Default | Description                                                           |
+| Option         | Type     | Default                    | Description                                                           |
-| -------------- | -------- | ------- | --------------------------------------------------------------------- |
+| -------------- | -------- | -------------------------- | --------------------------------------------------------------------- |
-| HTMLAttributes | `Object` | `{}`    | Custom HTML attributes that should be added to the rendered HTML tag. |
+| HTMLAttributes | `Object` | `{}`                       | Custom HTML attributes that should be added to the rendered HTML tag. |
-| suggestion     | `Object` | `{ … }` | [Read more](/api/utilities/suggestion)                                |
+| renderLabel    | `String` | `({ options, node }) => …` | Define how a mention label should be rendered.                        |
+| suggestion     | `Object` | `{ … }`                    | [Read more](/api/utilities/suggestion)                                |
 
 ## Source code
 [packages/extension-mention/](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-mention/)

docs/src/docPages/api/nodes/task-list.md

@@ -2,7 +2,7 @@
 [![Version](https://img.shields.io/npm/v/@tiptap/extension-task-list.svg?label=version)](https://www.npmjs.com/package/@tiptap/extension-task-list)
 [![Downloads](https://img.shields.io/npm/dm/@tiptap/extension-task-list.svg)](https://npmcharts.com/compare/@tiptap/extension-task-list?minimal=true)
 
-This extension enables you to use task lists in the editor. They are rendered as `<ul data-type="task_list">`. This implementation doesn’t require any framework, it’s using Vanilla JavaScript only.
+This extension enables you to use task lists in the editor. They are rendered as `<ul data-type="taskList">`. This implementation doesn’t require any framework, it’s using Vanilla JavaScript only.
 
 Type <code>[ ]&nbsp;</code> or <code>[x]&nbsp;</code> at the beginning of a new line and it will magically transform to a task list.
 

package.json

@@ -25,11 +25,11 @@
   },
   "devDependencies": {
     "@atomico/rollup-plugin-sizes": "^1.1.4",
-    "@babel/core": "^7.14.3",
+    "@babel/core": "^7.14.5",
-    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.14.2",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.14.5",
-    "@babel/plugin-proposal-optional-chaining": "^7.14.2",
+    "@babel/plugin-proposal-optional-chaining": "^7.14.5",
-    "@babel/preset-env": "^7.14.4",
+    "@babel/preset-env": "^7.14.5",
-    "@babel/preset-react": "^7.13.13",
+    "@babel/preset-react": "^7.14.5",
     "@lerna/batch-packages": "^3.16.0",
     "@lerna/filter-packages": "^3.18.0",
     "@lerna/project": "^3.21.0",
@@ -44,10 +44,10 @@
     "eslint-plugin-cypress": "^2.11.3",
     "eslint-plugin-html": "^6.1.0",
     "eslint-plugin-import": "^2.23.4",
-    "eslint-plugin-vue": "^7.10.0",
+    "eslint-plugin-vue": "^7.11.1",
     "lerna": "^3.22.1",
     "minimist": "^1.2.5",
-    "rollup": "^2.51.1",
+    "rollup": "^2.51.2",
     "rollup-plugin-auto-external": "^2.0.0",
     "rollup-plugin-sourcemaps": "^0.6.3",
     "rollup-plugin-typescript2": "^0.30.0",

packages/core/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.82](https://github.com/ueberdosis/tiptap/compare/@tiptap/core@2.0.0-beta.81...@tiptap/core@2.0.0-beta.82) (2021-06-14)
+
+
+### Bug Fixes
+
+* check for atom nodes in ignoreMutation handler, fix [#1448](https://github.com/ueberdosis/tiptap/issues/1448) ([2deb07f](https://github.com/ueberdosis/tiptap/commit/2deb07fb005d4376790d1e22b3fc53353d1665eb))
+* remove editable check in updateAttributes, fix [#1415](https://github.com/ueberdosis/tiptap/issues/1415) ([fbc8fff](https://github.com/ueberdosis/tiptap/commit/fbc8fffb701dd78994ca4e20c32a940236bf768d))
+
+
+
+
+
 # [2.0.0-beta.81](https://github.com/ueberdosis/tiptap/compare/@tiptap/core@2.0.0-beta.80...@tiptap/core@2.0.0-beta.81) (2021-06-07)
 
 

packages/core/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/core",
   "description": "headless rich text editor",
-  "version": "2.0.0-beta.81",
+  "version": "2.0.0-beta.82",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",

packages/core/src/NodeView.ts

@@ -183,7 +183,7 @@ export class NodeView<Component, Editor extends CoreEditor = CoreEditor> impleme
 
     // a leaf/atom node is like a black box for ProseMirror
     // and should be fully handled by the node view
-    if (this.node.isLeaf) {
+    if (this.node.isLeaf || this.node.isAtom) {
       return true
     }
 
@@ -224,18 +224,16 @@ export class NodeView<Component, Editor extends CoreEditor = CoreEditor> impleme
   }
 
   updateAttributes(attributes: {}) {
-    if (!this.editor.view.editable) {
+    this.editor.commands.command(({ tr }) => {
-      return
+      const pos = this.getPos()
-    }
 
-    const { state } = this.editor.view
+      tr.setNodeMarkup(pos, undefined, {
-    const pos = this.getPos()
+        ...this.node.attrs,
-    const transaction = state.tr.setNodeMarkup(pos, undefined, {
+        ...attributes,
-      ...this.node.attrs,
+      })
-      ...attributes,
+
+      return true
     })
-
-    this.editor.view.dispatch(transaction)
   }
 
   deleteNode(): void {

packages/extension-bubble-menu/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.21](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-bubble-menu@2.0.0-beta.20...@tiptap/extension-bubble-menu@2.0.0-beta.21) (2021-06-14)
+
+
+### Bug Fixes
+
+* hide bubble menu on drag, fix [#1443](https://github.com/ueberdosis/tiptap/issues/1443) ([6034eb9](https://github.com/ueberdosis/tiptap/commit/6034eb9b30c3fe01ece9079c84c91ba9c6184518))
+* show bubble menu for atom nodes even if there is no text content, fix [#1446](https://github.com/ueberdosis/tiptap/issues/1446) ([a3a7650](https://github.com/ueberdosis/tiptap/commit/a3a76507844cefc28111b9636c511ad9ef52ad28))
+
+
+
+
+
 # [2.0.0-beta.20](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-bubble-menu@2.0.0-beta.19...@tiptap/extension-bubble-menu@2.0.0-beta.20) (2021-05-27)
 
 **Note:** Version bump only for package @tiptap/extension-bubble-menu

packages/extension-bubble-menu/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/extension-bubble-menu",
   "description": "bubble-menu extension for tiptap",
-  "version": "2.0.0-beta.20",
+  "version": "2.0.0-beta.21",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",

packages/extension-bubble-menu/src/bubble-menu-plugin.ts

@@ -34,6 +34,7 @@ export class BubbleMenuView {
     this.element = element
     this.view = view
     this.element.addEventListener('mousedown', this.mousedownHandler, { capture: true })
+    this.view.dom.addEventListener('dragstart', this.dragstartHandler)
     this.editor.on('focus', this.focusHandler)
     this.editor.on('blur', this.blurHandler)
     this.createTooltip(tippyOptions)
@@ -44,6 +45,10 @@ export class BubbleMenuView {
     this.preventHide = true
   }
 
+  dragstartHandler = () => {
+    this.hide()
+  }
+
   focusHandler = () => {
     // we use `setTimeout` to make sure `selection` is already updated
     setTimeout(() => this.update(this.editor.view))
@@ -97,7 +102,10 @@ export class BubbleMenuView {
     // Sometime check for `empty` is not enough.
     // Doubleclick an empty paragraph returns a node size of 2.
     // So we check also for an empty text size.
-    if (empty || !$anchor.parent.textContent) {
+    const { parent } = $anchor
+    const isEmptyTextBlock = parent.type.isTextblock && !parent.textContent
+
+    if (empty || isEmptyTextBlock) {
       this.hide()
 
       return
@@ -131,6 +139,7 @@ export class BubbleMenuView {
   destroy() {
     this.tippy.destroy()
     this.element.removeEventListener('mousedown', this.mousedownHandler)
+    this.view.dom.removeEventListener('dragstart', this.dragstartHandler)
     this.editor.off('focus', this.focusHandler)
     this.editor.off('blur', this.blurHandler)
   }

packages/extension-dropcursor/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.15](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-dropcursor@2.0.0-beta.14...@tiptap/extension-dropcursor@2.0.0-beta.15) (2021-06-14)
+
+**Note:** Version bump only for package @tiptap/extension-dropcursor
+
+
+
+
+
 # [2.0.0-beta.14](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-dropcursor@2.0.0-beta.13...@tiptap/extension-dropcursor@2.0.0-beta.14) (2021-05-27)
 
 **Note:** Version bump only for package @tiptap/extension-dropcursor

packages/extension-dropcursor/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/extension-dropcursor",
   "description": "dropcursor extension for tiptap",
-  "version": "2.0.0-beta.14",
+  "version": "2.0.0-beta.15",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",

packages/extension-dropcursor/src/dropcursor.ts

@@ -11,7 +11,7 @@ export const Dropcursor = Extension.create<DropcursorOptions>({
   name: 'dropCursor',
 
   defaultOptions: {
-    color: 'black',
+    color: 'currentColor',
     width: 1,
     class: null,
   },

packages/extension-mention/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.58](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-mention@2.0.0-beta.57...@tiptap/extension-mention@2.0.0-beta.58) (2021-06-14)
+
+
+### Features
+
+* add label attribute to mention extension ([#1322](https://github.com/ueberdosis/tiptap/issues/1322)) ([c3afe88](https://github.com/ueberdosis/tiptap/commit/c3afe880ae56e53da429590be4c7e2ffe5a70486))
+* add renderLabel option to mention extension, see [#1322](https://github.com/ueberdosis/tiptap/issues/1322) ([3b78af4](https://github.com/ueberdosis/tiptap/commit/3b78af44a054fa5d0101d8f7d836409b0b68547e))
+
+
+
+
+
 # [2.0.0-beta.57](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-mention@2.0.0-beta.56...@tiptap/extension-mention@2.0.0-beta.57) (2021-05-27)
 
 **Note:** Version bump only for package @tiptap/extension-mention

packages/extension-mention/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/extension-mention",
   "description": "mention extension for tiptap",
-  "version": "2.0.0-beta.57",
+  "version": "2.0.0-beta.58",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",

packages/extension-mention/src/mention.ts

@@ -1,8 +1,13 @@
 import { Node, mergeAttributes } from '@tiptap/core'
+import { Node as ProseMirrorNode } from 'prosemirror-model'
 import Suggestion, { SuggestionOptions } from '@tiptap/suggestion'
 
 export type MentionOptions = {
   HTMLAttributes: Record<string, any>,
+  renderLabel: (props: {
+    options: MentionOptions,
+    node: ProseMirrorNode,
+  }) => string,
   suggestion: Omit<SuggestionOptions, 'editor'>,
 }
 
@@ -11,6 +16,9 @@ export const Mention = Node.create<MentionOptions>({
 
   defaultOptions: {
     HTMLAttributes: {},
+    renderLabel({ options, node }) {
+      return `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`
+    },
     suggestion: {
       char: '@',
       command: ({ editor, range, props }) => {
@@ -49,7 +57,7 @@ export const Mention = Node.create<MentionOptions>({
         default: null,
         parseHTML: element => {
           return {
-            id: element.getAttribute('data-mention'),
+            id: element.getAttribute('data-id'),
           }
         },
         renderHTML: attributes => {
@@ -58,7 +66,25 @@ export const Mention = Node.create<MentionOptions>({
           }
 
           return {
-            'data-mention': attributes.id,
+            'data-id': attributes.id,
+          }
+        },
+      },
+
+      label: {
+        default: null,
+        parseHTML: element => {
+          return {
+            label: element.getAttribute('data-label'),
+          }
+        },
+        renderHTML: attributes => {
+          if (!attributes.label) {
+            return {}
+          }
+
+          return {
+            'data-label': attributes.label,
           }
         },
       },
@@ -77,12 +103,18 @@ export const Mention = Node.create<MentionOptions>({
     return [
       'span',
       mergeAttributes(this.options.HTMLAttributes, HTMLAttributes),
-      `${this.options.suggestion.char}${node.attrs.id}`,
+      this.options.renderLabel({
+        options: this.options,
+        node,
+      }),
     ]
   },
 
   renderText({ node }) {
-    return `${this.options.suggestion.char}${node.attrs.id}`
+    return this.options.renderLabel({
+      options: this.options,
+      node,
+    })
   },
 
   addKeyboardShortcuts() {

packages/extension-placeholder/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.22](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-placeholder@2.0.0-beta.21...@tiptap/extension-placeholder@2.0.0-beta.22) (2021-06-14)
+
+
+### Bug Fixes
+
+* don’t show placeholder if node contains only atom nodes, fix [#1457](https://github.com/ueberdosis/tiptap/issues/1457) ([11b4866](https://github.com/ueberdosis/tiptap/commit/11b48669482db5122bcd60dc1b65f839e77e5a48))
+
+
+
+
+
 # [2.0.0-beta.21](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-placeholder@2.0.0-beta.20...@tiptap/extension-placeholder@2.0.0-beta.21) (2021-05-28)
 
 **Note:** Version bump only for package @tiptap/extension-placeholder

packages/extension-placeholder/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/extension-placeholder",
   "description": "placeholder extension for tiptap",
-  "version": "2.0.0-beta.21",
+  "version": "2.0.0-beta.22",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",

packages/extension-placeholder/src/placeholder.ts

@@ -40,7 +40,7 @@ export const Placeholder = Extension.create<PlaceholderOptions>({
 
             doc.descendants((node, pos) => {
               const hasAnchor = anchor >= pos && anchor <= (pos + node.nodeSize)
-              const isEmpty = !node.isLeaf && !node.textContent
+              const isEmpty = !node.isLeaf && !node.childCount
 
               if ((hasAnchor || !this.options.showOnlyCurrent) && isEmpty) {
                 const classes = [this.options.emptyNodeClass]

packages/extension-text-style/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.15](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-text-style@2.0.0-beta.14...@tiptap/extension-text-style@2.0.0-beta.15) (2021-06-14)
+
+
+### Bug Fixes
+
+* Fix removal of textStyle mark when any style resets ([#1465](https://github.com/ueberdosis/tiptap/issues/1465)) ([fbf4422](https://github.com/ueberdosis/tiptap/commit/fbf442269d021bbe17a9c0a830edfeda00bac85a))
+
+
+
+
+
 # [2.0.0-beta.14](https://github.com/ueberdosis/tiptap/compare/@tiptap/extension-text-style@2.0.0-beta.13...@tiptap/extension-text-style@2.0.0-beta.14) (2021-06-07)
 
 **Note:** Version bump only for package @tiptap/extension-text-style

packages/extension-text-style/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/extension-text-style",
   "description": "text style extension for tiptap",
-  "version": "2.0.0-beta.14",
+  "version": "2.0.0-beta.15",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",

packages/extension-text-style/src/text-style.ts

@@ -51,7 +51,7 @@ export const TextStyle = Mark.create<TextStyleOptions>({
     return {
       removeEmptyTextStyle: () => ({ state, commands }) => {
         const attributes = getMarkAttributes(state, this.type)
-        const hasStyles = Object.entries(attributes).every(([, value]) => !!value)
+        const hasStyles = Object.entries(attributes).some(([, value]) => !!value)
 
         if (hasStyles) {
           return true

packages/html/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.81](https://github.com/ueberdosis/tiptap/compare/@tiptap/html@2.0.0-beta.80...@tiptap/html@2.0.0-beta.81) (2021-06-14)
+
+**Note:** Version bump only for package @tiptap/html
+
+
+
+
+
 # [2.0.0-beta.80](https://github.com/ueberdosis/tiptap/compare/@tiptap/html@2.0.0-beta.79...@tiptap/html@2.0.0-beta.80) (2021-06-07)
 
 **Note:** Version bump only for package @tiptap/html

packages/html/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/html",
   "description": "utility package to render tiptap JSON as HTML",
-  "version": "2.0.0-beta.80",
+  "version": "2.0.0-beta.81",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",
@@ -21,7 +21,7 @@
     "dist"
   ],
   "dependencies": {
-    "@tiptap/core": "^2.0.0-beta.81",
+    "@tiptap/core": "^2.0.0-beta.82",
     "hostic-dom": "^0.8.6",
     "prosemirror-model": "^1.14.1"
   }

packages/react/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.48](https://github.com/ueberdosis/tiptap/compare/@tiptap/react@2.0.0-beta.47...@tiptap/react@2.0.0-beta.48) (2021-06-14)
+
+**Note:** Version bump only for package @tiptap/react
+
+
+
+
+
+# [2.0.0-beta.47](https://github.com/ueberdosis/tiptap/compare/@tiptap/react@2.0.0-beta.46...@tiptap/react@2.0.0-beta.47) (2021-06-14)
+
+**Note:** Version bump only for package @tiptap/react
+
+
+
+
+
 # [2.0.0-beta.46](https://github.com/ueberdosis/tiptap/compare/@tiptap/react@2.0.0-beta.45...@tiptap/react@2.0.0-beta.46) (2021-06-09)
 
 **Note:** Version bump only for package @tiptap/react

packages/react/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/react",
   "description": "React components for tiptap",
-  "version": "2.0.0-beta.46",
+  "version": "2.0.0-beta.48",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",
@@ -26,12 +26,12 @@
     "react-dom": "^17.0.1"
   },
   "dependencies": {
-    "@tiptap/extension-bubble-menu": "^2.0.0-beta.20",
+    "@tiptap/extension-bubble-menu": "^2.0.0-beta.21",
     "@tiptap/extension-floating-menu": "^2.0.0-beta.17",
     "prosemirror-view": "^1.18.7"
   },
   "devDependencies": {
-    "@types/react": "^17.0.10",
+    "@types/react": "^17.0.11",
     "@types/react-dom": "^17.0.7"
   }
 }

packages/react/src/NodeViewContent.tsx

@@ -5,12 +5,13 @@ export interface NodeViewContentProps {
   as?: React.ElementType,
 }
 
-export const NodeViewContent: React.FC<NodeViewContentProps> = props => {
+export const NodeViewContent: React.FC<NodeViewContentProps> = React.forwardRef((props, ref) => {
   const Tag = props.as || 'div'
 
   return (
     <Tag
       {...props}
+      ref={ref}
       data-node-view-content=""
       style={{
         ...props.style,
@@ -18,4 +19,4 @@ export const NodeViewContent: React.FC<NodeViewContentProps> = props => {
       }}
     />
   )
-}
+})

packages/react/src/NodeViewWrapper.tsx

@@ -6,13 +6,14 @@ export interface NodeViewWrapperProps {
   as?: React.ElementType,
 }
 
-export const NodeViewWrapper: React.FC<NodeViewWrapperProps> = props => {
+export const NodeViewWrapper: React.FC<NodeViewWrapperProps> = React.forwardRef((props, ref) => {
   const { onDragStart } = useReactNodeView()
   const Tag = props.as || 'div'
 
   return (
     <Tag
       {...props}
+      ref={ref}
       data-node-view-wrapper=""
       onDragStart={onDragStart}
       style={{
@@ -21,4 +22,4 @@ export const NodeViewWrapper: React.FC<NodeViewWrapperProps> = props => {
       }}
     />
   )
-}
+})

packages/starter-kit/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.78](https://github.com/ueberdosis/tiptap/compare/@tiptap/starter-kit@2.0.0-beta.77...@tiptap/starter-kit@2.0.0-beta.78) (2021-06-14)
+
+**Note:** Version bump only for package @tiptap/starter-kit
+
+
+
+
+
 # [2.0.0-beta.77](https://github.com/ueberdosis/tiptap/compare/@tiptap/starter-kit@2.0.0-beta.76...@tiptap/starter-kit@2.0.0-beta.77) (2021-06-07)
 
 **Note:** Version bump only for package @tiptap/starter-kit

packages/starter-kit/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/starter-kit",
   "description": "starter kit for tiptap",
-  "version": "2.0.0-beta.77",
+  "version": "2.0.0-beta.78",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",
@@ -21,14 +21,14 @@
     "dist"
   ],
   "dependencies": {
-    "@tiptap/core": "^2.0.0-beta.81",
+    "@tiptap/core": "^2.0.0-beta.82",
     "@tiptap/extension-blockquote": "^2.0.0-beta.14",
     "@tiptap/extension-bold": "^2.0.0-beta.14",
     "@tiptap/extension-bullet-list": "^2.0.0-beta.14",
     "@tiptap/extension-code": "^2.0.0-beta.14",
     "@tiptap/extension-code-block": "^2.0.0-beta.16",
     "@tiptap/extension-document": "^2.0.0-beta.12",
-    "@tiptap/extension-dropcursor": "^2.0.0-beta.14",
+    "@tiptap/extension-dropcursor": "^2.0.0-beta.15",
     "@tiptap/extension-gapcursor": "^2.0.0-beta.17",
     "@tiptap/extension-hard-break": "^2.0.0-beta.14",
     "@tiptap/extension-heading": "^2.0.0-beta.14",

packages/vue-2/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.36](https://github.com/ueberdosis/tiptap/compare/@tiptap/vue-2@2.0.0-beta.35...@tiptap/vue-2@2.0.0-beta.36) (2021-06-14)
+
+**Note:** Version bump only for package @tiptap/vue-2
+
+
+
+
+
 # [2.0.0-beta.35](https://github.com/ueberdosis/tiptap/compare/@tiptap/vue-2@2.0.0-beta.34...@tiptap/vue-2@2.0.0-beta.35) (2021-06-09)
 
 **Note:** Version bump only for package @tiptap/vue-2

packages/vue-2/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/vue-2",
   "description": "Vue components for tiptap",
-  "version": "2.0.0-beta.35",
+  "version": "2.0.0-beta.36",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",
@@ -25,7 +25,7 @@
     "vue": "^2.6.12"
   },
   "dependencies": {
-    "@tiptap/extension-bubble-menu": "^2.0.0-beta.20",
+    "@tiptap/extension-bubble-menu": "^2.0.0-beta.21",
     "@tiptap/extension-floating-menu": "^2.0.0-beta.17",
     "prosemirror-view": "^1.18.7"
   }

packages/vue-3/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.42](https://github.com/ueberdosis/tiptap/compare/@tiptap/vue-3@2.0.0-beta.41...@tiptap/vue-3@2.0.0-beta.42) (2021-06-14)
+
+**Note:** Version bump only for package @tiptap/vue-3
+
+
+
+
+
 # [2.0.0-beta.41](https://github.com/ueberdosis/tiptap/compare/@tiptap/vue-3@2.0.0-beta.40...@tiptap/vue-3@2.0.0-beta.41) (2021-06-09)
 
 **Note:** Version bump only for package @tiptap/vue-3

packages/vue-3/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tiptap/vue-3",
   "description": "Vue components for tiptap",
-  "version": "2.0.0-beta.41",
+  "version": "2.0.0-beta.42",
   "homepage": "https://tiptap.dev",
   "keywords": [
     "tiptap",
@@ -24,7 +24,7 @@
     "@tiptap/core": "^2.0.0-beta.1"
   },
   "dependencies": {
-    "@tiptap/extension-bubble-menu": "^2.0.0-beta.20",
+    "@tiptap/extension-bubble-menu": "^2.0.0-beta.21",
     "@tiptap/extension-floating-menu": "^2.0.0-beta.17",
     "prosemirror-state": "^1.3.4",
     "prosemirror-view": "^1.18.7",