tabs to spaces whitespace

examples/Components/Routes/Links/index.vue

@@ -1,113 +1,113 @@
 <template>
-	<div class="editor">
-		<menu-bubble class="menububble" :editor="editor">
-			<div
-				slot-scope="{ commands, isActive, markAttrs, menu }"
-				class="menububble"
-				:class="{ 'is-active': menu.isActive }"
-				:style="`left: ${menu.left}px; bottom: ${menu.bottom}px;`"
-			>
+  <div class="editor">
+    <menu-bubble class="menububble" :editor="editor">
+      <div
+        slot-scope="{ commands, isActive, markAttrs, menu }"
+        class="menububble"
+        :class="{ 'is-active': menu.isActive }"
+        :style="`left: ${menu.left}px; bottom: ${menu.bottom}px;`"
+      >
 
-				<form class="menububble__form" v-if="linkMenuIsActive" @submit.prevent="setLinkUrl(commands.link, linkUrl)">
-					<input class="menububble__input" type="text" v-model="linkUrl" placeholder="https://" ref="linkInput" @keydown.esc="hideLinkMenu"/>
-					<button class="menububble__button" @click="setLinkUrl(commands.link, null)" type="button">
-						<icon name="remove" />
-					</button>
-				</form>
+        <form class="menububble__form" v-if="linkMenuIsActive" @submit.prevent="setLinkUrl(commands.link, linkUrl)">
+          <input class="menububble__input" type="text" v-model="linkUrl" placeholder="https://" ref="linkInput" @keydown.esc="hideLinkMenu"/>
+          <button class="menububble__button" @click="setLinkUrl(commands.link, null)" type="button">
+            <icon name="remove" />
+          </button>
+        </form>
 
-				<template v-else>
-					<button
-						class="menububble__button"
-						@click="showLinkMenu(markAttrs('link'))"
-						:class="{ 'is-active': isActive('link') }"
-					>
-						<span>Add Link</span>
-						<icon name="link" />
-					</button>
-				</template>
+        <template v-else>
+          <button
+            class="menububble__button"
+            @click="showLinkMenu(markAttrs('link'))"
+            :class="{ 'is-active': isActive('link') }"
+          >
+            <span>Add Link</span>
+            <icon name="link" />
+          </button>
+        </template>
 
-			</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,
-	History,
+  Blockquote,
+  BulletList,
+  CodeBlock,
+  HardBreak,
+  Heading,
+  ListItem,
+  OrderedList,
+  TodoItem,
+  TodoList,
+  Bold,
+  Code,
+  Italic,
+  Link,
+  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 History(),
-				],
-				content: `
-					<h2>
-						Links
-					</h2>
-					<p>
-						Try to add some links to the <a href="https://en.wikipedia.org/wiki/World_Wide_Web">world wide web</a>. By default every link will get a <code>rel="noopener noreferrer nofollow"</code> attribute.
-					</p>
-				`,
-			}),
-			linkUrl: null,
-			linkMenuIsActive: false,
-		}
-	},
-	methods: {
-		showLinkMenu(attrs) {
-			this.linkUrl = attrs.href
-			this.linkMenuIsActive = true
-			this.$nextTick(() => {
-				this.$refs.linkInput.focus()
-			})
-		},
-		hideLinkMenu() {
-			this.linkUrl = null
-			this.linkMenuIsActive = false
-		},
-		setLinkUrl(command, url) {
-			command({ href: url })
-			this.hideLinkMenu()
-			this.editor.focus()
-		},
-	},
+  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 History(),
+        ],
+        content: `
+          <h2>
+            Links
+          </h2>
+          <p>
+            Try to add some links to the <a href="https://en.wikipedia.org/wiki/World_Wide_Web">world wide web</a>. By default every link will get a <code>rel="noopener noreferrer nofollow"</code> attribute.
+          </p>
+        `,
+      }),
+      linkUrl: null,
+      linkMenuIsActive: false,
+    }
+  },
+  methods: {
+    showLinkMenu(attrs) {
+      this.linkUrl = attrs.href
+      this.linkMenuIsActive = true
+      this.$nextTick(() => {
+        this.$refs.linkInput.focus()
+      })
+    },
+    hideLinkMenu() {
+      this.linkUrl = null
+      this.linkMenuIsActive = false
+    },
+    setLinkUrl(command, url) {
+      command({ href: url })
+      this.hideLinkMenu()
+      this.editor.focus()
+    },
+  },
 }
-</script>
+</script>