improve text style extension

docs/src/demos/Marks/TextStyle/index.vue

@@ -1,11 +1,14 @@
 <template>
   <div v-if="editor">
-    <button @click="editor.chain().focus().fontFamily('Inter').run()">
-      Inter
-    </button>
-    <button @click="editor.chain().focus().fontFamily('Comic Sans MS').run()">
+    <button
+      @click="editor.chain().focus().fontFamily('Comic Sans MS').run()"
+      :class="{ 'is-active': editor.isActive('textStyle', { fontFamily: 'Comic Sans MS' }) }"
+    >
       Comic Sans
     </button>
+    <button @click="editor.chain().focus().fontFamily().run()">
+      Remove font-family
+    </button>
 
     <editor-content :editor="editor" />
   </div>
@@ -17,7 +20,6 @@ import { EditorContent } from '@tiptap/vue'
 import Document from '@tiptap/extension-document'
 import Paragraph from '@tiptap/extension-paragraph'
 import Text from '@tiptap/extension-text'
-import Heading from '@tiptap/extension-heading'
 import TextStyle from '@tiptap/extension-text-style'
 import FontFamily from '@tiptap/extension-font-family'
 
@@ -38,13 +40,11 @@ export default {
         Document(),
         Paragraph(),
         Text(),
-        Heading(),
         TextStyle(),
         FontFamily(),
       ],
       content: `
-        <h2>Hello</h2>
-        <p>This is text.</p>
+        <p><span style="font-family: Comic Sans MS">Welcome to the internet.</span></p>
       `,
     })
   },