diff --git a/src/UserInterface/ToolBar/ToolBar.vue b/src/UserInterface/ToolBar/ToolBar.vue
index f989743..fa33a6b 100644
--- a/src/UserInterface/ToolBar/ToolBar.vue
+++ b/src/UserInterface/ToolBar/ToolBar.vue
@@ -2,10 +2,10 @@
 import { ref, type Component } from 'vue'
 import ToolTabs from './components/ToolTabs.vue'
 import TabContent from './components/TabContent.vue'
-import Home from './components/Home/index.vue'
-import Insert from './components/Insert/Index.vue'
-import Draw from './components/Draw/index.vue'
-import SlideShow from './components/SlideShow/index.vue'
+import Home from './components/Home/Home.vue'
+import Insert from './components/Insert/Insert.vue'
+import Draw from './components/Draw/Draw.vue'
+import SlideShow from './components/SlideShow/SlideShow.vue'
 import { TOOL_TABS } from './const'
 
 const activeTab = ref('Home')
diff --git a/src/UserInterface/ToolBar/components/Draw/index.vue b/src/UserInterface/ToolBar/components/Draw/Draw.vue
similarity index 62%
rename from src/UserInterface/ToolBar/components/Draw/index.vue
rename to src/UserInterface/ToolBar/components/Draw/Draw.vue
index 2a0790e..ae5b24b 100644
--- a/src/UserInterface/ToolBar/components/Draw/index.vue
+++ b/src/UserInterface/ToolBar/components/Draw/Draw.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Tools from './Tools.vue'
+import Tools from './components/Tools.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Draw/Tools.vue b/src/UserInterface/ToolBar/components/Draw/components/Tools.vue
similarity index 90%
rename from src/UserInterface/ToolBar/components/Draw/Tools.vue
rename to src/UserInterface/ToolBar/components/Draw/components/Tools.vue
index c73ae10..cfb730d 100644
--- a/src/UserInterface/ToolBar/components/Draw/Tools.vue
+++ b/src/UserInterface/ToolBar/components/Draw/components/Tools.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { Pencil } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { toolBox } from '@Kernel/index'
 </script>
 
diff --git a/src/UserInterface/ToolBar/components/Home/Home.vue b/src/UserInterface/ToolBar/components/Home/Home.vue
new file mode 100644
index 0000000..7542d58
--- /dev/null
+++ b/src/UserInterface/ToolBar/components/Home/Home.vue
@@ -0,0 +1,21 @@
+<script setup lang="ts">
+import UndoRedo from './components/UndoRedo.vue'
+import Clipboard from './components/Clipboard.vue'
+import Delete from './components/Delete.vue'
+import Slides from './components/Slides.vue'
+import FontStyle from './components/FontStyle.vue'
+import Paragraph from './components/Paragraph.vue'
+import Draw from './components/Draw.vue'
+// import Edit from './Edit.vue'
+</script>
+
+<template>
+  <UndoRedo />
+  <Clipboard />
+  <Delete />
+  <Slides />
+  <FontStyle />
+  <Paragraph />
+  <Draw />
+  <!-- <Edit /> -->
+</template>
diff --git a/src/UserInterface/ToolBar/components/Home/Clipboard.vue b/src/UserInterface/ToolBar/components/Home/components/Clipboard.vue
similarity index 96%
rename from src/UserInterface/ToolBar/components/Home/Clipboard.vue
rename to src/UserInterface/ToolBar/components/Home/components/Clipboard.vue
index 5c5f265..0f21b0a 100644
--- a/src/UserInterface/ToolBar/components/Home/Clipboard.vue
+++ b/src/UserInterface/ToolBar/components/Home/components/Clipboard.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { Notepad, CuttingOne, CopyOne, Format } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
-import ToolButton from '../ToolButton.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
+import ToolButton from '../../ToolButton.vue'
 import { richTextObserver, selectionManager } from '@Kernel/index'
 import { ref, shallowRef, computed } from 'vue'
 
diff --git a/src/UserInterface/ToolBar/components/Home/Delete.vue b/src/UserInterface/ToolBar/components/Home/components/Delete.vue
similarity index 90%
rename from src/UserInterface/ToolBar/components/Home/Delete.vue
rename to src/UserInterface/ToolBar/components/Home/components/Delete.vue
index 1d55e56..3f6274f 100644
--- a/src/UserInterface/ToolBar/components/Home/Delete.vue
+++ b/src/UserInterface/ToolBar/components/Home/components/Delete.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import { Close } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { selectionManager, slideManager } from '@Kernel/index'
 import { shallowRef } from 'vue'
-import ToolButton from '../ToolButton.vue'
+import ToolButton from '../../ToolButton.vue'
 
 const selectedBlocks = shallowRef(selectionManager.selectedBlocks)
 selectionManager.events.update.on(() => {
diff --git a/src/UserInterface/ToolBar/components/Home/Draw.vue b/src/UserInterface/ToolBar/components/Home/components/Draw.vue
similarity index 94%
rename from src/UserInterface/ToolBar/components/Home/Draw.vue
rename to src/UserInterface/ToolBar/components/Home/components/Draw.vue
index 752c17b..c576881 100644
--- a/src/UserInterface/ToolBar/components/Home/Draw.vue
+++ b/src/UserInterface/ToolBar/components/Home/components/Draw.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { Stickers, BackgroundColor, Copy, Platte, BringToFrontOne } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
-import Shapes from '../common/Shapes.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
+import Shapes from '../../common/Shapes.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Home/Edit.vue b/src/UserInterface/ToolBar/components/Home/components/Edit.vue
similarity index 93%
rename from src/UserInterface/ToolBar/components/Home/Edit.vue
rename to src/UserInterface/ToolBar/components/Home/components/Edit.vue
index bf32e4e..cc11f23 100644
--- a/src/UserInterface/ToolBar/components/Home/Edit.vue
+++ b/src/UserInterface/ToolBar/components/Home/components/Edit.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { Search, DataSwitching } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Home/FontStyle.vue b/src/UserInterface/ToolBar/components/Home/components/FontStyle.vue
similarity index 99%
rename from src/UserInterface/ToolBar/components/Home/FontStyle.vue
rename to src/UserInterface/ToolBar/components/Home/components/FontStyle.vue
index 636e920..bc6a01a 100644
--- a/src/UserInterface/ToolBar/components/Home/FontStyle.vue
+++ b/src/UserInterface/ToolBar/components/Home/components/FontStyle.vue
@@ -10,7 +10,7 @@ import {
   Write,
   Platte,
 } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { richTextObserver, selectionManager } from '@Kernel/index'
 import { intersectAttributes } from '@Utils/intersectAttributes'
 import { ref } from 'vue'
diff --git a/src/UserInterface/ToolBar/components/Home/Paragraph.vue b/src/UserInterface/ToolBar/components/Home/components/Paragraph.vue
similarity index 98%
rename from src/UserInterface/ToolBar/components/Home/Paragraph.vue
rename to src/UserInterface/ToolBar/components/Home/components/Paragraph.vue
index dd4769f..969a928 100644
--- a/src/UserInterface/ToolBar/components/Home/Paragraph.vue
+++ b/src/UserInterface/ToolBar/components/Home/components/Paragraph.vue
@@ -10,7 +10,7 @@ import {
   AlignTextRight,
   AlignTextCenter,
 } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { AlignType, TextBoxBlock } from '@BlockHub/TextBoxBlock/TextBoxBlock'
 import { selectionManager } from '@Kernel/index'
 import { ref, shallowRef } from 'vue'
diff --git a/src/UserInterface/ToolBar/components/Home/Slides.vue b/src/UserInterface/ToolBar/components/Home/components/Slides.vue
similarity index 89%
rename from src/UserInterface/ToolBar/components/Home/Slides.vue
rename to src/UserInterface/ToolBar/components/Home/components/Slides.vue
index c46856b..13c4f19 100644
--- a/src/UserInterface/ToolBar/components/Home/Slides.vue
+++ b/src/UserInterface/ToolBar/components/Home/components/Slides.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { Slide, Copy } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { slideManager } from '@Kernel/index'
-import ToolButton from '../ToolButton.vue'
+import ToolButton from '../../ToolButton.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Home/UndoRedo.vue b/src/UserInterface/ToolBar/components/Home/components/UndoRedo.vue
similarity index 94%
rename from src/UserInterface/ToolBar/components/Home/UndoRedo.vue
rename to src/UserInterface/ToolBar/components/Home/components/UndoRedo.vue
index d1cf65a..0e87e71 100644
--- a/src/UserInterface/ToolBar/components/Home/UndoRedo.vue
+++ b/src/UserInterface/ToolBar/components/Home/components/UndoRedo.vue
@@ -2,7 +2,7 @@
 import { ref } from 'vue'
 import { history } from '@Kernel/index'
 import { Undo, Redo } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { onMounted } from 'vue'
 
 const canUndo = ref(false)
diff --git a/src/UserInterface/ToolBar/components/Home/index.vue b/src/UserInterface/ToolBar/components/Home/index.vue
deleted file mode 100644
index fec35ac..0000000
--- a/src/UserInterface/ToolBar/components/Home/index.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import UndoRedo from './UndoRedo.vue'
-import Clipboard from './Clipboard.vue'
-import Delete from './Delete.vue'
-import Slides from './Slides.vue'
-import FontStyle from './FontStyle.vue'
-import Paragraph from './Paragraph.vue'
-import Draw from './Draw.vue'
-// import Edit from './Edit.vue'
-</script>
-
-<template>
-  <UndoRedo />
-  <Clipboard />
-  <Delete />
-  <Slides />
-  <FontStyle />
-  <Paragraph />
-  <Draw />
-  <!-- <Edit /> -->
-</template>
diff --git a/src/UserInterface/ToolBar/components/Insert/Index.vue b/src/UserInterface/ToolBar/components/Insert/Insert.vue
similarity index 64%
rename from src/UserInterface/ToolBar/components/Insert/Index.vue
rename to src/UserInterface/ToolBar/components/Insert/Insert.vue
index 723d613..6aa562a 100644
--- a/src/UserInterface/ToolBar/components/Insert/Index.vue
+++ b/src/UserInterface/ToolBar/components/Insert/Insert.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
-import Slides from './Slides.vue'
-import Table from './Table.vue'
-import Picture from './Picture.vue'
-import Illustration from './Illustration.vue'
+import Slides from './components/Slides.vue'
+import Table from './components/Table.vue'
+import Picture from './components/Picture.vue'
+import Illustration from './components/Illustration.vue'
 // import Link from './Link.vue'
-import Text from './Text.vue'
+import Text from './components/Text.vue'
 // import Footer from './Footer.vue'
 // import Comments from './Comments.vue'
 // import Symbol from './Symbol.vue'
diff --git a/src/UserInterface/ToolBar/components/Insert/Comments.vue b/src/UserInterface/ToolBar/components/Insert/components/Comments.vue
similarity index 92%
rename from src/UserInterface/ToolBar/components/Insert/Comments.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Comments.vue
index 3403367..0c23e84 100644
--- a/src/UserInterface/ToolBar/components/Insert/Comments.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Comments.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { Comment, Down } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Insert/Footer.vue b/src/UserInterface/ToolBar/components/Insert/components/Footer.vue
similarity index 92%
rename from src/UserInterface/ToolBar/components/Insert/Footer.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Footer.vue
index 725c5ef..a59f7c1 100644
--- a/src/UserInterface/ToolBar/components/Insert/Footer.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Footer.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { DocDetail, Down } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Insert/Illustration.vue b/src/UserInterface/ToolBar/components/Insert/components/Illustration.vue
similarity index 93%
rename from src/UserInterface/ToolBar/components/Insert/Illustration.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Illustration.vue
index 4ea1b33..70ea092 100644
--- a/src/UserInterface/ToolBar/components/Insert/Illustration.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Illustration.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { PictureAlbum, Down, Outdoor, GameEmoji } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
-import Shapes from '../common/Shapes.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
+import Shapes from '../../common/Shapes.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Insert/Link.vue b/src/UserInterface/ToolBar/components/Insert/components/Link.vue
similarity index 92%
rename from src/UserInterface/ToolBar/components/Insert/Link.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Link.vue
index 9f5fd08..5a8dd3a 100644
--- a/src/UserInterface/ToolBar/components/Insert/Link.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Link.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { LinkTwo, Down } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Insert/Media.vue b/src/UserInterface/ToolBar/components/Insert/components/Media.vue
similarity index 94%
rename from src/UserInterface/ToolBar/components/Insert/Media.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Media.vue
index 55cccc1..1f2448a 100644
--- a/src/UserInterface/ToolBar/components/Insert/Media.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Media.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { Down, SpeakerOne, Video } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Insert/Picture.vue b/src/UserInterface/ToolBar/components/Insert/components/Picture.vue
similarity index 91%
rename from src/UserInterface/ToolBar/components/Insert/Picture.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Picture.vue
index 7ace69b..b7da482 100644
--- a/src/UserInterface/ToolBar/components/Insert/Picture.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Picture.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
 import { Pic } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { pickFile } from '@Utils/pickFile'
 import { PictureBlock } from '@BlockHub/PictureBlock/PictureBlock'
 import { selectionManager, slideManager } from '@Kernel/index'
-import ToolButton from '../ToolButton.vue'
+import ToolButton from '../../ToolButton.vue'
 
 async function insertPicture() {
   const block = new PictureBlock(200, 200)
diff --git a/src/UserInterface/ToolBar/components/Insert/Slides.vue b/src/UserInterface/ToolBar/components/Insert/components/Slides.vue
similarity index 84%
rename from src/UserInterface/ToolBar/components/Insert/Slides.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Slides.vue
index 31403d8..8daf4d0 100644
--- a/src/UserInterface/ToolBar/components/Insert/Slides.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Slides.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { Slide } from '@icon-park/vue-next'
 import { slideManager } from '@Kernel/index'
-import ButtonGroup from '../ButtonGroup.vue'
-import ToolButton from '../ToolButton.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
+import ToolButton from '../../ToolButton.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Insert/Symbol.vue b/src/UserInterface/ToolBar/components/Insert/components/Symbol.vue
similarity index 91%
rename from src/UserInterface/ToolBar/components/Insert/Symbol.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Symbol.vue
index 4faf262..6ec3f3c 100644
--- a/src/UserInterface/ToolBar/components/Insert/Symbol.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Symbol.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { Symbol, Down } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/Insert/Table.vue b/src/UserInterface/ToolBar/components/Insert/components/Table.vue
similarity index 95%
rename from src/UserInterface/ToolBar/components/Insert/Table.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Table.vue
index 09a4502..0272190 100644
--- a/src/UserInterface/ToolBar/components/Insert/Table.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Table.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
 import { ref } from 'vue'
 import { TableFile } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { selectionManager, slideManager } from '@Kernel/index'
 import { TableBlock } from '@BlockHub/TableBlock/TableBlock'
-import ToolButton from '../ToolButton.vue'
+import ToolButton from '../../ToolButton.vue'
 
 const curRowIndex = ref<number>(0)
 const curColIndex = ref<number>(0)
diff --git a/src/UserInterface/ToolBar/components/Insert/Text.vue b/src/UserInterface/ToolBar/components/Insert/components/Text.vue
similarity index 86%
rename from src/UserInterface/ToolBar/components/Insert/Text.vue
rename to src/UserInterface/ToolBar/components/Insert/components/Text.vue
index d8c401f..e63b3b8 100644
--- a/src/UserInterface/ToolBar/components/Insert/Text.vue
+++ b/src/UserInterface/ToolBar/components/Insert/components/Text.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { TextRecognition } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { toolBox } from '@Kernel/index'
-import ToolButton from '../ToolButton.vue'
+import ToolButton from '../../ToolButton.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/SlideShow/index.vue b/src/UserInterface/ToolBar/components/SlideShow/SlideShow.vue
similarity index 56%
rename from src/UserInterface/ToolBar/components/SlideShow/index.vue
rename to src/UserInterface/ToolBar/components/SlideShow/SlideShow.vue
index 381289a..d704ca8 100644
--- a/src/UserInterface/ToolBar/components/SlideShow/index.vue
+++ b/src/UserInterface/ToolBar/components/SlideShow/SlideShow.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import StartSlideShow from './StartSlideShow.vue'
+import StartSlideShow from './components/StartSlideShow.vue'
 </script>
 
 <template>
diff --git a/src/UserInterface/ToolBar/components/SlideShow/StartSlideShow.vue b/src/UserInterface/ToolBar/components/SlideShow/components/StartSlideShow.vue
similarity index 94%
rename from src/UserInterface/ToolBar/components/SlideShow/StartSlideShow.vue
rename to src/UserInterface/ToolBar/components/SlideShow/components/StartSlideShow.vue
index 874ffb3..6642ab4 100644
--- a/src/UserInterface/ToolBar/components/SlideShow/StartSlideShow.vue
+++ b/src/UserInterface/ToolBar/components/SlideShow/components/StartSlideShow.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { Ppt, SlideTwo } from '@icon-park/vue-next'
-import ButtonGroup from '../ButtonGroup.vue'
+import ButtonGroup from '../../ButtonGroup.vue'
 import { slideShowMode } from '@Kernel/index'
 
 const show = (mode: 'start' | 'current') => {