From 666f674a81b1457fdd64d66b76f94112378614a5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20K=C3=BChn?= <kontakt@philipp-kuehn.com>
Date: Sun, 26 Aug 2018 15:51:35 +0200
Subject: [PATCH 1/2] add slots to readme

---
 README.md | 60 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 60 insertions(+)

diff --git a/README.md b/README.md
index fd47a66f..8a88c5b9 100644
--- a/README.md
+++ b/README.md
@@ -53,6 +53,25 @@ export default {
 | `extensions` | `Array` | `[]` | A list of extensions used, by the editor. This can be `Nodes`, `Marks` or `Plugins`. |
 | `@update` | `Function` | `undefined` | This will return the current `state` of Prosemirror on every change. |
 
+## Scoped Slots
+
+| **Name** | **Description** |
+| --- | --- |
+| `editor` | Here the content will be rendered. |
+| `menubar` | Here a menu bar will be rendered. |
+| `menububble` | Here a menu bubble will be rendered. |
+
+### Slot Properties
+
+The `menubar` and `menububble` slot will receive some properties.
+
+| **Property** | **Type** | **Description** |
+| --- | :---: | --- |
+| `nodes` | `Object` | A list of available nodes with active state and command. |
+| `marks` | `Object` | A list of available marks with active state and command. |
+| `focused` | `Boolean` | Whether the editor is focused. |
+| `focus` | `Function` | A function to focus the editor. |
+
 ## Extensions
 
 By default the editor will only support some boring paragraphs. Other nodes and marks are available as **extensions**. There is a package called `tiptap-extensions` with the most basic nodes, marks and plugins.
@@ -284,6 +303,47 @@ export default class IframeNode extends Node {
 }
 ```
 
+## Building a Menu
+
+This is a basic example of building a custom menu. A more advanced menu can be found at the [examples page](https://tiptap.scrumpy.io).
+
+```vue
+<template>
+  <editor :extensions="extensions">
+    <div slot="menubar" slot-scope="{ nodes, marks }">
+      <button :class="{ 'is-active': nodes.heading.active({ level: 1 }) }" @click="nodes.heading.command({ level: 1 })">
+        H1
+      </button>
+      <button :class="{ 'is-active': marks.bold.active() }" @click="marks.bold.command()">
+        Bold
+      </button>
+    </div>
+    <div slot="content" slot-scope="props">
+      <p>This text can be made bold.</p>
+    </div>
+  </editor>
+</template>
+
+<script>
+import { Editor } from 'tiptap'
+import { Heading, Bold } from 'tiptap-extensions'
+
+export default {
+  components: {
+    Editor,
+  },
+  data() {
+    return {
+      extensions: [
+        new Heading({ maxLevel: 3 }),
+        new Bold(),
+      ],
+    }
+  },
+}
+</script>
+```
+
 ## Contributing
 
 Please see [CONTRIBUTING](CONTRIBUTING.md) for details.

From dfd870e0f1d8404cdec6775285955f276a08ef86 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20K=C3=BChn?= <kontakt@philipp-kuehn.com>
Date: Sun, 26 Aug 2018 18:47:08 +0200
Subject: [PATCH 2/2] fix typo

---
 README.md | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index 8a88c5b9..b55f26d1 100644
--- a/README.md
+++ b/README.md
@@ -74,7 +74,7 @@ The `menubar` and `menububble` slot will receive some properties.
 
 ## Extensions
 
-By default the editor will only support some boring paragraphs. Other nodes and marks are available as **extensions**. There is a package called `tiptap-extensions` with the most basic nodes, marks and plugins.
+By default the editor will only support paragraphs. Other nodes and marks are available as **extensions**. There is a package called `tiptap-extensions` with the most basic nodes, marks and plugins.
 
 ### Available Extensions
 
@@ -137,7 +137,7 @@ export default {
 
 ### Create Custom Extensions
 
-The most powerful feature of tiptap is that you can create you own extensions. There are 3 basic types of extensions.
+The most powerful feature of tiptap is that you can create your own extensions. There are 3 types of extensions.
 
 | **Type** | **Description** |
 | --- | --- |
@@ -230,7 +230,7 @@ export default class BlockquoteNode extends Node {
 
 ### Create a Node as a Vue Component
 
-The real power of the nodes comes in combination with Vue components. Lets build a iframe node, where you can change its url (this can also be found in our [examples](https://github.com/heyscrumpy/tiptap/tree/master/examples/Components/Routes/Embeds)).
+The real power of the nodes comes in combination with Vue components. Lets build an iframe node, where you can change its url (this can also be found in our [examples](https://github.com/heyscrumpy/tiptap/tree/master/examples/Components/Routes/Embeds)).
 
 ```js
 import { Node } from 'tiptap'