tabs to spaces whitespace

examples/Components/Routes/MenuBubble/index.vue

@@ -1,106 +1,106 @@
 <template>
-	<div class="editor">
-		<menu-bubble :editor="editor">
-			<div
-				slot-scope="{ commands, isActive, menu }"
-				class="menububble"
-				:class="{ 'is-active': menu.isActive }"
-				:style="`left: ${menu.left}px; bottom: ${menu.bottom}px;`"
-			>
+  <div class="editor">
+    <menu-bubble :editor="editor">
+      <div
+        slot-scope="{ commands, isActive, menu }"
+        class="menububble"
+        :class="{ 'is-active': menu.isActive }"
+        :style="`left: ${menu.left}px; bottom: ${menu.bottom}px;`"
+      >
 
-				<button
-					class="menububble__button"
-					:class="{ 'is-active': isActive('bold') }"
-					@click="commands.bold"
-				>
-					<icon name="bold" />
-				</button>
+        <button
+          class="menububble__button"
+          :class="{ 'is-active': isActive('bold') }"
+          @click="commands.bold"
+        >
+          <icon name="bold" />
+        </button>
 
-				<button
-					class="menububble__button"
-					:class="{ 'is-active': isActive('italic') }"
-					@click="commands.italic"
-				>
-					<icon name="italic" />
-				</button>
+        <button
+          class="menububble__button"
+          :class="{ 'is-active': isActive('italic') }"
+          @click="commands.italic"
+        >
+          <icon name="italic" />
+        </button>
 
-				<button
-					class="menububble__button"
-					:class="{ 'is-active': isActive('code') }"
-					@click="commands.code"
-				>
-					<icon name="code" />
-				</button>
+        <button
+          class="menububble__button"
+          :class="{ 'is-active': isActive('code') }"
+          @click="commands.code"
+        >
+          <icon name="code" />
+        </button>
 
-			</div>
-		</menu-bubble>
+      </div>
+    </menu-bubble>
 
-		<editor-content class="editor__content" :editor="editor" />
-	</div>
+    <editor-content class="editor__content" :editor="editor" />
+  </div>
 </template>
 
 <script>
 import Icon from 'Components/Icon'
 import { Editor, EditorContent, MenuBubble } from 'tiptap'
 import {
-	Blockquote,
-	BulletList,
-	CodeBlock,
-	HardBreak,
-	Heading,
-	ListItem,
-	OrderedList,
-	TodoItem,
-	TodoList,
-	Bold,
-	Code,
-	Italic,
-	Link,
-	Strike,
-	Underline,
-	History,
+  Blockquote,
+  BulletList,
+  CodeBlock,
+  HardBreak,
+  Heading,
+  ListItem,
+  OrderedList,
+  TodoItem,
+  TodoList,
+  Bold,
+  Code,
+  Italic,
+  Link,
+  Strike,
+  Underline,
+  History,
 } from 'tiptap-extensions'
 
 export default {
-	components: {
-		EditorContent,
-		MenuBubble,
-		Icon,
-	},
-	data() {
-		return {
-			editor: new Editor({
-				extensions: [
-					new Blockquote(),
-					new BulletList(),
-					new CodeBlock(),
-					new HardBreak(),
-					new Heading({ levels: [1, 2, 3] }),
-					new ListItem(),
-					new OrderedList(),
-					new TodoItem(),
-					new TodoList(),
-					new Bold(),
-					new Code(),
-					new Italic(),
-					new Link(),
-					new Strike(),
-					new Underline(),
-					new History(),
-				],
-				content: `
-					<h2>
-						Menu Bubble
-					</h2>
-					<p>
-						Hey, try to select some text here. There will popup a menu for selecting some inline styles. <em>Remember:</em> you have full control about content and styling of this menu.
-					</p>
-				`,
-			}),
-		}
-	},
-	beforeDestroy() {
-		this.editor.destroy()
-	},
+  components: {
+    EditorContent,
+    MenuBubble,
+    Icon,
+  },
+  data() {
+    return {
+      editor: new Editor({
+        extensions: [
+          new Blockquote(),
+          new BulletList(),
+          new CodeBlock(),
+          new HardBreak(),
+          new Heading({ levels: [1, 2, 3] }),
+          new ListItem(),
+          new OrderedList(),
+          new TodoItem(),
+          new TodoList(),
+          new Bold(),
+          new Code(),
+          new Italic(),
+          new Link(),
+          new Strike(),
+          new Underline(),
+          new History(),
+        ],
+        content: `
+          <h2>
+            Menu Bubble
+          </h2>
+          <p>
+            Hey, try to select some text here. There will popup a menu for selecting some inline styles. <em>Remember:</em> you have full control about content and styling of this menu.
+          </p>
+        `,
+      }),
+    }
+  },
+  beforeDestroy() {
+    this.editor.destroy()
+  },
 }
-</script>
+</script>