refactor: remove vitepress dependency and rename project

README.md

@@ -1,6 +1,6 @@
-# Yunsi Toolbox
+# Yunsi Toolbox Vue
 
-A collection of web-based tools for hardware development and debugging.
+A collection of web-based tools.
 
 ## Components
 
@@ -9,7 +9,7 @@ A browser-based firmware flasher for ESP32 microcontrollers using Web Serial.
 
 ## Installation
 
-This is intended to be used as a git submodule in Vue 3 projects (specifically optimized for VitePress).
+This is intended to be used as a git submodule in Vue 3 projects.
 
 ```bash
 git submodule add <repository-url> src/components/yunsi-toolbox

esp-flasher/EspFlasher.vue

@@ -17,16 +17,10 @@ import 'xterm/css/xterm.css';
 import {onBeforeMount, onMounted, reactive, ref, watch} from "vue";
 import {ESPLoader, type FlashOptions, type IEspLoaderTerminal, type LoaderOptions, Transport} from "./lib_esptools-js";
 import CryptoJS from "crypto-js";
-import {useData} from 'vitepress';
 
 const terminalContainer = ref();
 let terminal: any;
 let fitAddon: any;
-const isDarkMode = useData().isDark;
-
-watch(isDarkMode, value => {
-  
-});
 
 const terminalConfig = {
   theme: {
@@ -99,8 +93,13 @@ type ImageOption = {
 
 const props = defineProps<{
   imageOptions: ImageOption[];
+  isDark?: boolean;
 }>();
 
+watch(() => props.isDark, (value) => {
+  // Handle dark mode change if needed for xterm
+});
+
 const imageSelect = ref(props.imageOptions[0]);
 
 let transport: Transport | null;

esp-flasher/README.md

@@ -7,7 +7,7 @@ A Vue 3 component for flashing ESP32 series microcontrollers directly from the b
 - Supports ESP32, ESP32-C3, ESP32-S3, and more.
 - Built-in Xterm.js terminal for progress and logging.
 - Support for multiple firmware image options.
-- Dark mode support (compatible with VitePress).
+- Dark mode support via prop.
 
 ## Usage
 
@@ -16,6 +16,7 @@ A Vue 3 component for flashing ESP32 series microcontrollers directly from the b
 | Prop | Type | Description |
 | :--- | :--- | :--- |
 | `imageOptions` | `ImageOption[]` | An array of firmware images available for flashing. |
+| `isDark` | `boolean` | (Optional) Toggle dark mode for the terminal. |
 
 #### ImageOption Object
 
@@ -32,6 +33,9 @@ type ImageOption = {
 ```vue
 <script setup lang="ts">
 import EspFlasher from './path/to/yunsi-toolbox/esp-flasher/EspFlasher.vue';
+import { ref } from 'vue';
+
+const isDark = ref(false);
 
 const imageOptions = [
   {
@@ -48,7 +52,7 @@ const imageOptions = [
 </script>
 
 <template>
-  <EspFlasher :imageOptions="imageOptions" />
+  <EspFlasher :imageOptions="imageOptions" :isDark="isDark" />
 </template>
 ```
 
@@ -58,7 +62,6 @@ const imageOptions = [
 - `xterm`
 - `xterm-addon-fit`
 - `crypto-js`
-- `vitepress` (for `useData` dark mode toggle)
 
 ## Credits