From fbee7656c835a7a806c523a7dfef9ba2c94a5694 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Wed, 18 Nov 2020 12:09:04 +0100
Subject: [PATCH] add fontFamily commands

---
 docs/src/demos/Extensions/FontFamily/index.vue | 12 ++++++------
 packages/extension-font-family/src/index.ts    | 12 ++++++++++--
 2 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/docs/src/demos/Extensions/FontFamily/index.vue b/docs/src/demos/Extensions/FontFamily/index.vue
index b2a43a4a..7ecd28e2 100644
--- a/docs/src/demos/Extensions/FontFamily/index.vue
+++ b/docs/src/demos/Extensions/FontFamily/index.vue
@@ -1,21 +1,21 @@
 <template>
   <div v-if="editor">
-    <button @click="editor.chain().focus().fontFamily('Inter').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'Inter' }) }">
+    <button @click="editor.chain().focus().setFontFamily('Inter').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'Inter' }) }">
       Inter
     </button>
-    <button @click="editor.chain().focus().fontFamily('Comic Sans MS, Comic Sans').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'Comic Sans MS, Comic Sans' }) }">
+    <button @click="editor.chain().focus().setFontFamily('Comic Sans MS, Comic Sans').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'Comic Sans MS, Comic Sans' }) }">
       Comic Sans
     </button>
-    <button @click="editor.chain().focus().fontFamily('serif').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'serif' }) }">
+    <button @click="editor.chain().focus().setFontFamily('serif').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'serif' }) }">
       serif
     </button>
-    <button @click="editor.chain().focus().fontFamily('monospace').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'monospace' }) }">
+    <button @click="editor.chain().focus().setFontFamily('monospace').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'monospace' }) }">
       monospace
     </button>
-    <button @click="editor.chain().focus().fontFamily('cursive').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'cursive' }) }">
+    <button @click="editor.chain().focus().setFontFamily('cursive').run()" :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'cursive' }) }">
       cursive
     </button>
-    <button @click="editor.chain().focus().fontFamily().run()">
+    <button @click="editor.chain().focus().unsetFontFamily().run()">
       Remove font-family
     </button>
 
diff --git a/packages/extension-font-family/src/index.ts b/packages/extension-font-family/src/index.ts
index c1eebf91..c29cad73 100644
--- a/packages/extension-font-family/src/index.ts
+++ b/packages/extension-font-family/src/index.ts
@@ -38,11 +38,19 @@ const FontFamily = Extension.create({
   addCommands() {
     return {
       /**
-       * Update the font family
+       * Set the font family
        */
-      fontFamily: (fontFamily: string | null = null): Command => ({ chain }) => {
+      setFontFamily: (fontFamily: string): Command => ({ chain }) => {
         return chain()
           .addMark('textStyle', { fontFamily })
+          .run()
+      },
+      /**
+       * Unset the font family
+       */
+      unsetFontFamily: (): Command => ({ chain }) => {
+        return chain()
+          .addMark('textStyle', { fontFamily: null })
           .removeEmptyTextStyle()
           .run()
       },