From 27c8a46e401ab4b5b54ec5273db08d3e3a2e9bb6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Tue, 21 Apr 2020 22:11:57 +0200
Subject: [PATCH 01/37] fix package alias

---
 docs/gridsome.server.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/docs/gridsome.server.js b/docs/gridsome.server.js
index e87a4c54a..e8dae9386 100644
--- a/docs/gridsome.server.js
+++ b/docs/gridsome.server.js
@@ -18,12 +18,12 @@ module.exports = function (api) {
         .test(/\.jsx?$/)
         .use()
           .loader('babel-loader')
-    
-    globby.sync('./packages/*', { onlyDirectories: true })
-      .map(name => name.replace('./packages/', ''))
+
+    globby.sync('../packages/*', { onlyDirectories: true })
+      .map(name => name.replace('../packages/', ''))
       .forEach(name => {
         config.resolve.alias
-          .set(`@tiptap/${name}`, path.resolve(`./packages/${name}`))
+          .set(`@tiptap/${name}`, path.resolve(`../packages/${name}`))
       })
   })
 }

From a057755e429aa5ea800fff5b612c6fc57ba7f5d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Tue, 21 Apr 2020 22:16:26 +0200
Subject: [PATCH 02/37] add basic heading extension

---
 docs/src/demos/HandleExtensions/index.vue |  4 +-
 packages/extension-heading/index.ts       | 55 +++++++++++++++++++++++
 packages/extension-heading/package.json   | 17 +++++++
 packages/starter-kit/index.ts             |  2 +
 4 files changed, 77 insertions(+), 1 deletion(-)
 create mode 100644 packages/extension-heading/index.ts
 create mode 100644 packages/extension-heading/package.json

diff --git a/docs/src/demos/HandleExtensions/index.vue b/docs/src/demos/HandleExtensions/index.vue
index 6698f7a11..f233722df 100644
--- a/docs/src/demos/HandleExtensions/index.vue
+++ b/docs/src/demos/HandleExtensions/index.vue
@@ -32,6 +32,7 @@ import Bold from '@tiptap/extension-bold'
 import Italic from '@tiptap/extension-italic'
 import Code from '@tiptap/extension-code'
 import CodeBlock from '@tiptap/extension-codeblock'
+import Heading from '@tiptap/extension-heading'
 
 export default {
   components: {
@@ -46,7 +47,7 @@ export default {
 
   mounted() {
     this.editor = new Editor({
-      content: '<p>This editor is based on Prosemirror, fully extendable and renderless. You can easily add custom nodes as Vue components.</p>',
+      content: '<h2>Hey there!</h2><p>This editor is based on Prosemirror, fully extendable and renderless. You can easily add custom nodes as Vue components.</p>',
       extensions: [
         new Document(),
         new Paragraph(),
@@ -56,6 +57,7 @@ export default {
         new Bold(),
         new Italic(),
         new Code(),
+        new Heading(),
       ],
     })
   },
diff --git a/packages/extension-heading/index.ts b/packages/extension-heading/index.ts
new file mode 100644
index 000000000..ca5a663f4
--- /dev/null
+++ b/packages/extension-heading/index.ts
@@ -0,0 +1,55 @@
+import { Node, CommandSpec } from '@tiptap/core'
+import { NodeSpec } from 'prosemirror-model'
+
+type Level = 1 | 2 | 3 | 4 | 5 | 6
+
+interface HeadingOptions {
+  levels?: Level[],
+}
+
+declare module '@tiptap/core/src/Editor' {
+  interface Editor {
+    heading(level: Level): Editor,
+  }
+}
+
+export default class Heading extends Node {
+
+  name = 'heading'
+
+  defaultOptions(): HeadingOptions {
+    return {
+      levels: [1, 2, 3, 4, 5, 6],
+    }
+  }
+
+  schema(): NodeSpec {
+    return {
+      attrs: {
+        level: {
+          default: 1,
+        },
+      },
+      content: 'inline*',
+      group: 'block',
+      defining: true,
+      draggable: false,
+      parseDOM: this.options.levels
+        .map((level: Level) => ({
+          tag: `h${level}`,
+          attrs: { level },
+        })),
+      toDOM: node => [`h${node.attrs.level}`, 0],
+    }
+  }
+
+  // commands(): CommandSpec {
+  //   return {
+  //     heading: (next, { view }) => {
+  //       toggleBlockType(this.type)(view.state, view.dispatch)
+  //       next()
+  //     },
+  //   }
+  // }
+
+}
\ No newline at end of file
diff --git a/packages/extension-heading/package.json b/packages/extension-heading/package.json
new file mode 100644
index 000000000..3c6f6f190
--- /dev/null
+++ b/packages/extension-heading/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "@tiptap/extension-heading",
+  "version": "1.0.0",
+  "source": "index.ts",
+  "main": "dist/tiptap-extension-heading.js",
+  "umd:main": "dist/tiptap-extension-heading.umd.js",
+  "module": "dist/tiptap-extension-heading.mjs", 
+  "unpkg": "dist/tiptap-extension-heading.js",
+  "jsdelivr": "dist/tiptap-extension-heading.js",
+  "files": [
+    "src",
+    "dist"
+  ],
+  "peerDependencies": {
+    "@tiptap/core": "2.x"
+  }
+}
diff --git a/packages/starter-kit/index.ts b/packages/starter-kit/index.ts
index fdbff7b30..0f695426c 100644
--- a/packages/starter-kit/index.ts
+++ b/packages/starter-kit/index.ts
@@ -6,6 +6,7 @@ import Bold from '@tiptap/extension-bold'
 import Italic from '@tiptap/extension-italic'
 import Code from '@tiptap/extension-code'
 import CodeBlock from '@tiptap/extension-codeblock'
+import Heading from '@tiptap/extension-heading'
 
 export default function extensions() {
   return [
@@ -17,5 +18,6 @@ export default function extensions() {
     new Italic(),
     new Code(),
     new CodeBlock(),
+    new Heading(),
   ]
 }
\ No newline at end of file

From 6b5b30f3fc164c05895a39ecd3a6f69469477afd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Tue, 21 Apr 2020 22:36:31 +0200
Subject: [PATCH 03/37] add heading command

---
 docs/src/demos/HandleExtensions/index.vue     |  6 ++++
 packages/core/src/Editor.ts                   |  1 +
 packages/core/src/commands/toggleBlockType.ts | 30 +++++++++++++++++++
 packages/extension-heading/index.ts           | 16 +++++-----
 4 files changed, 45 insertions(+), 8 deletions(-)
 create mode 100644 packages/core/src/commands/toggleBlockType.ts

diff --git a/docs/src/demos/HandleExtensions/index.vue b/docs/src/demos/HandleExtensions/index.vue
index f233722df..605340077 100644
--- a/docs/src/demos/HandleExtensions/index.vue
+++ b/docs/src/demos/HandleExtensions/index.vue
@@ -16,6 +16,12 @@
       <button @click="editor.focus().italic()" :class="{ 'is-active': editor.isActive('italic') }">
         italic
       </button>
+      <button @click="editor.focus().heading({ level: 1 })" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
+        h1
+      </button>
+      <button @click="editor.focus().heading({ level: 2 })" :class="{ 'is-active': editor.isActive('heading', { level: 2 }) }">
+        h2
+      </button>
     </div>
     <editor-content :editor="editor" />
   </div>
diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index 6c804217b..bd27c1866 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -71,6 +71,7 @@ export class Editor extends EventEmitter {
     this.registerCommand('setContent', require('./commands/setContent').default)
     this.registerCommand('clearContent', require('./commands/clearContent').default)
     this.registerCommand('removeMarks', require('./commands/removeMarks').default)
+    this.registerCommand('toggleBlockType', require('./commands/toggleBlockType').default)
     
     if (this.options.injectCSS) {
       require('./style.css')
diff --git a/packages/core/src/commands/toggleBlockType.ts b/packages/core/src/commands/toggleBlockType.ts
new file mode 100644
index 000000000..7181e2bc6
--- /dev/null
+++ b/packages/core/src/commands/toggleBlockType.ts
@@ -0,0 +1,30 @@
+import { NodeType } from 'prosemirror-model'
+import { setBlockType } from 'prosemirror-commands'
+import { Editor } from '../Editor'
+import nodeIsActive from '../utils/nodeIsActive'
+
+declare module '../Editor' {
+  interface Editor {
+    toggleBlockType(type: NodeType, toggleType: NodeType, attrs?: {}): Editor,
+  }
+}
+
+export default function toggleBlockType(
+  next: Function,
+  editor: Editor,
+  type: NodeType,
+  toggleType: NodeType,
+  attrs?: {},
+): void {
+  const { view, state } = editor
+  const isActive = nodeIsActive(state, type, attrs)
+
+  if (isActive) {
+    setBlockType(toggleType)(view.state, view.dispatch)
+    next()
+    return
+  }
+
+  setBlockType(type, attrs)(view.state, view.dispatch)
+  next()
+}
diff --git a/packages/extension-heading/index.ts b/packages/extension-heading/index.ts
index ca5a663f4..577af280b 100644
--- a/packages/extension-heading/index.ts
+++ b/packages/extension-heading/index.ts
@@ -43,13 +43,13 @@ export default class Heading extends Node {
     }
   }
 
-  // commands(): CommandSpec {
-  //   return {
-  //     heading: (next, { view }) => {
-  //       toggleBlockType(this.type)(view.state, view.dispatch)
-  //       next()
-  //     },
-  //   }
-  // }
+  commands(): CommandSpec {
+    return {
+      heading: (next, editor, attrs) => {
+        editor.toggleBlockType(this.type, editor.schema.nodes.paragraph, attrs)
+        next()
+      },
+    }
+  }
 
 }
\ No newline at end of file

From 3deae61a15bf05f1b36f1575f5521c78c4646736 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Tue, 21 Apr 2020 22:48:27 +0200
Subject: [PATCH 04/37] add heading input rule

---
 packages/extension-heading/index.ts | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/packages/extension-heading/index.ts b/packages/extension-heading/index.ts
index 577af280b..3594b326e 100644
--- a/packages/extension-heading/index.ts
+++ b/packages/extension-heading/index.ts
@@ -1,5 +1,7 @@
 import { Node, CommandSpec } from '@tiptap/core'
 import { NodeSpec } from 'prosemirror-model'
+import VerEx from 'verbal-expressions'
+import { textblockTypeInputRule } from 'prosemirror-inputrules'
 
 type Level = 1 | 2 | 3 | 4 | 5 | 6
 
@@ -52,4 +54,17 @@ export default class Heading extends Node {
     }
   }
 
+  inputRules() {
+    return this.options.levels.map((level: Level) => {
+      const regex = VerEx()
+        .startOfLine()
+        .find('#')
+        .repeatPrevious(level)
+        .whitespace()
+        .endOfLine()
+
+      return textblockTypeInputRule(regex, this.type, { level })
+    })
+  }
+
 }
\ No newline at end of file

From 91d4aa7e399693c72cf1c9e7994e1dec6c0a3746 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Tue, 21 Apr 2020 23:22:27 +0200
Subject: [PATCH 05/37] improve type handling for commands

---
 packages/core/src/Editor.ts                   |  4 ++--
 packages/core/src/commands/clearContent.ts    |  6 ++++--
 packages/core/src/commands/focus.ts           |  6 ++++--
 packages/core/src/commands/insertHTML.ts      |  6 ++++--
 packages/core/src/commands/insertText.ts      |  6 ++++--
 packages/core/src/commands/removeMarks.ts     |  6 ++++--
 packages/core/src/commands/setContent.ts      | 16 ++++++++--------
 packages/core/src/commands/toggleBlockType.ts | 16 ++++++++--------
 packages/extension-bold/index.ts              |  2 +-
 packages/extension-code/index.ts              |  2 +-
 packages/extension-heading/index.ts           |  4 ++--
 packages/extension-history/index.ts           |  4 ++--
 packages/extension-italic/index.ts            |  2 +-
 13 files changed, 45 insertions(+), 35 deletions(-)

diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index bd27c1866..e9754f5a3 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -21,7 +21,7 @@ import Node from './Node'
 import Mark from './Mark'
 import EventEmitter from './EventEmitter'
 
-export type Command = (next: Function, editor: Editor, ...args: any) => any
+export type Command = (next: Function, editor: Editor) => (...args: any) => any
 
 export interface CommandSpec {
   [key: string]: Command
@@ -104,7 +104,7 @@ export class Editor extends EventEmitter {
     }
     
     this.commands[name] = this.chainCommand((...args: any) => {
-      return new Promise(resolve => callback(resolve, this.proxy, ...args))
+      return new Promise(resolve => callback(resolve, this.proxy)(...args))
     })
 
     return this.proxy
diff --git a/packages/core/src/commands/clearContent.ts b/packages/core/src/commands/clearContent.ts
index db8c2a6aa..59abd230b 100644
--- a/packages/core/src/commands/clearContent.ts
+++ b/packages/core/src/commands/clearContent.ts
@@ -1,13 +1,15 @@
 import { Editor } from '../Editor'
 import { TextSelection } from 'prosemirror-state'
 
+type ClearContent = (emitUpdate?: Boolean) => any
+
 declare module '../Editor' {
   interface Editor {
-    clearContent(emitUpdate?: Boolean): Editor,
+    clearContent: ClearContent,
   }
 }
 
-export default function clearContent(next: Function, editor: Editor, emitUpdate = false): void {
+export default (next: Function, editor: Editor, emitUpdate = false): ClearContent => emitUpdate => {
   editor.setContent('', emitUpdate)
   next()
 }
diff --git a/packages/core/src/commands/focus.ts b/packages/core/src/commands/focus.ts
index 00f8b3ee7..af93f1eaa 100644
--- a/packages/core/src/commands/focus.ts
+++ b/packages/core/src/commands/focus.ts
@@ -3,9 +3,11 @@ import { TextSelection } from 'prosemirror-state'
 import sleep from '../utils/sleep'
 import minMax from '../utils/minMax'
 
+type Focus = (position?: Position) => any
+
 declare module '../Editor' {
   interface Editor {
-    focus(position?: Position): Editor
+    focus: Focus,
   }
 }
 
@@ -43,7 +45,7 @@ function resolveSelection(editor: Editor, position: Position = null): ResolvedSe
   }
 }
 
-export default async function focus(next: Function, editor: Editor, position: Position = null): Promise<void> {
+export default (next: Function, editor: Editor, position: Position = null): Focus => async () => {
   const { view, state } = editor
 
   if ((view.hasFocus() && position === null)) {
diff --git a/packages/core/src/commands/insertHTML.ts b/packages/core/src/commands/insertHTML.ts
index f043ec31e..3597a052c 100644
--- a/packages/core/src/commands/insertHTML.ts
+++ b/packages/core/src/commands/insertHTML.ts
@@ -2,13 +2,15 @@ import { DOMParser } from 'prosemirror-model'
 import { Editor } from '../Editor'
 import elementFromString from '../utils/elementFromString'
 
+type InsertHTML = (value: string) => any
+
 declare module '../Editor' {
   interface Editor {
-    insertHTML(value: string): Editor,
+    insertHTML: InsertHTML,
   }
 }
 
-export default function insertHTML(next: Function, editor: Editor, value: string): void {
+export default (next: Function, editor: Editor, value: string): InsertHTML => () => {
   const { view, state } = editor
   const { selection } = state
   const element = elementFromString(value)
diff --git a/packages/core/src/commands/insertText.ts b/packages/core/src/commands/insertText.ts
index 9647fac04..2715c1bf5 100644
--- a/packages/core/src/commands/insertText.ts
+++ b/packages/core/src/commands/insertText.ts
@@ -1,12 +1,14 @@
 import { Editor } from '../Editor'
 
+type InsertText = (value: string) => any
+
 declare module '../Editor' {
   interface Editor {
-    insertText(value: string): Editor,
+    insertText: InsertText,
   }
 }
 
-export default function insertText(next: Function, editor: Editor, value: string): void {
+export default (next: Function, editor: Editor, value: string): InsertText => () => {
   const { view, state } = editor
   const transaction = state.tr.insertText(value)
 
diff --git a/packages/core/src/commands/removeMarks.ts b/packages/core/src/commands/removeMarks.ts
index a002c641d..5514a60d0 100644
--- a/packages/core/src/commands/removeMarks.ts
+++ b/packages/core/src/commands/removeMarks.ts
@@ -1,12 +1,14 @@
 import { Editor } from '../Editor'
 
+type RemoveMarks = () => any
+
 declare module '../Editor' {
   interface Editor {
-    removeMarks(): Editor,
+    removeMarks: RemoveMarks,
   }
 }
 
-export default function removeMarks(next: Function, editor: Editor): void {
+export default (next: Function, editor: Editor): RemoveMarks => () => {
   const { state, view, schema } = editor
   const { selection, tr } = state
   const { from, to, empty } = selection
diff --git a/packages/core/src/commands/setContent.ts b/packages/core/src/commands/setContent.ts
index 472c7ae54..4daf4260b 100644
--- a/packages/core/src/commands/setContent.ts
+++ b/packages/core/src/commands/setContent.ts
@@ -1,19 +1,19 @@
 import { Editor } from '../Editor'
 import { TextSelection } from 'prosemirror-state'
 
+type SetContent = (
+  content: string,
+  emitUpdate?: Boolean,
+  parseOptions?: any,
+) => any
+
 declare module '../Editor' {
   interface Editor {
-    setContent(content: string, emitUpdate?: Boolean, parseOptions?: any): Editor,
+    setContent: SetContent,
   }
 }
 
-export default function setContent(
-  next: Function,
-  editor: Editor,
-  content = null,
-  emitUpdate = false,
-  parseOptions = {},
-): void {
+export default (next: Function, editor: Editor): SetContent => (content, emitUpdate, parseOptions) => {
   if (content === null) {
     next()
     return
diff --git a/packages/core/src/commands/toggleBlockType.ts b/packages/core/src/commands/toggleBlockType.ts
index 7181e2bc6..fb7945808 100644
--- a/packages/core/src/commands/toggleBlockType.ts
+++ b/packages/core/src/commands/toggleBlockType.ts
@@ -3,19 +3,19 @@ import { setBlockType } from 'prosemirror-commands'
 import { Editor } from '../Editor'
 import nodeIsActive from '../utils/nodeIsActive'
 
+type ToggleBlockType = (
+  type: NodeType,
+  toggleType: NodeType,
+  attrs?: {}
+) => any
+
 declare module '../Editor' {
   interface Editor {
-    toggleBlockType(type: NodeType, toggleType: NodeType, attrs?: {}): Editor,
+    toggleBlockType: ToggleBlockType,
   }
 }
 
-export default function toggleBlockType(
-  next: Function,
-  editor: Editor,
-  type: NodeType,
-  toggleType: NodeType,
-  attrs?: {},
-): void {
+export default (next: Function, editor: Editor): ToggleBlockType => (type, toggleType, attrs) => {
   const { view, state } = editor
   const isActive = nodeIsActive(state, type, attrs)
 
diff --git a/packages/extension-bold/index.ts b/packages/extension-bold/index.ts
index 88d633f8e..37f812ffb 100644
--- a/packages/extension-bold/index.ts
+++ b/packages/extension-bold/index.ts
@@ -34,7 +34,7 @@ export default class Bold extends Mark {
 
   commands(): CommandSpec {
     return {
-      bold: (next, { view }) => {
+      bold: (next, { view }) => () => {
         toggleMark(this.type)(view.state, view.dispatch)
         next()
       },
diff --git a/packages/extension-code/index.ts b/packages/extension-code/index.ts
index 821eccfc5..28a365f68 100644
--- a/packages/extension-code/index.ts
+++ b/packages/extension-code/index.ts
@@ -25,7 +25,7 @@ export default class Code extends Mark {
 
   commands(): CommandSpec {
     return {
-      code: (next, { view }) => {
+      code: (next, { view }) => () => {
         toggleMark(this.type)(view.state, view.dispatch)
         next()
       },
diff --git a/packages/extension-heading/index.ts b/packages/extension-heading/index.ts
index 3594b326e..b5e200d9d 100644
--- a/packages/extension-heading/index.ts
+++ b/packages/extension-heading/index.ts
@@ -47,8 +47,8 @@ export default class Heading extends Node {
 
   commands(): CommandSpec {
     return {
-      heading: (next, editor, attrs) => {
-        editor.toggleBlockType(this.type, editor.schema.nodes.paragraph, attrs)
+      heading: next => attrs => {
+        this.editor.toggleBlockType(this.type, this.editor.schema.nodes.paragraph, attrs)
         next()
       },
     }
diff --git a/packages/extension-history/index.ts b/packages/extension-history/index.ts
index 57366277a..911e0e1fe 100644
--- a/packages/extension-history/index.ts
+++ b/packages/extension-history/index.ts
@@ -34,11 +34,11 @@ export default class History extends Extension {
 
   commands(): CommandSpec {
     return {
-      undo: (next, { view }) => {
+      undo: (next, { view }) => () => {
         undo(view.state, view.dispatch)
         next()
       },
-      redo: (next, { view }) => {
+      redo: (next, { view }) => () => {
         redo(view.state, view.dispatch)
         next()
       },
diff --git a/packages/extension-italic/index.ts b/packages/extension-italic/index.ts
index fd1acdf22..3e80965ae 100644
--- a/packages/extension-italic/index.ts
+++ b/packages/extension-italic/index.ts
@@ -26,7 +26,7 @@ export default class Italic extends Mark {
 
   commands(): CommandSpec {
     return {
-      italic: (next, { view }) => {
+      italic: (next, { view }) => () => {
         toggleMark(this.type)(view.state, view.dispatch)
         next()
       },

From 023c16a4f57f8ae58fe24745df577cdb6ae0f2ca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Tue, 21 Apr 2020 23:48:50 +0200
Subject: [PATCH 06/37] some fixes

---
 packages/core/src/commands/clearContent.ts    | 2 +-
 packages/core/src/commands/focus.ts           | 2 +-
 packages/core/src/commands/insertHTML.ts      | 2 +-
 packages/core/src/commands/insertText.ts      | 2 +-
 packages/core/src/commands/setContent.ts      | 2 +-
 packages/core/src/commands/toggleBlockType.ts | 5 ++---
 6 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/packages/core/src/commands/clearContent.ts b/packages/core/src/commands/clearContent.ts
index 59abd230b..5a38fe8e6 100644
--- a/packages/core/src/commands/clearContent.ts
+++ b/packages/core/src/commands/clearContent.ts
@@ -9,7 +9,7 @@ declare module '../Editor' {
   }
 }
 
-export default (next: Function, editor: Editor, emitUpdate = false): ClearContent => emitUpdate => {
+export default (next: Function, editor: Editor): ClearContent => (emitUpdate = false) => {
   editor.setContent('', emitUpdate)
   next()
 }
diff --git a/packages/core/src/commands/focus.ts b/packages/core/src/commands/focus.ts
index af93f1eaa..01312b4a5 100644
--- a/packages/core/src/commands/focus.ts
+++ b/packages/core/src/commands/focus.ts
@@ -45,7 +45,7 @@ function resolveSelection(editor: Editor, position: Position = null): ResolvedSe
   }
 }
 
-export default (next: Function, editor: Editor, position: Position = null): Focus => async () => {
+export default (next: Function, editor: Editor): Focus => async (position = null) => {
   const { view, state } = editor
 
   if ((view.hasFocus() && position === null)) {
diff --git a/packages/core/src/commands/insertHTML.ts b/packages/core/src/commands/insertHTML.ts
index 3597a052c..a09a33efd 100644
--- a/packages/core/src/commands/insertHTML.ts
+++ b/packages/core/src/commands/insertHTML.ts
@@ -10,7 +10,7 @@ declare module '../Editor' {
   }
 }
 
-export default (next: Function, editor: Editor, value: string): InsertHTML => () => {
+export default (next: Function, editor: Editor): InsertHTML => value => {
   const { view, state } = editor
   const { selection } = state
   const element = elementFromString(value)
diff --git a/packages/core/src/commands/insertText.ts b/packages/core/src/commands/insertText.ts
index 2715c1bf5..4877ca2da 100644
--- a/packages/core/src/commands/insertText.ts
+++ b/packages/core/src/commands/insertText.ts
@@ -8,7 +8,7 @@ declare module '../Editor' {
   }
 }
 
-export default (next: Function, editor: Editor, value: string): InsertText => () => {
+export default (next: Function, editor: Editor): InsertText => value => {
   const { view, state } = editor
   const transaction = state.tr.insertText(value)
 
diff --git a/packages/core/src/commands/setContent.ts b/packages/core/src/commands/setContent.ts
index 4daf4260b..f2e9d5419 100644
--- a/packages/core/src/commands/setContent.ts
+++ b/packages/core/src/commands/setContent.ts
@@ -13,7 +13,7 @@ declare module '../Editor' {
   }
 }
 
-export default (next: Function, editor: Editor): SetContent => (content, emitUpdate, parseOptions) => {
+export default (next: Function, editor: Editor): SetContent => (content, emitUpdate = false, parseOptions = {}) => {
   if (content === null) {
     next()
     return
diff --git a/packages/core/src/commands/toggleBlockType.ts b/packages/core/src/commands/toggleBlockType.ts
index fb7945808..35277d6ac 100644
--- a/packages/core/src/commands/toggleBlockType.ts
+++ b/packages/core/src/commands/toggleBlockType.ts
@@ -21,10 +21,9 @@ export default (next: Function, editor: Editor): ToggleBlockType => (type, toggl
 
   if (isActive) {
     setBlockType(toggleType)(view.state, view.dispatch)
-    next()
-    return
+  } else {
+    setBlockType(type, attrs)(view.state, view.dispatch)
   }
 
-  setBlockType(type, attrs)(view.state, view.dispatch)
   next()
 }

From 3d02da20fffe8e897fcdda50411e43b37e6365fc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 00:09:31 +0200
Subject: [PATCH 07/37] add getNodeType

---
 packages/core/src/commands/toggleBlockType.ts | 11 +++++++----
 packages/core/src/utils/getNodeType.ts        |  9 +++++++++
 packages/extension-heading/index.ts           |  2 +-
 3 files changed, 17 insertions(+), 5 deletions(-)
 create mode 100644 packages/core/src/utils/getNodeType.ts

diff --git a/packages/core/src/commands/toggleBlockType.ts b/packages/core/src/commands/toggleBlockType.ts
index 35277d6ac..fdbc2015b 100644
--- a/packages/core/src/commands/toggleBlockType.ts
+++ b/packages/core/src/commands/toggleBlockType.ts
@@ -2,10 +2,11 @@ import { NodeType } from 'prosemirror-model'
 import { setBlockType } from 'prosemirror-commands'
 import { Editor } from '../Editor'
 import nodeIsActive from '../utils/nodeIsActive'
+import getNodeType from '../utils/getNodeType'
 
 type ToggleBlockType = (
-  type: NodeType,
-  toggleType: NodeType,
+  type: string | NodeType,
+  toggleType: string | NodeType,
   attrs?: {}
 ) => any
 
@@ -15,8 +16,10 @@ declare module '../Editor' {
   }
 }
 
-export default (next: Function, editor: Editor): ToggleBlockType => (type, toggleType, attrs) => {
-  const { view, state } = editor
+export default (next: Function, editor: Editor): ToggleBlockType => (typeOrName, toggleTypeOrName, attrs) => {
+  const { view, state, schema } = editor
+  const type = getNodeType(typeOrName, schema)
+  const toggleType = getNodeType(toggleTypeOrName, schema)
   const isActive = nodeIsActive(state, type, attrs)
 
   if (isActive) {
diff --git a/packages/core/src/utils/getNodeType.ts b/packages/core/src/utils/getNodeType.ts
new file mode 100644
index 000000000..58da4f70b
--- /dev/null
+++ b/packages/core/src/utils/getNodeType.ts
@@ -0,0 +1,9 @@
+import { NodeType, Schema } from 'prosemirror-model'
+
+export default function getNodeType(nameOrType: string | NodeType, schema: Schema): NodeType {
+  if (typeof nameOrType === 'string') {
+    return schema.nodes[nameOrType]
+  }
+
+  return nameOrType
+}
diff --git a/packages/extension-heading/index.ts b/packages/extension-heading/index.ts
index b5e200d9d..8471a7b69 100644
--- a/packages/extension-heading/index.ts
+++ b/packages/extension-heading/index.ts
@@ -48,7 +48,7 @@ export default class Heading extends Node {
   commands(): CommandSpec {
     return {
       heading: next => attrs => {
-        this.editor.toggleBlockType(this.type, this.editor.schema.nodes.paragraph, attrs)
+        this.editor.toggleBlockType(this.name, 'paragraph', attrs)
         next()
       },
     }

From adb44f317c6265bf7dbb17379266d594e5740686 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 00:17:36 +0200
Subject: [PATCH 08/37] add selectall command

---
 packages/core/src/Editor.ts             |  1 +
 packages/core/src/commands/selectAll.ts | 15 +++++++++++++++
 2 files changed, 16 insertions(+)
 create mode 100644 packages/core/src/commands/selectAll.ts

diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index e9754f5a3..584ea9b55 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -72,6 +72,7 @@ export class Editor extends EventEmitter {
     this.registerCommand('clearContent', require('./commands/clearContent').default)
     this.registerCommand('removeMarks', require('./commands/removeMarks').default)
     this.registerCommand('toggleBlockType', require('./commands/toggleBlockType').default)
+    this.registerCommand('selectAll', require('./commands/selectAll').default)
     
     if (this.options.injectCSS) {
       require('./style.css')
diff --git a/packages/core/src/commands/selectAll.ts b/packages/core/src/commands/selectAll.ts
new file mode 100644
index 000000000..6d08a2c58
--- /dev/null
+++ b/packages/core/src/commands/selectAll.ts
@@ -0,0 +1,15 @@
+import { Editor } from '../Editor'
+import { selectAll } from 'prosemirror-commands'
+
+type SelectAll = () => any
+
+declare module '../Editor' {
+  interface Editor {
+    selectAll: SelectAll,
+  }
+}
+
+export default (next: Function, { state, view }: Editor): SelectAll => () => {
+  selectAll(state, view.dispatch)
+  next()
+}

From 0e18e67c93e23d7e421e0142781a49260e9180c7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 09:23:53 +0200
Subject: [PATCH 09/37] add list of current commands

---
 docs/src/data/posts/commands.md               | 34 ++++++++++++++++++-
 packages/core/src/Editor.ts                   |  2 +-
 .../{toggleBlockType.ts => toggleNode.ts}     |  6 ++--
 packages/extension-heading/index.ts           |  2 +-
 4 files changed, 38 insertions(+), 6 deletions(-)
 rename packages/core/src/commands/{toggleBlockType.ts => toggleNode.ts} (80%)

diff --git a/docs/src/data/posts/commands.md b/docs/src/data/posts/commands.md
index e6827429d..7f8f65315 100644
--- a/docs/src/data/posts/commands.md
+++ b/docs/src/data/posts/commands.md
@@ -1 +1,33 @@
-# Commands
\ No newline at end of file
+# Commands
+
+## .clearContent()
+
+Clear the whole document.
+
+## .focus()
+
+Focus the editor at the given position.
+
+## .insertHTML()
+
+Insert a string of HTML at the currently selected position.
+
+## .insertText()
+
+Insert a string of text at the currently selected position.
+
+## .removeMarks()
+
+Remove all marks in the current selection.
+
+## .selectAll()
+
+Select the whole document.
+
+## .setContent()
+
+Replace the whole document with new content.
+
+## .toggleNode()
+
+Toggle a node with another node.
\ No newline at end of file
diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index 584ea9b55..8b2a3005d 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -71,7 +71,7 @@ export class Editor extends EventEmitter {
     this.registerCommand('setContent', require('./commands/setContent').default)
     this.registerCommand('clearContent', require('./commands/clearContent').default)
     this.registerCommand('removeMarks', require('./commands/removeMarks').default)
-    this.registerCommand('toggleBlockType', require('./commands/toggleBlockType').default)
+    this.registerCommand('toggleNode', require('./commands/toggleNode').default)
     this.registerCommand('selectAll', require('./commands/selectAll').default)
     
     if (this.options.injectCSS) {
diff --git a/packages/core/src/commands/toggleBlockType.ts b/packages/core/src/commands/toggleNode.ts
similarity index 80%
rename from packages/core/src/commands/toggleBlockType.ts
rename to packages/core/src/commands/toggleNode.ts
index fdbc2015b..32ab13d04 100644
--- a/packages/core/src/commands/toggleBlockType.ts
+++ b/packages/core/src/commands/toggleNode.ts
@@ -4,7 +4,7 @@ import { Editor } from '../Editor'
 import nodeIsActive from '../utils/nodeIsActive'
 import getNodeType from '../utils/getNodeType'
 
-type ToggleBlockType = (
+type ToggleNode = (
   type: string | NodeType,
   toggleType: string | NodeType,
   attrs?: {}
@@ -12,11 +12,11 @@ type ToggleBlockType = (
 
 declare module '../Editor' {
   interface Editor {
-    toggleBlockType: ToggleBlockType,
+    toggleNode: ToggleNode,
   }
 }
 
-export default (next: Function, editor: Editor): ToggleBlockType => (typeOrName, toggleTypeOrName, attrs) => {
+export default (next: Function, editor: Editor): ToggleNode => (typeOrName, toggleTypeOrName, attrs) => {
   const { view, state, schema } = editor
   const type = getNodeType(typeOrName, schema)
   const toggleType = getNodeType(toggleTypeOrName, schema)
diff --git a/packages/extension-heading/index.ts b/packages/extension-heading/index.ts
index 8471a7b69..c8d72ea12 100644
--- a/packages/extension-heading/index.ts
+++ b/packages/extension-heading/index.ts
@@ -48,7 +48,7 @@ export default class Heading extends Node {
   commands(): CommandSpec {
     return {
       heading: next => attrs => {
-        this.editor.toggleBlockType(this.name, 'paragraph', attrs)
+        this.editor.toggleNode(this.name, 'paragraph', attrs)
         next()
       },
     }

From 4e6404a404802b7a4bd94a7865ec3a9d4000aea6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 14:06:15 +0200
Subject: [PATCH 10/37] add toggleMark command

---
 packages/core/src/Editor.ts                   | 12 ++++++-----
 .../core/src/commands/selectParentNode.ts     | 15 ++++++++++++++
 packages/core/src/commands/toggleMark.ts      | 20 +++++++++++++++++++
 packages/core/src/utils/getMarkType.ts        |  9 +++++++++
 packages/extension-bold/index.ts              |  5 ++---
 packages/extension-code/index.ts              |  5 ++---
 packages/extension-italic/index.ts            |  5 ++---
 7 files changed, 57 insertions(+), 14 deletions(-)
 create mode 100644 packages/core/src/commands/selectParentNode.ts
 create mode 100644 packages/core/src/commands/toggleMark.ts
 create mode 100644 packages/core/src/utils/getMarkType.ts

diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index 8b2a3005d..6ea4fe49b 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -65,14 +65,16 @@ export class Editor extends EventEmitter {
     this.createExtensionManager()
     this.createSchema()
     this.createView()
-    this.registerCommand('focus', require('./commands/focus').default)
-    this.registerCommand('insertText', require('./commands/insertText').default)
-    this.registerCommand('insertHTML', require('./commands/insertHTML').default)
-    this.registerCommand('setContent', require('./commands/setContent').default)
     this.registerCommand('clearContent', require('./commands/clearContent').default)
+    this.registerCommand('focus', require('./commands/focus').default)
+    this.registerCommand('insertHTML', require('./commands/insertHTML').default)
+    this.registerCommand('insertText', require('./commands/insertText').default)
     this.registerCommand('removeMarks', require('./commands/removeMarks').default)
-    this.registerCommand('toggleNode', require('./commands/toggleNode').default)
     this.registerCommand('selectAll', require('./commands/selectAll').default)
+    this.registerCommand('selectParentNode', require('./commands/selectParentNode').default)
+    this.registerCommand('setContent', require('./commands/setContent').default)
+    this.registerCommand('toggleMark', require('./commands/toggleMark').default)
+    this.registerCommand('toggleNode', require('./commands/toggleNode').default)
     
     if (this.options.injectCSS) {
       require('./style.css')
diff --git a/packages/core/src/commands/selectParentNode.ts b/packages/core/src/commands/selectParentNode.ts
new file mode 100644
index 000000000..0d22582c6
--- /dev/null
+++ b/packages/core/src/commands/selectParentNode.ts
@@ -0,0 +1,15 @@
+import { Editor } from '../Editor'
+import { selectParentNode } from 'prosemirror-commands'
+
+type SelectParentNode = () => any
+
+declare module '../Editor' {
+  interface Editor {
+    selectParentNode: SelectParentNode,
+  }
+}
+
+export default (next: Function, { state, view }: Editor): SelectParentNode => () => {
+  selectParentNode(state, view.dispatch)
+  next()
+}
diff --git a/packages/core/src/commands/toggleMark.ts b/packages/core/src/commands/toggleMark.ts
new file mode 100644
index 000000000..8441a2723
--- /dev/null
+++ b/packages/core/src/commands/toggleMark.ts
@@ -0,0 +1,20 @@
+import { Editor } from '../Editor'
+import { toggleMark } from 'prosemirror-commands'
+import { MarkType } from 'prosemirror-model'
+import getMarkType from '../utils/getMarkType'
+
+type ToggleMark = (type: string | MarkType) => any
+
+declare module '../Editor' {
+  interface Editor {
+    toggleMark: ToggleMark,
+  }
+}
+
+export default (next: Function, editor: Editor): ToggleMark => (typeOrName) => {
+  const { view, state, schema } = editor
+  const type = getMarkType(typeOrName, schema)
+
+  toggleMark(type)(state, view.dispatch)
+  next()
+}
diff --git a/packages/core/src/utils/getMarkType.ts b/packages/core/src/utils/getMarkType.ts
new file mode 100644
index 000000000..c65100b21
--- /dev/null
+++ b/packages/core/src/utils/getMarkType.ts
@@ -0,0 +1,9 @@
+import { MarkType, Schema } from 'prosemirror-model'
+
+export default function getMarkType(nameOrType: string | MarkType, schema: Schema): MarkType {
+  if (typeof nameOrType === 'string') {
+    return schema.marks[nameOrType]
+  }
+
+  return nameOrType
+}
diff --git a/packages/extension-bold/index.ts b/packages/extension-bold/index.ts
index 37f812ffb..2daffc539 100644
--- a/packages/extension-bold/index.ts
+++ b/packages/extension-bold/index.ts
@@ -1,5 +1,4 @@
 import { Mark, CommandSpec, markInputRule, markPasteRule } from '@tiptap/core'
-import { toggleMark } from 'prosemirror-commands'
 import { MarkSpec } from 'prosemirror-model'
 import VerEx from 'verbal-expressions'
 
@@ -34,8 +33,8 @@ export default class Bold extends Mark {
 
   commands(): CommandSpec {
     return {
-      bold: (next, { view }) => () => {
-        toggleMark(this.type)(view.state, view.dispatch)
+      bold: next => () => {
+        this.editor.toggleMark(this.name)
         next()
       },
     }
diff --git a/packages/extension-code/index.ts b/packages/extension-code/index.ts
index 28a365f68..815b2aee9 100644
--- a/packages/extension-code/index.ts
+++ b/packages/extension-code/index.ts
@@ -1,5 +1,4 @@
 import { Mark, markInputRule, markPasteRule, CommandSpec } from '@tiptap/core'
-import { toggleMark } from 'prosemirror-commands'
 import { MarkSpec } from 'prosemirror-model'
 import VerEx from 'verbal-expressions'
 
@@ -25,8 +24,8 @@ export default class Code extends Mark {
 
   commands(): CommandSpec {
     return {
-      code: (next, { view }) => () => {
-        toggleMark(this.type)(view.state, view.dispatch)
+      code: next => () => {
+        this.editor.toggleMark(this.name)
         next()
       },
     }
diff --git a/packages/extension-italic/index.ts b/packages/extension-italic/index.ts
index 3e80965ae..d0492e4b8 100644
--- a/packages/extension-italic/index.ts
+++ b/packages/extension-italic/index.ts
@@ -1,5 +1,4 @@
 import { Mark, markInputRule, markPasteRule, CommandSpec } from '@tiptap/core'
-import { toggleMark } from 'prosemirror-commands'
 import { MarkSpec } from 'prosemirror-model'
 import VerEx from 'verbal-expressions'
 
@@ -26,8 +25,8 @@ export default class Italic extends Mark {
 
   commands(): CommandSpec {
     return {
-      italic: (next, { view }) => () => {
-        toggleMark(this.type)(view.state, view.dispatch)
+      italic: next => () => {
+        this.editor.toggleMark(this.name)
         next()
       },
     }

From fd4453f7c5dda888401dce57c9ba9e9467c3e77e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 14:08:25 +0200
Subject: [PATCH 11/37] update docs

---
 docs/src/data/posts/commands.md | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/docs/src/data/posts/commands.md b/docs/src/data/posts/commands.md
index 7f8f65315..e6d808c9f 100644
--- a/docs/src/data/posts/commands.md
+++ b/docs/src/data/posts/commands.md
@@ -24,10 +24,18 @@ Remove all marks in the current selection.
 
 Select the whole document.
 
+## .selectParentNode()
+
+Select the parent node.
+
 ## .setContent()
 
 Replace the whole document with new content.
 
+## .toggleMark()
+
+Toggle a mark on and off.
+
 ## .toggleNode()
 
 Toggle a node with another node.
\ No newline at end of file

From fd8f5de375a72553edec0145745ec514f4a388c1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 14:22:31 +0200
Subject: [PATCH 12/37] add removeMark command

---
 docs/src/data/posts/commands.md          |  4 +++
 packages/core/src/Editor.ts              |  1 +
 packages/core/src/commands/removeMark.ts | 32 +++++++++++++++++++
 packages/core/src/utils/getMarkRange.ts  | 40 ++++++++++++++++++++++++
 4 files changed, 77 insertions(+)
 create mode 100644 packages/core/src/commands/removeMark.ts
 create mode 100644 packages/core/src/utils/getMarkRange.ts

diff --git a/docs/src/data/posts/commands.md b/docs/src/data/posts/commands.md
index e6d808c9f..38b48276a 100644
--- a/docs/src/data/posts/commands.md
+++ b/docs/src/data/posts/commands.md
@@ -16,6 +16,10 @@ Insert a string of HTML at the currently selected position.
 
 Insert a string of text at the currently selected position.
 
+## .removeMark()
+
+Remove a mark in the current selection.
+
 ## .removeMarks()
 
 Remove all marks in the current selection.
diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index 6ea4fe49b..79b0373eb 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -69,6 +69,7 @@ export class Editor extends EventEmitter {
     this.registerCommand('focus', require('./commands/focus').default)
     this.registerCommand('insertHTML', require('./commands/insertHTML').default)
     this.registerCommand('insertText', require('./commands/insertText').default)
+    this.registerCommand('removeMark', require('./commands/removeMark').default)
     this.registerCommand('removeMarks', require('./commands/removeMarks').default)
     this.registerCommand('selectAll', require('./commands/selectAll').default)
     this.registerCommand('selectParentNode', require('./commands/selectParentNode').default)
diff --git a/packages/core/src/commands/removeMark.ts b/packages/core/src/commands/removeMark.ts
new file mode 100644
index 000000000..d9a8a47af
--- /dev/null
+++ b/packages/core/src/commands/removeMark.ts
@@ -0,0 +1,32 @@
+import { Editor } from '../Editor'
+import { MarkType } from 'prosemirror-model'
+import getMarkType from '../utils/getMarkType'
+import getMarkRange from '../utils/getMarkRange'
+
+type RemoveMark = (type: string | MarkType) => any
+
+declare module '../Editor' {
+  interface Editor {
+    toggleMark: RemoveMark,
+  }
+}
+
+export default (next: Function, editor: Editor): RemoveMark => typeOrName => {
+  const { view, state, schema } = editor
+  const { tr, selection } = state
+  const type = getMarkType(typeOrName, schema)
+  let { from, to, $from, empty } = selection
+
+  if (empty) {
+    const range = getMarkRange($from, type)
+
+    if (range) {
+      from = range.from
+      to = range.to
+    }
+  }
+
+  tr.removeMark(from, to, type)
+  view.dispatch(tr)
+  next()
+}
diff --git a/packages/core/src/utils/getMarkRange.ts b/packages/core/src/utils/getMarkRange.ts
new file mode 100644
index 000000000..8498a2de3
--- /dev/null
+++ b/packages/core/src/utils/getMarkRange.ts
@@ -0,0 +1,40 @@
+import { MarkType, ResolvedPos } from 'prosemirror-model'
+
+interface Range {
+  from: number,
+  to: number,
+}
+
+export default function getMarkRange($pos: ResolvedPos, type: MarkType): Range | void {
+  if (!$pos || !type) {
+    return
+  }
+
+  const start = $pos.parent.childAfter($pos.parentOffset)
+
+  if (!start.node) {
+    return
+  }
+
+  const link = start.node.marks.find(mark => mark.type === type)
+  if (!link) {
+    return
+  }
+
+  let startIndex = $pos.index()
+  let startPos = $pos.start() + start.offset
+  let endIndex = startIndex + 1
+  let endPos = startPos + start.node.nodeSize
+
+  while (startIndex > 0 && link.isInSet($pos.parent.child(startIndex - 1).marks)) {
+    startIndex -= 1
+    startPos -= $pos.parent.child(startIndex).nodeSize
+  }
+
+  while (endIndex < $pos.parent.childCount && link.isInSet($pos.parent.child(endIndex).marks)) {
+    endPos += $pos.parent.child(endIndex).nodeSize
+    endIndex += 1
+  }
+
+  return { from: startPos, to: endPos }
+}

From 9f53481e016ce23d325524e1b9081eaad1c753e3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 14:38:15 +0200
Subject: [PATCH 13/37] add replaceWithNode command

---
 docs/src/data/posts/commands.md               |  4 +++
 packages/core/src/Editor.ts                   |  1 +
 packages/core/src/commands/replaceWithNode.ts | 35 +++++++++++++++++++
 3 files changed, 40 insertions(+)
 create mode 100644 packages/core/src/commands/replaceWithNode.ts

diff --git a/docs/src/data/posts/commands.md b/docs/src/data/posts/commands.md
index 38b48276a..118d5ceb2 100644
--- a/docs/src/data/posts/commands.md
+++ b/docs/src/data/posts/commands.md
@@ -24,6 +24,10 @@ Remove a mark in the current selection.
 
 Remove all marks in the current selection.
 
+## .replaceWithNode()
+
+Replace a given range with a node.
+
 ## .selectAll()
 
 Select the whole document.
diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index 79b0373eb..66b0364ae 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -71,6 +71,7 @@ export class Editor extends EventEmitter {
     this.registerCommand('insertText', require('./commands/insertText').default)
     this.registerCommand('removeMark', require('./commands/removeMark').default)
     this.registerCommand('removeMarks', require('./commands/removeMarks').default)
+    this.registerCommand('replaceWithNode', require('./commands/replaceWithNode').default)
     this.registerCommand('selectAll', require('./commands/selectAll').default)
     this.registerCommand('selectParentNode', require('./commands/selectParentNode').default)
     this.registerCommand('setContent', require('./commands/setContent').default)
diff --git a/packages/core/src/commands/replaceWithNode.ts b/packages/core/src/commands/replaceWithNode.ts
new file mode 100644
index 000000000..b29d38824
--- /dev/null
+++ b/packages/core/src/commands/replaceWithNode.ts
@@ -0,0 +1,35 @@
+import { Editor } from '../Editor'
+import { NodeType } from 'prosemirror-model'
+import getNodeType from '../utils/getNodeType'
+
+interface Range {
+  from: number,
+  to: number,
+}
+
+type ReplaceWithNode = (
+  range: Range,
+  type: NodeType,
+  attrs: {},
+) => any
+
+declare module '../Editor' {
+  interface Editor {
+    replaceText: ReplaceWithNode,
+  }
+}
+
+export default (next: Function, editor: Editor): ReplaceWithNode => (range, typeOrName, attrs) => {
+  const { view, state, schema } = editor
+  const { $from, $to } = state.selection
+  const type = getNodeType(typeOrName, schema)
+  const index = $from.index()
+  const from = range ? range.from : $from.pos
+  const to = range ? range.to : $to.pos
+
+  if ($from.parent.canReplaceWith(index, index, type)) {
+    view.dispatch(state.tr.replaceWith(from, to, type.create(attrs)))
+  }
+
+  next()
+}

From bddd5b3da74d8db21d61205e2651659d69ef85c3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 14:41:43 +0200
Subject: [PATCH 14/37] change order

---
 packages/core/src/commands/replaceWithNode.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/core/src/commands/replaceWithNode.ts b/packages/core/src/commands/replaceWithNode.ts
index b29d38824..3d6245950 100644
--- a/packages/core/src/commands/replaceWithNode.ts
+++ b/packages/core/src/commands/replaceWithNode.ts
@@ -8,9 +8,9 @@ interface Range {
 }
 
 type ReplaceWithNode = (
-  range: Range,
   type: NodeType,
   attrs: {},
+  range?: Range,
 ) => any
 
 declare module '../Editor' {
@@ -19,7 +19,7 @@ declare module '../Editor' {
   }
 }
 
-export default (next: Function, editor: Editor): ReplaceWithNode => (range, typeOrName, attrs) => {
+export default (next: Function, editor: Editor): ReplaceWithNode => (typeOrName, attrs, range) => {
   const { view, state, schema } = editor
   const { $from, $to } = state.selection
   const type = getNodeType(typeOrName, schema)

From 4cfadf7d7f9a04fb6082b5358f6ec93500b2b242 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 14:50:02 +0200
Subject: [PATCH 15/37] add updateMark command

---
 docs/src/data/posts/commands.md          |  6 +++-
 packages/core/src/Editor.ts              |  1 +
 packages/core/src/commands/updateMark.ts | 41 ++++++++++++++++++++++++
 3 files changed, 47 insertions(+), 1 deletion(-)
 create mode 100644 packages/core/src/commands/updateMark.ts

diff --git a/docs/src/data/posts/commands.md b/docs/src/data/posts/commands.md
index 118d5ceb2..8e6f27da9 100644
--- a/docs/src/data/posts/commands.md
+++ b/docs/src/data/posts/commands.md
@@ -46,4 +46,8 @@ Toggle a mark on and off.
 
 ## .toggleNode()
 
-Toggle a node with another node.
\ No newline at end of file
+Toggle a node with another node.
+
+## .updateMark()
+
+Update a mark with new attributes.
\ No newline at end of file
diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index 66b0364ae..8b7a0b3fb 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -77,6 +77,7 @@ export class Editor extends EventEmitter {
     this.registerCommand('setContent', require('./commands/setContent').default)
     this.registerCommand('toggleMark', require('./commands/toggleMark').default)
     this.registerCommand('toggleNode', require('./commands/toggleNode').default)
+    this.registerCommand('updateMark', require('./commands/updateMark').default)
     
     if (this.options.injectCSS) {
       require('./style.css')
diff --git a/packages/core/src/commands/updateMark.ts b/packages/core/src/commands/updateMark.ts
new file mode 100644
index 000000000..e5d81eef2
--- /dev/null
+++ b/packages/core/src/commands/updateMark.ts
@@ -0,0 +1,41 @@
+import { Editor } from '../Editor'
+import { MarkType } from 'prosemirror-model'
+import getMarkType from '../utils/getMarkType'
+import getMarkRange from '../utils/getMarkRange'
+
+type UpdateMark = (
+  type: string | MarkType,
+  attrs: {},
+) => any
+
+declare module '../Editor' {
+  interface Editor {
+    updateMark: UpdateMark,
+  }
+}
+
+export default (next: Function, editor: Editor): UpdateMark => (typeOrName, attrs) => {
+  const { view, state, schema } = editor
+  const { tr, selection, doc } = state
+  let { from, to, $from, empty } = selection
+  const type = getMarkType(typeOrName, schema)
+
+  if (empty) {
+    const range = getMarkRange($from, type)
+
+    if (range) {
+      from = range.from
+      to = range.to
+    }
+  }
+
+  const hasMark = doc.rangeHasMark(from, to, type)
+
+  if (hasMark) {
+    tr.removeMark(from, to, type)
+  }
+
+  tr.addMark(from, to, type.create(attrs))
+  view.dispatch(tr)
+  next()
+}

From 8aca2852ba2f5a69517512a732c33e4c4c026e1d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 14:59:34 +0200
Subject: [PATCH 16/37] add deleteSelection command

---
 docs/src/data/posts/commands.md               |  4 ++++
 packages/core/src/Editor.ts                   |  1 +
 packages/core/src/commands/deleteSelection.ts | 15 +++++++++++++++
 3 files changed, 20 insertions(+)
 create mode 100644 packages/core/src/commands/deleteSelection.ts

diff --git a/docs/src/data/posts/commands.md b/docs/src/data/posts/commands.md
index 8e6f27da9..59492f46b 100644
--- a/docs/src/data/posts/commands.md
+++ b/docs/src/data/posts/commands.md
@@ -4,6 +4,10 @@
 
 Clear the whole document.
 
+## .deleteSelection()
+
+Delete the selection, if there is one.
+
 ## .focus()
 
 Focus the editor at the given position.
diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index 8b7a0b3fb..add815854 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -66,6 +66,7 @@ export class Editor extends EventEmitter {
     this.createSchema()
     this.createView()
     this.registerCommand('clearContent', require('./commands/clearContent').default)
+    this.registerCommand('deleteSelection', require('./commands/deleteSelection').default)
     this.registerCommand('focus', require('./commands/focus').default)
     this.registerCommand('insertHTML', require('./commands/insertHTML').default)
     this.registerCommand('insertText', require('./commands/insertText').default)
diff --git a/packages/core/src/commands/deleteSelection.ts b/packages/core/src/commands/deleteSelection.ts
new file mode 100644
index 000000000..1a67e0860
--- /dev/null
+++ b/packages/core/src/commands/deleteSelection.ts
@@ -0,0 +1,15 @@
+import { Editor } from '../Editor'
+import { deleteSelection } from 'prosemirror-commands'
+
+type DeleteSelection = () => any
+
+declare module '../Editor' {
+  interface Editor {
+    deleteSelection: DeleteSelection,
+  }
+}
+
+export default (next: Function, { state, view }: Editor): DeleteSelection => () => {
+  deleteSelection(state, view.dispatch)
+  next()
+}

From 7e0c0b7a282814f1f30d11df5b38130c2b2a1aa0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 19:01:39 +0200
Subject: [PATCH 17/37] fix a bug

---
 packages/core/src/utils/nodeIsActive.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/core/src/utils/nodeIsActive.ts b/packages/core/src/utils/nodeIsActive.ts
index e75a15785..9f8dd83fe 100644
--- a/packages/core/src/utils/nodeIsActive.ts
+++ b/packages/core/src/utils/nodeIsActive.ts
@@ -11,5 +11,5 @@ export default function nodeIsActive(state: EditorState, type: NodeType, attrs =
     return !!node
   }
 
-  return node.node.hasMarkup(type, attrs)
+  return node.node.hasMarkup(type, { ...node.node.attrs, ...attrs })
 }

From d8f041bc9ca8f47a1d00c8a9b663c4c229a9c888 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 21:23:24 +0200
Subject: [PATCH 18/37] add scrollable sidebar

---
 docs/src/layouts/App/base.scss  |  8 ++++++--
 docs/src/layouts/App/index.vue  | 28 +++++++++++++++-------------
 docs/src/layouts/App/style.scss | 20 +++++++++++++++++++-
 docs/src/variables.scss         |  1 +
 4 files changed, 41 insertions(+), 16 deletions(-)

diff --git a/docs/src/layouts/App/base.scss b/docs/src/layouts/App/base.scss
index f47ac757a..0cecf87f4 100644
--- a/docs/src/layouts/App/base.scss
+++ b/docs/src/layouts/App/base.scss
@@ -24,7 +24,11 @@
   border: 4px solid rgba(0, 0, 0, 0);
   background-clip: padding-box;
   border-radius: 8px;
-  background-color: $colorBlack;
+  background-color: rgba($colorBlack, 0);
+}
+
+:hover::-webkit-scrollbar-thumb {
+  background-color: rgba($colorBlack, 0.1);
 }
 
 ::-webkit-scrollbar-button {
@@ -48,7 +52,7 @@ body {
   -moz-osx-font-smoothing: grayscale;
   line-height: 1.7;
   font-feature-settings: 'cv05' 1;
-  background-color: rgba($colorBlack, 0.02);
+  background-color: $colorBackground;
   height: 100%;
 }
 
diff --git a/docs/src/layouts/App/index.vue b/docs/src/layouts/App/index.vue
index a1a2b6581..a4154f3bb 100644
--- a/docs/src/layouts/App/index.vue
+++ b/docs/src/layouts/App/index.vue
@@ -11,20 +11,22 @@
       />
     </header>
     <div class="app__content">
-      <nav class="app__sidebar">
-        <div class="app__link-group" v-for="(linkGroup, i) in linkGroups" :key="i">
-          <div class="app__link-group-title">
-            {{ linkGroup.title }}
+      <div class="app__sidebar-wrapper">
+        <nav class="app__sidebar">
+          <div class="app__link-group" v-for="(linkGroup, i) in linkGroups" :key="i">
+            <div class="app__link-group-title">
+              {{ linkGroup.title }}
+            </div>
+            <ul>
+              <li v-for="(item, j) in linkGroup.items" :key="j">
+                <g-link class="app__link" :to="item.link">
+                  {{ item.title }}
+                </g-link>
+              </li>
+            </ul>
           </div>
-          <ul>
-            <li v-for="(item, j) in linkGroup.items" :key="j">
-              <g-link class="app__link" :to="item.link">
-                {{ item.title }}
-              </g-link>
-            </li>
-          </ul>
-        </div>
-      </nav>
+        </nav>
+      </div>
       <main class="app__main">
         <slot/>
         <page-navigation />
diff --git a/docs/src/layouts/App/style.scss b/docs/src/layouts/App/style.scss
index 86705888b..6939d4121 100644
--- a/docs/src/layouts/App/style.scss
+++ b/docs/src/layouts/App/style.scss
@@ -51,26 +51,44 @@
   }
 
   &__header {
+    align-self: center;
+    position: fixed;
+    z-index: 2;
+    width: 100%;
+    top: 0;
     flex: 0 0 auto;
     align-items: center;
     justify-content: space-between;
     padding-top: 2rem;
     padding-bottom: 2rem;
+    background-color: rgba($colorBackground, 0.8);
+    backdrop-filter: blur(10px);
   }
 
   &__content {
     flex: 1 1 auto;
   }
 
-  &__sidebar {
+  &__sidebar-wrapper {
     flex: 0 0 auto;
+    align-self: flex-start;
+    position: sticky;
+    top: 0;
     width: 18rem;
+    height: 100vh;
     padding-right: 3rem;
+    padding-top: 100px;
+  }
+
+  &__sidebar {
+    overflow: auto;
+    height: 100%;
   }
 
   &__main {
     flex: 1 1 auto;
     min-width: 0;
+    padding-top: 100px;
   }
 
   &__inner {
diff --git a/docs/src/variables.scss b/docs/src/variables.scss
index bbb10d0ba..8badbfb93 100644
--- a/docs/src/variables.scss
+++ b/docs/src/variables.scss
@@ -1,5 +1,6 @@
 $colorWhite: #FFF;
 $colorBlack: #000;
+$colorBackground: mix($colorBlack, $colorWhite, 2%);
 
 /* Default Equations */
 $linear: cubic-bezier(0.250, 0.250, 0.750, 0.750);

From 1705ca8fb287e697f33ec0e7505bf3e8c3b81302 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 21:26:03 +0200
Subject: [PATCH 19/37] hide menu for now

---
 docs/src/layouts/App/style.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/docs/src/layouts/App/style.scss b/docs/src/layouts/App/style.scss
index 6939d4121..c1dd037b3 100644
--- a/docs/src/layouts/App/style.scss
+++ b/docs/src/layouts/App/style.scss
@@ -78,6 +78,10 @@
     height: 100vh;
     padding-right: 3rem;
     padding-top: 100px;
+
+    @media (max-width: 750px) {
+      display: none;
+    }
   }
 
   &__sidebar {

From 1537f4df3debe95f1756fc6a0712f416797c7237 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 21:57:26 +0200
Subject: [PATCH 20/37] improve layout

---
 docs/src/layouts/App/index.vue  | 18 +++++-----
 docs/src/layouts/App/style.scss | 63 ++++++++++++++++++++-------------
 2 files changed, 49 insertions(+), 32 deletions(-)

diff --git a/docs/src/layouts/App/index.vue b/docs/src/layouts/App/index.vue
index a4154f3bb..c3bad835b 100644
--- a/docs/src/layouts/App/index.vue
+++ b/docs/src/layouts/App/index.vue
@@ -1,14 +1,16 @@
 <template>
   <div class="app">
     <header class="app__header">
-      <g-link class="app__logo" to="/">
-        {{ $static.metadata.siteName }}
-      </g-link>
-      <github-button
-        href="https://github.com/scrumpy/tiptap"
-        data-show-count="true"
-        aria-label="Star scrumpy/tiptap on GitHub"
-      />
+      <div class="app__header-inner">
+        <g-link class="app__logo" to="/">
+          {{ $static.metadata.siteName }}
+        </g-link>
+        <github-button
+          href="https://github.com/scrumpy/tiptap"
+          data-show-count="true"
+          aria-label="Star scrumpy/tiptap on GitHub"
+        />
+      </div>
     </header>
     <div class="app__content">
       <div class="app__sidebar-wrapper">
diff --git a/docs/src/layouts/App/style.scss b/docs/src/layouts/App/style.scss
index c1dd037b3..d2fe2850f 100644
--- a/docs/src/layouts/App/style.scss
+++ b/docs/src/layouts/App/style.scss
@@ -1,3 +1,5 @@
+$navHeight: 4.5rem;
+
 .app {
   display: flex;
   flex-direction: column;
@@ -40,33 +42,49 @@
     }
   }
 
-  &__header,
-  &__content {
-    display: flex;
-    width: 100%;
-    max-width: 62rem;
-    margin: 0 auto;
-    padding-left: 2rem;
-    padding-right: 2rem;
-  }
-
   &__header {
     align-self: center;
     position: fixed;
-    z-index: 2;
-    width: 100%;
     top: 0;
+    z-index: 2;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: $navHeight;
     flex: 0 0 auto;
+    background-color: rgba($colorBackground, 0.8);
+    border-bottom: 1px solid rgba($colorBlack, 0.05);
+    backdrop-filter: blur(10px);
+  }
+  
+  &__header-inner {
+    width: 100%;
+    display: flex;
     align-items: center;
     justify-content: space-between;
-    padding-top: 2rem;
-    padding-bottom: 2rem;
-    background-color: rgba($colorBackground, 0.8);
-    backdrop-filter: blur(10px);
+    max-width: 62rem;
+    margin: 0 auto;
+    padding: 0 1rem;
+
+    @media (min-width: 750px) {
+      padding: 0 2rem;
+    }
   }
 
   &__content {
     flex: 1 1 auto;
+    display: flex;
+    width: 100%;
+    max-width: 62rem;
+    margin: 0 auto;
+    padding-left: 1rem;
+    padding-right: 1rem;
+
+    @media (min-width: 750px) {
+      padding-left: 2rem;
+      padding-right: 2rem;
+    }
   }
 
   &__sidebar-wrapper {
@@ -77,7 +95,7 @@
     width: 18rem;
     height: 100vh;
     padding-right: 3rem;
-    padding-top: 100px;
+    padding-top: $navHeight;
 
     @media (max-width: 750px) {
       display: none;
@@ -87,17 +105,14 @@
   &__sidebar {
     overflow: auto;
     height: 100%;
+    padding-top: 2rem;
+    padding-left: 0.5rem;
+    margin-left: -0.5rem;
   }
 
   &__main {
     flex: 1 1 auto;
     min-width: 0;
-    padding-top: 100px;
-  }
-
-  &__inner {
-    max-width: 62rem;
-    margin: 0 auto;
-    padding: 0 2rem;
+    padding-top: $navHeight + 2rem;
   }
 }
\ No newline at end of file

From 2804c92957c73219a511e22e316362b31362e5d2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 22 Apr 2020 22:09:01 +0200
Subject: [PATCH 21/37] refactoring

---
 docs/src/layouts/App/style.scss | 34 ++++++++++++++++++++++-----------
 1 file changed, 23 insertions(+), 11 deletions(-)

diff --git a/docs/src/layouts/App/style.scss b/docs/src/layouts/App/style.scss
index d2fe2850f..162141d72 100644
--- a/docs/src/layouts/App/style.scss
+++ b/docs/src/layouts/App/style.scss
@@ -73,6 +73,8 @@ $navHeight: 4.5rem;
   }
 
   &__content {
+    position: relative;
+    z-index: 1;
     flex: 1 1 auto;
     display: flex;
     width: 100%;
@@ -88,17 +90,27 @@ $navHeight: 4.5rem;
   }
 
   &__sidebar-wrapper {
-    flex: 0 0 auto;
-    align-self: flex-start;
-    position: sticky;
-    top: 0;
-    width: 18rem;
-    height: 100vh;
-    padding-right: 3rem;
-    padding-top: $navHeight;
-
-    @media (max-width: 750px) {
-      display: none;
+    position: fixed;
+    z-index: 2;
+    top: $navHeight;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background-color: $colorBackground;
+    padding-left: 1rem;
+    padding-right: 1rem;
+    
+    @media (min-width: 750px) {
+      position: sticky;
+      flex: 0 0 auto;
+      align-self: flex-start;
+      top: 0;
+      width: 18rem;
+      height: 100vh;
+      padding-left: 0;
+      padding-right: 0;
+      padding-right: 3rem;
+      padding-top: $navHeight;
     }
   }
 

From 378fc654b019474081707ae347cf4edabfbefa77 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Thu, 23 Apr 2020 12:22:59 +0200
Subject: [PATCH 22/37] add mobile menu icon

---
 docs/src/assets/icons/close.svg     |  3 +++
 docs/src/assets/icons/menu.svg      |  5 +++++
 docs/src/components/Icon/style.scss |  4 ++--
 docs/src/layouts/App/index.vue      | 31 +++++++++++++++++++++++------
 docs/src/layouts/App/style.scss     | 28 +++++++++++++++++++++++---
 5 files changed, 60 insertions(+), 11 deletions(-)
 create mode 100644 docs/src/assets/icons/close.svg
 create mode 100644 docs/src/assets/icons/menu.svg

diff --git a/docs/src/assets/icons/close.svg b/docs/src/assets/icons/close.svg
new file mode 100644
index 000000000..882ddfabe
--- /dev/null
+++ b/docs/src/assets/icons/close.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14.3 12.179C14.2767 12.1558 14.2583 12.1282 14.2456 12.0978C14.233 12.0674 14.2266 12.0349 14.2266 12.002C14.2266 11.9691 14.233 11.9366 14.2456 11.9062C14.2583 11.8758 14.2767 11.8482 14.3 11.825L19.563 6.563C19.8443 6.28134 20.0021 5.89948 20.0018 5.50144C20.0016 5.10339 19.8432 4.72176 19.5615 4.4405C19.2798 4.15924 18.898 4.00138 18.4999 4.00166C18.1019 4.00194 17.7203 4.16034 17.439 4.442L12.177 9.7C12.1538 9.72328 12.1262 9.74175 12.0958 9.75435C12.0654 9.76696 12.0329 9.77345 12 9.77345C11.9671 9.77345 11.9346 9.76696 11.9042 9.75435C11.8738 9.74175 11.8462 9.72328 11.823 9.7L6.561 4.442C6.42174 4.30267 6.25639 4.19213 6.07441 4.1167C5.89242 4.04127 5.69736 4.00242 5.50036 4.00237C5.1025 4.00228 4.7209 4.16024 4.4395 4.4415C4.15811 4.72276 3.99997 5.10429 3.99988 5.50214C3.99978 5.9 4.15774 6.2816 4.439 6.563L9.7 11.825C9.72329 11.8482 9.74176 11.8758 9.75436 11.9062C9.76696 11.9366 9.77345 11.9691 9.77345 12.002C9.77345 12.0349 9.76696 12.0674 9.75436 12.0978C9.74176 12.1282 9.72329 12.1558 9.7 12.179L4.43901 17.442C4.29974 17.5813 4.18928 17.7467 4.11393 17.9288C4.03859 18.1108 3.99983 18.3059 3.99988 18.5029C3.99997 18.9007 4.15811 19.2822 4.43951 19.5635C4.57884 19.7028 4.74424 19.8132 4.92626 19.8886C5.10828 19.9639 5.30336 20.0027 5.50036 20.0026C5.89822 20.0025 6.27974 19.8444 6.56101 19.563L11.823 14.3C11.8462 14.2767 11.8738 14.2582 11.9042 14.2456C11.9346 14.233 11.9671 14.2266 12 14.2266C12.0329 14.2266 12.0654 14.233 12.0958 14.2456C12.1262 14.2582 12.1538 14.2767 12.177 14.3L17.439 19.563C17.7203 19.8444 18.1018 20.0025 18.4997 20.0026C18.8975 20.0027 19.2791 19.8448 19.5605 19.5635C19.8419 19.2822 20 18.9007 20.0001 18.5029C20.0002 18.105 19.8423 17.7234 19.561 17.442L14.3 12.179Z" fill="black"/>
+</svg>
diff --git a/docs/src/assets/icons/menu.svg b/docs/src/assets/icons/menu.svg
new file mode 100644
index 000000000..8db03e660
--- /dev/null
+++ b/docs/src/assets/icons/menu.svg
@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22.5 2.5H1.5C0.947715 2.5 0.5 2.94772 0.5 3.5V4.5C0.5 5.05228 0.947715 5.5 1.5 5.5H22.5C23.0523 5.5 23.5 5.05228 23.5 4.5V3.5C23.5 2.94772 23.0523 2.5 22.5 2.5Z" fill="black"/>
+<path d="M22.5 10.5H1.5C0.947715 10.5 0.5 10.9477 0.5 11.5V12.5C0.5 13.0523 0.947715 13.5 1.5 13.5H22.5C23.0523 13.5 23.5 13.0523 23.5 12.5V11.5C23.5 10.9477 23.0523 10.5 22.5 10.5Z" fill="black"/>
+<path d="M22.5 18.5H1.5C0.947715 18.5 0.5 18.9477 0.5 19.5V20.5C0.5 21.0523 0.947715 21.5 1.5 21.5H22.5C23.0523 21.5 23.5 21.0523 23.5 20.5V19.5C23.5 18.9477 23.0523 18.5 22.5 18.5Z" fill="black"/>
+</svg>
diff --git a/docs/src/components/Icon/style.scss b/docs/src/components/Icon/style.scss
index 10ab355f7..45d0ef45b 100644
--- a/docs/src/components/Icon/style.scss
+++ b/docs/src/components/Icon/style.scss
@@ -1,7 +1,7 @@
 .icon {
   display: inline-flex;
-  width: 1.3rem;
-  height: 1.3rem;
+  width: 1.2rem;
+  height: 1.2rem;
 
   &::v-deep > svg {
     width: 100%;
diff --git a/docs/src/layouts/App/index.vue b/docs/src/layouts/App/index.vue
index c3bad835b..4dca02a25 100644
--- a/docs/src/layouts/App/index.vue
+++ b/docs/src/layouts/App/index.vue
@@ -5,15 +5,31 @@
         <g-link class="app__logo" to="/">
           {{ $static.metadata.siteName }}
         </g-link>
-        <github-button
-          href="https://github.com/scrumpy/tiptap"
-          data-show-count="true"
-          aria-label="Star scrumpy/tiptap on GitHub"
-        />
+        <div>
+          <github-button
+            href="https://github.com/scrumpy/tiptap"
+            data-show-count="true"
+            aria-label="Star scrumpy/tiptap on GitHub"
+          />
+          <button
+            class="app__menu-icon"
+            @click="menuIsVisible = true"
+            v-if="!menuIsVisible"
+          >
+            <icon name="menu" />
+          </button>
+          <button
+            class="app__close-icon"
+            @click="menuIsVisible = false"
+            v-if="menuIsVisible"
+          >
+            <icon name="close" />
+          </button>
+        </div>
       </div>
     </header>
     <div class="app__content">
-      <div class="app__sidebar-wrapper">
+      <div class="app__sidebar-wrapper" :class="{ 'is-mobile-visible': menuIsVisible }">
         <nav class="app__sidebar">
           <div class="app__link-group" v-for="(linkGroup, i) in linkGroups" :key="i">
             <div class="app__link-group-title">
@@ -47,11 +63,13 @@ query {
 
 <script>
 import linkGroups from '@/data/links.yaml'
+import Icon from '@/components/Icon'
 import PageNavigation from '@/components/PageNavigation'
 import GithubButton from 'vue-github-button'
 
 export default {
   components: {
+    Icon,
     PageNavigation,
     GithubButton,
   },
@@ -59,6 +77,7 @@ export default {
   data() {
     return {
       linkGroups,
+      menuIsVisible: false,
     }
   },
 }
diff --git a/docs/src/layouts/App/style.scss b/docs/src/layouts/App/style.scss
index 162141d72..251e2445a 100644
--- a/docs/src/layouts/App/style.scss
+++ b/docs/src/layouts/App/style.scss
@@ -1,4 +1,5 @@
 $navHeight: 4.5rem;
+$menuBreakPoint: 750px;
 
 .app {
   display: flex;
@@ -67,7 +68,7 @@ $navHeight: 4.5rem;
     margin: 0 auto;
     padding: 0 1rem;
 
-    @media (min-width: 750px) {
+    @media (min-width: $menuBreakPoint) {
       padding: 0 2rem;
     }
   }
@@ -83,12 +84,24 @@ $navHeight: 4.5rem;
     padding-left: 1rem;
     padding-right: 1rem;
 
-    @media (min-width: 750px) {
+    @media (min-width: $menuBreakPoint) {
       padding-left: 2rem;
       padding-right: 2rem;
     }
   }
 
+  &__menu-icon,
+  &__close-icon {
+    border: none;
+    padding: 0;
+    background-color: transparent;
+    margin-left: 1rem;
+
+    @media (min-width: $menuBreakPoint) {
+      display: none;
+    }
+  }
+
   &__sidebar-wrapper {
     position: fixed;
     z-index: 2;
@@ -99,8 +112,17 @@ $navHeight: 4.5rem;
     background-color: $colorBackground;
     padding-left: 1rem;
     padding-right: 1rem;
+    visibility: hidden;
+    opacity: 0;
+
+    &.is-mobile-visible {
+      visibility: visible;
+      opacity: 1;
+    }
     
-    @media (min-width: 750px) {
+    @media (min-width: $menuBreakPoint) {
+      visibility: visible;
+      opacity: 1;
       position: sticky;
       flex: 0 0 auto;
       align-self: flex-start;

From 5a1a289953ebff094da50acb5fa8b80c0a777e49 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Thu, 23 Apr 2020 13:25:33 +0200
Subject: [PATCH 23/37] add table styling

---
 docs/src/layouts/App/prism.scss       |  2 +-
 docs/src/templates/DocPage/style.scss | 36 +++++++++++++++++++++++++++
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/docs/src/layouts/App/prism.scss b/docs/src/layouts/App/prism.scss
index 6d2187eb7..6a811c57d 100644
--- a/docs/src/layouts/App/prism.scss
+++ b/docs/src/layouts/App/prism.scss
@@ -20,7 +20,7 @@ pre[class*="language-"] {
   color: inherit;
   text-shadow: none;
   font-family: 'JetBrainsMono', monospace;
-  font-size: 1em;
+  font-size: 0.95em;
   line-height: 1.8;
   tab-size: 2;
   padding: 0;
diff --git a/docs/src/templates/DocPage/style.scss b/docs/src/templates/DocPage/style.scss
index d1525691e..659c27178 100644
--- a/docs/src/templates/DocPage/style.scss
+++ b/docs/src/templates/DocPage/style.scss
@@ -106,5 +106,41 @@
         }
       }
     }
+
+    table {
+      width: 100%;
+      border-collapse: collapse;
+
+      th,
+      td {
+        text-align: left;
+        font-size: 0.75rem;
+        padding: 0.5rem;
+      }
+
+      th {
+        font-weight: 600;
+        background-color: rgba($colorBlack, 0.05);
+
+        &:first-child {
+          border-top-left-radius: 5px;
+          border-bottom-left-radius: 5px;
+        }
+
+        &:last-child {
+          border-top-right-radius: 5px;
+          border-bottom-right-radius: 5px;
+        }
+      }
+
+      td {
+        border-bottom: 1px solid rgba($colorBlack, 0.05);
+      }
+
+      tr:last-child td {
+        border-bottom: 0;
+      }
+    }
+
   }
 }
\ No newline at end of file

From 26aa34cc4066685229bf0d359d32b1e3fdfa48b6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Thu, 23 Apr 2020 15:37:19 +0200
Subject: [PATCH 24/37] add text

---
 docs/src/data/posts/schema.md | 58 +++++++++++++++++++++++++++++++++++
 1 file changed, 58 insertions(+)

diff --git a/docs/src/data/posts/schema.md b/docs/src/data/posts/schema.md
index 157ebeba9..cd7e8c87b 100644
--- a/docs/src/data/posts/schema.md
+++ b/docs/src/data/posts/schema.md
@@ -6,4 +6,62 @@ This schema is *very* strict. You can’t use any HTML-element or attribute that
 
 For example if you paste something like `This is <strong>important</strong>` into tiptap and don’t have registered any extension that handles `strong` tags, you’ll only see `This is important`.
 
+## How a schema looks like
 
+The most simple schema for a typical *ProseMirror* editor is looking something like that.
+
+```js
+{
+  nodes: {
+    document: {
+      content: 'block+',
+    },
+    paragraph: {
+      content: 'inline*',
+      group: 'block',
+      parseDOM: [{ tag: 'p' }],
+      toDOM: () => ['p', 0],
+    },
+    text: {
+      group: 'inline',
+    },
+  },
+}
+```
+
+In tiptap we split each node into its own `Extension` class instead.
+
+```js
+class Document extends Node {
+  name = 'document'
+
+  schema() {
+    return {
+      content: 'block+',
+    }
+  }
+}
+
+class Paragraph extends Node {
+  name = 'paragraph'
+
+  schema() {
+    return {
+      content: 'inline*',
+      group: 'block',
+      parseDOM: [{ tag: 'p' }],
+      toDOM: () => ['p', 0],
+    }
+  }
+}
+
+class Text extends Node {
+  name = 'text'
+
+  schema() {
+    return {
+      group: 'inline',
+    }
+  }
+}
+```

From c2bd2b21fa9b77790585a8821fb4eed9e6c0d96f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Thu, 23 Apr 2020 22:10:45 +0200
Subject: [PATCH 25/37] refactoring

---
 packages/extension-paragraph/index.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/extension-paragraph/index.ts b/packages/extension-paragraph/index.ts
index f3b5cf0c2..f85259a99 100644
--- a/packages/extension-paragraph/index.ts
+++ b/packages/extension-paragraph/index.ts
@@ -9,7 +9,6 @@ export default class Paragraph extends Node {
     return {
       content: 'inline*',
       group: 'block',
-      draggable: false,
       parseDOM: [{ tag: 'p' }],
       toDOM: () => ['p', 0],
     }

From 3470a7be1c9eb0e5869beb5356453cbe10ec3256 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Fri, 24 Apr 2020 09:32:37 +0200
Subject: [PATCH 26/37] add basic support for components

---
 packages/core/src/ComponentView.ts         | 29 ++++++++++++++++++++++
 packages/core/src/Editor.ts                |  2 ++
 packages/core/src/ExtensionManager.ts      | 19 ++++++++++++++
 packages/extension-paragraph/index.ts      |  2 ++
 packages/extension-paragraph/paragraph.vue |  9 +++++++
 shims/vue.d.ts                             |  4 +++
 tsconfig.json                              |  3 +++
 7 files changed, 68 insertions(+)
 create mode 100644 packages/core/src/ComponentView.ts
 create mode 100644 packages/extension-paragraph/paragraph.vue
 create mode 100644 shims/vue.d.ts

diff --git a/packages/core/src/ComponentView.ts b/packages/core/src/ComponentView.ts
new file mode 100644
index 000000000..dc2fb7898
--- /dev/null
+++ b/packages/core/src/ComponentView.ts
@@ -0,0 +1,29 @@
+import Vue from 'vue'
+
+export default class ComponentView {
+  // @ts-ignore
+  constructor(component, options) {
+    // @ts-ignore
+    this.component = component
+    // @ts-ignore
+    this.dom = this.createDOM()
+    // @ts-ignore
+    this.contentDOM = this.vm.$refs.content
+  }
+
+  createDOM() {
+    // @ts-ignore
+    const Component = Vue.extend(this.component)
+
+    // @ts-ignore
+    this.vm = new Component({
+      // parent: this.parent,
+      // propsData: props,
+    }).$mount()
+
+    // @ts-ignore
+    return this.vm.$el
+  }
+
+}
+
diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index add815854..e82566150 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -170,6 +170,8 @@ export class Editor extends EventEmitter {
         plugins: this.plugins,
       }),
       dispatchTransaction: this.dispatchTransaction.bind(this),
+      // @ts-ignore
+      nodeViews: this.extensionManager.nodeViews,
     })
   }
 
diff --git a/packages/core/src/ExtensionManager.ts b/packages/core/src/ExtensionManager.ts
index 9b81746fd..69a82519d 100644
--- a/packages/core/src/ExtensionManager.ts
+++ b/packages/core/src/ExtensionManager.ts
@@ -1,9 +1,11 @@
 import collect from 'collect.js'
 import { keymap } from 'prosemirror-keymap'
 import { inputRules } from 'prosemirror-inputrules'
+import { NodeSpec } from 'prosemirror-model'
 import { Editor, CommandSpec } from './Editor'
 import Extension from './Extension'
 import Node from './Node'
+import ComponentView from './ComponentView'
 
 export default class ExtensionManager {
 
@@ -85,4 +87,21 @@ export default class ExtensionManager {
       .toArray()
   }
 
+  get nodeViews() {
+    return collect(this.nodes)
+      .filter((schema: any) => schema.toVue)
+      .map((schema: any) => {
+        // @ts-ignore
+        return (node, view, getPos, decorations) => {
+          return new ComponentView(schema.toVue, {
+            node,
+            view,
+            getPos,
+            decorations,
+          })
+        }
+      })
+      .all()
+  }
+
 }
diff --git a/packages/extension-paragraph/index.ts b/packages/extension-paragraph/index.ts
index f85259a99..1f324adf3 100644
--- a/packages/extension-paragraph/index.ts
+++ b/packages/extension-paragraph/index.ts
@@ -1,5 +1,6 @@
 import { Node } from '@tiptap/core'
 import { NodeSpec } from 'prosemirror-model'
+import ParagraphComponent from './paragraph.vue'
 
 export default class Paragraph extends Node {
 
@@ -11,6 +12,7 @@ export default class Paragraph extends Node {
       group: 'block',
       parseDOM: [{ tag: 'p' }],
       toDOM: () => ['p', 0],
+      // toVue: ParagraphComponent,
     }
   }
 
diff --git a/packages/extension-paragraph/paragraph.vue b/packages/extension-paragraph/paragraph.vue
new file mode 100644
index 000000000..07efc691a
--- /dev/null
+++ b/packages/extension-paragraph/paragraph.vue
@@ -0,0 +1,9 @@
+<template>
+  <p ref="content"></p>
+</template>
+
+<script>
+export default {
+
+}
+</script>
\ No newline at end of file
diff --git a/shims/vue.d.ts b/shims/vue.d.ts
new file mode 100644
index 000000000..e6cf1b160
--- /dev/null
+++ b/shims/vue.d.ts
@@ -0,0 +1,4 @@
+declare module "*.vue" {
+  import Vue from "vue";
+  export default Vue;
+}
\ No newline at end of file
diff --git a/tsconfig.json b/tsconfig.json
index f6e4e023e..83fac464f 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -25,6 +25,9 @@
       "scripthost"
     ]
   },
+  "files": [
+    "./shims/vue.d.ts"
+  ],
   "include": [
     "docs/src/**/*.ts",
     "docs/src/**/*.tsx",

From 397de08db04e268ada38e0fcbc6a3cc62b9ac15d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Fri, 24 Apr 2020 09:57:51 +0200
Subject: [PATCH 27/37] wording

---
 docs/src/data/posts/schema.md | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/docs/src/data/posts/schema.md b/docs/src/data/posts/schema.md
index cd7e8c87b..47377afa5 100644
--- a/docs/src/data/posts/schema.md
+++ b/docs/src/data/posts/schema.md
@@ -29,7 +29,9 @@ The most simple schema for a typical *ProseMirror* editor is looking something l
 }
 ```
 
-In tiptap we split each node into its own `Extension` class instead.
+We register three nodes here. `document`, `paragraph` and `text`. `document` is the root node which allows multiple block nodes as children (`content: 'block+'`). Since `paragraph` is in the group of block nodes (`group: 'block'`) our document can only contain paragraphs. Our paragraphs allow zero or more inline nodes as children (`content: 'inline*'`) so there can only be `text` in it. `parseDOM` defines how a node can be parsed from pasted HTML. `toDOM` defines how it will be rendered in the DOM.
+
+In tiptap we define every node in its own `Extension` class instead. This allows us to split logic per node. Under the hood the schema will be merged together.
 
 ```js
 class Document extends Node {

From 0f0b92b6725dbb6c1085772a371ad66cf8e920c3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Fri, 24 Apr 2020 10:03:15 +0200
Subject: [PATCH 28/37] restructuring

---
 docs/gridsome.config.js                               | 2 +-
 docs/src/components/PageNavigation/index.vue          | 2 +-
 docs/src/{data/posts => docPages}/advanced-example.md | 0
 docs/src/{data/posts => docPages}/basic-example.md    | 0
 docs/src/{data/posts => docPages}/commands.md         | 0
 docs/src/{data/posts => docPages}/editor.md           | 0
 docs/src/{data/posts => docPages}/events.md           | 0
 docs/src/{data/posts => docPages}/extensions.md       | 0
 docs/src/{data/posts => docPages}/installation.md     | 0
 docs/src/{data/posts => docPages}/introduction.md     | 0
 docs/src/{data/posts => docPages}/licensing.md        | 0
 docs/src/{data/posts => docPages}/react.md            | 0
 docs/src/{data/posts => docPages}/renderless.md       | 0
 docs/src/{data/posts => docPages}/schema.md           | 1 +
 docs/src/layouts/App/index.vue                        | 2 +-
 docs/src/layouts/README.md                            | 5 -----
 docs/src/{data => }/links.yaml                        | 0
 docs/src/pages/README.md                              | 5 -----
 docs/src/templates/README.md                          | 7 -------
 docs/static/README.md                                 | 3 ---
 20 files changed, 4 insertions(+), 23 deletions(-)
 rename docs/src/{data/posts => docPages}/advanced-example.md (100%)
 rename docs/src/{data/posts => docPages}/basic-example.md (100%)
 rename docs/src/{data/posts => docPages}/commands.md (100%)
 rename docs/src/{data/posts => docPages}/editor.md (100%)
 rename docs/src/{data/posts => docPages}/events.md (100%)
 rename docs/src/{data/posts => docPages}/extensions.md (100%)
 rename docs/src/{data/posts => docPages}/installation.md (100%)
 rename docs/src/{data/posts => docPages}/introduction.md (100%)
 rename docs/src/{data/posts => docPages}/licensing.md (100%)
 rename docs/src/{data/posts => docPages}/react.md (100%)
 rename docs/src/{data/posts => docPages}/renderless.md (100%)
 rename docs/src/{data/posts => docPages}/schema.md (99%)
 delete mode 100644 docs/src/layouts/README.md
 rename docs/src/{data => }/links.yaml (100%)
 delete mode 100644 docs/src/pages/README.md
 delete mode 100644 docs/src/templates/README.md
 delete mode 100644 docs/static/README.md

diff --git a/docs/gridsome.config.js b/docs/gridsome.config.js
index 769884bc4..c69c0b537 100644
--- a/docs/gridsome.config.js
+++ b/docs/gridsome.config.js
@@ -19,7 +19,7 @@ module.exports = {
       use: '@gridsome/vue-remark',
       options: {
         typeName: 'DocPage',
-        baseDir: './src/data/posts',
+        baseDir: './src/docPages',
         template: './src/templates/DocPage',
         plugins: [
           '@gridsome/remark-prismjs',
diff --git a/docs/src/components/PageNavigation/index.vue b/docs/src/components/PageNavigation/index.vue
index 3bf39af75..eb3a5e111 100644
--- a/docs/src/components/PageNavigation/index.vue
+++ b/docs/src/components/PageNavigation/index.vue
@@ -24,7 +24,7 @@
 </template>
 
 <script>
-import linkGroups from '@/data/links.yaml'
+import linkGroups from '@/links.yaml'
 
 export default {
   data() {
diff --git a/docs/src/data/posts/advanced-example.md b/docs/src/docPages/advanced-example.md
similarity index 100%
rename from docs/src/data/posts/advanced-example.md
rename to docs/src/docPages/advanced-example.md
diff --git a/docs/src/data/posts/basic-example.md b/docs/src/docPages/basic-example.md
similarity index 100%
rename from docs/src/data/posts/basic-example.md
rename to docs/src/docPages/basic-example.md
diff --git a/docs/src/data/posts/commands.md b/docs/src/docPages/commands.md
similarity index 100%
rename from docs/src/data/posts/commands.md
rename to docs/src/docPages/commands.md
diff --git a/docs/src/data/posts/editor.md b/docs/src/docPages/editor.md
similarity index 100%
rename from docs/src/data/posts/editor.md
rename to docs/src/docPages/editor.md
diff --git a/docs/src/data/posts/events.md b/docs/src/docPages/events.md
similarity index 100%
rename from docs/src/data/posts/events.md
rename to docs/src/docPages/events.md
diff --git a/docs/src/data/posts/extensions.md b/docs/src/docPages/extensions.md
similarity index 100%
rename from docs/src/data/posts/extensions.md
rename to docs/src/docPages/extensions.md
diff --git a/docs/src/data/posts/installation.md b/docs/src/docPages/installation.md
similarity index 100%
rename from docs/src/data/posts/installation.md
rename to docs/src/docPages/installation.md
diff --git a/docs/src/data/posts/introduction.md b/docs/src/docPages/introduction.md
similarity index 100%
rename from docs/src/data/posts/introduction.md
rename to docs/src/docPages/introduction.md
diff --git a/docs/src/data/posts/licensing.md b/docs/src/docPages/licensing.md
similarity index 100%
rename from docs/src/data/posts/licensing.md
rename to docs/src/docPages/licensing.md
diff --git a/docs/src/data/posts/react.md b/docs/src/docPages/react.md
similarity index 100%
rename from docs/src/data/posts/react.md
rename to docs/src/docPages/react.md
diff --git a/docs/src/data/posts/renderless.md b/docs/src/docPages/renderless.md
similarity index 100%
rename from docs/src/data/posts/renderless.md
rename to docs/src/docPages/renderless.md
diff --git a/docs/src/data/posts/schema.md b/docs/src/docPages/schema.md
similarity index 99%
rename from docs/src/data/posts/schema.md
rename to docs/src/docPages/schema.md
index 47377afa5..0e190b82d 100644
--- a/docs/src/data/posts/schema.md
+++ b/docs/src/docPages/schema.md
@@ -36,6 +36,7 @@ In tiptap we define every node in its own `Extension` class instead. This allows
 ```js
 class Document extends Node {
   name = 'document'
+  topNode = true
 
   schema() {
     return {
diff --git a/docs/src/layouts/App/index.vue b/docs/src/layouts/App/index.vue
index 4dca02a25..930ecda07 100644
--- a/docs/src/layouts/App/index.vue
+++ b/docs/src/layouts/App/index.vue
@@ -62,7 +62,7 @@ query {
 </static-query>
 
 <script>
-import linkGroups from '@/data/links.yaml'
+import linkGroups from '@/links.yaml'
 import Icon from '@/components/Icon'
 import PageNavigation from '@/components/PageNavigation'
 import GithubButton from 'vue-github-button'
diff --git a/docs/src/layouts/README.md b/docs/src/layouts/README.md
deleted file mode 100644
index 3d5d03e9a..000000000
--- a/docs/src/layouts/README.md
+++ /dev/null
@@ -1,5 +0,0 @@
-Layout components are used to wrap pages and templates. Layouts should contain components like headers, footers or sidebars that will be used across the site.
-
-Learn more about Layouts: https://gridsome.org/docs/layouts/
-
-You can delete this file.
diff --git a/docs/src/data/links.yaml b/docs/src/links.yaml
similarity index 100%
rename from docs/src/data/links.yaml
rename to docs/src/links.yaml
diff --git a/docs/src/pages/README.md b/docs/src/pages/README.md
deleted file mode 100644
index bc41c2749..000000000
--- a/docs/src/pages/README.md
+++ /dev/null
@@ -1,5 +0,0 @@
-Pages are usually used for normal pages or for listing items from a GraphQL collection.
-Add .vue files here to create pages. For example **About.vue** will be **site.com/about**.
-Learn more about pages: https://gridsome.org/docs/pages/
-
-You can delete this file.
diff --git a/docs/src/templates/README.md b/docs/src/templates/README.md
deleted file mode 100644
index e9ada1e3d..000000000
--- a/docs/src/templates/README.md
+++ /dev/null
@@ -1,7 +0,0 @@
-Templates for **GraphQL collections** should be added here.
-To create a template for a collection called `WordPressPost`
-create a file named `WordPressPost.vue` in this folder.
-
-Learn more: https://gridsome.org/docs/templates/
-
-You can delete this file.
diff --git a/docs/static/README.md b/docs/static/README.md
deleted file mode 100644
index 1dd0aae42..000000000
--- a/docs/static/README.md
+++ /dev/null
@@ -1,3 +0,0 @@
-Add static files here. Files in this directory will be copied directly to `dist` folder during build. For example, /static/robots.txt will be located at https://yoursite.com/robots.txt.
-
-This file should be deleted.
\ No newline at end of file

From f327be30bc5502258672839b08ac28675a8150ad Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Fri, 24 Apr 2020 10:05:07 +0200
Subject: [PATCH 29/37] wording

---
 docs/src/docPages/schema.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/src/docPages/schema.md b/docs/src/docPages/schema.md
index 0e190b82d..5086ca400 100644
--- a/docs/src/docPages/schema.md
+++ b/docs/src/docPages/schema.md
@@ -29,7 +29,7 @@ The most simple schema for a typical *ProseMirror* editor is looking something l
 }
 ```
 
-We register three nodes here. `document`, `paragraph` and `text`. `document` is the root node which allows multiple block nodes as children (`content: 'block+'`). Since `paragraph` is in the group of block nodes (`group: 'block'`) our document can only contain paragraphs. Our paragraphs allow zero or more inline nodes as children (`content: 'inline*'`) so there can only be `text` in it. `parseDOM` defines how a node can be parsed from pasted HTML. `toDOM` defines how it will be rendered in the DOM.
+We register three nodes here. `document`, `paragraph` and `text`. `document` is the root node which allows one or more block nodes as children (`content: 'block+'`). Since `paragraph` is in the group of block nodes (`group: 'block'`) our document can only contain paragraphs. Our paragraphs allow zero or more inline nodes as children (`content: 'inline*'`) so there can only be `text` in it. `parseDOM` defines how a node can be parsed from pasted HTML. `toDOM` defines how it will be rendered in the DOM.
 
 In tiptap we define every node in its own `Extension` class instead. This allows us to split logic per node. Under the hood the schema will be merged together.
 

From 3cca79b9609456b03d0612d532657d0cdfff4875 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Fri, 24 Apr 2020 12:23:29 +0200
Subject: [PATCH 30/37] refactoring

---
 packages/core/src/ComponentView.ts | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/packages/core/src/ComponentView.ts b/packages/core/src/ComponentView.ts
index dc2fb7898..e7f483678 100644
--- a/packages/core/src/ComponentView.ts
+++ b/packages/core/src/ComponentView.ts
@@ -3,27 +3,30 @@ import Vue from 'vue'
 export default class ComponentView {
   // @ts-ignore
   constructor(component, options) {
-    // @ts-ignore
-    this.component = component
-    // @ts-ignore
-    this.dom = this.createDOM()
-    // @ts-ignore
-    this.contentDOM = this.vm.$refs.content
+    this.mount(component)
   }
 
-  createDOM() {
+  // @ts-ignore
+  mount(component) {
     // @ts-ignore
-    const Component = Vue.extend(this.component)
+    const Component = Vue.extend(component)
 
     // @ts-ignore
     this.vm = new Component({
       // parent: this.parent,
       // propsData: props,
     }).$mount()
+  }
 
+  get dom() {
     // @ts-ignore
     return this.vm.$el
   }
 
+  get contentDOM() {
+    // @ts-ignore
+    return this.vm.$refs.content
+  }
+
 }
 

From 30d53d33a56eddbb1f5d630c0f05d8846190b6a9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Sat, 25 Apr 2020 22:40:38 +0200
Subject: [PATCH 31/37] move componentrenderer

---
 docs/src/demos/Basic/index.vue                |  3 ++-
 packages/core/index.ts                        |  1 +
 packages/core/src/ComponentRenderer.ts        |  3 +++
 packages/core/src/Editor.ts                   |  2 ++
 packages/core/src/ExtensionManager.ts         | 25 ++++++++++++++-----
 packages/core/src/utils/capitalize.ts         |  3 +++
 packages/extension-paragraph/index.ts         |  2 +-
 packages/extension-paragraph/paragraph.vue    |  2 +-
 packages/vue/index.ts                         |  3 ++-
 packages/vue/package.json                     |  1 +
 .../ComponentView.ts => vue/src/Renderer.ts}  | 19 +++++++-------
 11 files changed, 45 insertions(+), 19 deletions(-)
 create mode 100644 packages/core/src/ComponentRenderer.ts
 create mode 100644 packages/core/src/utils/capitalize.ts
 rename packages/{core/src/ComponentView.ts => vue/src/Renderer.ts} (56%)

diff --git a/docs/src/demos/Basic/index.vue b/docs/src/demos/Basic/index.vue
index 74ed259d9..2eb691c67 100644
--- a/docs/src/demos/Basic/index.vue
+++ b/docs/src/demos/Basic/index.vue
@@ -4,7 +4,7 @@
 
 <script>
 import { Editor } from '@tiptap/core'
-import { EditorContent } from '@tiptap/vue'
+import { EditorContent, Renderer } from '@tiptap/vue'
 import extensions from '@tiptap/starter-kit'
 
 export default {
@@ -22,6 +22,7 @@ export default {
     this.editor = new Editor({
       content: '<p>foo</p>',
       extensions: extensions(),
+      renderer: Renderer,
     })
   },
 
diff --git a/packages/core/index.ts b/packages/core/index.ts
index c0b7b0d9f..f82559e84 100644
--- a/packages/core/index.ts
+++ b/packages/core/index.ts
@@ -2,6 +2,7 @@ import { Editor, CommandSpec } from './src/Editor'
 
 export default Editor
 export { Editor, CommandSpec }
+export { default as ComponentRenderer } from './src/ComponentRenderer'
 export { default as Extension } from './src/Extension'
 export { default as Node } from './src/Node'
 export { default as Mark } from './src/Mark'
diff --git a/packages/core/src/ComponentRenderer.ts b/packages/core/src/ComponentRenderer.ts
new file mode 100644
index 000000000..5cf455870
--- /dev/null
+++ b/packages/core/src/ComponentRenderer.ts
@@ -0,0 +1,3 @@
+export default abstract class ComponentRenderer {
+
+}
\ No newline at end of file
diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index e82566150..5666b66cc 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -34,6 +34,7 @@ interface EditorOptions {
   content: EditorContent
   extensions: (Extension | Node | Mark)[]
   injectCSS: Boolean,
+  renderer: any,
 }
 
 @magicMethods
@@ -50,6 +51,7 @@ export class Editor extends EventEmitter {
     content: '',
     injectCSS: true,
     extensions: [],
+    renderer: null,
   }
   
   private lastCommand = Promise.resolve()
diff --git a/packages/core/src/ExtensionManager.ts b/packages/core/src/ExtensionManager.ts
index 69a82519d..d260d9988 100644
--- a/packages/core/src/ExtensionManager.ts
+++ b/packages/core/src/ExtensionManager.ts
@@ -1,11 +1,12 @@
 import collect from 'collect.js'
 import { keymap } from 'prosemirror-keymap'
 import { inputRules } from 'prosemirror-inputrules'
-import { NodeSpec } from 'prosemirror-model'
+import { EditorView, Decoration } from 'prosemirror-view'
+import { Node as ProsemirrorNode } from 'prosemirror-model'
 import { Editor, CommandSpec } from './Editor'
 import Extension from './Extension'
 import Node from './Node'
-import ComponentView from './ComponentView'
+import capitalize from './utils/capitalize'
 
 export default class ExtensionManager {
 
@@ -88,12 +89,24 @@ export default class ExtensionManager {
   }
 
   get nodeViews() {
+    const { renderer: Renderer } = this.editor.options
+
+    if (!Renderer || !Renderer.type) {
+      return {}
+    }
+
+    const prop = `to${capitalize(Renderer.type)}`
+
     return collect(this.nodes)
-      .filter((schema: any) => schema.toVue)
+      .filter((schema: any) => schema[prop])
       .map((schema: any) => {
-        // @ts-ignore
-        return (node, view, getPos, decorations) => {
-          return new ComponentView(schema.toVue, {
+        return (
+          node: ProsemirrorNode,
+          view: EditorView,
+          getPos: (() => number) | boolean,
+          decorations: Decoration[],
+        ) => {
+          return new Renderer(schema[prop], {
             node,
             view,
             getPos,
diff --git a/packages/core/src/utils/capitalize.ts b/packages/core/src/utils/capitalize.ts
new file mode 100644
index 000000000..43abafe6e
--- /dev/null
+++ b/packages/core/src/utils/capitalize.ts
@@ -0,0 +1,3 @@
+export default function capitalize(value: string = ''): string {
+  return value.charAt(0).toUpperCase() + value.slice(1)
+}
\ No newline at end of file
diff --git a/packages/extension-paragraph/index.ts b/packages/extension-paragraph/index.ts
index 1f324adf3..2631c8787 100644
--- a/packages/extension-paragraph/index.ts
+++ b/packages/extension-paragraph/index.ts
@@ -12,7 +12,7 @@ export default class Paragraph extends Node {
       group: 'block',
       parseDOM: [{ tag: 'p' }],
       toDOM: () => ['p', 0],
-      // toVue: ParagraphComponent,
+      toVue: ParagraphComponent,
     }
   }
 
diff --git a/packages/extension-paragraph/paragraph.vue b/packages/extension-paragraph/paragraph.vue
index 07efc691a..be3b6ae6b 100644
--- a/packages/extension-paragraph/paragraph.vue
+++ b/packages/extension-paragraph/paragraph.vue
@@ -1,5 +1,5 @@
 <template>
-  <p ref="content"></p>
+  <p data-component="yeah" ref="content"></p>
 </template>
 
 <script>
diff --git a/packages/vue/index.ts b/packages/vue/index.ts
index 6c391ee88..c6a375a83 100644
--- a/packages/vue/index.ts
+++ b/packages/vue/index.ts
@@ -1 +1,2 @@
-export { default as EditorContent } from './src/components/EditorContent'
\ No newline at end of file
+export { default as EditorContent } from './src/components/EditorContent'
+export { default as Renderer } from './src/Renderer'
diff --git a/packages/vue/package.json b/packages/vue/package.json
index 529efb503..46d718ebb 100644
--- a/packages/vue/package.json
+++ b/packages/vue/package.json
@@ -12,6 +12,7 @@
     "dist"
   ],
   "peerDependencies": {
+    "@tiptap/core": "2.x",
     "vue": "2.x"
   }
 }
diff --git a/packages/core/src/ComponentView.ts b/packages/vue/src/Renderer.ts
similarity index 56%
rename from packages/core/src/ComponentView.ts
rename to packages/vue/src/Renderer.ts
index e7f483678..88519bd6c 100644
--- a/packages/core/src/ComponentView.ts
+++ b/packages/vue/src/Renderer.ts
@@ -1,17 +1,20 @@
 import Vue from 'vue'
+import { ComponentRenderer } from '@tiptap/core'
 
-export default class ComponentView {
-  // @ts-ignore
-  constructor(component, options) {
+export default class Renderer extends ComponentRenderer {
+
+  static type: string = 'vue'
+
+  vm!: Vue
+  
+  constructor(component: Vue, options: any) {
+    super()
     this.mount(component)
   }
 
-  // @ts-ignore
-  mount(component) {
-    // @ts-ignore
+  mount(component: Vue) {
     const Component = Vue.extend(component)
 
-    // @ts-ignore
     this.vm = new Component({
       // parent: this.parent,
       // propsData: props,
@@ -19,12 +22,10 @@ export default class ComponentView {
   }
 
   get dom() {
-    // @ts-ignore
     return this.vm.$el
   }
 
   get contentDOM() {
-    // @ts-ignore
     return this.vm.$refs.content
   }
 

From 7db27864cc5d10a36f5b7dcedd24fce5471ba1a6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Sun, 26 Apr 2020 23:04:55 +0200
Subject: [PATCH 32/37] update lock

---
 yarn.lock | 182 +++++++++++++++++++++++++++---------------------------
 1 file changed, 91 insertions(+), 91 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index afcd7e3d1..179ba6bfd 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1858,9 +1858,9 @@
     glob-to-regexp "^0.3.0"
 
 "@mvasilkov/outdent@^1.0.4":
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/@mvasilkov/outdent/-/outdent-1.0.4.tgz#156c7a598e08b6645272b01752fc1cff02c0f1b3"
-  integrity sha512-JK4e71HtX+VG9abeTmo1ARU12G9h65CjrxFFDHfr5vgJqB31Vv6czFa9ymcZ7MMmU1h98Gkrz1IOrZNhm49g4w==
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/@mvasilkov/outdent/-/outdent-1.0.5.tgz#081e9fec4d3acae330d75ac4546cf4289f956cd4"
+  integrity sha512-jd7927l+hvKR6KZ/fc5MKh0qT1YtLU40HCDzRuWcESYGkRAcR/fr5D5It7gKM5vLlgjlAiJilfLLmd84XAfI9Q==
 
 "@nodelib/fs.scandir@2.1.3":
   version "2.1.3"
@@ -1984,9 +1984,9 @@
     universal-user-agent "^4.0.0"
 
 "@octokit/types@^2.0.0", "@octokit/types@^2.0.1", "@octokit/types@^2.11.1":
-  version "2.11.1"
-  resolved "https://registry.yarnpkg.com/@octokit/types/-/types-2.11.1.tgz#bd5b059596b42845be3f8e66065667aff8c8bf8b"
-  integrity sha512-QaLoLkmFdfoNbk3eOzPv7vKrUY0nRJIYmZDoz/pTer4ICpqu80aSQTVHnnUxEFuURCiidig76CcxUOYC/bY3RQ==
+  version "2.12.1"
+  resolved "https://registry.yarnpkg.com/@octokit/types/-/types-2.12.1.tgz#4a26b4a85ec121043d3b0745b5798f9d8fd968ca"
+  integrity sha512-LRLR1tjbcCfAmUElvTmMvLEzstpx6Xt/aQVTg2xvd+kHA2Ekp1eWl5t+gU7bcwjXHYEAzh4hH4WH+kS3vh+wRw==
   dependencies:
     "@types/node" ">= 8"
 
@@ -2104,9 +2104,9 @@
   integrity sha512-NYrtPht0wGzhwe9+/idPaBB+TqkY9AhTvOLMkThm0IoEfLaiVQZwBwyJ5puCkO3AUCWrmcoePjp2mbFocKy4SQ==
 
 "@types/node@*", "@types/node@>= 8":
-  version "13.13.0"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-13.13.0.tgz#30d2d09f623fe32cde9cb582c7a6eda2788ce4a8"
-  integrity sha512-WE4IOAC6r/yBZss1oQGM5zs2D7RuKR6Q+w+X2SouPofnWn+LbCqClRyhO3ZE7Ix8nmFgo/oVuuE01cJT2XB13A==
+  version "13.13.4"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-13.13.4.tgz#1581d6c16e3d4803eb079c87d4ac893ee7501c2c"
+  integrity sha512-x26ur3dSXgv5AwKS0lNfbjpCakGIduWU1DU91Zz58ONRWrIKGunmZBNv4P7N+e27sJkiGDsw/3fT4AtsqQBrBA==
 
 "@types/orderedmap@*":
   version "1.0.0"
@@ -2578,7 +2578,7 @@ acorn-jsx@^5.0.1:
   resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.2.0.tgz#4c66069173d6fdd68ed85239fc256226182b2ebe"
   integrity sha512-HiUX/+K2YpkpJ+SzBffkM/AQ2YE03S0U1kjTLVpoJdhZMOWy8qvXVN9JdLqv2QsaQ6MPYQIuNmwD8zOiYUofLQ==
 
-acorn@^6.1.1, acorn@^6.2.1:
+acorn@^6.1.1, acorn@^6.4.1:
   version "6.4.1"
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-6.4.1.tgz#531e58ba3f51b9dacb9a6646ca4debf5b14ca474"
   integrity sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA==
@@ -2964,9 +2964,9 @@ babel-loader@8.0.5:
     util.promisify "^1.0.0"
 
 babel-plugin-dynamic-import-node@^2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-2.3.0.tgz#f00f507bdaa3c3e3ff6e7e5e98d90a7acab96f7f"
-  integrity sha512-o6qFkpeQEBxcqt0XYlWzAVxNCSCZdUgcR8IRlhD/8DylxjjO4foPcvTW0GGKa/cVt3rvxZ7o5ippJ+/0nvLhlQ==
+  version "2.3.3"
+  resolved "https://registry.yarnpkg.com/babel-plugin-dynamic-import-node/-/babel-plugin-dynamic-import-node-2.3.3.tgz#84fda19c976ec5c6defef57f9427b3def66e17a3"
+  integrity sha512-jZVI+s9Zg3IqA/kdi0i6UDCybUI3aSBLnglhYbSSjKlV7yF1F/5LWv8MakQmvYpnbJDS6fcBL2KzHSxNCMtWSQ==
   dependencies:
     object.assign "^4.1.0"
 
@@ -3285,12 +3285,12 @@ browserslist@^1.3.6, browserslist@^1.5.2, browserslist@^1.7.6:
     electron-to-chromium "^1.2.7"
 
 browserslist@^4.0.0, browserslist@^4.11.1, browserslist@^4.8.5, browserslist@^4.9.1:
-  version "4.11.1"
-  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.11.1.tgz#92f855ee88d6e050e7e7311d987992014f1a1f1b"
-  integrity sha512-DCTr3kDrKEYNw6Jb9HFxVLQNaue8z+0ZfRBRjmCunKDEXEBajKDj2Y+Uelg+Pi29OnvaSGwjOsnRyNEkXzHg5g==
+  version "4.12.0"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.12.0.tgz#06c6d5715a1ede6c51fc39ff67fd647f740b656d"
+  integrity sha512-UH2GkcEDSI0k/lRkuDSzFl9ZZ87skSy9w2XAn1MsZnL+4c4rqbBd3e82UWHbYDpztABrPBhZsTEeuxVfHppqDg==
   dependencies:
-    caniuse-lite "^1.0.30001038"
-    electron-to-chromium "^1.3.390"
+    caniuse-lite "^1.0.30001043"
+    electron-to-chromium "^1.3.413"
     node-releases "^1.1.53"
     pkg-up "^2.0.0"
 
@@ -3569,14 +3569,14 @@ caniuse-api@^3.0.0:
     lodash.uniq "^4.5.0"
 
 caniuse-db@^1.0.30000529, caniuse-db@^1.0.30000634, caniuse-db@^1.0.30000639:
-  version "1.0.30001043"
-  resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30001043.tgz#2b9c7e8c63551d64616ca562e6877c989e5ad6a5"
-  integrity sha512-Dipx6NfbkUVEil8AUo/vt8oa9AF2JnR3mNpKV5YaB0a/v4nvDO8pzCuVdPJqr15FmSY6dBobciTDNLzbdVpVTA==
+  version "1.0.30001048"
+  resolved "https://registry.yarnpkg.com/caniuse-db/-/caniuse-db-1.0.30001048.tgz#4f431c688cb6bc0435994dcbb8e565d004869d43"
+  integrity sha512-HqYsBIZlVARU5GDXPziXSFwFVpGx9KqCznr62iaey7bT2sqpx7/jI4B3PvbKguKi8kGeEannJ7WEPB5H71rjFQ==
 
-caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001038, caniuse-lite@^1.0.30001039:
-  version "1.0.30001043"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001043.tgz#1b561de27aefbe6ff99e41866b8d7d87840c513b"
-  integrity sha512-MrBDRPJPDBYwACtSQvxg9+fkna5jPXhJlKmuxenl/ml9uf8LHKlDmLpElu+zTW/bEz7lC1m0wTDD7jiIB+hgFg==
+caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001039, caniuse-lite@^1.0.30001043:
+  version "1.0.30001048"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001048.tgz#4bb4f1bc2eb304e5e1154da80b93dee3f1cf447e"
+  integrity sha512-g1iSHKVxornw0K8LG9LLdf+Fxnv7T1Z+mMsf0/YYLclQX4Cd522Ap0Lrw6NFqHgezit78dtyWxzlV2Xfc7vgRg==
 
 case-sensitive-paths-webpack-plugin@^2.2.0:
   version "2.3.0"
@@ -3846,9 +3846,9 @@ collapse-white-space@^1.0.0, collapse-white-space@^1.0.2:
   integrity sha512-jEovNnrhMuqyCcjfEJA56v0Xq8SkIoPKDyaHahwo3POf4qcSXqMYuwNcOTzp74vTsR9Tn08z4MxWqAhcekogkQ==
 
 collect.js@^4.23.0:
-  version "4.23.0"
-  resolved "https://registry.yarnpkg.com/collect.js/-/collect.js-4.23.0.tgz#0e55d0721329c969afae182ab7b97bfa0775fa99"
-  integrity sha512-EjdXlyRdvISTEXBWzpNEtygkfJGyUVkOuNYblBvcgjdbWnAs7xb4f5rE22HKHHBFKLkgeRwhvNPBbyldTut1VQ==
+  version "4.25.0"
+  resolved "https://registry.yarnpkg.com/collect.js/-/collect.js-4.25.0.tgz#3cc9580935997263ab283488d760f9956c420e8b"
+  integrity sha512-Wk+cWM9iQouzCe2RulakcE6BKweADOHYcz3pVcO2e6jRPfTuZWiLmAjJ2+lI3K9ldFyp77GZVheKjaGnoTAofw==
 
 collection-visit@^1.0.0:
   version "1.0.0"
@@ -4617,9 +4617,9 @@ cyclist@^1.0.1:
   integrity sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=
 
 cypress@^4.3.0:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/cypress/-/cypress-4.4.0.tgz#566ac224e11601634c31e5648e5c15199dde7954"
-  integrity sha512-ZpsV3pVemANGi4Cxu0UIqFv23uHdDJZYlKY+8P/eixujCpI1TQ5RSPBp2grfV3ZvlGYrOXPJY44j9iEh1xoQug==
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/cypress/-/cypress-4.4.1.tgz#f5aa1aa5f328f1299bff328103f7cbad89e80f29"
+  integrity sha512-LcskZ/PXRG9XTlEeeenKqz/KddT1x+7O7dqXsdKWPII01LxLNmNHIvHnlUqApchVbinJ5vir6J255CkELSeL0A==
   dependencies:
     "@cypress/listr-verbose-renderer" "0.4.1"
     "@cypress/request" "2.88.5"
@@ -5156,10 +5156,10 @@ ee-first@1.1.1:
   resolved "https://registry.yarnpkg.com/ee-first/-/ee-first-1.1.1.tgz#590c61156b0ae2f4f0255732a158b266bc56b21d"
   integrity sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=
 
-electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.390:
-  version "1.3.413"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.413.tgz#9c457a4165c7b42e59d66dff841063eb9bfe5614"
-  integrity sha512-Jm1Rrd3siqYHO3jftZwDljL2LYQafj3Kki5r+udqE58d0i91SkjItVJ5RwlJn9yko8i7MOcoidVKjQlgSdd1hg==
+electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.413:
+  version "1.3.418"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.418.tgz#840021191f466b803a873e154113620c9f53cec6"
+  integrity sha512-i2QrQtHes5fK/F9QGG5XacM5WKEuR322fxTYF9e8O9Gu0mc0WmjjwGpV8c7Htso6Zf2Di18lc3SIPxmMeRFBug==
 
 elegant-spinner@^1.0.1:
   version "1.0.1"
@@ -5248,9 +5248,9 @@ env-paths@^2.2.0:
   integrity sha512-6u0VYSCo/OW6IoD5WCLLy9JUGARbamfSavcNXry/eu8aHVFei6CD3Sw+VGX5alea1i9pgPHW0mbu6Xj0uBh7gA==
 
 envinfo@^7.3.1:
-  version "7.5.0"
-  resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-7.5.0.tgz#91410bb6db262fb4f1409bd506e9ff57e91023f4"
-  integrity sha512-jDgnJaF/Btomk+m3PZDTTCb5XIIIX3zYItnCRfF73zVgvinLoRomuhi75Y4su0PtQxWz4v66XnLLckyvyJTOIQ==
+  version "7.5.1"
+  resolved "https://registry.yarnpkg.com/envinfo/-/envinfo-7.5.1.tgz#93c26897225a00457c75e734d354ea9106a72236"
+  integrity sha512-hQBkDf2iO4Nv0CNHpCuSBeaSrveU6nThVxFGTrq/eDlV716UQk09zChaJae4mZRsos1x4YLY2TaH3LHUae3ZmQ==
 
 err-code@^1.0.0:
   version "1.1.2"
@@ -6482,9 +6482,9 @@ graceful-fs@^4.1.10, graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.
   integrity sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=
 
 graphql-compose@^7.3.0:
-  version "7.14.2"
-  resolved "https://registry.yarnpkg.com/graphql-compose/-/graphql-compose-7.14.2.tgz#9037dc16e4d5cf6ab8410e9f86a24048283087be"
-  integrity sha512-Et3fn2oMrSdx4VE6vk0u66CRXVujdtjUyN4pN6Nak2jit86r9CGHPjmzYUtPZwnj1QcG1rPQcnsShosbOM6Iqg==
+  version "7.14.4"
+  resolved "https://registry.yarnpkg.com/graphql-compose/-/graphql-compose-7.14.4.tgz#9b10f09b187262844040101045e2928ffa0a03ad"
+  integrity sha512-NMkfRiqKd5ooks74Kk04sj+r6nEF94FZNl8MIpKMMuIU/A9Dq/+dqSE+FWgPZB0wEJTlLHn3/8V1vrj4aWNb3g==
   dependencies:
     graphql-type-json "^0.3.1"
     object-path "^0.11.4"
@@ -7681,9 +7681,9 @@ is-primitive@^2.0.0:
   integrity sha1-IHurkWOEmcB7Kt8kCkGochADRXU=
 
 is-promise@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.1.0.tgz#79a2a9ece7f096e80f36d2b2f3bc16c1ff4bf3fa"
-  integrity sha1-eaKp7OfwlugPNtKy87wWwf9L8/o=
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.2.2.tgz#39ab959ccbf9a774cf079f7b40c7a26f763135f1"
+  integrity sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ==
 
 is-regex@^1.0.5:
   version "1.0.5"
@@ -8462,9 +8462,9 @@ make-dir@^2.0.0, make-dir@^2.1.0:
     semver "^5.6.0"
 
 make-dir@^3.0.0:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-3.0.2.tgz#04a1acbf22221e1d6ef43559f43e05a90dbb4392"
-  integrity sha512-rYKABKutXa6vXTXhoV18cBE7PaewPXHe/Bdq4v+ZLMhxbWApkFFplT0LcbMW+6BbjnQXzZ/sAvSE/JdguApG5w==
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-3.1.0.tgz#415e967046b3a7f1d185277d84aa58203726a13f"
+  integrity sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==
   dependencies:
     semver "^6.0.0"
 
@@ -8813,17 +8813,17 @@ miller-rabin@^4.0.0:
     bn.js "^4.0.0"
     brorand "^1.0.1"
 
-mime-db@1.43.0, mime-db@^1.28.0:
-  version "1.43.0"
-  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.43.0.tgz#0a12e0502650e473d735535050e7c8f4eb4fae58"
-  integrity sha512-+5dsGEEovYbT8UY9yD7eE4XTc4UwJ1jBYlgaQQF38ENsKR3wj/8q8RFZrF9WIZpB2V1ArTVFUva8sAul1NzRzQ==
+mime-db@1.44.0, mime-db@^1.28.0:
+  version "1.44.0"
+  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.44.0.tgz#fa11c5eb0aca1334b4233cb4d52f10c5a6272f92"
+  integrity sha512-/NOTfLrsPBVeH7YtFPgsVWveuL+4SjjYxaQ1xtM1KMFj7HdxlBlxeyNLzhyJVx7r4rZGJAZ/6lkKCitSc/Nmpg==
 
 mime-types@^2.1.12, mime-types@^2.1.21, mime-types@~2.1.19, mime-types@~2.1.24:
-  version "2.1.26"
-  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.26.tgz#9c921fc09b7e149a65dfdc0da4d20997200b0a06"
-  integrity sha512-01paPWYgLrkqAyrlDorC1uDwl2p3qZT7yl806vW7DvDoxwXi46jsjFbg+WdwotBIk6/MbEhO/dh5aZ5sNj/dWQ==
+  version "2.1.27"
+  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.27.tgz#47949f98e279ea53119f5722e0f34e529bec009f"
+  integrity sha512-JIhqnCasI9yD+SsmkquHBxTSEuZdQX5BuQnS2Vc7puQQQ+8yiP5AY5uWhpdv4YL4VM5c6iliiYWPgJ/nJQLp7w==
   dependencies:
-    mime-db "1.43.0"
+    mime-db "1.44.0"
 
 mime@1.6.0:
   version "1.6.0"
@@ -9068,9 +9068,9 @@ mz@^2.5.0:
     thenify-all "^1.0.0"
 
 nan@^2.12.1, nan@^2.13.2, nan@^2.14.0:
-  version "2.14.0"
-  resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.0.tgz#7818f722027b2459a86f0295d434d1fc2336c52c"
-  integrity sha512-INOFj37C7k3AfaNTtX8RhsTw7qRy7eLET14cROi9+5HAVbbHuIWUHEauBv5qT4Av2tWasiTY1Jw6puUNqRJXQg==
+  version "2.14.1"
+  resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.1.tgz#d7be34dfa3105b91494c3147089315eff8874b01"
+  integrity sha512-isWHgVjnFjh2x2yuJ/tj3JbwoHu3UC2dX5G/88Cm24yB6YopVgxvBObDY7n5xW6ExmFhJpSEQqFPvq9zaXc8Jw==
 
 nanomatch@^1.2.9:
   version "1.2.13"
@@ -9139,9 +9139,9 @@ no-case@^3.0.3:
     tslib "^1.10.0"
 
 node-abi@^2.7.0:
-  version "2.15.0"
-  resolved "https://registry.yarnpkg.com/node-abi/-/node-abi-2.15.0.tgz#51d55cc711bd9e4a24a572ace13b9231945ccb10"
-  integrity sha512-FeLpTS0F39U7hHZU1srAK4Vx+5AHNVOTP+hxBNQknR/54laTHSFIJkDWDqiquY1LeLUgTfPN7sLPhMubx0PLAg==
+  version "2.16.0"
+  resolved "https://registry.yarnpkg.com/node-abi/-/node-abi-2.16.0.tgz#7df94e9c0a7a189f4197ab84bac8089ef5894992"
+  integrity sha512-+sa0XNlWDA6T+bDLmkCUYn6W5k5W6BPRL6mqzSCs6H/xUgtl4D5x2fORKDzopKiU6wsyn/+wXlRXwXeSp+mtoA==
   dependencies:
     semver "^5.4.1"
 
@@ -9245,9 +9245,9 @@ node-releases@^1.1.53:
   integrity sha512-wp8zyQVwef2hpZ/dJH7SfSrIPD6YoJz6BDQDpGEkcA0s3LpAQoxBIYmfIq6QAhC1DhwsyCgTaTTcONwX8qzCuQ==
 
 node-sass@^4.13.1:
-  version "4.13.1"
-  resolved "https://registry.yarnpkg.com/node-sass/-/node-sass-4.13.1.tgz#9db5689696bb2eec2c32b98bfea4c7a2e992d0a3"
-  integrity sha512-TTWFx+ZhyDx1Biiez2nB0L3YrCZ/8oHagaDalbuBSlqXgUPsdkUSzJsVxeDO9LtPB49+Fh3WQl3slABo6AotNw==
+  version "4.14.0"
+  resolved "https://registry.yarnpkg.com/node-sass/-/node-sass-4.14.0.tgz#a8e9d7720f8e15b4a1072719dcf04006f5648eeb"
+  integrity sha512-AxqU+DFpk0lEz95sI6jO0hU0Rwyw7BXVEv6o9OItoXLyeygPeaSpiV4rwQb10JiTghHaa0gZeD21sz+OsQluaw==
   dependencies:
     async-foreach "^0.1.3"
     chalk "^1.1.1"
@@ -11021,9 +11021,9 @@ prosemirror-utils@^0.9.6:
   integrity sha512-UC+j9hQQ1POYfMc5p7UFxBTptRiGPR7Kkmbl3jVvU8VgQbkI89tR/GK+3QYC8n+VvBZrtAoCrJItNhWSxX3slA==
 
 prosemirror-view@^1.0.0, prosemirror-view@^1.1.0, prosemirror-view@^1.13.3, prosemirror-view@^1.14.6:
-  version "1.14.6"
-  resolved "https://registry.yarnpkg.com/prosemirror-view/-/prosemirror-view-1.14.6.tgz#fa1e7ed14a38f2cb234f622037a07dbd9d2830de"
-  integrity sha512-0qNSFWVBHPrdQaZtIO3aou/NRsxMGER3IuI3cePHYbk5pf9wSsbMIWWaeHtXqblL+rqtgkLfcw0D2na6+WBgpA==
+  version "1.14.7"
+  resolved "https://registry.yarnpkg.com/prosemirror-view/-/prosemirror-view-1.14.7.tgz#5480f2ec7f091e616989894983b62c5e2d16edc1"
+  integrity sha512-ZCRbGAmJa0ORIY4xrDvOpxS/oAnph3egDauvQEI7SX4eex0zovUfC61I5X4AtPCaNN4JpLWEk60voCWi0cE2vA==
   dependencies:
     prosemirror-model "^1.1.0"
     prosemirror-state "^1.0.0"
@@ -11727,9 +11727,9 @@ resolve@1.8.1:
     path-parse "^1.0.5"
 
 resolve@^1.10.0, resolve@^1.2.0, resolve@^1.3.2, resolve@^1.5.0, resolve@^1.8.1:
-  version "1.16.1"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.16.1.tgz#49fac5d8bacf1fd53f200fa51247ae736175832c"
-  integrity sha512-rmAglCSqWWMrrBv/XM6sW0NuRFiKViw/W4d9EbC4pt+49H8JwHy+mcGmALTEg504AUDcLTvb1T2q3E9AnmY+ig==
+  version "1.17.0"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.17.0.tgz#b25941b54968231cc2d1bb76a79cb7f2c0bf8444"
+  integrity sha512-ic+7JYiV8Vi2yzQGFWOkiZD5Z9z7O2Zhm9XMaTxdJExKasieFCr+yXZ/WmXsckHiKl12ar0y6XiXDx3m4RHn1w==
   dependencies:
     path-parse "^1.0.6"
 
@@ -12420,9 +12420,9 @@ sort-object-keys@^1.1.3:
   integrity sha512-855pvK+VkU7PaKYPc+Jjnmt4EzejQHyhhF33q31qG8x7maDzkeFhAAThdCYay11CISO+qAMwjOBP+fPZe0IPyg==
 
 sort-package-json@^1.15.0:
-  version "1.42.0"
-  resolved "https://registry.yarnpkg.com/sort-package-json/-/sort-package-json-1.42.0.tgz#6ccd043eb68ddda8c2f0e2dfc662b96543e85f4d"
-  integrity sha512-VPP4qRIJGBjqZ6snRRxcaAeV50/D9/bziiqwRajQmQqC1pee/+DzQ1yhB50SFkOkZYSC3KFcpjrSr8Jhvl/dcg==
+  version "1.42.1"
+  resolved "https://registry.yarnpkg.com/sort-package-json/-/sort-package-json-1.42.1.tgz#4085582dfe83c60951673de2d5e4ce09dd47bd4e"
+  integrity sha512-+JgZVjEQhJuJ57RCUcF3rzESYCW/n3vCLWdhqBdPkerEgRTj5teGdJrCcj772zT1VzewqWk616/4xuRyIffyqQ==
   dependencies:
     detect-indent "^6.0.0"
     detect-newline "3.1.0"
@@ -12448,9 +12448,9 @@ source-map-resolve@^0.5.0:
     urix "^0.1.0"
 
 source-map-support@~0.5.10, source-map-support@~0.5.12:
-  version "0.5.17"
-  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.17.tgz#29fe1b3c98b9dbd5064ada89052ee8ff070cb46c"
-  integrity sha512-bwdKOBZ5L0gFRh4KOxNap/J/MpvX9Yxsq9lFDx65s3o7F/NiHy7JRaGIS8MwW6tZPAq9UXE207Il0cfcb5yu/Q==
+  version "0.5.19"
+  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.19.tgz#a98b62f86dcaf4f67399648c085291ab9e8fed61"
+  integrity sha512-Wonm7zOCIJzBGQdB+thsPar0kYuCIzYvxZwlBa87yi/Mdjv7Tip2cyVbLj5o0cFPN4EVkuTwb3GDDyUx2DGnGw==
   dependencies:
     buffer-from "^1.0.0"
     source-map "^0.6.0"
@@ -12501,9 +12501,9 @@ spdx-correct@^3.0.0:
     spdx-license-ids "^3.0.0"
 
 spdx-exceptions@^2.1.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/spdx-exceptions/-/spdx-exceptions-2.2.0.tgz#2ea450aee74f2a89bfb94519c07fcd6f41322977"
-  integrity sha512-2XQACfElKi9SlVb1CYadKDXvoajPgBVPn/gOQLrTvHdElaVhr7ZEbqJaRnJLVNeaI4cMEAgVCeBMKF6MWRDCRA==
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz#3f28ce1a77a00372683eade4a433183527a2163d"
+  integrity sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A==
 
 spdx-expression-parse@^3.0.0:
   version "3.0.0"
@@ -13132,9 +13132,9 @@ terser@^3.8.2:
     source-map-support "~0.5.10"
 
 terser@^4.1.2, terser@^4.6.3:
-  version "4.6.11"
-  resolved "https://registry.yarnpkg.com/terser/-/terser-4.6.11.tgz#12ff99fdd62a26de2a82f508515407eb6ccd8a9f"
-  integrity sha512-76Ynm7OXUG5xhOpblhytE7X58oeNSmC8xnNhjWVo8CksHit0U0kO4hfNbPrrYwowLWFgM2n9L176VNx2QaHmtA==
+  version "4.6.12"
+  resolved "https://registry.yarnpkg.com/terser/-/terser-4.6.12.tgz#44b98aef8703fdb09a3491bf79b43faffc5b4fee"
+  integrity sha512-fnIwuaKjFPANG6MAixC/k1TDtnl1YlPLUlLVIxxGZUn1gfUx2+l3/zGNB72wya+lgsb50QBi2tUV75RiODwnww==
   dependencies:
     commander "^2.20.0"
     source-map "~0.6.1"
@@ -13453,9 +13453,9 @@ umask@^1.1.0:
   integrity sha1-8pzr8B31F5ErtY/5xOUP3o4zMg0=
 
 unbzip2-stream@^1.0.9:
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/unbzip2-stream/-/unbzip2-stream-1.4.1.tgz#151b104af853df3efdaa135d8b1eca850a44b426"
-  integrity sha512-sgDYfSDPMsA4Hr2/w7vOlrJBlwzmyakk1+hW8ObLvxSp0LA36LcL2XItGvOT3OSblohSdevMuT8FQjLsqyy4sA==
+  version "1.4.2"
+  resolved "https://registry.yarnpkg.com/unbzip2-stream/-/unbzip2-stream-1.4.2.tgz#84eb9e783b186d8fb397515fbb656f312f1a7dbf"
+  integrity sha512-pZMVAofMrrHX6Ik39hCk470kulCbmZ2SWfQLPmTWqfJV/oUm0gn1CblvHdUu4+54Je6Jq34x8kY6XjTy6dMkOg==
   dependencies:
     buffer "^5.2.1"
     through "^2.3.8"
@@ -14013,7 +14013,7 @@ wait-on@4.0.0:
     request-promise-native "^1.0.8"
     rxjs "^6.5.4"
 
-watchpack@^1.6.0:
+watchpack@^1.6.1:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-1.6.1.tgz#280da0a8718592174010c078c7585a74cd8cd0e2"
   integrity sha512-+IF9hfUFOrYOOaKyfaI7h7dquUIOgyEMoQMLA7OP5FxegKA2+XdXThAZ9TU2kucfhDH7rfMHs1oPYziVGWRnZA==
@@ -14087,15 +14087,15 @@ webpack-sources@^1.1.0, webpack-sources@^1.4.0, webpack-sources@^1.4.1:
     source-map "~0.6.1"
 
 webpack@^4.29.3:
-  version "4.42.1"
-  resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.42.1.tgz#ae707baf091f5ca3ef9c38b884287cfe8f1983ef"
-  integrity sha512-SGfYMigqEfdGchGhFFJ9KyRpQKnipvEvjc1TwrXEPCM6H5Wywu10ka8o3KGrMzSMxMQKt8aCHUFh5DaQ9UmyRg==
+  version "4.43.0"
+  resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.43.0.tgz#c48547b11d563224c561dad1172c8aa0b8a678e6"
+  integrity sha512-GW1LjnPipFW2Y78OOab8NJlCflB7EFskMih2AHdvjbpKMeDJqEgSx24cXXXiPS65+WSwVyxtDsJH6jGX2czy+g==
   dependencies:
     "@webassemblyjs/ast" "1.9.0"
     "@webassemblyjs/helper-module-context" "1.9.0"
     "@webassemblyjs/wasm-edit" "1.9.0"
     "@webassemblyjs/wasm-parser" "1.9.0"
-    acorn "^6.2.1"
+    acorn "^6.4.1"
     ajv "^6.10.2"
     ajv-keywords "^3.4.1"
     chrome-trace-event "^1.0.2"
@@ -14112,7 +14112,7 @@ webpack@^4.29.3:
     schema-utils "^1.0.0"
     tapable "^1.1.3"
     terser-webpack-plugin "^1.4.3"
-    watchpack "^1.6.0"
+    watchpack "^1.6.1"
     webpack-sources "^1.4.1"
 
 websocket-driver@0.6.5:

From b841d8ee9a2d0f9580c50c01a2dd4e8e742bfea9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Sun, 26 Apr 2020 23:21:27 +0200
Subject: [PATCH 33/37] refactoring

---
 packages/core/src/Editor.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/core/src/Editor.ts b/packages/core/src/Editor.ts
index 5666b66cc..0fa591236 100644
--- a/packages/core/src/Editor.ts
+++ b/packages/core/src/Editor.ts
@@ -30,7 +30,7 @@ export interface CommandSpec {
 type EditorContent = string | JSON | null
 
 interface EditorOptions {
-  element: HTMLElement,
+  element: Element,
   content: EditorContent
   extensions: (Extension | Node | Mark)[]
   injectCSS: Boolean,

From f8d1db1b6dc4c5b553499ea9e78d52bc393ce0c1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Sun, 26 Apr 2020 23:22:10 +0200
Subject: [PATCH 34/37] pass more props to renderer

---
 packages/core/src/ExtensionManager.ts | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/packages/core/src/ExtensionManager.ts b/packages/core/src/ExtensionManager.ts
index d260d9988..20cb37c04 100644
--- a/packages/core/src/ExtensionManager.ts
+++ b/packages/core/src/ExtensionManager.ts
@@ -97,18 +97,20 @@ export default class ExtensionManager {
 
     const prop = `to${capitalize(Renderer.type)}`
 
-    return collect(this.nodes)
-      .filter((schema: any) => schema[prop])
-      .map((schema: any) => {
+    return collect(this.extensions)
+      .where('extensionType', 'node')
+      .filter((extension: any) => extension.schema()[prop])
+      .map((extension: any) => {
         return (
           node: ProsemirrorNode,
           view: EditorView,
           getPos: (() => number) | boolean,
           decorations: Decoration[],
         ) => {
-          return new Renderer(schema[prop], {
+          return new Renderer(extension.schema()[prop], {
+            extension,
+            editor: this.editor,
             node,
-            view,
             getPos,
             decorations,
           })

From e6c6ec263fdc93d6e0bc9fbcf2f2524591dd7e9a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Mon, 27 Apr 2020 09:06:42 +0200
Subject: [PATCH 35/37] disable nodeview for now

---
 packages/extension-paragraph/index.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/extension-paragraph/index.ts b/packages/extension-paragraph/index.ts
index 2631c8787..05a386aa2 100644
--- a/packages/extension-paragraph/index.ts
+++ b/packages/extension-paragraph/index.ts
@@ -1,6 +1,6 @@
 import { Node } from '@tiptap/core'
 import { NodeSpec } from 'prosemirror-model'
-import ParagraphComponent from './paragraph.vue'
+// import ParagraphComponent from './paragraph.vue'
 
 export default class Paragraph extends Node {
 
@@ -12,7 +12,7 @@ export default class Paragraph extends Node {
       group: 'block',
       parseDOM: [{ tag: 'p' }],
       toDOM: () => ['p', 0],
-      toVue: ParagraphComponent,
+      // toVue: ParagraphComponent,
     }
   }
 

From 9e1d8f1943c234ffdd9db5c9e849743faf104e56 Mon Sep 17 00:00:00 2001
From: Sven Adlung <info@svenadlung.de>
Date: Tue, 28 Apr 2020 22:41:08 +0200
Subject: [PATCH 36/37] Refactor React demo

---
 docs/src/demos/React/components/Editor.js |  30 +++++++
 docs/src/demos/React/index.jsx            | 101 ++++++++++++++--------
 2 files changed, 95 insertions(+), 36 deletions(-)
 create mode 100644 docs/src/demos/React/components/Editor.js

diff --git a/docs/src/demos/React/components/Editor.js b/docs/src/demos/React/components/Editor.js
new file mode 100644
index 000000000..6c4992de0
--- /dev/null
+++ b/docs/src/demos/React/components/Editor.js
@@ -0,0 +1,30 @@
+import React, { useState, useRef, useEffect, createContext, useContext } from 'react'
+import { Editor as Tiptap } from '@tiptap/core'
+
+export const EditorContext = createContext({})
+
+export const useEditor = () => useContext(EditorContext)
+
+export const Editor = ({ value, onChange, children, ...props }) => {
+  const [editor, setEditor] = useState(null)
+  const editorRef = useRef(null)
+
+  useEffect(() => {
+    const e = new Tiptap({
+      element: editorRef.current,
+      content: value,
+      ...props,
+    }).on('transaction', () => {
+      onChange(e.json())
+    })
+
+    setEditor(e)
+  }, [])
+
+  return (
+    <EditorContext.Provider value={editor}>
+      {editorRef.current && children}
+      <div ref={editorRef} />
+    </EditorContext.Provider>
+  )
+}
diff --git a/docs/src/demos/React/index.jsx b/docs/src/demos/React/index.jsx
index cd6160dd5..630a3d567 100644
--- a/docs/src/demos/React/index.jsx
+++ b/docs/src/demos/React/index.jsx
@@ -1,40 +1,69 @@
-import React, { Component } from 'react'
-import { Editor } from '@tiptap/core'
+import React, { useState } from 'react'
+import { useEditor, Editor } from './components/Editor'
 import extensions from '@tiptap/starter-kit'
 
-export default class extends Component {
-  constructor() {
-    super()
-    this.editorNode = React.createRef()
-  }
-  
-  componentDidMount() {
-    this.editor = new Editor({
-      element: this.editorNode.current,
-      content: '<p>rendered in <strong>react</strong>!</p>',
-      extensions: extensions(),
-    })
-    this.forceUpdate()
-  }
+// Menu bar example component
+// useEditor only works for child components of <Editor />
+const MenuBar = () => {
+  const editor = useEditor()
 
-  render() {
-    return (
-      <div>
-        {this.editor &&
-          <div>
-            <button onClick={() => this.editor.focus().removeMarks()}>
-              clear formatting
-            </button>
-            <button
-              onClick={() => this.editor.focus().bold()}
-              className={`${this.editor.isActive('bold') ? 'is-active' : ''}`}
-            >
-              bold
-            </button>
-          </div>
-        } 
-        <div ref={this.editorNode} />
-      </div>
-    )
-  }
+  return (
+    <>
+      <button onClick={() => editor.focus().removeMarks()}>
+        Clear formatting
+      </button>
+      <button
+        className={`${editor.isActive('bold') ? 'is-active' : ''}`}
+        onClick={() => editor.focus().bold()}
+      >
+        Bold
+      </button>
+    </>
+  )
+}
+
+export default () => {
+  const [value, setValue] = useState({
+    'type': 'document',
+    'content': [
+       {
+          'type': 'paragraph',
+          'content': [
+             {
+                'type': 'text',
+                'text': 'rendered in '
+             },
+             {
+                'type': 'text',
+                'marks': [
+                   {
+                      'type': 'bold'
+                   }
+                ],
+                'text': 'react'
+             },
+             {
+                'type': 'text',
+                'text': '!'
+             }
+          ]
+       }
+    ]
+ })
+
+  return (
+    <>
+      <p>
+        <button onClick={() => alert(JSON.stringify(value))}>Alert state</button>
+      </p>
+      <hr style={{ margin: '0.85rem 0'}} />
+      <Editor 
+        value={value}
+        onChange={setValue}
+        extensions={extensions()}
+      >
+        <MenuBar />
+      </Editor>
+    </>
+  )
 }

From bda4bbcd6b61a9f0b4a5097cca944bb9e5e25003 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Tue, 28 Apr 2020 23:25:56 +0200
Subject: [PATCH 37/37] fix react setup

---
 docs/gridsome.server.js                       |  1 +
 docs/package.json                             |  1 +
 docs/src/components/Demo/index.vue            |  6 ++-
 .../components/{Editor.js => Editor.jsx}      |  0
 yarn.lock                                     | 43 ++++---------------
 5 files changed, 15 insertions(+), 36 deletions(-)
 rename docs/src/demos/React/components/{Editor.js => Editor.jsx} (100%)

diff --git a/docs/gridsome.server.js b/docs/gridsome.server.js
index e8dae9386..8d37f1545 100644
--- a/docs/gridsome.server.js
+++ b/docs/gridsome.server.js
@@ -5,6 +5,7 @@ module.exports = function (api) {
   api.chainWebpack(config => {
     config.resolve.extensions
       .add('.ts')
+      .add('.jsx')
 
     config.module
       .rule('typescript')
diff --git a/docs/package.json b/docs/package.json
index 3b77ed3b6..2254578ab 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -12,6 +12,7 @@
     "@gridsome/transformer-json": "^0.2.1",
     "@gridsome/vue-remark": "^0.2.0",
     "@mvasilkov/outdent": "^1.0.4",
+    "collect.js": "^4.25.0",
     "globby": "^11.0.0",
     "gridsome": "0.7.14",
     "raw-loader": "^4.0.0",
diff --git a/docs/src/components/Demo/index.vue b/docs/src/components/Demo/index.vue
index 118e21d25..138f53a85 100644
--- a/docs/src/components/Demo/index.vue
+++ b/docs/src/components/Demo/index.vue
@@ -24,6 +24,7 @@
 </template>
 
 <script>
+import collect from 'collect.js'
 import ReactRenderer from '~/components/ReactRenderer'
 
 export default {
@@ -76,8 +77,7 @@ export default {
   },
 
   mounted() {
-    this.files = require.context(`~/demos/`, true, /.+\..+$/)
-      .keys()
+    this.files = collect(require.context(`~/demos/`, true, /.+\..+$/).keys())
       .filter(path => path.startsWith(`./${this.name}`))
       .map(path => path.replace('./', ''))
       .map(path => {
@@ -91,6 +91,8 @@ export default {
           highlight: this.syntax[extension] || extension,
         }
       })
+      .sortBy(item => item.path.split('/').length)
+      .toArray()
   }
 }
 </script>
diff --git a/docs/src/demos/React/components/Editor.js b/docs/src/demos/React/components/Editor.jsx
similarity index 100%
rename from docs/src/demos/React/components/Editor.js
rename to docs/src/demos/React/components/Editor.jsx
diff --git a/yarn.lock b/yarn.lock
index 179ba6bfd..89568b950 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3845,7 +3845,7 @@ collapse-white-space@^1.0.0, collapse-white-space@^1.0.2:
   resolved "https://registry.yarnpkg.com/collapse-white-space/-/collapse-white-space-1.0.6.tgz#e63629c0016665792060dbbeb79c42239d2c5287"
   integrity sha512-jEovNnrhMuqyCcjfEJA56v0Xq8SkIoPKDyaHahwo3POf4qcSXqMYuwNcOTzp74vTsR9Tn08z4MxWqAhcekogkQ==
 
-collect.js@^4.23.0:
+collect.js@^4.23.0, collect.js@^4.25.0:
   version "4.25.0"
   resolved "https://registry.yarnpkg.com/collect.js/-/collect.js-4.25.0.tgz#3cc9580935997263ab283488d760f9956c420e8b"
   integrity sha512-Wk+cWM9iQouzCe2RulakcE6BKweADOHYcz3pVcO2e6jRPfTuZWiLmAjJ2+lI3K9ldFyp77GZVheKjaGnoTAofw==
@@ -4718,7 +4718,7 @@ debug@4.1.1, debug@^4.1.0:
   dependencies:
     ms "^2.1.1"
 
-debug@^3.1.0, debug@^3.1.1, debug@^3.2.5, debug@^3.2.6:
+debug@^3.1.0, debug@^3.1.1, debug@^3.2.5:
   version "3.2.6"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
   integrity sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==
@@ -4936,7 +4936,7 @@ detect-indent@^6.0.0:
   resolved "https://registry.yarnpkg.com/detect-indent/-/detect-indent-6.0.0.tgz#0abd0f549f69fc6659a254fe96786186b6f528fd"
   integrity sha512-oSyFlqaTHCItVRGK5RmrmjB+CmaMOW7IaNA/kdxqhoa6d17j/5ce9O9eWXmV/KEdRwqpQA+Vqe8a8Bsybu4YnA==
 
-detect-libc@^1.0.2, detect-libc@^1.0.3:
+detect-libc@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/detect-libc/-/detect-libc-1.0.3.tgz#fa137c4bd698edf55cd5cd02ac559f91a4c4ba9b"
   integrity sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=
@@ -7062,7 +7062,7 @@ humanize-ms@^1.2.1:
   dependencies:
     ms "^2.0.0"
 
-iconv-lite@0.4.24, iconv-lite@^0.4.24, iconv-lite@^0.4.4, iconv-lite@~0.4.13:
+iconv-lite@0.4.24, iconv-lite@^0.4.24, iconv-lite@~0.4.13:
   version "0.4.24"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
   integrity sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==
@@ -9094,15 +9094,6 @@ napi-build-utils@^1.0.1:
   resolved "https://registry.yarnpkg.com/napi-build-utils/-/napi-build-utils-1.0.2.tgz#b1fddc0b2c46e380a0b7a76f984dd47c41a13806"
   integrity sha512-ONmRUqK7zj7DWX0D9ADe03wbwOBZxNAfF20PlGfCWQcD3+/MakShIHrMqx9YwPTfxDdF1zLeL+RGZiR9kGMLdg==
 
-needle@^2.2.1:
-  version "2.4.1"
-  resolved "https://registry.yarnpkg.com/needle/-/needle-2.4.1.tgz#14af48732463d7475696f937626b1b993247a56a"
-  integrity sha512-x/gi6ijr4B7fwl6WYL9FwlCvRQKGlUNvnceho8wxkwXqN8jvVmmmATTmZPRRG7b/yC1eode26C2HO9jl78Du9g==
-  dependencies:
-    debug "^3.2.6"
-    iconv-lite "^0.4.4"
-    sax "^1.2.4"
-
 negotiator@0.6.2:
   version "0.6.2"
   resolved "https://registry.yarnpkg.com/negotiator/-/negotiator-0.6.2.tgz#feacf7ccf525a77ae9634436a64883ffeca346fb"
@@ -9223,22 +9214,6 @@ node-libs-browser@^2.2.1:
     util "^0.11.0"
     vm-browserify "^1.0.1"
 
-node-pre-gyp@*:
-  version "0.14.0"
-  resolved "https://registry.yarnpkg.com/node-pre-gyp/-/node-pre-gyp-0.14.0.tgz#9a0596533b877289bcad4e143982ca3d904ddc83"
-  integrity sha512-+CvDC7ZttU/sSt9rFjix/P05iS43qHCOOGzcr3Ry99bXG7VX953+vFyEuph/tfqoYu8dttBkE86JSKBO2OzcxA==
-  dependencies:
-    detect-libc "^1.0.2"
-    mkdirp "^0.5.1"
-    needle "^2.2.1"
-    nopt "^4.0.1"
-    npm-packlist "^1.1.6"
-    npmlog "^4.0.2"
-    rc "^1.2.7"
-    rimraf "^2.6.1"
-    semver "^5.3.0"
-    tar "^4.4.2"
-
 node-releases@^1.1.53:
   version "1.1.53"
   resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-1.1.53.tgz#2d821bfa499ed7c5dffc5e2f28c88e78a08ee3f4"
@@ -9387,7 +9362,7 @@ npm-normalize-package-bin@^1.0.0, npm-normalize-package-bin@^1.0.1:
     semver "^5.6.0"
     validate-npm-package-name "^3.0.0"
 
-npm-packlist@^1.1.6, npm-packlist@^1.4.4:
+npm-packlist@^1.4.4:
   version "1.4.8"
   resolved "https://registry.yarnpkg.com/npm-packlist/-/npm-packlist-1.4.8.tgz#56ee6cc135b9f98ad3d51c1c95da22bbb9b2ef3e"
   integrity sha512-5+AZgwru5IevF5ZdnFglB5wNlHG1AOOuw28WhUq8/8emhBmLv6jX5by4WJCh7lW0uSYZYS6DXqIsyZVIXRZU9A==
@@ -9419,7 +9394,7 @@ npm-run-path@^4.0.0:
   dependencies:
     path-key "^3.0.0"
 
-"npmlog@0 || 1 || 2 || 3 || 4", npmlog@^4.0.0, npmlog@^4.0.1, npmlog@^4.0.2, npmlog@^4.1.2:
+"npmlog@0 || 1 || 2 || 3 || 4", npmlog@^4.0.0, npmlog@^4.0.1, npmlog@^4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-4.1.2.tgz#08a7f2a8bf734604779a9efa4ad5cc717abb954b"
   integrity sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==
@@ -11781,7 +11756,7 @@ rgba-regex@^1.0.0:
   resolved "https://registry.yarnpkg.com/rgba-regex/-/rgba-regex-1.0.0.tgz#43374e2e2ca0968b0ef1523460b7d730ff22eeb3"
   integrity sha1-QzdOLiyglosO8VI0YLfXMP8i7rM=
 
-rimraf@2, rimraf@^2.5.4, rimraf@^2.6.1, rimraf@^2.6.2, rimraf@^2.6.3:
+rimraf@2, rimraf@^2.5.4, rimraf@^2.6.2, rimraf@^2.6.3:
   version "2.7.1"
   resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.7.1.tgz#35797f13a7fdadc566142c29d4f07ccad483e3ec"
   integrity sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==
@@ -12055,7 +12030,7 @@ sass-loader@^8.0.2:
     schema-utils "^2.6.1"
     semver "^6.3.0"
 
-sax@^1.2.4, sax@~1.2.1, sax@~1.2.4:
+sax@~1.2.1, sax@~1.2.4:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
   integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==
@@ -13052,7 +13027,7 @@ tar@^2.0.0:
     fstream "^1.0.12"
     inherits "2"
 
-tar@^4.4.10, tar@^4.4.12, tar@^4.4.2, tar@^4.4.8:
+tar@^4.4.10, tar@^4.4.12, tar@^4.4.8:
   version "4.4.13"
   resolved "https://registry.yarnpkg.com/tar/-/tar-4.4.13.tgz#43b364bc52888d555298637b10d60790254ab525"
   integrity sha512-w2VwSrBoHa5BsSyH+KxEqeQBAllHhccyMFVHtGtdMpF4W7IRWfZjFiQceJPChOeTsSDVUpER2T8FA93pr0L+QA==