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] 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 f233722d..60534007 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 6c804217..bd27c186 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 00000000..7181e2bc
--- /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 ca5a663f..577af280 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