Refactor code structure for improved readability and maintainability

Author: yuguaa

README.md

@@ -6,8 +6,8 @@
 
 支持流式渲染、代码高亮、LaTeX 数学公式、Mermaid 图表等特性
 
-[![NPM version](https://img.shields.io/npm/v/x-markdown.svg)](https://www.npmjs.com/package/x-markdown)
-[![NPM downloads](https://img.shields.io/npm/dm/x-markdown.svg)](https://www.npmjs.com/package/x-markdown)
+[![NPM version](https://img.shields.io/npm/v/x-markdown-vue.svg)](https://www.npmjs.com/package/x-markdown-vue)
+[![NPM downloads](https://img.shields.io/npm/dm/x-markdown-vue.svg)](https://www.npmjs.com/package/x-markdown-vue)
 [![License](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)
 [![Vue](https://img.shields.io/badge/vue-3.x-brightgreen.svg)](https://vuejs.org/)
 [在线演示](https://x-markdown.netlify.app/) · [报告问题](https://github.com/element-plus-x/x-markdown/issues) · [功能请求](https://github.com/element-plus-x/x-markdown/issues/new)
@@ -52,13 +52,13 @@
 
 ```bash
 # pnpm (推荐)
-pnpm add x-markdown
+pnpm add x-markdown-vue
 
 # npm
-npm install x-markdown
+npm install x-markdown-vue
 
 # yarn
-yarn add x-markdown
+yarn add x-markdown-vue
 ```
 
 ### 依赖项
@@ -86,8 +86,8 @@ import 'katex/dist/katex.min.css'
 
 <script setup lang="ts">
 import { ref } from 'vue'
-import { MarkdownRenderer } from 'x-markdown'
-import 'x-markdown/style'
+import { MarkdownRenderer } from 'x-markdown-vue'
+import 'x-markdown-vue/style'
 
 const content = ref(`
 # Hello World
@@ -113,8 +113,8 @@ This is a **markdown** renderer.
 
 <script setup lang="ts">
 import { ref } from 'vue'
-import { MarkdownRendererAsync } from 'x-markdown'
-import 'x-markdown/style'
+import { MarkdownRendererAsync } from 'x-markdown-vue'
+import 'x-markdown-vue/style'
 
 const content = ref('# Large Document\n...')
 </script>

packages/playground/package.json

@@ -13,7 +13,7 @@
     "github-markdown-css": "^5.8.1",
     "katex": "^0.16.25",
     "vue": "^3.3.0",
-    "x-markdown": "workspace:*"
+    "x-markdown-vue": "workspace:*"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.0.0",

packages/playground/src/App.vue

@@ -138,7 +138,7 @@
 import 'katex/dist/katex.min.css'
 import 'github-markdown-css/github-markdown.css'
 import { ref, computed, onUnmounted, watch, h } from 'vue'
-import { MarkdownRenderer } from 'x-markdown'
+import { MarkdownRenderer } from 'x-markdown-vue'
 
 // ==================== 状态管理 ====================
 

packages/playground/src/main.ts

@@ -1,6 +1,6 @@
 import { createApp } from 'vue'
 import App from './App.vue'
-import 'x-markdown/style'
+import 'x-markdown-vue/style'
 
 const app = createApp(App)
 app.mount('#app')

packages/x-markdown/README.md

@@ -6,8 +6,8 @@
 
 支持流式渲染、代码高亮、LaTeX 数学公式、Mermaid 图表等特性
 
-[![NPM version](https://img.shields.io/npm/v/x-markdown.svg)](https://www.npmjs.com/package/x-markdown)
-[![NPM downloads](https://img.shields.io/npm/dm/x-markdown.svg)](https://www.npmjs.com/package/x-markdown)
+[![NPM version](https://img.shields.io/npm/v/x-markdown-vue.svg)](https://www.npmjs.com/package/x-markdown-vue)
+[![NPM downloads](https://img.shields.io/npm/dm/x-markdown-vue.svg)](https://www.npmjs.com/package/x-markdown-vue)
 [![License](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)
 [![Vue](https://img.shields.io/badge/vue-3.x-brightgreen.svg)](https://vuejs.org/)
 [在线演示](https://x-markdown.netlify.app/) · [报告问题](https://github.com/element-plus-x/x-markdown/issues) · [功能请求](https://github.com/element-plus-x/x-markdown/issues/new)
@@ -52,13 +52,13 @@
 
 ```bash
 # pnpm (推荐)
-pnpm add x-markdown
+pnpm add x-markdown-vue
 
 # npm
-npm install x-markdown
+npm install x-markdown-vue
 
 # yarn
-yarn add x-markdown
+yarn add x-markdown-vue
 ```
 
 ### 依赖项
@@ -86,8 +86,8 @@ import 'katex/dist/katex.min.css'
 
 <script setup lang="ts">
 import { ref } from 'vue'
-import { MarkdownRenderer } from 'x-markdown'
-import 'x-markdown/style'
+import { MarkdownRenderer } from 'x-markdown-vue'
+import 'x-markdown-vue/style'
 
 const content = ref(`
 # Hello World
@@ -113,8 +113,8 @@ This is a **markdown** renderer.
 
 <script setup lang="ts">
 import { ref } from 'vue'
-import { MarkdownRendererAsync } from 'x-markdown'
-import 'x-markdown/style'
+import { MarkdownRendererAsync } from 'x-markdown-vue'
+import 'x-markdown-vue/style'
 
 const content = ref('# Large Document\n...')
 </script>

packages/x-markdown/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "x-markdown",
+  "name": "x-markdown-vue",
   "version": "0.0.1-beta.1",
   "description": "A markdown component library for Vue",
   "type": "module",
@@ -42,7 +42,7 @@
     "lodash-es": "^4.17.21",
     "mdast": "^3.0.0",
     "mdast-util-to-hast": "^13.2.1",
-    "mermaid": "^10.0.0",
+    "mermaid": "^11.12.2",
     "property-information": "^7.1.0",
     "rehype": "^13.0.0",
     "rehype-katex": "^7.0.0",