refactoring

examples/Components/Routes/Links/index.vue

@@ -2,7 +2,7 @@
   <div class="editor">
     <editor-menu-bubble class="menububble" :editor="editor">
       <div
-        slot-scope="{ commands, isActive, markAttrs, menu }"
+        slot-scope="{ commands, isActive, getMarkAttrs, menu }"
         class="menububble"
         :class="{ 'is-active': menu.isActive }"
         :style="`left: ${menu.left}px; bottom: ${menu.bottom}px;`"
@@ -18,7 +18,7 @@
         <template v-else>
           <button
             class="menububble__button"
-            @click="showLinkMenu(markAttrs('link'))"
+            @click="showLinkMenu(getMarkAttrs('link'))"
             :class="{ 'is-active': isActive.link() }"
           >
             <span>Add Link</span>

packages/tiptap/src/Components/EditorFloatingMenu.js

@@ -43,7 +43,7 @@ export default {
       focus: this.editor.focus,
       commands: this.editor.commands,
       isActive: this.editor.isActive,
-      markAttrs: this.editor.markAttrs.bind(this.editor),
+      getMarkAttrs: this.editor.getMarkAttrs.bind(this.editor),
       menu: this.menu,
     })
   },

packages/tiptap/src/Components/EditorMenuBar.js

@@ -15,7 +15,7 @@ export default {
       focus: this.editor.focus,
       commands: this.editor.commands,
       isActive: this.editor.isActive,
-      markAttrs: this.editor.markAttrs.bind(this.editor),
+      getMarkAttrs: this.editor.getMarkAttrs.bind(this.editor),
     })
   },
 }

packages/tiptap/src/Components/EditorMenuBubble.js

@@ -43,7 +43,7 @@ export default {
       focus: this.editor.focus,
       commands: this.editor.commands,
       isActive: this.editor.isActive,
-      markAttrs: this.editor.markAttrs.bind(this.editor),
+      getMarkAttrs: this.editor.getMarkAttrs.bind(this.editor),
       menu: this.menu,
     })
   },

packages/tiptap/src/utils/Editor.js

@@ -280,23 +280,20 @@ export default class Editor {
     }
   }
 
-  markAttrs(type = null) {
+  getMarkAttrs(type = null) {
     return this.activeMarkAttrs[type]
   }
 
   get isActive() {
-    const types = {
+    return Object
+      .entries({
         ...this.activeMarks,
         ...this.activeNodes,
-    }
-
-    Object
-      .entries(types)
-      .forEach(([name, value]) => {
-        types[name] = (attrs = {}) => value(attrs)
       })
-
-    return types
+      .reduce((types, [name, value]) => ({
+        ...types,
+        [name]: (attrs = {}) => value(attrs),
+      }), {})
   }
 
   destroy() {