From 82967e63c26acaa6ffdad2e8e3e3b0e51875bbf0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 17:50:05 +0800
Subject: [PATCH 01/30] refactor(cli): rename `children` to `items` to fix
 changes with vitepress api

Related Issues: #1879
---
 .../devui-vue/devui-cli/templates/vitepress-sidebar.js    | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/devui-vue/devui-cli/templates/vitepress-sidebar.js b/packages/devui-vue/devui-cli/templates/vitepress-sidebar.js
index 28ba17c133..be789daf6c 100644
--- a/packages/devui-vue/devui-cli/templates/vitepress-sidebar.js
+++ b/packages/devui-vue/devui-cli/templates/vitepress-sidebar.js
@@ -14,8 +14,8 @@ const { isReadyToRelease } = require('../shared/utils');
 //   return { text, link: `/${SITES_COMPONENTS_DIR_NAME}/${kebabCase(name)}/`, status }
 // }
 
-function buildCategoryOptions(text, children = []) {
-  return { text, children };
+function buildCategoryOptions(text, items = []) {
+  return { text, items };
 }
 
 function generateZhMenus(componentsInfo) {
@@ -72,7 +72,7 @@ exports.createVitepressSidebarTemplates = (componentsInfo = []) => {
         },
         {
           "text": "Design Token",
-          "children": DESIGN_TOKENS_INFO
+          "items": DESIGN_TOKENS_INFO
         },
       ],
       handler: generateZhMenus,
@@ -94,7 +94,7 @@ exports.createVitepressSidebarTemplates = (componentsInfo = []) => {
         },
         {
           "text": "Design Token",
-          "children": DESIGN_TOKENS_INFO
+          "items": DESIGN_TOKENS_INFO
         },
       ],
       handler: generateEnMenus,

From ab4cd16788b6f6fe6804d5f44cf82d9b5e6852cf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 17:50:43 +0800
Subject: [PATCH 02/30] refactor(config): refactor config for vitepress@latest

Related Issues: #1879
---
 packages/devui-vue/docs/.vitepress/config.js  |  4 --
 packages/devui-vue/docs/.vitepress/config.mts | 54 +++++++++++++++++++
 .../devui-vue/docs/.vitepress/config/index.ts | 46 ----------------
 .../devui-vue/docs/.vitepress/config/lang.ts  | 16 ------
 .../docs/.vitepress/config/markdown.ts        | 14 -----
 5 files changed, 54 insertions(+), 80 deletions(-)
 delete mode 100644 packages/devui-vue/docs/.vitepress/config.js
 create mode 100644 packages/devui-vue/docs/.vitepress/config.mts
 delete mode 100644 packages/devui-vue/docs/.vitepress/config/index.ts
 delete mode 100644 packages/devui-vue/docs/.vitepress/config/lang.ts
 delete mode 100644 packages/devui-vue/docs/.vitepress/config/markdown.ts

diff --git a/packages/devui-vue/docs/.vitepress/config.js b/packages/devui-vue/docs/.vitepress/config.js
deleted file mode 100644
index 1fe86bc36a..0000000000
--- a/packages/devui-vue/docs/.vitepress/config.js
+++ /dev/null
@@ -1,4 +0,0 @@
-require('esbuild-register')
-
-const config = require('./config/index.ts')
-module.exports = config.default
\ No newline at end of file
diff --git a/packages/devui-vue/docs/.vitepress/config.mts b/packages/devui-vue/docs/.vitepress/config.mts
new file mode 100644
index 0000000000..42a95bfe8a
--- /dev/null
+++ b/packages/devui-vue/docs/.vitepress/config.mts
@@ -0,0 +1,54 @@
+import { defineConfig } from 'vitepress';
+import head from './config/head';
+import nav from './config/nav';
+import sidebar from './config/sidebar';
+import { demoblockPlugin, demoblockVitePlugin } from 'vitepress-theme-demoblock';
+
+// https://vitepress.dev/reference/site-config
+export default defineConfig({
+  title: 'Vue DevUI',
+  description: 'Vue DevUI 组件库',
+
+  head,
+  markdown: {
+    config: (md) => {
+      md.use(demoblockPlugin as any);
+    }
+  },
+  vite: {
+    plugins: [demoblockVitePlugin() as any],
+  },
+
+  locales: {
+    root: {
+      label: '简体中文',
+      lang: 'zh-CN',
+    },
+    en: {
+      label: 'English',
+      lang: 'en-US',
+      link: '/en-US/',
+    },
+  },
+
+  themeConfig: {
+    // https://vitepress.dev/reference/default-theme-config
+    nav,
+    sidebar,
+
+    logo: '../../assets/logo.svg',
+
+    algolia: {
+      appId: 'HOQD3NUZNM',
+      apiKey: '07456b4a262e8c84eb892088e5cc3791',
+      indexName: 'vue-devui',
+    },
+
+    socialLinks: [{ icon: 'github', link: 'https://github.com/DevCloudFE/vue-devui' }],
+
+    footer: {
+      message: 'MIT Licensed',
+      copyright: 'Copyright © 2021-present DevCloudFE',
+    },
+  },
+});
diff --git a/packages/devui-vue/docs/.vitepress/config/index.ts b/packages/devui-vue/docs/.vitepress/config/index.ts
deleted file mode 100644
index 851b8b4c56..0000000000
--- a/packages/devui-vue/docs/.vitepress/config/index.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-import { defineConfig } from 'vitepress'
-import sidebar from './sidebar'
-import head from './head'
-import nav from './nav'
-import markdown from './markdown'
-import lang from './lang'
-
-const config = defineConfig({
-  title: 'Vue DevUI',
-  description: 'Vue DevUI 组件库',
-  head,
-  markdown,
-  locales: {
-    '/': {
-      lang: 'zh-CN',
-      label: '简体中文'
-    },
-    '/en-US': {
-      lang: 'en-US',
-      label: 'English'
-    }
-  },
-  themeConfig: {
-    sidebar,
-    nav,
-    demoblock: lang,
-    logo: '../../assets/logo.svg',
-    locales: {
-      '/': {
-        lang: 'zh-CN',
-        label: '简体中文'
-      },
-      '/en-US': {
-        lang: 'en-US',
-        label: 'English'
-      }
-    },
-    algolia: {
-      appId: 'HOQD3NUZNM',
-      apiKey: '07456b4a262e8c84eb892088e5cc3791',
-      indexName: 'vue-devui'
-    }
-  }
-})
-
-export default config
diff --git a/packages/devui-vue/docs/.vitepress/config/lang.ts b/packages/devui-vue/docs/.vitepress/config/lang.ts
deleted file mode 100644
index 8280942417..0000000000
--- a/packages/devui-vue/docs/.vitepress/config/lang.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-const lang = {
-  '/': {
-    'hide-text': '隐藏代码',
-    'show-text': '显示代码',
-    'copy-button-text': '复制代码片段',
-    'copy-success-text': '复制成功',
-  },
-  '/en-US': {
-    'hide-text': 'Hide',
-    'show-text': 'Expand',
-    'copy-button-text': 'Copy',
-    'copy-success-text': 'Copy Success',
-  },
-};
-
-export default lang;
diff --git a/packages/devui-vue/docs/.vitepress/config/markdown.ts b/packages/devui-vue/docs/.vitepress/config/markdown.ts
deleted file mode 100644
index 476f03037c..0000000000
--- a/packages/devui-vue/docs/.vitepress/config/markdown.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-const options = { cssPreprocessor: 'scss' };
-import { blockPlugin } from '../plugins/block-plugin';
-import { renderPlugin, codePlugin } from 'vitepress-theme-demoblock';
-
-const markdown = {
-  config: (md) => {
-    md.use((curMd) => {
-      curMd.use(blockPlugin, options);
-      curMd.use(codePlugin, options);
-      curMd.use(renderPlugin, options);
-    });
-  }
-}
-export default markdown;

From 0741ac627b4d5a605b9bd5e69be56bf0e674981c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 17:51:04 +0800
Subject: [PATCH 03/30] refactor(home): refactor `index.md` hero settings

Related Issues: #1879
---
 packages/devui-vue/docs/index.md | 33 ++++++++++++++++++++++----------
 1 file changed, 23 insertions(+), 10 deletions(-)

diff --git a/packages/devui-vue/docs/index.md b/packages/devui-vue/docs/index.md
index f7a8223c5e..6fc859e99e 100644
--- a/packages/devui-vue/docs/index.md
+++ b/packages/devui-vue/docs/index.md
@@ -1,11 +1,24 @@
 ---
-home: true
-heroImage: /assets/devui-design.svg
-heroText: Vue DevUI
-tagline: 一个基于 DevUI Design 的 Vue3 组件库
-actionText: 快速开始
-actionLink: /quick-start/
-altActionText: Github
-altActionLink: https://github.com/DevCloudFE/vue-devui
-footer: MIT Licensed | Copyright © 2021-present DevUI
----
\ No newline at end of file
+# https://vitepress.dev/reference/default-theme-home-page
+layout: home
+
+hero:
+  name: 'Vue DevUI'
+  text: '基于 DevUI Design 的 Vue3 组件库'
+  tagline: My great project tagline
+  actions:
+    - theme: brand
+      text: 快速开始
+      link: /quick-start
+    - theme: alt
+      text: Github
+      link: https://github.com/DevCloudFE/vue-devui
+
+features:
+  - title: Feature A
+    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+  - title: Feature B
+    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+  - title: Feature C
+    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+---

From 1c5b5c6645ecc8bfc6b6a76b4833f1fe23220188 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 17:51:23 +0800
Subject: [PATCH 04/30] chore(cache): ignore vitepress caches

Related Issue: #1879
---
 packages/devui-vue/docs/.vitepress/.gitignore | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 packages/devui-vue/docs/.vitepress/.gitignore

diff --git a/packages/devui-vue/docs/.vitepress/.gitignore b/packages/devui-vue/docs/.vitepress/.gitignore
new file mode 100644
index 0000000000..5e46596759
--- /dev/null
+++ b/packages/devui-vue/docs/.vitepress/.gitignore
@@ -0,0 +1 @@
+cache
\ No newline at end of file

From 18d23ef2d2499365aa4836e7274b18ad58ece72a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 17:52:21 +0800
Subject: [PATCH 05/30] refactor(button): merge all vue files into `index.md`

Reasons:
    1. The `demoList` is seems unsupported for latest version of vitepress
    2. The latest `vitepress-theme-demoblock` no longer support for `:::demo <comment>`

Related Issue: #1879
---
 .../docs/components/button/buttonGroup.vue    | 131 -----------
 .../docs/components/button/disable.vue        |  31 ---
 .../devui-vue/docs/components/button/icon.vue |  48 ----
 .../devui-vue/docs/components/button/index.md | 214 ++++++++++++++++--
 .../docs/components/button/loading.vue        |  21 --
 .../docs/components/button/shape.vue          |  11 -
 .../devui-vue/docs/components/button/size.vue |  11 -
 .../docs/components/button/theme.vue          |  57 -----
 8 files changed, 191 insertions(+), 333 deletions(-)
 delete mode 100644 packages/devui-vue/docs/components/button/buttonGroup.vue
 delete mode 100644 packages/devui-vue/docs/components/button/disable.vue
 delete mode 100644 packages/devui-vue/docs/components/button/icon.vue
 delete mode 100644 packages/devui-vue/docs/components/button/loading.vue
 delete mode 100644 packages/devui-vue/docs/components/button/shape.vue
 delete mode 100644 packages/devui-vue/docs/components/button/size.vue
 delete mode 100644 packages/devui-vue/docs/components/button/theme.vue

diff --git a/packages/devui-vue/docs/components/button/buttonGroup.vue b/packages/devui-vue/docs/components/button/buttonGroup.vue
deleted file mode 100644
index 9a87aacb9d..0000000000
--- a/packages/devui-vue/docs/components/button/buttonGroup.vue
+++ /dev/null
@@ -1,131 +0,0 @@
-<template>
-  <div>
-    <d-button-group>
-      <d-button variant="solid">
-        按钮名称
-      </d-button>
-      <d-button
-        icon="icon-select-arrow"
-        variant="solid"
-      />
-    </d-button-group>
-
-    <p>尺寸：sm</p>
-    <d-button-group size="sm">
-      <d-button
-        color="primary"
-        variant="solid"
-      >
-        上海
-      </d-button>
-      <d-button>北京</d-button>
-      <d-button>深圳</d-button>
-    </d-button-group>
-
-    <p>尺寸：默认</p>
-    <d-button-group>
-      <d-button color="primary">
-        上海
-      </d-button>
-      <d-button>北京</d-button>
-      <d-button>深圳</d-button>
-    </d-button-group>
-
-    <p>尺寸：lg</p>
-    <d-button-group size="lg">
-      <d-button color="primary">
-        上海
-      </d-button>
-      <d-button>北京</d-button>
-      <d-button>深圳</d-button>
-    </d-button-group>
-
-    <p>与dropdown下拉菜单一起使用</p>
-    <d-button-group>
-      <d-dropdown
-        style="width: 100px;"
-        :position="position"
-        align="start"
-      >
-        <d-button>Click Me 1</d-button>
-        <template #menu>
-          <ul class="list-menu">
-            <li class="menu-item">
-              Item 1
-            </li>
-            <li class="menu-item">
-              Item 2
-            </li>
-            <li class="menu-item">
-              Item 3
-            </li>
-            <li class="menu-item">
-              Item 4
-            </li>
-          </ul>
-        </template>
-      </d-dropdown>
-      <d-button
-        icon="add"
-        variant="solid"
-      >
-        上海
-      </d-button>
-      <d-dropdown
-        style="width: 100px;"
-        :position="position"
-        align="start"
-      >
-        <d-button>Click Me 2</d-button>
-        <template #menu>
-          <ul class="list-menu">
-            <li class="menu-item">
-              Item 1
-            </li>
-            <li class="menu-item">
-              Item 2
-            </li>
-            <li class="menu-item">
-              Item 3
-            </li>
-            <li class="menu-item">
-              Item 4
-            </li>
-          </ul>
-        </template>
-      </d-dropdown>
-      <d-button icon="filter">
-        北京
-      </d-button>
-      <d-dropdown
-        style="width: 100px;"
-        :position="position"
-        align="start"
-      >
-        <d-button>Click Me 3</d-button>
-        <template #menu>
-          <ul class="list-menu">
-            <li class="menu-item">
-              Item 1
-            </li>
-            <li class="menu-item">
-              Item 2
-            </li>
-            <li class="menu-item">
-              Item 3
-            </li>
-            <li class="menu-item">
-              Item 4
-            </li>
-          </ul>
-        </template>
-      </d-dropdown>
-    </d-button-group>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-
-const position = ref(["bottom-start", "top-start"]);
-</script>
diff --git a/packages/devui-vue/docs/components/button/disable.vue b/packages/devui-vue/docs/components/button/disable.vue
deleted file mode 100644
index e2e4ceec35..0000000000
--- a/packages/devui-vue/docs/components/button/disable.vue
+++ /dev/null
@@ -1,31 +0,0 @@
-<template>
-  <div>
-    <div class="demo-spacing">
-      <d-button variant="solid">
-        Solid Button
-      </d-button>
-      <d-button>Outline Button</d-button>
-      <d-button variant="text">
-        Text Button
-      </d-button>
-    </div>
-
-    <div class="demo-spacing">
-      <d-button
-        variant="solid"
-        disabled
-      >
-        Solid Button
-      </d-button>
-      <d-button disabled>
-        Outline Button
-      </d-button>
-      <d-button
-        variant="text"
-        disabled
-      >
-        Text Button
-      </d-button>
-    </div>
-  </div>
-</template>
diff --git a/packages/devui-vue/docs/components/button/icon.vue b/packages/devui-vue/docs/components/button/icon.vue
deleted file mode 100644
index ed6f044414..0000000000
--- a/packages/devui-vue/docs/components/button/icon.vue
+++ /dev/null
@@ -1,48 +0,0 @@
-<template>
-  <div class="demo-spacing">
-    <d-button
-      icon="add"
-      variant="solid"
-    >
-      New
-    </d-button>
-    <d-button icon="filter">
-      Filter
-    </d-button>
-    <d-button
-      icon="connect"
-      variant="text"
-    >
-      Link
-    </d-button>
-    <d-button
-      icon="delete"
-      variant="text"
-      title="Delete"
-    />
-    <d-button
-      shape="round"
-      title="Add"
-    >
-      Add
-    </d-button>
-    <d-button
-      icon="delete"
-      shape="circle"
-      title="Delete"
-      size="sm"
-    />
-    <d-button
-      icon="delete"
-      shape="circle"
-      title="Delete"
-    />
-    <d-button
-      variant="solid"
-      icon="filter"
-      shape="circle"
-      title="Add"
-      size="lg"
-    />
-  </div>
-</template>
diff --git a/packages/devui-vue/docs/components/button/index.md b/packages/devui-vue/docs/components/button/index.md
index 1b47383b51..4ad82f0c73 100644
--- a/packages/devui-vue/docs/components/button/index.md
+++ b/packages/devui-vue/docs/components/button/index.md
@@ -2,31 +2,77 @@
 
 按钮用于开始一个即时操作。
 
-#### 何时使用
-
+:::tip 何时使用
 标记了一个（或封装一组）操作命令，响应用户点击行为，触发相应的业务逻辑。
+:::
+
+## 用法
 
 ### 形态
 
-:::demo 通过`variant`设置按钮形态，目前支持`solid`、`outline`、`text`三种形态，默认为`outline`。
+通过`variant`设置按钮形态，目前支持`solid`、`outline`、`text`三种形态，默认为`outline`。
 
-button/shape
+:::demo
+
+```vue
+<template>
+  <div class="demo-spacing">
+    <d-button variant="solid"> Solid Button </d-button>
+    <d-button>Outline Button</d-button>
+    <d-button variant="text"> Text Button </d-button>
+  </div>
+</template>
+```
 
 :::
 
 ### 主题色
 
-:::demo 通过`color`设置按钮的主题色，目前支持`primary`、`secondary`、`danger`三种主题色，默认为`secondary`。<br>注意：如果`variant`设置成`solid`，则默认使用`primary`主题色。
+通过`color`设置按钮的主题色，目前支持`primary`、`secondary`、`danger`三种主题色，默认为`secondary`。<br>注意：如果`variant`设置成`solid`，则默认使用`primary`主题色。
+
+:::demo
 
-button/theme
+```vue
+<template>
+  <div>
+    <div class="demo-spacing">
+      <d-button variant="solid" color="primary"> Primary </d-button>
+      <d-button color="primary"> Primary </d-button>
+      <d-button variant="text" color="primary"> Primary </d-button>
+    </div>
+
+    <div class="demo-spacing">
+      <d-button variant="solid" color="secondary"> Secondary </d-button>
+      <d-button color="secondary"> Secondary </d-button>
+      <d-button variant="text" color="secondary"> Secondary </d-button>
+    </div>
+
+    <div class="demo-spacing">
+      <d-button variant="solid" color="danger"> Danger </d-button>
+      <d-button color="danger"> Danger </d-button>
+      <d-button variant="text" color="danger"> Danger </d-button>
+    </div>
+  </div>
+</template>
+```
 
 :::
 
 ### 尺寸
 
-:::demo 通过`size`设置按钮尺寸，支持`sm`、`md`、`lg`三种类型的尺寸，默认为`md`。
+通过`size`设置按钮尺寸，支持`sm`、`md`、`lg`三种类型的尺寸，默认为`md`。
 
-button/size
+:::demo
+
+```vue
+<template>
+  <div class="demo-spacing">
+    <d-button size="sm"> Small </d-button>
+    <d-button>Medium</d-button>
+    <d-button size="lg"> Large </d-button>
+  </div>
+</template>
+```
 
 :::
 
@@ -34,15 +80,49 @@ button/size
 
 :::demo 通过`disabled`参数设置按钮禁用状态。
 
-button/disable
+```vue
+<template>
+  <div>
+    <div class="demo-spacing">
+      <d-button variant="solid"> Solid Button </d-button>
+      <d-button>Outline Button</d-button>
+      <d-button variant="text"> Text Button </d-button>
+    </div>
+
+    <div class="demo-spacing">
+      <d-button variant="solid" disabled> Solid Button </d-button>
+      <d-button disabled> Outline Button </d-button>
+      <d-button variant="text" disabled> Text Button </d-button>
+    </div>
+  </div>
+</template>
+```
 
 :::
 
 ### 加载中状态
 
-:::demo 通过`loading`参数设置按钮加载中状态。
+通过`loading`参数设置按钮加载中状态。
 
-button/loading
+:::demo
+
+```vue
+<template>
+  <d-button variant="solid" :loading="showLoading" @click="handleClick"> Click Me </d-button>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+const showLoading = ref(false);
+const handleClick = () => {
+  showLoading.value = true;
+
+  setTimeout(() => {
+    showLoading.value = false;
+  }, 2000);
+};
+</script>
+```
 
 :::
 
@@ -50,7 +130,20 @@ button/loading
 
 :::demo
 
-button/icon
+```vue
+<template>
+  <div class="demo-spacing">
+    <d-button icon="add" variant="solid"> New </d-button>
+    <d-button icon="filter"> Filter </d-button>
+    <d-button icon="connect" variant="text"> Link </d-button>
+    <d-button icon="delete" variant="text" title="Delete" />
+    <d-button shape="round" title="Add"> Add </d-button>
+    <d-button icon="delete" shape="circle" title="Delete" size="sm" />
+    <d-button icon="delete" shape="circle" title="Delete" />
+    <d-button variant="solid" icon="filter" shape="circle" title="Add" size="lg" />
+  </div>
+</template>
+```
 
 :::
 
@@ -60,22 +153,97 @@ button/icon
 
 :::demo
 
-button/buttonGroup
+```vue
+<template>
+  <div>
+    <d-button-group>
+      <d-button variant="solid"> 按钮名称 </d-button>
+      <d-button icon="icon-select-arrow" variant="solid" />
+    </d-button-group>
+
+    <p>尺寸：sm</p>
+    <d-button-group size="sm">
+      <d-button color="primary" variant="solid"> 上海 </d-button>
+      <d-button>北京</d-button>
+      <d-button>深圳</d-button>
+    </d-button-group>
+
+    <p>尺寸：默认</p>
+    <d-button-group>
+      <d-button color="primary"> 上海 </d-button>
+      <d-button>北京</d-button>
+      <d-button>深圳</d-button>
+    </d-button-group>
+
+    <p>尺寸：lg</p>
+    <d-button-group size="lg">
+      <d-button color="primary"> 上海 </d-button>
+      <d-button>北京</d-button>
+      <d-button>深圳</d-button>
+    </d-button-group>
+
+    <p>与dropdown下拉菜单一起使用</p>
+    <d-button-group>
+      <d-dropdown style="width: 100px;" :position="position" align="start">
+        <d-button>Click Me 1</d-button>
+        <template #menu>
+          <ul class="list-menu">
+            <li class="menu-item">Item 1</li>
+            <li class="menu-item">Item 2</li>
+            <li class="menu-item">Item 3</li>
+            <li class="menu-item">Item 4</li>
+          </ul>
+        </template>
+      </d-dropdown>
+      <d-button icon="add" variant="solid"> 上海 </d-button>
+      <d-dropdown style="width: 100px;" :position="position" align="start">
+        <d-button>Click Me 2</d-button>
+        <template #menu>
+          <ul class="list-menu">
+            <li class="menu-item">Item 1</li>
+            <li class="menu-item">Item 2</li>
+            <li class="menu-item">Item 3</li>
+            <li class="menu-item">Item 4</li>
+          </ul>
+        </template>
+      </d-dropdown>
+      <d-button icon="filter"> 北京 </d-button>
+      <d-dropdown style="width: 100px;" :position="position" align="start">
+        <d-button>Click Me 3</d-button>
+        <template #menu>
+          <ul class="list-menu">
+            <li class="menu-item">Item 1</li>
+            <li class="menu-item">Item 2</li>
+            <li class="menu-item">Item 3</li>
+            <li class="menu-item">Item 4</li>
+          </ul>
+        </template>
+      </d-dropdown>
+    </d-button-group>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+
+const position = ref(['bottom-start', 'top-start']);
+</script>
+```
 
 :::
 
 ### Button 参数
 
-| 参数名   | 类型                              | 默认        | 说明                      | 跳转 Demo                 |
-| :------- | :-------------------------------- | :---------- | :------------------------ | :------------------------ |
-| variant  | [IButtonVariant](#ibuttonvariant) | 'outline'   | 可选，按钮形态            | [形态](#形态)             |
-| color    | [IButtonColor](#ibuttoncolor)     | 'secondary' | 可选，按钮主题            | [主题色](#主题色)         |
-| size     | [IButtonSize](#ibuttonsize)       | 'md'        | 可选，按钮尺寸            | [尺寸](#尺寸)             |
-| icon     | `string`                          | --          | 可选，自定义按钮图标      | [图标按钮](#图标按钮)     |
-| shape    | [IButtonShape](#ibuttonshape)     | --          | 可选，按钮形状(圆形/圆角) | [图标按钮](#图标按钮)     |
-| disabled | `boolean`                         | false       | 可选，是否禁用 button     | [禁用状态](#禁用状态)     |
-| loading  | `boolean`                         | false       | 可选，设置加载中状态      | [加载中状态](#加载中状态) |
-| native-type  | [IButtonType](#ibuttontype)    | 'button'       | 可选，按钮原生type属性      |  |
+| 参数名      | 类型                              | 默认        | 说明                      | 跳转 Demo                 |
+| :---------- | :-------------------------------- | :---------- | :------------------------ | :------------------------ |
+| variant     | [IButtonVariant](#ibuttonvariant) | 'outline'   | 可选，按钮形态            | [形态](#形态)             |
+| color       | [IButtonColor](#ibuttoncolor)     | 'secondary' | 可选，按钮主题            | [主题色](#主题色)         |
+| size        | [IButtonSize](#ibuttonsize)       | 'md'        | 可选，按钮尺寸            | [尺寸](#尺寸)             |
+| icon        | `string`                          | --          | 可选，自定义按钮图标      | [图标按钮](#图标按钮)     |
+| shape       | [IButtonShape](#ibuttonshape)     | --          | 可选，按钮形状(圆形/圆角) | [图标按钮](#图标按钮)     |
+| disabled    | `boolean`                         | false       | 可选，是否禁用 button     | [禁用状态](#禁用状态)     |
+| loading     | `boolean`                         | false       | 可选，设置加载中状态      | [加载中状态](#加载中状态) |
+| native-type | [IButtonType](#ibuttontype)       | 'button'    | 可选，按钮原生 type 属性  |                           |
 
 ### Button 类型定义
 
diff --git a/packages/devui-vue/docs/components/button/loading.vue b/packages/devui-vue/docs/components/button/loading.vue
deleted file mode 100644
index e9c27cc3cd..0000000000
--- a/packages/devui-vue/docs/components/button/loading.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<template>
-  <d-button
-    variant="solid"
-    :loading="showLoading"
-    @click="handleClick"
-  >
-    Click Me
-  </d-button>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-const showLoading = ref(false);
-const handleClick = () => {
-  showLoading.value = true;
-
-  setTimeout(() => {
-    showLoading.value = false;
-  }, 2000);
-};
-</script>
diff --git a/packages/devui-vue/docs/components/button/shape.vue b/packages/devui-vue/docs/components/button/shape.vue
deleted file mode 100644
index af6e4c72a3..0000000000
--- a/packages/devui-vue/docs/components/button/shape.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<template>
-  <div class="demo-spacing">
-    <d-button variant="solid">
-      Solid Button
-    </d-button>
-    <d-button>Outline Button</d-button>
-    <d-button variant="text">
-      Text Button
-    </d-button>
-  </div>
-</template>
diff --git a/packages/devui-vue/docs/components/button/size.vue b/packages/devui-vue/docs/components/button/size.vue
deleted file mode 100644
index 6205115fa9..0000000000
--- a/packages/devui-vue/docs/components/button/size.vue
+++ /dev/null
@@ -1,11 +0,0 @@
-<template>
-  <div class="demo-spacing">
-    <d-button size="sm">
-      Small
-    </d-button>
-    <d-button>Medium</d-button>
-    <d-button size="lg">
-      Large
-    </d-button>
-  </div>
-</template>
diff --git a/packages/devui-vue/docs/components/button/theme.vue b/packages/devui-vue/docs/components/button/theme.vue
deleted file mode 100644
index 8639f578e8..0000000000
--- a/packages/devui-vue/docs/components/button/theme.vue
+++ /dev/null
@@ -1,57 +0,0 @@
-<template>
-  <div>
-    <div class="demo-spacing">
-      <d-button
-        variant="solid"
-        color="primary"
-      >
-        Primary
-      </d-button>
-      <d-button color="primary">
-        Primary
-      </d-button>
-      <d-button
-        variant="text"
-        color="primary"
-      >
-        Primary
-      </d-button>
-    </div>
-
-    <div class="demo-spacing">
-      <d-button
-        variant="solid"
-        color="secondary"
-      >
-        Secondary
-      </d-button>
-      <d-button color="secondary">
-        Secondary
-      </d-button>
-      <d-button
-        variant="text"
-        color="secondary"
-      >
-        Secondary
-      </d-button>
-    </div>
-
-    <div class="demo-spacing">
-      <d-button
-        variant="solid"
-        color="danger"
-      >
-        Danger
-      </d-button>
-      <d-button color="danger">
-        Danger
-      </d-button>
-      <d-button
-        variant="text"
-        color="danger"
-      >
-        Danger
-      </d-button>
-    </div>
-  </div>
-</template>

From 2aba86811e2a30dd9cb87f074f5779aa470eb685 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 17:53:15 +0800
Subject: [PATCH 06/30] refactor(theme): migrate theme config from old version

Related Issue: #1879
---
 .../devui-vue/docs/.vitepress/theme/index.ts  | 29 ++++++++++++++-----
 1 file changed, 21 insertions(+), 8 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/theme/index.ts b/packages/devui-vue/docs/.vitepress/theme/index.ts
index d77decc5af..630f79d558 100644
--- a/packages/devui-vue/docs/.vitepress/theme/index.ts
+++ b/packages/devui-vue/docs/.vitepress/theme/index.ts
@@ -1,13 +1,19 @@
+// https://vitepress.dev/guide/custom-theme
+import { h } from 'vue';
+import type { Theme } from 'vitepress';
+import DefaultTheme from 'vitepress/theme';
+import 'vitepress-theme-demoblock/dist/theme/styles/index.css';
+import { useComponents } from './useComponents';
+
 import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
 import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker';
 import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker';
 import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker';
 import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker';
+
 import DevUI from '../../../devui/vue-devui';
 import Locale from '../../../devui/locale';
-import Theme from '../devui-theme';
-import 'vitepress-theme-demoblock/theme/styles/index.css';
-import { registerComponents } from './register-components.js';
+import DevUITheme from '../devui-theme';
 import { insertBaiduScript } from './insert-baidu-script';
 
 if (typeof window !== 'undefined') {
@@ -31,10 +37,17 @@ if (typeof window !== 'undefined') {
 }
 
 export default {
-  ...Theme,
-  enhanceApp({ app }) {
-    app.use(Locale).use(DevUI);
-    registerComponents(app);
+  extends: DevUITheme,
+  Layout: () => {
+    return h(DefaultTheme.Layout, null, {
+      // https://vitepress.dev/guide/extending-default-theme#layout-slots
+    });
+  },
+  enhanceApp(ctx) {
+    DefaultTheme.enhanceApp(ctx);
+    useComponents(ctx.app);
+    ctx.app.use(Locale);
+    ctx.app.use(DevUI);
     insertBaiduScript();
   },
-};
+} satisfies Theme;

From 5dc533c0364a2c9f8c1edf7ae9c4172c92b2aa5d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 17:54:16 +0800
Subject: [PATCH 07/30] fix(md): fix multi-single line `<script setup>` tag

Related Issue: #1879
---
 .../docs/.vitepress/plugins/md-transformer.ts | 28 +++++++++++++++----
 1 file changed, 22 insertions(+), 6 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts b/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts
index 267042424e..fc93472bbb 100644
--- a/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts
+++ b/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts
@@ -1,5 +1,7 @@
 import { Plugin } from 'vite';
+
 const hasDemoBlock = (str: string) => /:::demo/gim.test(str);
+
 export function MdTransformer(): Plugin {
   return {
     name: 'devui-markdown-demo-transformer',
@@ -12,15 +14,29 @@ export function MdTransformer(): Plugin {
       if (id.split('/').at(-3) !== 'components') {
         return code;
       }
-      const setup = markdownStringArray.some(hasDemoBlock)
-        ? `
+
+      const tag = '<script setup>';
+      if (code.includes(tag)) {
+        console.log("!!!!!!")
+        code = code.replace(
+          tag,
+          `
 <script setup lang="ts">
-const demoList = import.meta.globEager('../../components/${componentName}/*.vue') ?? []
+const demoList = import.meta.glob('../../components/${componentName}/*.vue') ?? []
+console.log(demoList);
+`
+        );
+      } else {
+        code = `
+<script setup lang="ts">
+const demoList = import.meta.glob('../../components/${componentName}/*.vue') ?? []
 </script>
-      `
-        : '';
+${code}
+`;
+      }
+      console.log(code);
       return {
-        code: `${setup}\n${code}`,
+        code,
       };
     },
   };

From e4815e33b8115e8093d7f9b7d6551ce536373df4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 17:55:28 +0800
Subject: [PATCH 08/30] fix(demo): try use official demo block instead of
 custom

Related Issue: #1879
---
 .../devui-vue/docs/.vitepress/theme/useComponents.js   | 10 ++++++++++
 1 file changed, 10 insertions(+)
 create mode 100644 packages/devui-vue/docs/.vitepress/theme/useComponents.js

diff --git a/packages/devui-vue/docs/.vitepress/theme/useComponents.js b/packages/devui-vue/docs/.vitepress/theme/useComponents.js
new file mode 100644
index 0000000000..580070c196
--- /dev/null
+++ b/packages/devui-vue/docs/.vitepress/theme/useComponents.js
@@ -0,0 +1,10 @@
+// Don't remove this file, because it registers the demo components.
+import Demo from 'vitepress-theme-demoblock/dist/client/components/Demo.vue'
+import DemoBlock from 'vitepress-theme-demoblock/dist/client/components/DemoBlock.vue'
+// import Demo from '../demo/Demo.vue';
+// import DemoBlock from '../demo/DemoBlock.vue';
+
+export function useComponents(app) {
+  app.component('Demo', Demo)
+  app.component('DemoBlock', DemoBlock)
+}

From 18f08066e4e2e9045042336a68c576b9e4987b24 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 18:09:53 +0800
Subject: [PATCH 09/30] fix(log): remove some debug patterns

---
 packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts b/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts
index fc93472bbb..5afb1af479 100644
--- a/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts
+++ b/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts
@@ -17,7 +17,6 @@ export function MdTransformer(): Plugin {
 
       const tag = '<script setup>';
       if (code.includes(tag)) {
-        console.log("!!!!!!")
         code = code.replace(
           tag,
           `
@@ -34,7 +33,6 @@ const demoList = import.meta.glob('../../components/${componentName}/*.vue') ??
 ${code}
 `;
       }
-      console.log(code);
       return {
         code,
       };

From 5ecc4f271ca1a922f98bfdbe0c57210fdd2ec0dc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 19:05:31 +0800
Subject: [PATCH 10/30] refactor(docs): refactor all the documentation

- The latest version of `vitepress-theme-demoblock` does not support `:::demo <comment>
- With `<script setup>` tag, the vitepress will give a 404 error when trying to load the demo code.

Related Issue: #1879
---
 .../docs/.vitepress/theme/useComponents.js    |    2 -
 .../docs/components/accordion/index.md        |    4 +-
 .../devui-vue/docs/components/badge/index.md  |   32 +-
 .../devui-vue/docs/components/card/index.md   |    9 +-
 .../docs/components/category-search/index.md  |   24 +-
 .../docs/components/code-editor/index.md      |   10 +-
 .../docs/components/data-grid/index.md        |   84 +-
 .../docs/components/date-picker/index.md      |   76 +-
 .../docs/components/dragdrop-new/index.md     | 1826 +++++++++--------
 .../docs/components/dragdrop/index.md         |  206 +-
 .../devui-vue/docs/components/drawer/index.md |   26 +-
 .../docs/components/dropdown/index.md         |   26 +-
 .../docs/components/editor-md/checkbox.vue    |   48 -
 .../docs/components/editor-md/index.md        |  325 +--
 .../devui-vue/docs/components/form/index.md   |   28 +-
 .../docs/components/fullscreen/index.md       |   24 +-
 .../devui-vue/docs/components/grid/index.md   |   32 +-
 .../docs/components/image-preview/index.md    |  101 +-
 .../docs/components/input-number/index.md     |   74 +-
 .../devui-vue/docs/components/input/index.md  |   48 +-
 .../devui-vue/docs/components/menu/index.md   |  251 ++-
 .../devui-vue/docs/components/modal/index.md  |   43 +-
 .../components/multi-auto-complete/index.md   |   39 +-
 .../docs/components/notification/index.md     |   30 +-
 .../devui-vue/docs/components/panel/index.md  |   58 +-
 .../docs/components/popover/index.md          |   30 +-
 .../docs/components/progress/index.md         |   70 +-
 .../docs/components/quadrant-diagram/index.md |   21 +-
 .../devui-vue/docs/components/ripple/index.md |   97 +-
 .../devui-vue/docs/components/search/index.md |   48 +-
 .../docs/components/skeleton/index.md         |   18 +-
 .../devui-vue/docs/components/sticky/index.md |   70 +-
 .../devui-vue/docs/components/switch/index.md |   39 +-
 .../devui-vue/docs/components/table/index.md  |   70 +-
 .../devui-vue/docs/components/tag/index.md    |   25 +-
 .../docs/components/timeline/index.md         |    1 +
 .../docs/components/tooltip/index.md          |   38 +-
 .../devui-vue/docs/components/tree/index.md   |   46 +-
 .../docs/components/virtual-list/index.md     |    4 +-
 packages/devui-vue/docs/quick-start/index.md  |    2 +-
 40 files changed, 2173 insertions(+), 1832 deletions(-)
 delete mode 100644 packages/devui-vue/docs/components/editor-md/checkbox.vue

diff --git a/packages/devui-vue/docs/.vitepress/theme/useComponents.js b/packages/devui-vue/docs/.vitepress/theme/useComponents.js
index 580070c196..b6ad35f8bf 100644
--- a/packages/devui-vue/docs/.vitepress/theme/useComponents.js
+++ b/packages/devui-vue/docs/.vitepress/theme/useComponents.js
@@ -1,8 +1,6 @@
 // Don't remove this file, because it registers the demo components.
 import Demo from 'vitepress-theme-demoblock/dist/client/components/Demo.vue'
 import DemoBlock from 'vitepress-theme-demoblock/dist/client/components/DemoBlock.vue'
-// import Demo from '../demo/Demo.vue';
-// import DemoBlock from '../demo/DemoBlock.vue';
 
 export function useComponents(app) {
   app.component('Demo', Demo)
diff --git a/packages/devui-vue/docs/components/accordion/index.md b/packages/devui-vue/docs/components/accordion/index.md
index 921c449344..400c88bb40 100644
--- a/packages/devui-vue/docs/components/accordion/index.md
+++ b/packages/devui-vue/docs/components/accordion/index.md
@@ -2,9 +2,9 @@
 
 为页面提供导航的组件。
 
-#### 何时使用
-
+:::tip 何时使用
 需要通过分组组织菜单的时候使用。
+:::
 
 ### 基本用法
 
diff --git a/packages/devui-vue/docs/components/badge/index.md b/packages/devui-vue/docs/components/badge/index.md
index 22eef59859..7232c8e2c8 100644
--- a/packages/devui-vue/docs/components/badge/index.md
+++ b/packages/devui-vue/docs/components/badge/index.md
@@ -2,13 +2,17 @@
 
 图标右上角的圆形徽标数字。
 
-#### 何时使用
-
+:::tip 何时使用
 出现在图标右上角或列表项右方，通过不同的状态色加数字提示用户有消息需要处理时。
+:::
+
+## 用法
 
 ### 基本徽章
 
-::: demo 基本徽章类型，当有包裹元素时在右上角显示徽章和数目。
+基本徽章类型，当有包裹元素时在右上角显示徽章和数目。
+
+::: demo
 
 ```vue
 <template>
@@ -34,7 +38,9 @@
 
 ### 点状徽章
 
-:::demo 点状徽章类型，当有包裹元素且 `show-dot` 参数为 true 时为点状徽章，默认在右上角展示小点不显示数目。
+点状徽章类型，当有包裹元素且 `show-dot` 参数为 true 时为点状徽章，默认在右上角展示小点不显示数目。
+
+:::demo
 
 ```vue
 <template>
@@ -63,7 +69,9 @@
 
 ### 计数徽章
 
-:::demo 当徽章独立使用且不包裹任何元素时，只展示徽章状态色和数目。
+当徽章独立使用且不包裹任何元素时，只展示徽章状态色和数目。
+
+:::demo
 
 ```vue
 <template>
@@ -99,7 +107,9 @@
 
 ### 状态徽章
 
-:::demo 当徽章独立使用、不包裹任何元素且 `show-dot` 参数为 true 时为状态徽章，不同状态展示不同色点。
+当徽章独立使用、不包裹任何元素且 `show-dot` 参数为 true 时为状态徽章，不同状态展示不同色点。
+
+:::demo
 
 ```vue
 <template>
@@ -125,7 +135,9 @@
 
 ### 徽章位置
 
-:::demo 通过 `position` 参数设置徽章位置。
+通过 `position` 参数设置徽章位置。
+
+:::demo
 
 ```vue
 <template>
@@ -144,7 +156,9 @@
 
 ### 自定义
 
-:::demo 通过 `bg-color` 参数设置徽章展示状态色(此时 `status` 参数设置的徽章状态色失效)，通过 `offset` 参数可设置相对于 position 的徽章偏移量。通过 ` text-color``、bgColor ` 自定义文字、背景颜色。
+通过 `bg-color` 参数设置徽章展示状态色(此时 `status` 参数设置的徽章状态色失效)，通过 `offset` 参数可设置相对于 position 的徽章偏移量。通过 ` text-color``、bgColor ` 自定义文字、背景颜色。
+
+:::demo
 
 ```vue
 <template>
@@ -164,7 +178,7 @@
 
 ### 隐藏徽章
 
-通过 `hidden` 属性设置徽章是否可见
+通过 `hidden` 属性设置徽章是否可见。
 
 ::: demo
 
diff --git a/packages/devui-vue/docs/components/card/index.md b/packages/devui-vue/docs/components/card/index.md
index 116801561e..65d09cf547 100644
--- a/packages/devui-vue/docs/components/card/index.md
+++ b/packages/devui-vue/docs/components/card/index.md
@@ -30,7 +30,6 @@
   </d-card>
 </template>
 <style lang="scss">
-
 .card-demo-basic {
   cursor: pointer;
 
@@ -123,7 +122,6 @@
   </d-card>
 </template>
 <style lang="scss">
-
 .card-demo-use-img {
   cursor: pointer;
 
@@ -187,7 +185,6 @@
   </d-card>
 </template>
 <style lang="scss">
-
 .card-demo-custom-area {
   cursor: pointer;
 
@@ -238,8 +235,8 @@
 
 ### Card 参数
 
-| 参数   | 类型                          | 默认      | 说明                                                         | 跳转 Demo                 |
-| :----- |:----------------------------| :-------- | :----------------------------------------------------------- | :------------------------ |
+| 参数   | 类型                        | 默认      | 说明                                                         | 跳转 Demo                 |
+| :----- | :-------------------------- | :-------- | :----------------------------------------------------------- | :------------------------ |
 | src    | `string`                    | ''        | 可选，图片路径                                               | [使用图片](#使用图片)     |
 | align  | [IAlignType](#ialigntype)   | `'start'` | 可选，操作区域对齐方式，分别对应起始对齐，尾部对齐，拉伸对齐 | [自定义区域](#自定义区域) |
 | shadow | [IShadowType](#ishadowtype) | `'hover'` | 可选，设置增强阴影显示时机                                   | [阴影效果](#阴影效果)     |
@@ -254,7 +251,7 @@
 | title    | 卡片的主要内容描述，一般定义为卡片名称 |
 | subtitle | 对标题的补充，可包含标签等信息         |
 | actions  | 决策作用，可以包含操作文本或者操作图标 |
-|default|自定义卡片内所有内容|
+| default  | 自定义卡片内所有内容                   |
 
 ### Card 类型定义
 
diff --git a/packages/devui-vue/docs/components/category-search/index.md b/packages/devui-vue/docs/components/category-search/index.md
index 8caf8ea2f6..a65a6dd511 100644
--- a/packages/devui-vue/docs/components/category-search/index.md
+++ b/packages/devui-vue/docs/components/category-search/index.md
@@ -2,6 +2,8 @@
 
 按类型进行搜索，目前支持的类型包括：`radio`、`checkbox`、`label`、`textInput`，`numberRange`，`keyword`。
 
+## 用法
+
 ### 基本用法
 
 :::demo
@@ -142,7 +144,9 @@ export default defineComponent({
 
 ### 自定义展示模板
 
-:::demo 自定义分类下拉展示模板和选中后的标签展示模板。分类下拉展示模板的插槽名为`${field}Menu`，标签展示模板的插槽名为`${field}Tag`，`field`为分类的字段名；插槽参数为`category`参数中对应分类的数据。
+自定义分类下拉展示模板和选中后的标签展示模板。分类下拉展示模板的插槽名为`${field}Menu`，标签展示模板的插槽名为`${field}Tag`，`field`为分类的字段名；插槽参数为`category`参数中对应分类的数据。
+
+:::demo
 
 ```vue
 <template>
@@ -241,7 +245,9 @@ export default defineComponent({
 
 ### 自定义扩展按钮
 
-:::demo 自定义分类下拉展示模板和选中后的标签展示模板。分类下拉展示模板的插槽名为`${field}Menu`，标签展示模板的插槽名为`${field}Tag`，`field`为分类的字段名；插槽参数为`category`参数中对应分类的数据。
+自定义分类下拉展示模板和选中后的标签展示模板。分类下拉展示模板的插槽名为`${field}Menu`，标签展示模板的插槽名为`${field}Tag`，`field`为分类的字段名；插槽参数为`category`参数中对应分类的数据。
+
+:::demo
 
 ```vue
 <template>
@@ -395,13 +401,13 @@ export default defineComponent({
 
 ### CategorySearch 方法
 
-| 方法名              | 说明                                                                       | 参数                                                          |
-| :------------------ | :------------------------------------------------------------------------- | :------------------------------------------------------------ |
-| chooseItem          | 调用组件方法处理选中数据，针对`radio`类型，参数为当前 tag 和选中项         | (tag: ICategorySearchTagItem, chooseItem: ITagOption) => void |
-| chooseItems         | 调用组件方法处理选中数据，针对`checkbox \| label`类型，参数为当前 tag      | (tag: ICategorySearchTagItem) => void                         |
-| getTextInputValue   | 调用组件方法处理选中数据，针对`textInput`类型，参数为当前 tag 和输入内容   | (tag: ICategorySearchTagItem, inputValue: string) => void     |
-| getNumberRangeValue | 调用组件方法处理选中数据，针对`numberRange`类型，参数为当前 tag 和输入内容 | (tag: ICategorySearchTagItem, rangeValue: number[]) => void   |
-|toggleTagMenu|控制某个已选择tag所对应下拉框的展开收起状态，可通过`status`参数指定展开收起状态|`(field: string, status?: boolean) => void`|
+| 方法名              | 说明                                                                              | 参数                                                          |
+| :------------------ | :-------------------------------------------------------------------------------- | :------------------------------------------------------------ |
+| chooseItem          | 调用组件方法处理选中数据，针对`radio`类型，参数为当前 tag 和选中项                | (tag: ICategorySearchTagItem, chooseItem: ITagOption) => void |
+| chooseItems         | 调用组件方法处理选中数据，针对`checkbox \| label`类型，参数为当前 tag             | (tag: ICategorySearchTagItem) => void                         |
+| getTextInputValue   | 调用组件方法处理选中数据，针对`textInput`类型，参数为当前 tag 和输入内容          | (tag: ICategorySearchTagItem, inputValue: string) => void     |
+| getNumberRangeValue | 调用组件方法处理选中数据，针对`numberRange`类型，参数为当前 tag 和输入内容        | (tag: ICategorySearchTagItem, rangeValue: number[]) => void   |
+| toggleTagMenu       | 控制某个已选择 tag 所对应下拉框的展开收起状态，可通过`status`参数指定展开收起状态 | `(field: string, status?: boolean) => void`                   |
 
 ### 类型定义
 
diff --git a/packages/devui-vue/docs/components/code-editor/index.md b/packages/devui-vue/docs/components/code-editor/index.md
index fdde7def66..34c1ddc0f2 100644
--- a/packages/devui-vue/docs/components/code-editor/index.md
+++ b/packages/devui-vue/docs/components/code-editor/index.md
@@ -4,9 +4,13 @@
 
 由于 monaco editor 对语法处理是通过 web Worker 实现的，所以需要加载处理语法的 Worker, 配置方式参考[官方教程](https://github.com/microsoft/monaco-editor/blob/main/docs/integrate-esm.md).
 
+## 用法
+
 ### 基本用法
 
-:::demo `v-model`双向绑定编辑器内容，`options`参数[参考 monaco editor 定义](https://github.com/microsoft/monaco-editor/api/interfaces/monaco.editor.IEditorConstructionOptions.html)。
+`v-model`双向绑定编辑器内容，`options`参数[参考 monaco editor 定义](https://github.com/microsoft/monaco-editor/api/interfaces/monaco.editor.IEditorConstructionOptions.html)。
+
+:::demo
 
 ```vue
 <template>
@@ -40,7 +44,9 @@ export default defineComponent({
 
 ### 代码高亮
 
-:::demo 对一个代码块进行高亮
+对一个代码块进行高亮。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/data-grid/index.md b/packages/devui-vue/docs/components/data-grid/index.md
index 54d8ffa0fb..0dfaa8b3ca 100644
--- a/packages/devui-vue/docs/components/data-grid/index.md
+++ b/packages/devui-vue/docs/components/data-grid/index.md
@@ -2,9 +2,13 @@
 
 展示行列数据。
 
+## 用法
+
 ### 基本用法
 
-:::demo `data`参数传入要展示的数据，`columns`参数传入列数据；列数据中的`field`参数为对应列内容的字段名，`header`参数为对应列的标题。
+`data`参数传入要展示的数据，`columns`参数传入列数据；列数据中的`field`参数为对应列内容的字段名，`header`参数为对应列的标题。
+
+:::demo
 
 ```vue
 <template>
@@ -107,7 +111,9 @@ export default defineComponent({
 
 ### 表格样式
 
-:::demo `striped`参数设置是否显示斑马纹；`header-bg`参数设置是否显示表头背景色；`border-type`参数设置边框类型；`shadow-type`参数设置阴影类型；`show-header`参数设置是否显示表头；列配置中的`align`参数设置对齐方式。
+`striped`参数设置是否显示斑马纹；`header-bg`参数设置是否显示表头背景色；`border-type`参数设置边框类型；`shadow-type`参数设置阴影类型；`show-header`参数设置是否显示表头；列配置中的`align`参数设置对齐方式。
+
+:::demo
 
 ```vue
 <template>
@@ -219,7 +225,9 @@ export default defineComponent({
 
 ### 动态数据
 
-:::demo loading 由业务自行添加。
+`loading` 由业务自行添加。
+
+:::demo
 
 ```vue
 <template>
@@ -358,7 +366,9 @@ export default defineComponent({
 
 ### 懒加载
 
-:::demo `lazy`参数设置为`true`，即可启用懒加载，在`load-more`事件回调中可动态添加数据。
+`lazy`参数设置为`true`，即可启用懒加载，在`load-more`事件回调中可动态添加数据。
+
+:::demo
 
 ```vue
 <template>
@@ -478,7 +488,9 @@ export default defineComponent({
 
 ### 自定义行样式
 
-:::demo 通过`row-class`参数自定义行样式，可传入字符串，来自定义每一行的样式；也可传入函数，来自定义某一行或某几行的样式，函数参数为行数据和行索引。
+通过`row-class`参数自定义行样式，可传入字符串，来自定义每一行的样式；也可传入函数，来自定义某一行或某几行的样式，函数参数为行数据和行索引。
+
+:::demo
 
 ```vue
 <template>
@@ -542,7 +554,9 @@ export default defineComponent({
 
 ### 自定义单元格样式
 
-:::demo 通过`cell-class`参数自定义行样式，可传入字符串，来自定义每一行的样式；也可传入函数，来自定义某一行或某几行的样式，函数参数为行数据、行索引、列数据、列索引。
+通过`cell-class`参数自定义行样式，可传入字符串，来自定义每一行的样式；也可传入函数，来自定义某一行或某几行的样式，函数参数为行数据、行索引、列数据、列索引。
+
+:::demo
 
 ```vue
 <template>
@@ -606,7 +620,13 @@ export default defineComponent({
 
 ### 自定义列宽
 
-:::demo 通过`width`参数配置列宽，参数类型为`string | number | undefined`，`number`类型为固定宽度；`string`类型可配置为像素或者百分比，当为百分比时，基于表格所在容器总宽计算该列实际宽度；当为`undefined`即不配置列宽参数时，会与其他不配置列宽的列平分剩余宽度（即容器总宽减去已知列宽）。<br />通过`minWidth`参数配置最小列宽，参数类型同`width`，当该列未配置`width`参数时，若给该列分配的宽度小于`minWidth`，则按照`minWidth`设置列宽，未配置`minWidth`参数时，为保证该列能够显示，会默认设置`80px`宽度。<br />通过`maxWidth`参数配置最大列宽，参数类型同`width`，当该列未配置`width`参数时，若给该列分配的宽度大于`maxWidth`，则按照`maxWidth`设置列宽。
+通过`width`参数配置列宽，参数类型为`string | number | undefined`，`number`类型为固定宽度；`string`类型可配置为像素或者百分比，当为百分比时，基于表格所在容器总宽计算该列实际宽度；当为`undefined`即不配置列宽参数时，会与其他不配置列宽的列平分剩余宽度（即容器总宽减去已知列宽）。
+
+通过`minWidth`参数配置最小列宽，参数类型同`width`，当该列未配置`width`参数时，若给该列分配的宽度小于`minWidth`，则按照`minWidth`设置列宽，未配置`minWidth`参数时，为保证该列能够显示，会默认设置`80px`宽度。
+
+通过`maxWidth`参数配置最大列宽，参数类型同`width`，当该列未配置`width`参数时，若给该列分配的宽度大于`maxWidth`，则按照`maxWidth`设置列宽。
+
+:::demo
 
 ```vue
 <template>
@@ -661,7 +681,9 @@ export default defineComponent({
 
 ### 自定义单元格内容
 
-:::demo 通过在列数据的`cellRender`参数来自定义单元格内容，函数参数依次为行数据、行索引、列数据、列索引。`cellRender`函数可返回由[h 函数](https://cn.vuejs.org/api/render-function.html#h)创建的虚拟 DOM 节点。
+通过在列数据的`cellRender`参数来自定义单元格内容，函数参数依次为行数据、行索引、列数据、列索引。`cellRender`函数可返回由[h 函数](https://cn.vuejs.org/api/render-function.html#h)创建的虚拟 DOM 节点。
+
+:::demo
 
 ```vue
 <template>
@@ -729,7 +751,9 @@ export default defineComponent({
 
 ### 自定义表头
 
-:::demo 通过在列数据的`headRender`参数来自定义表头，函数参数为当前列数据。`headRender`函数可返回由[h 函数](https://cn.vuejs.org/api/render-function.html#h)创建的虚拟 DOM 节点。
+通过在列数据的`headRender`参数来自定义表头，函数参数为当前列数据。`headRender`函数可返回由[h 函数](https://cn.vuejs.org/api/render-function.html#h)创建的虚拟 DOM 节点。
+
+:::demo
 
 ```vue
 <template>
@@ -789,7 +813,11 @@ export default defineComponent({
 
 ### 自定义提示内容
 
-:::demo `showOverflowTooltip`参数可设置内容超出后，鼠标悬浮是否显示提示内容，可设置为`true`值来开启此功能，也可通过`TooltipConfig`类型的参数来对提示内容做一些配置。<br/>`showHeadOverflowTooltip`用来设置表头，作用及参数值与`showOverflowTooltip`一致。
+`showOverflowTooltip`参数可设置内容超出后，鼠标悬浮是否显示提示内容，可设置为`true`值来开启此功能，也可通过`TooltipConfig`类型的参数来对提示内容做一些配置。
+
+`showHeadOverflowTooltip`用来设置表头，作用及参数值与`showOverflowTooltip`一致。
+
+:::demo
 
 ```vue
 <template>
@@ -855,7 +883,9 @@ export default defineComponent({
 
 ### 空数据模板
 
-:::demo 通过`empty`插槽可自定义数据为空时显示的内容。
+通过`empty`插槽可自定义数据为空时显示的内容。
+
+:::demo
 
 ```vue
 <template>
@@ -930,7 +960,9 @@ export default defineComponent({
 
 ### 固定表头
 
-:::demo `fix-header`参数设置为`true`即可固定表头。
+`fix-header`参数设置为`true`即可固定表头。
+
+:::demo
 
 ```vue
 <template>
@@ -1009,7 +1041,9 @@ export default defineComponent({
 
 ### 固定列
 
-:::demo 通过列数据的`fixed`参数可将该列固定，参数值为`left`和`right`，可分别固定在左侧和右侧。
+通过列数据的`fixed`参数可将该列固定，参数值为`left`和`right`，可分别固定在左侧和右侧。
+
+:::demo
 
 ```vue
 <template>
@@ -1092,7 +1126,9 @@ export default defineComponent({
 
 ### 排序
 
-:::demo 列数据中的`sortable`参数设置为`true`可启用排序功能，`sortMethod`参数自定义排序方法，排序后触发`sort-change`事件，事件抛出产生排序的列字段以及当前排序方式。
+列数据中的`sortable`参数设置为`true`可启用排序功能，`sortMethod`参数自定义排序方法，排序后触发`sort-change`事件，事件抛出产生排序的列字段以及当前排序方式。
+
+:::demo
 
 ```vue
 <template>
@@ -1151,7 +1187,9 @@ export default defineComponent({
 
 ### 过滤
 
-:::demo 列数据中的`filterable`参数设置为`true`可启用过滤功能，内置过滤器默认为多选，通过`filterMultiple: false`可设置单选过滤器；`filterList`参数设置过滤器列表；`filterChange`参数为过滤条件变更后的回调；`filterMenu`参数可以自定义过滤器，函数可返回由[h 函数](https://cn.vuejs.org/api/render-function.html#h)创建的虚拟 DOM 节点。。
+列数据中的`filterable`参数设置为`true`可启用过滤功能，内置过滤器默认为多选，通过`filterMultiple: false`可设置单选过滤器；`filterList`参数设置过滤器列表；`filterChange`参数为过滤条件变更后的回调；`filterMenu`参数可以自定义过滤器，函数可返回由[h 函数](https://cn.vuejs.org/api/render-function.html#h)创建的虚拟 DOM 节点。
+
+:::demo
 
 ```vue
 <template>
@@ -1376,7 +1414,9 @@ export default defineComponent({
 
 ### 列宽拖拽
 
-:::demo 列数据配置`resizable`为`true`，使该列可拖拽，拖拽后，会通过最后一列做宽度补偿。**虚拟滚动暂时不支持列宽拖拽**。
+列数据配置`resizable`为`true`，使该列可拖拽，拖拽后，会通过最后一列做宽度补偿。**虚拟滚动暂时不支持列宽拖拽**。
+
+:::demo
 
 ```vue
 <template>
@@ -1431,7 +1471,9 @@ export default defineComponent({
 
 ### 可选择
 
-:::demo 列数据中`type`参数设置为`checkable`可启用勾选功能；行数据中`checked`参数可设置默认勾选状态，`disableCheck`参数可设置禁用勾选；行勾选状态变更时触发`check-change`事件，事件参数为当前行的勾选状态和行数据；表头勾选状态变更时触发`check-all-change`事件，事件参数为当前勾选状态。
+列数据中`type`参数设置为`checkable`可启用勾选功能；行数据中`checked`参数可设置默认勾选状态，`disableCheck`参数可设置禁用勾选；行勾选状态变更时触发`check-change`事件，事件参数为当前行的勾选状态和行数据；表头勾选状态变更时触发`check-all-change`事件，事件参数为当前勾选状态。
+
+:::demo
 
 ```vue
 <template>
@@ -1504,7 +1546,9 @@ export default defineComponent({
 
 ### 父子联动
 
-:::demo 在搭配树形表格使用时，通过`checkable-relation`参数可以控制父子联动方式，默认为`both`，即勾选状态改变会同时影响父和子；其他可选参数为`downward`、`upward`、`none`，具体表现参考 demo 。
+在搭配树形表格使用时，通过`checkable-relation`参数可以控制父子联动方式，默认为`both`，即勾选状态改变会同时影响父和子；其他可选参数为`downward`、`upward`、`none`，具体表现参考 demo。
+
+:::demo
 
 ```vue
 <template>
@@ -1621,7 +1665,9 @@ export default defineComponent({
 
 ### 操作方法
 
-:::demo `toggleRowChecked`方法切换行的勾选状态，第一个参数为行数据，第二个参数可选，可设置勾选状态；`toggleAllRowChecked`方法切换全选状态，参数可选，可设置勾选状态；`getCheckedRows`方法获取当前已勾选数据。
+`toggleRowChecked`方法切换行的勾选状态，第一个参数为行数据，第二个参数可选，可设置勾选状态；`toggleAllRowChecked`方法切换全选状态，参数可选，可设置勾选状态；`getCheckedRows`方法获取当前已勾选数据。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/date-picker/index.md b/packages/devui-vue/docs/components/date-picker/index.md
index 4aeab2d145..e1fb79795e 100644
--- a/packages/devui-vue/docs/components/date-picker/index.md
+++ b/packages/devui-vue/docs/components/date-picker/index.md
@@ -2,36 +2,37 @@
 
 输入或选择日期的组件。
 
-#### 何时使用
-
+:::tip 何时使用
 当用户需要输入一个日期时；需要点击标准输入框，弹出日期面板进行选择时。
+:::
+
+## 用法
 
 ### 基本用法
 
 :::demo
 
 ```vue
-
 <template>
-  <div class="mb-2">选中的日期： {{eventValue}}</div>
+  <div class="mb-2">选中的日期： {{ eventValue }}</div>
   <d-datepicker :selected-date-change="handleEventValue" />
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const eventValue = ref<string>('')
+    const eventValue = ref<string>('');
     const handleEventValue = (val: string) => {
       eventValue.value = val;
-    }
+    };
 
     return {
       eventValue,
       handleEventValue,
     };
-  }
+  },
 });
 </script>
 
@@ -53,7 +54,6 @@ export default defineComponent({
 :::demo
 
 ```vue
-
 <template>
   <div class="mb-2">开启 auto-close</div>
   <d-datepicker auto-close class="mb-1" />
@@ -65,11 +65,10 @@ export default defineComponent({
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
+import { defineComponent } from 'vue';
 
 export default defineComponent({
-  setup() {
-  }
+  setup() {},
 });
 </script>
 
@@ -87,7 +86,6 @@ export default defineComponent({
 :::demo
 
 ```vue
-
 <template>
   <div class="mb-2">开启 range</div>
   <d-datepicker range class="mb-1" />
@@ -99,11 +97,10 @@ export default defineComponent({
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
+import { defineComponent } from 'vue';
 
 export default defineComponent({
-  setup() {
-  }
+  setup() {},
 });
 </script>
 
@@ -121,18 +118,16 @@ export default defineComponent({
 ::: demo
 
 ```vue
-
 <template>
   <d-datepicker format="yyyy-MM-dd hh:mm:ss" class="mb-1" />
   <d-datepicker format="yy-MM-dd" range />
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
+import { defineComponent } from 'vue';
 
 export default defineComponent({
-  setup() {
-  }
+  setup() {},
 });
 </script>
 
@@ -150,23 +145,22 @@ export default defineComponent({
 ::: demo
 
 ```vue
-
 <template>
   <d-input v-model="splitterText" :max-length="1" class="mb-1 wh200"></d-input>
   <d-datepicker range :range-spliter="splitterText" />
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const splitterText = ref('至')
+    const splitterText = ref('至');
 
     return {
-      splitterText
-    }
-  }
+      splitterText,
+    };
+  },
 });
 </script>
 
@@ -185,21 +179,21 @@ export default defineComponent({
 
 ### DatePicker 参数
 
-|     参数     |         类型         |   默认   | 说明                                            | 跳转 Demo                     |
-| :---------- | :------------------ | :------ | :---------------------------------------------- | ----------------------------- |
-| auto-close | `boolean` | false | 可选，选择日期后，是否自动关闭日期面板 | [自动关闭日期面板](#自动关闭日期面板)        |
-| range | `boolean` | false | 可选，是否开启日期区间选择 | [日期范围选择器](#日期范围选择器)        |
-| format | `string` | y/MM/dd | 可选，[日期值格式](#日期格式化字符) | [日期格式化](#日期格式化)        |
-| range-spliter | `string` | - | 可选，在区间选择模式下，分隔起止时间的字符。 | [日期起止时间分隔符](#日期起止时间分隔符) |
-| selected-date-change | `Function` | - | 可选，子项切换的时候会发出新激活的子项的数据 | [基本用法](#基本用法) |
+| 参数                 | 类型       | 默认    | 说明                                         | 跳转 Demo                                 |
+| :------------------- | :--------- | :------ | :------------------------------------------- | ----------------------------------------- |
+| auto-close           | `boolean`  | false   | 可选，选择日期后，是否自动关闭日期面板       | [自动关闭日期面板](#自动关闭日期面板)     |
+| range                | `boolean`  | false   | 可选，是否开启日期区间选择                   | [日期范围选择器](#日期范围选择器)         |
+| format               | `string`   | y/MM/dd | 可选，[日期值格式](#日期格式化字符)          | [日期格式化](#日期格式化)                 |
+| range-spliter        | `string`   | -       | 可选，在区间选择模式下，分隔起止时间的字符。 | [日期起止时间分隔符](#日期起止时间分隔符) |
+| selected-date-change | `Function` | -       | 可选，子项切换的时候会发出新激活的子项的数据 | [基本用法](#基本用法)                     |
 
 ### 日期格式化字符
 
-|字符|说明|规则|
-|----|----|----|
-|y, yy, yyyy|year|使用`yy`时，只显示后2位年份，其他情况显示4位年份。比如`yy/MM/dd -> 21/01/02`， `y/MM/dd -> 2021/01/02`|
-|M,MM|month|使用`MM`时，一位数数字左侧自动补`0`。比如`y/MM/dd -> 2021/01/02`，`y/M/d -> 2021/1/2`|
-|d,dd|date|规则同`M`|
-|h,hh|hour|规则同`M`；使用24小时表示。|
-|m,mm|minute|规则同`M`|
-|s,ss|second|规则同`M`|
+| 字符        | 说明   | 规则                                                                                                       |
+| ----------- | ------ | ---------------------------------------------------------------------------------------------------------- |
+| y, yy, yyyy | year   | 使用`yy`时，只显示后 2 位年份，其他情况显示 4 位年份。比如`yy/MM/dd -> 21/01/02`， `y/MM/dd -> 2021/01/02` |
+| M,MM        | month  | 使用`MM`时，一位数数字左侧自动补`0`。比如`y/MM/dd -> 2021/01/02`，`y/M/d -> 2021/1/2`                      |
+| d,dd        | date   | 规则同`M`                                                                                                  |
+| h,hh        | hour   | 规则同`M`；使用 24 小时表示。                                                                              |
+| m,mm        | minute | 规则同`M`                                                                                                  |
+| s,ss        | second | 规则同`M`                                                                                                  |
diff --git a/packages/devui-vue/docs/components/dragdrop-new/index.md b/packages/devui-vue/docs/components/dragdrop-new/index.md
index 51df5b34e4..839532b8b3 100644
--- a/packages/devui-vue/docs/components/dragdrop-new/index.md
+++ b/packages/devui-vue/docs/components/dragdrop-new/index.md
@@ -6,7 +6,9 @@
 
 ### 基本用法
 
-:::demo 从一个container拖动到另外一个container，并支持排序。
+从一个 container 拖动到另外一个 container，并支持排序。
+
+:::demo
 
 ```vue
 <script>
@@ -15,12 +17,7 @@ import { defineComponent, reactive } from 'vue';
 export default defineComponent({
   setup() {
     const data = reactive({
-      list1: [
-        { name: 'Visual Studio Code' },
-        { name: 'WebStorm' },
-        { name: 'Sublime' },
-        { name: 'Atom (disabled)', disabled: true }
-      ],
+      list1: [{ name: 'Visual Studio Code' }, { name: 'WebStorm' }, { name: 'Sublime' }, { name: 'Atom (disabled)', disabled: true }],
       list2: [],
       list3: [],
     });
@@ -44,9 +41,11 @@ export default defineComponent({
     }
 
     function removeItem(item, list) {
-      const index = list.map(function (e) {
-        return e.name;
-      }).indexOf(item.name);
+      const index = list
+        .map(function (e) {
+          return e.name;
+        })
+        .indexOf(item.name);
       list.splice(index, 1);
     }
 
@@ -60,95 +59,99 @@ export default defineComponent({
 </script>
 
 <template>
-<div class="demo1">
-<div class="row">
-  <div class="col-sm-3">
-    <div class="card">
-      <div class="card-header">Draggable Item</div>
-      <div class="card-block">
-        <ul class="list-group">
-          <li
-            v-dDraggable="{
-              dragScope: 'default-css',
-              dragData:{ item: item, parent: data.list1 },
-              disabled: item.disabled,
-              '@dragStartEvent': log,
-              '@dragEndEvent': log,
-              '@dragEndEvent': log,
-            }"
-            v-for="item in data.list1"
-            :class="['list-group-item over-flow-ellipsis', { disabled: item.disabled }]"
-          >
-            {{ item.name }}
-          </li>
-        </ul>
+  <div class="demo1">
+    <div class="row">
+      <div class="col-sm-3">
+        <div class="card">
+          <div class="card-header">Draggable Item</div>
+          <div class="card-block">
+            <ul class="list-group">
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-css',
+                  dragData: { item: item, parent: data.list1 },
+                  disabled: item.disabled,
+                  '@dragStartEvent': log,
+                  '@dragEndEvent': log,
+                  '@dragEndEvent': log,
+                }"
+                v-for="item in data.list1"
+                :class="['list-group-item over-flow-ellipsis', { disabled: item.disabled }]"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
+        </div>
       </div>
-    </div>
-  </div>
-  <div class="col-sm-3">
-    <div
-      class="card card-outline-primary mb-3"
-      v-dDroppable="{
-        dropScope: 'default-css',
-        '@dropEvent': function (e) {onDrop(e, data.list2)},
-        '@dragEnterEvent': log,
-        '@dragOverEvent': log,
-        '@dragLeaveEvent': log,
-      }"
-    >
-      <div class="card-header">Drop Area With Sortable Function</div>
-      <div class="card-block">
-        <ul class="list-group d-drop-el" v-dSortable>
-          <li
-            v-dDraggable="{
-              dragScope:'default-css',
-              dragData:{ item: item, parent: data.list2 },
-              disabled: item.disabled,
-            }"
-            v-for="item in data.list2"
-            :class="['list-group-item over-flow-ellipsis', { disabled: item.disabled }]"
-          >
-            {{ item.name }}
-          </li>
-        </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            dropScope: 'default-css',
+            '@dropEvent': function (e) {
+              onDrop(e, data.list2);
+            },
+            '@dragEnterEvent': log,
+            '@dragOverEvent': log,
+            '@dragLeaveEvent': log,
+          }"
+        >
+          <div class="card-header">Drop Area With Sortable Function</div>
+          <div class="card-block">
+            <ul class="list-group d-drop-el" v-dSortable>
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-css',
+                  dragData: { item: item, parent: data.list2 },
+                  disabled: item.disabled,
+                }"
+                v-for="item in data.list2"
+                :class="['list-group-item over-flow-ellipsis', { disabled: item.disabled }]"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
+        </div>
       </div>
-    </div>
-  </div>
-   <div class="col-sm-3">
-    <div
-      class="card card-outline-primary mb-3"
-      v-dDroppable="{
-        dropScope: 'default-css',
-        '@dropEvent': function (e) {onDrop(e, data.list3)},
-        '@dragEnterEvent': log,
-        '@dragOverEvent': log,
-        '@dragLeaveEvent': log,
-      }"
-    >
-      <div class="card-header">Drop Area Without Sortable Function</div>
-      <div class="card-block">
-        <ul class="list-group drop-el">
-          <li
-            v-dDraggable="{
-              dragScope:'default-css',
-              dragData:{ item: item, parent: data.list3 },
-              disabled: item.disabled,
-            }"
-            v-for="item in data.list3"
-            :class="['list-group-item over-flow-ellipsis', { disabled: item.disabled }]"
-          >
-            <div>
-              {{ item.name }}
-            </div>
-          </li>
-        </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            dropScope: 'default-css',
+            '@dropEvent': function (e) {
+              onDrop(e, data.list3);
+            },
+            '@dragEnterEvent': log,
+            '@dragOverEvent': log,
+            '@dragLeaveEvent': log,
+          }"
+        >
+          <div class="card-header">Drop Area Without Sortable Function</div>
+          <div class="card-block">
+            <ul class="list-group drop-el">
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-css',
+                  dragData: { item: item, parent: data.list3 },
+                  disabled: item.disabled,
+                }"
+                v-for="item in data.list3"
+                :class="['list-group-item over-flow-ellipsis', { disabled: item.disabled }]"
+              >
+                <div>
+                  {{ item.name }}
+                </div>
+              </li>
+            </ul>
+          </div>
+        </div>
       </div>
     </div>
   </div>
-</div>
-</div>
 </template>
-<style lang='scss'>
+<style lang="scss">
 .demo1 {
   .row {
     overflow: hidden;
@@ -227,7 +230,6 @@ export default defineComponent({
     background-color: var(--devui-disabled-bg);
   }
 }
-
 </style>
 ```
 
@@ -235,7 +237,9 @@ export default defineComponent({
 
 ### 多层树状拖拽
 
-:::demo 排序允许拖拽到元素上，支持层级嵌套。
+排序允许拖拽到元素上，支持层级嵌套。
+
+:::demo
 
 ```vue
 <script>
@@ -248,14 +252,8 @@ export default defineComponent({
   },
   setup() {
     const data = reactive({
-      list1: [
-        { name: 'Visual Studio Code' },
-        { name: 'Sublime' },
-        { name: 'Atom' }
-      ],
-      list2: [
-        { name: 'WebStorm' , children: [{ name: 'notepad++'}]},
-      ],
+      list1: [{ name: 'Visual Studio Code' }, { name: 'Sublime' }, { name: 'Atom' }],
+      list2: [{ name: 'WebStorm', children: [{ name: 'notepad++' }] }],
     });
 
     function onDrop(e, list) {
@@ -292,76 +290,80 @@ export default defineComponent({
 });
 </script>
 <template>
-<div class="demo2" v-if="!parentItem">
-  <div class="row">
-    <div class="col-sm-3">
-      <div class="card">
-        <div class="card-header">Draggable Items</div>
-        <div class="card-block">
-          <ul class="list-group">
-            <li
-              v-for="(item, i) in data.list1"
-              v-dDraggable="{
-                dragScope: 'drop-area',
-                dragData: { item: item, parentList: data.list1, index: i },
-              }"
-              class="list-group-item"
-            >
-              <div class="name">{{ item.name }}</div>
-            </li>
-          </ul>
+  <div class="demo2" v-if="!parentItem">
+    <div class="row">
+      <div class="col-sm-3">
+        <div class="card">
+          <div class="card-header">Draggable Items</div>
+          <div class="card-block">
+            <ul class="list-group">
+              <li
+                v-for="(item, i) in data.list1"
+                v-dDraggable="{
+                  dragScope: 'drop-area',
+                  dragData: { item: item, parentList: data.list1, index: i },
+                }"
+                class="list-group-item"
+              >
+                <div class="name">{{ item.name }}</div>
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="col-sm-3">
-      <div
-        class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          dropScope: 'drop-area',
-          allowDropOnItem: true,
-          nestingTargetRect: { height: 30 },
-          dragOverItemClass: 'drag-over-item',
-          '@dropEvent': (e) => { onDrop(e, data.list2) },
-        }"
-      >
-        <div class="card-header">Tree Sortable Area</div>
-        <div class="card-block">
-          <ul class="list-group d-drop-el" v-dSortable>
-            <li
-              v-for="(item, i) of data.list2"
-              v-dDraggable="{
-                dragScope: 'drop-area',
-                dragHandleClass: 'drag-handle',
-                dragData: { item: item, parentList: data.list2, index: i },
-              }"
-            >
-              <div class="name">
-                {{ item.name }}
-              </div>
-              <demo-item v-if="item.children && item.children.length > 0" :parentItem="item"></demo-item>
-            </li>
-          </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            dropScope: 'drop-area',
+            allowDropOnItem: true,
+            nestingTargetRect: { height: 30 },
+            dragOverItemClass: 'drag-over-item',
+            '@dropEvent': (e) => {
+              onDrop(e, data.list2);
+            },
+          }"
+        >
+          <div class="card-header">Tree Sortable Area</div>
+          <div class="card-block">
+            <ul class="list-group d-drop-el" v-dSortable>
+              <li
+                v-for="(item, i) of data.list2"
+                v-dDraggable="{
+                  dragScope: 'drop-area',
+                  dragHandleClass: 'drag-handle',
+                  dragData: { item: item, parentList: data.list2, index: i },
+                }"
+              >
+                <div class="name">
+                  {{ item.name }}
+                </div>
+                <demo-item v-if="item.children && item.children.length > 0" :parentItem="item"></demo-item>
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
     </div>
   </div>
-</div>
-<ul class="list-group list-group-child" v-if="parentItem"
-    v-dSortable 
+  <ul
+    class="list-group list-group-child"
+    v-if="parentItem"
+    v-dSortable
     v-dDroppable="{
       dropScope: 'drop-area',
       allowDropOnItem: true,
       nestingTargetRect: { height: 30 },
       dragOverItemClass: 'drag-over-item',
       '@dropEvent': (e) => onDrop(e, parentItem.children),
-    }" 
+    }"
   >
-    <li 
-      v-for="(item, i) of parentItem.children" 
+    <li
+      v-for="(item, i) of parentItem.children"
       v-dDraggable="{
         dragHandleClass: 'drag-handle',
         dragScope: 'drop-area',
-        dragData:{ item: item, parentList: parentItem.children, index: i },
+        dragData: { item: item, parentList: parentItem.children, index: i },
       }"
     >
       <div class="name">
@@ -371,7 +373,7 @@ export default defineComponent({
     </li>
   </ul>
 </template>
-<style lang='scss'>
+<style lang="scss">
 .demo2 {
   .row {
     overflow: hidden;
@@ -473,7 +475,6 @@ export default defineComponent({
     color: var(--devui-list-item-active-text);
   }
 }
-
 </style>
 ```
 
@@ -481,7 +482,9 @@ export default defineComponent({
 
 ### 拖拽实体元素跟随
 
-:::demo 允许拖拽时候非半透明元素跟随。也可以使用appendToBody：当拖拽离开后源位置的父对象会被销毁的话，需要把克隆体附着到body上防止被销毁。 默认会通过复制样式保证克隆到body的实体的样式是正确的，但部分深度依赖DOM节点位置的样式和属性可能会失败，需要手动调整部分样式。
+允许拖拽时候非半透明元素跟随。也可以使用 appendToBody：当拖拽离开后源位置的父对象会被销毁的话，需要把克隆体附着到 body 上防止被销毁。 默认会通过复制样式保证克隆到 body 的实体的样式是正确的，但部分深度依赖 DOM 节点位置的样式和属性可能会失败，需要手动调整部分样式。
+
+:::demo
 
 ```vue
 <script>
@@ -489,13 +492,8 @@ import { defineComponent, reactive, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const data= reactive({
-      list1: [
-        { name: 'Visual Studio Code' },
-        { name: 'WebStorm' },
-        { name: 'Sublime' },
-        { name: 'Atom' }
-      ],
+    const data = reactive({
+      list1: [{ name: 'Visual Studio Code' }, { name: 'WebStorm' }, { name: 'Sublime' }, { name: 'Atom' }],
       list2: [],
     });
 
@@ -519,9 +517,11 @@ export default defineComponent({
     }
 
     function removeItem(item, list) {
-      const index = list.map(function (e) {
-        return e.name;
-      }).indexOf(item.name);
+      const index = list
+        .map(function (e) {
+          return e.name;
+        })
+        .indexOf(item.name);
       list.splice(index, 1);
     }
     return { onDrop, data, appendToBody };
@@ -529,71 +529,70 @@ export default defineComponent({
 });
 </script>
 <template>
-<div class="demo3">
-  <div class="row">
-    <div class="col-sm-3">
-      <div class="card">
-        <div class="card-header">Draggable Items</div>
-        <div class="card-block">
-          <ul class="list-group">
-            <li
-              v-dDraggable="{
-                enableDragFollow: true,
-                dragFollowOptions: {appendToBody: appendToBody},
-                dragOverClass: 'box-shadow',
-                dragScope: 'default-css',
-                dragData: item,
-              }"
-              v-for="item in data.list1"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+  <div class="demo3">
+    <div class="row">
+      <div class="col-sm-3">
+        <div class="card">
+          <div class="card-header">Draggable Items</div>
+          <div class="card-block">
+            <ul class="list-group">
+              <li
+                v-dDraggable="{
+                  enableDragFollow: true,
+                  dragFollowOptions: { appendToBody: appendToBody },
+                  dragOverClass: 'box-shadow',
+                  dragScope: 'default-css',
+                  dragData: item,
+                }"
+                v-for="item in data.list1"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="col-sm-3">
-      <div class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          dropScope: 'default-css',
-          '@dropEvent': ($event) => onDrop($event),
-        }">
-        <div class="card-header">Drop Area with Sortable</div>
-        <div class="card-block">
-          <ul class="list-group d-drop-el" v-dSortable>
-            <li
-              v-dDraggable="{
-                enableDragFollow: true,
-                dragFollowOptions: {appendToBody: appendToBody},
-                dragOverClass: 'box-shadow',
-                dragScope: 'default-css',
-                dragHandleClass: 'drag-handle',
-                dragData: item,
-              }"
-              v-for="item in data.list2"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            dropScope: 'default-css',
+            '@dropEvent': ($event) => onDrop($event),
+          }"
+        >
+          <div class="card-header">Drop Area with Sortable</div>
+          <div class="card-block">
+            <ul class="list-group d-drop-el" v-dSortable>
+              <li
+                v-dDraggable="{
+                  enableDragFollow: true,
+                  dragFollowOptions: { appendToBody: appendToBody },
+                  dragOverClass: 'box-shadow',
+                  dragScope: 'default-css',
+                  dragHandleClass: 'drag-handle',
+                  dragData: item,
+                }"
+                v-for="item in data.list2"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div class="option">
-    <div class="option-toggle">
-      <d-switch v-model="appendToBody"></d-switch>
-      <span style="margin-left: 8px">appendToBody</span>
+    <div class="option">
+      <div class="option-toggle">
+        <d-switch v-model="appendToBody"></d-switch>
+        <span style="margin-left: 8px">appendToBody</span>
+      </div>
     </div>
   </div>
-
-</div>
-
 </template>
-<style lang='scss'>
+<style lang="scss">
 .demo3 {
-  
   .row {
     overflow: hidden;
   }
@@ -684,9 +683,7 @@ export default defineComponent({
     display: inline-block;
     transform: translateY(3px);
   }
-
 }
-
 </style>
 ```
 
@@ -694,7 +691,9 @@ export default defineComponent({
 
 ### 越边交换
 
-:::demo 设置switchWhileCrossEdge允许越过边缘的时候交换。注意：不可与dropOnItem一起用，dropOnItem为true的时候无效。
+设置 switchWhileCrossEdge 允许越过边缘的时候交换。注意：不可与 dropOnItem 一起用，dropOnItem 为 true 的时候无效。
+
+:::demo
 
 ```vue
 <script>
@@ -702,13 +701,8 @@ import { defineComponent, reactive, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const data= reactive({
-      list: [
-        { name: 'Visual Studio Code' },
-        { name: 'WebStorm' },
-        { name: 'Sublime' },
-        { name: 'Atom' }
-      ],
+    const data = reactive({
+      list: [{ name: 'Visual Studio Code' }, { name: 'WebStorm' }, { name: 'Sublime' }, { name: 'Atom' }],
     });
 
     function onDrop(e) {
@@ -729,42 +723,39 @@ export default defineComponent({
 });
 </script>
 <template>
-<div class="demo4">
-  <div class="row">
-    <div class="col-sm-3">
-      <div
-        class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          switchWhileCrossEdge: true,
-          dropScope: 'default-switch',
-          '@dropEvent': onDrop,
-        }"
-      >
-        <div class="card-header">Drag Drop Sort Area</div>
-        <div class="card-block">
-          <ul class="list-group drop-el" v-dSortable>
-            <li
-              v-dDraggable="{
-                dragScope: 'default-switch',
-                dragHandleClass: 'drag-handle',
-                dragData: item,
-              }"
-              v-for="item in data.list"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+  <div class="demo4">
+    <div class="row">
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            switchWhileCrossEdge: true,
+            dropScope: 'default-switch',
+            '@dropEvent': onDrop,
+          }"
+        >
+          <div class="card-header">Drag Drop Sort Area</div>
+          <div class="card-block">
+            <ul class="list-group drop-el" v-dSortable>
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-switch',
+                  dragHandleClass: 'drag-handle',
+                  dragData: item,
+                }"
+                v-for="item in data.list"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
     </div>
   </div>
-
-</div>
-
 </template>
-<style lang='scss'>
+<style lang="scss">
 .demo4 {
-  
   .row {
     overflow: hidden;
   }
@@ -835,7 +826,6 @@ export default defineComponent({
     align-items: center;
   }
 }
-
 </style>
 ```
 
@@ -843,7 +833,9 @@ export default defineComponent({
 
 ### 外部放置位置：就近，前面，后面
 
-:::demo 使用defaultDropPostion配置排序器之外的区域拖拽元素放下的时候默认加到列表的前面或者后面，默认为就近('closest')。
+使用 defaultDropPostion 配置排序器之外的区域拖拽元素放下的时候默认加到列表的前面或者后面，默认为就近('closest')。
+
+:::demo
 
 ```vue
 <script>
@@ -851,8 +843,8 @@ import { defineComponent, reactive, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const data= reactive({
-      list1: [{ name: 'Visual Studio Code' } ],
+    const data = reactive({
+      list1: [{ name: 'Visual Studio Code' }],
       list2: [{ name: 'WebStorm' }],
       list3: [{ name: 'Sublime' }],
       list4: [{ name: 'Atom' }],
@@ -864,7 +856,9 @@ export default defineComponent({
       const parentArray = e.dragData.parent;
       const item = e.dragData.item;
       if (-1 !== index) {
-        if (-1 !== fromIndex && index > fromIndex) { index--; }
+        if (-1 !== fromIndex && index > fromIndex) {
+          index--;
+        }
         targetArray.splice(index, 0, fromIndex === -1 ? item : targetArray.splice(fromIndex, 1)[0]);
       } else {
         targetArray.push(item);
@@ -875,9 +869,11 @@ export default defineComponent({
     }
 
     function removeItem(item, list) {
-      const index = list.map(function (e) {
-        return e.name;
-      }).indexOf(item.name);
+      const index = list
+        .map(function (e) {
+          return e.name;
+        })
+        .indexOf(item.name);
       list.splice(index, 1);
     }
     return { onDrop, data };
@@ -885,120 +881,118 @@ export default defineComponent({
 });
 </script>
 <template>
-<div class="demo5">
-  <div class="row">
-    <div class="col-sm-3">
-      <div class="card">
-        <div class="card-header">Items</div>
-        <div class="card-block">
-          <ul class="list-group">
-            <li
-              v-dDraggable="{
-                dragScope: 'default-position',
-                dragHandleClass: 'drag-handle',
-                dragData: { item: item, parent: data.list1 },
-              }"
-              v-for="item in data.list1"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+  <div class="demo5">
+    <div class="row">
+      <div class="col-sm-3">
+        <div class="card">
+          <div class="card-header">Items</div>
+          <div class="card-block">
+            <ul class="list-group">
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-position',
+                  dragHandleClass: 'drag-handle',
+                  dragData: { item: item, parent: data.list1 },
+                }"
+                v-for="item in data.list1"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="col-sm-3">
-      <div
-        class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          switchWhileCrossEdge: true,
-          dropScope: 'default-position',
-          defaultDropPosition: 'before',
-          '@dropEvent': (e) => onDrop(e, data.list2),
-        }"
-      >
-        <div class="card-header">Drop here to add to the top</div>
-        <div class="card-block">
-          <ul class="list-group drop-el" v-dSortable>
-            <li
-              v-dDraggable="{
-                dragScope: 'default-position',
-                dragHandleClass: 'drag-handle',
-                dragData: { item: item, parent: data.list2 },
-              }"
-              v-for="item in data.list2"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            switchWhileCrossEdge: true,
+            dropScope: 'default-position',
+            defaultDropPosition: 'before',
+            '@dropEvent': (e) => onDrop(e, data.list2),
+          }"
+        >
+          <div class="card-header">Drop here to add to the top</div>
+          <div class="card-block">
+            <ul class="list-group drop-el" v-dSortable>
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-position',
+                  dragHandleClass: 'drag-handle',
+                  dragData: { item: item, parent: data.list2 },
+                }"
+                v-for="item in data.list2"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="col-sm-3">
-      <div
-        class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          switchWhileCrossEdge: true,
-          dropScope: 'default-position',
-          defaultDropPosition: 'after',
-          '@dropEvent': (e) => onDrop(e, data.list3),
-        }"
-      >
-        <div class="card-header">Drop here to add to the bottom</div>
-        <div class="card-block">
-          <ul class="list-group drop-el" v-dSortable>
-            <li
-              v-dDraggable="{
-                dragScope: 'default-position',
-                dragHandleClass: 'drag-handle',
-                dragData: { item: item, parent: data.list3 },
-              }"
-              v-for="item in data.list3"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            switchWhileCrossEdge: true,
+            dropScope: 'default-position',
+            defaultDropPosition: 'after',
+            '@dropEvent': (e) => onDrop(e, data.list3),
+          }"
+        >
+          <div class="card-header">Drop here to add to the bottom</div>
+          <div class="card-block">
+            <ul class="list-group drop-el" v-dSortable>
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-position',
+                  dragHandleClass: 'drag-handle',
+                  dragData: { item: item, parent: data.list3 },
+                }"
+                v-for="item in data.list3"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="col-sm-3">
-      <div
-        class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          switchWhileCrossEdge: true,
-          dropScope: 'default-position',
-          defaultDropPosition: 'closest',
-          '@dropEvent': (e) => onDrop(e, data.list4),
-        }"  
-      >
-        <div class="card-header">Drop here to add to the nearest place (top)</div>
-        <div class="card-block">
-          <ul class="list-group drop-el" v-dSortable>
-            <li
-              v-dDraggable="{
-                dragScope: 'default-position',
-                dragHandleClass: 'drag-handle',
-                dragData: { item: item, parent: data.list4 },
-              }"
-              v-for="item in data.list4"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            switchWhileCrossEdge: true,
+            dropScope: 'default-position',
+            defaultDropPosition: 'closest',
+            '@dropEvent': (e) => onDrop(e, data.list4),
+          }"
+        >
+          <div class="card-header">Drop here to add to the nearest place (top)</div>
+          <div class="card-block">
+            <ul class="list-group drop-el" v-dSortable>
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-position',
+                  dragHandleClass: 'drag-handle',
+                  dragData: { item: item, parent: data.list4 },
+                }"
+                v-for="item in data.list4"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
+          <div class="card-footer">Drop here to add to the nearest place (bottom)</div>
         </div>
-        <div class="card-footer">Drop here to add to the nearest place (bottom)</div>
       </div>
     </div>
   </div>
-</div>
-
 </template>
-<style lang='scss'>
+<style lang="scss">
 .demo5 {
-  
   .row {
     overflow: hidden;
   }
@@ -1069,7 +1063,6 @@ export default defineComponent({
     align-items: center;
   }
 }
-
 </style>
 ```
 
@@ -1077,7 +1070,9 @@ export default defineComponent({
 
 ### 拖拽滚动容器增强
 
-:::demo 搭配使用dDropScrollEnhanced指令允许拖拽到边缘的时候加速滚动条向两边滚动。
+搭配使用 dDropScrollEnhanced 指令允许拖拽到边缘的时候加速滚动条向两边滚动。
+
+:::demo
 
 ```vue
 <script>
@@ -1088,63 +1083,46 @@ export default defineComponent({
     const lists = reactive([
       {
         name: 'IDE',
-        list:   [
-          { name: 'Visual Studio Code' },
-          { name: 'WebStorm' },
-          { name: 'Sublime Text' },
-          { name: 'Atom' },
-          { name: 'Notepad++' },
-        ]
+        list: [{ name: 'Visual Studio Code' }, { name: 'WebStorm' }, { name: 'Sublime Text' }, { name: 'Atom' }, { name: 'Notepad++' }],
       },
       {
         name: 'Browser',
-        list:   [
+        list: [
           { name: 'Chrome' },
           { name: 'Firefox' },
           { name: 'Opera' },
           { name: 'Edge' },
           { name: 'Internet Explorer' },
           { name: 'Safari' },
-        ]
+        ],
       },
       {
         name: 'OS',
-        list: [
-          {name: 'Linux'},
-          {name: 'Windows'},
-          {name: 'Mac OS'},
-          {name: 'DOS'},
-          {name: 'Chrome OS'},
-        ]
+        list: [{ name: 'Linux' }, { name: 'Windows' }, { name: 'Mac OS' }, { name: 'DOS' }, { name: 'Chrome OS' }],
       },
       {
         name: 'Mobile OS',
-        list:  [
-          {name: 'Android'},
-          {name: 'IOS'},
-          {name: 'BlackBerry'},
-          {name: 'Symbian'},
-        ]
+        list: [{ name: 'Android' }, { name: 'IOS' }, { name: 'BlackBerry' }, { name: 'Symbian' }],
       },
       {
         name: 'Website',
-        list: []
+        list: [],
       },
       {
         name: 'Search Engine',
-        list: []
+        list: [],
       },
       {
         name: 'Technology Stack',
-        list: []
+        list: [],
       },
       {
         name: 'Language',
-        list: []
+        list: [],
       },
       {
         name: 'Whatever',
-        list: []
+        list: [],
       },
     ]);
 
@@ -1156,7 +1134,9 @@ export default defineComponent({
       const parentArray = e.dragData.parent;
       const item = e.dragData.item;
       if (-1 !== index) {
-        if (-1 !== fromIndex && index > fromIndex) { index--; }
+        if (-1 !== fromIndex && index > fromIndex) {
+          index--;
+        }
         targetArray.splice(index, 0, fromIndex === -1 ? item : targetArray.splice(fromIndex, 1)[0]);
       } else {
         targetArray.push(item);
@@ -1167,9 +1147,11 @@ export default defineComponent({
     }
 
     function removeItem(item, list) {
-      const index = list.map(function (e) {
-        return e.name;
-      }).indexOf(item.name);
+      const index = list
+        .map(function (e) {
+          return e.name;
+        })
+        .indexOf(item.name);
       list.splice(index, 1);
     }
     return { onDrop, lists, showDropScrollArea };
@@ -1177,68 +1159,70 @@ export default defineComponent({
 });
 </script>
 <template>
-<div class="demo6">
-  <div :class="{ 'show-drop-area': showDropScrollArea }">
-    <div class="drop-row devui-scrollbar" 
-      v-dDropScrollEnhanced="{
-        direction: 'h',
-        dropScrollScope: ['multiple-group', 'drag-follow'],
-      }">
-      <div class="drop-col" v-for="group in lists">
-        <div class="card card-outline-primary mb-3"
-          v-dDroppable="{
-            dropScope: 'multiple-group',
-            '@dropEvent': (e) => onDrop(e, group.list),
-          }">
-          <div class="card-header">{{ group.name }}</div>
-          <div class="card-block">
-            <ul
-              class="list-group drop-el devui-scrollbar"
-              v-dSortable
-              v-dDropScrollEnhanced="{
-                direction: 'v',
-                responseEdgeWidth: '20px',
-                dropScrollScope: 'multiple-group',
-              }"
-            >
-              <li
-                v-dDraggable="{
-                  dragScope: 'multiple-group',
-                  dragHandleClass: 'drag-handle',
-                  dragData: { item: item, parent: group.list },
+  <div class="demo6">
+    <div :class="{ 'show-drop-area': showDropScrollArea }">
+      <div
+        class="drop-row devui-scrollbar"
+        v-dDropScrollEnhanced="{
+          direction: 'h',
+          dropScrollScope: ['multiple-group', 'drag-follow'],
+        }"
+      >
+        <div class="drop-col" v-for="group in lists">
+          <div
+            class="card card-outline-primary mb-3"
+            v-dDroppable="{
+              dropScope: 'multiple-group',
+              '@dropEvent': (e) => onDrop(e, group.list),
+            }"
+          >
+            <div class="card-header">{{ group.name }}</div>
+            <div class="card-block">
+              <ul
+                class="list-group drop-el devui-scrollbar"
+                v-dSortable
+                v-dDropScrollEnhanced="{
+                  direction: 'v',
+                  responseEdgeWidth: '20px',
+                  dropScrollScope: 'multiple-group',
                 }"
-                v-for="item in group.list"
-                class="list-group-item over-flow-ellipsis"
               >
-                {{ item.name }}
-              </li>
-            </ul>
+                <li
+                  v-dDraggable="{
+                    dragScope: 'multiple-group',
+                    dragHandleClass: 'drag-handle',
+                    dragData: { item: item, parent: group.list },
+                  }"
+                  v-for="item in group.list"
+                  class="list-group-item over-flow-ellipsis"
+                >
+                  {{ item.name }}
+                </li>
+              </ul>
+            </div>
           </div>
         </div>
       </div>
-    </div>
-    <div class="option-toggle">
-      <d-switch v-model="showDropScrollArea"></d-switch>
-      <span>Show drop scroll response area</span>
-    </div>
-    <template v-if="showDropScrollArea">
-      <div>
-        <span class="color-example active" style="display: inline-block; width: 25px; height: 14px; margin-right: 4px"></span>
-        Active area, dragging over it to trigger scroll and show more.
-      </div>
-      <div>
-        <span class="color-example inactive" style="display: inline-block; width: 25px; height: 14px; margin-right: 4px"></span>
-        Inactive area, dragging over it will be able to drop to element under the cover.
+      <div class="option-toggle">
+        <d-switch v-model="showDropScrollArea"></d-switch>
+        <span>Show drop scroll response area</span>
       </div>
-    </template>
+      <template v-if="showDropScrollArea">
+        <div>
+          <span class="color-example active" style="display: inline-block; width: 25px; height: 14px; margin-right: 4px"></span>
+          Active area, dragging over it to trigger scroll and show more.
+        </div>
+        <div>
+          <span class="color-example inactive" style="display: inline-block; width: 25px; height: 14px; margin-right: 4px"></span>
+          Inactive area, dragging over it will be able to drop to element under the cover.
+        </div>
+      </template>
+    </div>
   </div>
-
-</div>
-
 </template>
-<style lang='scss'>
-.demo6 {
 
+<style lang="scss">
+.demo6 {
   .row {
     overflow: hidden;
   }
@@ -1354,7 +1338,6 @@ export default defineComponent({
     }
   }
 }
-
 </style>
 ```
 
@@ -1362,7 +1345,9 @@ export default defineComponent({
 
 ### 源占位符
 
-:::demo 使用originPlaceholder显示源位置的占位符，示例为消失动画。
+使用 originPlaceholder 显示源位置的占位符，示例为消失动画。
+
+:::demo
 
 ```vue
 <script>
@@ -1371,13 +1356,7 @@ import { defineComponent, reactive, ref } from 'vue';
 export default defineComponent({
   setup() {
     const data = reactive({
-      list1: [
-        { name: 'Visual Studio Code' },
-        { name: 'WebStorm' },
-        { name: 'Sublime Text' },
-        { name: 'Atom' },
-        { name: 'Notepad++' },
-      ],
+      list1: [{ name: 'Visual Studio Code' }, { name: 'WebStorm' }, { name: 'Sublime Text' }, { name: 'Atom' }, { name: 'Notepad++' }],
       list2: [
         { name: 'Chrome' },
         { name: 'Firefox' },
@@ -1386,13 +1365,7 @@ export default defineComponent({
         { name: 'Internet Explorer' },
         { name: 'Safari' },
       ],
-      list3: [
-        {name: 'Linux'},
-        {name: 'Windows'},
-        {name: 'Mac OS'},
-        {name: 'DOS'},
-        {name: 'Chrome OS'},
-      ],
+      list3: [{ name: 'Linux' }, { name: 'Windows' }, { name: 'Mac OS' }, { name: 'DOS' }, { name: 'Chrome OS' }],
     });
 
     const showDropScrollArea = ref(false);
@@ -1424,105 +1397,111 @@ export default defineComponent({
 });
 </script>
 <template>
-<div class="demo7">
-  <div class="row">
-    <div class="col-sm-3">
-      <div class="card"
-        v-dDroppable="{
-          dropScope: 'default-css',
-          '@dropEvent': (e) => { onDrop(e, data.list1) },
-        }">
-        <div class="card-header">Drag from here，origin placeholder disappear <strong>directly</strong> after dropped</div>
-        <div class="card-block">
-          <ul class="list-group drop-el" v-dSortable>
-            <li
-              v-dDraggable="{
-                dragScope: 'default-css',
-                dragData: { item: item, parent: data.list1 },
-                originPlaceholder: {
-                  text: 'custom text and style',
-                  style: { backgroundColor: '#ffe6e6', textAlign: 'center' }
-                },
-              }"
-              v-for="item in data.list1"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+  <div class="demo7">
+    <div class="row">
+      <div class="col-sm-3">
+        <div
+          class="card"
+          v-dDroppable="{
+            dropScope: 'default-css',
+            '@dropEvent': (e) => {
+              onDrop(e, data.list1);
+            },
+          }"
+        >
+          <div class="card-header">Drag from here，origin placeholder disappear <strong>directly</strong> after dropped</div>
+          <div class="card-block">
+            <ul class="list-group drop-el" v-dSortable>
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-css',
+                  dragData: { item: item, parent: data.list1 },
+                  originPlaceholder: {
+                    text: 'custom text and style',
+                    style: { backgroundColor: '#ffe6e6', textAlign: 'center' },
+                  },
+                }"
+                v-for="item in data.list1"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="col-sm-3">
-      <div
-        class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          dropScope: 'default-css',
-          placeholderStyle: {},
-          '@dropEvent': (e) => { onDrop(e, data.list2) },
-        }"
-      >
-        <div class="card-header">Drag from here，origin placeholder <strong>delay to</strong> disappear after dropped</div>
-        <div class="card-block">
-          <ul class="list-group drop-el" v-dSortable>
-            <li
-              v-dDraggable="{
-                dragScope: 'default-css',
-                dragHandleClass: 'drag-handle',
-                dragData: { item: item, parent: data.list2 },
-                originPlaceholder: {
-                  removeDelay: 100,
-                },
-              }"
-              v-for="item in data.list2"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            dropScope: 'default-css',
+            placeholderStyle: {},
+            '@dropEvent': (e) => {
+              onDrop(e, data.list2);
+            },
+          }"
+        >
+          <div class="card-header">Drag from here，origin placeholder <strong>delay to</strong> disappear after dropped</div>
+          <div class="card-block">
+            <ul class="list-group drop-el" v-dSortable>
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-css',
+                  dragHandleClass: 'drag-handle',
+                  dragData: { item: item, parent: data.list2 },
+                  originPlaceholder: {
+                    removeDelay: 100,
+                  },
+                }"
+                v-for="item in data.list2"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="col-sm-3">
-      <div
-        class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          dropScope: 'default-css',
-          placeholderStyle: {},
-          '@dropEvent': (e) => { onDrop(e, data.list3) },
-        }"
-      >
-        <div class="card-header">
-          Drag from here，origin placeholder <strong>delay to</strong> disappear after dropped <strong>with animation</strong>
-        </div>
-        <div class="card-block">
-          <ul class="list-group drop-el list-3" v-dSortable>
-            <li
-              v-dDraggable="{
-                dragScope: 'default-css',
-                dragHandleClass: 'drag-handle',
-                dragData: { item: item, parent: data.list3 },
-                originPlaceholder: {
-                  removeDelay: 300,
-                },
-              }"
-              v-for="item in data.list3"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            dropScope: 'default-css',
+            placeholderStyle: {},
+            '@dropEvent': (e) => {
+              onDrop(e, data.list3);
+            },
+          }"
+        >
+          <div class="card-header">
+            Drag from here，origin placeholder <strong>delay to</strong> disappear after dropped <strong>with animation</strong>
+          </div>
+          <div class="card-block">
+            <ul class="list-group drop-el list-3" v-dSortable>
+              <li
+                v-dDraggable="{
+                  dragScope: 'default-css',
+                  dragHandleClass: 'drag-handle',
+                  dragData: { item: item, parent: data.list3 },
+                  originPlaceholder: {
+                    removeDelay: 300,
+                  },
+                }"
+                v-for="item in data.list3"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
     </div>
   </div>
-
-</div>
-
 </template>
-<style lang='scss'>
-.demo7 {
 
+<style lang="scss">
+.demo7 {
   .row {
     overflow: hidden;
   }
@@ -1622,7 +1601,6 @@ export default defineComponent({
     }
   }
 }
-
 </style>
 ```
 
@@ -1630,7 +1608,9 @@ export default defineComponent({
 
 ### 拖拽预览
 
-:::demo 允许拖拽的时候展示自定义拖拽元素样式
+允许拖拽的时候展示自定义拖拽元素样式
+
+:::demo
 
 ```vue
 <script>
@@ -1638,15 +1618,9 @@ import { defineComponent, reactive, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const data= reactive({
-      list1: [
-        { name: 'Visual Studio Code' },
-        { name: 'WebStorm' },
-        { name: 'Sublime' },
-      ],
-      list2: [
-        { name: 'Atom' },
-      ],
+    const data = reactive({
+      list1: [{ name: 'Visual Studio Code' }, { name: 'WebStorm' }, { name: 'Sublime' }],
+      list2: [{ name: 'Atom' }],
     });
 
     function onDrop(e) {
@@ -1667,9 +1641,11 @@ export default defineComponent({
     }
 
     function removeItem(item, list) {
-      const index = list.map(function (e) {
-        return e.name;
-      }).indexOf(item.name);
+      const index = list
+        .map(function (e) {
+          return e.name;
+        })
+        .indexOf(item.name);
       list.splice(index, 1);
     }
 
@@ -1680,72 +1656,72 @@ export default defineComponent({
 });
 </script>
 <template>
-<div class="demo9">
-  <div class="row">
-    <div class="col-sm-3">
-      <div class="card">
-        <div class="card-header">Draggable Items</div>
-        <div class="card-block">
-          <ul class="list-group">
-          <d-drag-preview-template ref="previewRef" v-slot="previewContext">
-            <div class='drag-preview-item'>
-              <span class='index'>{{previewContext.data.index + 1}}</span>
-              <span class='name'>{{previewContext.dragData.name}}</span>
-            </div>
-          </d-drag-preview-template>
-            <li
-              v-dDragPreview="{
-                dragPreview: previewRef,
-                dragPreviewData: { index: i },
-              }"
-              v-dDraggable="{
-                dragScope: 'drag-preview',
-                dragData: item,
-              }"
-              v-for="(item, i) in data.list1"
-              class="list-group-item over-flow-ellipsis"
-            >
-              {{ item.name }}
-            </li>
-          </ul>
+  <div class="demo9">
+    <div class="row">
+      <div class="col-sm-3">
+        <div class="card">
+          <div class="card-header">Draggable Items</div>
+          <div class="card-block">
+            <ul class="list-group">
+              <d-drag-preview-template ref="previewRef" v-slot="previewContext">
+                <div class="drag-preview-item">
+                  <span class="index">{{ previewContext.data.index + 1 }}</span>
+                  <span class="name">{{ previewContext.dragData.name }}</span>
+                </div>
+              </d-drag-preview-template>
+              <li
+                v-dDragPreview="{
+                  dragPreview: previewRef,
+                  dragPreviewData: { index: i },
+                }"
+                v-dDraggable="{
+                  dragScope: 'drag-preview',
+                  dragData: item,
+                }"
+                v-for="(item, i) in data.list1"
+                class="list-group-item over-flow-ellipsis"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
-    </div>
-    <div class="col-sm-3">
-      <div class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          dropScope: 'drag-preview',
-          '@dropEvent': ($event) => onDrop($event),
-        }">
-        <div class="card-header">Drop Area with Sortable</div>
-        <div class="card-block">
-          <ul class="list-group d-drop-el" v-dSortable>
-            <li
-              v-dDraggable="{
-                enableDragFollow: true,
-                dragFollowOptions: {appendToBody: true},
-                dragOverClass: 'box-shadow',
-                dragScope: 'drag-preview',
-                dragHandleClass: 'drag-handle',
-                dragData: item,
-              }"
-              v-for="(item, i) in data.list2"
-              class="list-group-item-new over-flow-ellipsis"
-            >
-              <span class='index'>{{ i + 1}}</span>
-              <span class='name'>{{ item.name }}</span>
-            </li>
-          </ul>
+      <div class="col-sm-3">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            dropScope: 'drag-preview',
+            '@dropEvent': ($event) => onDrop($event),
+          }"
+        >
+          <div class="card-header">Drop Area with Sortable</div>
+          <div class="card-block">
+            <ul class="list-group d-drop-el" v-dSortable>
+              <li
+                v-dDraggable="{
+                  enableDragFollow: true,
+                  dragFollowOptions: { appendToBody: true },
+                  dragOverClass: 'box-shadow',
+                  dragScope: 'drag-preview',
+                  dragHandleClass: 'drag-handle',
+                  dragData: item,
+                }"
+                v-for="(item, i) in data.list2"
+                class="list-group-item-new over-flow-ellipsis"
+              >
+                <span class="index">{{ i + 1 }}</span>
+                <span class="name">{{ item.name }}</span>
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
     </div>
   </div>
-</div>
-
 </template>
-<style lang='scss'>
+<style lang="scss">
 .demo9 {
-  
   .row {
     overflow: hidden;
   }
@@ -1851,7 +1827,6 @@ export default defineComponent({
     padding-left: 28px;
   }
 }
-
 </style>
 ```
 
@@ -1859,7 +1834,9 @@ export default defineComponent({
 
 ### 批量拖拽
 
-:::demo 使用batchDrag指令标记可以批量拖拽，请用ctrl按键和鼠标选中多个并进行拖拽
+使用 batchDrag 指令标记可以批量拖拽，请用 ctrl 按键和鼠标选中多个并进行拖拽。
+
+:::demo
 
 ```vue
 <script>
@@ -1875,7 +1852,7 @@ export default defineComponent({
           { name: 'WebStorm', isSelected: false },
           { name: 'Sublime Text', isSelected: false },
           { name: 'Atom', isSelected: false },
-          { name: 'Notepad++', isSelected: false }
+          { name: 'Notepad++', isSelected: false },
         ],
       },
       {
@@ -1896,7 +1873,7 @@ export default defineComponent({
           { name: 'Windows', isSelected: false },
           { name: 'Mac OS', isSelected: false },
           { name: 'DOS', isSelected: false },
-          { name: 'Chrome OS', isSelected: false }
+          { name: 'Chrome OS', isSelected: false },
         ],
       },
       {
@@ -1905,7 +1882,7 @@ export default defineComponent({
           { name: 'Android', isSelected: false },
           { name: 'IOS', isSelected: false },
           { name: 'BlackBerry', isSelected: false },
-          { name: 'Symbian', isSelected: false }
+          { name: 'Symbian', isSelected: false },
         ],
       },
       {
@@ -1975,7 +1952,11 @@ export default defineComponent({
     }
 
     function cleanBatch() {
-      data.forEach((list) => list.list.forEach((item) => {item['isSelected'] = false;}));
+      data.forEach((list) =>
+        list.list.forEach((item) => {
+          item['isSelected'] = false;
+        })
+      );
     }
 
     return { onDrop, data, showOriginPlaceholder, switchWhileCrossEdge, batchSelect, batchSelectCheck, cleanBatch };
@@ -1983,67 +1964,71 @@ export default defineComponent({
 });
 </script>
 <template>
-<div class="demo8">
-  <div class="drop-row devui-scrollbar"
-    v-dDropScrollEnhanced="{
-      direction: 'h',
-      dropScrollScope: ['multiple-group', 'drag-follow'],
-    }">
-    <div class="drop-col" v-for="list in data">
-      <div
-        class="card card-outline-primary mb-3"
-        v-dDroppable="{
-          dropScope: 'multiple-group',
-          switchWhileCrossEdge: switchWhileCrossEdge,
-          '@dropEvent': (e) => onDrop(e, list.list),
-        }"
-      >
-        <div class="card-header">{{ list.name }}</div>
-        <div class="card-block">
-          <ul
-            class="list-group drop-el devui-scrollbar"
-            v-dSortable
-            v-dDropScrollEnhanced="{
-              direction: 'v',
-              responseEdgeWidth: '20px',
-              dropScrollScope: 'multiple-group',
-            }"
-          >
-            <li
-              v-for="item in list.list" :key="item"
-              class="list-group-item over-flow-ellipsis"
-              v-dDraggable="{
-                dragIdentity: item, // 注意：由于使用了动态组合的dragData，批量拖拽需要使用dragIdentity标记唯一标识符， 否则每次刷新的dragData后会不一致，影响排序
-                dragScope: 'multiple-group',
-                dragHandleClass: 'drag-handle',
-                originPlaceholder: {
-                  show: showOriginPlaceholder,
-                  removeDelay: 300
-                },
-                dragData: { item: item, parent: list.list },
-                enableDragFollow: true,
-              }"
-              @click="(e) => batchSelectCheck(e, item)"
-              v-dDraggableBatchDrag="{
-                batchDragActive: item.isSelected,
-                '@batchDragActiveEvent': () => {batchSelect(item)},
+  <div class="demo8">
+    <div
+      class="drop-row devui-scrollbar"
+      v-dDropScrollEnhanced="{
+        direction: 'h',
+        dropScrollScope: ['multiple-group', 'drag-follow'],
+      }"
+    >
+      <div class="drop-col" v-for="list in data">
+        <div
+          class="card card-outline-primary mb-3"
+          v-dDroppable="{
+            dropScope: 'multiple-group',
+            switchWhileCrossEdge: switchWhileCrossEdge,
+            '@dropEvent': (e) => onDrop(e, list.list),
+          }"
+        >
+          <div class="card-header">{{ list.name }}</div>
+          <div class="card-block">
+            <ul
+              class="list-group drop-el devui-scrollbar"
+              v-dSortable
+              v-dDropScrollEnhanced="{
+                direction: 'v',
+                responseEdgeWidth: '20px',
+                dropScrollScope: 'multiple-group',
               }"
-              :class="{ 'selected': item.isSelected }"
             >
-              {{ item.name }}
-            </li>
-          </ul>
+              <li
+                v-for="item in list.list"
+                :key="item"
+                class="list-group-item over-flow-ellipsis"
+                v-dDraggable="{
+                  dragIdentity: item, // 注意：由于使用了动态组合的dragData，批量拖拽需要使用dragIdentity标记唯一标识符， 否则每次刷新的dragData后会不一致，影响排序
+                  dragScope: 'multiple-group',
+                  dragHandleClass: 'drag-handle',
+                  originPlaceholder: {
+                    show: showOriginPlaceholder,
+                    removeDelay: 300,
+                  },
+                  dragData: { item: item, parent: list.list },
+                  enableDragFollow: true,
+                }"
+                @click="(e) => batchSelectCheck(e, item)"
+                v-dDraggableBatchDrag="{
+                  batchDragActive: item.isSelected,
+                  '@batchDragActiveEvent': () => {
+                    batchSelect(item);
+                  },
+                }"
+                :class="{ selected: item.isSelected }"
+              >
+                {{ item.name }}
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
     </div>
+    <d-switch v-model="showOriginPlaceholder"></d-switch> show origin placeholder <d-switch v-model="switchWhileCrossEdge"></d-switch> cross
+    edge switch
+    <d-button variant="solid" @click="cleanBatch"> clean all selected </d-button>
   </div>
-  <d-switch v-model="showOriginPlaceholder"></d-switch> show origin placeholder
-  <d-switch v-model="switchWhileCrossEdge"></d-switch> cross edge switch
-  <d-button variant="solid" @click="cleanBatch"> clean all selected </d-button>
-</div>
-
 </template>
-<style lang='scss'>
+<style lang="scss">
 .demo8 {
   .row {
     overflow: hidden;
@@ -2178,7 +2163,6 @@ export default defineComponent({
 .show-origin .drop-el li:first-child + .drag-origin-placeholder {
   margin-top: 0;
 }
-
 </style>
 ```
 
@@ -2186,7 +2170,9 @@ export default defineComponent({
 
 ### 二维拖拽和组合拖拽预览
 
-:::demo 使用dDragDropSyncBox指令、dDragSync指令、dDropSync指令协同拖拽，实现二维拖拽；使用dDragPreview配置拖拽预览，使用d-drag-preview-clone-dom-ref 完成拖拽节点预览的克隆。
+使用 dDragDropSyncBox 指令、dDragSync 指令、dDropSync 指令协同拖拽，实现二维拖拽；使用 dDragPreview 配置拖拽预览，使用 d-drag-preview-clone-dom-ref 完成拖拽节点预览的克隆。
+
+:::demo
 
 ```vue
 <script>
@@ -2196,14 +2182,8 @@ export default defineComponent({
   setup() {
     const data = reactive({
       lists: {
-        listA1: [
-          { name: 'Visual Studio Code' },
-          { name: 'WebStorm' },
-          { name: 'Sublime Text' },
-          { name: 'Atom' },
-          { name: 'Notepad++' },
-        ],
-        listA2:   [
+        listA1: [{ name: 'Visual Studio Code' }, { name: 'WebStorm' }, { name: 'Sublime Text' }, { name: 'Atom' }, { name: 'Notepad++' }],
+        listA2: [
           { name: 'Chrome' },
           { name: 'Firefox' },
           { name: 'Opera' },
@@ -2212,50 +2192,45 @@ export default defineComponent({
           { name: 'Safari' },
         ],
         listA3: [],
-        listB1: [
-          {name: 'Linux'},
-          {name: 'Windows'},
-          {name: 'Mac OS'},
-          {name: 'DOS'},
-          {name: 'Chrome OS'},
-        ],
-        listB2:  [
-          {name: 'Android'},
-          {name: 'IOS'},
-          {name: 'BlackBerry'},
-          {name: 'Symbian'},
-        ],
+        listB1: [{ name: 'Linux' }, { name: 'Windows' }, { name: 'Mac OS' }, { name: 'DOS' }, { name: 'Chrome OS' }],
+        listB2: [{ name: 'Android' }, { name: 'IOS' }, { name: 'BlackBerry' }, { name: 'Symbian' }],
         listB3: [],
         listC1: [],
         listC2: [],
-        listC3: []
+        listC3: [],
       },
     });
     const meta = reactive({
-      owners:[ {
-        id: 'not-assign',
-        name: 'Not Assign',
-        collapse: false
-      }, {
-        id: 'available',
-        name: 'Available',
-        collapse: false
-      }, {
-        id: 'not-available',
-        name: 'Not Available',
-        collapse: false
-      }],
-      listCol:[
+      owners: [
+        {
+          id: 'not-assign',
+          name: 'Not Assign',
+          collapse: false,
+        },
+        {
+          id: 'available',
+          name: 'Available',
+          collapse: false,
+        },
+        {
+          id: 'not-available',
+          name: 'Not Available',
+          collapse: false,
+        },
+      ],
+      listCol: [
         {
           id: 'group1',
-          name: 'Group 1'
-        }, {
+          name: 'Group 1',
+        },
+        {
           id: 'group2',
-          name: 'Group 2'
-        }, {
+          name: 'Group 2',
+        },
+        {
           id: 'group3',
-          name: 'Group 3'
-        }
+          name: 'Group 3',
+        },
       ],
       ownerListMap: {
         'not-assign': {
@@ -2263,7 +2238,7 @@ export default defineComponent({
           group2: data.lists.listA2,
           group3: data.lists.listA3,
         },
-        'available': {
+        available: {
           group1: data.lists.listB1,
           group2: data.lists.listB2,
           group3: data.lists.listB3,
@@ -2273,7 +2248,7 @@ export default defineComponent({
           group2: data.lists.listC2,
           group3: data.lists.listC3,
         },
-      }
+      },
     });
 
     function onDrop(e, targetArray) {
@@ -2334,7 +2309,11 @@ export default defineComponent({
     }
 
     function cleanBatch() {
-      data.forEach((list) => list.list.forEach((item) => {item['isSelected'] = false;}));
+      data.forEach((list) =>
+        list.list.forEach((item) => {
+          item['isSelected'] = false;
+        })
+      );
     }
 
     const colTemplate = ref();
@@ -2344,129 +2323,141 @@ export default defineComponent({
 });
 </script>
 <template>
-<div class="demo10">
-  <div class="board" 
-    v-dDragDropSyncBox
-    v-dDropScrollEnhanced="{
-      direction: 'v',
-    }" 
-    v-dDropScrollEnhancedSide="{
-      direction: 'v',
-    }">
-    <div class="row row-group">
-      <div class="row title-row occupied-width">
-        <div class="col-group">
-          <div class="col title-col">Status</div>
-        </div>
-        <div
-          class="col-group"
-          v-dDroppable="{
-            dropScope: 'col',
-            switchWhileCrossEdge: true,
-            '@dropEvent': (e) => {onDrop(e, meta.listCol)},
-          }"
-          v-dSortable="{
-            dSortable: 'h'
-          }"
-          v-dDropSortSync="{
-            dropSortSync: 'col',
-          }"
-        >
+  <div class="demo10">
+    <div
+      class="board"
+      v-dDragDropSyncBox
+      v-dDropScrollEnhanced="{
+        direction: 'v',
+      }"
+      v-dDropScrollEnhancedSide="{
+        direction: 'v',
+      }"
+    >
+      <div class="row row-group">
+        <div class="row title-row occupied-width">
+          <div class="col-group">
+            <div class="col title-col">Status</div>
+          </div>
           <div
-            class="col"
-            v-dDragPreview="{
-              dragPreview: colTemplate,
+            class="col-group"
+            v-dDroppable="{
+              dropScope: 'col',
+              switchWhileCrossEdge: true,
+              '@dropEvent': (e) => {
+                onDrop(e, meta.listCol);
+              },
             }"
-            v-dDraggable="{
-              dragScope: 'col',
-              dragData:{ item: col, parent: meta.listCol },
+            v-dSortable="{
+              dSortable: 'h',
             }"
-            v-dDragSync="{
-              dragSync: 'col-' + col.id,
+            v-dDropSortSync="{
+              dropSortSync: 'col',
             }"
-            v-for="col in meta.listCol"
           >
-            {{ col.name }}
+            <div
+              class="col"
+              v-dDragPreview="{
+                dragPreview: colTemplate,
+              }"
+              v-dDraggable="{
+                dragScope: 'col',
+                dragData: { item: col, parent: meta.listCol },
+              }"
+              v-dDragSync="{
+                dragSync: 'col-' + col.id,
+              }"
+              v-for="col in meta.listCol"
+            >
+              {{ col.name }}
+            </div>
           </div>
         </div>
       </div>
-    </div>
-    <div class="row row-group"
-      v-dSortable
-      v-dDroppable="{
-        dropScope: 'row',
-        switchWhileCrossEdge: true,
-        '@dropEvent': (e) => onDrop(e, meta.owners),
-      }">
       <div
-        class="row"
-        v-dDraggable="{
-          dragScope: 'row',
-          dragHandle: '.title-col',
-          enableDragFollow: true,
-          dragData: { item: owner, parent: meta.owners },
+        class="row row-group"
+        v-dSortable
+        v-dDroppable="{
+          dropScope: 'row',
+          switchWhileCrossEdge: true,
+          '@dropEvent': (e) => onDrop(e, meta.owners),
         }"
-        v-for="owner in meta.owners"
       >
-        <div class="col-group">
-          <div class="col title-col">{{ owner.name }}</div>
-        </div>
-        <div class="col-group"
-          v-dDropSortSync="{
-            dropSortSync: 'col',
-          }">
-          <div class="col"
-            v-dDragSync="{
-              dragSync: 'col-' + col.id,
-            }" 
-            v-for="col in meta.listCol"
+        <div
+          class="row"
+          v-dDraggable="{
+            dragScope: 'row',
+            dragHandle: '.title-col',
+            enableDragFollow: true,
+            dragData: { item: owner, parent: meta.owners },
+          }"
+          v-for="owner in meta.owners"
+        >
+          <div class="col-group">
+            <div class="col title-col">{{ owner.name }}</div>
+          </div>
+          <div
+            class="col-group"
+            v-dDropSortSync="{
+              dropSortSync: 'col',
+            }"
           >
-            <div class="card-container"
-              v-dDroppable="{
-                dropScope: 'card-container',
-                switchWhileCrossEdge: true,
-                '@dropEvent': (e) => onDrop(e, meta.ownerListMap[owner.id][col.id]),
-              }">
-              <ul class="list-group drop-el" v-dSortable>
-                <li
-                  v-for="item of meta.ownerListMap[owner.id][col.id]"
-                  class="list-group-item over-flow-ellipsis"
-                  v-dDraggable="{
-                    dragIdentity: item, // 批量脱欧拽必要
-                    dragScope: 'card-container',
-                    dragData: { item: item, parent: meta.ownerListMap[owner.id][col.id] },
-                    enableDragFollow: true,
-                  }"
-                  @click="(e) => batchSelectCheck(e, item)"
-                  v-dDraggableBatchDrag="{
-                    batchDragActive: item.isSelected,
-                    '@batchDragActiveEvent': () => { batchSelect(item) },
-                  }"
-                  :class="{ selected: item.isSelected }"
-                >
-                  {{ item.name }}
-                </li>
-              </ul>
+            <div
+              class="col"
+              v-dDragSync="{
+                dragSync: 'col-' + col.id,
+              }"
+              v-for="col in meta.listCol"
+            >
+              <div
+                class="card-container"
+                v-dDroppable="{
+                  dropScope: 'card-container',
+                  switchWhileCrossEdge: true,
+                  '@dropEvent': (e) => onDrop(e, meta.ownerListMap[owner.id][col.id]),
+                }"
+              >
+                <ul class="list-group drop-el" v-dSortable>
+                  <li
+                    v-for="item of meta.ownerListMap[owner.id][col.id]"
+                    class="list-group-item over-flow-ellipsis"
+                    v-dDraggable="{
+                      dragIdentity: item, // 批量脱欧拽必要
+                      dragScope: 'card-container',
+                      dragData: { item: item, parent: meta.ownerListMap[owner.id][col.id] },
+                      enableDragFollow: true,
+                    }"
+                    @click="(e) => batchSelectCheck(e, item)"
+                    v-dDraggableBatchDrag="{
+                      batchDragActive: item.isSelected,
+                      '@batchDragActiveEvent': () => {
+                        batchSelect(item);
+                      },
+                    }"
+                    :class="{ selected: item.isSelected }"
+                  >
+                    {{ item.name }}
+                  </li>
+                </ul>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <d-drag-preview-template ref="colTemplate" v-slot="{draggedEl, dragSyncDOMElements}">
-    <div class="board board-preview">
-      <div class="row title-row">
-        <d-drag-preview-clone-dom-ref :domRef="draggedEl"></d-drag-preview-clone-dom-ref>
-      </div>
-      <div class="row" v-for="dom in dragSyncDOMElements">
-        <d-drag-preview-clone-dom-ref :domRef="dom"></d-drag-preview-clone-dom-ref>
+    <d-drag-preview-template ref="colTemplate" v-slot="{ draggedEl, dragSyncDOMElements }">
+      <div class="board board-preview">
+        <div class="row title-row">
+          <d-drag-preview-clone-dom-ref :domRef="draggedEl"></d-drag-preview-clone-dom-ref>
+        </div>
+        <div class="row" v-for="dom in dragSyncDOMElements">
+          <d-drag-preview-clone-dom-ref :domRef="dom"></d-drag-preview-clone-dom-ref>
+        </div>
       </div>
-    </div>
-  </d-drag-preview-template>
-</div>
-
+    </d-drag-preview-template>
+  </div>
 </template>
-<style lang='scss'>
+<style lang="scss">
 .board {
   width: 100%;
   max-height: 500px;
@@ -2645,8 +2636,6 @@ export default defineComponent({
     }
   }
 }
-
-
 </style>
 ```
 
@@ -2656,30 +2645,30 @@ export default defineComponent({
 
 ##### dDraggable 参数
 
-|             参数              | 类型                                                                                                             | 默认值        | 描述                                                                                                                                                                                                                        | 跳转 Demo                             |
-| :---------------------------: | :--------------------------------------------------------------------------------------------------------------- | :------------ | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------ |
-|           dragData            | `any`                                                                                                            | --            | 可选，转递给 `DropEvent`事件的数据.                                                                                                                                                                                         | [基本用法](#基本用法)                            |
-|           dragScope           | `string \| Array<string>`                                                                                        | 'default'     | 可选，限制 drop 的位置，必须匹配对应的 `dropScope`                                                                                                                                                                          | [基本用法](#基本用法)                            |
-|         dragOverClass         | `string`                                                                                                         | --            | 可选，拖动时被拖动元素的 css                                                                                                                                                                                                | [拖拽实体元素跟随](#拖拽实体元素跟随) |
-|          dragHandle           | `string`                                                                                                         | --            | 可选，可拖动拖动内容的 css 选择器，只有匹配 css 选择器的元素才能响应拖动事件, 注意是css选择器，示例：`'.title, .title > *'`,`'#header'`, `'.title *:not(input)'`                                                                 |                      |                        |
-|        dragHandleClass        | `string`                                                                                                         | 'drag-handle' | 可选， 会给可拖动内容的应用的 css 选择器命中的元素添加的 css 类名， 第一个匹配 css 选择器的会被加上该 css 类                                                                                                                | [基本用法](#基本用法)                            |
-|           disabled            | `boolean`                                                                                                        | false         | 可选，控制当前元素是否可拖动 false 为可以，true 为不可以                                                                                                                                                                    | [基本用法](#基本用法)                            |
-|       enableDragFollow        | `boolean`                                                                                                        | false         | 可选，是否启用实体元素跟随（可以添加更多特效，如阴影等）                                                                                                                                                                    | [拖拽实体元素跟随](#拖拽实体元素跟随) |
-|       dragFollowOptions        | `{appendToBody?: boolean}`                                                                                       | --            | 可选，用于控制实体拖拽的一些配置                                                                                                                                                                                            | [拖拽实体元素跟随](#拖拽实体元素跟随) |
-| dragFollowOptions.appendToBody | `boolean`                                                                                                        | false         | 可选，用于控制实体拖拽的克隆元素插入的位置。默认 false 会插入到源元素父元素所有子的最后，设置为 true 会附着到。见说明 1                                                                                                     | [拖拽实体元素跟随](#拖拽实体元素跟随) |
-|       originPlaceholder       | `{show?: boolean; tag?: string; style?: {cssProperties: string]: string}; text?: string; removeDelay?: number;}` | --            | 可选，设置源占位符号，用于被拖拽元素原始位置占位                                                                                                                                                                            | [源占位符](#源占位符)                     |
-|    originPlaceholder.show     | `boolean`                                                                                                        | true          | 可选，是否显示，默认 originPlaceholder 有 Input 则显示，特殊情况可以关闭                                                                                                                                                    |
-|     originPlaceholder.tag     | `string`                                                                                                         | 'div'         | 可选，使用 tag 名，默认 originPlaceholder 使用'div'，特殊情况可以置换                                                                                                                                                       |
-|    originPlaceholder.style    | `Object`                                                                                                         | --            | 可选，传 style 对象，key 为样式属性，value 为样式值                                                                                                                                                                         | [源占位符](#源占位符)                     |
-|    originPlaceholder.text     | `string`                                                                                                         | --            | 可选，placeholder 内的文字                                                                                                                                                                                                  | [源占位符](#源占位符)                     |
-| originPlaceholder.removeDelay | `number`                                                                                                         | --            | 可选，用于希望源占位符在拖拽之后的延时里再删除，方便做动画，单位为 ms 毫秒                                                                                                                                                  | [源占位符](#源占位符)                     |
+|               参数               |                                                       类型                                                       | 默认值        | 描述                                                                                                                                             | 跳转 Demo                             |
+| :------------------------------: | :--------------------------------------------------------------------------------------------------------------: | :------------ | :----------------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------ |
+|            `dragData`            |                                                      `any`                                                       | --            | 可选，传递给 `DropEvent` 事件的数据。                                                                                                            | [基本用法](#基本用法)                 |
+|           `dragScope`            |                                            `string \| Array<string>`                                             | 'default'     | 可选，限制 drop 的位置，必须匹配对应的 `dropScope`。                                                                                             | [基本用法](#基本用法)                 |
+|         `dragOverClass`          |                                                     `string`                                                     | --            | 可选，拖动时被拖动元素的 CSS 类。                                                                                                                | [拖拽实体元素跟随](#拖拽实体元素跟随) |
+|           `dragHandle`           |                                                     `string`                                                     | --            | 可选，可拖动拖动内容的 CSS 选择器，只有匹配 CSS 选择器的元素才能响应拖动事件。示例：`'.title, .title > *'`, `'#header'`, `'.title *:not(input)'` |                                       |
+|        `dragHandleClass`         |                                                     `string`                                                     | 'drag-handle' | 可选，会给可拖动内容的应用的 CSS 选择器命中的元素添加的 CSS 类名，第一个匹配 CSS 选择器的会被加上该 CSS 类。                                     | [基本用法](#基本用法)                 |
+|            `disabled`            |                                                    `boolean`                                                     | false         | 可选，控制当前元素是否可拖动，false 为可以，true 为不可以。                                                                                      | [基本用法](#基本用法)                 |
+|        `enableDragFollow`        |                                                    `boolean`                                                     | false         | 可选，是否启用实体元素跟随（可以添加更多特效，如阴影等）。                                                                                       | [拖拽实体元素跟随](#拖拽实体元素跟随) |
+|       `dragFollowOptions`        |                                            `{appendToBody?: boolean}`                                            | --            | 可选，用于控制实体拖拽的一些配置。                                                                                                               | [拖拽实体元素跟随](#拖拽实体元素跟随) |
+| `dragFollowOptions.appendToBody` |                                                    `boolean`                                                     | false         | 可选，用于控制实体拖拽的克隆元素插入的位置。默认 false 会插入到源元素父元素所有子的最后，设置为 true 会附着到。见说明 1                          | [拖拽实体元素跟随](#拖拽实体元素跟随) |
+|       `originPlaceholder`        | `{show?: boolean; tag?: string; style?: {cssProperties: string]: string}; text?: string; removeDelay?: number;}` | --            | 可选，设置源占位符号，用于被拖拽元素原始位置占位。                                                                                               | [源占位符](#源占位符)                 |
+|     `originPlaceholder.show`     |                                                    `boolean`                                                     | true          | 可选，是否显示，默认 originPlaceholder 有 Input 则显示，特殊情况可以关闭。                                                                       |
+|     `originPlaceholder.tag`      |                                                     `string`                                                     | 'div'         | 可选，使用 tag 名，默认 originPlaceholder 使用 'div'，特殊情况可以置换。                                                                         |
+|    `originPlaceholder.style`     |                                                     `Object`                                                     | --            | 可选，传 style 对象，key 为样式属性，value 为样式值。                                                                                            | [源占位符](#源占位符)                 |
+|     `originPlaceholder.text`     |                                                     `string`                                                     | --            | 可选，placeholder 内的文字。                                                                                                                     | [源占位符](#源占位符)                 |
+| `originPlaceholder.removeDelay`  |                                                     `number`                                                     | --            | 可选，用于希望源占位符在拖拽之后的延时里再删除，方便做动画，单位为 ms 毫秒。                                                                     | [源占位符](#源占位符)                 |
 
 说明 1：dragFollowOptions 的 appendToBody 的使用场景：当拖拽离开后源位置的父对象会被销毁的话，需要把克隆体附着到 body 上防止被销毁。默认会通过复制样式保证克隆到 body 的实体的样式是正确的，但部分深度依赖 DOM 节点位置的样式和属性可能会失败，需要手动调整部分样式。
 
 ##### dDraggable 事件
 
-| 事件           | 类型                      | 描述                      | 跳转 Demo                    |
-| :------------- | :------------------------ | :------------------------ | :--------------------------- |
+| 事件           | 类型                      | 描述                      | 跳转 Demo             |
+| :------------- | :------------------------ | :------------------------ | :-------------------- |
 | dragStartEvent | `EventEmitter<DragEvent>` | 开始拖动的 DragStart 事件 | [基本用法](#基本用法) |
 | dragEndEvent   | `EventEmitter<DragEvent>` | 拖动结束的 DragEnd 事件   | [基本用法](#基本用法) |
 | dropEndEvent   | `EventEmitter<DragEvent>` | 放置结束的 Drop 事件      | [基本用法](#基本用法) |
@@ -2692,9 +2681,9 @@ Drag DOM Events 详情: [DragEvent](https://developer.mozilla.org/en-US/docs/Web
 
 ##### dDraggableBatchDrag 属性
 
-| 名字                                | 类型                      | 默认值             | 描述                                                                                           | 跳转 Demo                            |
-| :---------------------------------- | :------------------------ | :----------------- | :--------------------------------------------------------------------------------------------- | :----------------------------------- |
-| batchDragGroup \| batchDrag                      | `string`                  | 'default'          | 可选，批量拖拽分组组名，不同组名                                                               |
+| 名字                                | 类型                      | 默认值             | 描述                                                                                           | 跳转 Demo             |
+| :---------------------------------- | :------------------------ | :----------------- | :--------------------------------------------------------------------------------------------- | :-------------------- |
+| batchDragGroup \| batchDrag         | `string`                  | 'default'          | 可选，批量拖拽分组组名，不同组名                                                               |
 | batchDragActive                     | `boolean`                 | false              | 可选，是否把元素加入到批量拖拽组. 见说明 1。                                                   | [批量拖拽](#批量拖拽) |
 | batchDragLastOneAutoActiveEventKeys | `Array<key in DragEvent>` | ['ctrlKey']        | 可选，通过过拖拽可以激活批量选中的拖拽事件判断。见说明 2。                                     |
 | batchDragStyle                      | `Array<badge\|stack>`     | ['badge', 'stack'] | 可选，批量拖拽的效果，badge 代表右上角有统计数字，stack 代表有堆叠效果，数组里有该字符串则有效 | [批量拖拽](#批量拖拽) |
@@ -2702,35 +2691,35 @@ Drag DOM Events 详情: [DragEvent](https://developer.mozilla.org/en-US/docs/Web
 说明 1： `batchDragActive`为`true`的时候会把元素加入组里，加入顺序为变为 true 的顺序，先加入的在数组前面。第一个元素会确认批量的组名，如果后加入的组名和先加入的组名不一致，则后者无法加入。
 说明 2： `batchDragLastOneAutoActiveEventKeys`的默认值为['ctrlKey'], 即可以通过按住 ctrl 键拖动最后一个元素， 该元素自动加入批量拖拽的组，判断条件是 dragStart 事件里的 ctrlKey 事件为 true。目前仅支持判断 true/false。该参数为数组，可以判断任意一个属性值为 true 则生效，可用于不同操作系统的按键申明。
 
-##### dDraggableBatchDrag事件
+##### dDraggableBatchDrag 事件
 
-| 名字                 | 类型                                     | 描述                                               | 跳转 Demo                            |
-| :------------------- | :--------------------------------------- | :------------------------------------------------- | :----------------------------------- |
+| 名字                 | 类型                                     | 描述                                               | 跳转 Demo             |
+| :------------------- | :--------------------------------------- | :------------------------------------------------- | :-------------------- |
 | batchDragActiveEvent | `EventEmitter<{el: Element, data: any}>` | 通过拖拽把元素加入了批量拖拽组，通知外部选中该元素 | [批量拖拽](#批量拖拽) |
 
 #### dDroppable 指令
 
 ##### dDroppable 参数
 
-| 参数                        | 类型                                           | 默认值                                      | 描述                                                                                                                                                   | 跳转 Demo                                  |
-| :-------------------------- | :--------------------------------------------- | :------------------------------------------ | :----------------------------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------- |
-| dropScope                   | `string \| Array<string>`                      | 'default'                                   | 可选，限制 drop 的区域，对应 dragScope                                                                                                                 | [基本用法](#基本用法)               |
+| 参数                        | 类型                                           | 默认值                                      | 描述                                                                                                                                                   | 跳转 Demo                                       |
+| :-------------------------- | :--------------------------------------------- | :------------------------------------------ | :----------------------------------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------- |
+| dropScope                   | `string \| Array<string>`                      | 'default'                                   | 可选，限制 drop 的区域，对应 dragScope                                                                                                                 | [基本用法](#基本用法)                           |
 | dragOverClass               | `string`                                       | --                                          | 可选，dragover 时 drop 元素上应用的 css                                                                                                                |
-| placeholderStyle            | `Object`                                       | {backgroundColor: '#6A98E3', opacity: '.4'} | 可选，允许 sort 时，用于占位显示                                                                                                                       | [源占位符](#源占位符)        |
+| placeholderStyle            | `Object`                                       | {backgroundColor: '#6A98E3', opacity: '.4'} | 可选，允许 sort 时，用于占位显示                                                                                                                       | [源占位符](#源占位符)                           |
 | placeholderText             | `string`                                       | ''                                          | 可选，允许 sort 时，用于占位显示内部的文字                                                                                                             |
-| allowDropOnItem             | `boolean`                                      | false                                       | 可选，允许 sort 时，用于允许拖动到元素上，方便树形结构的拖动可以成为元素的子节点                                                                       | [多层树状拖拽](#多层树状拖拽) |
-| dragOverItemClass           | `string`                                       | --                                          | 可选，`allowDropOnItem`为`true`时，才有效，用于允许拖动到元素上后，被命中的元素增加样式                                                                | [多层树状拖拽](#多层树状拖拽) |
-| nestingTargetRect           | `{height?: number, width?: number}`            | --                                          | 可选，用于修正有内嵌列表后，父项高度被撑大，此处 height，width 为父项自己的高度（用于纵向拖动），宽度（用于横向拖动）                                  | [多层树状拖拽](#多层树状拖拽) |
-| defaultDropPosition         | `'closest' \| 'before' \| 'after'`             | 'closest'                                   | 可选，设置拖拽到可放置区域但不在列表区域的放置位置，`'closest'` 为就近放下， `'before'`为加到列表头部， `'after'`为加到列表尾部                        | [外部放置位置](#外部放置位置：就近，前面，后面)     |
+| allowDropOnItem             | `boolean`                                      | false                                       | 可选，允许 sort 时，用于允许拖动到元素上，方便树形结构的拖动可以成为元素的子节点                                                                       | [多层树状拖拽](#多层树状拖拽)                   |
+| dragOverItemClass           | `string`                                       | --                                          | 可选，`allowDropOnItem`为`true`时，才有效，用于允许拖动到元素上后，被命中的元素增加样式                                                                | [多层树状拖拽](#多层树状拖拽)                   |
+| nestingTargetRect           | `{height?: number, width?: number}`            | --                                          | 可选，用于修正有内嵌列表后，父项高度被撑大，此处 height，width 为父项自己的高度（用于纵向拖动），宽度（用于横向拖动）                                  | [多层树状拖拽](#多层树状拖拽)                   |
+| defaultDropPosition         | `'closest' \| 'before' \| 'after'`             | 'closest'                                   | 可选，设置拖拽到可放置区域但不在列表区域的放置位置，`'closest'` 为就近放下， `'before'`为加到列表头部， `'after'`为加到列表尾部                        | [外部放置位置](#外部放置位置：就近，前面，后面) |
 | dropSortCountSelector       | `string`                                       | --                                          | 可选，带有 sortable 的容器的情况下排序，计数的内容的选择器名称，可以用于过滤掉不应该被计数的元素                                                       |
 | dropSortVirtualScrollOption | `{totalLength?: number; startIndex?: number;}` | --                                          | 可选，用于虚拟滚动列表中返回正确的 dropIndex 需要接收 totalLength 为列表的真实总长度， startIndex 为当前排序区域显示的第一个 dom 的在列表内的 index 值 |
-| switchWhileCrossEdge        | `boolean`                                      | false                                       | 可选，是否启用越过立即交换位置的算法, 不能与allowDropOnItem一起用，allowDropOnItem为true时，此规则无效                                               |
-| placeholderTag | `string` | 'div' | 可选，占位显示的元素标签 |
+| switchWhileCrossEdge        | `boolean`                                      | false                                       | 可选，是否启用越过立即交换位置的算法, 不能与 allowDropOnItem 一起用，allowDropOnItem 为 true 时，此规则无效                                            |
+| placeholderTag              | `string`                                       | 'div'                                       | 可选，占位显示的元素标签                                                                                                                               |
 
 ##### dDroppable 事件
 
-| 事件           | 类型                                        | 描述                                                                            | 跳转 Demo                    |
-| :------------- | :------------------------------------------ | :------------------------------------------------------------------------------ | :--------------------------- |
+| 事件           | 类型                                        | 描述                                                                            | 跳转 Demo             |
+| :------------- | :------------------------------------------ | :------------------------------------------------------------------------------ | :-------------------- |
 | dragEnterEvent | `EventEmitter<DragEvent>`                   | drag 元素进入的 dragenter 事件                                                  | [基本用法](#基本用法) |
 | dragOverEvent  | `EventEmitter<DragEvent>`                   | drag 元素在 drop 区域上的 dragover 事件                                         | [基本用法](#基本用法) |
 | dragLeaveEvent | `EventEmitter<DragEvent>`                   | drag 元素离开的 dragleave 事件                                                  | [基本用法](#基本用法) |
@@ -2746,7 +2735,7 @@ type DropEvent = {
   dropIndex?: number; // drop的位置在列表的index
   dragFromIndex?: number; // drag元素在原来的列表的index，注意使用虚拟滚动数据无效
   dropOnItem?: boolean; // 是否drop到了元素的上面，搭配allowDropOnItem使用
-}
+};
 ```
 
 #### dSortable 指令
@@ -2764,8 +2753,8 @@ type DropEvent = {
 
 ##### dDropScrollEnhanced 参数
 
-| 名字               | 类型                                                                                            | 默认值   | 描述                                                                                                                       | 跳转 Demo                                                    |
-| :----------------- | :---------------------------------------------------------------------------------------------- | :------- | :------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------- |
+| 名字               | 类型                                                                                            | 默认值   | 描述                                                                                                                       | 跳转 Demo                             |
+| :----------------- | :---------------------------------------------------------------------------------------------- | :------- | :------------------------------------------------------------------------------------------------------------------------- | :------------------------------------ |
 | direction          | [`DropScrollDirection`](#dropscrolldirection)即`'v'\|'h'`                                       | 'v'      | 滚动方向，垂直滚动`'v'`, 水平滚动 `'h'`                                                                                    | [拖拽滚动容器增强](#拖拽滚动容器增强) |
 | responseEdgeWidth  | `string \| ((total: number) => string)`                                                         | '100px'  | 响应自动滚动边缘宽度, 函数的情况传入的为列表容器同个方向相对宽度                                                           | [拖拽滚动容器增强](#拖拽滚动容器增强) |
 | speedFn            | [`DropScrollSpeedFunction`](#dropscrolldirection)                                               | 内置函数 | 速率函数，见备注                                                                                                           |
@@ -2857,9 +2846,11 @@ export type DropScrollTriggerEdge = 'left' | 'right' | 'top' | 'bottom';
  提供 drag 和 drop 时的 hover 样式，注意是`字符串`
 
 ```html
-<div v-dDroppable="{
+<div
+  v-dDroppable="{
   dragOverClass: 'drag-target-border'
-}">
+}"
+>
   <p>Drop items here</p>
 </div>
 ```
@@ -2879,17 +2870,21 @@ export type DropScrollTriggerEdge = 'left' | 'right' | 'top' | 'bottom';
 ```
 
 ```html
-<div v-dDroppable="{
+<div
+  v-dDroppable="{
   dropScope: 'drink',
   dragOverClass: 'drag-target-border',
-}">
+}"
+>
   <p>只有 Drinks 可以放在这个container里</p>
 </div>
 
-<div v-dDroppable="{
+<div
+  v-dDroppable="{
   dropScope: ['drink', 'meal'],
   dragOverClass: 'drag-target-border'
-}">
+}"
+>
   <p>Meal 和 Drinks 可以放在这个container里</p>
 </div>
 ```
@@ -2934,9 +2929,11 @@ Drag 句柄可以指定实际响应 draggable 事件的元素，而不是 dragga
 这个参数必须是一个字符串，实际上是一个 css 选择器
 
 ```html
-<li v-dDraggable="{
+<li
+  v-dDraggable="{
   dragHandle: '.drag-handle'
-}">
+}"
+>
   只有.drag-handle可以响应拖动事件来拖起li
   <div class="pull-right"><i class="drag-handle fa fa-bars fa-lg" aria-hidden="true"></i></div>
 </li>
@@ -2948,10 +2945,15 @@ Drag 句柄可以指定实际响应 draggable 事件的元素，而不是 dragga
 
 ```html
 <ul class="list-group">
-  <li v-dDraggable="{
+  <li
+    v-dDraggable="{
     dragData: item,
     '@dropEndEvent': e => dropEnd(e, i)
-  }" v-for="(item, i) in items;">{{item.name}}</li>
+  }"
+    v-for="(item, i) in items;"
+  >
+    {{item.name}}
+  </li>
 </ul>
 
 <div class="panel panel-default" v-dDroppable="{'@dropEvent': e => onItemDrop(e)}">
@@ -2981,8 +2983,8 @@ setup() {
 
 ###### dDragSync 参数
 
-| 参数      | 类型     | 默认值 | 描述                                                             | 跳转 Demo                                           |
-| :-------- | :------- | :----- | :--------------------------------------------------------------- | :-------------------------------------------------- |
+| 参数      | 类型     | 默认值 | 描述                                                             | 跳转 Demo                                         |
+| :-------- | :------- | :----- | :--------------------------------------------------------------- | :------------------------------------------------ |
 | dDragSync | `string` | ''     | 必选，拖同步的组名，为空或者空字符串的时候无效，不与其他内容同步 | [二维拖拽和组合拖拽预览](#二维拖拽和组合拖拽预览) |
 
 ##### 协同放 dDropSortSync
@@ -2991,8 +2993,8 @@ setup() {
 
 ###### dDropSortSync 参数
 
-| 参数               | 类型        | 默认值 | 描述                                                             | 跳转 Demo                                           |
-| :----------------- | :---------- | :----- | :--------------------------------------------------------------- | :-------------------------------------------------- |
+| 参数               | 类型        | 默认值 | 描述                                                             | 跳转 Demo                                         |
+| :----------------- | :---------- | :----- | :--------------------------------------------------------------- | :------------------------------------------------ |
 | dDropSortSync      | `string`    | ''     | 必选，放同步的组名，为空或者空字符串的时候无效，不与其他内容同步 | [二维拖拽和组合拖拽预览](#二维拖拽和组合拖拽预览) |
 | dDropSyncDirection | `'v'\| 'h'` | 'v'    | 可选，与 dSortable 的方向正交                                    |
 
@@ -3009,8 +3011,8 @@ setup() {
 
 ###### dDragPreview 参数
 
-| 参数                                | 类型                            | 默认值 | 描述                                                                               | 跳转 Demo                                           |
-| :---------------------------------- | :------------------------------ | :----- | :--------------------------------------------------------------------------------- | :-------------------------------------------------- |
+| 参数                                | 类型                            | 默认值 | 描述                                                                               | 跳转 Demo                                         |
+| :---------------------------------- | :------------------------------ | :----- | :--------------------------------------------------------------------------------- | :------------------------------------------------ |
 | dDragPreview                        | `TemplateRef<any>`              | --     | 必选，预览的模板引用                                                               | [二维拖拽和组合拖拽预览](#二维拖拽和组合拖拽预览) |
 | dragPreviewData                     | `any`                           | --     | 可选，自定义数据，将由模板变量获得                                                 |
 | dragPreviewOptions                  | `{ skipBatchPreview : boolean}` | --     | 可选，预览选项                                                                     |
@@ -3030,7 +3032,7 @@ setup() {
 
 可以从节点的引用中恢复 DOM 的克隆对象作为预览
 
-| 参数      | 类型          | 默认值 | 描述                                       | 跳转 Demo |
-| :-------- | :------------ | :----- | :----------------------------------------- | :-------- |
-| domRef    | `HTMLElement` | --     | 必选，否则无意义，克隆节点的 DOM 引用      | [二维拖拽和组合拖拽预览](#二维拖拽和组合拖拽预览)|
-| copyStyle | `boolean`     | true   | 可选，是否克隆节点的时候对节点依次克隆样式 |[二维拖拽和组合拖拽预览](#二维拖拽和组合拖拽预览)|
+| 参数      | 类型          | 默认值 | 描述                                       | 跳转 Demo                                         |
+| :-------- | :------------ | :----- | :----------------------------------------- | :------------------------------------------------ |
+| domRef    | `HTMLElement` | --     | 必选，否则无意义，克隆节点的 DOM 引用      | [二维拖拽和组合拖拽预览](#二维拖拽和组合拖拽预览) |
+| copyStyle | `boolean`     | true   | 可选，是否克隆节点的时候对节点依次克隆样式 | [二维拖拽和组合拖拽预览](#二维拖拽和组合拖拽预览) |
diff --git a/packages/devui-vue/docs/components/dragdrop/index.md b/packages/devui-vue/docs/components/dragdrop/index.md
index 4a96286beb..f501deb2ae 100644
--- a/packages/devui-vue/docs/components/dragdrop/index.md
+++ b/packages/devui-vue/docs/components/dragdrop/index.md
@@ -8,17 +8,20 @@
 
 ### Sortable 基本用法
 
-:::demo 容器内拖拽排序。
+容器内拖拽排序。
+
+:::demo
 
 ```vue
 <template>
-  <div class="card-container"
+  <div
+    class="card-container"
     v-d-sortable="{
       list: list,
       drop: onDrop,
     }"
   >
-    <div class="card-item" v-for="item in list" :key="item.id" >
+    <div class="card-item" v-for="item in list" :key="item.id">
       <h2 class="card-title">{{ item.title }}</h2>
       <span class="card-description">{{ item.des }}</span>
     </div>
@@ -26,7 +29,7 @@
 </template>
 
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
@@ -48,44 +51,44 @@ export default defineComponent({
     return {
       list,
       onDrop,
-      msg: 'DragDrop 拖拽 组件文档示例'
-    }
-  }
-})
+      msg: 'DragDrop 拖拽 组件文档示例',
+    };
+  },
+});
 </script>
 
 <style>
-  div.card-container {
-    display: flex;
-    flex-wrap: wrap;
-    width: 100%;
-  }
-
-  .card-item {
-    width: 200px;
-    height: 100px;
-    margin: 4px;
-    padding: 12px 20px;
-    background-color: var(--devui-global-bg, #f3f6f8);
-    border: 1px solid transparent;
-    border-radius: 4px;
-    cursor: grab;
-  }
-
-  .card-item h2 {
-    margin: 0;
-    padding: 0;
-    line-height: 1.5;
-    border: none; 
-  }
-
-  .card-item .card-description {
-    margin-top: 8px;
-  }
-
-  .card-item.devui-drag-item {
-    border: 1px solid var(--devui-primary, #5e7ce0);
-  }
+div.card-container {
+  display: flex;
+  flex-wrap: wrap;
+  width: 100%;
+}
+
+.card-item {
+  width: 200px;
+  height: 100px;
+  margin: 4px;
+  padding: 12px 20px;
+  background-color: var(--devui-global-bg, #f3f6f8);
+  border: 1px solid transparent;
+  border-radius: 4px;
+  cursor: grab;
+}
+
+.card-item h2 {
+  margin: 0;
+  padding: 0;
+  line-height: 1.5;
+  border: none;
+}
+
+.card-item .card-description {
+  margin-top: 8px;
+}
+
+.card-item.devui-drag-item {
+  border: 1px solid var(--devui-primary, #5e7ce0);
+}
 </style>
 ```
 
@@ -93,19 +96,22 @@ export default defineComponent({
 
 ### Sortable 指定可拖拽区域
 
-:::demo 容器内拖拽排序指定拖拽元素。
+容器内拖拽排序指定拖拽元素。
+
+:::demo
 
 ```vue
 <template>
-  <div class="list-container"
+  <div
+    class="list-container"
     v-d-sortable="{
       list: list,
       handle: '.drag-handle',
       drop: onDrop,
-      dragClass: 'my-list-drag-item'
+      dragClass: 'my-list-drag-item',
     }"
   >
-    <div class="list-item" v-for="item in list" :key="item.id" >
+    <div class="list-item" v-for="item in list" :key="item.id">
       <i class="icon icon-drag drag-handle"></i>
       <d-input v-model="item.value" :placeholder="item.placeholder"></d-input>
     </div>
@@ -114,7 +120,7 @@ export default defineComponent({
 </template>
 
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
@@ -133,52 +139,52 @@ export default defineComponent({
 
     const onSubmit = () => {
       console.log(list.value);
-    }
+    };
 
     return {
       list,
       onDrop,
       onSubmit,
-      msg: 'Dragdrop 拖拽 组件文档示例'
-    }
-  }
-})
+      msg: 'Dragdrop 拖拽 组件文档示例',
+    };
+  },
+});
 </script>
 
 <style>
-  .list-container {
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-  }
-
-  .list-item {
-    display: flex;
-    align-items: center;
-    width: 100%;
-    height: 40px;
-    margin: 4px 0;
-    padding: 4px 8px;
-    background-color: var(--devui-global-bg, #f3f6f8);
-    border: 1px solid transparent;
-    border-radius: 4px;
-  }
-
-  .list-item .drag-handle {
-    cursor: grab;
-  }
-
-  .list-item > i {
-    margin-right: 4px;
-  }
-
-  .list-item.my-list-drag-item {
-    border: 1px solid var(--devui-primary, #5e7ce0);
-  }
-
-  .submit-btn {
-    margin-top: 8px;
-  }
+.list-container {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+
+.list-item {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 40px;
+  margin: 4px 0;
+  padding: 4px 8px;
+  background-color: var(--devui-global-bg, #f3f6f8);
+  border: 1px solid transparent;
+  border-radius: 4px;
+}
+
+.list-item .drag-handle {
+  cursor: grab;
+}
+
+.list-item > i {
+  margin-right: 4px;
+}
+
+.list-item.my-list-drag-item {
+  border: 1px solid var(--devui-primary, #5e7ce0);
+}
+
+.submit-btn {
+  margin-top: 8px;
+}
 </style>
 ```
 
@@ -186,22 +192,22 @@ export default defineComponent({
 
 ### Sortable 参数
 
-| 参数      | 类型                      | 默认      | 说明                                             | 跳转 Demo             |
-| --------- | ------------------------- | --------- | ------------------------------------------------ | --------------------- |
-| list  | any                       | --        | 可选，排序绑定的数据（拖拽排序后将自动变更）                 | [Sortable-基本用法](#sortable-基本用法) |
-| handle | string | -- | 可选，限制可拖拽的元素，注意这里为为css选择器string | [Sortable-指定可拖拽区域](#sortable-指定可拖拽区域) |
-| dragClass | string | 'devui-drag-item' | 可选，拖拽中元素附加的class | [Sortable-指定可拖拽区域](#sortable-指定可拖拽区域) |
+| 参数      | 类型   | 默认              | 说明                                                   | 跳转 Demo                                           |
+| --------- | ------ | ----------------- | ------------------------------------------------------ | --------------------------------------------------- |
+| list      | any    | --                | 可选，排序绑定的数据（拖拽排序后将自动变更）           | [Sortable-基本用法](#sortable-基本用法)             |
+| handle    | string | --                | 可选，限制可拖拽的元素，注意这里为为 css 选择器 string | [Sortable-指定可拖拽区域](#sortable-指定可拖拽区域) |
+| dragClass | string | 'devui-drag-item' | 可选，拖拽中元素附加的 class                           | [Sortable-指定可拖拽区域](#sortable-指定可拖拽区域) |
 
 ### Sortable 事件
 
-| 事件 | 类型 | 说明 | 跳转 Demo |
-| ---- | ---- | ---- | --------- |
-|   dragStart   |   EventEmitter\<DragEvent\>   |   开始拖动的 DragStart 事件   |      [Sortable-基本用法](#sortable-基本用法)     |
-|   dragEnd   |   EventEmitter\<DragEvent\>   |   拖动结束的 DragEnd 事件   |      [Sortable-基本用法](#sortable-基本用法)     |
-|   dragEnter   |   EventEmitter\<DragEvent\>   |   drag 元素进入的 dragenter 事件   |     [Sortable-基本用法](#sortable-基本用法)      |
-|   dragOver   |   EventEmitter\<DragEvent\>   |   drag 元素在 drop 区域上的 dragover 事件   |     [Sortable-基本用法](#sortable-基本用法)      |
-|   dragLeave   |   EventEmitter\<DragEvent\>   |   drag 元素离开的 dragleave 事件   |     [Sortable-基本用法](#sortable-基本用法)      |
-|   drop   |   EventEmitter\<DropEvent\>   |   放置一个元素, 接收的事件，其中 nativeEvent 表示原生的 drop 事件，其他见定义注释   |      [Sortable-基本用法](#sortable-基本用法)     |
+| 事件      | 类型                      | 说明                                                                            | 跳转 Demo                               |
+| --------- | ------------------------- | ------------------------------------------------------------------------------- | --------------------------------------- |
+| dragStart | EventEmitter\<DragEvent\> | 开始拖动的 DragStart 事件                                                       | [Sortable-基本用法](#sortable-基本用法) |
+| dragEnd   | EventEmitter\<DragEvent\> | 拖动结束的 DragEnd 事件                                                         | [Sortable-基本用法](#sortable-基本用法) |
+| dragEnter | EventEmitter\<DragEvent\> | drag 元素进入的 dragenter 事件                                                  | [Sortable-基本用法](#sortable-基本用法) |
+| dragOver  | EventEmitter\<DragEvent\> | drag 元素在 drop 区域上的 dragover 事件                                         | [Sortable-基本用法](#sortable-基本用法) |
+| dragLeave | EventEmitter\<DragEvent\> | drag 元素离开的 dragleave 事件                                                  | [Sortable-基本用法](#sortable-基本用法) |
+| drop      | EventEmitter\<DropEvent\> | 放置一个元素, 接收的事件，其中 nativeEvent 表示原生的 drop 事件，其他见定义注释 | [Sortable-基本用法](#sortable-基本用法) |
 
 ### Sortable 类型定义
 
@@ -209,9 +215,9 @@ export default defineComponent({
 
 ```ts
 type DropEvent = {
-  event: DragEvent, // 原生drag事件
-  list: any, // 当前绑定的list（与传入list为同一对象）
-  fromIndex: number,  // 拖拽开始的元素index
-  targetIndex: number // drop到的元素的index
-}
+  event: DragEvent; // 原生drag事件
+  list: any; // 当前绑定的list（与传入list为同一对象）
+  fromIndex: number; // 拖拽开始的元素index
+  targetIndex: number; // drop到的元素的index
+};
 ```
diff --git a/packages/devui-vue/docs/components/drawer/index.md b/packages/devui-vue/docs/components/drawer/index.md
index e4d506aa42..90df037d2f 100644
--- a/packages/devui-vue/docs/components/drawer/index.md
+++ b/packages/devui-vue/docs/components/drawer/index.md
@@ -2,15 +2,21 @@
 
 屏幕边缘滑出的浮层面板组件。
 
-#### 何时使用
+:::tip 何时使用
 
 1. 抽屉从父窗体边缘滑入，覆盖住部分父窗体内容。用户在抽屉内操作时不必离开当前任务，操作完成后，可以平滑地回到到原任务。
 2. 当需要一个附加的面板来控制父窗体内容，这个面板在需要时呼出。比如，控制界面展示样式，往界面中添加内容。
 3. 当需要在当前任务流中插入临时任务，创建或预览附加内容。比如展示协议条款，创建子对象。
 
+:::
+
+## 用法
+
 ### 基本用法
 
-:::demo 默认从右侧滑出，宽度为`300px`。
+默认从右侧滑出，宽度为`300px`。
+
+:::demo
 
 ```vue
 <template>
@@ -35,7 +41,9 @@ export default defineComponent({
 
 ### 左侧弹出
 
-:::demo 通过`position`设置左侧滑出。
+通过`position`设置左侧滑出。
+
+:::demo
 
 ```vue
 <template>
@@ -60,7 +68,9 @@ export default defineComponent({
 
 ### 背景滚动
 
-:::demo drawer 滑出之后，默认背景滚动会被锁定，可通过`lock-scroll`设置为`false`来解锁。
+Drawer 滑出之后，默认背景滚动会被锁定，可通过`lock-scroll`设置为`false`来解锁。
+
+:::demo
 
 ```vue
 <template>
@@ -86,7 +96,9 @@ export default defineComponent({
 
 ### 关闭前回调
 
-:::demo `before-close`在用户关闭 drawer 时会被调用，可在完成某些异步操作后，通过执行`done`函数关闭。
+`before-close`在用户关闭 drawer 时会被调用，可在完成某些异步操作后，通过执行`done`函数关闭。
+
+:::demo
 
 ```vue
 <template>
@@ -117,7 +129,9 @@ export default defineComponent({
 
 ### 服务方式
 
-:::demo 组件在全局注册了`$drawerService`，可通过服务的方式使用，drawer 的内容通过`content`参数传入。服务返回了用于关闭 drawer 的`close`方法。
+组件在全局注册了`$drawerService`，可通过服务的方式使用，drawer 的内容通过`content`参数传入。服务返回了用于关闭 drawer 的`close`方法。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/dropdown/index.md b/packages/devui-vue/docs/components/dropdown/index.md
index 9dfcccad58..ccf50dcc5e 100644
--- a/packages/devui-vue/docs/components/dropdown/index.md
+++ b/packages/devui-vue/docs/components/dropdown/index.md
@@ -2,13 +2,17 @@
 
 按下弹出列表组件。
 
-#### 何时使用
-
+:::tip 何时使用
 当页面上的操作命令过多时，用此组件可以收纳操作元素。点击或移入触点，会出现一个下拉菜单。可在列表中进行选择，并执行相应的命令。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 组件默认插槽中定义触发元素，`menu`插槽中定义菜单。默认通过点击触发元素展开菜单。
+组件默认插槽中定义触发元素，`menu`插槽中定义菜单。默认通过点击触发元素展开菜单。
+
+:::demo
 
 ```vue
 <template>
@@ -31,7 +35,7 @@ import { defineComponent, ref } from 'vue';
 export default defineComponent({
   setup() {
     return {
-      position: ref(['bottom-start', 'right','top-end']),
+      position: ref(['bottom-start', 'right', 'top-end']),
     };
   },
 });
@@ -62,7 +66,9 @@ export default defineComponent({
 
 ### 触发方式
 
-:::demo 组件默认通过`click`方式展开；`hover`方式为鼠标移上触发元素展开菜单；`manually`方式为手动控制，通过设置`visible`来控制组件是否展开。
+组件默认通过`click`方式展开；`hover`方式为鼠标移上触发元素展开菜单；`manually`方式为手动控制，通过设置`visible`来控制组件是否展开。
+
+:::demo
 
 ```vue
 <template>
@@ -113,7 +119,9 @@ export default defineComponent({
 
 ### 可关闭区域
 
-:::demo 通过`close-scope`参数设置点击关闭区域，默认值为`all`表示点击菜单内外都关闭，`blank`点击非菜单空白才关闭，`none`菜单内外均不关闭仅下拉按键可以关闭。
+通过`close-scope`参数设置点击关闭区域，默认值为`all`表示点击菜单内外都关闭，`blank`点击非菜单空白才关闭，`none`菜单内外均不关闭仅下拉按键可以关闭。
+
+:::demo
 
 ```vue
 <template>
@@ -172,7 +180,7 @@ export default defineComponent({
           </li>
           <template #menu>
             <ul class="list-menu">
-              <d-dropdown :position="position" :offset="0" >
+              <d-dropdown :position="position" :offset="0">
                 <li class="menu-item">
                   Item 1-1
                   <i class="icon icon-chevron-right"></i>
@@ -261,14 +269,14 @@ export default defineComponent({
 | visible                   | `boolean`                                   | false      | 可选，可以显式指定 dropdown 是否打开                                                                                         | [触发方式](#触发方式)     |
 | trigger                   | [TriggerType](#triggertype)                 | click      | 可选，dropdown 触发方式, click 为点、hover 为悬停、manually 为完全手动控制                                                   | [触发方式](#触发方式)     |
 | close-scope               | [CloseScopeArea](#closescopearea)           | all        | 可选，点击关闭区域，blank 点击非菜单空白关闭, all 点击菜单内外关闭，none 仅触发元素关闭                                      | [可关闭区域](#可关闭区域) |
-| position                  | [Placement[]](#placement)                   | ['bottom'] | 可选，展开位置，按照顺序自动选择位置                                                      | [基本用法](#基本用法)     |
+| position                  | [Placement[]](#placement)                   | ['bottom'] | 可选，展开位置，按照顺序自动选择位置                                                                                         | [基本用法](#基本用法)     |
 | offset                    | `number` \| [OffsetOptions](#offsetoptions) | 4          | 可选，指定与触发元素的间距                                                                                                   | [多级菜单](#多级菜单)     |
 | shift-offset              | `number`                                    | --         | 可选，当设置该参数时，表示启用贴边功能，当指定的 position 放不下时，选择最近的视图边界对齐，此参数可设置相对视图边界的偏移量 |
 | close-on-mouse-leave-menu | `boolean`                                   | false      | 可选，是否进入菜单后离开菜单的时候关闭菜单                                                                                   |
 | show-animation            | `boolean`                                   | true       | 可选，控制是否显示动画                                                                                                       |
 | overlay-class             | `string`                                    | --         | 可选，自定义 overlay 的样式                                                                                                  |
 | destroy-on-hide           | `boolean`                                   | true       | 可选，是否在关闭 dropdown 时将其销毁                                                                                         |
-| teleport          | `string \| HTMLElement`                            | 'body' | 可选，挂载节点，等同于 Teleport 组件的[to 属性](https://cn.vuejs.org/api/built-in-components.html#teleport) |
+| teleport                  | `string \| HTMLElement`                     | 'body'     | 可选，挂载节点，等同于 Teleport 组件的[to 属性](https://cn.vuejs.org/api/built-in-components.html#teleport)                  |
 
 ### Dropdown 事件
 
diff --git a/packages/devui-vue/docs/components/editor-md/checkbox.vue b/packages/devui-vue/docs/components/editor-md/checkbox.vue
deleted file mode 100644
index 7da94700f5..0000000000
--- a/packages/devui-vue/docs/components/editor-md/checkbox.vue
+++ /dev/null
@@ -1,48 +0,0 @@
-<template>
-  <d-editor-md
-    v-model="content"
-    :md-rules="mdRules"
-    base-url="https://test-base-url"
-    @content-change="valueChange"
-    @checked-change="onCheckedEvent"
-  />
-  <!-- <d-editor-md
-    v-model="content"
-    :md-rules="mdRules"
-    :md-plugins="plugins"
-    base-url="https://test-base-url"
-    @content-change="valueChange"
-    @checked-change="onCheckedEvent"
-  /> -->
-</template>
-
-<script setup lang="ts">
-import { reactive, ref } from 'vue';
-// import { checkbox } from 'vue-devui/editor-md'; // demo无法进行import，使用时请放开注释
-
-const content = ref('[x] checked \n[ ] unchecked // demo无法进行import，使用时请放开代码中注释');
-const mdRules = reactive({
-  linkify: {
-    fuzzyLink: false,
-  },
-});
-
-const valueChange = (val) => {
-  console.log(val);
-};
-
-const plugins = reactive([
-  {
-    // plugin: checkbox,
-    opts: {
-      idPrefix: 'devui',
-      disable: false,
-    },
-  },
-]);
-
-const onCheckedEvent = (val) => {
-  console.log('demo', val);
-  content.value = val;
-};
-</script>
diff --git a/packages/devui-vue/docs/components/editor-md/index.md b/packages/devui-vue/docs/components/editor-md/index.md
index b4f9cf660e..3eda69ecb1 100644
--- a/packages/devui-vue/docs/components/editor-md/index.md
+++ b/packages/devui-vue/docs/components/editor-md/index.md
@@ -1,13 +1,23 @@
 # Markdown MD 编辑器
 
+## 用法
+
 ### 基本用法
 
-:::demo `v-model`双向绑定输入容器内的值；当内容发生变化时，出发`content-change`事件，返回当前内容。
+`v-model`双向绑定输入容器内的值；当内容发生变化时，出发`content-change`事件，返回当前内容。
+
+:::demo
 
 ```vue
 <template>
   <input v-model="content" />
-  <d-editor-md v-model="content" :md-rules="mdRules" base-url="https://test-base-url" @content-change="valueChange" @preview-content-change="previewChange"></d-editor-md>
+  <d-editor-md
+    v-model="content"
+    :md-rules="mdRules"
+    base-url="https://test-base-url"
+    @content-change="valueChange"
+    @preview-content-change="previewChange"
+  ></d-editor-md>
 </template>
 
 <script>
@@ -40,7 +50,9 @@ export default defineComponent({
 
 ### 自定义渲染
 
-:::demo 自定义从 md 到 html 的渲染规则，也可自定义XSS过滤规则，放开指定标签。
+自定义从 md 到 html 的渲染规则，也可自定义 XSS 过滤规则，放开指定标签。
+
+:::demo
 
 ```vue
 <template>
@@ -61,8 +73,8 @@ export default defineComponent({
       {
         key: 'input',
         value: null, // value值为null，则对应标签不会被渲染
-      }
-    ])
+      },
+    ]);
     const customRendererRules = ref([
       {
         key: 'link_open',
@@ -88,11 +100,14 @@ export default defineComponent({
 });
 </script>
 ```
+
 :::
 
 ### 自定义工具栏
 
-:::demo 自定义编辑器的工具栏
+自定义编辑器的工具栏。
+
+:::demo
 
 ```vue
 <template>
@@ -105,7 +120,8 @@ import { defineComponent, ref } from 'vue';
 export default defineComponent({
   setup() {
     const content = ref('');
-    const toolbarConfig = ['add',
+    const toolbarConfig = [
+      'add',
       ['undo', 'redo'],
       ['h1', 'h2', 'bold', 'italic', 'strike', 'underline', 'color', 'font'],
       ['ul', 'ol', 'checklist', 'code', 'link', 'image', 'table'],
@@ -139,7 +155,7 @@ export default defineComponent({
         handler: () => {
           console.log('覆盖原有工具栏功能事件');
         },
-      }
+      },
     };
     return { content, toolbarConfig, customToolbars };
   },
@@ -151,7 +167,9 @@ export default defineComponent({
 
 ### 纯渲染模式
 
-:::demo 使用 MDRender 进行单独渲染
+使用 MDRender 进行单独渲染。
+
+:::demo
 
 ```vue
 <template>
@@ -180,7 +198,9 @@ export default defineComponent({
 
 ### 单列渲染模式
 
-:::demo 通过 mode 控制不同的显示模式
+通过 mode 控制不同的显示模式。
+
+:::demo
 
 ```vue
 <template>
@@ -230,7 +250,9 @@ export default defineComponent({
 
 ### 配置图片文件上传
 
-:::demo 设置 imageUploadToServer 后，编辑器对粘贴操作也将进行监听，若有图片也将触发 imageUpload 事件。
+设置 imageUploadToServer 后，编辑器对粘贴操作也将进行监听，若有图片也将触发 imageUpload 事件。
+
+:::demo
 
 ```vue
 <template>
@@ -299,21 +321,72 @@ export default defineComponent({
 
 ### checkbox 渲染
 
-:::demo 通过配置md-plugins checkbox插件，进行checkbox渲染于checked变更响应。
+通过配置 md-plugins checkbox 插件，进行 checkbox 渲染于 checked 变更响应。
+
+:::demo
+
+```vue
+<template>
+  <d-editor-md
+    v-model="content"
+    :md-rules="mdRules"
+    base-url="https://test-base-url"
+    @content-change="valueChange"
+    @checked-change="onCheckedEvent"
+  />
+  <!-- <d-editor-md
+    v-model="content"
+    :md-rules="mdRules"
+    :md-plugins="plugins"
+    base-url="https://test-base-url"
+    @content-change="valueChange"
+    @checked-change="onCheckedEvent"
+  /> -->
+</template>
+
+<script setup lang="ts">
+import { reactive, ref } from 'vue';
+// import { checkbox } from 'vue-devui/editor-md'; // demo无法进行import，使用时请放开注释
+
+const content = ref('[x] checked \n[ ] unchecked // demo无法进行import，使用时请放开代码中注释');
+const mdRules = reactive({
+  linkify: {
+    fuzzyLink: false,
+  },
+});
+
+const valueChange = (val) => {
+  console.log(val);
+};
+
+const plugins = reactive([
+  {
+    // plugin: checkbox,
+    opts: {
+      idPrefix: 'devui',
+      disable: false,
+    },
+  },
+]);
+
+const onCheckedEvent = (val) => {
+  console.log('demo', val);
+  content.value = val;
+};
+</script>
+```
 
-editor-md/checkbox
 :::
 
 ### 数学公式 渲染
 
-:::demo 通过配置md-plugins katex插件，进行数学公式渲染。
+通过配置 md-plugins katex 插件，进行数学公式渲染。
+
+:::demo
 
 ```vue
 <template>
-  <d-editor-md
-    v-model="content"
-  >
-  </d-editor-md>
+  <d-editor-md v-model="content"> </d-editor-md>
   <!-- <d-editor-md
     v-model="content"
     :md-plugins="plugins"
@@ -331,9 +404,11 @@ export default defineComponent({
 $\\sqrt{3x-1}+(1+x)^2$  // DEMO无法进行import，使用时请放开代码中注释
     `);
 
-    const mdPlugins = [{
-      // plugin: mk
-    }];
+    const mdPlugins = [
+      {
+        // plugin: mk
+      },
+    ];
 
     return { content, mdPlugins };
   },
@@ -341,7 +416,7 @@ $\\sqrt{3x-1}+(1+x)^2$  // DEMO无法进行import，使用时请放开代码中
 </script>
 
 <style>
-@import 'katex/dist/katex.min.css';  /* 请首先安装 katex 依赖 */
+@import 'katex/dist/katex.min.css'; /* 请首先安装 katex 依赖 */
 </style>
 ```
 
@@ -349,14 +424,13 @@ $\\sqrt{3x-1}+(1+x)^2$  // DEMO无法进行import，使用时请放开代码中
 
 ### PlantUML 渲染
 
-:::demo 通过配置md-plugins plantuml插件，进行plantuml图渲染。
+通过配置 md-plugins plantuml 插件，进行 plantuml 图渲染。
+
+:::demo
 
 ```vue
 <template>
-  <d-editor-md
-    v-model="content"
-  >
-  </d-editor-md>
+  <d-editor-md v-model="content"> </d-editor-md>
   <!-- <d-editor-md
     v-model="content"
     :md-plugins="plugins"
@@ -379,10 +453,12 @@ Alice -> "Bob()" : Hello
 Long --> "Bob()" : ok
 @enduml`);
 
-    const mdPlugins = [{
-      // plugin: PlantUml,
-      // opts: {server: 'https://www/plantuml.com/plantuml'} // 自定义server可参考plantuml官方文档进行搭建
-    }];
+    const mdPlugins = [
+      {
+        // plugin: PlantUml,
+        // opts: {server: 'https://www/plantuml.com/plantuml'} // 自定义server可参考plantuml官方文档进行搭建
+      },
+    ];
 
     return { content, mdPlugins };
   },
@@ -392,9 +468,9 @@ Long --> "Bob()" : ok
 
 :::
 
-### emoji渲染
+### emoji 渲染
 
-通过配置`md-plugins` emoji插件，进行emoji表情渲染。具体使用方式参考示例代码。
+通过配置`md-plugins` emoji 插件，进行 emoji 表情渲染。具体使用方式参考示例代码。
 
 :::demo
 
@@ -404,21 +480,20 @@ Long --> "Bob()" : ok
 </template>
 
 <script>
-import { defineComponent,ref } from 'vue';
+import { defineComponent, ref } from 'vue';
 // import { full as emoji } from 'markdown-it-emoji'; // 请首先安装 markdown-it-emoji 依赖
 
 export default defineComponent({
-  setup(){
+  setup() {
     const content = ref(':joy:');
     const plugins = [];
     /* const plugins = [{
       plugin: emoji,
     }]; */
 
-    return {content,plugins}
-  }
-})
-
+    return { content, plugins };
+  },
+});
 </script>
 ```
 
@@ -426,7 +501,9 @@ export default defineComponent({
 
 ### 配置快速提示
 
-:::demo 设置 hintConfig 后，可用于支持@选择用户等场景。
+设置 hintConfig 后，可用于支持@选择用户等场景。
+
+:::demo
 
 ```vue
 <template>
@@ -439,7 +516,7 @@ export default defineComponent({
   >
     <template #hintTemplate>
       <ul class="list-menu" v-if="hintList && hintList.length">
-        <li class="menu-item" v-for="(item, index) of hintList" @click="hintItemClick(item)">{{ `${item.itemText}`}}</li>
+        <li class="menu-item" v-for="(item, index) of hintList" @click="hintItemClick(item)">{{ `${item.itemText}` }}</li>
       </ul>
     </template>
   </d-editor-md>
@@ -466,44 +543,44 @@ export default defineComponent({
 
     const hintConfig = {
       '#': (e) => {
-          const { callback, cursorHint, prefix } = e;
-          const numberList = [
-            {
-              itemText: '00001',
-              insertText: '[00001](#00001)'
-            },
-            {
-              itemText: '00002',
-              insertText: '[00002](#00002)'
-            },
-            {
-              itemText: '00003',
-              insertText: '[00003](#00003)'
-            },
-            {
-              itemText: '00004',
-              insertText: '[00004](#00004)'
-            }
-          ];
-          hintList.value = numberList.filter((item) => item.itemText.indexOf(cursorHint) !== -1);
-          hintCallback.value = callback;
+        const { callback, cursorHint, prefix } = e;
+        const numberList = [
+          {
+            itemText: '00001',
+            insertText: '[00001](#00001)',
+          },
+          {
+            itemText: '00002',
+            insertText: '[00002](#00002)',
+          },
+          {
+            itemText: '00003',
+            insertText: '[00003](#00003)',
+          },
+          {
+            itemText: '00004',
+            insertText: '[00004](#00004)',
+          },
+        ];
+        hintList.value = numberList.filter((item) => item.itemText.indexOf(cursorHint) !== -1);
+        hintCallback.value = callback;
       },
       '@': {
         handler: (e) => {
           const { callback, cursorHint, prefix } = e;
           const userList = [
             {
-              itemText: 'User1'
+              itemText: 'User1',
             },
             {
-              itemText: 'User2'
+              itemText: 'User2',
             },
             {
-              itemText: 'User3'
+              itemText: 'User3',
             },
             {
-              itemText: 'User4'
-            }
+              itemText: 'User4',
+            },
           ];
           hintList.value = userList.filter((item) => item.itemText.indexOf(cursorHint) !== -1);
           hintCallback.value = callback;
@@ -539,9 +616,11 @@ export default defineComponent({
 
 :::
 
-### TOC目录渲染
+### TOC 目录渲染
+
+支持 TOC 目录生成。
 
-:::demo 支持TOC目录生成
+:::demo
 
 ```vue
 <template>
@@ -577,9 +656,11 @@ This is a Level-1 directory.
 
 ### mermaid 渲染
 
-:::demo 支持mermaid流程图、甘特图、时序图等图表渲染
+支持 mermaid 流程图、甘特图、时序图等图表渲染。
 
-```vue
+:::demo
+
+````vue
 <template>
   <d-editor-md v-model="content" :fullscreen-z-index="1000"></d-editor-md>
 </template>
@@ -668,64 +749,42 @@ Bob-->>John: Jolly good!
 });
 </script>
 
-:::
-
-### EditorMd 参数
-
-| 参数名                 | 类型                                      | 默认值   | 说明                                                                                                               |
-| :--------------------- | :---------------------------------------- | :------- | :----------------------------------------------------------------------------------------------------------------- |
-| v-model                | `string`                                  | ''       | 编辑器内容双向绑定                                                                                                 |
-| options                | `object`                                  | {}       | 编辑器初始化时，自定义配置，可参考[CodeMirror Options](https://codemirror.net/doc/manual.html#config)              |
-| base-url               | `string`                                  | --       | 设置渲染到 html 时，为相对 url 添加的 baseUrl                                                                      |
-| custom-parse           | `(html: string) => string`                | --       | 自定义对渲染后的 html 处理，需要接收渲染后的 html，返回自定义处理后的 html                                         |
-| md-rules               | `object`                                  | {}       | 设置 markdown 对字符串的处理方式， 可参考[markdown-it](https://www.npmjs.com/package/markdown-it?activeTab=readme) |
-| md-plugins             | [MdPlugin[]](#mdplugin)                   | --       | 设置 markdown-it 插件 |
-| hintConfig             | [MdHintConfig[]](#hintconfig)             | --       | 设置 快速提示 配置 |
-| mode                   | `'editonly' \| 'readonly' \| 'normal'`    | 'normal' | 只写/只读/双栏显示模式选择，默认 'normal' 双栏模式显示                                                             |
-| custom-renderer-rules  | [ICustomRenderRule[]](#icustomrenderrule) | []       | 自定义 markdown 对节点的渲染方式，每条规则需要指定对应节点 key,并自定义渲染函数                                    |
-| custom-xss-rules       | [ICustomXssRule[]](#icustomxssrule)       | []       | 自定义 xss 对某种 tag 的过滤方式，每条规则需要指定 tag, 并给出需要加入白名单的属性数组                             |
-| placeholder            | `string`                                  | ''       | 编辑器无内容是的提示信息                                                                                           |
-| fullscreen-z-index     | `number`                                  | 10       | 编辑器全屏状态的 z-index                                                                                           |
-| image-upload-to-server | `boolean`                                 | false    | 是否打开图片自定义上传开关（打开后将将监听图片的复制，toolbar 图片功能上传，传出事件回调）                         |
-| editor-container-height| `number`|--|可选，编辑器内容区高度          ||
-| toolbar-config         | `Array(string)`                                   |`[['undo', 'redo'],['h1', 'h2', 'bold', 'italic', 'strike', 'underline', 'color', 'font'],['ul', 'ol', 'checklist', 'code', 'link', 'image', 'table'],'fullscreen']`|展示在toolbar工具栏处的按钮，用[]包起来的表示是同一组，不同组的会有线隔开。也可以自定义，自定义时需要配置参数custom-toolbars         ||
-| custom-toolbars        | {[IToolbarItemConfig](#itoolbaritemconfig)} |--|配置toolbar-config中对应按钮的具体设置 [自定义工具栏](#自定义工具栏) | |
-
-### EditorMd 事件
-
-| 事件名                 | 回调参数                     | 说明                                                               | 跳转 Demo |
-| :--------------------- | :--------------------------- | :----------------------------------------------------------------- | :-------- |
-| after-editor-init      | `Function(instance: object)` | 编辑器初始化事件，返回编辑器对象                                   |           |
-| content-change         | `Function(content: string)`  | 编辑器内容改变事件，返回当前内容                                   |           |
-| preview-content-change | `Function(string)`                 | 预览内容改变时触发，返回对应的html字段                                                 |           |
-| image-upload           | `Function({file, callback})` | 打开图片上传开关后，图片上传事件回调，返回文件内容与 callback 函数 |           |
-| checked-change           | `Function(content: string)` | plugins添加checkbox后，预览checkbox checked状态改变回调 |           |
-
-### MdRender 参数
-
-| 参数名                | 类型                                      | 默认值 | 说明                                                                                                              | 跳转 Demo |
-| :-------------------- | :---------------------------------------- | :----- | :---------------------------------------------------------------------------------------------------------------- | :-------- |
-| base-url              | `string`                                  | --     | 设置渲染到 html 时，为相对 url 添加 baseUrl                                                                       |           |
-| custom-parse          | `(html: string) => string`                | --     | 自定义对渲染后的 html 处理，需要接受渲染后的 html，返回自定义处理后的 html                                        |           |
-| md-rules              | `object`                                  | {}     | 设置 markdown 对字符串的处理方式, 可参考[markdown-it](https://www.npmjs.com/package/markdown-it?activeTab=readme) |           |
-| custom-renderer-rules | [ICustomRenderRule[]](#icustomrenderrule) | []     | 设置 markdown 对字符串的处理方式, 可参考[markdown-it](https://www.npmjs.com/package/markdown-it?activeTab=readme) |           |
-| custom-xss-rules      | [ICustomXssRule[]](#icustomxssrule)       | []     | 自定义 xss 对某种 tag 的过滤方式，每条规则需要指定 tag，并给出需要加入白名单的属性数组                            |           |
-
-### MdRender 事件
-
-| 事件名           | 回调参数           | 说明                                       | 跳转 Demo |
-| :--------------- | :----------------- | :----------------------------------------- | :-------- |
-| md-render-change | `Function(string)` | 内容改变时触发，返回对应 html 渲染结果字段 |           |
-| checked-change   | `Function(content: string)` | plugins添加checkbox后，预览checkbox checked状态改变回调 |           |
-
-#### ICustomRenderRule
-
-```ts
-interface ICustomRenderRule {
-  key: string;
-  value: Function;
-}
-```
+::: ### EditorMd 参数 | 参数名 | 类型 | 默认值 | 说明 | | :--------------------- | :---------------------------------------- | :------- |
+:----------------------------------------------------------------------------------------------------------------- | | v-model | `string` |
+'' | 编辑器内容双向绑定 | | options | `object` | {} | 编辑器初始化时，自定义配置，可参考[CodeMirror
+Options](https://codemirror.net/doc/manual.html#config) | | base-url | `string` | -- | 设置渲染到 html 时，为相对 url 添加的 baseUrl | |
+custom-parse | `(html: string) => string` | -- | 自定义对渲染后的 html 处理，需要接收渲染后的 html，返回自定义处理后的 html | | md-rules |
+`object` | {} | 设置 markdown 对字符串的处理方式， 可参考[markdown-it](https://www.npmjs.com/package/markdown-it?activeTab=readme) | |
+md-plugins | [MdPlugin[]](#mdplugin) | -- | 设置 markdown-it 插件 | | hintConfig | [MdHintConfig[]](#hintconfig) | -- | 设置 快速提示 配置 |
+| mode | `'editonly' \| 'readonly' \| 'normal'` | 'normal' | 只写/只读/双栏显示模式选择，默认 'normal' 双栏模式显示 | |
+custom-renderer-rules | [ICustomRenderRule[]](#icustomrenderrule) | [] | 自定义 markdown 对节点的渲染方式，每条规则需要指定对应节点
+key,并自定义渲染函数 | | custom-xss-rules | [ICustomXssRule[]](#icustomxssrule) | [] | 自定义 xss 对某种 tag 的过滤方式，每条规则需要指定
+tag, 并给出需要加入白名单的属性数组 | | placeholder | `string` | '' | 编辑器无内容是的提示信息 | | fullscreen-z-index | `number` | 10 |
+编辑器全屏状态的 z-index | | image-upload-to-server | `boolean` | false | 是否打开图片自定义上传开关（打开后将将监听图片的复制，toolbar
+图片功能上传，传出事件回调） | | editor-container-height| `number`|--|可选，编辑器内容区高度 || | toolbar-config | `Array(string)`
+|`[['undo', 'redo'],['h1', 'h2', 'bold', 'italic', 'strike', 'underline', 'color', 'font'],['ul', 'ol', 'checklist', 'code', 'link',
+'image',
+'table'],'fullscreen']`|展示在toolbar工具栏处的按钮，用[]包起来的表示是同一组，不同组的会有线隔开。也可以自定义，自定义时需要配置参数custom-toolbars
+|| | custom-toolbars | {[IToolbarItemConfig](#itoolbaritemconfig)} |--|配置toolbar-config中对应按钮的具体设置 [自定义工具栏](#自定义工具栏)
+| | ### EditorMd 事件 | 事件名 | 回调参数 | 说明 | 跳转 Demo | | :--------------------- | :--------------------------- |
+:----------------------------------------------------------------- | :-------- | | after-editor-init | `Function(instance: object)` |
+编辑器初始化事件，返回编辑器对象 | | | content-change | `Function(content: string)` | 编辑器内容改变事件，返回当前内容 | | |
+preview-content-change | `Function(string)` | 预览内容改变时触发，返回对应的html字段 | | | image-upload | `Function({file, callback})` |
+打开图片上传开关后，图片上传事件回调，返回文件内容与 callback 函数 | | | checked-change | `Function(content: string)` |
+plugins添加checkbox后，预览checkbox checked状态改变回调 | | ### MdRender 参数 | 参数名 | 类型 | 默认值 | 说明 | 跳转 Demo | |
+:-------------------- | :---------------------------------------- | :----- |
+:---------------------------------------------------------------------------------------------------------------- | :-------- | | base-url |
+`string` | -- | 设置渲染到 html 时，为相对 url 添加 baseUrl | | | custom-parse | `(html: string) => string` | -- | 自定义对渲染后的 html
+处理，需要接受渲染后的 html，返回自定义处理后的 html | | | md-rules | `object` | {} | 设置 markdown 对字符串的处理方式,
+可参考[markdown-it](https://www.npmjs.com/package/markdown-it?activeTab=readme) | | | custom-renderer-rules |
+[ICustomRenderRule[]](#icustomrenderrule) | [] | 设置 markdown 对字符串的处理方式,
+可参考[markdown-it](https://www.npmjs.com/package/markdown-it?activeTab=readme) | | | custom-xss-rules | [ICustomXssRule[]](#icustomxssrule)
+| [] | 自定义 xss 对某种 tag 的过滤方式，每条规则需要指定 tag，并给出需要加入白名单的属性数组 | | ### MdRender 事件 | 事件名 | 回调参数 |
+说明 | 跳转 Demo | | :--------------- | :----------------- | :----------------------------------------- | :-------- | | md-render-change |
+`Function(string)` | 内容改变时触发，返回对应 html 渲染结果字段 | | | checked-change | `Function(content: string)` |
+plugins添加checkbox后，预览checkbox checked状态改变回调 | | #### ICustomRenderRule ```ts interface ICustomRenderRule { key: string; value:
+Function; }
+````
 
 #### ICustomXssRule
 
@@ -752,13 +811,13 @@ export interface HintConfigItem {
   handler: (obj: { callback: (replaceText: string) => void; cursorHint: string; prefix: string }) => void;
 }
 export interface HintConfig {
-  throttleTime: number;  // 触发提示事件debounceTime(ms)，默认300
-  [key: string]: HintConfigItem;  // key为触发提示前缀配置
+  throttleTime: number; // 触发提示事件debounceTime(ms)，默认300
+  [key: string]: HintConfigItem; // key为触发提示前缀配置
 }
 ```
 
-
 ### IToolbarItemConfig
+
 ```ts
 export interface IToolbarItemConfig {
   id: string;
@@ -773,5 +832,5 @@ export interface IToolbarItemConfig {
   params?: { [key: string]: any };
   handler?(editor?: any, params?: any): void;
 }
-const toolbars = Record<string, IToolbarItemConfig>
+const toolbars = Record<string, IToolbarItemConfig>;
 ```
diff --git a/packages/devui-vue/docs/components/form/index.md b/packages/devui-vue/docs/components/form/index.md
index 4df15edd0b..2eb496d947 100644
--- a/packages/devui-vue/docs/components/form/index.md
+++ b/packages/devui-vue/docs/components/form/index.md
@@ -2,13 +2,17 @@
 
 具有数据收集、校验和提交功能的表单，包含复选框、单选框、输入框、下拉选择框等元素。
 
-#### 何时使用
-
+:::tip 何时使用
 需要进行数据收集、数据校验、数据提交功能时。
+:::
+
+## 用法
 
 ### 基础用法
 
-:::demo 默认提供水平布局，`data`参数用于设置表单数据。
+默认提供水平布局，`data`参数用于设置表单数据。
+
+:::demo
 
 ```vue
 <template>
@@ -84,7 +88,9 @@ export default defineComponent({
 
 ### 表单样式
 
-:::demo 水平排列模式下，`label-size`可以设置`label`的宽度，提供`sm`、`md`、`lg`三种大小，分别对应`80px`、`100px`、`150px`，默认为`md`；`label-align`可以设置`label`的对齐方式，可选值为`start`、`center`、`end`，默认为`start`。
+水平排列模式下，`label-size`可以设置`label`的宽度，提供`sm`、`md`、`lg`三种大小，分别对应`80px`、`100px`、`150px`，默认为`md`；`label-align`可以设置`label`的对齐方式，可选值为`start`、`center`、`end`，默认为`start`。
+
+:::demo
 
 ```vue
 <template>
@@ -202,7 +208,9 @@ export default defineComponent({
 
 ### 垂直排列
 
-:::demo 设置`layout`参数为`vertical`可启用垂直布局，即`label`在输入控件的上方。
+设置`layout`参数为`vertical`可启用垂直布局，即`label`在输入控件的上方。
+
+:::demo
 
 ```vue
 <template>
@@ -272,7 +280,9 @@ export default defineComponent({
 
 ### 多列表单
 
-:::demo 搭配`Grid`栅格布局方案，即可方便的实现多列表单布局效果。
+搭配`Grid`栅格布局方案，即可方便的实现多列表单布局效果。
+
+:::demo
 
 ```vue
 <template>
@@ -355,7 +365,9 @@ export default defineComponent({
 
 ### 尺寸控制
 
-:::demo 通过`size`属性可控制所有控件的尺寸。
+通过`size`属性可控制所有控件的尺寸。
+
+:::demo
 
 ```vue
 <template>
@@ -666,7 +678,7 @@ export default defineComponent({
 | hide-required-mark             | `boolean`                                                 | false              | 可选，是否隐藏所有表单项的必选标记                                                              |                       |
 | style-type                     | [StyleType](#styletype)                                   | 'default'          | 可选，设置表单为灰色表单                                                                        |                       |
 | append-to-body-scroll-strategy | [AppendToBodyScrollStrategy](#appendtobodyscrollstrategy) | 'reposition'       | 可选，消息显示为 popover 时，滚动时 popover 处理策略，默认策略跟随宿主移动；`close`为滚动时关闭 |                       |
-|require-position|`string`|'left'|可选，必填型号的位置，可选值为`left`和`right`||
+| require-position               | `string`                                                  | 'left'             | 可选，必填型号的位置，可选值为`left`和`right`                                                   |                       |
 
 ### Form 事件
 
diff --git a/packages/devui-vue/docs/components/fullscreen/index.md b/packages/devui-vue/docs/components/fullscreen/index.md
index 4ad2127d01..358aae8c80 100644
--- a/packages/devui-vue/docs/components/fullscreen/index.md
+++ b/packages/devui-vue/docs/components/fullscreen/index.md
@@ -2,13 +2,17 @@
 
 全屏组件。
 
-#### 何时使用
-
+:::tip 何时使用
 当用户需要将某一区域进行全屏展示时。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 将需要全屏的容器包裹在`<d-fullscreen>`标签里面，通过`v-model`控制全屏状态，传入`true`则启动全屏，设置成`false`则退出全屏，也可以通过按下`ESC`快捷键推出全屏。本例还展示了自定义层级`z-index`的用法。
+将需要全屏的容器包裹在`<d-fullscreen>`标签里面，通过`v-model`控制全屏状态，传入`true`则启动全屏，设置成`false`则退出全屏，也可以通过按下`ESC`快捷键推出全屏。本例还展示了自定义层级`z-index`的用法。
+
+:::demo
 
 ```vue
 <template>
@@ -41,6 +45,7 @@ export default {
   },
 };
 </script>
+
 <style>
 .demo-fullscreen-container {
   margin: 8px;
@@ -52,18 +57,22 @@ export default {
 
 ### 全屏模式
 
-:::demo 通过`mode`设置全屏模式，默认为`normal`普通全屏，全屏之后容器将充满整个浏览器窗口，`mode`设置成`immersive`可以启用沉浸式全屏，让容器充满整个电脑屏幕。<br>不管是普通全屏还是沉浸式全屏，都支持按下快捷键`ESC`退出全屏。
+通过`mode`设置全屏模式，默认为`normal`普通全屏，全屏之后容器将充满整个浏览器窗口，`mode`设置成`immersive`可以启用沉浸式全屏，让容器充满整个电脑屏幕。
+
+不管是普通全屏还是沉浸式全屏，都支持按下快捷键`ESC`退出全屏。
+
+:::demo
 
 ```vue
 <template>
   <d-fullscreen v-model="isOpenNormal" :z-index="20">
-  <div class="demo-fullscreen-container">
+    <div class="demo-fullscreen-container">
       <d-button @click="isOpenNormal = !isOpenNormal">{{ btnContentNormal }}</d-button>
     </div>
   </d-fullscreen>
-  
+
   <d-fullscreen v-model="isOpenImmersive" mode="immersive">
-  <div class="demo-fullscreen-container">
+    <div class="demo-fullscreen-container">
       <d-button @click="isOpenImmersive = !isOpenImmersive">{{ btnContentImmersive }}</d-button>
     </div>
   </d-fullscreen>
@@ -121,4 +130,3 @@ export default {
 | 插槽名  | 说明               | 参数 |
 | :------ | :----------------- | :--- |
 | default | 默认插槽，全屏容器 | --   |
-
diff --git a/packages/devui-vue/docs/components/grid/index.md b/packages/devui-vue/docs/components/grid/index.md
index 6c9661cc62..063620499c 100644
--- a/packages/devui-vue/docs/components/grid/index.md
+++ b/packages/devui-vue/docs/components/grid/index.md
@@ -2,15 +2,17 @@
 
 24 栅格系统。
 
-#### 何时使用
-
+:::tip 何时使用
 需要使用弹性布局时，并且需要适配不同的屏幕时，使用 grid 组件。
+:::
+
+## 用法
 
 ### 基本用法
 
-基础栅格
+基础栅格，用 Row 和 Col 组件，可以创建一个基本的栅格系统，Col 必须放在 Row 里面。
 
-:::demo 使用 Row 和 Col 组件，可以创建一个基本的栅格系统，Col 必须放在 Row 里面。
+:::demo
 
 ```vue
 <template>
@@ -61,9 +63,9 @@
 
 ### 对齐
 
-垂直对齐和水平对齐
+垂直对齐和水平对齐，使用 Row 的 align 属性和 justify 属性子元素垂直对齐和水平对齐。
 
-:::demo 使用 Row 的 align 属性和 justify 属性子元素垂直对齐和水平对齐。
+:::demo
 
 ```vue
 <template>
@@ -130,9 +132,11 @@
 
 ### 子元素的间隔
 
-栅格之间的间隔可以用 Row 的 gutter 属性
+栅格之间的间隔可以用 Row 的 gutter 属性。
+
+`:gutter="10"` 子元素左右间隔为 `5px`；`:gutter="[10, 20]"` 子元素左右间隔为 `5px`，上下间隔为 `10px`；需要适配屏幕宽度的情况，`:gutter="{ xs: 10, sm: 20, md: [20, 10], lg: [30, 20], xl: [40, 30], xxl: [50, 40] }"`。
 
-:::demo :gutter="10" 子元素左右间隔为 5px；:gutter="[10, 20]" 子元素左右间隔为 5px，上下间隔为 10px；需要适配屏幕宽度的情况，:gutter="{ xs: 10, sm: 20, md: [20, 10], lg: [30, 20], xl: [40, 30], xxl: [50, 40] }"
+:::demo
 
 ```vue
 <template>
@@ -225,7 +229,9 @@ Col 的 flex 属性支持 flex 填充。
 
 使用 Col 的 offset、pull 和 push 来使子元素左右偏移。
 
-:::demo 列偏移。使用 offset 可以将列向右侧偏。例如，offset={4} 将元素向右侧偏移了 4 个列（column）的宽度；offset、pull、push 也可以内嵌到。
+使用 offset 可以将列向右侧偏。例如，offset={4} 将元素向右侧偏移了 4 个列（column）的宽度；offset、pull、push 也可以内嵌到。
+
+:::demo
 
 ```vue
 <template>
@@ -249,7 +255,9 @@ Col 的 flex 属性支持 flex 填充。
 
 预设六个响应尺寸：xs sm md lg xl xxl。
 
-:::demo 参照 Bootstrap 的 [响应式设计](https://getbootstrap.com/docs/3.4/css/)。
+参照 Bootstrap 的 [响应式设计](https://getbootstrap.com/docs/3.4/css/)。
+
+:::demo
 
 ```vue
 <template>
@@ -272,7 +280,9 @@ Col 的 flex 属性支持 flex 填充。
 
 列排序。通过使用 order、 push 和 pull 类就可以改变列（column）的顺。
 
-:::demo 参照 Bootstrap 的 [响应式设计](https://getbootstrap.com/docs/3.4/css/)。
+参照 Bootstrap 的 [响应式设计](https://getbootstrap.com/docs/3.4/css/)。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/image-preview/index.md b/packages/devui-vue/docs/components/image-preview/index.md
index 1d29f2cae4..87b1c7da7c 100644
--- a/packages/devui-vue/docs/components/image-preview/index.md
+++ b/packages/devui-vue/docs/components/image-preview/index.md
@@ -2,13 +2,17 @@
 
 预览一张或多张图片的组件。
 
-#### 何时使用
-
+:::tip 何时使用
 需要根据用户传入进行图片预览展示或对容器内图片进行预览时。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 使用 v-d-image-preview 指令，对容器内图片进行预览。
+使用 `v-d-image-preview` 指令，对容器内图片进行预览。
+
+:::demo
 
 ```vue
 <template>
@@ -17,19 +21,16 @@
   </div>
 </template>
 <script>
-import { defineComponent, ref, reactive } from 'vue'
+import { defineComponent, ref, reactive } from 'vue';
 export default defineComponent({
   setup() {
-    const _imageList = [
-      'https://devui.design/components/assets/image1.png',
-      'https://devui.design/components/assets/image3.png'
-    ]
-    const imageList = ref(_imageList)
+    const _imageList = ['https://devui.design/components/assets/image1.png', 'https://devui.design/components/assets/image3.png'];
+    const imageList = ref(_imageList);
     return {
-      imageList
-    }
-  }
-})
+      imageList,
+    };
+  },
+});
 </script>
 ```
 
@@ -37,41 +38,37 @@ export default defineComponent({
 
 ### 自定义开启预览窗口
 
-:::demo 传入 custom 参数,指令会自动注入 open 方法，通过 custom.open 开启预览窗口
+传入 custom 参数，指令会自动注入 open 方法，通过 custom.open 开启预览窗口
+
+:::demo
 
 ```vue
 <template>
-  <div
-    v-d-image-preview="{ custom: image.custom, disableDefault: true }"
-    class="devui-image-preview-demo"
-  >
+  <div v-d-image-preview="{ custom: image.custom, disableDefault: true }" class="devui-image-preview-demo">
     <img v-for="src in imageList" :src="src" :key="src" />
   </div>
   <d-button @click="open" class="btn">自定义</d-button>
 </template>
 <script>
-import { defineComponent, ref, reactive } from 'vue'
+import { defineComponent, ref, reactive } from 'vue';
 export default defineComponent({
   setup() {
-    const _imageList = [
-      'https://devui.design/components/assets/image1.png',
-      'https://devui.design/components/assets/image3.png'
-    ]
-    const imageList = ref(_imageList)
+    const _imageList = ['https://devui.design/components/assets/image1.png', 'https://devui.design/components/assets/image3.png'];
+    const imageList = ref(_imageList);
     const image = reactive({
       custom: {},
-      imageList: _imageList
-    })
+      imageList: _imageList,
+    });
     function open() {
-      image.custom.open()
+      image.custom.open();
     }
     return {
       imageList,
       image,
-      open
-    }
-  }
-})
+      open,
+    };
+  },
+});
 </script>
 ```
 
@@ -79,7 +76,9 @@ export default defineComponent({
 
 ### 设置 zIndex
 
-:::demo 通过设置 zIndex 控制弹出效果的层级，设置 backDropZIndex 控制弹出层背景的层级。可以看到当设置 zIndex 小于 backDropZIndex 时，imagePreview 会显示在背景下方。可以通过 Esc 关闭 imagePreview。
+通过设置 zIndex 控制弹出效果的层级，设置 backDropZIndex 控制弹出层背景的层级。可以看到当设置 zIndex 小于 backDropZIndex 时，imagePreview 会显示在背景下方。可以通过 Esc 关闭 imagePreview。
+
+:::demo
 
 ```vue
 <template>
@@ -99,35 +98,29 @@ export default defineComponent({
     </d-radio-group>
     <span class="text">backDropZIndex: {{ backDropZIndex }}</span>
   </div>
-  <div
-    v-d-image-preview="{ zIndex: Number(zIndex), backDropZIndex: Number(backDropZIndex) }"
-    class="devui-image-preview-demo"
-  >
+  <div v-d-image-preview="{ zIndex: Number(zIndex), backDropZIndex: Number(backDropZIndex) }" class="devui-image-preview-demo">
     <img v-for="src in imageList" :src="src" :key="src" />
   </div>
 </template>
 <script>
-import { defineComponent, ref, reactive } from 'vue'
+import { defineComponent, ref, reactive } from 'vue';
 export default defineComponent({
   setup() {
-    const imageList = ref([
-      'https://devui.design/components/assets/image1.png',
-      'https://devui.design/components/assets/image3.png'
-    ])
-    const zIndexList = ref(['1000', '1050', '1100'])
-    const backDropZIndexList = ref(['900', '1040', '1000'])
-    const zIndex = ref('1050')
-    const backDropZIndex = ref('1040')
+    const imageList = ref(['https://devui.design/components/assets/image1.png', 'https://devui.design/components/assets/image3.png']);
+    const zIndexList = ref(['1000', '1050', '1100']);
+    const backDropZIndexList = ref(['900', '1040', '1000']);
+    const zIndex = ref('1050');
+    const backDropZIndex = ref('1040');
 
     return {
       imageList,
       zIndexList,
       backDropZIndexList,
       zIndex,
-      backDropZIndex
-    }
-  }
-})
+      backDropZIndex,
+    };
+  },
+});
 </script>
 ```
 
@@ -135,11 +128,11 @@ export default defineComponent({
 
 ### ImagePreview 参数
 
-|      参数名      |   类型    | 默认  | 说明                                                          |
-| :------------ | :------- | :--- | :------------------------------------------------------------ |
-|     custom     | `Object`  |  --   | 可选，指令会自动注入 open 方法，通过 custom.open 开启预览窗口 |
-| disable-default | `Boolean` | false | 可选，关闭默认点击触发图片预览方式                            |
-|     z-index     | `Number`  | 1050  | 可选，设置预览时图片的 z-index 值                             |
+| 参数名            | 类型      | 默认  | 说明                                                          |
+| :---------------- | :-------- | :---- | :------------------------------------------------------------ |
+| custom            | `Object`  | --    | 可选，指令会自动注入 open 方法，通过 custom.open 开启预览窗口 |
+| disable-default   | `Boolean` | false | 可选，关闭默认点击触发图片预览方式                            |
+| z-index           | `Number`  | 1050  | 可选，设置预览时图片的 z-index 值                             |
 | back-drop-z-index | `Number`  | 1040  | 可选，设置预览时图片背景的 z-index 值                         |
 
 <style lang="scss">
diff --git a/packages/devui-vue/docs/components/input-number/index.md b/packages/devui-vue/docs/components/input-number/index.md
index 1b6abc4ae2..609bec416d 100644
--- a/packages/devui-vue/docs/components/input-number/index.md
+++ b/packages/devui-vue/docs/components/input-number/index.md
@@ -2,13 +2,17 @@
 
 数字输入框组件。
 
-#### 何时使用
-
+:::tip 何时使用
 当需要获取标准数值时。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 只需要在 d-input-number 元素中使用 `v-model` 绑定变量即可，变量的初始值即为默认值。
+只需要在 d-input-number 元素中使用 `v-model` 绑定变量即可，变量的初始值即为默认值。
+
+:::demo
 
 ```vue
 <template>
@@ -38,7 +42,9 @@ export default defineComponent({
 
 ### 禁用状态
 
-:::demo `disabled` 属性设置为 `true` 即可禁用整个组件。
+`disabled` 属性设置为 `true` 即可禁用整个组件。
+
+:::demo
 
 ```vue
 <template>
@@ -64,7 +70,9 @@ export default defineComponent({
 
 ### 数值范围
 
-:::demo 如果你需要控制数值在某一范围内，可以设置 `min` 属性和 `max` 属性。当给组件设置的初始值大于 `max` 属性值时会自动被重置为 `max`属性值，小于 `min` 属性值时会自动被重置为 `min`属性值。
+如果你需要控制数值在某一范围内，可以设置 `min` 属性和 `max` 属性。当给组件设置的初始值大于 `max` 属性值时会自动被重置为 `max`属性值，小于 `min` 属性值时会自动被重置为 `min`属性值。
+
+:::demo
 
 ```vue
 <template>
@@ -90,7 +98,9 @@ export default defineComponent({
 
 ### 步数
 
-:::demo 设置 `step` 属性可以控制步长。
+设置 `step` 属性可以控制步长。
+
+:::demo
 
 ```vue
 <template>
@@ -116,7 +126,9 @@ export default defineComponent({
 
 ### 精度
 
-:::demo `precision`属性可以控制数值精度。
+`precision`属性可以控制数值精度。
+
+:::demo
 
 ```vue
 <template>
@@ -142,7 +154,9 @@ export default defineComponent({
 
 ### 尺寸
 
-:::demo 提供了 lg、md、sm 三种尺寸的数字输入框，默认尺寸为 md。
+提供了 lg、md、sm 三种尺寸的数字输入框，默认尺寸为 md。
+
+:::demo
 
 ```vue
 <template>
@@ -183,14 +197,16 @@ export default defineComponent({
 
 ### 正则限制
 
-:::demo 允许传入正则或正则字符串限制输入，输入时会优先匹配传入的正则，不输入则不限制。
+允许传入正则或正则字符串限制输入，输入时会优先匹配传入的正则，不输入则不限制。
+
+:::demo
 
 ```vue
 <template>
   <div>
     <div class="space">reg</div>
     <d-input-number v-model="num1" :reg="reg"></d-input-number>
-    
+
     <div class="space">regStr</div>
     <d-input-number v-model="num2" :reg="regStr"></d-input-number>
   </div>
@@ -208,7 +224,7 @@ export default defineComponent({
       num1,
       num2,
       reg,
-      regStr
+      regStr,
     };
   },
 });
@@ -225,7 +241,9 @@ export default defineComponent({
 
 ### 允许空值
 
-:::demo 当 `allowEmpty` 为 `true` 的时候允许输入框的值为空，空值返回为 `null`，传入数据不为 `number` 类型且上一次输入没有值的时候都会返回null。
+当 `allowEmpty` 为 `true` 的时候允许输入框的值为空，空值返回为 `null`，传入数据不为 `number` 类型且上一次输入没有值的时候都会返回 null。
+
+:::demo
 
 ```vue
 <template>
@@ -244,10 +262,10 @@ export default defineComponent({
     };
     return {
       num,
-      onChange
+      onChange,
     };
-  }
-})
+  },
+});
 </script>
 ```
 
@@ -255,19 +273,19 @@ export default defineComponent({
 
 ### InputNumber 参数
 
-| 参数名         | 类型              | 默认值        | 说明                 | 跳转 Demo            |
-|:------------|:----------------|:-----------|:-------------------|:-------------------|
-| v-model     | `number`        | --         | 可选，文本框的值           | [基本用法](#基本用法)      |
-| step        | `number`        | 1          | 可选，步数              | [步数](#步数)          |
-| placeholder | `string`        | --         | 可选，文本框 placeholder | [基本用法](#基本用法)      |
-| max         | `number`        | Infinity   | 可选，输入框的最大值 max     | [数值范围](#数值范围)      |
-| min         | `number`        | -Infinity  | 可选，输入框的最小值 min     | [数值范围](#数值范围)      |
-| disabled    | `boolean`       | false      | 可选，文本框是否被禁用        | [禁用状态](#禁用状态)      |
-| precision   | `number`        | --         | 可选，数值精度            | [精度](#精度)          |
-| size        | [ISize](#isize) | 'md'       | 可选，文本框尺寸           | [尺寸](#尺寸)          |
-| reg         | `RegExp \| string`    |  --   | 可选，用于限制输入的正则或正则字符串 | [正则限制](#正则限制)|
-| allowEmpty	| `boolean \| false`	 |  --   | 可选，是否允许值为空	允许空值 | [允许空值](#允许空值) |
-|show-glow-style|`boolean`|true|可选，是否展示悬浮发光效果||
+| 参数名          | 类型               | 默认值    | 说明                                 | 跳转 Demo             |
+| :-------------- | :----------------- | :-------- | :----------------------------------- | :-------------------- |
+| v-model         | `number`           | --        | 可选，文本框的值                     | [基本用法](#基本用法) |
+| step            | `number`           | 1         | 可选，步数                           | [步数](#步数)         |
+| placeholder     | `string`           | --        | 可选，文本框 placeholder             | [基本用法](#基本用法) |
+| max             | `number`           | Infinity  | 可选，输入框的最大值 max             | [数值范围](#数值范围) |
+| min             | `number`           | -Infinity | 可选，输入框的最小值 min             | [数值范围](#数值范围) |
+| disabled        | `boolean`          | false     | 可选，文本框是否被禁用               | [禁用状态](#禁用状态) |
+| precision       | `number`           | --        | 可选，数值精度                       | [精度](#精度)         |
+| size            | [ISize](#isize)    | 'md'      | 可选，文本框尺寸                     | [尺寸](#尺寸)         |
+| reg             | `RegExp \| string` | --        | 可选，用于限制输入的正则或正则字符串 | [正则限制](#正则限制) |
+| allowEmpty      | `boolean \| false` | --        | 可选，是否允许值为空 允许空值        | [允许空值](#允许空值) |
+| show-glow-style | `boolean`          | true      | 可选，是否展示悬浮发光效果           |                       |
 
 ### InputNumber 事件
 
diff --git a/packages/devui-vue/docs/components/input/index.md b/packages/devui-vue/docs/components/input/index.md
index bd1c14f91f..56bffa90f9 100644
--- a/packages/devui-vue/docs/components/input/index.md
+++ b/packages/devui-vue/docs/components/input/index.md
@@ -2,13 +2,17 @@
 
 文本输入框。
 
-#### 何时使用
-
+:::tip 何时使用
 需要手动输入文字使用。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo `v-model`对输入值做双向绑定，`placeholder`、`autofocus`等原生 input 支持的属性会被自动继承。
+`v-model`对输入值做双向绑定，`placeholder`、`autofocus`等原生 input 支持的属性会被自动继承。
+
+:::demo
 
 ```vue
 <template>
@@ -111,7 +115,9 @@ export default defineComponent({
 
 ### 尺寸
 
-:::demo 支持`sm`、`md`、`lg`三种尺寸，默认为`md`。
+支持`sm`、`md`、`lg`三种尺寸，默认为`md`。
+
+:::demo
 
 ```vue
 <template>
@@ -317,23 +323,23 @@ export default defineComponent({
 
 ### Input 参数
 
-| 参数名         | 类型                    | 默认值 | 说明                                             | 跳转 Demo                         |
-| :------------- | :---------------------- | :----- | :----------------------------------------------- | :-------------------------------- |
-| v-model        | `string`                | ''     | 绑定值                                           | [基本用法](#基本用法)             |
-| placeholder    | `string`                | ''     | 输入框占位文本                                   | [基本用法](#基本用法)             |
-| disabled       | `boolean`               | false  | 可选，文本框是否被禁用                           | [基本用法](#基本用法)             |
-| error          | `boolean`               | false  | 可选，文本框是否出现输入错误                     | [基本用法](#基本用法)             |
-| size           | [InputSize](#inputsize) | 'md'   | 可选，文本框尺寸，有三种选择`'lg'`,`'md'`,`'sm'` | [尺寸](#尺寸)                     |
-| validate-event | `boolean`               | true   | 可选，输入时是否触发表单的校验                   |                                   |
-| prefix         | `string`                | -      | 可选，自定义前缀图标                             | [带图标的输入框](#带图标的输入框) |
-| suffix         | `string`                | -      | 可选，自定义后缀图标                             | [带图标的输入框](#带图标的输入框) |
-| show-password  | `boolean`               | false  | 可选，是否显示为密码框                           |                                   |
-| clearable      | `boolean`               | false  | 可选，是否可清空                                 | [一键清空](#一键清空)             |
-| name           | `string`                | ''     | 等价于原生 input name 属性                       |                                   |
-| readonly       | `boolean`               | false  | 原生 readonly 属性，是否只读                     |                                   |
-| autocomplete   | `string`                | 'off'  | 原生 autocomplete 属性                           |                                   |
-| autofocus      | `boolean`               | false  | 自动获取焦点                                     |                                   |
-|show-glow-style|`boolean`|true|可选，是否显示悬浮发光效果||
+| 参数名          | 类型                    | 默认值 | 说明                                             | 跳转 Demo                         |
+| :-------------- | :---------------------- | :----- | :----------------------------------------------- | :-------------------------------- |
+| v-model         | `string`                | ''     | 绑定值                                           | [基本用法](#基本用法)             |
+| placeholder     | `string`                | ''     | 输入框占位文本                                   | [基本用法](#基本用法)             |
+| disabled        | `boolean`               | false  | 可选，文本框是否被禁用                           | [基本用法](#基本用法)             |
+| error           | `boolean`               | false  | 可选，文本框是否出现输入错误                     | [基本用法](#基本用法)             |
+| size            | [InputSize](#inputsize) | 'md'   | 可选，文本框尺寸，有三种选择`'lg'`,`'md'`,`'sm'` | [尺寸](#尺寸)                     |
+| validate-event  | `boolean`               | true   | 可选，输入时是否触发表单的校验                   |                                   |
+| prefix          | `string`                | -      | 可选，自定义前缀图标                             | [带图标的输入框](#带图标的输入框) |
+| suffix          | `string`                | -      | 可选，自定义后缀图标                             | [带图标的输入框](#带图标的输入框) |
+| show-password   | `boolean`               | false  | 可选，是否显示为密码框                           |                                   |
+| clearable       | `boolean`               | false  | 可选，是否可清空                                 | [一键清空](#一键清空)             |
+| name            | `string`                | ''     | 等价于原生 input name 属性                       |                                   |
+| readonly        | `boolean`               | false  | 原生 readonly 属性，是否只读                     |                                   |
+| autocomplete    | `string`                | 'off'  | 原生 autocomplete 属性                           |                                   |
+| autofocus       | `boolean`               | false  | 自动获取焦点                                     |                                   |
+| show-glow-style | `boolean`               | true   | 可选，是否显示悬浮发光效果                       |                                   |
 
 ### Input 插槽
 
diff --git a/packages/devui-vue/docs/components/menu/index.md b/packages/devui-vue/docs/components/menu/index.md
index 972660b295..2ba28377dd 100644
--- a/packages/devui-vue/docs/components/menu/index.md
+++ b/packages/devui-vue/docs/components/menu/index.md
@@ -2,13 +2,17 @@
 
 Menu 组件通常用于导航.
 
-### 何时使用
-
+:::tip 何时使用
 在需要收纳，排列，展示一系列选项时.
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 如果屏幕尺寸过小，则会出现省略号
+如果屏幕尺寸过小，则会出现省略号。
+
+:::demo
 
 ```vue
 <template>
@@ -32,11 +36,18 @@ Menu 组件通常用于导航.
   <d-slider :min="0" :max="480" v-model="width"></d-slider>
 </template>
 
-<script setup lang="ts">
-import { ref } from 'vue';
-let width = ref(480);
-</script>
+<script>
+import { defineComponent, ref } from 'vue';
 
+export default defineComponent({
+  setup() {
+    const width = ref(480);
+    return {
+      width,
+    };
+  },
+});
+</script>
 ```
 
 :::
@@ -65,7 +76,7 @@ let width = ref(480);
 
 ### 垂直菜单
 
-垂直菜单一般在后台中较为广泛使用，子菜单可以嵌入菜单中
+垂直菜单一般在后台中较为广泛使用，子菜单可以嵌入菜单中。
 
 :::demo
 
@@ -102,7 +113,7 @@ let width = ref(480);
 
 ### 默认展开
 
-通过设置`open-keys`可以修改展开的子菜单项目.
+通过设置`open-keys`可以修改展开的子菜单项目。
 
 :::demo
 
@@ -129,79 +140,80 @@ let width = ref(480);
 
 ### 仅展开一项根子菜单
 
-:::demo 通过子菜单状态改变事件修改```open-keys```数组达到效果
+通过子菜单状态改变事件修改`open-keys`数组达到效果。
 
-``` vue
-  <template>
-    <d-menu @submenu-change="submenuChange" :default-select-keys="['item1']" :open-keys="openKeys" width="256px"
-    >
-      <d-sub-menu title="submenu-1" key="submenu-1">
+:::demo
+
+```vue
+<template>
+  <d-menu @submenu-change="submenuChange" :default-select-keys="['item1']" :open-keys="openKeys" width="256px">
+    <d-sub-menu title="submenu-1" key="submenu-1">
+      <template #icon>
+        <i class="icon-infomation"></i>
+      </template>
+      <d-menu-item key="subemenu-item-1">
+        <span>submenu-item-1</span>
+      </d-menu-item>
+      <d-sub-menu title="submenu-4" key="submenu-4">
         <template #icon>
           <i class="icon-infomation"></i>
         </template>
         <d-menu-item key="subemenu-item-1">
           <span>submenu-item-1</span>
         </d-menu-item>
-        <d-sub-menu title="submenu-4" key="submenu-4">
-          <template #icon>
-            <i class="icon-infomation"></i>
-          </template>
-          <d-menu-item key="subemenu-item-1">
-            <span>submenu-item-1</span>
-          </d-menu-item>
-        </d-sub-menu>
-        <d-sub-menu title="submenu-5" key="submenu-5">
-          <template #icon>
-            <i class="icon-infomation"></i>
-          </template>
-          <d-menu-item key="subemenu-item-1">
-            <span>submenu-item-1</span>
-          </d-menu-item>
-        </d-sub-menu>
-      </d-sub-menu>
-      <d-sub-menu title="submenu-2" key="submenu-2">
-        <template #icon>
-          <i class="icon-setting"></i>
-        </template>
-        <d-menu-item key="submenu-item-2">
-          <span>submenu-item-2</span>
-        </d-menu-item>
       </d-sub-menu>
-      <d-sub-menu title="submenu-3" key="submenu-3">
+      <d-sub-menu title="submenu-5" key="submenu-5">
         <template #icon>
-          <i class="icon-setting"></i>
+          <i class="icon-infomation"></i>
         </template>
-        <d-menu-item key="submenu-item-2">
-          <span>submenu-item-2</span>
+        <d-menu-item key="subemenu-item-1">
+          <span>submenu-item-1</span>
         </d-menu-item>
       </d-sub-menu>
-    </d-menu>
-  </template>
-
-  <script>
-  import { defineComponent, ref } from 'vue';
-
-  export default defineComponent({
-    setup() {
-      const openKeys = ref(['submenu-1']);
-      const rootSubMenuKeys = ref(['submenu-1','submenu-2','submenu-3']);
-      const submenuChange = (e) => {
-        console.log(e);
-        const {key} = e;
-        if (rootSubMenuKeys.value.includes(key)){
-          while (openKeys.value.length){
-            openKeys.value.shift();
-          }
-          openKeys.value.push(key);
+    </d-sub-menu>
+    <d-sub-menu title="submenu-2" key="submenu-2">
+      <template #icon>
+        <i class="icon-setting"></i>
+      </template>
+      <d-menu-item key="submenu-item-2">
+        <span>submenu-item-2</span>
+      </d-menu-item>
+    </d-sub-menu>
+    <d-sub-menu title="submenu-3" key="submenu-3">
+      <template #icon>
+        <i class="icon-setting"></i>
+      </template>
+      <d-menu-item key="submenu-item-2">
+        <span>submenu-item-2</span>
+      </d-menu-item>
+    </d-sub-menu>
+  </d-menu>
+</template>
+
+<script>
+import { defineComponent, ref } from 'vue';
+
+export default defineComponent({
+  setup() {
+    const openKeys = ref(['submenu-1']);
+    const rootSubMenuKeys = ref(['submenu-1', 'submenu-2', 'submenu-3']);
+    const submenuChange = (e) => {
+      console.log(e);
+      const { key } = e;
+      if (rootSubMenuKeys.value.includes(key)) {
+        while (openKeys.value.length) {
+          openKeys.value.shift();
         }
-      };
-      return {
-        openKeys,
-        submenuChange,
-      };
-    },
-  });
-  </script>
+        openKeys.value.push(key);
+      }
+    };
+    return {
+      openKeys,
+      submenuChange,
+    };
+  },
+});
+</script>
 ```
 
 :::
@@ -211,10 +223,8 @@ let width = ref(480);
 :::demo
 
 ```vue
-<d-button @click="changeCollapsed">
-  Collapsed
-</d-button>
 <template>
+  <d-button @click="changeCollapsed"> Collapsed </d-button>
   <d-menu :collapsed-indent="48" mode="vertical" width="256px" :default-select-keys="['item1']" :collapsed="collapsed">
     <d-menu-item key="item1" :disabled="isDisabled">
       <template #icon>
@@ -241,13 +251,23 @@ let width = ref(480);
   </d-menu>
 </template>
 
-<script lang="ts" setup>
-import { ref } from 'vue';
-let collapsed = ref(false);
-const isDisabled = ref(true);
-const changeCollapsed = () => {
-  collapsed.value = !collapsed.value;
-};
+<script>
+import { defineComponent, ref } from 'vue';
+
+export default defineComponent({
+  setup() {
+    let collapsed = ref(false);
+    const isDisabled = ref(true);
+    const changeCollapsed = () => {
+      collapsed.value = !collapsed.value;
+    };
+    return {
+      collapsed,
+      isDisabled,
+      changeCollapsed,
+    };
+  },
+});
 </script>
 ```
 
@@ -303,7 +323,7 @@ export default defineComponent({
 
 ### 响应式参数
 
-例如,`width`, `open-keys`, `default-select-keys`等参数均为响应式
+例如，`width`、`open-keys`、`default-select-keys`等参数均为响应式
 
 :::demo
 
@@ -339,24 +359,37 @@ export default defineComponent({
   <d-slider :min="0" :max="480" v-model="width"></d-slider>
 </template>
 
-<script lang="ts" setup>
-import { ref } from 'vue';
-let collapsed = ref(false);
-let isDisabled = ref(false);
-let selectKeys = ref([]);
-let width = ref(256);
-const changeDisabled = () => {
-  isDisabled.value = !isDisabled.value;
-  console.log(isDisabled.value);
-};
-const addSelect = () => {
-  if (selectKeys.value.includes('system-item')){
-    selectKeys.value.pop();
-  } else {
-    selectKeys.value.push('system-item');
-  }
-  console.log(selectKeys.value);
-}
+<script>
+import { defineComponent, ref } from 'vue';
+
+export default defineComponent({
+  setup() {
+    let collapsed = ref(false);
+    let isDisabled = ref(false);
+    let selectKeys = ref([]);
+    let width = ref(256);
+    const changeDisabled = () => {
+      isDisabled.value = !isDisabled.value;
+      console.log(isDisabled.value);
+    };
+    const addSelect = () => {
+      if (selectKeys.value.includes('system-item')) {
+        selectKeys.value.pop();
+      } else {
+        selectKeys.value.push('system-item');
+      }
+      console.log(selectKeys.value);
+    };
+    return {
+      collapsed,
+      isDisabled,
+      selectKeys,
+      width,
+      changeDisabled,
+      addSelect,
+    };
+  },
+});
 </script>
 ```
 
@@ -364,17 +397,17 @@ const addSelect = () => {
 
 ### Menu 参数
 
-| 参数                | 类型                  | 默认       | 说明                                                                            | 跳转 Demo                 |
-| ------------------- | --------------------- | ---------- | ------------------------------------------------------------------------------- | ------------------------- |
-| width               | String                | ''         | 用于控制菜单宽度                                                                | [响应式参数](#响应式参数) |
-| collapsed           | Boolean               | false      | 用于决定菜单是否收起                                                            | [收缩菜单](#收缩菜单)     |
-| collapsed-indent    | Number                | 24         | 收起时图标距离左右边框的距离                                                    | [收缩菜单](#收缩菜单)     |
-| multiple            | Boolean               | false      | 是否可以多选                                                                    | [取消多选](#取消多选)     |
-| mode                | [menuMode](#menumode) | 'vertical' | 菜单类型                                                                        | [基本用法](#基本用法)     |
-| open-keys           | Array                 | []         | 默认展开的子菜单 key 值                                                         | [默认展开](#默认展开)     |
-| default-select-keys | Array                 | []         | 默认选择菜单项 key 值                                                           | [基本用法](#基本用法)     |
-| router              | Boolean               | false      | 是否启用`vue-router`模式。启用该模式会在激活导航时以 key 作为 path 进行路由跳转 | -                         |
-| disable-overflow-style| Boolean               | false      | 是否禁用宽度过小时菜单的省略样式                                              | -                         |
+| 参数                   | 类型                  | 默认       | 说明                                                                            | 跳转 Demo                 |
+| ---------------------- | --------------------- | ---------- | ------------------------------------------------------------------------------- | ------------------------- |
+| width                  | String                | ''         | 用于控制菜单宽度                                                                | [响应式参数](#响应式参数) |
+| collapsed              | Boolean               | false      | 用于决定菜单是否收起                                                            | [收缩菜单](#收缩菜单)     |
+| collapsed-indent       | Number                | 24         | 收起时图标距离左右边框的距离                                                    | [收缩菜单](#收缩菜单)     |
+| multiple               | Boolean               | false      | 是否可以多选                                                                    | [取消多选](#取消多选)     |
+| mode                   | [menuMode](#menumode) | 'vertical' | 菜单类型                                                                        | [基本用法](#基本用法)     |
+| open-keys              | Array                 | []         | 默认展开的子菜单 key 值                                                         | [默认展开](#默认展开)     |
+| default-select-keys    | Array                 | []         | 默认选择菜单项 key 值                                                           | [基本用法](#基本用法)     |
+| router                 | Boolean               | false      | 是否启用`vue-router`模式。启用该模式会在激活导航时以 key 作为 path 进行路由跳转 | -                         |
+| disable-overflow-style | Boolean               | false      | 是否禁用宽度过小时菜单的省略样式                                                | -                         |
 
 ### Menu 事件
 
diff --git a/packages/devui-vue/docs/components/modal/index.md b/packages/devui-vue/docs/components/modal/index.md
index 71e07e03a2..463836c139 100644
--- a/packages/devui-vue/docs/components/modal/index.md
+++ b/packages/devui-vue/docs/components/modal/index.md
@@ -2,15 +2,21 @@
 
 模态框。
 
-#### 何时使用
+:::tip 何时使用
 
-1.需要用户处理事务，又不希望跳转页面以致打断工作流程时，可以使用 Modal 在当前页面正中打开一个浮层，承载相应的操作。
+1. 需要用户处理事务，又不希望跳转页面以致打断工作流程时，可以使用 Modal 在当前页面正中打开一个浮层，承载相应的操作。
 
-2.Modal 起到与用户进行交互的作用，用户可以在 Modal 中输入信息、阅读提示、设置选项等操作。
+2. Modal 起到与用户进行交互的作用，用户可以在 Modal 中输入信息、阅读提示、设置选项等操作。
+
+:::
+
+## 用法
 
 ### 基础用法
 
-:::demo `v-model`双向绑定，控制 Modal 是否显示；`title`参数设置 Modal 标题。
+`v-model`双向绑定，控制 Modal 是否显示；`title`参数设置 Modal 标题。
+
+:::demo
 
 ```vue
 <template>
@@ -47,7 +53,9 @@ export default defineComponent({
 
 ### 保留最后一次关闭位置
 
-:::demo `keep-last`可使当前 modal 再次打开时保留上次关闭位置。
+`keep-last`可使当前 modal 再次打开时保留上次关闭位置。
+
+:::demo
 
 ```vue
 <template>
@@ -84,7 +92,9 @@ export default defineComponent({
 
 ### 自定义标题和操作按钮
 
-:::demo `header`插槽可以自定义 Modal 顶部区域，子组件`d-modal-header`为顶部区域提供了默认样式，自定义样式可通过在子组件设置`style/class`实现。`footer`插槽同理。
+`header`插槽可以自定义 Modal 顶部区域，子组件`d-modal-header`为顶部区域提供了默认样式，自定义样式可通过在子组件设置`style/class`实现。`footer`插槽同理。
+
+:::demo
 
 ```vue
 <template>
@@ -134,7 +144,9 @@ export default defineComponent({
 
 ### 信息提示
 
-:::demo 各种类型的信息提示框。
+各种类型的信息提示框。
+
+:::demo
 
 ```vue
 <template>
@@ -176,7 +188,10 @@ export default defineComponent({
 
 ### 关闭前回调
 
-:::demo `before-close`在用户点击关闭按钮或者遮罩层时会被调用，可在完成某些异步操作后，通过`done`参数关闭。`close`在Modal关闭时触发。
+`before-close`在用户点击关闭按钮或者遮罩层时会被调用，可在完成某些异步操作后，通过`done`参数关闭。`close`在 Modal 关闭时触发。
+
+:::demo
+
 ```vue
 <template>
   <d-button @click="handleClick">打开 modal</d-button>
@@ -216,8 +231,8 @@ export default defineComponent({
       }).then(done);
     };
     const handleClose = () => {
-      console.log("Modal关闭")
-    }
+      console.log('Modal关闭');
+    };
 
     return { visible, data, handleClick, hidden, beforeClose, handleClose };
   },
@@ -229,7 +244,9 @@ export default defineComponent({
 
 ### 弹窗中的按钮配置 autofocus 自动获取焦点
 
-::: demo `button` 配置 `autofocus` 可以自动获取焦点，可以通过回车 `enter` 触发按钮按钮点击
+`button` 配置 `autofocus` 可以自动获取焦点，可以通过回车 `enter` 触发按钮按钮点击。
+
+::: demo
 
 ```vue
 <template>
@@ -291,8 +308,8 @@ export default defineComponent({
 
 ### Modal 事件
 
-| 事件名 | 类型 | 说明              |
-| :----- | :--- | :---------------- |
+| 事件名 | 类型 | 说明             |
+| :----- | :--- | :--------------- |
 | close  | `-`  | Modal 关闭时触发 |
 
 ### Modal 插槽
diff --git a/packages/devui-vue/docs/components/multi-auto-complete/index.md b/packages/devui-vue/docs/components/multi-auto-complete/index.md
index 54c2cee33e..05e63c0120 100644
--- a/packages/devui-vue/docs/components/multi-auto-complete/index.md
+++ b/packages/devui-vue/docs/components/multi-auto-complete/index.md
@@ -8,7 +8,7 @@
 
 ### 基本用法
 
-:::demo // todo 基本用法描述
+:::demo
 
 ```vue
 <template>
@@ -23,10 +23,10 @@ export default defineComponent({
     const data = ref('多项自动补全');
 
     return {
-      data
-    }
-  }
-})
+      data,
+    };
+  },
+});
 </script>
 
 <style lang="scss">
@@ -41,27 +41,27 @@ export default defineComponent({
 
 ### MultiAutoComplete 参数
 
-| 参数名 | 类型 | 默认值 | 说明 | 跳转 Demo |
-| :---- | :---- | :---- | :---- | :--------- |
-|      |   `string`   |      |      |     [基本用法](#基本用法)      |
-|      |   [IXxx](#ixxx)   |      |      |           |
-|      |      |      |      |           |
+| 参数名 | 类型          | 默认值 | 说明 | 跳转 Demo             |
+| :----- | :------------ | :----- | :--- | :-------------------- |
+|        | `string`      |        |      | [基本用法](#基本用法) |
+|        | [IXxx](#ixxx) |        |      |                       |
+|        |               |        |      |                       |
 
 ### MultiAutoComplete 事件
 
 | 事件名 | 回调参数 | 说明 | 跳转 Demo |
-| :---- | :---- | :---- | :--------- |
-|      |      |      |           |
-|      |      |      |           |
-|      |      |      |           |
+| :----- | :------- | :--- | :-------- |
+|        |          |      |           |
+|        |          |      |           |
+|        |          |      |           |
 
 ### MultiAutoComplete 插槽
 
-| 插槽名 | 说明 | 跳转 Demo |
-| :---- | :---- | :--------- |
-|   default   |      |           |
-|      |      |           |
-|      |      |           |
+| 插槽名  | 说明 | 跳转 Demo |
+| :------ | :--- | :-------- |
+| default |      |           |
+|         |      |           |
+|         |      |           |
 
 ### MultiAutoComplete 类型定义
 
@@ -72,4 +72,3 @@ interface IXxx {
   xxx: string;
 }
 ```
-
diff --git a/packages/devui-vue/docs/components/notification/index.md b/packages/devui-vue/docs/components/notification/index.md
index 1df1058786..13896f5cae 100644
--- a/packages/devui-vue/docs/components/notification/index.md
+++ b/packages/devui-vue/docs/components/notification/index.md
@@ -2,13 +2,17 @@
 
 全局信息提示组件。
 
-#### 何时使用
-
+:::tip 何时使用
 当需要向用户全局展示提示信息时使用，显示数秒后消失。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 推荐使用服务方式调用，默认情况只展示消息内容和关闭按钮。
+推荐使用服务方式调用，默认情况只展示消息内容和关闭按钮。
+
+:::demo
 
 ```vue
 <template>
@@ -36,7 +40,9 @@ export default defineComponent({
 
 ### 消息标题
 
-:::demo 通过`title`参数设置消息标题，默认为空，不显示标题。
+通过`title`参数设置消息标题，默认为空，不显示标题。
+
+:::demo
 
 ```vue
 <template>
@@ -65,7 +71,9 @@ export default defineComponent({
 
 ### 消息类型
 
-:::demo 通过`type`参数设置消息类型，目前支持`normal`、`info`、`success`、`warning`、`danger`五种类型，默认`normal`类型，不显示类型图标。
+通过`type`参数设置消息类型，目前支持`normal`、`info`、`success`、`warning`、`danger`五种类型，默认`normal`类型，不显示类型图标。
+
+:::demo
 
 ```vue
 <template>
@@ -95,7 +103,9 @@ export default defineComponent({
 
 ### 超时时间
 
-:::demo 通过`duration`参数设置超时时间，单位`ms`，默认`3000 ms`后自动关闭，设置为`0`则不会自动关闭。
+通过`duration`参数设置超时时间，单位`ms`，默认`3000 ms`后自动关闭，设置为`0`则不会自动关闭。
+
+:::demo
 
 ```vue
 <template>
@@ -125,7 +135,9 @@ export default defineComponent({
 
 ### 关闭回调
 
-:::demo 通过`onClose`参数设置消息关闭时的回调。
+通过`onClose`参数设置消息关闭时的回调。
+
+:::demo
 
 ```vue
 <template>
@@ -157,7 +169,9 @@ export default defineComponent({
 
 ### 组件方式调用
 
-:::demo 除服务方式外，还提供组件方式调用，组件方式的默认插槽与服务方式的`content`参数作用一致，其他参数与服务方式保持同名。
+除服务方式外，还提供组件方式调用，组件方式的默认插槽与服务方式的`content`参数作用一致，其他参数与服务方式保持同名。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/panel/index.md b/packages/devui-vue/docs/components/panel/index.md
index 3be842b472..c321886fa5 100644
--- a/packages/devui-vue/docs/components/panel/index.md
+++ b/packages/devui-vue/docs/components/panel/index.md
@@ -2,9 +2,9 @@
 
 内容面板，用于内容分组。
 
-#### 何时使用
-
+:::tip 何时使用
 当页面内容需要进行分组显示时使用，一般包含头部、内容区域、底部三个部分。
+:::
 
 ### 基本用法
 
@@ -23,7 +23,9 @@
 
 ### 默认状态
 
-:::demo 通过设置`is-collapsed`为`true`可以默认展开面板。
+通过设置`is-collapsed`为`true`可以默认展开面板。
+
+:::demo
 
 ```vue
 <template>
@@ -38,7 +40,9 @@
 
 ### 面板类型
 
-:::demo 面板类型有5种：`primary` / `success` / `danger` / `warning` / `info`，默认为`info`。
+面板类型有 5 种：`primary` / `success` / `danger` / `warning` / `info`，默认为`info`。
+
+:::demo
 
 ```vue
 <template>
@@ -46,22 +50,22 @@
     <d-panel-header>Panel with info Type</d-panel-header>
     <d-panel-body>This is body</d-panel-body>
   </d-panel>
-  <br>
+  <br />
   <d-panel type="primary" :is-collapsed="true">
     <d-panel-header>Panel with primary Type</d-panel-header>
     <d-panel-body>This is body</d-panel-body>
   </d-panel>
-  <br>
+  <br />
   <d-panel type="success" :is-collapsed="true">
     <d-panel-header>Panel with success Type</d-panel-header>
     <d-panel-body>This is body</d-panel-body>
   </d-panel>
-  <br>
+  <br />
   <d-panel type="warning" :is-collapsed="true">
     <d-panel-header>Panel with warning Type</d-panel-header>
     <d-panel-body>This is body</d-panel-body>
   </d-panel>
-  <br>
+  <br />
   <d-panel type="danger" :is-collapsed="true">
     <d-panel-header>Panel with danger Type</d-panel-header>
     <d-panel-body>This is body</d-panel-body>
@@ -84,7 +88,7 @@
     </d-panel-header>
     <d-panel-body>This is body</d-panel-body>
   </d-panel>
-  <br>
+  <br />
   <d-panel :is-collapsed="true">
     <d-panel-header>Panel with header and footer</d-panel-header>
     <d-panel-body>This is body</d-panel-body>
@@ -104,9 +108,9 @@ export default defineComponent({
 
     return {
       toggle,
-      toggleState
+      toggleState,
     };
-  }
+  },
 });
 </script>
 ```
@@ -115,23 +119,20 @@ export default defineComponent({
 
 ### 阻止折叠
 
-:::demo 我们可以使用`before-toggle`来阻止面板的收起。根据条件判断，当`Panel`展开时，点击阻止折叠按钮，将无法折叠`Panel`，当`Panel`展开时不影响操作。
+我们可以使用`before-toggle`来阻止面板的收起。根据条件判断，当`Panel`展开时，点击阻止折叠按钮，将无法折叠`Panel`，当`Panel`展开时不影响操作。
+
+:::demo
 
 ```vue
 <template>
-  <d-panel
-    type="primary"
-    :is-collapsed="isCollapsed"
-    @toggle="handleToggle"
-    :before-toggle="beforeToggle"
-  >
+  <d-panel type="primary" :is-collapsed="isCollapsed" @toggle="handleToggle" :before-toggle="beforeToggle">
     <d-panel-header>
       Panel header
       <i :class="`icon-chevron-${toggle ? 'down' : 'up'}`"></i>
     </d-panel-header>
     <d-panel-body>This is body</d-panel-body>
   </d-panel>
-  <br>
+  <br />
   <d-button @click="panelToggle = !panelToggle">
     {{ panelToggle ? '阻止折叠' : '允许折叠' }}
   </d-button>
@@ -149,7 +150,7 @@ export default defineComponent({
     const handleToggle = (value) => {
       toggle.value = value;
     };
-    
+
     const beforeToggle = () => {
       return panelToggle.value;
     };
@@ -161,21 +162,22 @@ export default defineComponent({
       isCollapsed,
       handleToggle,
     };
-  }
+  },
 });
 </script>
 ```
+
 :::
 
 ### Panel 参数
 
-| 参数名           | 类型                                          | 默认   | 说明                                                                                               |
-| :--------------- | :-------------------------------------------- | :----- | :------------------------------------------------------------------------------------------------- |
-| type             | [PanelType](#paneltype)                       | 'info' | 可选，面板的类型                                                                                   |
-| is-collapsed     | `boolean`                                     | false  | 可选，是否默认展开                                                                                 |
-| has-left-padding | `boolean`                                     | true   | 可选，是否显示左侧填充                                                                             |
-| show-animation   | `boolean`                                     | true   | 可选，是否显示动画                                                                                 |
-| before-toggle    | `(value: boolean, done?: () => void) => void` | --     | 可选，面板折叠状态改变前的回调函数。<br>参数`value`代表当前状态，<br>参数`done()`可以控制Panel开合 |
+| 参数名           | 类型                                          | 默认   | 说明                                                                                                 |
+| :--------------- | :-------------------------------------------- | :----- | :--------------------------------------------------------------------------------------------------- |
+| type             | [PanelType](#paneltype)                       | 'info' | 可选，面板的类型                                                                                     |
+| is-collapsed     | `boolean`                                     | false  | 可选，是否默认展开                                                                                   |
+| has-left-padding | `boolean`                                     | true   | 可选，是否显示左侧填充                                                                               |
+| show-animation   | `boolean`                                     | true   | 可选，是否显示动画                                                                                   |
+| before-toggle    | `(value: boolean, done?: () => void) => void` | --     | 可选，面板折叠状态改变前的回调函数。<br>参数`value`代表当前状态，<br>参数`done()`可以控制 Panel 开合 |
 
 ### Panel 事件
 
diff --git a/packages/devui-vue/docs/components/popover/index.md b/packages/devui-vue/docs/components/popover/index.md
index 44cb2729d6..cd75ba48ae 100644
--- a/packages/devui-vue/docs/components/popover/index.md
+++ b/packages/devui-vue/docs/components/popover/index.md
@@ -2,13 +2,17 @@
 
 简单的文字提示气泡框。
 
-#### 何时使用
-
+:::tip 何时使用
 用来通知用户非关键性问题或提示某控件处于某特殊情况。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 当 Popover 弹出时，会基于`default`插槽的内容进行定位。
+当 Popover 弹出时，会基于`default`插槽的内容进行定位。
+
+:::demo
 
 ```vue
 <template>
@@ -48,7 +52,9 @@
 
 ### 自定义内容
 
-:::demo 自定义`default`插槽的内容与弹出提示内容。
+自定义`default`插槽的内容与弹出提示内容。
+
+:::demo
 
 ```vue
 <template>
@@ -67,7 +73,9 @@
 
 ### 弹出位置
 
-:::demo 总共支持 12 个弹出位置。
+Popover 总共支持 12 个弹出位置。
+
+:::demo
 
 ```vue
 <template>
@@ -213,7 +221,9 @@
 
 ### 延时触发
 
-:::demo 仅需要在 trigger 为 hover 的时候，鼠标移入的时长超过 `mouse-enter-delay` 毫秒之后才会触发，以防止用户无意划过导致的闪现，默认值是 150 毫秒；鼠标移出之后，再经过`mouse-leave-delay`毫秒后，Popover 组件才会隐藏，默认值是 100 毫秒。
+仅需要在 trigger 为 hover 的时候，鼠标移入的时长超过 `mouse-enter-delay` 毫秒之后才会触发，以防止用户无意划过导致的闪现，默认值是 150 毫秒；鼠标移出之后，再经过`mouse-leave-delay`毫秒后，Popover 组件才会隐藏，默认值是 100 毫秒。
+
+:::demo
 
 ```vue
 <template>
@@ -239,7 +249,9 @@
 
 ### 手动触发
 
-:::demo `trigger`参数设置为`manually`，可通过`is-open`参数设置是否弹出.
+`trigger`参数设置为`manually`，可通过`is-open`参数设置是否弹出。
+
+:::demo
 
 ```vue
 <template>
@@ -266,7 +278,9 @@ export default defineComponent({
 
 ### 事件
 
-:::demo 当 Popover 弹出、隐藏时，可以触发自定义事件。
+当 Popover 弹出、隐藏时，可以触发自定义事件。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/progress/index.md b/packages/devui-vue/docs/components/progress/index.md
index 70c750e689..b5c87afb40 100644
--- a/packages/devui-vue/docs/components/progress/index.md
+++ b/packages/devui-vue/docs/components/progress/index.md
@@ -2,12 +2,16 @@
 
 进度条。
 
-#### 何时使用
+:::tip 何时使用
 
 1. 当操作需要较长的时间时，向用户展示操作进度。
 2. 当操作需要打断现有界面或后台运行，需要较长时间时。
 3. 当需要显示一个操作完成的百分比或已完成的步骤/总步骤时。
 
+:::
+
+## 用法
+
 ### 基本用法
 
 基本的进度和文字配置。
@@ -43,7 +47,7 @@
 
 ### 设置文字位置
 
-提供了5种位置选择
+提供了 5 种位置选择。
 
 ::: demo
 
@@ -65,39 +69,37 @@
     <div class="progress-container">
       <d-progress percentage-text-placement="outside" :percentage="percentage" :percentageText="`${percentage}%`"></d-progress>
     </div>
-    <div class="progress-container">
-      <d-button @click="minus">减 10%</d-button> <d-button @click="add">增 10%</d-button>
-    </div>
+    <div class="progress-container"><d-button @click="minus">减 10%</d-button> <d-button @click="add">增 10%</d-button></div>
   </section>
 </template>
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
-  setup () {
-    const percentageRef = ref(60)
+  setup() {
+    const percentageRef = ref(60);
 
     const add = () => {
-      percentageRef.value += 10
+      percentageRef.value += 10;
       if (percentageRef.value > 100) {
-        percentageRef.value = 0
+        percentageRef.value = 0;
       }
-    }
+    };
 
     const minus = () => {
-      percentageRef.value -= 10
+      percentageRef.value -= 10;
       if (percentageRef.value < 0) {
-        percentageRef.value = 100
+        percentageRef.value = 100;
       }
-    }
+    };
 
     return {
       percentage: percentageRef,
       add,
-      minus
-    }
-  }
-})
+      minus,
+    };
+  },
+});
 </script>
 <style>
 .progress-container {
@@ -175,7 +177,7 @@ export default defineComponent({
 ```vue
 <template>
   <section class="devui-code-box-demo">
-  <div class="progress-container-circle">
+    <div class="progress-container-circle">
       <d-progress :isCircle="true" :percentage="80" barBgColor="#e056fd" :showContent="false"> </d-progress>
     </div>
     <div class="progress-container-circle">
@@ -185,7 +187,13 @@ export default defineComponent({
       <d-progress :percentage="80" barBgColor="#badc58" percentage-text-color="#eb4d4b" percentageText="80%"></d-progress>
     </div>
     <div class="progress-container">
-      <d-progress :percentage="80" barBgColor="orange" percentage-text-placement="outside" percentage-text-color="orange" percentageText="80%"></d-progress>
+      <d-progress
+        :percentage="80"
+        barBgColor="orange"
+        percentage-text-placement="outside"
+        percentage-text-color="orange"
+        percentageText="80%"
+      ></d-progress>
     </div>
   </section>
 </template>
@@ -215,14 +223,14 @@ export default defineComponent({
 
 ### Progress 参数
 
-| 参数名          | 类型      | 默认值  | 描述                                                     | 跳转 Demo             |
-| :-------------- | :-------- | :------ | :------------------------------------------------------- | :-------------------- |
-| percentage      | `number`  | 0       | 可选，进度条的值最大为 100                               | [基本用法](#基本用法) |
-| percentage-text | `string`  | --      | 可选，进度条当前值的文字说明比如：'30%' \| '4/5'         | [基本用法](#基本用法) |
-| height          | `string`  | 20px    | 可选，进度条的高度值，默认值为 20px                      | [基本用法](#基本用法) |
-| percentage-text-placement  | `'insideLeft'\|'inside'\|`<br/> `'insideRight'\|'outside'\|`<br/>`'insideBg'`  | inside   | 可选，设置进度条的文字说明位置                    | [设置文字位置](#设置文字位置) |
-| is-circle       | `boolean` | false   | 可选， 显示进度条是否为圈形                              | [圆环用法](#圆环用法) |
-| stroke-width    | `number`  | 6       | 可选，设置圈形进度条宽度，单位是进度条与画布宽度的百分比 | [圆环用法](#圆环用法) |
-| show-content    | `boolean` | true    | 可选，设置圈形进度条内是否展示内容                       | [圆环用法](#圆环用法) |
-| bar-bg-color    | `string`  | #5170ff | 可选，进度条的颜色显示，默认为天蓝色                     | [自定义颜色](#自定义颜色) |
-| percentage-text-color          | `string`  | ''    | 可选，设置进度条的文字说明颜色                     | [自定义颜色](#自定义颜色) |
+| 参数名                    | 类型                                                                          | 默认值  | 描述                                                     | 跳转 Demo                     |
+| :------------------------ | :---------------------------------------------------------------------------- | :------ | :------------------------------------------------------- | :---------------------------- |
+| percentage                | `number`                                                                      | 0       | 可选，进度条的值最大为 100                               | [基本用法](#基本用法)         |
+| percentage-text           | `string`                                                                      | --      | 可选，进度条当前值的文字说明比如：'30%' \| '4/5'         | [基本用法](#基本用法)         |
+| height                    | `string`                                                                      | 20px    | 可选，进度条的高度值，默认值为 20px                      | [基本用法](#基本用法)         |
+| percentage-text-placement | `'insideLeft'\|'inside'\|`<br/> `'insideRight'\|'outside'\|`<br/>`'insideBg'` | inside  | 可选，设置进度条的文字说明位置                           | [设置文字位置](#设置文字位置) |
+| is-circle                 | `boolean`                                                                     | false   | 可选， 显示进度条是否为圈形                              | [圆环用法](#圆环用法)         |
+| stroke-width              | `number`                                                                      | 6       | 可选，设置圈形进度条宽度，单位是进度条与画布宽度的百分比 | [圆环用法](#圆环用法)         |
+| show-content              | `boolean`                                                                     | true    | 可选，设置圈形进度条内是否展示内容                       | [圆环用法](#圆环用法)         |
+| bar-bg-color              | `string`                                                                      | #5170ff | 可选，进度条的颜色显示，默认为天蓝色                     | [自定义颜色](#自定义颜色)     |
+| percentage-text-color     | `string`                                                                      | ''      | 可选，设置进度条的文字说明颜色                           | [自定义颜色](#自定义颜色)     |
diff --git a/packages/devui-vue/docs/components/quadrant-diagram/index.md b/packages/devui-vue/docs/components/quadrant-diagram/index.md
index 9df3227df6..befb51b6df 100644
--- a/packages/devui-vue/docs/components/quadrant-diagram/index.md
+++ b/packages/devui-vue/docs/components/quadrant-diagram/index.md
@@ -2,26 +2,27 @@
 
 象限图。
 
-#### 何时使用
-
+:::tip 何时使用
 根据需求对事务进行区域划分与价值排序，可用于管理事务的优先级。
+:::
+
+## 用法
 
 ### 基本用法
 
-<h4>Basic Usage</h4>
+#### Basic Usage
 
 :::demo
 
 ```vue
 <template>
-  <d-quadrant-diagram :view='view'/>
+  <d-quadrant-diagram :view="view" />
 </template>
 
-
 <script>
-import { defineComponent, reactive } from 'vue'
+import { defineComponent, reactive } from 'vue';
 
-export default ({
+export default {
   setup() {
     const view = reactive({
       height: 500,
@@ -29,9 +30,9 @@ export default ({
     });
     return {
       view,
-    }
-  }
-})
+    };
+  },
+};
 </script>
 ```
 
diff --git a/packages/devui-vue/docs/components/ripple/index.md b/packages/devui-vue/docs/components/ripple/index.md
index 02d24c255b..cc7c116cf6 100644
--- a/packages/devui-vue/docs/components/ripple/index.md
+++ b/packages/devui-vue/docs/components/ripple/index.md
@@ -10,14 +10,16 @@
 
 ### 基本用法
 
-:::demo 用户 可以在组件 或者 HTML 元素上任意使用 <span color="#409EFF">`v-ripple`</span> 指令 使用基本的 <span color="#409EFF">`v-ripple`</span> 指令， `v-ripple` 接收 一个对象
+用户 可以在组件 或者 HTML 元素上任意使用 <span color="#409EFF">`v-ripple`</span> 指令 使用基本的 <span color="#409EFF">`v-ripple`</span> 指令， `v-ripple` 接收 一个对象。
+
+:::demo
 
 ```vue
 <template>
   <d-row :gutter="50">
     <d-col :span="12">
       <div class="ripple-button">
-        <div class="ripple-html-element" v-ripple="{ color: '#5e7ce0',duration: 300, delay: 300 }">HTML元素 中使用 v-ripple</div>
+        <div class="ripple-html-element" v-ripple="{ color: '#5e7ce0', duration: 300, delay: 300 }">HTML元素 中使用 v-ripple</div>
       </div>
     </d-col>
     <d-col :span="12">
@@ -49,7 +51,7 @@
         { color: '#67C23A', text: '这是一条 Success 涟漪' },
         { color: '#E6A23C', text: '这是一条 Warning 涟漪' },
         { color: '#F56C6C', text: '这是一条 Danger 涟漪' },
-        { color: '#909399', text: '这是一条 Info 涟漪' }
+        { color: '#909399', text: '这是一条 Info 涟漪' },
       ]"
       :style="{ color: item.color }"
     >
@@ -60,16 +62,15 @@
   </ul>
 </template>
 <style>
-  .demo-ripple {
-    list-style: none;
-    padding-left: 0;
-  }
+.demo-ripple {
+  list-style: none;
+  padding-left: 0;
+}
 </style>
 ```
 
 :::
 
-
 ### 应用于其他组件
 
 Button 组件
@@ -88,73 +89,63 @@ Button 组件
 
 :::
 
-Card 组件 
+Card 组件
 
 :::demo
+
 ```vue
 <template>
   <d-card v-ripple="{ duration: 300 }" class="demo-card" :src="'https://devui.design/components/assets/image1.png'">
     <template #avatar>
       <d-avatar name="DevUI"></d-avatar>
     </template>
-    <template #title>
-      DEVUI Course
-    </template>
-    <template #subtitle class="icon">
-      <d-icon name="company-member"></d-icon><span>DevUI</span>
-    </template>
+    <template #title> DEVUI Course </template>
+    <template #subtitle class="icon"> <d-icon name="company-member"></d-icon><span>DevUI</span> </template>
     <template #content>
-      DEVUI is a free open-source and common solution for the front end of enterprise mid- and back-end products. Its design values are basedon...
+      DEVUI is a free open-source and common solution for the front end of enterprise mid- and back-end products. Its design values are
+      basedon...
     </template>
     <template #actions>
-      <div class="card-block">
-        <d-icon name="like"></d-icon ><span>12</span>
-      </div>
-      <div class="card-block">
-        <d-icon name="star-o"></d-icon ><span>8</span>
-      </div>
-      <div class="card-block">
-        <d-icon name="message"></d-icon ><span>8</span>
-      </div>
+      <div class="card-block"><d-icon name="like"></d-icon><span>12</span></div>
+      <div class="card-block"><d-icon name="star-o"></d-icon><span>8</span></div>
+      <div class="card-block"><d-icon name="message"></d-icon><span>8</span></div>
     </template>
   </d-card>
 </template>
 <style lang="scss">
-  .demo-card {
-    width: 350px;
-    cursor: pointer;
-    transition:
-      box-shadow .3s cubic-bezier(.645,.045,.355,1),
-      transform .3s cubic-bezier(.645,.045,.355,1);
-    
-    &:hover {
-      box-shadow: 0 4px 16px 0 rgba(0,0,0,.1);
-      transform: translateY(-5px);
-    }
-
-    .card-block {
-      margin-right: 16px;
+.demo-card {
+  width: 350px;
+  cursor: pointer;
+  transition: box-shadow 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+
+  &:hover {
+    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.1);
+    transform: translateY(-5px);
+  }
 
-      i {
-        cursor: pointer;
-        font-size: 16px;
-        margin-right: 8px;
-        vertical-align: middle;
-      }
+  .card-block {
+    margin-right: 16px;
 
-      i + span {
-        vertical-align: middle;
-      }
+    i {
+      cursor: pointer;
+      font-size: 16px;
+      margin-right: 8px;
+      vertical-align: middle;
     }
 
-    img {
-      max-width: none;
+    i + span {
+      vertical-align: middle;
     }
+  }
 
-    .action-text {
-      color: #8a8e99;
-    }
+  img {
+    max-width: none;
+  }
+
+  .action-text {
+    color: #8a8e99;
   }
+}
 </style>
 ```
 
diff --git a/packages/devui-vue/docs/components/search/index.md b/packages/devui-vue/docs/components/search/index.md
index d2fa04a88e..97fcc30547 100644
--- a/packages/devui-vue/docs/components/search/index.md
+++ b/packages/devui-vue/docs/components/search/index.md
@@ -2,13 +2,17 @@
 
 搜索框。
 
-#### 何时使用
-
+:::tip 何时使用
 当用户需要在数据集中搜索所需数据时，输入所需数据的内容（或部分内容），返回所有匹配内容的搜索结果。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 使用`sm`，`''`，`lg`来定义`Search`基本类型
+使用`sm`，`''`，`lg`来定义`Search`基本类型。
+
+:::demo
 
 ```vue
 <template>
@@ -42,7 +46,9 @@ export default defineComponent({
 
 ### 搜索图标左置
 
-:::demo 使用`left`，`right`来定义`Search`搜索图标位置， 默认`right`
+使用`left`，`right`来定义`Search`搜索图标位置， 默认`right`。
+
+:::demo
 
 ```vue
 <template>
@@ -56,7 +62,9 @@ export default defineComponent({
 
 ### 无边框
 
-:::demo 使用`no-border`来定义`Search`无边框
+使用`no-border`来定义`Search`无边框。
+
+:::demo
 
 ```vue
 <template>
@@ -70,7 +78,9 @@ export default defineComponent({
 
 ### 双向绑定
 
-:::demo 使用`v-model`双向绑定
+使用`v-model`双向绑定。
+
+:::demo
 
 ```vue
 <template>
@@ -95,19 +105,19 @@ export default defineComponent({
 
 ### Search 参数
 
-| 参数名          | 类型                                    | 默认    | 说明                                           | 跳转 Demo                     |
-| :-------------- |:--------------------------------------| :------ | :--------------------------------------------- | :---------------------------- |
-| size            | [SearchSizeType](#searchsizetype)     | 'md'| 可选，搜索框尺寸| [基本用法](#基本用法) |
-| placeholder     | `string`                              | --      | 可选，输入框 placeholder                       | [搜索图标左置](#搜索图标左置) |
-| max-length      | `number`                              | --      | 可选，输入框的 max-length                      | [双向绑定](#双向绑定)         |
-| delay           | `number`                              | 300     | 可选，debounceTime 的延迟                      | [基本用法](#基本用法)         |
-| disabled        | `boolean`                             | false   | 可选，输入框是否被禁用                         | [基本用法](#基本用法)         |
-| auto-focus      | `boolean`                             | false   | 可选，输入框是否自动对焦                       | [基本用法](#基本用法)         |
-| is-keyup-search | `boolean`                             | false   | 可选，是否支持输入值立即触发 `search`          | [基本用法](#基本用法)         |
-| icon-position   | [IconPositionType](#iconpositiontype) | 'right' | 可选，搜索图标位置 | [搜索图标左置](#搜索图标左置) |
-| no-border       | `boolean`                             | false   | 可选，是否显示边框                             | [无边框](#无边框)             |
-| css-class       | `string`                              | ''      | 可选，支持传入类名到输入框上                   | [双向绑定](#双向绑定)         |
-|show-glow-style|`boolean`|true|可选，是否显示悬浮发光效果||
+| 参数名          | 类型                                  | 默认    | 说明                                  | 跳转 Demo                     |
+| :-------------- | :------------------------------------ | :------ | :------------------------------------ | :---------------------------- |
+| size            | [SearchSizeType](#searchsizetype)     | 'md'    | 可选，搜索框尺寸                      | [基本用法](#基本用法)         |
+| placeholder     | `string`                              | --      | 可选，输入框 placeholder              | [搜索图标左置](#搜索图标左置) |
+| max-length      | `number`                              | --      | 可选，输入框的 max-length             | [双向绑定](#双向绑定)         |
+| delay           | `number`                              | 300     | 可选，debounceTime 的延迟             | [基本用法](#基本用法)         |
+| disabled        | `boolean`                             | false   | 可选，输入框是否被禁用                | [基本用法](#基本用法)         |
+| auto-focus      | `boolean`                             | false   | 可选，输入框是否自动对焦              | [基本用法](#基本用法)         |
+| is-keyup-search | `boolean`                             | false   | 可选，是否支持输入值立即触发 `search` | [基本用法](#基本用法)         |
+| icon-position   | [IconPositionType](#iconpositiontype) | 'right' | 可选，搜索图标位置                    | [搜索图标左置](#搜索图标左置) |
+| no-border       | `boolean`                             | false   | 可选，是否显示边框                    | [无边框](#无边框)             |
+| css-class       | `string`                              | ''      | 可选，支持传入类名到输入框上          | [双向绑定](#双向绑定)         |
+| show-glow-style | `boolean`                             | true    | 可选，是否显示悬浮发光效果            |                               |
 
 ### Search 事件
 
diff --git a/packages/devui-vue/docs/components/skeleton/index.md b/packages/devui-vue/docs/components/skeleton/index.md
index a4fb645c81..6ff09260c3 100644
--- a/packages/devui-vue/docs/components/skeleton/index.md
+++ b/packages/devui-vue/docs/components/skeleton/index.md
@@ -2,13 +2,17 @@
 
 用于在内容加载过程中展示一组占位图形。
 
-#### 何时使用
-
+:::tip 何时使用
 在需要等待加载内容的位置设置一个骨架屏，某些场景下比 Loading 的视觉效果更好。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 默认排版：一个标题+三个段落，标题宽度为`40%`，中间两个段落宽度为`100%`，最后一个段落宽度为`60%`。
+默认排版：一个标题+三个段落，标题宽度为`40%`，中间两个段落宽度为`100%`，最后一个段落宽度为`60%`。
+
+:::demo
 
 ```vue
 <template>
@@ -20,7 +24,9 @@
 
 ### 自定义排版
 
-:::demo 当默认排版不满足需求时，可自定义排版结构，通过`class`和`style`可自定义宽高等样式。
+当默认排版不满足需求时，可自定义排版结构，通过`class`和`style`可自定义宽高等样式。
+
+:::demo
 
 ```vue
 <template>
@@ -57,7 +63,9 @@ export default defineComponent({
 
 ### 细粒度模式
 
-:::demo `d-skeleton-item`组件提供两种抽象类型：`circle`、`square`，一种具象类型：`image`。针对`circle`和`image`两种类型提供`size`参数，内置了三种大小。`d-skeleton`组件提供`round`和`show-animation`参数分别设置圆角和动画。
+`d-skeleton-item`组件提供两种抽象类型：`circle`、`square`，一种具象类型：`image`。针对`circle`和`image`两种类型提供`size`参数，内置了三种大小。`d-skeleton`组件提供`round`和`show-animation`参数分别设置圆角和动画。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/sticky/index.md b/packages/devui-vue/docs/components/sticky/index.md
index 5850a4f6f4..e71b6aafc9 100644
--- a/packages/devui-vue/docs/components/sticky/index.md
+++ b/packages/devui-vue/docs/components/sticky/index.md
@@ -2,13 +2,17 @@
 
 便签组件。
 
-#### 何时使用
-
+:::tip 何时使用
 当用户在滚动屏幕时，需要某个区域内容在段落或者浏览器可视区域可见时。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 默认容器为父元素
+默认容器为父元素。
+
+:::demo
 
 ```vue
 <template>
@@ -24,21 +28,21 @@ export default {
   setup(props) {
     const view = {
       top: 100,
-      bottom: 0
-    }
-    const zIndex = 1000
+      bottom: 0,
+    };
+    const zIndex = 1000;
 
     function statusChangeHandler(status) {
-      console.log('status =', status)
+      console.log('status =', status);
     }
 
     return {
       view,
       zIndex,
-      statusChangeHandler
-    }
-  }
-}
+      statusChangeHandler,
+    };
+  },
+};
 </script>
 ```
 
@@ -58,25 +62,25 @@ export default {
 </template>
 
 <script>
-import { reactive, onMounted, toRefs } from 'vue'
+import { reactive, onMounted, toRefs } from 'vue';
 export default {
   setup(props) {
     let state = reactive({
-      container: null
-    })
+      container: null,
+    });
     const view = {
       top: 100,
-      bottom: 0
-    }
+      bottom: 0,
+    };
     onMounted(() => {
-      state.container = document.getElementsByClassName('container')[0]
-    })
+      state.container = document.getElementsByClassName('container')[0];
+    });
     return {
       view,
-      ...toRefs(state)
-    }
-  }
-}
+      ...toRefs(state),
+    };
+  },
+};
 </script>
 ```
 
@@ -98,26 +102,26 @@ export default {
 </template>
 
 <script>
-import { reactive, onMounted, toRefs } from 'vue'
+import { reactive, onMounted, toRefs } from 'vue';
 
 export default {
   setup(props) {
     let state = reactive({
-      scrollTarget: null
-    })
+      scrollTarget: null,
+    });
     const view = {
       top: 100,
-      bottom: 0
-    }
+      bottom: 0,
+    };
     onMounted(() => {
-      state.scrollTarget = document.getElementsByClassName('scrollTarget')[0]
-    })
+      state.scrollTarget = document.getElementsByClassName('scrollTarget')[0];
+    });
     return {
       view,
-      ...toRefs(state)
-    }
-  }
-}
+      ...toRefs(state),
+    };
+  },
+};
 </script>
 ```
 
diff --git a/packages/devui-vue/docs/components/switch/index.md b/packages/devui-vue/docs/components/switch/index.md
index 49c636369f..f9fc378ca5 100644
--- a/packages/devui-vue/docs/components/switch/index.md
+++ b/packages/devui-vue/docs/components/switch/index.md
@@ -2,13 +2,17 @@
 
 开/关切换组件。
 
-#### 何时使用
-
+:::tip 何时使用
 当两种状态需要来回切换控制时，比如启用/禁用。
+:::
+
+## 用法
 
 ### 尺寸
 
-:::demo 可选，`sm | md | lg`，默认为`md`。
+可选，`sm | md | lg`，默认为`md`。
+
+:::demo
 
 ```vue
 <template>
@@ -44,7 +48,9 @@ export default defineComponent({
 
 ### 禁用
 
-:::demo 可选，是否禁用开关，默认为 false。
+可选，是否禁用开关，默认为 `false`。
+
+:::demo
 
 ```vue
 <template>
@@ -71,7 +77,9 @@ export default defineComponent({
 
 ### 自定义样式
 
-:::demo 可选，可设置文字说明/图标
+可选，可设置文字说明/图标。
+
+:::demo
 
 ```vue
 <template>
@@ -98,7 +106,6 @@ export default defineComponent({
       <template #uncheckedContent>关</template>
     </d-switch>
   </div>
-
 </template>
 <script>
 import { defineComponent, ref } from 'vue';
@@ -126,7 +133,9 @@ export default defineComponent({
 
 ### 自定义绑定值
 
-:::demo switch 打开关闭时可以自定义值，打开时为 active-value，关闭时为 inactive-value
+switch 打开关闭时可以自定义值，打开时为 `active-value`，关闭时为 `inactive-value`。
+
+:::demo
 
 ```vue
 <template>
@@ -157,13 +166,13 @@ export default defineComponent({
 ### Switch 参数
 
 | 参数           | 类型                          | 默认  | 说明                         | 跳转 Demo                     |
-| :------------- |:----------------------------| :---- | :--------------------------- | :---------------------------- |
-| v-model        | `string\                    | number \|boolean` | --    | 绑定值                       | [基本用法](#size)             |
-| size           | [ISwitchSize](#iswitchsize) | `md`  | 可选，开关尺寸大小           | [size](#size)                 |
-| color          | `string`                    | --    | 可选，开关打开时的自定义颜色 | [自定义样式](#自定义样式)     |
-| disabled       | `boolean`                   | false | 可选，是否禁用开关           | [基本用法](#size)             |
-| active-value   | `string\                    | number \|boolean` | true  | 可选，开关打开时的值         | [自定义绑定值](#自定义绑定值) |
-| inactive-value | `string\                    | number \|boolean` | true  | 可选，开关关闭时的值         | [自定义绑定值](#自定义绑定值) |
+| :------------- | :---------------------------- | :---- | :--------------------------- | :---------------------------- |
+| v-model        | `string \| number \| boolean` | --    | 绑定值                       | [基本用法](#size)             |
+| size           | [ISwitchSize](#iswitchsize)   | `md`  | 可选，开关尺寸大小           | [size](#size)                 |
+| color          | `string`                      | --    | 可选，开关打开时的自定义颜色 | [自定义样式](#自定义样式)     |
+| disabled       | `boolean`                     | false | 可选，是否禁用开关           | [基本用法](#size)             |
+| active-value   | `string \| number \| boolean` | true  | 可选，开关打开时的值         | [自定义绑定值](#自定义绑定值) |
+| inactive-value | `string \| number \| boolean` | true  | 可选，开关关闭时的值         | [自定义绑定值](#自定义绑定值) |
 
 ### Switch 事件
 
@@ -179,7 +188,9 @@ export default defineComponent({
 | uncheckedContent | 关闭状态的文案 | --   | [自定义样式](#自定义样式) |
 
 ### Switch 类型定义
+
 #### ISwitchSize
+
 ```ts
 type ISwitchSize = 'sm' | 'md' | 'lg';
 ```
diff --git a/packages/devui-vue/docs/components/table/index.md b/packages/devui-vue/docs/components/table/index.md
index f320ed3d41..98398667c5 100644
--- a/packages/devui-vue/docs/components/table/index.md
+++ b/packages/devui-vue/docs/components/table/index.md
@@ -2,14 +2,20 @@
 
 展示行列数据。
 
-#### 何时使用
+:::tip 何时使用
 
 1. 当有大量结构化的数据需要展现时；
 2. 当需要对数据进行排序、过滤、自定义操作等复杂行为时。
 
+:::
+
+## 用法
+
 ### 基本用法
 
-:::demo 简单表格，`d-table`组件上的`data`属性传入要展示的数据，`d-column`组件上通过`field`传入对应列内容的字段名，`header`传入对应列的标题。
+简单表格，`d-table`组件上的`data`属性传入要展示的数据，`d-column`组件上通过`field`传入对应列内容的字段名，`header`传入对应列的标题。
+
+:::demo
 
 ```vue
 <template>
@@ -63,7 +69,9 @@ export default defineComponent({
 
 ### 表格样式
 
-:::demo `table-layout`参数设置表格的布局方式，目前支持`fixed`和`auto`两种类型；`striped`参数设置是否显示斑马纹；`header-bg`参数设置是否显示表头背景色；`size`参数设置表格大小；`border-type`设置表格边框样式。
+`table-layout`参数设置表格的布局方式，目前支持`fixed`和`auto`两种类型；`striped`参数设置是否显示斑马纹；`header-bg`参数设置是否显示表头背景色；`size`参数设置表格大小；`border-type`设置表格边框样式。
+
+:::demo
 
 ```vue
 <template>
@@ -216,7 +224,9 @@ export default defineComponent({
 
 ### 表格交互
 
-:::demo 通过添加一个`d-column`并且设置`type`属性为`checkable`即可实现表格的多选功能。`getCheckedRows`方法可以获取已选择的列表。`toggleRowSelection`方法可以切换某一行的选中状态。通过`cell-click`事件监听单元格点击，事件回调参数包含行索引、列索引、行数据、列数据。在列上配置`resizeable`属性，可实现该列拖动改变宽度，`min-width`和`max-width`设置可拖动范围，事件`resize-start`、`resizing`、`resize-end`分别在拖动开始时、进行中、结束后触发。
+通过添加一个`d-column`并且设置`type`属性为`checkable`即可实现表格的多选功能。`getCheckedRows`方法可以获取已选择的列表。`toggleRowSelection`方法可以切换某一行的选中状态。通过`cell-click`事件监听单元格点击，事件回调参数包含行索引、列索引、行数据、列数据。在列上配置`resizeable`属性，可实现该列拖动改变宽度，`min-width`和`max-width`设置可拖动范围，事件`resize-start`、`resizing`、`resize-end`分别在拖动开始时、进行中、结束后触发。
+
+:::demo
 
 ```vue
 <template>
@@ -368,7 +378,9 @@ export default defineComponent({
 
 ### 索引列
 
-:::demo 通过添加一个`d-column`并且设置`type`参数为`index`即可给表格添加索引。索引列的表头默认展示`#`，可通过`header`参数传入指定内容。
+通过添加一个`d-column`并且设置`type`参数为`index`即可给表格添加索引。索引列的表头默认展示`#`，可通过`header`参数传入指定内容。
+
+:::demo
 
 ```vue
 <template>
@@ -425,7 +437,9 @@ export default defineComponent({
 
 ### 自定义列
 
-:::demo 通过`d-column`子组件提供的`default`插槽可以实现自定义列，插槽提供`row`和`rowIndex`两个参数，分别代表行数据和行索引值。
+通过`d-column`子组件提供的`default`插槽可以实现自定义列，插槽提供`row`和`rowIndex`两个参数，分别代表行数据和行索引值。
+
+:::demo
 
 ```vue
 <template>
@@ -492,7 +506,9 @@ export default defineComponent({
 
 ### 编辑单元格
 
-:::demo 通过`d-column`子组件提供的`cell`、`cellEdit`插槽以及属性`type`设置为`editable`实现编辑单元格。此功能需配合`row-key`属性使用。
+通过`d-column`子组件提供的`cell`、`cellEdit`插槽以及属性`type`设置为`editable`实现编辑单元格。此功能需配合`row-key`属性使用。
+
+:::demo
 
 ```vue
 <template>
@@ -601,7 +617,9 @@ export default defineComponent({
 
 ### 自定义表头
 
-:::demo 通过`d-column`子组件提供的`header`插槽可以实现自定义表头。
+通过`d-column`子组件提供的`header`插槽可以实现自定义表头。
+
+:::demo
 
 ```vue
 <template>
@@ -664,7 +682,9 @@ export default defineComponent({
 
 ### 空数据模板
 
-:::demo 当传入的数据为空时，默认展示空数据模板。
+当传入的数据为空时，默认展示空数据模板。
+
+:::demo
 
 ```vue
 <template>
@@ -732,7 +752,9 @@ export default defineComponent({
 
 ### 固定表头
 
-:::demo `fix-header`参数可以设置是否固定表头，使之不随内容滚动。
+`fix-header`参数可以设置是否固定表头，使之不随内容滚动。
+
+:::demo
 
 ```vue
 <template>
@@ -810,7 +832,9 @@ export default defineComponent({
 
 ### 固定列
 
-:::demo 当表格列过多时，固定列有利于用户在左右滑动时，能够便捷的进行数据定位与对比，通过`fixed-left`和`fixed-right`来配置。
+当表格列过多时，固定列有利于用户在左右滑动时，能够便捷的进行数据定位与对比，通过`fixed-left`和`fixed-right`来配置。
+
+:::demo
 
 ```vue
 <template>
@@ -889,7 +913,9 @@ export default defineComponent({
 
 ### 合并单元格
 
-:::demo 通过`span-method`方法可以自定义合并单元格，方法参数是一个对象，对象包含属性如下：当前行`row`、当前列`column`、当前行索引`rowIndex`、当前列索引`columnIndex`。该方法可以返回包含两个元素的数组，第一个元素是`rowspan`，第二个元素是`colspan`；也可以返回一个对象，属性为`rowspan`和`colspan`。
+通过`span-method`方法可以自定义合并单元格，方法参数是一个对象，对象包含属性如下：当前行`row`、当前列`column`、当前行索引`rowIndex`、当前列索引`columnIndex`。该方法可以返回包含两个元素的数组，第一个元素是`rowspan`，第二个元素是`colspan`；也可以返回一个对象，属性为`rowspan`和`colspan`。
+
+:::demo
 
 ```vue
 <template>
@@ -954,7 +980,9 @@ export default defineComponent({
 
 ### 表头分组
 
-:::demo `d-column`嵌套`d-column`即可实现表头分组。
+`d-column`嵌套`d-column`即可实现表头分组。
+
+:::demo
 
 ```vue
 <template>
@@ -1010,7 +1038,9 @@ export default defineComponent({
 
 ### 列排序
 
-:::demo `sortable`参数设置为`true`可以支持列排序；`sort-direction`设置初始化时的排序方式；`sort-method`用来定义每一列的排序方法；`sort-change`是排序的回调事件，返回该列的排序信息：`field`排序字段和`direction`排序方向。
+`sortable`参数设置为`true`可以支持列排序；`sort-direction`设置初始化时的排序方式；`sort-method`用来定义每一列的排序方法；`sort-change`是排序的回调事件，返回该列的排序信息：`field`排序字段和`direction`排序方向。
+
+:::demo
 
 ```vue
 <template>
@@ -1074,7 +1104,9 @@ export default defineComponent({
 
 ### 列筛选
 
-:::demo `filterable`参数设置为`true`可以支持列筛选；`filter-multiple`设置筛选列表是否可多选，默认为`true`；`filter-list`用来定义筛选列表；`filter-change`是筛选的回调事件，返回该列选中的数据：单选时返回选中项，多选时返回选中项数组。
+`filterable`参数设置为`true`可以支持列筛选；`filter-multiple`设置筛选列表是否可多选，默认为`true`；`filter-list`用来定义筛选列表；`filter-change`是筛选的回调事件，返回该列选中的数据：单选时返回选中项，多选时返回选中项数组。
+
+:::demo
 
 ```vue
 <template>
@@ -1248,7 +1280,9 @@ export default defineComponent({
 
 ### 树形表格
 
-:::demo 支持树类型的数据展示。当 row 中包含`children`字段时，被视为树形数据。渲染嵌套数据需要`row-key`。使用`indent`可以控制子节点的缩进。暂不支持树形表格和展开行同时使用，展开行优先级较高。
+支持树类型的数据展示。当 row 中包含`children`字段时，被视为树形数据。渲染嵌套数据需要`row-key`。使用`indent`可以控制子节点的缩进。暂不支持树形表格和展开行同时使用，展开行优先级较高。
+
+:::demo
 
 ```vue
 <template>
@@ -1367,7 +1401,9 @@ export default defineComponent({
 
 ### 懒加载
 
-:::demo 使用 lazy 启用懒加载，当滚动表格底部时到触发 loadMore 事件实现懒加载。
+使用 lazy 启用懒加载，当滚动表格底部时到触发 loadMore 事件实现懒加载。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/tag/index.md b/packages/devui-vue/docs/components/tag/index.md
index 6b7c0023b6..497aeca4c1 100644
--- a/packages/devui-vue/docs/components/tag/index.md
+++ b/packages/devui-vue/docs/components/tag/index.md
@@ -2,13 +2,18 @@
 
 标签展示组件。
 
-#### 何时使用
+:::tip 何时使用
 
 用户需要展示多个标签时。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 由`type`属性来选择 tag 的类型，也可以通过`color`属性来自定义主题色
+由`type`属性来选择 tag 的类型，也可以通过`color`属性来自定义主题色。
+
+:::demo
 
 ```vue
 <template>
@@ -55,7 +60,9 @@ export default defineComponent({
 
 ### 自定义
 
-:::demo 使用默认插槽可自由定制你的 tag
+使用默认插槽可自由定制你的 tag。
+
+:::demo
 
 ```vue
 <template>
@@ -84,7 +91,9 @@ export default defineComponent({
 
 ### 可被选中
 
-:::demo 由`checked`属性来设置 tag 选中的状态，可通过点击来改变`checked`的值
+由`checked`属性来设置 tag 选中的状态，可通过点击来改变`checked`的值
+
+:::demo
 
 ```vue
 <template>
@@ -112,7 +121,9 @@ export default defineComponent({
 
 ### 可移除的
 
-:::demo 由`deletable`属性来设置标签是否可删除
+由`deletable`属性来设置标签是否可删除。
+
+:::demo
 
 ```vue
 <template>
@@ -142,7 +153,9 @@ export default defineComponent({
 
 ### 不同尺寸
 
-:::demo Tag 默认的是 md 尺寸，有 lg、md、sm 三种尺寸可选
+Tag 默认的是 md 尺寸，有 lg、md、sm 三种尺寸可选。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/timeline/index.md b/packages/devui-vue/docs/components/timeline/index.md
index c111d11459..25f7833f68 100644
--- a/packages/devui-vue/docs/components/timeline/index.md
+++ b/packages/devui-vue/docs/components/timeline/index.md
@@ -9,6 +9,7 @@
 ### 基本用法
 
 通过 `direction` 属性配置时间线排列方向，默认值为`vertical`。
+
 :::demo
 
 ```vue
diff --git a/packages/devui-vue/docs/components/tooltip/index.md b/packages/devui-vue/docs/components/tooltip/index.md
index 8e3e53466b..e881166056 100644
--- a/packages/devui-vue/docs/components/tooltip/index.md
+++ b/packages/devui-vue/docs/components/tooltip/index.md
@@ -2,13 +2,17 @@
 
 文字提示组件。
 
-#### 何时使用
-
+:::tip 何时使用
 用户鼠标移动到文字上，需要进一步的提示时使用。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 默认在触发元素的上方展示提示信息，可通过`position`更改展示位置；`content`可设置提示信息；`show-animation`控制是否开启动画;`disabled`提示组件是否可用;`enterable`鼠标是否可以进入 tooltip;。
+默认在触发元素的上方展示提示信息，可通过`position`更改展示位置；`content`可设置提示信息；`show-animation`控制是否开启动画；`disabled`提示组件是否可用；`enterable`鼠标是否可以进入 tooltip。
+
+:::demo
 
 ```vue
 <template>
@@ -64,7 +68,9 @@ export default defineComponent({
 
 ### 延时触发
 
-:::demo 鼠标移入的时长超过 `mouse-enter-delay` 毫秒之后才会触发，以防止用户无意划过导致的闪现，默认值是 150 毫秒；鼠标移出之后，再经过`mouse-leave-delay`毫秒后，Tooltip 组件才会隐藏，默认值是 100 毫秒。
+鼠标移入的时长超过 `mouse-enter-delay` 毫秒之后才会触发，以防止用户无意划过导致的闪现，默认值是 150 毫秒；鼠标移出之后，再经过`mouse-leave-delay`毫秒后，Tooltip 组件才会隐藏，默认值是 100 毫秒。
+
+:::demo
 
 ```vue
 <template>
@@ -125,18 +131,18 @@ export default defineComponent({
 
 ### Tooltip 参数
 
-| 参数名            | 类型                                               | 默认值 | 说明                                                                                                              | 跳转 Demo             |
-| :---------------- | :------------------------------------------------- | :----- | :---------------------------------------------------------------------------------------------------------------- | :-------------------- |
-| content           | `string`                                           | --     | 可选，Tooltip 显示内容                                                                                            | [基本用法](#基本用法) |
-| position          | [BasePlacement \| BasePlacement[]](#baseplacement) | top    | 可选，Tooltip 显示位置                                                                                            | [基本用法](#基本用法) |
-| align             | `start \| end \| null`                             | null   | 可选，对齐方式，默认居中对齐。                                                                                    |                       |
-| show-animation    | `boolean`                                          | true   | 可选，是否显示动画                                                                                                | [基本用法](#基本用法) |
-| mouse-enter-delay | `number`                                           | 150    | 可选，鼠标移入后延时多久才显示 Tooltip，单位是 ms                                                                 | [延时触发](#延时触发) |
-| mouse-leave-delay | `number`                                           | 100    | 可选，鼠标移出后延时多久才隐藏 Tooltip，单位是 ms                                                                 | [延时触发](#延时触发) |
-| disabled          | `boolean`                                          | false  | 可选，Tooltip 是否可用                                                                                            | [基本用法](#基本用法) |
-| enterable         | `boolean`                                          | true   | 可选，鼠标是否可以进入到 tooltip 中                                                                               | [基本用法](#基本用法) |
-| hide-after        | `number`                                           | 0      | 可选，tooltip 出现后自动隐藏延时，单位为 ms                                                                       | [基本用法](#基本用法) |
-| overlay-class     | `string`                                           | ''     | 可选，自定义弹出层的样式                                                                                          |                       |
+| 参数名            | 类型                                               | 默认值 | 说明                                                                                                        | 跳转 Demo             |
+| :---------------- | :------------------------------------------------- | :----- | :---------------------------------------------------------------------------------------------------------- | :-------------------- |
+| content           | `string`                                           | --     | 可选，Tooltip 显示内容                                                                                      | [基本用法](#基本用法) |
+| position          | [BasePlacement \| BasePlacement[]](#baseplacement) | top    | 可选，Tooltip 显示位置                                                                                      | [基本用法](#基本用法) |
+| align             | `start \| end \| null`                             | null   | 可选，对齐方式，默认居中对齐。                                                                              |                       |
+| show-animation    | `boolean`                                          | true   | 可选，是否显示动画                                                                                          | [基本用法](#基本用法) |
+| mouse-enter-delay | `number`                                           | 150    | 可选，鼠标移入后延时多久才显示 Tooltip，单位是 ms                                                           | [延时触发](#延时触发) |
+| mouse-leave-delay | `number`                                           | 100    | 可选，鼠标移出后延时多久才隐藏 Tooltip，单位是 ms                                                           | [延时触发](#延时触发) |
+| disabled          | `boolean`                                          | false  | 可选，Tooltip 是否可用                                                                                      | [基本用法](#基本用法) |
+| enterable         | `boolean`                                          | true   | 可选，鼠标是否可以进入到 tooltip 中                                                                         | [基本用法](#基本用法) |
+| hide-after        | `number`                                           | 0      | 可选，tooltip 出现后自动隐藏延时，单位为 ms                                                                 | [基本用法](#基本用法) |
+| overlay-class     | `string`                                           | ''     | 可选，自定义弹出层的样式                                                                                    |                       |
 | teleport          | `string \| HTMLElement`                            | 'body' | 可选，挂载节点，等同于 Teleport 组件的[to 属性](https://cn.vuejs.org/api/built-in-components.html#teleport) |
 
 ### Tooltip 插槽
diff --git a/packages/devui-vue/docs/components/tree/index.md b/packages/devui-vue/docs/components/tree/index.md
index 4ce0c0831e..567c7976f3 100644
--- a/packages/devui-vue/docs/components/tree/index.md
+++ b/packages/devui-vue/docs/components/tree/index.md
@@ -2,13 +2,17 @@
 
 一种呈现嵌套结构的组件。
 
-#### 何时使用
-
+:::tip 何时使用
 文件夹、组织架构、生物分类、国家地区等等，世间万物的大多数结构都是树形结构。使用树组件可以完整展现其中的层级关系，并具有展开/收起、选择等交互功能。
+:::
+
+## 用法
 
 ### 基本用法
 
-:::demo 展示嵌套树形结构的呈现、连接线、展开/收起、点击选择等功能。动画效果依赖树节点的高度，默认高度为`30px`，自定义树节点时，为了保证动画效果正常显示，建议显式设置树节点高度。
+展示嵌套树形结构的呈现、连接线、展开/收起、点击选择等功能。动画效果依赖树节点的高度，默认高度为`30px`，自定义树节点时，为了保证动画效果正常显示，建议显式设置树节点高度。
+
+:::demo
 
 ```vue
 <template>
@@ -45,7 +49,9 @@ export default defineComponent({
 
 ### 节点懒加载
 
-:::demo 通过设置该节点 `isLeaf` 参数为 `false`, 组件回调 `lazyLoad` 方法实现节点懒加载。
+通过设置该节点 `isLeaf` 参数为 `false`, 组件回调 `lazyLoad` 方法实现节点懒加载。
+
+:::demo
 
 ```vue
 <template>
@@ -114,7 +120,9 @@ export default defineComponent({
 
 ### 可勾选
 
-:::demo 通过`check`开启勾选功能。
+通过`check`开启勾选功能。
+
+:::demo
 
 ```vue
 <template>
@@ -214,7 +222,9 @@ export default defineComponent({
 
 ### 默认状态
 
-:::demo 通过`expanded`/`selected`/`checked`分别设置默认展开/收起、点击选择、勾选状态。
+通过`expanded`/`selected`/`checked`分别设置默认展开/收起、点击选择、勾选状态。
+
+:::demo
 
 ```vue
 <template>
@@ -259,7 +269,9 @@ export default defineComponent({
 
 ### 禁用状态
 
-:::demo 通过`disableToggle`/`disableSelect`/`disableCheck`分别禁用展开/收起、点击选择、勾选状态。
+通过`disableToggle`/`disableSelect`/`disableCheck`分别禁用展开/收起、点击选择、勾选状态。
+
+:::demo
 
 ```vue
 <template>
@@ -307,7 +319,9 @@ export default defineComponent({
 
 ### 自定义图标
 
-:::demo 通过`content`插槽可以自定义节点内容，比如在节点内容前面增加一个图标；通过`icon`插槽可以自定义展开/收起的图标。
+通过`content`插槽可以自定义节点内容，比如在节点内容前面增加一个图标；通过`icon`插槽可以自定义展开/收起的图标。
+
+:::demo
 
 ```vue
 <template>
@@ -470,7 +484,9 @@ export default defineComponent({
 
 ### 操作按钮
 
-:::demo 可定义外部操作按钮、悬浮按钮。
+可定义外部操作按钮、悬浮按钮。
+
+:::demo
 
 ```vue
 <template>
@@ -545,7 +561,9 @@ export default defineComponent({
 
 ### 搜索过滤
 
-:::demo 通过 `treeFactory` 中的`searchTree`方法可以搜索节点或者过滤节点。
+通过 `treeFactory` 中的`searchTree`方法可以搜索节点或者过滤节点。
+
+:::demo
 
 ```vue
 <template>
@@ -710,7 +728,9 @@ export default defineComponent({
 
 ### 虚拟滚动
 
-:::demo 使用虚拟滚动处理大数据量的加载问题。
+使用虚拟滚动处理大数据量的加载问题。
+
+:::demo
 
 ```vue
 <template>
@@ -769,7 +789,9 @@ export default defineComponent({
 
 ### 可拖拽树
 
-:::demo 通过 OperableTree 的 dragdrop 属性配置节点的拖拽功能，并支持外部元素拖拽入树。
+通过 OperableTree 的 dragdrop 属性配置节点的拖拽功能，并支持外部元素拖拽入树。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/virtual-list/index.md b/packages/devui-vue/docs/components/virtual-list/index.md
index 78eb1962b1..0ec9130d81 100644
--- a/packages/devui-vue/docs/components/virtual-list/index.md
+++ b/packages/devui-vue/docs/components/virtual-list/index.md
@@ -8,7 +8,9 @@
 
 ### 基本用法
 
-:::demo 渲染大量数据
+渲染大量数据
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/quick-start/index.md b/packages/devui-vue/docs/quick-start/index.md
index 8f540f64ee..3315fca57f 100644
--- a/packages/devui-vue/docs/quick-start/index.md
+++ b/packages/devui-vue/docs/quick-start/index.md
@@ -2,7 +2,7 @@
 
 引导您如何在项目中使用`Vue DevUI`
 
-### Vue版本
+## Vue 版本
 
 当前支持的 Vue 版本`^3.0.0`
 

From 88f6e3f323c4373385700f1fa0df0fd88db68327 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 19:07:36 +0800
Subject: [PATCH 11/30] chore(deps): update dependencies

- vite@4 installed instead of vite@5 by virtue of requirements relations
- vitepress@latest is installed
- other updates are safe update

Related Issue: #1879
---
 packages/devui-vue/package.json |   91 +-
 pnpm-lock.yaml                  | 4978 +++++++++++++++++++++++--------
 2 files changed, 3847 insertions(+), 1222 deletions(-)

diff --git a/packages/devui-vue/package.json b/packages/devui-vue/package.json
index 4790f70d65..486cf69e10 100644
--- a/packages/devui-vue/package.json
+++ b/packages/devui-vue/package.json
@@ -24,9 +24,9 @@
   "module": "vue-devui.es.js",
   "style": "style.css",
   "scripts": {
-    "dev": "pnpm generate:theme && vitepress dev docs",
+    "dev": "pnpm run register:components && pnpm generate:theme && vitepress dev docs",
     "dev:site": "vite --port 3010",
-    "build": "pnpm generate:theme && node --max-old-space-size=8192 node_modules/vitepress/bin/vitepress.js build docs && cp public/* docs/.vitepress/dist/assets && cp docs/assets/* docs/.vitepress/dist/assets",
+    "build": "pnpm run register:components && pnpm generate:theme && node --max-old-space-size=8192 node_modules/vitepress/bin/vitepress.js build docs && cp public/* docs/.vitepress/dist/assets && cp docs/assets/* docs/.vitepress/dist/assets",
     "build:lib": "pnpm predev -- -e prod && pnpm build:components && pnpm release",
     "test": "jest --config jest.config.js",
     "coverage": "jest --config jest.config.js --coverage",
@@ -40,89 +40,90 @@
     "predev": "node ./devui-cli/index.js create -t vue-devui --ignore-parse-error",
     "prebuild": "node ./devui-cli/index.js create -t vue-devui --ignore-parse-error",
     "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s",
-    "devui-cli": "devui"
+    "devui-cli": "devui",
+    "register:components": "vitepress-rc"
   },
   "peerDependencies": {
     "vue": "^3.3"
   },
   "dependencies": {
-    "@babel/helper-hoist-variables": "^7.22.5",
-    "@devui-design/icons": "^1.3.0",
+    "@babel/helper-hoist-variables": "^7.24.7",
+    "@devui-design/icons": "^1.4.0",
     "@floating-ui/dom": "1.2.5",
     "@iktakahiro/markdown-it-katex": "^4.0.1",
     "@types/codemirror": "0.0.97",
-    "@types/lodash-es": "^4.17.4",
-    "@vue/shared": "^3.2.33",
+    "@types/lodash-es": "^4.17.12",
+    "@vue/shared": "^3.4.29",
     "@vueuse/core": "8.9.4",
-    "async-validator": "^4.0.7",
+    "async-validator": "^4.2.5",
     "clipboard": "^2.0.11",
     "clipboard-copy": "^4.0.1",
     "codemirror": "5.63.3",
-    "dayjs": "^1.11.3",
-    "devui-theme": "workspace:^0.0.1",
-    "diff2html": "^3.4.35",
+    "dayjs": "^1.11.11",
+    "devui-theme": "workspace:^",
+    "diff2html": "^3.4.48",
     "echarts": "5.3.3",
-    "fs-extra": "^10.0.0",
-    "highlight.js": "^11.6.0",
+    "fs-extra": "^10.1.0",
+    "highlight.js": "^11.9.0",
     "katex": "^0.12.0",
     "lodash": "^4.17.21",
-    "lodash-es": "^4.17.20",
+    "lodash-es": "^4.17.21",
     "markdown-it": "12.2.0",
     "markdown-it-emoji": "^3.0.0",
     "markdown-it-plantuml": "^1.4.1",
     "mermaid": "9.1.1",
-    "mitt": "^3.0.0",
+    "mitt": "^3.0.1",
     "monaco-editor": "0.34.0",
     "rxjs": "^7.8.1",
     "uuid": "^9.0.1",
-    "vue": "^3.3.4",
-    "vue-router": "^4.0.3",
-    "xss": "^1.0.14"
+    "vue": "^3.4.29",
+    "vue-router": "^4.3.3",
+    "xss": "^1.0.15"
   },
   "devDependencies": {
-    "@babel/parser": "^7.15.5",
-    "@babel/preset-env": "^7.14.5",
-    "@babel/preset-typescript": "^7.14.5",
-    "@babel/traverse": "^7.15.4",
+    "@babel/parser": "^7.24.7",
+    "@babel/preset-env": "^7.24.7",
+    "@babel/preset-typescript": "^7.24.7",
+    "@babel/traverse": "^7.24.7",
     "@commitlint/cli": "^11.0.0",
     "@commitlint/config-conventional": "^11.0.0",
-    "@docsearch/css": "^3.3.0",
-    "@docsearch/js": "^3.3.0",
+    "@docsearch/css": "^3.6.0",
+    "@docsearch/js": "^3.6.0",
     "@types/jest": "^26.0.24",
     "@types/markdown-it": "^12.2.3",
-    "@types/node": "^16.11.6",
-    "@typescript-eslint/eslint-plugin": "^4.27.0",
-    "@typescript-eslint/parser": "^4.27.0",
-    "@vitejs/plugin-vue": "^1.3.0",
-    "@vitejs/plugin-vue-jsx": "^1.1.0",
-    "@vue/babel-plugin-jsx": "^1.0.6",
-    "@vue/compiler-sfc": "^3.0.5",
-    "@vue/test-utils": "^2.0.0-rc.9",
+    "@types/node": "^20.14.7",
+    "@typescript-eslint/eslint-plugin": "^4.33.0",
+    "@typescript-eslint/parser": "^4.33.0",
+    "@vitejs/plugin-vue": "^4.6.2",
+    "@vitejs/plugin-vue-jsx": "^1.3.10",
+    "@vue/babel-plugin-jsx": "^1.2.2",
+    "@vue/compiler-sfc": "^3.4.29",
+    "@vue/test-utils": "^2.4.6",
     "@vuedx/typecheck": "^0.4.1",
     "@vuedx/typescript-plugin-vue": "^0.4.1",
-    "babel-jest": "^27.0.2",
+    "babel-jest": "^27.5.1",
     "chalk": "^4.1.2",
-    "commander": "^8.1.0",
+    "commander": "^8.3.0",
     "conventional-changelog-cli": "^2.2.2",
-    "devui-cli": "workspace:^0.0.2",
+    "devui-cli": "workspace:^",
     "escape-html": "^1.0.3",
     "fflate": "^0.7.4",
-    "inquirer": "^8.1.2",
-    "jest": "^27.0.4",
+    "inquirer": "^8.2.6",
+    "jest": "^27.5.1",
     "markdown-it": "^13.0.1",
     "markdown-it-container": "^3.0.0",
     "ora": "^5.4.1",
     "patch-vue-directive-ssr": "^0.0.1",
     "path-exists": "^5.0.0",
     "prismjs": "^1.29.0",
-    "sass": "^1.32.2",
-    "shelljs": "^0.8.4",
-    "typescript": "^4.3.2",
-    "vite": "^2.4.4",
-    "vite-plugin-md": "^0.6.0",
+    "sass": "^1.77.6",
+    "shelljs": "^0.8.5",
+    "typescript": "^4.9.5",
+    "vite": "^4.5.3",
+    "vite-plugin-md": "^0.21.5",
     "vite-svg-loader": "^2.2.0",
-    "vitepress": "0.20.1",
-    "vitepress-theme-demoblock": "1.3.2",
-    "vue-tsc": "0.38.8"
+    "vitepress": "1.2.3",
+    "vitepress-theme-demoblock": "3.0.7",
+    "vue-tsc": "2.0.21"
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 617f00dc4a..fa4b83f65d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -132,7 +132,7 @@ importers:
         version: 4.33.0(eslint@7.32.0)(typescript@4.9.5)
       '@vitejs/plugin-vue':
         specifier: ^2.2.0
-        version: 2.3.4(vite@2.9.18(sass@1.77.2))(vue@3.4.27(typescript@4.9.5))
+        version: 2.3.4(vite@2.9.18(sass@1.77.6))(vue@3.4.27(typescript@4.9.5))
       commander:
         specifier: ^9.0.0
         version: 9.5.0
@@ -147,7 +147,7 @@ importers:
         version: 4.9.5
       vite:
         specifier: ^2.8.0
-        version: 2.9.18(sass@1.77.2)
+        version: 2.9.18(sass@1.77.6)
       vue-tsc:
         specifier: ^0.29.8
         version: 0.29.8(typescript@4.9.5)
@@ -157,10 +157,10 @@ importers:
   packages/devui-vue:
     dependencies:
       '@babel/helper-hoist-variables':
-        specifier: ^7.22.5
-        version: 7.24.6
+        specifier: ^7.24.7
+        version: 7.24.7
       '@devui-design/icons':
-        specifier: ^1.3.0
+        specifier: ^1.4.0
         version: 1.4.0
       '@floating-ui/dom':
         specifier: 1.2.5
@@ -172,16 +172,16 @@ importers:
         specifier: 0.0.97
         version: 0.0.97
       '@types/lodash-es':
-        specifier: ^4.17.4
+        specifier: ^4.17.12
         version: 4.17.12
       '@vue/shared':
-        specifier: ^3.2.33
-        version: 3.4.27
+        specifier: ^3.4.29
+        version: 3.4.29
       '@vueuse/core':
         specifier: 8.9.4
-        version: 8.9.4(vue@3.4.27(typescript@4.9.5))
+        version: 8.9.4(vue@3.4.29(typescript@4.9.5))
       async-validator:
-        specifier: ^4.0.7
+        specifier: ^4.2.5
         version: 4.2.5
       clipboard:
         specifier: ^2.0.11
@@ -193,22 +193,22 @@ importers:
         specifier: 5.63.3
         version: 5.63.3
       dayjs:
-        specifier: ^1.11.3
+        specifier: ^1.11.11
         version: 1.11.11
       devui-theme:
-        specifier: workspace:^0.0.1
-        version: link:../devui-theme/build
+        specifier: workspace:^
+        version: link:../devui-theme
       diff2html:
-        specifier: ^3.4.35
+        specifier: ^3.4.48
         version: 3.4.48
       echarts:
         specifier: 5.3.3
         version: 5.3.3
       fs-extra:
-        specifier: ^10.0.0
+        specifier: ^10.1.0
         version: 10.1.0
       highlight.js:
-        specifier: ^11.6.0
+        specifier: ^11.9.0
         version: 11.9.0
       katex:
         specifier: ^0.12.0
@@ -217,7 +217,7 @@ importers:
         specifier: ^4.17.21
         version: 4.17.21
       lodash-es:
-        specifier: ^4.17.20
+        specifier: ^4.17.21
         version: 4.17.21
       markdown-it:
         specifier: 12.2.0
@@ -232,7 +232,7 @@ importers:
         specifier: 9.1.1
         version: 9.1.1
       mitt:
-        specifier: ^3.0.0
+        specifier: ^3.0.1
         version: 3.0.1
       monaco-editor:
         specifier: 0.34.0
@@ -244,27 +244,27 @@ importers:
         specifier: ^9.0.1
         version: 9.0.1
       vue:
-        specifier: ^3.3.4
-        version: 3.4.27(typescript@4.9.5)
+        specifier: ^3.4.29
+        version: 3.4.29(typescript@4.9.5)
       vue-router:
-        specifier: ^4.0.3
-        version: 4.3.2(vue@3.4.27(typescript@4.9.5))
+        specifier: ^4.3.3
+        version: 4.3.3(vue@3.4.29(typescript@4.9.5))
       xss:
-        specifier: ^1.0.14
+        specifier: ^1.0.15
         version: 1.0.15
     devDependencies:
       '@babel/parser':
-        specifier: ^7.15.5
-        version: 7.24.6
+        specifier: ^7.24.7
+        version: 7.24.7
       '@babel/preset-env':
-        specifier: ^7.14.5
-        version: 7.24.6(@babel/core@7.24.6)
+        specifier: ^7.24.7
+        version: 7.24.7(@babel/core@7.24.7)
       '@babel/preset-typescript':
-        specifier: ^7.14.5
-        version: 7.24.6(@babel/core@7.24.6)
+        specifier: ^7.24.7
+        version: 7.24.7(@babel/core@7.24.7)
       '@babel/traverse':
-        specifier: ^7.15.4
-        version: 7.24.6
+        specifier: ^7.24.7
+        version: 7.24.7
       '@commitlint/cli':
         specifier: ^11.0.0
         version: 11.0.0
@@ -272,10 +272,10 @@ importers:
         specifier: ^11.0.0
         version: 11.0.0
       '@docsearch/css':
-        specifier: ^3.3.0
+        specifier: ^3.6.0
         version: 3.6.0
       '@docsearch/js':
-        specifier: ^3.3.0
+        specifier: ^3.6.0
         version: 3.6.0(@algolia/client-search@4.23.3)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(search-insights@2.14.0)
       '@types/jest':
         specifier: ^26.0.24
@@ -284,28 +284,28 @@ importers:
         specifier: ^12.2.3
         version: 12.2.3
       '@types/node':
-        specifier: ^16.11.6
-        version: 16.18.97
+        specifier: ^20.14.7
+        version: 20.14.7
       '@typescript-eslint/eslint-plugin':
-        specifier: ^4.27.0
+        specifier: ^4.33.0
         version: 4.33.0(@typescript-eslint/parser@4.33.0(eslint@7.32.0)(typescript@4.9.5))(eslint@7.32.0)(typescript@4.9.5)
       '@typescript-eslint/parser':
-        specifier: ^4.27.0
+        specifier: ^4.33.0
         version: 4.33.0(eslint@7.32.0)(typescript@4.9.5)
       '@vitejs/plugin-vue':
-        specifier: ^1.3.0
-        version: 1.10.2(vite@2.9.18(sass@1.77.2))
+        specifier: ^4.6.2
+        version: 4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5))
       '@vitejs/plugin-vue-jsx':
-        specifier: ^1.1.0
+        specifier: ^1.3.10
         version: 1.3.10
       '@vue/babel-plugin-jsx':
-        specifier: ^1.0.6
-        version: 1.2.2(@babel/core@7.24.6)
+        specifier: ^1.2.2
+        version: 1.2.2(@babel/core@7.24.7)
       '@vue/compiler-sfc':
-        specifier: ^3.0.5
-        version: 3.4.27
+        specifier: ^3.4.29
+        version: 3.4.29
       '@vue/test-utils':
-        specifier: ^2.0.0-rc.9
+        specifier: ^2.4.6
         version: 2.4.6
       '@vuedx/typecheck':
         specifier: ^0.4.1
@@ -314,19 +314,19 @@ importers:
         specifier: ^0.4.1
         version: 0.4.1
       babel-jest:
-        specifier: ^27.0.2
-        version: 27.5.1(@babel/core@7.24.6)
+        specifier: ^27.5.1
+        version: 27.5.1(@babel/core@7.24.7)
       chalk:
         specifier: ^4.1.2
         version: 4.1.2
       commander:
-        specifier: ^8.1.0
+        specifier: ^8.3.0
         version: 8.3.0
       conventional-changelog-cli:
         specifier: ^2.2.2
         version: 2.2.2
       devui-cli:
-        specifier: workspace:^0.0.2
+        specifier: workspace:^
         version: link:../devui-cli
       escape-html:
         specifier: ^1.0.3
@@ -335,10 +335,10 @@ importers:
         specifier: ^0.7.4
         version: 0.7.4
       inquirer:
-        specifier: ^8.1.2
+        specifier: ^8.2.6
         version: 8.2.6
       jest:
-        specifier: ^27.0.4
+        specifier: ^27.5.1
         version: 27.5.1
       markdown-it-container:
         specifier: ^3.0.0
@@ -356,32 +356,32 @@ importers:
         specifier: ^1.29.0
         version: 1.29.0
       sass:
-        specifier: ^1.32.2
-        version: 1.77.2
+        specifier: ^1.77.6
+        version: 1.77.6
       shelljs:
-        specifier: ^0.8.4
+        specifier: ^0.8.5
         version: 0.8.5
       typescript:
-        specifier: ^4.3.2
+        specifier: ^4.9.5
         version: 4.9.5
       vite:
-        specifier: ^2.4.4
-        version: 2.9.18(sass@1.77.2)
+        specifier: ^4.5.3
+        version: 4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0)
       vite-plugin-md:
-        specifier: ^0.6.0
-        version: 0.6.7(vite@2.9.18(sass@1.77.2))
+        specifier: ^0.21.5
+        version: 0.21.5(@vitejs/plugin-vue@4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5)))(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))
       vite-svg-loader:
         specifier: ^2.2.0
         version: 2.2.0
       vitepress:
-        specifier: 0.20.1
-        version: 0.20.1(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.2)(typescript@4.9.5)
+        specifier: 1.2.3
+        version: 1.2.3(@algolia/client-search@4.23.3)(@types/node@20.14.7)(async-validator@4.2.5)(postcss@8.4.38)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.6)(search-insights@2.14.0)(sugarss@2.0.0)(typescript@4.9.5)
       vitepress-theme-demoblock:
-        specifier: 1.3.2
-        version: 1.3.2(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.2)(typescript@4.9.5)
+        specifier: 3.0.7
+        version: 3.0.7(@algolia/client-search@4.23.3)(@types/node@20.14.7)(async-validator@4.2.5)(postcss@8.4.38)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.6)(search-insights@2.14.0)(sugarss@2.0.0)(typescript@4.9.5)
       vue-tsc:
-        specifier: 0.38.8
-        version: 0.38.8(typescript@4.9.5)
+        specifier: 2.0.21
+        version: 2.0.21(typescript@4.9.5)
 
   packages/devui-vue/build:
     dependencies:
@@ -687,10 +687,6 @@ packages:
     resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==}
     engines: {node: '>=6.0.0'}
 
-  '@arr/every@1.0.1':
-    resolution: {integrity: sha512-UQFQ6SgyJ6LX42W8rHCs8KVc0JS0tzVL9ct4XYedJukskYVWTo49tNiMEK9C2HTyarbNiT/RVIRSY82vH+6sTg==}
-    engines: {node: '>=4'}
-
   '@babel/code-frame@7.12.11':
     resolution: {integrity: sha512-Zt1yodBx1UcyiePMSkWnU4hPqhwq7hGi2nFL1LeA3EUl+q2LQx16MISgJ0+z7dnmgvP9QtIleuETGOiOH1RcIw==}
 
@@ -698,38 +694,54 @@ packages:
     resolution: {integrity: sha512-ZJhac6FkEd1yhG2AHOmfcXG4ceoLltoCVJjN5XsWN9BifBQr+cHJbWi0h68HZuSORq+3WtJ2z0hwF2NG1b5kcA==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/compat-data@7.24.6':
-    resolution: {integrity: sha512-aC2DGhBq5eEdyXWqrDInSqQjO0k8xtPRf5YylULqx8MCd6jBtzqfta/3ETMRpuKIc5hyswfO80ObyA1MvkCcUQ==}
+  '@babel/code-frame@7.24.7':
+    resolution: {integrity: sha512-BcYH1CVJBO9tvyIZ2jVeXgSIMvGZ2FDRvDdOIVQyuklNKSsx+eppDEBq/g47Ayw+RqNFE+URvOShmf+f/qwAlA==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/compat-data@7.24.7':
+    resolution: {integrity: sha512-qJzAIcv03PyaWqxRgO4mSU3lihncDT296vnyuE2O8uA4w3UHWI4S3hgeZd1L8W1Bft40w9JxJ2b412iDUFFRhw==}
     engines: {node: '>=6.9.0'}
 
   '@babel/core@7.24.6':
     resolution: {integrity: sha512-qAHSfAdVyFmIvl0VHELib8xar7ONuSHrE2hLnsaWkYNTI68dmi1x8GYDhJjMI/e7XWal9QBlZkwbOnkcw7Z8gQ==}
     engines: {node: '>=6.9.0'}
 
+  '@babel/core@7.24.7':
+    resolution: {integrity: sha512-nykK+LEK86ahTkX/3TgauT0ikKoNCfKHEaZYTUVupJdTLzGNvrblu4u6fa7DhZONAltdf8e662t/abY8idrd/g==}
+    engines: {node: '>=6.9.0'}
+
   '@babel/generator@7.24.6':
     resolution: {integrity: sha512-S7m4eNa6YAPJRHmKsLHIDJhNAGNKoWNiWefz1MBbpnt8g9lvMDl1hir4P9bo/57bQEmuwEhnRU/AMWsD0G/Fbg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-annotate-as-pure@7.24.6':
-    resolution: {integrity: sha512-DitEzDfOMnd13kZnDqns1ccmftwJTS9DMkyn9pYTxulS7bZxUxpMly3Nf23QQ6NwA4UB8lAqjbqWtyvElEMAkg==}
+  '@babel/generator@7.24.7':
+    resolution: {integrity: sha512-oipXieGC3i45Y1A41t4tAqpnEZWgB/lC6Ehh6+rOviR5XWpTtMmLN+fGjz9vOiNRt0p6RtO6DtD0pdU3vpqdSA==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-annotate-as-pure@7.24.7':
+    resolution: {integrity: sha512-BaDeOonYvhdKw+JoMVkAixAAJzG2jVPIwWoKBPdYuY9b452e2rPuI9QPYh3KpofZ3pW2akOmwZLOiOsHMiqRAg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-builder-binary-assignment-operator-visitor@7.24.6':
-    resolution: {integrity: sha512-+wnfqc5uHiMYtvRX7qu80Toef8BXeh4HHR1SPeonGb1SKPniNEd4a/nlaJJMv/OIEYvIVavvo0yR7u10Gqz0Iw==}
+  '@babel/helper-builder-binary-assignment-operator-visitor@7.24.7':
+    resolution: {integrity: sha512-xZeCVVdwb4MsDBkkyZ64tReWYrLRHlMN72vP7Bdm3OUOuyFZExhsHUUnuWnm2/XOlAJzR0LfPpB56WXZn0X/lA==}
     engines: {node: '>=6.9.0'}
 
   '@babel/helper-compilation-targets@7.24.6':
     resolution: {integrity: sha512-VZQ57UsDGlX/5fFA7GkVPplZhHsVc+vuErWgdOiysI9Ksnw0Pbbd6pnPiR/mmJyKHgyIW0c7KT32gmhiF+cirg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-create-class-features-plugin@7.24.6':
-    resolution: {integrity: sha512-djsosdPJVZE6Vsw3kk7IPRWethP94WHGOhQTc67SNXE0ZzMhHgALw8iGmYS0TD1bbMM0VDROy43od7/hN6WYcA==}
+  '@babel/helper-compilation-targets@7.24.7':
+    resolution: {integrity: sha512-ctSdRHBi20qWOfy27RUb4Fhp07KSJ3sXcuSvTrXrc4aG8NSYDo1ici3Vhg9bg69y5bj0Mr1lh0aeEgTvc12rMg==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-create-class-features-plugin@7.24.7':
+    resolution: {integrity: sha512-kTkaDl7c9vO80zeX1rJxnuRpEsD5tA81yh11X1gQo+PhSti3JS+7qeZo9U4RHobKRiFPKaGK3svUAeb8D0Q7eg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/helper-create-regexp-features-plugin@7.24.6':
-    resolution: {integrity: sha512-C875lFBIWWwyv6MHZUG9HmRrlTDgOsLWZfYR0nW69gaKJNe0/Mpxx5r0EID2ZdHQkdUmQo2t0uNckTL08/1BgA==}
+  '@babel/helper-create-regexp-features-plugin@7.24.7':
+    resolution: {integrity: sha512-03TCmXy2FtXJEZfbXDTSqq1fRJArk7lX9DOFC/47VthYcxyIOx+eXQmdo6DOQvrbpIix+KfXwvuXdFDZHxt+rA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
@@ -739,28 +751,32 @@ packages:
     peerDependencies:
       '@babel/core': ^7.4.0 || ^8.0.0-0 <8.0.0
 
-  '@babel/helper-environment-visitor@7.24.6':
-    resolution: {integrity: sha512-Y50Cg3k0LKLMjxdPjIl40SdJgMB85iXn27Vk/qbHZCFx/o5XO3PSnpi675h1KEmmDb6OFArfd5SCQEQ5Q4H88g==}
+  '@babel/helper-environment-visitor@7.24.7':
+    resolution: {integrity: sha512-DoiN84+4Gnd0ncbBOM9AZENV4a5ZiL39HYMyZJGZ/AZEykHYdJw0wW3kdcsh9/Kn+BRXHLkkklZ51ecPKmI1CQ==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-function-name@7.24.6':
-    resolution: {integrity: sha512-xpeLqeeRkbxhnYimfr2PC+iA0Q7ljX/d1eZ9/inYbmfG2jpl8Lu3DyXvpOAnrS5kxkfOWJjioIMQsaMBXFI05w==}
+  '@babel/helper-function-name@7.24.7':
+    resolution: {integrity: sha512-FyoJTsj/PEUWu1/TYRiXTIHc8lbw+TDYkZuoE43opPS5TrI7MyONBE1oNvfguEXAD9yhQRrVBnXdXzSLQl9XnA==}
     engines: {node: '>=6.9.0'}
 
   '@babel/helper-hoist-variables@7.24.6':
     resolution: {integrity: sha512-SF/EMrC3OD7dSta1bLJIlrsVxwtd0UpjRJqLno6125epQMJ/kyFmpTT4pbvPbdQHzCHg+biQ7Syo8lnDtbR+uA==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-member-expression-to-functions@7.24.6':
-    resolution: {integrity: sha512-OTsCufZTxDUsv2/eDXanw/mUZHWOxSbEmC3pP8cgjcy5rgeVPWWMStnv274DV60JtHxTk0adT0QrCzC4M9NWGg==}
+  '@babel/helper-hoist-variables@7.24.7':
+    resolution: {integrity: sha512-MJJwhkoGy5c4ehfoRyrJ/owKeMl19U54h27YYftT0o2teQ3FJ3nQUf/I3LlJsX4l3qlw7WRXUmiyajvHXoTubQ==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-member-expression-to-functions@7.24.7':
+    resolution: {integrity: sha512-LGeMaf5JN4hAT471eJdBs/GK1DoYIJ5GCtZN/EsL6KUiiDZOvO/eKE11AMZJa2zP4zk4qe9V2O/hxAmkRc8p6w==}
     engines: {node: '>=6.9.0'}
 
   '@babel/helper-module-imports@7.22.15':
     resolution: {integrity: sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-module-imports@7.24.6':
-    resolution: {integrity: sha512-a26dmxFJBF62rRO9mmpgrfTLsAuyHk4e1hKTUkD/fcMfynt8gvEKwQPQDVxWhca8dHoDck+55DFt42zV0QMw5g==}
+  '@babel/helper-module-imports@7.24.7':
+    resolution: {integrity: sha512-8AyH3C+74cgCVVXow/myrynrAGv+nTVg5vKu2nZph9x7RcRwzmh0VFallJuFTZ9mx6u4eSdXZfcOzSqTUm0HCA==}
     engines: {node: '>=6.9.0'}
 
   '@babel/helper-module-transforms@7.24.6':
@@ -769,92 +785,110 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/helper-optimise-call-expression@7.24.6':
-    resolution: {integrity: sha512-3SFDJRbx7KuPRl8XDUr8O7GAEB8iGyWPjLKJh/ywP/Iy9WOmEfMrsWbaZpvBu2HSYn4KQygIsz0O7m8y10ncMA==}
+  '@babel/helper-module-transforms@7.24.7':
+    resolution: {integrity: sha512-1fuJEwIrp+97rM4RWdO+qrRsZlAeL1lQJoPqtCYWv0NL115XM93hIH4CSRln2w52SqvmY5hqdtauB6QFCDiZNQ==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0
+
+  '@babel/helper-optimise-call-expression@7.24.7':
+    resolution: {integrity: sha512-jKiTsW2xmWwxT1ixIdfXUZp+P5yURx2suzLZr5Hi64rURpDYdMW0pv+Uf17EYk2Rd428Lx4tLsnjGJzYKDM/6A==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-plugin-utils@7.24.6':
-    resolution: {integrity: sha512-MZG/JcWfxybKwsA9N9PmtF2lOSFSEMVCpIRrbxccZFLJPrJciJdG/UhSh5W96GEteJI2ARqm5UAHxISwRDLSNg==}
+  '@babel/helper-plugin-utils@7.24.7':
+    resolution: {integrity: sha512-Rq76wjt7yz9AAc1KnlRKNAi/dMSVWgDRx43FHoJEbcYU6xOWaE2dVPwcdTukJrjxS65GITyfbvEYHvkirZ6uEg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-remap-async-to-generator@7.24.6':
-    resolution: {integrity: sha512-1Qursq9ArRZPAMOZf/nuzVW8HgJLkTB9y9LfP4lW2MVp4e9WkLJDovfKBxoDcCk6VuzIxyqWHyBoaCtSRP10yg==}
+  '@babel/helper-remap-async-to-generator@7.24.7':
+    resolution: {integrity: sha512-9pKLcTlZ92hNZMQfGCHImUpDOlAgkkpqalWEeftW5FBya75k8Li2ilerxkM/uBEj01iBZXcCIB/bwvDYgWyibA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/helper-replace-supers@7.24.6':
-    resolution: {integrity: sha512-mRhfPwDqDpba8o1F8ESxsEkJMQkUF8ZIWrAc0FtWhxnjfextxMWxr22RtFizxxSYLjVHDeMgVsRq8BBZR2ikJQ==}
+  '@babel/helper-replace-supers@7.24.7':
+    resolution: {integrity: sha512-qTAxxBM81VEyoAY0TtLrx1oAEJc09ZK67Q9ljQToqCnA+55eNwCORaxlKyu+rNfX86o8OXRUSNUnrtsAZXM9sg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/helper-simple-access@7.24.6':
-    resolution: {integrity: sha512-nZzcMMD4ZhmB35MOOzQuiGO5RzL6tJbsT37Zx8M5L/i9KSrukGXWTjLe1knIbb/RmxoJE9GON9soq0c0VEMM5g==}
+  '@babel/helper-simple-access@7.24.7':
+    resolution: {integrity: sha512-zBAIvbCMh5Ts+b86r/CjU+4XGYIs+R1j951gxI3KmmxBMhCg4oQMsv6ZXQ64XOm/cvzfU1FmoCyt6+owc5QMYg==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-skip-transparent-expression-wrappers@7.24.6':
-    resolution: {integrity: sha512-jhbbkK3IUKc4T43WadP96a27oYti9gEf1LdyGSP2rHGH77kwLwfhO7TgwnWvxxQVmke0ImmCSS47vcuxEMGD3Q==}
+  '@babel/helper-skip-transparent-expression-wrappers@7.24.7':
+    resolution: {integrity: sha512-IO+DLT3LQUElMbpzlatRASEyQtfhSE0+m465v++3jyyXeBTBUjtVZg28/gHeV5mrTJqvEKhKroBGAvhW+qPHiQ==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-split-export-declaration@7.24.6':
-    resolution: {integrity: sha512-CvLSkwXGWnYlF9+J3iZUvwgAxKiYzK3BWuo+mLzD/MDGOZDj7Gq8+hqaOkMxmJwmlv0iu86uH5fdADd9Hxkymw==}
+  '@babel/helper-split-export-declaration@7.24.7':
+    resolution: {integrity: sha512-oy5V7pD+UvfkEATUKvIjvIAH/xCzfsFVw7ygW2SI6NClZzquT+mwdTfgfdbUiceh6iQO0CHtCPsyze/MZ2YbAA==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-string-parser@7.24.6':
-    resolution: {integrity: sha512-WdJjwMEkmBicq5T9fm/cHND3+UlFa2Yj8ALLgmoSQAJZysYbBjw+azChSGPN4DSPLXOcooGRvDwZWMcF/mLO2Q==}
+  '@babel/helper-string-parser@7.24.7':
+    resolution: {integrity: sha512-7MbVt6xrwFQbunH2DNQsAP5sTGxfqQtErvBIvIMi6EQnbgUOuVYanvREcmFrOPhoXBrTtjhhP+lW+o5UfK+tDg==}
     engines: {node: '>=6.9.0'}
 
   '@babel/helper-validator-identifier@7.24.6':
     resolution: {integrity: sha512-4yA7s865JHaqUdRbnaxarZREuPTHrjpDT+pXoAZ1yhyo6uFnIEpS8VMu16siFOHDpZNKYv5BObhsB//ycbICyw==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-validator-option@7.24.6':
-    resolution: {integrity: sha512-Jktc8KkF3zIkePb48QO+IapbXlSapOW9S+ogZZkcO6bABgYAxtZcjZ/O005111YLf+j4M84uEgwYoidDkXbCkQ==}
+  '@babel/helper-validator-identifier@7.24.7':
+    resolution: {integrity: sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-validator-option@7.24.7':
+    resolution: {integrity: sha512-yy1/KvjhV/ZCL+SM7hBrvnZJ3ZuT9OuZgIJAGpPEToANvc3iM6iDvBnRjtElWibHU6n8/LPR/EjX9EtIEYO3pw==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-wrap-function@7.24.6':
-    resolution: {integrity: sha512-f1JLrlw/jbiNfxvdrfBgio/gRBk3yTAEJWirpAkiJG2Hb22E7cEYKHWo0dFPTv/niPovzIdPdEDetrv6tC6gPQ==}
+  '@babel/helper-wrap-function@7.24.7':
+    resolution: {integrity: sha512-N9JIYk3TD+1vq/wn77YnJOqMtfWhNewNE+DJV4puD2X7Ew9J4JvrzrFDfTfyv5EgEXVy9/Wt8QiOErzEmv5Ifw==}
     engines: {node: '>=6.9.0'}
 
   '@babel/helpers@7.24.6':
     resolution: {integrity: sha512-V2PI+NqnyFu1i0GyTd/O/cTpxzQCYioSkUIRmgo7gFEHKKCg5w46+r/A6WeUR1+P3TeQ49dspGPNd/E3n9AnnA==}
     engines: {node: '>=6.9.0'}
 
+  '@babel/helpers@7.24.7':
+    resolution: {integrity: sha512-NlmJJtvcw72yRJRcnCmGvSi+3jDEg8qFu3z0AFoymmzLx5ERVWyzd9kVXr7Th9/8yIJi2Zc6av4Tqz3wFs8QWg==}
+    engines: {node: '>=6.9.0'}
+
   '@babel/highlight@7.24.6':
     resolution: {integrity: sha512-2YnuOp4HAk2BsBrJJvYCbItHx0zWscI1C3zgWkz+wDyD9I7GIVrfnLyrR4Y1VR+7p+chAEcrgRQYZAGIKMV7vQ==}
     engines: {node: '>=6.9.0'}
 
+  '@babel/highlight@7.24.7':
+    resolution: {integrity: sha512-EStJpq4OuY8xYfhGVXngigBJRWxftKX9ksiGDnmlY3o7B/V7KIAc9X4oiK87uPJSc/vs5L869bem5fhZa8caZw==}
+    engines: {node: '>=6.9.0'}
+
   '@babel/parser@7.12.3':
     resolution: {integrity: sha512-kFsOS0IbsuhO5ojF8Hc8z/8vEIOkylVBrjiZUbLTE3XFe0Qi+uu6HjzQixkFaqr0ZPAMZcBVxEwmsnsLPZ2Xsw==}
     engines: {node: '>=6.0.0'}
     hasBin: true
 
-  '@babel/parser@7.24.6':
-    resolution: {integrity: sha512-eNZXdfU35nJC2h24RznROuOpO94h6x8sg9ju0tT9biNtLZ2vuP8SduLqqV+/8+cebSLV9SJEAN5Z3zQbJG/M+Q==}
+  '@babel/parser@7.24.7':
+    resolution: {integrity: sha512-9uUYRm6OqQrCqQdG1iCBwBPZgN8ciDBro2nIOFaiRz1/BCxaI7CNvQbDHvsArAC7Tw9Hda/B3U+6ui9u4HWXPw==}
     engines: {node: '>=6.0.0'}
     hasBin: true
 
-  '@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.24.6':
-    resolution: {integrity: sha512-bYndrJ6Ph6Ar+GaB5VAc0JPoP80bQCm4qon6JEzXfRl5QZyQ8Ur1K6k7htxWmPA5z+k7JQvaMUrtXlqclWYzKw==}
+  '@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.24.7':
+    resolution: {integrity: sha512-TiT1ss81W80eQsN+722OaeQMY/G4yTb4G9JrqeiDADs3N8lbPMGldWi9x8tyqCW5NLx1Jh2AvkE6r6QvEltMMQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@7.24.6':
-    resolution: {integrity: sha512-iVuhb6poq5ikqRq2XWU6OQ+R5o9wF+r/or9CeUyovgptz0UlnK4/seOQ1Istu/XybYjAhQv1FRSSfHHufIku5Q==}
+  '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@7.24.7':
+    resolution: {integrity: sha512-unaQgZ/iRu/By6tsjMZzpeBZjChYfLYry6HrEXPoz3KmfF0sVBQ1l8zKMQ4xRGLWVsjuvB8nQfjNP/DcfEOCsg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.24.6':
-    resolution: {integrity: sha512-c8TER5xMDYzzFcGqOEp9l4hvB7dcbhcGjcLVwxWfe4P5DOafdwjsBJZKsmv+o3aXh7NhopvayQIovHrh2zSRUQ==}
+  '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.24.7':
+    resolution: {integrity: sha512-+izXIbke1T33mY4MSNnrqhPXDz01WYhEf3yF5NbnUtkiNnm+XBZJl3kNfoK6NKmYlz/D07+l2GWVK/QfDkNCuQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.13.0
 
-  '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly@7.24.6':
-    resolution: {integrity: sha512-z8zEjYmwBUHN/pCF3NuWBhHQjJCrd33qAi8MgANfMrAvn72k2cImT8VjK9LJFu4ysOLJqhfkYYb3MvwANRUNZQ==}
+  '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly@7.24.7':
+    resolution: {integrity: sha512-utA4HuR6F4Vvcr+o4DnjL8fCOlgRFGbeeBEGNg3ZTrLFw6VWG5XmUrvcQ0FjIYMU2ST4XcR2Wsp7t9qOAPnxMg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
@@ -896,14 +930,14 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-syntax-import-assertions@7.24.6':
-    resolution: {integrity: sha512-BE6o2BogJKJImTmGpkmOic4V0hlRRxVtzqxiSPa8TIFxyhi4EFjHm08nq1M4STK4RytuLMgnSz0/wfflvGFNOg==}
+  '@babel/plugin-syntax-import-assertions@7.24.7':
+    resolution: {integrity: sha512-Ec3NRUMoi8gskrkBe3fNmEQfxDvY8bgfQpz6jlk/41kX9eUjvpyqWU7PBP/pLAvMaSQjbMNKJmvX57jP+M6bPg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-syntax-import-attributes@7.24.6':
-    resolution: {integrity: sha512-D+CfsVZousPXIdudSII7RGy52+dYRtbyKAZcvtQKq/NpsivyMVduepzcLqG5pMBugtMdedxdC8Ramdpcne9ZWQ==}
+  '@babel/plugin-syntax-import-attributes@7.24.7':
+    resolution: {integrity: sha512-hbX+lKKeUMGihnK8nvKqmXBInriT3GVjzXKFriV3YC6APGxMbP8RZNFwy91+hocLXq90Mta+HshoB31802bb8A==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
@@ -918,8 +952,8 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-syntax-jsx@7.24.6':
-    resolution: {integrity: sha512-lWfvAIFNWMlCsU0DRUun2GpFwZdGTukLaHJqRh1JRb80NdAP5Sb1HDHB5X9P9OtgZHQl089UzQkpYlBq2VTPRw==}
+  '@babel/plugin-syntax-jsx@7.24.7':
+    resolution: {integrity: sha512-6ddciUPe/mpMnOKv/U+RSd2vvVy+Yw/JfBB0ZHYjEZt9NLHmCUylNYlsbqCCS1Bffjlb0fCwC9Vqz+sBz6PsiQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
@@ -966,8 +1000,8 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-syntax-typescript@7.24.6':
-    resolution: {integrity: sha512-TzCtxGgVTEJWWwcYwQhCIQ6WaKlo80/B+Onsk4RRCcYqpYGFcG9etPW94VToGte5AAcxRrhjPUFvUS3Y2qKi4A==}
+  '@babel/plugin-syntax-typescript@7.24.7':
+    resolution: {integrity: sha512-c/+fVeJBB0FeKsFvwytYiUD+LBvhHjGSI0g446PRGdSVGZLRNArBUno2PETbAly3tpiNAQR5XaZ+JslxkotsbA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
@@ -978,302 +1012,302 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-transform-arrow-functions@7.24.6':
-    resolution: {integrity: sha512-jSSSDt4ZidNMggcLx8SaKsbGNEfIl0PHx/4mFEulorE7bpYLbN0d3pDW3eJ7Y5Z3yPhy3L3NaPCYyTUY7TuugQ==}
+  '@babel/plugin-transform-arrow-functions@7.24.7':
+    resolution: {integrity: sha512-Dt9LQs6iEY++gXUwY03DNFat5C2NbO48jj+j/bSAz6b3HgPs39qcPiYt77fDObIcFwj3/C2ICX9YMwGflUoSHQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-async-generator-functions@7.24.6':
-    resolution: {integrity: sha512-VEP2o4iR2DqQU6KPgizTW2mnMx6BG5b5O9iQdrW9HesLkv8GIA8x2daXBQxw1MrsIkFQGA/iJ204CKoQ8UcnAA==}
+  '@babel/plugin-transform-async-generator-functions@7.24.7':
+    resolution: {integrity: sha512-o+iF77e3u7ZS4AoAuJvapz9Fm001PuD2V3Lp6OSE4FYQke+cSewYtnek+THqGRWyQloRCyvWL1OkyfNEl9vr/g==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-async-to-generator@7.24.6':
-    resolution: {integrity: sha512-NTBA2SioI3OsHeIn6sQmhvXleSl9T70YY/hostQLveWs0ic+qvbA3fa0kwAwQ0OA/XGaAerNZRQGJyRfhbJK4g==}
+  '@babel/plugin-transform-async-to-generator@7.24.7':
+    resolution: {integrity: sha512-SQY01PcJfmQ+4Ash7NE+rpbLFbmqA2GPIgqzxfFTL4t1FKRq4zTms/7htKpoCUI9OcFYgzqfmCdH53s6/jn5fA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-block-scoped-functions@7.24.6':
-    resolution: {integrity: sha512-XNW7jolYHW9CwORrZgA/97tL/k05qe/HL0z/qqJq1mdWhwwCM6D4BJBV7wAz9HgFziN5dTOG31znkVIzwxv+vw==}
+  '@babel/plugin-transform-block-scoped-functions@7.24.7':
+    resolution: {integrity: sha512-yO7RAz6EsVQDaBH18IDJcMB1HnrUn2FJ/Jslc/WtPPWcjhpUJXU/rjbwmluzp7v/ZzWcEhTMXELnnsz8djWDwQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-block-scoping@7.24.6':
-    resolution: {integrity: sha512-S/t1Xh4ehW7sGA7c1j/hiOBLnEYCp/c2sEG4ZkL8kI1xX9tW2pqJTCHKtdhe/jHKt8nG0pFCrDHUXd4DvjHS9w==}
+  '@babel/plugin-transform-block-scoping@7.24.7':
+    resolution: {integrity: sha512-Nd5CvgMbWc+oWzBsuaMcbwjJWAcp5qzrbg69SZdHSP7AMY0AbWFqFO0WTFCA1jxhMCwodRwvRec8k0QUbZk7RQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-class-properties@7.24.6':
-    resolution: {integrity: sha512-j6dZ0Z2Z2slWLR3kt9aOmSIrBvnntWjMDN/TVcMPxhXMLmJVqX605CBRlcGI4b32GMbfifTEsdEjGjiE+j/c3A==}
+  '@babel/plugin-transform-class-properties@7.24.7':
+    resolution: {integrity: sha512-vKbfawVYayKcSeSR5YYzzyXvsDFWU2mD8U5TFeXtbCPLFUqe7GyCgvO6XDHzje862ODrOwy6WCPmKeWHbCFJ4w==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-class-static-block@7.24.6':
-    resolution: {integrity: sha512-1QSRfoPI9RoLRa8Mnakc6v3e0gJxiZQTYrMfLn+mD0sz5+ndSzwymp2hDcYJTyT0MOn0yuWzj8phlIvO72gTHA==}
+  '@babel/plugin-transform-class-static-block@7.24.7':
+    resolution: {integrity: sha512-HMXK3WbBPpZQufbMG4B46A90PkuuhN9vBCb5T8+VAHqvAqvcLi+2cKoukcpmUYkszLhScU3l1iudhrks3DggRQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.12.0
 
-  '@babel/plugin-transform-classes@7.24.6':
-    resolution: {integrity: sha512-+fN+NO2gh8JtRmDSOB6gaCVo36ha8kfCW1nMq2Gc0DABln0VcHN4PrALDvF5/diLzIRKptC7z/d7Lp64zk92Fg==}
+  '@babel/plugin-transform-classes@7.24.7':
+    resolution: {integrity: sha512-CFbbBigp8ln4FU6Bpy6g7sE8B/WmCmzvivzUC6xDAdWVsjYTXijpuuGJmYkAaoWAzcItGKT3IOAbxRItZ5HTjw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-computed-properties@7.24.6':
-    resolution: {integrity: sha512-cRzPobcfRP0ZtuIEkA8QzghoUpSB3X3qSH5W2+FzG+VjWbJXExtx0nbRqwumdBN1x/ot2SlTNQLfBCnPdzp6kg==}
+  '@babel/plugin-transform-computed-properties@7.24.7':
+    resolution: {integrity: sha512-25cS7v+707Gu6Ds2oY6tCkUwsJ9YIDbggd9+cu9jzzDgiNq7hR/8dkzxWfKWnTic26vsI3EsCXNd4iEB6e8esQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-destructuring@7.24.6':
-    resolution: {integrity: sha512-YLW6AE5LQpk5npNXL7i/O+U9CE4XsBCuRPgyjl1EICZYKmcitV+ayuuUGMJm2lC1WWjXYszeTnIxF/dq/GhIZQ==}
+  '@babel/plugin-transform-destructuring@7.24.7':
+    resolution: {integrity: sha512-19eJO/8kdCQ9zISOf+SEUJM/bAUIsvY3YDnXZTupUCQ8LgrWnsG/gFB9dvXqdXnRXMAM8fvt7b0CBKQHNGy1mw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-dotall-regex@7.24.6':
-    resolution: {integrity: sha512-rCXPnSEKvkm/EjzOtLoGvKseK+dS4kZwx1HexO3BtRtgL0fQ34awHn34aeSHuXtZY2F8a1X8xqBBPRtOxDVmcA==}
+  '@babel/plugin-transform-dotall-regex@7.24.7':
+    resolution: {integrity: sha512-ZOA3W+1RRTSWvyqcMJDLqbchh7U4NRGqwRfFSVbOLS/ePIP4vHB5e8T8eXcuqyN1QkgKyj5wuW0lcS85v4CrSw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-duplicate-keys@7.24.6':
-    resolution: {integrity: sha512-/8Odwp/aVkZwPFJMllSbawhDAO3UJi65foB00HYnK/uXvvCPm0TAXSByjz1mpRmp0q6oX2SIxpkUOpPFHk7FLA==}
+  '@babel/plugin-transform-duplicate-keys@7.24.7':
+    resolution: {integrity: sha512-JdYfXyCRihAe46jUIliuL2/s0x0wObgwwiGxw/UbgJBr20gQBThrokO4nYKgWkD7uBaqM7+9x5TU7NkExZJyzw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-dynamic-import@7.24.6':
-    resolution: {integrity: sha512-vpq8SSLRTBLOHUZHSnBqVo0AKX3PBaoPs2vVzYVWslXDTDIpwAcCDtfhUcHSQQoYoUvcFPTdC8TZYXu9ZnLT/w==}
+  '@babel/plugin-transform-dynamic-import@7.24.7':
+    resolution: {integrity: sha512-sc3X26PhZQDb3JhORmakcbvkeInvxz+A8oda99lj7J60QRuPZvNAk9wQlTBS1ZynelDrDmTU4pw1tyc5d5ZMUg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-exponentiation-operator@7.24.6':
-    resolution: {integrity: sha512-EemYpHtmz0lHE7hxxxYEuTYOOBZ43WkDgZ4arQ4r+VX9QHuNZC+WH3wUWmRNvR8ECpTRne29aZV6XO22qpOtdA==}
+  '@babel/plugin-transform-exponentiation-operator@7.24.7':
+    resolution: {integrity: sha512-Rqe/vSc9OYgDajNIK35u7ot+KeCoetqQYFXM4Epf7M7ez3lWlOjrDjrwMei6caCVhfdw+mIKD4cgdGNy5JQotQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-export-namespace-from@7.24.6':
-    resolution: {integrity: sha512-inXaTM1SVrIxCkIJ5gqWiozHfFMStuGbGJAxZFBoHcRRdDP0ySLb3jH6JOwmfiinPwyMZqMBX+7NBDCO4z0NSA==}
+  '@babel/plugin-transform-export-namespace-from@7.24.7':
+    resolution: {integrity: sha512-v0K9uNYsPL3oXZ/7F9NNIbAj2jv1whUEtyA6aujhekLs56R++JDQuzRcP2/z4WX5Vg/c5lE9uWZA0/iUoFhLTA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-for-of@7.24.6':
-    resolution: {integrity: sha512-n3Sf72TnqK4nw/jziSqEl1qaWPbCRw2CziHH+jdRYvw4J6yeCzsj4jdw8hIntOEeDGTmHVe2w4MVL44PN0GMzg==}
+  '@babel/plugin-transform-for-of@7.24.7':
+    resolution: {integrity: sha512-wo9ogrDG1ITTTBsy46oGiN1dS9A7MROBTcYsfS8DtsImMkHk9JXJ3EWQM6X2SUw4x80uGPlwj0o00Uoc6nEE3g==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-function-name@7.24.6':
-    resolution: {integrity: sha512-sOajCu6V0P1KPljWHKiDq6ymgqB+vfo3isUS4McqW1DZtvSVU2v/wuMhmRmkg3sFoq6GMaUUf8W4WtoSLkOV/Q==}
+  '@babel/plugin-transform-function-name@7.24.7':
+    resolution: {integrity: sha512-U9FcnA821YoILngSmYkW6FjyQe2TyZD5pHt4EVIhmcTkrJw/3KqcrRSxuOo5tFZJi7TE19iDyI1u+weTI7bn2w==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-json-strings@7.24.6':
-    resolution: {integrity: sha512-Uvgd9p2gUnzYJxVdBLcU0KurF8aVhkmVyMKW4MIY1/BByvs3EBpv45q01o7pRTVmTvtQq5zDlytP3dcUgm7v9w==}
+  '@babel/plugin-transform-json-strings@7.24.7':
+    resolution: {integrity: sha512-2yFnBGDvRuxAaE/f0vfBKvtnvvqU8tGpMHqMNpTN2oWMKIR3NqFkjaAgGwawhqK/pIN2T3XdjGPdaG0vDhOBGw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-literals@7.24.6':
-    resolution: {integrity: sha512-f2wHfR2HF6yMj+y+/y07+SLqnOSwRp8KYLpQKOzS58XLVlULhXbiYcygfXQxJlMbhII9+yXDwOUFLf60/TL5tw==}
+  '@babel/plugin-transform-literals@7.24.7':
+    resolution: {integrity: sha512-vcwCbb4HDH+hWi8Pqenwnjy+UiklO4Kt1vfspcQYFhJdpthSnW8XvWGyDZWKNVrVbVViI/S7K9PDJZiUmP2fYQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-logical-assignment-operators@7.24.6':
-    resolution: {integrity: sha512-EKaWvnezBCMkRIHxMJSIIylzhqK09YpiJtDbr2wsXTwnO0TxyjMUkaw4RlFIZMIS0iDj0KyIg7H7XCguHu/YDA==}
+  '@babel/plugin-transform-logical-assignment-operators@7.24.7':
+    resolution: {integrity: sha512-4D2tpwlQ1odXmTEIFWy9ELJcZHqrStlzK/dAOWYyxX3zT0iXQB6banjgeOJQXzEc4S0E0a5A+hahxPaEFYftsw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-member-expression-literals@7.24.6':
-    resolution: {integrity: sha512-9g8iV146szUo5GWgXpRbq/GALTnY+WnNuRTuRHWWFfWGbP9ukRL0aO/jpu9dmOPikclkxnNsjY8/gsWl6bmZJQ==}
+  '@babel/plugin-transform-member-expression-literals@7.24.7':
+    resolution: {integrity: sha512-T/hRC1uqrzXMKLQ6UCwMT85S3EvqaBXDGf0FaMf4446Qx9vKwlghvee0+uuZcDUCZU5RuNi4781UQ7R308zzBw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-modules-amd@7.24.6':
-    resolution: {integrity: sha512-eAGogjZgcwqAxhyFgqghvoHRr+EYRQPFjUXrTYKBRb5qPnAVxOOglaxc4/byHqjvq/bqO2F3/CGwTHsgKJYHhQ==}
+  '@babel/plugin-transform-modules-amd@7.24.7':
+    resolution: {integrity: sha512-9+pB1qxV3vs/8Hdmz/CulFB8w2tuu6EB94JZFsjdqxQokwGa9Unap7Bo2gGBGIvPmDIVvQrom7r5m/TCDMURhg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-modules-commonjs@7.24.6':
-    resolution: {integrity: sha512-JEV8l3MHdmmdb7S7Cmx6rbNEjRCgTQMZxllveHO0mx6uiclB0NflCawlQQ6+o5ZrwjUBYPzHm2XoK4wqGVUFuw==}
+  '@babel/plugin-transform-modules-commonjs@7.24.7':
+    resolution: {integrity: sha512-iFI8GDxtevHJ/Z22J5xQpVqFLlMNstcLXh994xifFwxxGslr2ZXXLWgtBeLctOD63UFDArdvN6Tg8RFw+aEmjQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-modules-systemjs@7.24.6':
-    resolution: {integrity: sha512-xg1Z0J5JVYxtpX954XqaaAT6NpAY6LtZXvYFCJmGFJWwtlz2EmJoR8LycFRGNE8dBKizGWkGQZGegtkV8y8s+w==}
+  '@babel/plugin-transform-modules-systemjs@7.24.7':
+    resolution: {integrity: sha512-GYQE0tW7YoaN13qFh3O1NCY4MPkUiAH3fiF7UcV/I3ajmDKEdG3l+UOcbAm4zUE3gnvUU+Eni7XrVKo9eO9auw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-modules-umd@7.24.6':
-    resolution: {integrity: sha512-esRCC/KsSEUvrSjv5rFYnjZI6qv4R1e/iHQrqwbZIoRJqk7xCvEUiN7L1XrmW5QSmQe3n1XD88wbgDTWLbVSyg==}
+  '@babel/plugin-transform-modules-umd@7.24.7':
+    resolution: {integrity: sha512-3aytQvqJ/h9z4g8AsKPLvD4Zqi2qT+L3j7XoFFu1XBlZWEl2/1kWnhmAbxpLgPrHSY0M6UA02jyTiwUVtiKR6A==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-named-capturing-groups-regex@7.24.6':
-    resolution: {integrity: sha512-6DneiCiu91wm3YiNIGDWZsl6GfTTbspuj/toTEqLh9d4cx50UIzSdg+T96p8DuT7aJOBRhFyaE9ZvTHkXrXr6Q==}
+  '@babel/plugin-transform-named-capturing-groups-regex@7.24.7':
+    resolution: {integrity: sha512-/jr7h/EWeJtk1U/uz2jlsCioHkZk1JJZVcc8oQsJ1dUlaJD83f4/6Zeh2aHt9BIFokHIsSeDfhUmju0+1GPd6g==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/plugin-transform-new-target@7.24.6':
-    resolution: {integrity: sha512-f8liz9JG2Va8A4J5ZBuaSdwfPqN6axfWRK+y66fjKYbwf9VBLuq4WxtinhJhvp1w6lamKUwLG0slK2RxqFgvHA==}
+  '@babel/plugin-transform-new-target@7.24.7':
+    resolution: {integrity: sha512-RNKwfRIXg4Ls/8mMTza5oPF5RkOW8Wy/WgMAp1/F1yZ8mMbtwXW+HDoJiOsagWrAhI5f57Vncrmr9XeT4CVapA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-nullish-coalescing-operator@7.24.6':
-    resolution: {integrity: sha512-+QlAiZBMsBK5NqrBWFXCYeXyiU1y7BQ/OYaiPAcQJMomn5Tyg+r5WuVtyEuvTbpV7L25ZSLfE+2E9ywj4FD48A==}
+  '@babel/plugin-transform-nullish-coalescing-operator@7.24.7':
+    resolution: {integrity: sha512-Ts7xQVk1OEocqzm8rHMXHlxvsfZ0cEF2yomUqpKENHWMF4zKk175Y4q8H5knJes6PgYad50uuRmt3UJuhBw8pQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-numeric-separator@7.24.6':
-    resolution: {integrity: sha512-6voawq8T25Jvvnc4/rXcWZQKKxUNZcKMS8ZNrjxQqoRFernJJKjE3s18Qo6VFaatG5aiX5JV1oPD7DbJhn0a4Q==}
+  '@babel/plugin-transform-numeric-separator@7.24.7':
+    resolution: {integrity: sha512-e6q1TiVUzvH9KRvicuxdBTUj4AdKSRwzIyFFnfnezpCfP2/7Qmbb8qbU2j7GODbl4JMkblitCQjKYUaX/qkkwA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-object-rest-spread@7.24.6':
-    resolution: {integrity: sha512-OKmi5wiMoRW5Smttne7BwHM8s/fb5JFs+bVGNSeHWzwZkWXWValR1M30jyXo1s/RaqgwwhEC62u4rFH/FBcBPg==}
+  '@babel/plugin-transform-object-rest-spread@7.24.7':
+    resolution: {integrity: sha512-4QrHAr0aXQCEFni2q4DqKLD31n2DL+RxcwnNjDFkSG0eNQ/xCavnRkfCUjsyqGC2OviNJvZOF/mQqZBw7i2C5Q==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-object-super@7.24.6':
-    resolution: {integrity: sha512-N/C76ihFKlZgKfdkEYKtaRUtXZAgK7sOY4h2qrbVbVTXPrKGIi8aww5WGe/+Wmg8onn8sr2ut6FXlsbu/j6JHg==}
+  '@babel/plugin-transform-object-super@7.24.7':
+    resolution: {integrity: sha512-A/vVLwN6lBrMFmMDmPPz0jnE6ZGx7Jq7d6sT/Ev4H65RER6pZ+kczlf1DthF5N0qaPHBsI7UXiE8Zy66nmAovg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-optional-catch-binding@7.24.6':
-    resolution: {integrity: sha512-L5pZ+b3O1mSzJ71HmxSCmTVd03VOT2GXOigug6vDYJzE5awLI7P1g0wFcdmGuwSDSrQ0L2rDOe/hHws8J1rv3w==}
+  '@babel/plugin-transform-optional-catch-binding@7.24.7':
+    resolution: {integrity: sha512-uLEndKqP5BfBbC/5jTwPxLh9kqPWWgzN/f8w6UwAIirAEqiIVJWWY312X72Eub09g5KF9+Zn7+hT7sDxmhRuKA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-optional-chaining@7.24.6':
-    resolution: {integrity: sha512-cHbqF6l1QP11OkYTYQ+hhVx1E017O5ZcSPXk9oODpqhcAD1htsWG2NpHrrhthEO2qZomLK0FXS+u7NfrkF5aOQ==}
+  '@babel/plugin-transform-optional-chaining@7.24.7':
+    resolution: {integrity: sha512-tK+0N9yd4j+x/4hxF3F0e0fu/VdcxU18y5SevtyM/PCFlQvXbR0Zmlo2eBrKtVipGNFzpq56o8WsIIKcJFUCRQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-parameters@7.24.6':
-    resolution: {integrity: sha512-ST7guE8vLV+vI70wmAxuZpIKzVjvFX9Qs8bl5w6tN/6gOypPWUmMQL2p7LJz5E63vEGrDhAiYetniJFyBH1RkA==}
+  '@babel/plugin-transform-parameters@7.24.7':
+    resolution: {integrity: sha512-yGWW5Rr+sQOhK0Ot8hjDJuxU3XLRQGflvT4lhlSY0DFvdb3TwKaY26CJzHtYllU0vT9j58hc37ndFPsqT1SrzA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-private-methods@7.24.6':
-    resolution: {integrity: sha512-T9LtDI0BgwXOzyXrvgLTT8DFjCC/XgWLjflczTLXyvxbnSR/gpv0hbmzlHE/kmh9nOvlygbamLKRo6Op4yB6aw==}
+  '@babel/plugin-transform-private-methods@7.24.7':
+    resolution: {integrity: sha512-COTCOkG2hn4JKGEKBADkA8WNb35TGkkRbI5iT845dB+NyqgO8Hn+ajPbSnIQznneJTa3d30scb6iz/DhH8GsJQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-private-property-in-object@7.24.6':
-    resolution: {integrity: sha512-Qu/ypFxCY5NkAnEhCF86Mvg3NSabKsh/TPpBVswEdkGl7+FbsYHy1ziRqJpwGH4thBdQHh8zx+z7vMYmcJ7iaQ==}
+  '@babel/plugin-transform-private-property-in-object@7.24.7':
+    resolution: {integrity: sha512-9z76mxwnwFxMyxZWEgdgECQglF2Q7cFLm0kMf8pGwt+GSJsY0cONKj/UuO4bOH0w/uAel3ekS4ra5CEAyJRmDA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-property-literals@7.24.6':
-    resolution: {integrity: sha512-oARaglxhRsN18OYsnPTpb8TcKQWDYNsPNmTnx5++WOAsUJ0cSC/FZVlIJCKvPbU4yn/UXsS0551CFKJhN0CaMw==}
+  '@babel/plugin-transform-property-literals@7.24.7':
+    resolution: {integrity: sha512-EMi4MLQSHfd2nrCqQEWxFdha2gBCqU4ZcCng4WBGZ5CJL4bBRW0ptdqqDdeirGZcpALazVVNJqRmsO8/+oNCBA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-regenerator@7.24.6':
-    resolution: {integrity: sha512-SMDxO95I8WXRtXhTAc8t/NFQUT7VYbIWwJCJgEli9ml4MhqUMh4S6hxgH6SmAC3eAQNWCDJFxcFeEt9w2sDdXg==}
+  '@babel/plugin-transform-regenerator@7.24.7':
+    resolution: {integrity: sha512-lq3fvXPdimDrlg6LWBoqj+r/DEWgONuwjuOuQCSYgRroXDH/IdM1C0IZf59fL5cHLpjEH/O6opIRBbqv7ELnuA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-reserved-words@7.24.6':
-    resolution: {integrity: sha512-DcrgFXRRlK64dGE0ZFBPD5egM2uM8mgfrvTMOSB2yKzOtjpGegVYkzh3s1zZg1bBck3nkXiaOamJUqK3Syk+4A==}
+  '@babel/plugin-transform-reserved-words@7.24.7':
+    resolution: {integrity: sha512-0DUq0pHcPKbjFZCfTss/pGkYMfy3vFWydkUBd9r0GHpIyfs2eCDENvqadMycRS9wZCXR41wucAfJHJmwA0UmoQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-shorthand-properties@7.24.6':
-    resolution: {integrity: sha512-xnEUvHSMr9eOWS5Al2YPfc32ten7CXdH7Zwyyk7IqITg4nX61oHj+GxpNvl+y5JHjfN3KXE2IV55wAWowBYMVw==}
+  '@babel/plugin-transform-shorthand-properties@7.24.7':
+    resolution: {integrity: sha512-KsDsevZMDsigzbA09+vacnLpmPH4aWjcZjXdyFKGzpplxhbeB4wYtury3vglQkg6KM/xEPKt73eCjPPf1PgXBA==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-spread@7.24.6':
-    resolution: {integrity: sha512-h/2j7oIUDjS+ULsIrNZ6/TKG97FgmEk1PXryk/HQq6op4XUUUwif2f69fJrzK0wza2zjCS1xhXmouACaWV5uPA==}
+  '@babel/plugin-transform-spread@7.24.7':
+    resolution: {integrity: sha512-x96oO0I09dgMDxJaANcRyD4ellXFLLiWhuwDxKZX5g2rWP1bTPkBSwCYv96VDXVT1bD9aPj8tppr5ITIh8hBng==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-sticky-regex@7.24.6':
-    resolution: {integrity: sha512-fN8OcTLfGmYv7FnDrsjodYBo1DhPL3Pze/9mIIE2MGCT1KgADYIOD7rEglpLHZj8PZlC/JFX5WcD+85FLAQusw==}
+  '@babel/plugin-transform-sticky-regex@7.24.7':
+    resolution: {integrity: sha512-kHPSIJc9v24zEml5geKg9Mjx5ULpfncj0wRpYtxbvKyTtHCYDkVE3aHQ03FrpEo4gEe2vrJJS1Y9CJTaThA52g==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-template-literals@7.24.6':
-    resolution: {integrity: sha512-BJbEqJIcKwrqUP+KfUIkxz3q8VzXe2R8Wv8TaNgO1cx+nNavxn/2+H8kp9tgFSOL6wYPPEgFvU6IKS4qoGqhmg==}
+  '@babel/plugin-transform-template-literals@7.24.7':
+    resolution: {integrity: sha512-AfDTQmClklHCOLxtGoP7HkeMw56k1/bTQjwsfhL6pppo/M4TOBSq+jjBUBLmV/4oeFg4GWMavIl44ZeCtmmZTw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-typeof-symbol@7.24.6':
-    resolution: {integrity: sha512-IshCXQ+G9JIFJI7bUpxTE/oA2lgVLAIK8q1KdJNoPXOpvRaNjMySGuvLfBw/Xi2/1lLo953uE8hyYSDW3TSYig==}
+  '@babel/plugin-transform-typeof-symbol@7.24.7':
+    resolution: {integrity: sha512-VtR8hDy7YLB7+Pet9IarXjg/zgCMSF+1mNS/EQEiEaUPoFXCVsHG64SIxcaaI2zJgRiv+YmgaQESUfWAdbjzgg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-typescript@7.24.6':
-    resolution: {integrity: sha512-H0i+hDLmaYYSt6KU9cZE0gb3Cbssa/oxWis7PX4ofQzbvsfix9Lbh8SRk7LCPDlLWJHUiFeHU0qRRpF/4Zv7mQ==}
+  '@babel/plugin-transform-typescript@7.24.7':
+    resolution: {integrity: sha512-iLD3UNkgx2n/HrjBesVbYX6j0yqn/sJktvbtKKgcaLIQ4bTTQ8obAypc1VpyHPD2y4Phh9zHOaAt8e/L14wCpw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-unicode-escapes@7.24.6':
-    resolution: {integrity: sha512-bKl3xxcPbkQQo5eX9LjjDpU2xYHeEeNQbOhj0iPvetSzA+Tu9q/o5lujF4Sek60CM6MgYvOS/DJuwGbiEYAnLw==}
+  '@babel/plugin-transform-unicode-escapes@7.24.7':
+    resolution: {integrity: sha512-U3ap1gm5+4edc2Q/P+9VrBNhGkfnf+8ZqppY71Bo/pzZmXhhLdqgaUl6cuB07O1+AQJtCLfaOmswiNbSQ9ivhw==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-unicode-property-regex@7.24.6':
-    resolution: {integrity: sha512-8EIgImzVUxy15cZiPii9GvLZwsy7Vxc+8meSlR3cXFmBIl5W5Tn9LGBf7CDKkHj4uVfNXCJB8RsVfnmY61iedA==}
+  '@babel/plugin-transform-unicode-property-regex@7.24.7':
+    resolution: {integrity: sha512-uH2O4OV5M9FZYQrwc7NdVmMxQJOCCzFeYudlZSzUAHRFeOujQefa92E74TQDVskNHCzOXoigEuoyzHDhaEaK5w==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-unicode-regex@7.24.6':
-    resolution: {integrity: sha512-pssN6ExsvxaKU638qcWb81RrvvgZom3jDgU/r5xFZ7TONkZGFf4MhI2ltMb8OcQWhHyxgIavEU+hgqtbKOmsPA==}
+  '@babel/plugin-transform-unicode-regex@7.24.7':
+    resolution: {integrity: sha512-hlQ96MBZSAXUq7ltkjtu3FJCCSMx/j629ns3hA3pXnBXjanNP0LHi+JpPeA81zaWgVK1VGH95Xuy7u0RyQ8kMg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
-  '@babel/plugin-transform-unicode-sets-regex@7.24.6':
-    resolution: {integrity: sha512-quiMsb28oXWIDK0gXLALOJRXLgICLiulqdZGOaPPd0vRT7fQp74NtdADAVu+D8s00C+0Xs0MxVP0VKF/sZEUgw==}
+  '@babel/plugin-transform-unicode-sets-regex@7.24.7':
+    resolution: {integrity: sha512-2G8aAvF4wy1w/AGZkemprdGMRg5o6zPNhbHVImRz3lss55TYCBd6xStN19rt8XJHq20sqV0JbyWjOWwQRwV/wg==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0
 
-  '@babel/preset-env@7.24.6':
-    resolution: {integrity: sha512-CrxEAvN7VxfjOG8JNF2Y/eMqMJbZPZ185amwGUBp8D9USK90xQmv7dLdFSa+VbD7fdIqcy/Mfv7WtzG8+/qxKg==}
+  '@babel/preset-env@7.24.7':
+    resolution: {integrity: sha512-1YZNsc+y6cTvWlDHidMBsQZrZfEFjRIo/BZCT906PMdzOyXtSLTgqGdrpcuTDCXyd11Am5uQULtDIcCfnTc8fQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
@@ -1283,8 +1317,8 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0-0 || ^8.0.0-0 <8.0.0
 
-  '@babel/preset-typescript@7.24.6':
-    resolution: {integrity: sha512-U10aHPDnokCFRXgyT/MaIRTivUu2K/mu0vJlwRS9LxJmJet+PFQNKpggPyFCUtC6zWSBPjvxjnpNkAn3Uw2m5w==}
+  '@babel/preset-typescript@7.24.7':
+    resolution: {integrity: sha512-SyXRe3OdWwIwalxDg5UtJnJQO+YPcTfwiIY2B0Xlddh9o7jpWLvv8X1RthIeDOxQ+O1ML5BLPCONToObyVQVuQ==}
     engines: {node: '>=6.9.0'}
     peerDependencies:
       '@babel/core': ^7.0.0-0
@@ -1296,15 +1330,23 @@ packages:
     resolution: {integrity: sha512-Ja18XcETdEl5mzzACGd+DKgaGJzPTCow7EglgwTmHdwokzDFYh/MHua6lU6DV/hjF2IaOJ4oX2nqnjG7RElKOw==}
     engines: {node: '>=6.9.0'}
 
+  '@babel/runtime@7.24.7':
+    resolution: {integrity: sha512-UwgBRMjJP+xv857DCngvqXI3Iq6J4v0wXmwc6sapg+zyhbwmQX67LUEFrkK5tbyJ30jGuG3ZvWpBiB9LCy1kWw==}
+    engines: {node: '>=6.9.0'}
+
   '@babel/template@7.24.6':
     resolution: {integrity: sha512-3vgazJlLwNXi9jhrR1ef8qiB65L1RK90+lEQwv4OxveHnqC3BfmnHdgySwRLzf6akhlOYenT+b7AfWq+a//AHw==}
     engines: {node: '>=6.9.0'}
 
+  '@babel/template@7.24.7':
+    resolution: {integrity: sha512-jYqfPrU9JTF0PmPy1tLYHW4Mp4KlgxJD9l2nP9fD6yT/ICi554DmrWBAEYpIelzjHf1msDP3PxJIRt/nFNfBig==}
+    engines: {node: '>=6.9.0'}
+
   '@babel/traverse@7.12.1':
     resolution: {integrity: sha512-MA3WPoRt1ZHo2ZmoGKNqi20YnPt0B1S0GTZEPhhd+hw2KGUzBlHuVunj6K4sNuK+reEvyiPwtp0cpaqLzJDmAw==}
 
-  '@babel/traverse@7.24.6':
-    resolution: {integrity: sha512-OsNjaJwT9Zn8ozxcfoBc+RaHdj3gFmCmYoQLUII1o6ZrUwku0BMg80FoOTPx+Gi6XhcQxAYE4xyjPTo4SxEQqw==}
+  '@babel/traverse@7.24.7':
+    resolution: {integrity: sha512-yb65Ed5S/QAcewNPh0nZczy9JdYXkkAbIsEo+P7BE7yO3txAY30Y/oPa3QkQ5It3xVG2kpKMg9MsdxZaO31uKA==}
     engines: {node: '>=6.9.0'}
 
   '@babel/types@7.12.1':
@@ -1314,6 +1356,10 @@ packages:
     resolution: {integrity: sha512-WaMsgi6Q8zMgMth93GvWPXkhAIEobfsIkLTacoVZoK1J0CevIPGYY2Vo5YvJGqyHqXM6P4ppOYGsIRU8MM9pFQ==}
     engines: {node: '>=6.9.0'}
 
+  '@babel/types@7.24.7':
+    resolution: {integrity: sha512-XEFXSlxiG5td2EJRe8vOmRbaXVgfcBlszKujvVmWIK/UpywWljQCfzAv3RQCGujWQ1RD4YYWEAqDXfuJiy8f5Q==}
+    engines: {node: '>=6.9.0'}
+
   '@bcoe/v8-coverage@0.2.3':
     resolution: {integrity: sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==}
 
@@ -1392,24 +1438,12 @@ packages:
   '@devui-design/icons@1.4.0':
     resolution: {integrity: sha512-taAX1RNW0QHUqQTRPqLTYTB2PZIqUplhWeF4hcmWkSTjpWlDNI40DssG/WRb3sISkfBk/4BMUxxC5XeTL3jo7A==}
 
-  '@docsearch/css@1.0.0-alpha.28':
-    resolution: {integrity: sha512-1AhRzVdAkrWwhaxTX6/R7SnFHz8yLz1W8I/AldlTrfbNvZs9INk1FZiEFTJdgHaP68nhgQNWSGlQiDiI3y2RYg==}
-
   '@docsearch/css@3.6.0':
     resolution: {integrity: sha512-+sbxb71sWre+PwDK7X2T8+bhS6clcVMLwBPznX45Qu6opJcgRjAp7gYSDzVFp187J+feSj5dNBN1mJoi6ckkUQ==}
 
-  '@docsearch/js@1.0.0-alpha.28':
-    resolution: {integrity: sha512-2g7aPhBy7FoEyeZW2G3LYHWVa8CFvqyozEz8PXt3hyywdFcmEIqmoCRwn8kboVftrOKCjtPcuLCewsaBoB3uiw==}
-
   '@docsearch/js@3.6.0':
     resolution: {integrity: sha512-QujhqINEElrkIfKwyyyTfbsfMAYCkylInLYMRqHy7PHc8xTBQCow73tlo/Kc7oIwBrCLf0P3YhjlOeV4v8hevQ==}
 
-  '@docsearch/react@1.0.0-alpha.28':
-    resolution: {integrity: sha512-XjJOnCBXn+UZmtuDmgzlVIHnnvh6yHVwG4aFq8AXN6xJEIX3f180FvGaowFWAxgdtHplJxFGux0Xx4piHqBzIw==}
-    peerDependencies:
-      react: ^16.8.0
-      react-dom: ^16.8.0
-
   '@docsearch/react@3.6.0':
     resolution: {integrity: sha512-HUFut4ztcVNmqy9gp/wxNbC7pTOHhgVVkHVGCACTuLhUKUhKAF9KYHJtMiLUJxEqiFLQiuri1fWF8zqwM/cu1w==}
     peerDependencies:
@@ -1436,12 +1470,294 @@ packages:
   '@emmetio/scanner@1.0.4':
     resolution: {integrity: sha512-IqRuJtQff7YHHBk4G8YZ45uB9BaAGcwQeVzgj/zj8/UdOhtQpEIupUhSk8dys6spFIWVZVeK20CzGEnqR5SbqA==}
 
+  '@esbuild/aix-ppc64@0.21.5':
+    resolution: {integrity: sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [aix]
+
+  '@esbuild/android-arm64@0.18.20':
+    resolution: {integrity: sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm64@0.21.5':
+    resolution: {integrity: sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm@0.15.18':
+    resolution: {integrity: sha512-5GT+kcs2WVGjVs7+boataCkO5Fg0y4kCjzkB5bAip7H4jfnOS3dA6KPiww9W1OEKTKeAcUVhdZGvgI65OXmUnw==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-arm@0.18.20':
+    resolution: {integrity: sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-arm@0.21.5':
+    resolution: {integrity: sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-x64@0.18.20':
+    resolution: {integrity: sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/android-x64@0.21.5':
+    resolution: {integrity: sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/darwin-arm64@0.18.20':
+    resolution: {integrity: sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-arm64@0.21.5':
+    resolution: {integrity: sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.18.20':
+    resolution: {integrity: sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.21.5':
+    resolution: {integrity: sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/freebsd-arm64@0.18.20':
+    resolution: {integrity: sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-arm64@0.21.5':
+    resolution: {integrity: sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.18.20':
+    resolution: {integrity: sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.21.5':
+    resolution: {integrity: sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/linux-arm64@0.18.20':
+    resolution: {integrity: sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm64@0.21.5':
+    resolution: {integrity: sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.18.20':
+    resolution: {integrity: sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.21.5':
+    resolution: {integrity: sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.18.20':
+    resolution: {integrity: sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.21.5':
+    resolution: {integrity: sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [linux]
+
   '@esbuild/linux-loong64@0.14.54':
     resolution: {integrity: sha512-bZBrLAIX1kpWelV0XemxBZllyRmM6vgFQQG2GdNb+r3Fkp0FOh1NJSvekXDs7jq70k4euu1cryLMfU+mTXlEpw==}
     engines: {node: '>=12'}
     cpu: [loong64]
     os: [linux]
 
+  '@esbuild/linux-loong64@0.15.18':
+    resolution: {integrity: sha512-L4jVKS82XVhw2nvzLg/19ClLWg0y27ulRwuP7lcyL6AbUWB5aPglXY3M21mauDQMDfRLs8cQmeT03r/+X3cZYQ==}
+    engines: {node: '>=12'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.18.20':
+    resolution: {integrity: sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg==}
+    engines: {node: '>=12'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.21.5':
+    resolution: {integrity: sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==}
+    engines: {node: '>=12'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.18.20':
+    resolution: {integrity: sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ==}
+    engines: {node: '>=12'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.21.5':
+    resolution: {integrity: sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==}
+    engines: {node: '>=12'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.18.20':
+    resolution: {integrity: sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.21.5':
+    resolution: {integrity: sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.18.20':
+    resolution: {integrity: sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A==}
+    engines: {node: '>=12'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.21.5':
+    resolution: {integrity: sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==}
+    engines: {node: '>=12'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.18.20':
+    resolution: {integrity: sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ==}
+    engines: {node: '>=12'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.21.5':
+    resolution: {integrity: sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==}
+    engines: {node: '>=12'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.18.20':
+    resolution: {integrity: sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.21.5':
+    resolution: {integrity: sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/netbsd-x64@0.18.20':
+    resolution: {integrity: sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/netbsd-x64@0.21.5':
+    resolution: {integrity: sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/openbsd-x64@0.18.20':
+    resolution: {integrity: sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@esbuild/openbsd-x64@0.21.5':
+    resolution: {integrity: sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@esbuild/sunos-x64@0.18.20':
+    resolution: {integrity: sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/sunos-x64@0.21.5':
+    resolution: {integrity: sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/win32-arm64@0.18.20':
+    resolution: {integrity: sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-arm64@0.21.5':
+    resolution: {integrity: sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.18.20':
+    resolution: {integrity: sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.21.5':
+    resolution: {integrity: sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-x64@0.18.20':
+    resolution: {integrity: sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [win32]
+
+  '@esbuild/win32-x64@0.21.5':
+    resolution: {integrity: sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [win32]
+
   '@eslint/eslintrc@0.4.3':
     resolution: {integrity: sha512-J6KFFz5QCYUJq3pf0mjEcCJVERbzv71PUIDczuh9JkwGEzced6CO5ADLHB1rbf/+oPBtoPfMYNOpGDzCANlbXw==}
     engines: {node: ^10.12.0 || >=12.0.0}
@@ -1452,14 +1768,14 @@ packages:
   '@floating-ui/dom@1.2.5':
     resolution: {integrity: sha512-+sAUfpQ3Frz+VCbPCqj+cZzvEESy3fjSeT/pDWkYCWOBXYNNKZfuVsHuv8/JO2zze8+Eb/Q7a6hZVgzS81fLbQ==}
 
+  '@floating-ui/dom@1.6.5':
+    resolution: {integrity: sha512-Nsdud2X65Dz+1RHjAIP0t8z5e2ff/IRbei6BqFrl1urT8sDVzM1HMQ+R0XcU5ceRfyO3I6ayeqIfh+6Wb8LGTw==}
+
   '@floating-ui/utils@0.2.2':
     resolution: {integrity: sha512-J4yDIIthosAsRZ5CPYP/jQvUAQtlZTTD/4suA08/FEnlxqW3sKS9iAhgsa9VYLZ6vDHn/ixJgIqRQPotoBjxIw==}
 
-  '@francoischalifour/autocomplete-core@1.0.0-alpha.28':
-    resolution: {integrity: sha512-rL9x+72btViw+9icfBKUJjZj87FgjFrD2esuTUqtj4RAX3s4AuVZiN8XEsfjQBSc6qJk31cxlvqZHC/BIyYXgg==}
-
-  '@francoischalifour/autocomplete-preset-algolia@1.0.0-alpha.28':
-    resolution: {integrity: sha512-bprfNmYt1opFUFEtD2XfY/kEsm13bzHQgU80uMjhuK0DJ914IjolT1GytpkdM6tJ4MBvyiJPP+bTtWO+BZ7c7w==}
+  '@floating-ui/vue@1.0.6':
+    resolution: {integrity: sha512-EdrOljjkpkkqZnrpqUcPoz9NvHxuTjUtSInh6GMv3+Mcy+giY2cE2pHh9rpacRcZ2eMSCxel9jWkWXTjLmY55w==}
 
   '@humanwhocodes/config-array@0.5.0':
     resolution: {integrity: sha512-FagtKFz74XrTl7y6HCzQpwDfXP0yhxe9lHLD1UZxjvZIcbyRz8zTFF/yYNfSfzU414eDwZ1SrO0Qvtyf+wFMQg==}
@@ -1579,12 +1895,21 @@ packages:
   '@jridgewell/trace-mapping@0.3.25':
     resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==}
 
+  '@jsdevtools/ez-spawn@3.0.4':
+    resolution: {integrity: sha512-f5DRIOZf7wxogefH03RjMPMdBF7ADTWUMoOs9kaJo06EfwF+aFhMZMDZxHg/Xe12hptN9xoZjGso2fdjapBRIA==}
+    engines: {node: '>=10'}
+
   '@ls-lint/ls-lint@1.11.2':
     resolution: {integrity: sha512-kX+CCjgNz+NHCaOcFyJLSBLRgAoyOxN18QFLpgucz5ILvbr60BGjwKaoPYTv/rBV/77L+Oz82lpP24mzJ2wGsQ==}
-    cpu: [x64, arm64]
     os: [darwin, linux, win32]
     hasBin: true
 
+  '@mdit-vue/plugin-sfc@2.1.3':
+    resolution: {integrity: sha512-Ezl0dNvQNS639Yl4siXm+cnWtQvlqHrg+u+lnau/OHpj9Xh3LVap/BSQVugKIV37eR13jXXYf3VaAOP1fXPN+w==}
+
+  '@mdit-vue/types@2.1.0':
+    resolution: {integrity: sha512-TMBB/BQWVvwtpBdWD75rkZx4ZphQ6MN0O4QB2Bc0oI5PC2uE57QerhNxdRZ7cvBHE2iY2C+BUNUziCfJbjIRRA==}
+
   '@nodelib/fs.scandir@2.1.5':
     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
     engines: {node: '>= 8'}
@@ -1604,16 +1929,109 @@ packages:
     resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
     engines: {node: '>=14'}
 
-  '@polka/url@0.5.0':
-    resolution: {integrity: sha512-oZLYFEAzUKyi3SKnXvj32ZCEGH6RDnao7COuCVhDydMS9NrCSVXhM79VaKyP5+Zc33m0QXEd2DN3UkU7OsHcfw==}
-
-  '@polka/url@1.0.0-next.25':
-    resolution: {integrity: sha512-j7P6Rgr3mmtdkeDGTe0E/aYyWEWVtc5yFXtHCRHs28/jptDEWfaVOc5T7cblqy1XKPPfCxJc/8DwQ5YgLOZOVQ==}
-
   '@rollup/pluginutils@4.2.1':
     resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==}
     engines: {node: '>= 8.0.0'}
 
+  '@rollup/rollup-android-arm-eabi@4.18.0':
+    resolution: {integrity: sha512-Tya6xypR10giZV1XzxmH5wr25VcZSncG0pZIjfePT0OVBvqNEurzValetGNarVrGiq66EBVAFn15iYX4w6FKgQ==}
+    cpu: [arm]
+    os: [android]
+
+  '@rollup/rollup-android-arm64@4.18.0':
+    resolution: {integrity: sha512-avCea0RAP03lTsDhEyfy+hpfr85KfyTctMADqHVhLAF3MlIkq83CP8UfAHUssgXTYd+6er6PaAhx/QGv4L1EiA==}
+    cpu: [arm64]
+    os: [android]
+
+  '@rollup/rollup-darwin-arm64@4.18.0':
+    resolution: {integrity: sha512-IWfdwU7KDSm07Ty0PuA/W2JYoZ4iTj3TUQjkVsO/6U+4I1jN5lcR71ZEvRh52sDOERdnNhhHU57UITXz5jC1/w==}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@rollup/rollup-darwin-x64@4.18.0':
+    resolution: {integrity: sha512-n2LMsUz7Ynu7DoQrSQkBf8iNrjOGyPLrdSg802vk6XT3FtsgX6JbE8IHRvposskFm9SNxzkLYGSq9QdpLYpRNA==}
+    cpu: [x64]
+    os: [darwin]
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.18.0':
+    resolution: {integrity: sha512-C/zbRYRXFjWvz9Z4haRxcTdnkPt1BtCkz+7RtBSuNmKzMzp3ZxdM28Mpccn6pt28/UWUCTXa+b0Mx1k3g6NOMA==}
+    cpu: [arm]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-arm-musleabihf@4.18.0':
+    resolution: {integrity: sha512-l3m9ewPgjQSXrUMHg93vt0hYCGnrMOcUpTz6FLtbwljo2HluS4zTXFy2571YQbisTnfTKPZ01u/ukJdQTLGh9A==}
+    cpu: [arm]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-arm64-gnu@4.18.0':
+    resolution: {integrity: sha512-rJ5D47d8WD7J+7STKdCUAgmQk49xuFrRi9pZkWoRD1UeSMakbcepWXPF8ycChBoAqs1pb2wzvbY6Q33WmN2ftw==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-arm64-musl@4.18.0':
+    resolution: {integrity: sha512-be6Yx37b24ZwxQ+wOQXXLZqpq4jTckJhtGlWGZs68TgdKXJgw54lUUoFYrg6Zs/kjzAQwEwYbp8JxZVzZLRepQ==}
+    cpu: [arm64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-linux-powerpc64le-gnu@4.18.0':
+    resolution: {integrity: sha512-hNVMQK+qrA9Todu9+wqrXOHxFiD5YmdEi3paj6vP02Kx1hjd2LLYR2eaN7DsEshg09+9uzWi2W18MJDlG0cxJA==}
+    cpu: [ppc64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-riscv64-gnu@4.18.0':
+    resolution: {integrity: sha512-ROCM7i+m1NfdrsmvwSzoxp9HFtmKGHEqu5NNDiZWQtXLA8S5HBCkVvKAxJ8U+CVctHwV2Gb5VUaK7UAkzhDjlg==}
+    cpu: [riscv64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-s390x-gnu@4.18.0':
+    resolution: {integrity: sha512-0UyyRHyDN42QL+NbqevXIIUnKA47A+45WyasO+y2bGJ1mhQrfrtXUpTxCOrfxCR4esV3/RLYyucGVPiUsO8xjg==}
+    cpu: [s390x]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-x64-gnu@4.18.0':
+    resolution: {integrity: sha512-xuglR2rBVHA5UsI8h8UbX4VJ470PtGCf5Vpswh7p2ukaqBGFTnsfzxUBetoWBWymHMxbIG0Cmx7Y9qDZzr648w==}
+    cpu: [x64]
+    os: [linux]
+    libc: [glibc]
+
+  '@rollup/rollup-linux-x64-musl@4.18.0':
+    resolution: {integrity: sha512-LKaqQL9osY/ir2geuLVvRRs+utWUNilzdE90TpyoX0eNqPzWjRm14oMEE+YLve4k/NAqCdPkGYDaDF5Sw+xBfg==}
+    cpu: [x64]
+    os: [linux]
+    libc: [musl]
+
+  '@rollup/rollup-win32-arm64-msvc@4.18.0':
+    resolution: {integrity: sha512-7J6TkZQFGo9qBKH0pk2cEVSRhJbL6MtfWxth7Y5YmZs57Pi+4x6c2dStAUvaQkHQLnEQv1jzBUW43GvZW8OFqA==}
+    cpu: [arm64]
+    os: [win32]
+
+  '@rollup/rollup-win32-ia32-msvc@4.18.0':
+    resolution: {integrity: sha512-Txjh+IxBPbkUB9+SXZMpv+b/vnTEtFyfWZgJ6iyCmt2tdx0OF5WhFowLmnh8ENGNpfUlUZkdI//4IEmhwPieNg==}
+    cpu: [ia32]
+    os: [win32]
+
+  '@rollup/rollup-win32-x64-msvc@4.18.0':
+    resolution: {integrity: sha512-UOo5FdvOL0+eIVTgS4tIdbW+TtnBLWg1YBCcU2KWM7nuNwRz9bksDX1bekJJCpu25N1DVWaCwnT39dVQxzqS8g==}
+    cpu: [x64]
+    os: [win32]
+
+  '@shikijs/core@1.7.0':
+    resolution: {integrity: sha512-O6j27b7dGmJbR3mjwh/aHH8Ld+GQvA0OQsNO43wKWnqbAae3AYXrhFyScHGX8hXZD6vX2ngjzDFkZY5srtIJbQ==}
+
+  '@shikijs/transformers@1.7.0':
+    resolution: {integrity: sha512-QX3TP+CS4yYLt4X4Dk7wT0MsC7yweTYHMAAKY+ay+uuR9yRdFae/h+hivny2O+YixJHfZl57xtiZfWSrHdyVhQ==}
+
+  '@sindresorhus/merge-streams@2.3.0':
+    resolution: {integrity: sha512-LtoMMhxAlorcGhmFYI+LhPgbPZCkgP6ra1YL604EeF6U98pLlQ3iWIGMdWSC+vWmPBWBNgmDBAhnAobLROJmwg==}
+    engines: {node: '>=18'}
+
   '@sinonjs/commons@1.8.6':
     resolution: {integrity: sha512-Ky+XkAkqPZSm3NLBeUng77EBQl3cmeJhITaGHdYH8kjVB+aun3S4XBRti2zt17mtt0mIUDiNxYeoJm6drVvBJQ==}
 
@@ -1657,9 +2075,18 @@ packages:
   '@types/braces@3.0.4':
     resolution: {integrity: sha512-0WR3b8eaISjEW7RpZnclONaLFDf7buaowRHdqLp4vLj54AsSAYWfh3DRbfiYJY9XDxMgx1B4sE1Afw2PGpuHOA==}
 
+  '@types/chai-subset@1.3.5':
+    resolution: {integrity: sha512-c2mPnw+xHtXDoHmdtcCXGwyLMiauiAyxWMzhGpqHC4nqI/Y5G2XhTampslK2rb59kpcuHon03UH8W6iYUzw88A==}
+
+  '@types/chai@4.3.16':
+    resolution: {integrity: sha512-PatH4iOdyh3MyWtmHVFXLWCCIhUbopaltqddG9BzB+gMIzee2MJrvd+jouii9Z3wzQJruGWAm7WOMjgfG8hQlQ==}
+
   '@types/codemirror@0.0.97':
     resolution: {integrity: sha512-n5d7o9nWhC49DjfhsxANP7naWSeTzrjXASkUDQh7626sM4zK9XP2EVcHp1IcCf/IPV6c7ORzDUDF3Bkt231VKg==}
 
+  '@types/debug@4.1.12':
+    resolution: {integrity: sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==}
+
   '@types/estree@1.0.5':
     resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
 
@@ -1699,9 +2126,15 @@ packages:
   '@types/markdown-it@12.2.3':
     resolution: {integrity: sha512-GKMHFfv3458yYy+v/N8gjufHO6MSZKCOXpZc5GXIWWy8uldwfmPn98vp81gZ5f9SVw8YYBctgfJ22a2d7AOMeQ==}
 
+  '@types/markdown-it@14.1.1':
+    resolution: {integrity: sha512-4NpsnpYl2Gt1ljyBGrKMxFYAYvpqbnnkgP/i/g+NLpjEUa3obn1XJCur9YbEXKDAkaXqsR1LbDnGEJ0MmKFxfg==}
+
   '@types/mdast@3.0.15':
     resolution: {integrity: sha512-LnwD+mUEfxWMa1QpDraczIn6k0Ee3SMicuYSSzS6ZYl2gKS09EClnJYGd8Du6rfc5r/GZEk5o1mRb8TaTj03sQ==}
 
+  '@types/mdast@4.0.4':
+    resolution: {integrity: sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==}
+
   '@types/mdurl@2.0.0':
     resolution: {integrity: sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg==}
 
@@ -1711,9 +2144,15 @@ packages:
   '@types/minimist@1.2.5':
     resolution: {integrity: sha512-hov8bUuiLiyFPGyFPE1lwWhmzYbirOXQNNo40+y3zow8aFVTeyn3VWL0VFFfdNddA8S4Vf0Tc062rzyNr7Paag==}
 
+  '@types/ms@0.7.34':
+    resolution: {integrity: sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g==}
+
   '@types/node@16.18.97':
     resolution: {integrity: sha512-4muilE1Lbfn57unR+/nT9AFjWk0MtWi5muwCEJqnOvfRQDbSfLCUdN7vCIg8TYuaANfhLOV85ve+FNpiUsbSRg==}
 
+  '@types/node@20.14.7':
+    resolution: {integrity: sha512-uTr2m2IbJJucF3KUxgnGOZvYbN0QgkGyWxG6973HCpMYFy2KfcgYuIwkJQMQkt1VbBMlvWRbpshFTLxnxCZjKQ==}
+
   '@types/normalize-package-data@2.4.4':
     resolution: {integrity: sha512-37i+OaWTh9qeK4LSHPsyRC7NahnGotNuZvjLSgcPzblpHB3rrCJxAOgI5gCdKm7coonsaX1Of0ILiTcnZjbfxA==}
 
@@ -1735,9 +2174,15 @@ packages:
   '@types/unist@2.0.10':
     resolution: {integrity: sha512-IfYcSBWE3hLpBg8+X2SEa8LVkJdJEkT2Ese2aaLs3ptGdVtABxndrMaxuFlQ1qdFf9Q5rDvDpxI3WwgvKFAsQA==}
 
+  '@types/unist@3.0.2':
+    resolution: {integrity: sha512-dqId9J8K/vGi5Zr7oo212BGii5m3q5Hxlkwy3WpYuKPklmBEvsbMYYyLxAQpSffdLl/gdW0XUpKWFvYmyoWCoQ==}
+
   '@types/web-bluetooth@0.0.14':
     resolution: {integrity: sha512-5d2RhCard1nQUC3aHcq/gHzWYO6K0WJmAbjO7mQJgCQKtZpgXxv1rOM6O/dBDhDYYVutk1sciOgNSe+5YyfM8A==}
 
+  '@types/web-bluetooth@0.0.20':
+    resolution: {integrity: sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==}
+
   '@types/yargs-parser@21.0.3':
     resolution: {integrity: sha512-I4q9QU9MQv4oEOz4tAHJtNz1cwuLxn2F3xcc2iV5WdqLPpUnj30aUuxt1mAxYTG+oe8CZMV/+6rU4S4gRDzqtQ==}
 
@@ -1799,12 +2244,6 @@ packages:
     resolution: {integrity: sha512-Cf5zznh4yNMiEMBfTOztaDVDmK1XXfgxClzOSUVUc8WAmHzogrCUeM8B05ABzuGtg0D1amfng+mUmSIOFGP3Pw==}
     engines: {node: '>=12.0.0'}
 
-  '@vitejs/plugin-vue@1.10.2':
-    resolution: {integrity: sha512-/QJ0Z9qfhAFtKRY+r57ziY4BSbGUTGsPRMpB/Ron3QPwBZM4OZAZHdTa4a8PafCwU5DTatXG8TMDoP8z+oDqJw==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      vite: ^2.5.10
-
   '@vitejs/plugin-vue@2.3.4':
     resolution: {integrity: sha512-IfFNbtkbIm36O9KB8QodlwwYvTEsJb4Lll4c2IwB3VHc2gie2mSPtSzL0eYay7X2jd/2WX02FjSGTWR6OPr/zg==}
     engines: {node: '>=12.0.0'}
@@ -1812,40 +2251,49 @@ packages:
       vite: ^2.5.10
       vue: ^3.2.25
 
+  '@vitejs/plugin-vue@4.6.2':
+    resolution: {integrity: sha512-kqf7SGFoG+80aZG6Pf+gsZIVvGSCKE98JbiWqcCV9cThtg91Jav0yvYFC9Zb+jKetNGF6ZKeoaxgZfND21fWKw==}
+    engines: {node: ^14.18.0 || >=16.0.0}
+    peerDependencies:
+      vite: ^4.0.0 || ^5.0.0
+      vue: ^3.2.25
+
+  '@vitejs/plugin-vue@5.0.5':
+    resolution: {integrity: sha512-LOjm7XeIimLBZyzinBQ6OSm3UBCNVCpLkxGC0oWmm2YPzVZoxMsdvNVimLTBzpAnR9hl/yn1SHGuRfe6/Td9rQ==}
+    engines: {node: ^18.0.0 || >=20.0.0}
+    peerDependencies:
+      vite: ^5.0.0
+      vue: ^3.2.25
+
   '@volar/code-gen@0.29.8':
     resolution: {integrity: sha512-eohLLUqPChHRPDFT5gXn4V6pr/CeTri7Ou5GI26lUvBRRAbP8p+oYfQRcbMPGeKmVkYjfVj0chsxQGx6T8PQ4Q==}
 
-  '@volar/code-gen@0.38.8':
-    resolution: {integrity: sha512-e37jd+JwNjBpWiBblsdmYMbJ9bELiuj2yZrsXv1IVKpYNSfvS92ZiYjJqVXHUwpzNeZjFG0RCd5nTpbiebwANw==}
-
   '@volar/html2pug@0.29.8':
     resolution: {integrity: sha512-bhSNXg8A2aD3w0B+CwmHjqCAaKtj5rORbE5C/q/UdGqptJbC6STCmi30KuRTdfPhR++Xb18Hauf3s/WCmtNAPA==}
     deprecated: 'WARNING: This project has been renamed to @johnsoncodehk/html2pug. Install using @johnsoncodehk/html2pug instead.'
 
+  '@volar/language-core@2.3.0':
+    resolution: {integrity: sha512-pvhL24WUh3VDnv7Yw5N1sjhPtdx7q9g+Wl3tggmnkMcyK8GcCNElF2zHiKznryn0DiUGk+eez/p2qQhz+puuHw==}
+
   '@volar/shared@0.29.8':
     resolution: {integrity: sha512-Y1NN6irkIukD+T0wf4p/dHWYL90sacN2e2lYoDXxRlvoYxwANnHgw0J0Rcp+yw58ElWRScdG7/YntEIuZWeJsw==}
 
   '@volar/source-map@0.29.8':
     resolution: {integrity: sha512-7w+UoYtnc6UQu30CgMVvx0YN4dzDgP4TIsSmUaW62AGmxU9Lxwp3Kkn/4N8efi91z8ma5Z78v/HddyJPwAC3LA==}
 
-  '@volar/source-map@0.38.8':
-    resolution: {integrity: sha512-JZvpjW/z2U3wq5wvwcTounPrRAZuSl4hlVKr3y7y72bKr++6W05OnX7fl/ddw39G/wLHdI2ag5+4JWsSd/EYhg==}
+  '@volar/source-map@2.3.0':
+    resolution: {integrity: sha512-G/228aZjAOGhDjhlyZ++nDbKrS9uk+5DMaEstjvzglaAw7nqtDyhnQAsYzUg6BMP9BtwZ59RIw5HGePrutn00Q==}
 
   '@volar/transforms@0.29.8':
     resolution: {integrity: sha512-o2hRa8CoDwYTO1Mu5KA47+1elUnYUjDaVhCvbyKlRfd8qpHea2llotArq7B6OORSL2M9DVs1IRJ5NGURBFeZ3Q==}
 
+  '@volar/typescript@2.3.0':
+    resolution: {integrity: sha512-PtUwMM87WsKVeLJN33GSTUjBexlKfKgouWlOUIv7pjrOnTwhXHZNSmpc312xgXdTjQPpToK6KXSIcKu9sBQ5LQ==}
+
   '@volar/vue-code-gen@0.29.8':
     resolution: {integrity: sha512-E1e7P2oktNC/DzgDBditfla4s8+HlUlluZ+BtcLvEdbkl3QEjujkB0x1wxguWzXmpWgLIDPtrS3Jzll5cCOkTg==}
     deprecated: 'WARNING: This project has been renamed to @vue/language-core. Install using @vue/language-core instead.'
 
-  '@volar/vue-code-gen@0.38.8':
-    resolution: {integrity: sha512-iQVNmIu1TqnqTko+l9yeylmZipZ8zNH20XZAK9+48hkv2fEQnnJn5AI2W9Zb2M5DkGMpbYiJk9Fq1vm51YY1+g==}
-    deprecated: 'WARNING: This project has been renamed to @vue/language-core. Install using @vue/language-core instead.'
-
-  '@volar/vue-typescript@0.38.8':
-    resolution: {integrity: sha512-7WeFt5piz9I6FKw2cQQCWm+75MxS6xCOGm300iu+hJORlroN2dwWbwj97pQnDGbjQbftCRplUYf0GqmhcOsanQ==}
-    deprecated: 'WARNING: This project has been renamed to @vue/typescript. Install using @vue/typescript instead.'
-
   '@vscode/emmet-helper@2.9.3':
     resolution: {integrity: sha512-rB39LHWWPQYYlYfpv9qCoZOVioPCftKXXqrsyqN1mTWZM6dTnONT63Db+03vgrBbHzJN45IrgS/AGxw9iiqfEw==}
 
@@ -1868,35 +2316,84 @@ packages:
   '@vue/compiler-core@3.4.27':
     resolution: {integrity: sha512-E+RyqY24KnyDXsCuQrI+mlcdW3ALND6U7Gqa/+bVwbcpcR3BRRIckFoz7Qyd4TTlnugtwuI7YgjbvsLmxb+yvg==}
 
+  '@vue/compiler-core@3.4.29':
+    resolution: {integrity: sha512-TFKiRkKKsRCKvg/jTSSKK7mYLJEQdUiUfykbG49rubC9SfDyvT2JrzTReopWlz2MxqeLyxh9UZhvxEIBgAhtrg==}
+
   '@vue/compiler-dom@3.4.27':
     resolution: {integrity: sha512-kUTvochG/oVgE1w5ViSr3KUBh9X7CWirebA3bezTbB5ZKBQZwR2Mwj9uoSKRMFcz4gSMzzLXBPD6KpCLb9nvWw==}
 
+  '@vue/compiler-dom@3.4.29':
+    resolution: {integrity: sha512-A6+iZ2fKIEGnfPJejdB7b1FlJzgiD+Y/sxxKwJWg1EbJu6ZPgzaPQQ51ESGNv0CP6jm6Z7/pO6Ia8Ze6IKrX7w==}
+
   '@vue/compiler-sfc@3.4.27':
     resolution: {integrity: sha512-nDwntUEADssW8e0rrmE0+OrONwmRlegDA1pD6QhVeXxjIytV03yDqTey9SBDiALsvAd5U4ZrEKbMyVXhX6mCGA==}
 
+  '@vue/compiler-sfc@3.4.29':
+    resolution: {integrity: sha512-zygDcEtn8ZimDlrEQyLUovoWgKQic6aEQqRXce2WXBvSeHbEbcAsXyCk9oG33ZkyWH4sl9D3tkYc1idoOkdqZQ==}
+
   '@vue/compiler-ssr@3.4.27':
     resolution: {integrity: sha512-CVRzSJIltzMG5FcidsW0jKNQnNRYC8bT21VegyMMtHmhW3UOI7knmUehzswXLrExDLE6lQCZdrhD4ogI7c+vuw==}
 
+  '@vue/compiler-ssr@3.4.29':
+    resolution: {integrity: sha512-rFbwCmxJ16tDp3N8XCx5xSQzjhidYjXllvEcqX/lopkoznlNPz3jyy0WGJCyhAaVQK677WWFt3YO/WUEkMMUFQ==}
+
   '@vue/devtools-api@6.6.1':
     resolution: {integrity: sha512-LgPscpE3Vs0x96PzSSB4IGVSZXZBZHpfxs+ZA1d+VEPwHdOXowy/Y2CsvCAIFrf+ssVU1pD1jidj505EpUnfbA==}
 
+  '@vue/devtools-api@6.6.3':
+    resolution: {integrity: sha512-0MiMsFma/HqA6g3KLKn+AGpL1kgKhFWszC9U29NfpWK5LE7bjeXxySWJrOJ77hBz+TBrBQ7o4QJqbPbqbs8rJw==}
+
+  '@vue/devtools-api@7.3.2':
+    resolution: {integrity: sha512-qFCm12te9rG0XWLCHm3x8TiZLULEP5s7Ruaadi5jAogwZ5qF7QH7tKc6yXZGV96uM+y1FUlbK+QwVbWgMfXEhQ==}
+
+  '@vue/devtools-kit@7.3.2':
+    resolution: {integrity: sha512-ba60JnbeLPzhfF5j0BPDGn9q5Ma9dWUV5gtVNjD+zm5uRf7LW8saAGNRnxxkRA56HZFzSAnXRGADc7YMAdrm0w==}
+
+  '@vue/devtools-shared@7.3.2':
+    resolution: {integrity: sha512-RpYfqStbzljD6zf9LPXF2T7kM3fMfepxJB5yjzyloFel5nEB49DUm4TeA426IH+hKvwjjRorZyh6CT1cG/H2Vw==}
+
+  '@vue/language-core@2.0.21':
+    resolution: {integrity: sha512-vjs6KwnCK++kIXT+eI63BGpJHfHNVJcUCr3RnvJsccT3vbJnZV5IhHR2puEkoOkIbDdp0Gqi1wEnv3hEd3WsxQ==}
+    peerDependencies:
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+
   '@vue/reactivity@3.4.27':
     resolution: {integrity: sha512-kK0g4NknW6JX2yySLpsm2jlunZJl2/RJGZ0H9ddHdfBVHcNzxmQ0sS0b09ipmBoQpY8JM2KmUw+a6sO8Zo+zIA==}
 
+  '@vue/reactivity@3.4.29':
+    resolution: {integrity: sha512-w8+KV+mb1a8ornnGQitnMdLfE0kXmteaxLdccm2XwdFxXst4q/Z7SEboCV5SqJNpZbKFeaRBBJBhW24aJyGINg==}
+
   '@vue/runtime-core@3.4.27':
     resolution: {integrity: sha512-7aYA9GEbOOdviqVvcuweTLe5Za4qBZkUY7SvET6vE8kyypxVgaT1ixHLg4urtOlrApdgcdgHoTZCUuTGap/5WA==}
 
+  '@vue/runtime-core@3.4.29':
+    resolution: {integrity: sha512-s8fmX3YVR/Rk5ig0ic0NuzTNjK2M7iLuVSZyMmCzN/+Mjuqqif1JasCtEtmtoJWF32pAtUjyuT2ljNKNLeOmnQ==}
+
   '@vue/runtime-dom@3.4.27':
     resolution: {integrity: sha512-ScOmP70/3NPM+TW9hvVAz6VWWtZJqkbdf7w6ySsws+EsqtHvkhxaWLecrTorFxsawelM5Ys9FnDEMt6BPBDS0Q==}
 
+  '@vue/runtime-dom@3.4.29':
+    resolution: {integrity: sha512-gI10atCrtOLf/2MPPMM+dpz3NGulo9ZZR9d1dWo4fYvm+xkfvRrw1ZmJ7mkWtiJVXSsdmPbcK1p5dZzOCKDN0g==}
+
   '@vue/server-renderer@3.4.27':
     resolution: {integrity: sha512-dlAMEuvmeA3rJsOMJ2J1kXU7o7pOxgsNHVr9K8hB3ImIkSuBrIdy0vF66h8gf8Tuinf1TK3mPAz2+2sqyf3KzA==}
     peerDependencies:
       vue: 3.4.27
 
+  '@vue/server-renderer@3.4.29':
+    resolution: {integrity: sha512-HMLCmPI2j/k8PVkSBysrA2RxcxC5DgBiCdj7n7H2QtR8bQQPqKAe8qoaxLcInzouBmzwJ+J0x20ygN/B5mYBng==}
+    peerDependencies:
+      vue: 3.4.29
+
   '@vue/shared@3.4.27':
     resolution: {integrity: sha512-DL3NmY2OFlqmYYrzp39yi3LDkKxa5vZVwxWdQ3rG0ekuWscHraeIbnI8t+aZK7qhYqEqWKTUdijadunb9pnrgA==}
 
+  '@vue/shared@3.4.29':
+    resolution: {integrity: sha512-hQ2gAQcBO/CDpC82DCrinJNgOHI2v+FA7BDW4lMSPeBpQ7sRe2OLHWe5cph1s7D8DUQAwRt18dBDfJJ220APEA==}
+
   '@vue/test-utils@2.4.6':
     resolution: {integrity: sha512-FMxEjOpYNYiFe0GkaHsnJPXFHxQ6m4t8vI/ElPGpMWxZKpmRvQ33OIrvRXemy6yha03RxhOlQuy+gZMC3CQSow==}
 
@@ -1926,6 +2423,9 @@ packages:
   '@vuedx/vue-virtual-textdocument@0.4.1':
     resolution: {integrity: sha512-uyBXaf3/Y2QdssfLG1hmQKbSD/2tYM2eeeHKK56Klz1RzkRBxBAP0rkKS/riHzDZfVuHQ6QP4qa4QpTSav5RGQ==}
 
+  '@vueuse/core@10.11.0':
+    resolution: {integrity: sha512-x3sD4Mkm7PJ+pcq3HX8PLPBadXCAlSDR/waK87dz0gQE+qJnaaFhc/dZVfJz+IUYzTMVGum2QlR7ImiJQN4s6g==}
+
   '@vueuse/core@8.9.4':
     resolution: {integrity: sha512-B/Mdj9TK1peFyWaPof+Zf/mP9XuGAngaJZBwPaXBvU3aCTZlx3ltlrFFFyMV4iGBwsjSCeUCgZrtkEj9dS2Y3Q==}
     peerDependencies:
@@ -1937,9 +2437,56 @@ packages:
       vue:
         optional: true
 
+  '@vueuse/integrations@10.11.0':
+    resolution: {integrity: sha512-Pp6MtWEIr+NDOccWd8j59Kpjy5YDXogXI61Kb1JxvSfVBO8NzFQkmrKmSZz47i+ZqHnIzxaT38L358yDHTncZg==}
+    peerDependencies:
+      async-validator: ^4
+      axios: ^1
+      change-case: ^4
+      drauu: ^0.3
+      focus-trap: ^7
+      fuse.js: ^6
+      idb-keyval: ^6
+      jwt-decode: ^3
+      nprogress: ^0.2
+      qrcode: ^1.5
+      sortablejs: ^1
+      universal-cookie: ^6
+    peerDependenciesMeta:
+      async-validator:
+        optional: true
+      axios:
+        optional: true
+      change-case:
+        optional: true
+      drauu:
+        optional: true
+      focus-trap:
+        optional: true
+      fuse.js:
+        optional: true
+      idb-keyval:
+        optional: true
+      jwt-decode:
+        optional: true
+      nprogress:
+        optional: true
+      qrcode:
+        optional: true
+      sortablejs:
+        optional: true
+      universal-cookie:
+        optional: true
+
+  '@vueuse/metadata@10.11.0':
+    resolution: {integrity: sha512-kQX7l6l8dVWNqlqyN3ePW3KmjCQO3ZMgXuBMddIu83CmucrsBfXlH+JoviYyRBws/yLTQO8g3Pbw+bdIoVm4oQ==}
+
   '@vueuse/metadata@8.9.4':
     resolution: {integrity: sha512-IwSfzH80bnJMzqhaapqJl9JRIiyQU0zsRGEgnxN6jhq7992cPUJIRfV+JHRIZXjYqbwt07E1gTEp0R0zPJ1aqw==}
 
+  '@vueuse/shared@10.11.0':
+    resolution: {integrity: sha512-fyNoIXEq3PfX1L3NkNhtVQUSRtqYwJtJg+Bp9rIzculIZWHTkKSysujrOk2J+NrRulLTQH9+3gGSfYLWSEWU1A==}
+
   '@vueuse/shared@8.9.4':
     resolution: {integrity: sha512-wt+T30c4K6dGRMVqPddexEVLa28YwxW5OFIPmzUHICjphfAuBFTTdDoyqREZNDOFJZ44ARH1WWQNCUK8koJ+Ag==}
     peerDependencies:
@@ -1951,6 +2498,16 @@ packages:
       vue:
         optional: true
 
+  '@yankeeinlondon/builder-api@1.4.1':
+    resolution: {integrity: sha512-qc6HyfqtuS06FvA5rK0L62Nmc1LnarVOt8/V/mTX2DBZlpTfIDpudpbE/7/kxjme9pP4PFMCk7cPSrprLEorjw==}
+
+  '@yankeeinlondon/gray-matter@6.2.1':
+    resolution: {integrity: sha512-ZrHqB3PAin0QmxeNV3Ly3c6IDXKelGGLmGJGWoqwxI1jJjXNU80i6KWsJ0sAhzTg/UIsAtgBFcJkXS7F1ZM6eQ==}
+    engines: {node: '>=14.0'}
+
+  '@yankeeinlondon/happy-wrapper@2.10.1':
+    resolution: {integrity: sha512-kS3HT26QSQqcZa8Me2yrb6oc/j0BTmTRR76ITRGcYlO8G1snz9wii1eCrBTx+gAo58P+e3UkxB8PTVrmjTowVA==}
+
   JSONStream@1.3.5:
     resolution: {integrity: sha512-E+iruNOY8VV9s4JEbe1aNEm6MiszPRr/UfcHMz0TQh1BXSxHK+ASV1R6W4HpjBhSeS+54PIsAMCBmwD06LLsqQ==}
     hasBin: true
@@ -1966,10 +2523,6 @@ packages:
     resolution: {integrity: sha512-6/mh1E2u2YgEsCHdY0Yx5oW+61gZU+1vXaoiHHrpKeuRNNgFvS+/jrwHiQhB5apAf5oB7UB7E19ol2R2LKH8hQ==}
     engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0}
 
-  accepts@1.3.8:
-    resolution: {integrity: sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw==}
-    engines: {node: '>= 0.6'}
-
   acorn-globals@6.0.0:
     resolution: {integrity: sha512-ZQl7LOWaF5ePqqcX4hLuv/bLXYQNfNWw2c0/yX/TsPRKamzHcTGQnlCjHT3TsmkOUVEPS3crCxiPfdzE/Trlhg==}
 
@@ -1982,13 +2535,17 @@ packages:
     resolution: {integrity: sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==}
     engines: {node: '>=0.4.0'}
 
+  acorn-walk@8.3.3:
+    resolution: {integrity: sha512-MxXdReSRhGO7VlFe1bRG/oI7/mdLV9B9JJT0N8vZOhF7gFRR5l3M8W9G8JxmKV+JC5mGqJ0QvqfSOLsCPa4nUw==}
+    engines: {node: '>=0.4.0'}
+
   acorn@7.4.1:
     resolution: {integrity: sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==}
     engines: {node: '>=0.4.0'}
     hasBin: true
 
-  acorn@8.11.3:
-    resolution: {integrity: sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==}
+  acorn@8.12.0:
+    resolution: {integrity: sha512-RTvkC4w+KNXrM39/lWCUaG0IbRkWdCv7W/IOW9oU6SawyxulvkQy5HQPVTKxEjczcUvapcrw3cFx/60VN/NRNw==}
     engines: {node: '>=0.4.0'}
     hasBin: true
 
@@ -2103,6 +2660,9 @@ packages:
   assert-never@1.2.1:
     resolution: {integrity: sha512-TaTivMB6pYI1kXwrFlEhLeGfOqoDNdTxjCdwRfFFkEA30Eu+k48W34nlok2EYWJfFFzqaEmichdNM7th6M5HNw==}
 
+  assertion-error@1.1.0:
+    resolution: {integrity: sha512-jgsaNduz+ndvGyFt3uSuWqvy4lCnIJiovtouQN5JZHOKCS2QuhEdbcQHFhVksz2N2U9hXJo8odG7ETyWlEeuDw==}
+
   astral-regex@2.0.0:
     resolution: {integrity: sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==}
     engines: {node: '>=8'}
@@ -2175,6 +2735,9 @@ packages:
   bail@1.0.5:
     resolution: {integrity: sha512-xFbRxM1tahm08yHBP16MMjVUAvDaBMD38zsM9EMAUN61omwLmKlOpB/Zku5QkjZ8TZ4vn53pj+t518cH0S03RQ==}
 
+  bail@2.0.2:
+    resolution: {integrity: sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw==}
+
   balanced-match@1.0.2:
     resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
 
@@ -2193,6 +2756,9 @@ packages:
     resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==}
     engines: {node: '>=8'}
 
+  birpc@0.2.17:
+    resolution: {integrity: sha512-+hkTxhot+dWsLpp3gia5AkVHIsKlZybNT5gIYiDlNzJrmYPcTM9k5/w2uaj3IPpd7LlEYpmCj4Jj1nC41VhDFg==}
+
   bl@4.1.0:
     resolution: {integrity: sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==}
 
@@ -2209,6 +2775,10 @@ packages:
     resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==}
     engines: {node: '>=8'}
 
+  brilliant-errors@0.7.3:
+    resolution: {integrity: sha512-WT9BkAze4SUOJfr7LUwJWNDAvynEAvUMvMPuFKu8QQKnRq+WMx3DAtHfOBJjHmHRxf748JY3CNVytSk6HH2yGg==}
+    engines: {node: '>=14.0.0'}
+
   browser-process-hrtime@1.0.0:
     resolution: {integrity: sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow==}
 
@@ -2217,6 +2787,11 @@ packages:
     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
     hasBin: true
 
+  browserslist@4.23.1:
+    resolution: {integrity: sha512-TUfofFo/KsK/bWZ9TWQ5O26tsWW4Uhmt8IYklbnUa70udB6P2wA7w7o4PY4muaEPBQaAX+CEnmmIA41NVHtPVw==}
+    engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
+    hasBin: true
+
   bser@2.1.1:
     resolution: {integrity: sha512-gQxTNE/GAfIIrmHLUE3oJyp5FO6HRBfhjnw4/wMmA63ZGDJnWBmgY/lyQBpnDUkGmAhbSe39tx2d/iTOAfglwQ==}
 
@@ -2226,18 +2801,30 @@ packages:
   buffer@5.7.1:
     resolution: {integrity: sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==}
 
-  bytes@3.0.0:
-    resolution: {integrity: sha512-pMhOfFDPiv9t5jjIXkHosWmkSyQbvsgEVNkz0ERHbuLh2T/7j4Mqqpz523Fe8MVY89KC6Sh/QfS2sM+SjgFDcw==}
-    engines: {node: '>= 0.8'}
+  bumpp@8.2.1:
+    resolution: {integrity: sha512-4tHKsWC2mqHQvdjZ4AXgVhS2xMsz8qQ4zYt87vGRXW5tqAjrYa/UJqy7s/dGYI2OIe9ghBdiFhKpyKEX9SXffg==}
+    engines: {node: '>=10'}
+    hasBin: true
+
+  cac@6.7.14:
+    resolution: {integrity: sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==}
+    engines: {node: '>=8'}
 
   call-bind@1.0.7:
     resolution: {integrity: sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==}
     engines: {node: '>= 0.4'}
 
+  call-me-maybe@1.0.2:
+    resolution: {integrity: sha512-HpX65o1Hnr9HH25ojC1YGs7HCQLq0GCOibSaWER0eNpgJ/Z1MZv2mTc7+xh6WOPxbRVcmgbv4hGU+uSQ/2xFZQ==}
+
   callsites@3.1.0:
     resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
     engines: {node: '>=6'}
 
+  callsites@4.1.0:
+    resolution: {integrity: sha512-aBMbD1Xxay75ViYezwT40aQONfr+pSXTHwNKvIXhXD6+LY3F1dLIcceoC5OZKBVHbXcysz1hL9D2w0JJIMXpUw==}
+    engines: {node: '>=12.20'}
+
   camelcase-keys@6.2.2:
     resolution: {integrity: sha512-YrwaA0vEKazPBkn0ipTiMpSajYDSe+KjQfrjhcBMxJt/znbvlHd8Pw/Vamaz5EB4Wfhs3SUR3Z9mwRu/P3s3Yg==}
     engines: {node: '>=8'}
@@ -2250,9 +2837,20 @@ packages:
     resolution: {integrity: sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==}
     engines: {node: '>=10'}
 
+  camelcase@8.0.0:
+    resolution: {integrity: sha512-8WB3Jcas3swSvjIeA2yvCJ+Miyz5l1ZmB6HFb9R1317dt9LCQoswg/BGrmAmkWVEszSrrg4RwmO46qIm2OEnSA==}
+    engines: {node: '>=16'}
+
   caniuse-lite@1.0.30001621:
     resolution: {integrity: sha512-+NLXZiviFFKX0fk8Piwv3PfLPGtRqJeq2TiNoUff/qB5KJgwecJTvCXDpmlyP/eCI/GUEmp/h/y5j0yckiiZrA==}
 
+  caniuse-lite@1.0.30001636:
+    resolution: {integrity: sha512-bMg2vmr8XBsbL6Lr0UHXy/21m84FTxDLWn2FSqMd5PrlbMxwJlQnC2YWYxVgp66PZE+BBNF2jYQUBKCo1FDeZg==}
+
+  chai@4.4.1:
+    resolution: {integrity: sha512-13sOfMv2+DWduEU+/xbun3LScLoqN17nBeTLUsmDfKdoiC1fr0n9PU4guu4AhRcOVFk/sW8LyZWHuhWtQZiF+g==}
+    engines: {node: '>=4'}
+
   chalk@2.4.2:
     resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==}
     engines: {node: '>=4'}
@@ -2273,21 +2871,36 @@ packages:
     resolution: {integrity: sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==}
     engines: {node: '>=10'}
 
+  character-entities-html4@2.1.0:
+    resolution: {integrity: sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA==}
+
   character-entities-legacy@1.1.4:
     resolution: {integrity: sha512-3Xnr+7ZFS1uxeiUDvV02wQ+QDbc55o97tIV5zHScSPJpcLm/r0DFPcoY3tYRp+VZukxuMeKgXYmsXQHO05zQeA==}
 
+  character-entities-legacy@3.0.0:
+    resolution: {integrity: sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ==}
+
   character-entities@1.2.4:
     resolution: {integrity: sha512-iBMyeEHxfVnIakwOuDXpVkc54HijNgCyQB2w0VfGQThle6NXn50zU6V/u+LDhxHcDUPojn6Kpga3PTAD8W1bQw==}
 
+  character-entities@2.0.2:
+    resolution: {integrity: sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==}
+
   character-parser@2.2.0:
     resolution: {integrity: sha512-+UqJQjFEFaTAs3bNsF2j2kEN1baG/zghZbdqoYEDxGZtJo9LBzl1A+m0D4n3qKx8N2FNv8/Xp6yV9mQmBuptaw==}
 
   character-reference-invalid@1.1.4:
     resolution: {integrity: sha512-mKKUkUbhPpQlCOfIuZkvSEgktjPFIsZKRRbC6KWVEMvlzblj3i3asQv5ODsrwt0N3pHAEvjP8KTQPHkp0+6jOg==}
 
+  character-reference-invalid@2.0.1:
+    resolution: {integrity: sha512-iBZ4F4wRbyORVsu0jPV7gXkOsGYjGHPmAyv+HiHG8gi5PtC9KI2j1+v8/tlibRvjoWX027ypmG/n0HtO5t7unw==}
+
   chardet@0.7.0:
     resolution: {integrity: sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==}
 
+  check-error@1.0.3:
+    resolution: {integrity: sha512-iKEoDYaRmd1mxM90a2OEfWhjsjPpYPuQ+lMYsoxB126+t8fw7ySEO48nmDg5COTjxDI65/Y2OWpeEHk3ZOe8zg==}
+
   chokidar@3.6.0:
     resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
     engines: {node: '>= 8.10.0'}
@@ -2411,13 +3024,8 @@ packages:
   compare-func@2.0.0:
     resolution: {integrity: sha512-zHig5N+tPWARooBnb0Zx1MFcdfpyJrfTJ3Y5L+IFvUm8rM74hHz66z0gw0x4tijh5CorKkKUCnW82R2vmpeCRA==}
 
-  compressible@2.0.18:
-    resolution: {integrity: sha512-AF3r7P5dWxL8MxyITRMlORQNaOA2IkAFaTr4k7BUumjPtRpGDTZpl0Pb1XCO6JeDCBdp126Cgs9sMxqSjgYyRg==}
-    engines: {node: '>= 0.6'}
-
-  compression@1.7.4:
-    resolution: {integrity: sha512-jaSIDzP9pZVS4ZfQ+TzvtiWhdpFhE2RDHz8QJkpX9SIpLq88VueF5jJw6t+6CUQcAoA6t+x89MLrWAqpfDE8iQ==}
-    engines: {node: '>= 0.8.0'}
+  computeds@0.0.1:
+    resolution: {integrity: sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q==}
 
   concat-map@0.0.1:
     resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
@@ -2501,6 +3109,10 @@ packages:
   convert-source-map@2.0.0:
     resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==}
 
+  copy-anything@3.0.5:
+    resolution: {integrity: sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==}
+    engines: {node: '>=12.13'}
+
   core-js-compat@3.37.1:
     resolution: {integrity: sha512-9TNiImhKvQqSUkOvk/mMRZzOANTiEVC7WaBNhHcKM7x+/5E1l5NvsysR19zuDQScE8k+kfQXWRN3AtS/eOSHpg==}
 
@@ -2536,6 +3148,9 @@ packages:
     resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==}
     engines: {node: '>= 6'}
 
+  css.escape@1.5.1:
+    resolution: {integrity: sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==}
+
   cssesc@3.0.0:
     resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
     engines: {node: '>=4'}
@@ -2820,24 +3435,25 @@ packages:
   de-indent@1.0.2:
     resolution: {integrity: sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==}
 
-  debug@2.6.9:
-    resolution: {integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==}
+  debug@3.2.7:
+    resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==}
     peerDependencies:
       supports-color: '*'
     peerDependenciesMeta:
       supports-color:
         optional: true
 
-  debug@3.2.7:
-    resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==}
+  debug@4.3.4:
+    resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
+    engines: {node: '>=6.0'}
     peerDependencies:
       supports-color: '*'
     peerDependenciesMeta:
       supports-color:
         optional: true
 
-  debug@4.3.4:
-    resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
+  debug@4.3.5:
+    resolution: {integrity: sha512-pt0bNEmneDIvdL1Xsd9oDQ/wrQRkXDT4AUWlNZNPKvW5x/jyO9VFXkJUP07vQ2upmw5PlaITaPKc31jK13V+jg==}
     engines: {node: '>=6.0'}
     peerDependencies:
       supports-color: '*'
@@ -2856,9 +3472,16 @@ packages:
   decimal.js@10.4.3:
     resolution: {integrity: sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==}
 
+  decode-named-character-reference@1.0.2:
+    resolution: {integrity: sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg==}
+
   dedent@0.7.0:
     resolution: {integrity: sha512-Q6fKUPqnAHAyhiUgFU7BUzLiv0kd8saH9al7tnu5Q/okj6dnupxyTgFIBjVzJATdfIAm9NAsvXNzjaKa+bxVyA==}
 
+  deep-eql@4.1.4:
+    resolution: {integrity: sha512-SUwdGfqdKOwxCPeVYjwSyRpJ7Z+fhpwIAtmCUdZIWZ/YP5R9WAsyuSgpLVDi9bjWoN2LXHNss/dk3urXtdQxGg==}
+    engines: {node: '>=6'}
+
   deep-is@0.1.4:
     resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==}
 
@@ -2887,16 +3510,20 @@ packages:
   delegate@3.2.0:
     resolution: {integrity: sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw==}
 
+  dequal@2.0.3:
+    resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==}
+    engines: {node: '>=6'}
+
   detect-newline@3.1.0:
     resolution: {integrity: sha512-TLz+x/vEXm/Y7P7wn1EJFNLxYpUD4TgMosxY6fAVJUnJMbupHBOncxyWUG9OpTaH9EBD7uFI5LfEgmMOc54DsA==}
     engines: {node: '>=8'}
 
+  devlop@1.1.0:
+    resolution: {integrity: sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==}
+
   devui-theme@0.0.1:
     resolution: {integrity: sha512-5nF6fChlsXKeAtvkaAF4bZ0NMiEAbzwqQ9XZQiNuM0RRFz5lW29nnbhfDCNPkmnw5ZyCVyXqYwVRBIZrwZHXrA==}
 
-  diacritics@1.3.0:
-    resolution: {integrity: sha512-wlwEkqcsaxvPJML+rDh/2iS824jbREk6DUMUKkEaSlxdYHeS43cClJtsWglvw2RfeXGm6ohKDqsXteJ5sP5enA==}
-
   didyoumean@1.2.2:
     resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
 
@@ -2982,6 +3609,9 @@ packages:
   electron-to-chromium@1.4.783:
     resolution: {integrity: sha512-bT0jEz/Xz1fahQpbZ1D7LgmPYZ3iHVY39NcWWro1+hA2IvjiPeaXtfSqrQ+nXjApMvQRE2ASt1itSLRrebHMRQ==}
 
+  electron-to-chromium@1.4.807:
+    resolution: {integrity: sha512-kSmJl2ZwhNf/bcIuCH/imtNOKlpkLDn2jqT5FJ+/0CXjhnFaOa9cOe9gHKKy71eM49izwuQjZhKk+lWQ1JxB7A==}
+
   emittery@0.8.1:
     resolution: {integrity: sha512-uDfvUjVrfGJJhymx/kz6prltenw1u7WrCg1oa94zYY8xxVpLLUu045LAT0dhDZdXG58/EpPL/5kA180fQ/qudg==}
     engines: {node: '>=10'}
@@ -3055,6 +3685,12 @@ packages:
     cpu: [x64]
     os: [android]
 
+  esbuild-android-64@0.15.18:
+    resolution: {integrity: sha512-wnpt3OXRhcjfIDSZu9bnzT4/TNTDsOUvip0foZOUBG7QbSt//w3QV4FInVJxNhKc/ErhUxc5z4QjHtMi7/TbgA==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [android]
+
   esbuild-android-arm64@0.13.15:
     resolution: {integrity: sha512-m602nft/XXeO8YQPUDVoHfjyRVPdPgjyyXOxZ44MK/agewFFkPa8tUo6lAzSWh5Ui5PB4KR9UIFTSBKh/RrCmg==}
     cpu: [arm64]
@@ -3066,6 +3702,12 @@ packages:
     cpu: [arm64]
     os: [android]
 
+  esbuild-android-arm64@0.15.18:
+    resolution: {integrity: sha512-G4xu89B8FCzav9XU8EjsXacCKSG2FT7wW9J6hOc18soEHJdtWu03L3TQDGf0geNxfLTtxENKBzMSq9LlbjS8OQ==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [android]
+
   esbuild-darwin-64@0.13.15:
     resolution: {integrity: sha512-ihOQRGs2yyp7t5bArCwnvn2Atr6X4axqPpEdCFPVp7iUj4cVSdisgvEKdNR7yH3JDjW6aQDw40iQFoTqejqxvQ==}
     cpu: [x64]
@@ -3077,6 +3719,12 @@ packages:
     cpu: [x64]
     os: [darwin]
 
+  esbuild-darwin-64@0.15.18:
+    resolution: {integrity: sha512-2WAvs95uPnVJPuYKP0Eqx+Dl/jaYseZEUUT1sjg97TJa4oBtbAKnPnl3b5M9l51/nbx7+QAEtuummJZW0sBEmg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [darwin]
+
   esbuild-darwin-arm64@0.13.15:
     resolution: {integrity: sha512-i1FZssTVxUqNlJ6cBTj5YQj4imWy3m49RZRnHhLpefFIh0To05ow9DTrXROTE1urGTQCloFUXTX8QfGJy1P8dQ==}
     cpu: [arm64]
@@ -3088,6 +3736,12 @@ packages:
     cpu: [arm64]
     os: [darwin]
 
+  esbuild-darwin-arm64@0.15.18:
+    resolution: {integrity: sha512-tKPSxcTJ5OmNb1btVikATJ8NftlyNlc8BVNtyT/UAr62JFOhwHlnoPrhYWz09akBLHI9nElFVfWSTSRsrZiDUA==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [darwin]
+
   esbuild-freebsd-64@0.13.15:
     resolution: {integrity: sha512-G3dLBXUI6lC6Z09/x+WtXBXbOYQZ0E8TDBqvn7aMaOCzryJs8LyVXKY4CPnHFXZAbSwkCbqiPuSQ1+HhrNk7EA==}
     cpu: [x64]
@@ -3099,6 +3753,12 @@ packages:
     cpu: [x64]
     os: [freebsd]
 
+  esbuild-freebsd-64@0.15.18:
+    resolution: {integrity: sha512-TT3uBUxkteAjR1QbsmvSsjpKjOX6UkCstr8nMr+q7zi3NuZ1oIpa8U41Y8I8dJH2fJgdC3Dj3CXO5biLQpfdZA==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [freebsd]
+
   esbuild-freebsd-arm64@0.13.15:
     resolution: {integrity: sha512-KJx0fzEDf1uhNOZQStV4ujg30WlnwqUASaGSFPhznLM/bbheu9HhqZ6mJJZM32lkyfGJikw0jg7v3S0oAvtvQQ==}
     cpu: [arm64]
@@ -3110,6 +3770,12 @@ packages:
     cpu: [arm64]
     os: [freebsd]
 
+  esbuild-freebsd-arm64@0.15.18:
+    resolution: {integrity: sha512-R/oVr+X3Tkh+S0+tL41wRMbdWtpWB8hEAMsOXDumSSa6qJR89U0S/PpLXrGF7Wk/JykfpWNokERUpCeHDl47wA==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [freebsd]
+
   esbuild-linux-32@0.13.15:
     resolution: {integrity: sha512-ZvTBPk0YWCLMCXiFmD5EUtB30zIPvC5Itxz0mdTu/xZBbbHJftQgLWY49wEPSn2T/TxahYCRDWun5smRa0Tu+g==}
     cpu: [ia32]
@@ -3121,6 +3787,12 @@ packages:
     cpu: [ia32]
     os: [linux]
 
+  esbuild-linux-32@0.15.18:
+    resolution: {integrity: sha512-lphF3HiCSYtaa9p1DtXndiQEeQDKPl9eN/XNoBf2amEghugNuqXNZA/ZovthNE2aa4EN43WroO0B85xVSjYkbg==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [linux]
+
   esbuild-linux-64@0.13.15:
     resolution: {integrity: sha512-eCKzkNSLywNeQTRBxJRQ0jxRCl2YWdMB3+PkWFo2BBQYC5mISLIVIjThNtn6HUNqua1pnvgP5xX0nHbZbPj5oA==}
     cpu: [x64]
@@ -3132,6 +3804,12 @@ packages:
     cpu: [x64]
     os: [linux]
 
+  esbuild-linux-64@0.15.18:
+    resolution: {integrity: sha512-hNSeP97IviD7oxLKFuii5sDPJ+QHeiFTFLoLm7NZQligur8poNOWGIgpQ7Qf8Balb69hptMZzyOBIPtY09GZYw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [linux]
+
   esbuild-linux-arm64@0.13.15:
     resolution: {integrity: sha512-bYpuUlN6qYU9slzr/ltyLTR9YTBS7qUDymO8SV7kjeNext61OdmqFAzuVZom+OLW1HPHseBfJ/JfdSlx8oTUoA==}
     cpu: [arm64]
@@ -3143,6 +3821,12 @@ packages:
     cpu: [arm64]
     os: [linux]
 
+  esbuild-linux-arm64@0.15.18:
+    resolution: {integrity: sha512-54qr8kg/6ilcxd+0V3h9rjT4qmjc0CccMVWrjOEM/pEcUzt8X62HfBSeZfT2ECpM7104mk4yfQXkosY8Quptug==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [linux]
+
   esbuild-linux-arm@0.13.15:
     resolution: {integrity: sha512-wUHttDi/ol0tD8ZgUMDH8Ef7IbDX+/UsWJOXaAyTdkT7Yy9ZBqPg8bgB/Dn3CZ9SBpNieozrPRHm0BGww7W/jA==}
     cpu: [arm]
@@ -3154,6 +3838,12 @@ packages:
     cpu: [arm]
     os: [linux]
 
+  esbuild-linux-arm@0.15.18:
+    resolution: {integrity: sha512-UH779gstRblS4aoS2qpMl3wjg7U0j+ygu3GjIeTonCcN79ZvpPee12Qun3vcdxX+37O5LFxz39XeW2I9bybMVA==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [linux]
+
   esbuild-linux-mips64le@0.13.15:
     resolution: {integrity: sha512-KlVjIG828uFPyJkO/8gKwy9RbXhCEUeFsCGOJBepUlpa7G8/SeZgncUEz/tOOUJTcWMTmFMtdd3GElGyAtbSWg==}
     cpu: [mips64el]
@@ -3165,6 +3855,12 @@ packages:
     cpu: [mips64el]
     os: [linux]
 
+  esbuild-linux-mips64le@0.15.18:
+    resolution: {integrity: sha512-Mk6Ppwzzz3YbMl/ZZL2P0q1tnYqh/trYZ1VfNP47C31yT0K8t9s7Z077QrDA/guU60tGNp2GOwCQnp+DYv7bxQ==}
+    engines: {node: '>=12'}
+    cpu: [mips64el]
+    os: [linux]
+
   esbuild-linux-ppc64le@0.13.15:
     resolution: {integrity: sha512-h6gYF+OsaqEuBjeesTBtUPw0bmiDu7eAeuc2OEH9S6mV9/jPhPdhOWzdeshb0BskRZxPhxPOjqZ+/OqLcxQwEQ==}
     cpu: [ppc64]
@@ -3176,18 +3872,36 @@ packages:
     cpu: [ppc64]
     os: [linux]
 
+  esbuild-linux-ppc64le@0.15.18:
+    resolution: {integrity: sha512-b0XkN4pL9WUulPTa/VKHx2wLCgvIAbgwABGnKMY19WhKZPT+8BxhZdqz6EgkqCLld7X5qiCY2F/bfpUUlnFZ9w==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [linux]
+
   esbuild-linux-riscv64@0.14.54:
     resolution: {integrity: sha512-y7Vt7Wl9dkOGZjxQZnDAqqn+XOqFD7IMWiewY5SPlNlzMX39ocPQlOaoxvT4FllA5viyV26/QzHtvTjVNOxHZg==}
     engines: {node: '>=12'}
     cpu: [riscv64]
     os: [linux]
 
+  esbuild-linux-riscv64@0.15.18:
+    resolution: {integrity: sha512-ba2COaoF5wL6VLZWn04k+ACZjZ6NYniMSQStodFKH/Pu6RxzQqzsmjR1t9QC89VYJxBeyVPTaHuBMCejl3O/xg==}
+    engines: {node: '>=12'}
+    cpu: [riscv64]
+    os: [linux]
+
   esbuild-linux-s390x@0.14.54:
     resolution: {integrity: sha512-zaHpW9dziAsi7lRcyV4r8dhfG1qBidQWUXweUjnw+lliChJqQr+6XD71K41oEIC3Mx1KStovEmlzm+MkGZHnHA==}
     engines: {node: '>=12'}
     cpu: [s390x]
     os: [linux]
 
+  esbuild-linux-s390x@0.15.18:
+    resolution: {integrity: sha512-VbpGuXEl5FCs1wDVp93O8UIzl3ZrglgnSQ+Hu79g7hZu6te6/YHgVJxCM2SqfIila0J3k0csfnf8VD2W7u2kzQ==}
+    engines: {node: '>=12'}
+    cpu: [s390x]
+    os: [linux]
+
   esbuild-netbsd-64@0.13.15:
     resolution: {integrity: sha512-3+yE9emwoevLMyvu+iR3rsa+Xwhie7ZEHMGDQ6dkqP/ndFzRHkobHUKTe+NCApSqG5ce2z4rFu+NX/UHnxlh3w==}
     cpu: [x64]
@@ -3199,6 +3913,12 @@ packages:
     cpu: [x64]
     os: [netbsd]
 
+  esbuild-netbsd-64@0.15.18:
+    resolution: {integrity: sha512-98ukeCdvdX7wr1vUYQzKo4kQ0N2p27H7I11maINv73fVEXt2kyh4K4m9f35U1K43Xc2QGXlzAw0K9yoU7JUjOg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [netbsd]
+
   esbuild-openbsd-64@0.13.15:
     resolution: {integrity: sha512-wTfvtwYJYAFL1fSs8yHIdf5GEE4NkbtbXtjLWjM3Cw8mmQKqsg8kTiqJ9NJQe5NX/5Qlo7Xd9r1yKMMkHllp5g==}
     cpu: [x64]
@@ -3210,6 +3930,12 @@ packages:
     cpu: [x64]
     os: [openbsd]
 
+  esbuild-openbsd-64@0.15.18:
+    resolution: {integrity: sha512-yK5NCcH31Uae076AyQAXeJzt/vxIo9+omZRKj1pauhk3ITuADzuOx5N2fdHrAKPxN+zH3w96uFKlY7yIn490xQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [openbsd]
+
   esbuild-register@2.6.0:
     resolution: {integrity: sha512-2u4AtnCXP5nivtIxZryiZOUcEQkOzFS7UhAqibUEmaTAThJ48gDLYTBF/Fsz+5r0hbV1jrFE6PQvPDUrKZNt/Q==}
 
@@ -3224,6 +3950,12 @@ packages:
     cpu: [x64]
     os: [sunos]
 
+  esbuild-sunos-64@0.15.18:
+    resolution: {integrity: sha512-On22LLFlBeLNj/YF3FT+cXcyKPEI263nflYlAhz5crxtp3yRG1Ugfr7ITyxmCmjm4vbN/dGrb/B7w7U8yJR9yw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [sunos]
+
   esbuild-windows-32@0.13.15:
     resolution: {integrity: sha512-fDMEf2g3SsJ599MBr50cY5ve5lP1wyVwTe6aLJsM01KtxyKkB4UT+fc5MXQFn3RLrAIAZOG+tHC+yXObpSn7Nw==}
     cpu: [ia32]
@@ -3235,6 +3967,12 @@ packages:
     cpu: [ia32]
     os: [win32]
 
+  esbuild-windows-32@0.15.18:
+    resolution: {integrity: sha512-o+eyLu2MjVny/nt+E0uPnBxYuJHBvho8vWsC2lV61A7wwTWC3jkN2w36jtA+yv1UgYkHRihPuQsL23hsCYGcOQ==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [win32]
+
   esbuild-windows-64@0.13.15:
     resolution: {integrity: sha512-9aMsPRGDWCd3bGjUIKG/ZOJPKsiztlxl/Q3C1XDswO6eNX/Jtwu4M+jb6YDH9hRSUflQWX0XKAfWzgy5Wk54JQ==}
     cpu: [x64]
@@ -3246,6 +3984,12 @@ packages:
     cpu: [x64]
     os: [win32]
 
+  esbuild-windows-64@0.15.18:
+    resolution: {integrity: sha512-qinug1iTTaIIrCorAUjR0fcBk24fjzEedFYhhispP8Oc7SFvs+XeW3YpAKiKp8dRpizl4YYAhxMjlftAMJiaUw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [win32]
+
   esbuild-windows-arm64@0.13.15:
     resolution: {integrity: sha512-zzvyCVVpbwQQATaf3IG8mu1IwGEiDxKkYUdA4FpoCHi1KtPa13jeScYDjlW0Qh+ebWzpKfR2ZwvqAQkSWNcKjA==}
     cpu: [arm64]
@@ -3257,6 +4001,12 @@ packages:
     cpu: [arm64]
     os: [win32]
 
+  esbuild-windows-arm64@0.15.18:
+    resolution: {integrity: sha512-q9bsYzegpZcLziq0zgUi5KqGVtfhjxGbnksaBFYmWLxeV/S1fK4OLdq2DFYnXcLMjlZw2L0jLsk1eGoB522WXQ==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [win32]
+
   esbuild@0.12.29:
     resolution: {integrity: sha512-w/XuoBCSwepyiZtIRsKsetiLDUVGPVw1E/R3VTFSecIy8UR7Cq3SOtwKHJMFoVqqVG36aGkzh4e8BvpO1Fdc7g==}
     hasBin: true
@@ -3270,12 +4020,27 @@ packages:
     engines: {node: '>=12'}
     hasBin: true
 
-  escalade@3.1.2:
-    resolution: {integrity: sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==}
-    engines: {node: '>=6'}
-
-  escape-html@1.0.3:
-    resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==}
+  esbuild@0.15.18:
+    resolution: {integrity: sha512-x/R72SmW3sSFRm5zrrIjAhCeQSAWoni3CmHEqfQrZIQTM3lVCdehdwuIqaOtfC2slvpdlLa62GYoN8SxT23m6Q==}
+    engines: {node: '>=12'}
+    hasBin: true
+
+  esbuild@0.18.20:
+    resolution: {integrity: sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA==}
+    engines: {node: '>=12'}
+    hasBin: true
+
+  esbuild@0.21.5:
+    resolution: {integrity: sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==}
+    engines: {node: '>=12'}
+    hasBin: true
+
+  escalade@3.1.2:
+    resolution: {integrity: sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==}
+    engines: {node: '>=6'}
+
+  escape-html@1.0.3:
+    resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==}
 
   escape-string-regexp@1.0.5:
     resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==}
@@ -3289,6 +4054,10 @@ packages:
     resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==}
     engines: {node: '>=10'}
 
+  escape-string-regexp@5.0.0:
+    resolution: {integrity: sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==}
+    engines: {node: '>=12'}
+
   escodegen@2.1.0:
     resolution: {integrity: sha512-2NlIDTwUWJN0mRPQOdtQBzbUHvdGY2P1VXSyU83Q3xKxM7WHX2Ql8dKq782Q9TgQUNOLEzEYu9bzLNj1q88I5w==}
     engines: {node: '>=6.0'}
@@ -3444,6 +4213,9 @@ packages:
   fastq@1.17.1:
     resolution: {integrity: sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==}
 
+  fault@2.0.1:
+    resolution: {integrity: sha512-WtySTkS4OKev5JtpHXnib4Gxiurzh5NCGvWrFaZ34m6JehfTUhKZvn9njTfw48t6JumVQOmrKqpmGcdwxnhqBQ==}
+
   fb-watchman@2.0.2:
     resolution: {integrity: sha512-p5161BqbuCaSnB8jIbzQHOlpgsPmK5rJVDfDKO91Axs5NC1uu3HRQm6wt9cd9/+GtQQIO53JdGXXoyDpTAsgYA==}
 
@@ -3485,17 +4257,27 @@ packages:
   flatted@3.3.1:
     resolution: {integrity: sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==}
 
+  focus-trap@7.5.4:
+    resolution: {integrity: sha512-N7kHdlgsO/v+iD/dMoJKtsSqs5Dz/dXZVebRgJw23LDk+jMi/974zyiOYDziY2JPp8xivq9BmUGwIJMiuSBi7w==}
+
   for-each@0.3.3:
     resolution: {integrity: sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==}
 
-  foreground-child@3.1.1:
-    resolution: {integrity: sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==}
+  foreground-child@3.2.1:
+    resolution: {integrity: sha512-PXUUyLqrR2XCWICfv6ukppP96sdFwWbNEnfEMt7jNsISjMsvaLNinAHNDYyvkyU+SZG2BTSbT5NjG+vZslfGTA==}
     engines: {node: '>=14'}
 
   form-data@3.0.1:
     resolution: {integrity: sha512-RHkBKtLWUVwd7SqRIvCZMEvAMoGUp0XU+seQiZejj0COz3RI3hWP4sCv3gZWWLjJTd7rGwcsF5eKZGii0r/hbg==}
     engines: {node: '>= 6'}
 
+  format@0.2.2:
+    resolution: {integrity: sha512-wzsgA6WOq+09wrU1tsJ09udeR/YZRaeArL9e1wPbFg3GG2yDnC2ldKpxs4xunpFF9DgqCqOIra3bc1HWrJ37Ww==}
+    engines: {node: '>=0.4.x'}
+
+  fp-ts@2.16.6:
+    resolution: {integrity: sha512-v7w209VPj4L6pPn/ftFRJu31Oa8QagwcVw7BZmLCUWU4AQoc954rX9ogSIahDf67Pg+GjPbkW/Kn9XWnlWJG0g==}
+
   fs-extra@10.1.0:
     resolution: {integrity: sha512-oRXApq54ETRj4eMiFzGnHWGy+zo5raudjuxN0b8H7s/RU2oW0Wvsx9O0ACRN/kRq9E8Vu/ReskGB5o3ji+FzHQ==}
     engines: {node: '>=12'}
@@ -3536,6 +4318,9 @@ packages:
   get-css-data@2.1.1:
     resolution: {integrity: sha512-JpMa/f5P4mDXKg6l5/2cHL5xNY77Jap7tHyduMa6BF0E2a7bQ6Tvaz2BIMjeVYZYLcmOZ5w2Ro0yVJEI41tMbw==}
 
+  get-func-name@2.0.2:
+    resolution: {integrity: sha512-8vXOvuE167CtIc3OyItco7N/dpRtBbYOsPsXCz7X/PMnlGjYjSGuZJgM1Y7mmew7BKf9BqvLX2tnOVy1BBUsxQ==}
+
   get-intrinsic@1.2.4:
     resolution: {integrity: sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==}
     engines: {node: '>= 0.4'}
@@ -3585,8 +4370,8 @@ packages:
     resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==}
     engines: {node: '>= 6'}
 
-  glob@10.4.1:
-    resolution: {integrity: sha512-2jelhlq3E4ho74ZyVLN03oKdAZVUa6UDZzFLVH1H7dnoax+y9qyaq8zBkfDIggjniU19z0wU18y16jMB2eyVIw==}
+  glob@10.4.2:
+    resolution: {integrity: sha512-GwMlUF6PkPo3Gk21UxkCohOv0PLcIXVtKyLlpEI28R/cO/4eNOdmLk3CMW1wROV/WR/EsZOWAfBbBOqYvs88/w==}
     engines: {node: '>=16 || 14 >=14.18'}
     hasBin: true
 
@@ -3622,6 +4407,10 @@ packages:
     resolution: {integrity: sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==}
     engines: {node: '>=10'}
 
+  globby@14.0.1:
+    resolution: {integrity: sha512-jOMLD2Z7MAhyG8aJpNOpmziMOP4rPLcc95oQPKXBazW82z+CEgPFBQvEpRUa1KeIMUJo4Wsm+q6uzO/Q/4BksQ==}
+    engines: {node: '>=18'}
+
   globjoin@0.1.4:
     resolution: {integrity: sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==}
 
@@ -3642,15 +4431,14 @@ packages:
   graphlib@2.1.8:
     resolution: {integrity: sha512-jcLLfkpoVGmH7/InMC/1hIvOPSUh38oJtGhvrOFGzioE1DZ+0YW16RgmOJhHiuWTvGiJQ9Z1Ik43JvkRPRvE+A==}
 
-  gray-matter@4.0.3:
-    resolution: {integrity: sha512-5v6yZd4JK3eMI3FqqCouswVqwugaA9r4dNZB1wwcmrD02QkV5H0y7XBQW8QwQqEaZY1pM9aqORSORhJRdNK44Q==}
-    engines: {node: '>=6.0'}
-
   handlebars@4.7.8:
     resolution: {integrity: sha512-vafaFqs8MZkRrSX7sFVUdo3ap/eNiLnb4IakshzvP56X5Nr1iGKAIqdX6tMlm6HcNRIkr6AxO5jFEoJzzpT8aQ==}
     engines: {node: '>=0.4.7'}
     hasBin: true
 
+  happy-dom@8.9.0:
+    resolution: {integrity: sha512-JZwJuGdR7ko8L61136YzmrLv7LgTh5b8XaEM3P709mLjyQuXJ3zHTDXvUtBBahRjGlcYW0zGjIiEWizoTUGKfA==}
+
   hard-rejection@2.1.0:
     resolution: {integrity: sha512-VIZB+ibDhx7ObhAe7OVtoEbuP4h/MuOTHJ+J8h/eBXotJYl0fBgR72xDFCKgIh22OJZIOVNxBMWuhAr10r8HdA==}
     engines: {node: '>=6'}
@@ -3688,6 +4476,10 @@ packages:
     resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==}
     engines: {node: '>= 0.4'}
 
+  he@1.2.0:
+    resolution: {integrity: sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==}
+    hasBin: true
+
   highlight.js@10.7.3:
     resolution: {integrity: sha512-tzcUFauisWKNHaRkN4Wjl/ZA07gENAjFl3J/c480dprkGTg5EQstgaNFqBfUqCq54kZRIEcreTsAgF/m2quD7A==}
 
@@ -3699,6 +4491,9 @@ packages:
     resolution: {integrity: sha512-RqGs4wavGYJWE07t35JQccByczmNUXQT0E12ZYV1VKYu5UiAU9lsos/yBAcf840+zrUQQxgVduCR5/B8nNtibg==}
     hasBin: true
 
+  hookable@5.5.3:
+    resolution: {integrity: sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==}
+
   hosted-git-info@2.8.9:
     resolution: {integrity: sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==}
 
@@ -3783,6 +4578,9 @@ packages:
     resolution: {integrity: sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==}
     engines: {node: '>=8'}
 
+  inferred-types@0.37.6:
+    resolution: {integrity: sha512-CfL5g1wR5rVwX2K5S6wSL+h9eODScum/LBwlhGRrcBIvfYppvUQM0aeRJ1BZS+QE38kGzd3v+U526+nQR7ZUkg==}
+
   inflight@1.0.6:
     resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==}
     deprecated: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
@@ -3819,9 +4617,15 @@ packages:
   is-alphabetical@1.0.4:
     resolution: {integrity: sha512-DwzsA04LQ10FHTZuL0/grVDk4rFoVH1pjAToYwBrHSxcrBIGQuXrQMtD5U1b0U2XVgKZCTLLP8u2Qxqhy3l2Vg==}
 
+  is-alphabetical@2.0.1:
+    resolution: {integrity: sha512-FWyyY60MeTNyeSRpkM2Iry0G9hpr7/9kD40mD/cGQEuilcZYS4okz8SN2Q6rLCJ8gbCt6fN+rC+6tMGS99LaxQ==}
+
   is-alphanumerical@1.0.4:
     resolution: {integrity: sha512-UzoZUr+XfVz3t3v4KyGEniVL9BDRoQtY7tOyrRybkVNjDFWyo1yhXNGrrBTQxp3ib9BLAWs7k2YKBQsFRkZG9A==}
 
+  is-alphanumerical@2.0.1:
+    resolution: {integrity: sha512-hmbYhX/9MUMF5uh7tOXyK/n0ZvWpad5caBA17GsC6vyuCqaWliRG5K1qS9inmUhEMaOBIW7/whAnSwveW/LtZw==}
+
   is-array-buffer@3.0.4:
     resolution: {integrity: sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==}
     engines: {node: '>= 0.4'}
@@ -3862,6 +4666,9 @@ packages:
   is-decimal@1.0.4:
     resolution: {integrity: sha512-RGdriMmQQvZ2aqaQq3awNA6dCGtKpiDFcOzrTWrDAT2MiWrKQVPmxLGHl7Y2nNu6led0kEyoX0enY0qXYsv9zw==}
 
+  is-decimal@2.0.1:
+    resolution: {integrity: sha512-AAB9hiomQs5DXWcRB1rqsxGUstbRroFOPPVAomNk/3XHR5JyEZChOyTWe2oayKnsSsr/kcGqF+z6yuH6HHpN0A==}
+
   is-expression@4.0.0:
     resolution: {integrity: sha512-zMIXX63sxzG3XrkHkrAPvm/OVZVSCPNkwMHU8oTX7/U3AL78I0QXCEICXUM13BIa8TYGZ68PiTKfQz3yaTNr4A==}
 
@@ -3888,6 +4695,9 @@ packages:
   is-hexadecimal@1.0.4:
     resolution: {integrity: sha512-gyPJuv83bHMpocVYoqof5VDiZveEoGoFL8m3BXNb2VW8Xs+rz9kqO8LOQ5DH6EsuvilT1ApazU0pyl+ytbPtlw==}
 
+  is-hexadecimal@2.0.1:
+    resolution: {integrity: sha512-DgZQp241c8oO6cA1SbTEWiXeoxV42vlcJxgH+B3hi1AiqqKruZR3ZGF8In3fj4+/y/7rHvlOZLZtgJ/4ttYGZg==}
+
   is-interactive@1.0.0:
     resolution: {integrity: sha512-2HvIEKRoqS62guEC+qBjpvRubdX910WCMuJTZ+I9yvqKU2/12eSL549HMwtabb4oupdj2sMP50k+XJfB/8JE6w==}
     engines: {node: '>=8'}
@@ -3920,6 +4730,10 @@ packages:
     resolution: {integrity: sha512-YWnfyRwxL/+SsrWYfOpUtz5b3YD+nyfkHvjbcanzk8zgyO4ASD67uVMRt8k5bM4lLMDnXfriRhOpemw+NfT1eA==}
     engines: {node: '>=8'}
 
+  is-plain-obj@4.1.0:
+    resolution: {integrity: sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==}
+    engines: {node: '>=12'}
+
   is-potential-custom-element-name@1.0.1:
     resolution: {integrity: sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==}
 
@@ -3972,6 +4786,10 @@ packages:
   is-weakref@1.0.2:
     resolution: {integrity: sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==}
 
+  is-what@4.1.16:
+    resolution: {integrity: sha512-ZhMwEosbFJkA0YhFnNDgTM4ZxDRsS6HqTo7qsZM08fehyRYIYa0yHu5R6mgo1n/8MgaPBXiPimPD77baVFYg+A==}
+    engines: {node: '>=12.13'}
+
   isarray@1.0.0:
     resolution: {integrity: sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==}
 
@@ -4001,8 +4819,8 @@ packages:
     resolution: {integrity: sha512-BewmUXImeuRk2YY0PVbxgKAysvhRPUQE0h5QRM++nVWyubKGV0l8qQ5op8+B2DOmwSe63Jivj0BjkPQVf8fP5g==}
     engines: {node: '>=8'}
 
-  jackspeak@3.1.2:
-    resolution: {integrity: sha512-kWmLKn2tRtfYMF/BakihVVRzBKOxz4gJMiL2Rj91WnAB5TPZumSH99R/Yf1qE1u4uRimvCSJfm6hnxohXeEXjQ==}
+  jackspeak@3.4.0:
+    resolution: {integrity: sha512-JVYhQnN59LVPFCEcVa2C3CrEKYacvjRfqIQl+h8oi91aLYQVWRYbxjPcv1bUiUy/kLmQaANrYfNMCO3kuEDHfw==}
     engines: {node: '>=14'}
 
   jest-changed-files@27.5.1:
@@ -4170,6 +4988,10 @@ packages:
     resolution: {integrity: sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==}
     hasBin: true
 
+  js-yaml@4.1.0:
+    resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==}
+    hasBin: true
+
   jsdom@16.7.0:
     resolution: {integrity: sha512-u9Smc2G1USStM+s/x1ru5Sxrl6mPYCbByG1U/hUmqaVsm4tbNyS7CicOSRyuGQYZhTu0h84qkZZQ/I+dzizSVw==}
     engines: {node: '>=10'}
@@ -4256,6 +5078,10 @@ packages:
     resolution: {integrity: sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==}
     engines: {node: '>=6'}
 
+  kleur@4.1.5:
+    resolution: {integrity: sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==}
+    engines: {node: '>=6'}
+
   known-css-properties@0.21.0:
     resolution: {integrity: sha512-sZLUnTqimCkvkgRS+kbPlYW5o8q5w1cu+uIisKpEWkj31I8mx8kNG162DwRav8Zirkva6N5uoFsm9kzK4mUXjw==}
 
@@ -4276,6 +5102,12 @@ packages:
   linkify-it@3.0.3:
     resolution: {integrity: sha512-ynTsyrFSdE5oZ/O9GEf00kPngmOfVwazR5GKDq6EYfhlpFug3J2zybX56a2PRRpc9P+FuSoGNAwjlbDs9jJBPQ==}
 
+  linkify-it@4.0.1:
+    resolution: {integrity: sha512-C7bfi1UZmoj8+PQx22XyeXCuBlokoyWQL5pWSP+EI6nzRylyThouddufc2c1NDIcP9k5agmN9fLpA7VNJfIiqw==}
+
+  linkify-it@5.0.0:
+    resolution: {integrity: sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==}
+
   lint-staged@11.2.6:
     resolution: {integrity: sha512-Vti55pUnpvPE0J9936lKl0ngVeTdSZpEdTNhASbkaWX7J5R9OEifo1INBGQuGW4zmy6OG+TcWPJ3m5yuy5Q8Tg==}
     hasBin: true
@@ -4293,6 +5125,10 @@ packages:
     resolution: {integrity: sha512-Kx8hMakjX03tiGTLAIdJ+lL0htKnXjEZN6hk/tozf/WOuYGdZBJrZ+rCJRbVCugsjB3jMLn9746NsQIf5VjBMw==}
     engines: {node: '>=4'}
 
+  local-pkg@0.4.3:
+    resolution: {integrity: sha512-SFppqq5p42fe2qcZQqqEOiVRXl+WCP1MdT6k7BDEW1j++sp5fIY+/fdRQitvKgB5BrBcmrs5m/L0v2FrU5MY1g==}
+    engines: {node: '>=14'}
+
   locate-path@2.0.0:
     resolution: {integrity: sha512-NCI2kiDkyR7VeEKm27Kda/iQHyKJe1Bu0FlTbYp3CqJu+9IFe9bLyAjMxf5ZDDbEg+iMPzB5zYyUTSm8wVTKmA==}
     engines: {node: '>=4'}
@@ -4338,10 +5174,16 @@ packages:
   longest-streak@2.0.4:
     resolution: {integrity: sha512-vM6rUVCVUJJt33bnmHiZEvr7wPT78ztX7rojL+LW51bHtLh6HTjx84LA5W4+oa6aKEJA7jJu5LR6vQRBpA5DVg==}
 
+  longest-streak@3.1.0:
+    resolution: {integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==}
+
   loose-envify@1.4.0:
     resolution: {integrity: sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==}
     hasBin: true
 
+  loupe@2.3.7:
+    resolution: {integrity: sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==}
+
   lru-cache@10.2.2:
     resolution: {integrity: sha512-9hp3Vp2/hFQUiIwKo8XCeFVnrg8Pk3TYNPIR7tJADKi5YfcF7vEaK7avFHTlSy3kOKYaJQaalfEo6YuXdceBOQ==}
     engines: {node: 14 || >=16.14}
@@ -4371,16 +5213,14 @@ packages:
     resolution: {integrity: sha512-hdN1wVrZbb29eBGiGjJbeP8JbKjq1urkHJ/LIP/NY48MZ1QVXUsQBV1G1zvYFHn1XE06cwjBsOI2K3Ulnj1YXQ==}
     engines: {node: '>=8'}
 
-  markdown-it-anchor@7.1.0:
-    resolution: {integrity: sha512-loQggrwsIkkP7TOrESvmYkV2ikbQNNKhHcWyqC7/C2CmfHl1tkUizJJU8C5aGgg7J6oXVQJx17gk7i47tNn/lQ==}
-    peerDependencies:
-      markdown-it: '*'
+  mark.js@8.11.1:
+    resolution: {integrity: sha512-1I+1qpDt4idfgLQG+BNWmrqku+7/2bi5nLf4YwF8y8zXvmfiTBY3PV3ZibfrjBueCByROpuBjLLFCajqkgYoLQ==}
 
   markdown-it-container@3.0.0:
     resolution: {integrity: sha512-y6oKTq4BB9OQuY/KLfk/O3ysFhB3IMYoIWhGJEidXt1NQFocFK2sA2t0NYZAMyMShAGL6x5OPIbrmXPIqaN9rw==}
 
-  markdown-it-emoji@2.0.2:
-    resolution: {integrity: sha512-zLftSaNrKuYl0kR5zm4gxXjHaOI3FAOEaloKmRA5hijmJZvSjmxcokOLlzycb/HXlUFWzXqpIEoyEMCE4i9MvQ==}
+  markdown-it-container@4.0.0:
+    resolution: {integrity: sha512-HaNccxUH0l7BNGYbFbjmGpf5aLHAMTinqRZQAEQbMr2cdD3z91Q6kIo1oUn1CQndkT03jat6ckrdRYuwwqLlQw==}
 
   markdown-it-emoji@3.0.0:
     resolution: {integrity: sha512-+rUD93bXHubA4arpEZO3q80so0qgoFJEKRkRbjKX8RTdca89v2kfyF+xR3i2sQTwql9tpPZPOQN5B+PunspXRg==}
@@ -4388,36 +5228,57 @@ packages:
   markdown-it-plantuml@1.4.1:
     resolution: {integrity: sha512-13KgnZaGYTHBp4iUmGofzZSBz+Zj6cyqfR0SXUIc9wgWTto5Xhn7NjaXYxY0z7uBeTUMlc9LMQq5uP4OM5xCHg==}
 
-  markdown-it-table-of-contents@0.5.2:
-    resolution: {integrity: sha512-6o+rxSwzXmXCUn1n8QGTSpgbcnHBG6lUU8x7A5Cssuq5vbfzTfitfGPvQ5PZkp+gP1NGS/DR2rkYqJPn0rbZ1A==}
-    engines: {node: '>6.4.0'}
-
   markdown-it@12.2.0:
     resolution: {integrity: sha512-Wjws+uCrVQRqOoJvze4HCqkKl1AsSh95iFAeQDwnyfxM09divCBSXlDR1uTvyUP3Grzpn4Ru8GeCxYPM8vkCQg==}
     hasBin: true
 
-  matchit@1.1.0:
-    resolution: {integrity: sha512-+nGYoOlfHmxe5BW5tE0EMJppXEwdSf8uBA1GTZC7Q77kbT35+VKLYJMzVNWCHSsga1ps1tPYFtFyvxvKzWVmMA==}
-    engines: {node: '>=6'}
+  markdown-it@13.0.2:
+    resolution: {integrity: sha512-FtwnEuuK+2yVU7goGn/MJ0WBZMM9ZPgU9spqlFs7/A/pDIUNSOQZhUgOqYCficIuR2QaFnrt8LHqBWsbTAoI5w==}
+    hasBin: true
+
+  markdown-it@14.1.0:
+    resolution: {integrity: sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==}
+    hasBin: true
 
   mathml-tag-names@2.1.3:
     resolution: {integrity: sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==}
 
+  mdast-util-directive@3.0.0:
+    resolution: {integrity: sha512-JUpYOqKI4mM3sZcNxmF/ox04XYFFkNwr0CFlrQIkCwbvH0xzMCqkMqAde9wRd80VAhaUrwFwKm2nxretdT1h7Q==}
+
   mdast-util-from-markdown@0.8.5:
     resolution: {integrity: sha512-2hkTXtYYnr+NubD/g6KGBS/0mFmBcifAsI0yIWRiRo0PjVs6SSOSOdtzbp6kSGnShDN6G5aWZpKQ2lWRy27mWQ==}
 
+  mdast-util-from-markdown@2.0.1:
+    resolution: {integrity: sha512-aJEUyzZ6TzlsX2s5B4Of7lN7EQtAxvtradMMglCQDyaTFgse6CmtmdJ15ElnVRlCg1vpNyVtbem0PWzlNieZsA==}
+
+  mdast-util-frontmatter@2.0.1:
+    resolution: {integrity: sha512-LRqI9+wdgC25P0URIJY9vwocIzCcksduHQ9OF2joxQoyTNVduwLAFUzjoopuRJbJAReaKrNQKAZKL3uCMugWJA==}
+
+  mdast-util-phrasing@4.1.0:
+    resolution: {integrity: sha512-TqICwyvJJpBwvGAMZjj4J2n0X8QWp21b9l0o7eXyVJ25YNWYbJDVIyD1bZXE6WtV6RmKJVYmQAKWa0zWOABz2w==}
+
   mdast-util-to-markdown@0.6.5:
     resolution: {integrity: sha512-XeV9sDE7ZlOQvs45C9UKMtfTcctcaj/pGwH8YLbMHoMOXNNCn2LsqVQOqrF1+/NU8lKDAqozme9SCXWyo9oAcQ==}
 
+  mdast-util-to-markdown@2.1.0:
+    resolution: {integrity: sha512-SR2VnIEdVNCJbP6y7kVTJgPLifdr8WEU440fQec7qHoHOUz/oJ2jmNRqdDQ3rbiStOXb2mCDGTuwsK5OPUgYlQ==}
+
   mdast-util-to-string@2.0.0:
     resolution: {integrity: sha512-AW4DRS3QbBayY/jJmD8437V1Gombjf8RSOUCMFBuo5iHi58AGEgVCKQ+ezHkZZDpAQS75hcBMpLqjpJTjtUL7w==}
 
+  mdast-util-to-string@4.0.0:
+    resolution: {integrity: sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==}
+
   mdn-data@2.0.14:
     resolution: {integrity: sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==}
 
   mdurl@1.0.1:
     resolution: {integrity: sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==}
 
+  mdurl@2.0.0:
+    resolution: {integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==}
+
   memorystream@0.3.1:
     resolution: {integrity: sha512-S3UwM3yj5mtUSEfP41UZmt/0SCoVYUcU1rkXv+BQ5Ig8ndL4sPoJNBUJERafdPb5jjHJGuMgytgKvKIf58XNBw==}
     engines: {node: '>= 0.10.0'}
@@ -4440,9 +5301,78 @@ packages:
   mermaid@9.1.1:
     resolution: {integrity: sha512-2RVD+WkzZ4VDyO9gQvQAuQ/ux2gLigJtKDTlbwjYqOR/NwsVzTSfGm/kx648/qWJsg6Sv04tE9BWCO8s6a+pFA==}
 
+  micromark-core-commonmark@2.0.1:
+    resolution: {integrity: sha512-CUQyKr1e///ZODyD1U3xit6zXwy1a8q2a1S1HKtIlmgvurrEpaw/Y9y6KSIbF8P59cn/NjzHyO+Q2fAyYLQrAA==}
+
+  micromark-extension-directive@3.0.0:
+    resolution: {integrity: sha512-61OI07qpQrERc+0wEysLHMvoiO3s2R56x5u7glHq2Yqq6EHbH4dW25G9GfDdGCDYqA21KE6DWgNSzxSwHc2hSg==}
+
+  micromark-extension-frontmatter@2.0.0:
+    resolution: {integrity: sha512-C4AkuM3dA58cgZha7zVnuVxBhDsbttIMiytjgsM2XbHAB2faRVaHRle40558FBN+DJcrLNCoqG5mlrpdU4cRtg==}
+
+  micromark-factory-destination@2.0.0:
+    resolution: {integrity: sha512-j9DGrQLm/Uhl2tCzcbLhy5kXsgkHUrjJHg4fFAeoMRwJmJerT9aw4FEhIbZStWN8A3qMwOp1uzHr4UL8AInxtA==}
+
+  micromark-factory-label@2.0.0:
+    resolution: {integrity: sha512-RR3i96ohZGde//4WSe/dJsxOX6vxIg9TimLAS3i4EhBAFx8Sm5SmqVfR8E87DPSR31nEAjZfbt91OMZWcNgdZw==}
+
+  micromark-factory-space@2.0.0:
+    resolution: {integrity: sha512-TKr+LIDX2pkBJXFLzpyPyljzYK3MtmllMUMODTQJIUfDGncESaqB90db9IAUcz4AZAJFdd8U9zOp9ty1458rxg==}
+
+  micromark-factory-title@2.0.0:
+    resolution: {integrity: sha512-jY8CSxmpWLOxS+t8W+FG3Xigc0RDQA9bKMY/EwILvsesiRniiVMejYTE4wumNc2f4UbAa4WsHqe3J1QS1sli+A==}
+
+  micromark-factory-whitespace@2.0.0:
+    resolution: {integrity: sha512-28kbwaBjc5yAI1XadbdPYHX/eDnqaUFVikLwrO7FDnKG7lpgxnvk/XGRhX/PN0mOZ+dBSZ+LgunHS+6tYQAzhA==}
+
+  micromark-util-character@2.1.0:
+    resolution: {integrity: sha512-KvOVV+X1yLBfs9dCBSopq/+G1PcgT3lAK07mC4BzXi5E7ahzMAF8oIupDDJ6mievI6F+lAATkbQQlQixJfT3aQ==}
+
+  micromark-util-chunked@2.0.0:
+    resolution: {integrity: sha512-anK8SWmNphkXdaKgz5hJvGa7l00qmcaUQoMYsBwDlSKFKjc6gjGXPDw3FNL3Nbwq5L8gE+RCbGqTw49FK5Qyvg==}
+
+  micromark-util-classify-character@2.0.0:
+    resolution: {integrity: sha512-S0ze2R9GH+fu41FA7pbSqNWObo/kzwf8rN/+IGlW/4tC6oACOs8B++bh+i9bVyNnwCcuksbFwsBme5OCKXCwIw==}
+
+  micromark-util-combine-extensions@2.0.0:
+    resolution: {integrity: sha512-vZZio48k7ON0fVS3CUgFatWHoKbbLTK/rT7pzpJ4Bjp5JjkZeasRfrS9wsBdDJK2cJLHMckXZdzPSSr1B8a4oQ==}
+
+  micromark-util-decode-numeric-character-reference@2.0.1:
+    resolution: {integrity: sha512-bmkNc7z8Wn6kgjZmVHOX3SowGmVdhYS7yBpMnuMnPzDq/6xwVA604DuOXMZTO1lvq01g+Adfa0pE2UKGlxL1XQ==}
+
+  micromark-util-decode-string@2.0.0:
+    resolution: {integrity: sha512-r4Sc6leeUTn3P6gk20aFMj2ntPwn6qpDZqWvYmAG6NgvFTIlj4WtrAudLi65qYoaGdXYViXYw2pkmn7QnIFasA==}
+
+  micromark-util-encode@2.0.0:
+    resolution: {integrity: sha512-pS+ROfCXAGLWCOc8egcBvT0kf27GoWMqtdarNfDcjb6YLuV5cM3ioG45Ys2qOVqeqSbjaKg72vU+Wby3eddPsA==}
+
+  micromark-util-html-tag-name@2.0.0:
+    resolution: {integrity: sha512-xNn4Pqkj2puRhKdKTm8t1YHC/BAjx6CEwRFXntTaRf/x16aqka6ouVoutm+QdkISTlT7e2zU7U4ZdlDLJd2Mcw==}
+
+  micromark-util-normalize-identifier@2.0.0:
+    resolution: {integrity: sha512-2xhYT0sfo85FMrUPtHcPo2rrp1lwbDEEzpx7jiH2xXJLqBuy4H0GgXk5ToU8IEwoROtXuL8ND0ttVa4rNqYK3w==}
+
+  micromark-util-resolve-all@2.0.0:
+    resolution: {integrity: sha512-6KU6qO7DZ7GJkaCgwBNtplXCvGkJToU86ybBAUdavvgsCiG8lSSvYxr9MhwmQ+udpzywHsl4RpGJsYWG1pDOcA==}
+
+  micromark-util-sanitize-uri@2.0.0:
+    resolution: {integrity: sha512-WhYv5UEcZrbAtlsnPuChHUAsu/iBPOVaEVsntLBIdpibO0ddy8OzavZz3iL2xVvBZOpolujSliP65Kq0/7KIYw==}
+
+  micromark-util-subtokenize@2.0.1:
+    resolution: {integrity: sha512-jZNtiFl/1aY73yS3UGQkutD0UbhTt68qnRpw2Pifmz5wV9h8gOVsN70v+Lq/f1rKaU/W8pxRe8y8Q9FX1AOe1Q==}
+
+  micromark-util-symbol@2.0.0:
+    resolution: {integrity: sha512-8JZt9ElZ5kyTnO94muPxIGS8oyElRJaiJO8EzV6ZSyGQ1Is8xwl4Q45qU5UOg+bGH4AikWziz0iN4sFLWs8PGw==}
+
+  micromark-util-types@2.0.0:
+    resolution: {integrity: sha512-oNh6S2WMHWRZrmutsRmDDfkzKtxF+bc2VxLC9dvtrDIRFln627VsFP6fLMgTryGDljgLPjkrzQSDcPrjPyDJ5w==}
+
   micromark@2.11.4:
     resolution: {integrity: sha512-+WoovN/ppKolQOFIAajxi7Lu9kInbPxFuTBVEavFcL8eAfVstoc5MocPmqBeAdBOJV00uaVjegzH4+MA0DN/uA==}
 
+  micromark@4.0.0:
+    resolution: {integrity: sha512-o/sd0nMof8kYff+TqcDx3VSrgBTcZpSvYcAHIfHhv5VAuNmisCxjhx6YmxS8PFEpb9z5WKWKPdzf0jM23ro3RQ==}
+
   micromatch@4.0.7:
     resolution: {integrity: sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==}
     engines: {node: '>=8.6'}
@@ -4485,6 +5415,9 @@ packages:
     resolution: {integrity: sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==}
     engines: {node: '>=16 || 14 >=14.17'}
 
+  minisearch@6.3.0:
+    resolution: {integrity: sha512-ihFnidEeU8iXzcVHy74dhkxh/dn8Dc08ERl0xwoMMGqp4+LvRSCgicb+zGqWthVokQKvCSxITlh3P08OzdTYCQ==}
+
   mitt@3.0.1:
     resolution: {integrity: sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==}
 
@@ -4502,19 +5435,15 @@ packages:
   monaco-editor@0.34.0:
     resolution: {integrity: sha512-VF+S5zG8wxfinLKLrWcl4WUizMx+LeJrG4PM/M78OhcwocpV0jiyhX/pG6Q9jIOhrb/ckYi6nHnaR5OojlOZCQ==}
 
-  mrmime@1.0.1:
-    resolution: {integrity: sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==}
-    engines: {node: '>=10'}
-
-  ms@2.0.0:
-    resolution: {integrity: sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==}
-
   ms@2.1.2:
     resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
 
   ms@2.1.3:
     resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
 
+  muggle-string@0.4.1:
+    resolution: {integrity: sha512-VNTrAak/KhO2i8dqqnqnAHOa3cYBwXEZe9h+D5h/1ZqFSTEFHdM65lR7RoIqq3tBBYavsOXV84NoHXZ0AkPyqQ==}
+
   mute-stream@0.0.8:
     resolution: {integrity: sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==}
 
@@ -4526,13 +5455,12 @@ packages:
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
     hasBin: true
 
+  native-dash@1.25.0:
+    resolution: {integrity: sha512-vJy1ZEfR/9jpAtuvsbPE/PuaeaJLIS+p7tl/bKEMHutRzMHnmgLv1fSmbyVvL04s2qzg0rCKZX5yfX74uiPLyA==}
+
   natural-compare@1.4.0:
     resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
 
-  negotiator@0.6.3:
-    resolution: {integrity: sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==}
-    engines: {node: '>= 0.6'}
-
   neo-async@2.6.2:
     resolution: {integrity: sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==}
 
@@ -4626,10 +5554,6 @@ packages:
     resolution: {integrity: sha512-yBYjY9QX2hnRmZHAjG/f13MzmBzxzYgQhFrke06TTyKY5zSTEqkOeukBzIdVA3j3ulu8Qa3MbVFShV7T2RmGtQ==}
     engines: {node: '>= 0.4'}
 
-  on-headers@1.0.2:
-    resolution: {integrity: sha512-pZAE+FJLoyITytdqK0U5s+FIpjN0JP3OzFi/u8Rx+EV5/W+JTWGXG8xFzevE7AjBfDqHv/8vL8qQsIhHnqRkrA==}
-    engines: {node: '>= 0.8'}
-
   once@1.4.0:
     resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
 
@@ -4693,6 +5617,9 @@ packages:
     resolution: {integrity: sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==}
     engines: {node: '>=6'}
 
+  package-json-from-dist@1.0.0:
+    resolution: {integrity: sha512-dATvCeZN/8wQsGywez1mzHtTlP22H8OEfPrVMLNr4/eGa+ijtLn/6M5f0dY8UKNrC2O9UCU6SSoG3qRKnt7STw==}
+
   parent-module@1.0.1:
     resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==}
     engines: {node: '>=6'}
@@ -4700,6 +5627,9 @@ packages:
   parse-entities@2.0.0:
     resolution: {integrity: sha512-kkywGpCcRYhqQIchaWqZ875wzpS/bMKhz5HnN3p7wveJTkTtyAB/AlnS0f8DFSqYW1T82t6yEAkEcB+A1I3MbQ==}
 
+  parse-entities@4.0.1:
+    resolution: {integrity: sha512-SWzvYcSJh4d/SGLIOQfZ/CoNv6BTlI6YEQ7Nj82oDVnRpwe/Z/F1EMx42x3JAOwGBlCjeCH0BRJQbQ/opHL17w==}
+
   parse-json@4.0.0:
     resolution: {integrity: sha512-aOIos8bujGN93/8Ox/jPLh7RwVnPEysynVFE+fQZyg6jKELEHwzgKdLRFHUgXJL6kylijVSBC4BvN9OmsB48Rw==}
     engines: {node: '>=4'}
@@ -4720,6 +5650,9 @@ packages:
   patch-vue-directive-ssr@0.0.1:
     resolution: {integrity: sha512-n84llktHah+EXUGo+RvmTJcAQJQVW0kHHHiJ34ZSLijzhHi32zCMjCc5VAFv4jmdC91bpaYGPk0cDW1D8hQ3GQ==}
 
+  path-browserify@1.0.1:
+    resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==}
+
   path-exists@3.0.0:
     resolution: {integrity: sha512-bpC7GYwiDYQ4wYLe+FA8lhRjhQCMcQGuSgGGqDkg/QerRWw9CmGRT0iSOVRSZJ29NMLZgIzqaljJ63oaL4NIJQ==}
     engines: {node: '>=4'}
@@ -4759,11 +5692,21 @@ packages:
     resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
     engines: {node: '>=8'}
 
+  path-type@5.0.0:
+    resolution: {integrity: sha512-5HviZNaZcfqP95rwpv+1HDgUamezbqdSYTyzjTvwtJSnIH+3vnbmWsItli8OFEndS984VT55M3jduxZbX351gg==}
+    engines: {node: '>=12'}
+
+  pathval@1.1.1:
+    resolution: {integrity: sha512-Dp6zGqpTdETdR63lehJYPeIOqpiNBNtc7BpWSLrOje7UaIsE5aY92r/AunQA7rsXvet3lrJ3JnZX29UPTKXyKQ==}
+
   pegjs@0.10.0:
     resolution: {integrity: sha512-qI5+oFNEGi3L5HAxDwN2LA4Gg7irF70Zs25edhjld9QemOgp0CbvMtbFcMvFtEo1OityPrcCzkQFB8JP/hxgow==}
     engines: {node: '>=0.10'}
     hasBin: true
 
+  perfect-debounce@1.0.0:
+    resolution: {integrity: sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==}
+
   picocolors@0.2.1:
     resolution: {integrity: sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==}
 
@@ -4806,9 +5749,6 @@ packages:
   please-upgrade-node@3.2.0:
     resolution: {integrity: sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg==}
 
-  polka@0.5.2:
-    resolution: {integrity: sha512-FVg3vDmCqP80tOrs+OeNlgXYmFppTXdjD5E7I4ET1NjvtNmQrb1/mJibybKkb/d4NA7YWAr1ojxuhpL3FHqdlw==}
-
   possible-typed-array-names@1.0.0:
     resolution: {integrity: sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==}
     engines: {node: '>= 0.4'}
@@ -4888,6 +5828,11 @@ packages:
     engines: {node: '>=10.13.0'}
     hasBin: true
 
+  prettier@3.3.2:
+    resolution: {integrity: sha512-rAVeHYMcv8ATV5d508CFdn+8/pHPpXeIid1DdrPwXnaAdH7cqjVbpJaT5eq4yRAFU/lsbwYwSF/n5iNrdJHPQA==}
+    engines: {node: '>=14'}
+    hasBin: true
+
   pretty-format@26.6.2:
     resolution: {integrity: sha512-7AeGuCYNGmycyQbCqd/3PWH4eOoX/OiCa0uphp57NVTeAGdJGaAliecxwBDHYQCIvrW7aDBZCYeNTP/WX69mkg==}
     engines: {node: '>= 10'}
@@ -4959,6 +5904,10 @@ packages:
   pug@3.0.3:
     resolution: {integrity: sha512-uBi6kmc9f3SZ3PXxqcHiUZLmIXgfgWooKWXcwSGwQd2Zi5Rb0bT14+8CJjJgI8AB+nndLaNgHGrcc6bPIB665g==}
 
+  punycode.js@2.3.1:
+    resolution: {integrity: sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==}
+    engines: {node: '>=6'}
+
   punycode@2.3.1:
     resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
     engines: {node: '>=6'}
@@ -5060,15 +6009,30 @@ packages:
     resolution: {integrity: sha512-dQUtn90WanSNl+7mQKcXAgZxvUe7Z0SqXlgzv0za4LwiUhyzBC58yQO3liFoUgu8GiJVInAhJjkj1N0EtQ5nkQ==}
     hasBin: true
 
+  remark-directive@3.0.0:
+    resolution: {integrity: sha512-l1UyWJ6Eg1VPU7Hm/9tt0zKtReJQNOA4+iDMAxTyZNWnJnFlbS/7zhiel/rogTLQ2vMYwDzSJa4BiVNqGlqIMA==}
+
+  remark-frontmatter@5.0.0:
+    resolution: {integrity: sha512-XTFYvNASMe5iPN0719nPrdItC9aU0ssC4v14mH1BCi1u0n1gAocqcujWUrByftZTbLhRtiKRyjYTSIOcr69UVQ==}
+
+  remark-parse@11.0.0:
+    resolution: {integrity: sha512-FCxlKLNGknS5ba/1lmpYijMUzX2esxW5xQqjWxw2eHFfS2MSdaHVINFmhjo+qN1WhZhNimq0dZATN9pH0IDrpA==}
+
   remark-parse@9.0.0:
     resolution: {integrity: sha512-geKatMwSzEXKHuzBNU1z676sGcDcFoChMK38TgdHJNAYfFtsfHDQG7MoJAjs6sgYMqyLduCYWDIWZIxiPeafEw==}
 
+  remark-stringify@11.0.0:
+    resolution: {integrity: sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw==}
+
   remark-stringify@9.0.1:
     resolution: {integrity: sha512-mWmNg3ZtESvZS8fv5PTvaPckdL4iNlCHTt8/e/8oN08nArHRHjNZMKzA/YW3+p7/lYqIw4nx1XsjCBo/AxNChg==}
 
   remark@13.0.0:
     resolution: {integrity: sha512-HDz1+IKGtOyWN+QgBiAT0kn+2s6ovOxHyPAFGKVE81VSzJ+mq7RwHFledEvB5F1p4iJvOah/LOKdFuzvRnNLCA==}
 
+  remark@15.0.1:
+    resolution: {integrity: sha512-Eht5w30ruCXgFmxVUSlNWQ9iiimq07URKeFS3hNc8cUWy1llX4KDWfyEDZRycMc+znsN9Ux5/tJ/BFdgdOwA3A==}
+
   repeat-string@1.6.1:
     resolution: {integrity: sha512-PV0dzCYDNfRi1jCDbJzpW7jNNDRuCOG/jI5ctQcGKt/clZD+YcPS3yIlWuTJMmESC8aevCFmWJy5wjAFgNqN6w==}
     engines: {node: '>=0.10'}
@@ -5125,6 +6089,9 @@ packages:
   rfdc@1.3.1:
     resolution: {integrity: sha512-r5a3l5HzYlIC68TpmYKlxWjmOP6wiPJ1vWv2HeLhNsRZMrCkxeqxiHlQ21oXmQ4F3SiryXBHhAD7JZqvOJjFmg==}
 
+  rfdc@1.4.1:
+    resolution: {integrity: sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==}
+
   rimraf@3.0.2:
     resolution: {integrity: sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==}
     deprecated: Rimraf versions prior to v4 are no longer supported
@@ -5138,6 +6105,21 @@ packages:
     engines: {node: '>=10.0.0'}
     hasBin: true
 
+  rollup@2.79.1:
+    resolution: {integrity: sha512-uKxbd0IhMZOhjAiD5oAFp7BqvkA4Dv47qpOCtaNvng4HBwdbWtdOh8f5nZNuk2rp51PMGk3bzfWu5oayNEuYnw==}
+    engines: {node: '>=10.0.0'}
+    hasBin: true
+
+  rollup@3.29.4:
+    resolution: {integrity: sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==}
+    engines: {node: '>=14.18.0', npm: '>=8.0.0'}
+    hasBin: true
+
+  rollup@4.18.0:
+    resolution: {integrity: sha512-QmJz14PX3rzbJCN1SG4Xe/bAAX2a6NpCP8ab2vfu2GiUr8AQcr2nCV/oEO3yneFarB67zk8ShlIyWb2LGTb3Sg==}
+    engines: {node: '>=18.0.0', npm: '>=8.0.0'}
+    hasBin: true
+
   run-async@2.4.1:
     resolution: {integrity: sha512-tvVnVv01b8c1RrA6Ep7JkStj85Guv/YrMcwqYQnwjsAS2cTmmPGBBjAjpCW7RrSodNSoE2/qg9O4bceNvUuDgQ==}
     engines: {node: '>=0.12.0'}
@@ -5172,8 +6154,8 @@ packages:
   safer-buffer@2.1.2:
     resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
 
-  sass@1.77.2:
-    resolution: {integrity: sha512-eb4GZt1C3avsX3heBNlrc7I09nyT00IUuo4eFhAbeXWU2fvA7oXI53SxODVAA+zgZCk9aunAZgO+losjR3fAwA==}
+  sass@1.77.6:
+    resolution: {integrity: sha512-ByXE1oLD79GVq9Ht1PeHWCPMPB8XHpBuz1r85oByKHjZY6qV6rWnQovQzXJXuQ/XyE1Oj3iPk3lo28uzaRA2/Q==}
     engines: {node: '>=14.0.0'}
     hasBin: true
 
@@ -5250,6 +6232,9 @@ packages:
     engines: {node: '>=4'}
     hasBin: true
 
+  shiki@1.7.0:
+    resolution: {integrity: sha512-H5pMn4JA7ayx8H0qOz1k2qANq6mZVCMl1gKLK6kWIrv1s2Ial4EmD4s4jE8QB5Dw03d/oCQUxc24sotuyR5byA==}
+
   side-channel@1.0.6:
     resolution: {integrity: sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==}
     engines: {node: '>= 0.4'}
@@ -5261,10 +6246,6 @@ packages:
     resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
     engines: {node: '>=14'}
 
-  sirv@1.0.19:
-    resolution: {integrity: sha512-JuLThK3TnZG1TAKDwNIqNq6QA2afLOCcm+iE8D1Kj3GA40pSPsxQjjJl0J8X3tsR7T+CP1GavpzLwYkgVLWrZQ==}
-    engines: {node: '>= 10'}
-
   sisteransi@1.0.5:
     resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==}
 
@@ -5272,6 +6253,10 @@ packages:
     resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
     engines: {node: '>=8'}
 
+  slash@5.1.0:
+    resolution: {integrity: sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==}
+    engines: {node: '>=14.16'}
+
   slice-ansi@3.0.0:
     resolution: {integrity: sha512-pSyv7bSTC7ig9Dcgbw9AuRNUb5k5V6oDudjZoMBSr13qpLBG7tB+zgCkARjq7xIUgdz5P1Qe8u+rSGdouOOIyQ==}
     engines: {node: '>=8'}
@@ -5307,6 +6292,10 @@ packages:
   spdx-license-ids@3.0.18:
     resolution: {integrity: sha512-xxRs31BqRYHwiMzudOrpSiHtZ8i/GeionCBDSilhYRj+9gIcI8wCZTlXZKu9vZIVqViP3dcp9qE5G6AlIaD+TQ==}
 
+  speakingurl@14.0.1:
+    resolution: {integrity: sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ==}
+    engines: {node: '>=0.10.0'}
+
   specificity@0.4.1:
     resolution: {integrity: sha512-1klA3Gi5PD1Wv9Q0wUoOQN1IWAuPu0D1U03ThXTr0cJ20+/iq2tHSDnK7Kk/0LXJ1ztUB2/1Os0wKmfyNgUQfg==}
     hasBin: true
@@ -5365,6 +6354,9 @@ packages:
   string_decoder@1.3.0:
     resolution: {integrity: sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==}
 
+  stringify-entities@4.0.4:
+    resolution: {integrity: sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg==}
+
   stringify-object@3.3.0:
     resolution: {integrity: sha512-rHqiFh1elqCQ9WPLIC8I0Q/g/wj5J1eMkyoiD6eoQApWHP0FtlK7rqnhmabL5VUY9JQCcqwwvlOaSuutekgyrw==}
     engines: {node: '>=4'}
@@ -5401,6 +6393,9 @@ packages:
     resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
     engines: {node: '>=8'}
 
+  strip-literal@1.3.0:
+    resolution: {integrity: sha512-PugKzOsyXpArk0yWmUwqOZecSO0GH0bPoctLcqNDH9J04pVW3lflYE0ujElBGTloevcxF5MofAOZ7C5l2b+wLg==}
+
   style-search@0.1.0:
     resolution: {integrity: sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg==}
 
@@ -5437,6 +6432,10 @@ packages:
   sugarss@2.0.0:
     resolution: {integrity: sha512-WfxjozUk0UVA4jm+U1d736AUpzSrNsQcIbyOkoE364GrtWmIrFdk5lksEupgWMD4VaT/0kVx1dobpiDumSgmJQ==}
 
+  superjson@2.2.1:
+    resolution: {integrity: sha512-8iGv75BYOa0xRJHK5vRLEjE2H/i4lulTjzpUXic3Eg8akftYjkmQDa8JARQ42rlczXyFR3IeRoeFCc7RxHsYZA==}
+    engines: {node: '>=16'}
+
   supports-color@5.5.0:
     resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
     engines: {node: '>=4'}
@@ -5468,6 +6467,9 @@ packages:
   symbol-tree@3.2.4:
     resolution: {integrity: sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==}
 
+  tabbable@6.2.0:
+    resolution: {integrity: sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==}
+
   table@6.8.2:
     resolution: {integrity: sha512-w2sfv80nrAh2VCbqR5AK27wswXhqcck2AhfnNW76beQXskGZ1V12GwS//yYVa3d3fcvAip2OUnbDAjW2k3v9fA==}
     engines: {node: '>=10.0.0'}
@@ -5517,6 +6519,17 @@ packages:
   tiny-emitter@2.1.0:
     resolution: {integrity: sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==}
 
+  tinybench@2.8.0:
+    resolution: {integrity: sha512-1/eK7zUnIklz4JUUlL+658n58XO2hHLQfSk1Zf2LKieUjxidN16eKFEoDEfjHc3ohofSSqK3X5yO6VGb6iW8Lw==}
+
+  tinypool@0.3.1:
+    resolution: {integrity: sha512-zLA1ZXlstbU2rlpA4CIeVaqvWq41MTWqLY3FfsAXgC8+f7Pk7zroaJQxDgxn1xNudKW6Kmj4808rPFShUlIRmQ==}
+    engines: {node: '>=14.0.0'}
+
+  tinyspy@1.1.1:
+    resolution: {integrity: sha512-UVq5AXt/gQlti7oxoIg5oi/9r0WpF7DGEVwXgqWSMmyN16+e3tl5lIvTaOpJ3TAtu5xFzWccFRM4R5NaWHF+4g==}
+    engines: {node: '>=14.0.0'}
+
   tmp@0.0.33:
     resolution: {integrity: sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==}
     engines: {node: '>=0.6.0'}
@@ -5535,10 +6548,6 @@ packages:
   token-stream@1.0.0:
     resolution: {integrity: sha512-VSsyNPPW74RpHwR8Fc21uubwHY7wMDeJLys2IX5zJNih+OnAnaifKHo+1LHT7DAdloQ7apeaaWg8l7qnf/TnEg==}
 
-  totalist@1.1.0:
-    resolution: {integrity: sha512-gduQwd1rOdDMGxFG1gEvhV88Oirdo2p+KjoYFU7k2g+i7n6AFFbDQ5kMPUsW0pNbfQsB/cwXvT1i4Bue0s9g5g==}
-    engines: {node: '>=6'}
-
   tough-cookie@4.1.4:
     resolution: {integrity: sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==}
     engines: {node: '>=6'}
@@ -5557,9 +6566,8 @@ packages:
   trough@1.0.5:
     resolution: {integrity: sha512-rvuRbTarPXmMb79SmzEp8aqXNKcK+y0XaB298IXueQ8I2PsrATcPBCSPyK/dDNa2iWOhKlfNnOjdAOTBU/nkFA==}
 
-  trouter@2.0.1:
-    resolution: {integrity: sha512-kr8SKKw94OI+xTGOkfsvwZQ8mWoikZDd2n8XZHjJVZUARZT+4/VV6cacRS6CLsH9bNm+HFIPU1Zx4CnNnb4qlQ==}
-    engines: {node: '>=6'}
+  trough@2.2.0:
+    resolution: {integrity: sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw==}
 
   tsconfig-paths@3.15.0:
     resolution: {integrity: sha512-2Ac2RgzDe/cn48GvOe3M+o82pEFewD3UPbyoUHHdKasHwJKjds4fLXWf/Ux5kATBKN20oaFGu+jbElp1pos0mg==}
@@ -5634,14 +6642,20 @@ packages:
   uc.micro@1.0.6:
     resolution: {integrity: sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==}
 
-  uglify-js@3.17.4:
-    resolution: {integrity: sha512-T9q82TJI9e/C1TAxYvfb16xO120tMVFZrGA3f9/P4424DNu6ypK103y0GPFVa17yotwSyZW5iYXgjYHkGrJW/g==}
+  uc.micro@2.1.0:
+    resolution: {integrity: sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==}
+
+  uglify-js@3.18.0:
+    resolution: {integrity: sha512-SyVVbcNBCk0dzr9XL/R/ySrmYf0s372K6/hFklzgcp2lBFyXtw4I7BOdDjlLhE1aVqaI/SHWXWmYdlZxuyF38A==}
     engines: {node: '>=0.8.0'}
     hasBin: true
 
   unbox-primitive@1.0.2:
     resolution: {integrity: sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==}
 
+  undici-types@5.26.5:
+    resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
+
   unicode-canonical-property-names-ecmascript@2.0.0:
     resolution: {integrity: sha512-yY5PpDlfVIU5+y/BSCxAJRBIS1Zc2dDG3Ujq+sR0U+JjUevW2JhocOF+soROYDSaAezOzOKuyyixhD6mBknSmQ==}
     engines: {node: '>=4'}
@@ -5658,6 +6672,13 @@ packages:
     resolution: {integrity: sha512-6t3foTQI9qne+OZoVQB/8x8rk2k1eVy1gRXhV3oFQ5T6R1dqQ1xtin3XqSlx3+ATBkliTaR/hHyJBm+LVPNM8w==}
     engines: {node: '>=4'}
 
+  unicorn-magic@0.1.0:
+    resolution: {integrity: sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==}
+    engines: {node: '>=18'}
+
+  unified@11.0.5:
+    resolution: {integrity: sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA==}
+
   unified@9.2.2:
     resolution: {integrity: sha512-Sg7j110mtefBD+qunSLO1lqOEKdrwBFBrR6Qd8f4uwkhWNlbkaqwHse6e7QvD3AP/MNoJdEDLaf8OxYyoWgorQ==}
 
@@ -5667,9 +6688,21 @@ packages:
   unist-util-is@4.1.0:
     resolution: {integrity: sha512-ZOQSsnce92GrxSqlnEEseX0gi7GH9zTJZ0p9dtu87WRb/37mMPO2Ilx1s/t9vBHrFhbgweUwb+t7cIn5dxPhZg==}
 
+  unist-util-is@6.0.0:
+    resolution: {integrity: sha512-2qCTHimwdxLfz+YzdGfkqNlH0tLi9xjTnHddPmJwtIG9MGsdbutfTc4P+haPD7l7Cjxf/WZj+we5qfVPvvxfYw==}
+
   unist-util-stringify-position@2.0.3:
     resolution: {integrity: sha512-3faScn5I+hy9VleOq/qNbAd6pAx7iH5jYBMS9I1HgQVijz/4mv5Bvw5iw1sC/90CODiKo81G/ps8AJrISn687g==}
 
+  unist-util-stringify-position@4.0.0:
+    resolution: {integrity: sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==}
+
+  unist-util-visit-parents@6.0.1:
+    resolution: {integrity: sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw==}
+
+  unist-util-visit@5.0.0:
+    resolution: {integrity: sha512-MR04uvD+07cwl/yhVuVWAtw+3GOR/knlL55Nd/wAdblk27GCVt3lqpTivy/tkJcZoNPzTwS1Y+KMojlLDhoTzg==}
+
   universalify@0.2.0:
     resolution: {integrity: sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==}
     engines: {node: '>= 4.0.0'}
@@ -5716,20 +6749,28 @@ packages:
   validate-npm-package-license@3.0.4:
     resolution: {integrity: sha512-DpKm2Ui/xN7/HQKCtpZxoRWBhZ9Z0kqtygG8XCgNQ8ZlDnxuQmWhj566j8fN4Cu3/JmbhsDo7fcAJq4s9h27Ew==}
 
-  vary@1.1.2:
-    resolution: {integrity: sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==}
-    engines: {node: '>= 0.8'}
-
   vfile-message@2.0.4:
     resolution: {integrity: sha512-DjssxRGkMvifUOJre00juHoP9DPWuzjxKuMDrhNbk2TdaYYBNMStsNhEOt3idrtI12VQYM/1+iM0KOzXi4pxwQ==}
 
+  vfile-message@4.0.2:
+    resolution: {integrity: sha512-jRDZ1IMLttGj41KcZvlrYAaI3CfqpLpfpf+Mfig13viT6NKvRzWZ+lXz0Y5D60w6uJIBAOGq9mSHf0gktF0duw==}
+
   vfile@4.2.1:
     resolution: {integrity: sha512-O6AE4OskCG5S1emQ/4gl8zK586RqA3srz3nfK/Viy0UPToBc5Trp9BVFb1u0CjsKrAWwnpr4ifM/KBXPWwJbCA==}
 
-  vite-plugin-md@0.6.7:
-    resolution: {integrity: sha512-R9i61r1y6gfelJKtHiHkw6NOkucFzGRgy7VL7bqMufiSh1UNyYKZrpiQtagzavpBlJSVk34lfEyfyKpQyeuocQ==}
+  vfile@6.0.1:
+    resolution: {integrity: sha512-1bYqc7pt6NIADBJ98UiG0Bn/CHIVOoZ/IyEkqIruLg0mE1BKzkOXY2D6CSqQIcKqgadppE5lrxgWXJmXd7zZJw==}
+
+  vite-plugin-md@0.21.5:
+    resolution: {integrity: sha512-gxiiSq2PmU2zUY5ZAFLEGmDFRV6J6gF85ns3hcvtgERibNST4gWxRSabqSZbGbHp3LEBwwK7C1CRLsl46yEiWg==}
+    peerDependencies:
+      vite: ^4.0.0
+
+  vite-plugin-md@0.22.5:
+    resolution: {integrity: sha512-ex6yQfan2teBT2uMzoIlDHRhKTOsNiyvblA9eLU/+uygpg4KikJPFeyBX300LqQ3pZ9qGHz35qoGJ0oLw47eZg==}
     peerDependencies:
-      vite: ^2.0.0
+      '@vitejs/plugin-vue': '>=2.3.4'
+      vite: ^4.0.0 || ^3.0.0
 
   vite-svg-loader@2.2.0:
     resolution: {integrity: sha512-FP6qCN57coIOwmtah68ofpi4dewGmfzPcoKe76RMnJoz7qBTXxQVm2BlnH0YzGeCbOcjm9NKauJ1I6J9OlUUtg==}
@@ -5750,20 +6791,125 @@ packages:
       stylus:
         optional: true
 
-  vitepress-theme-demoblock@1.3.2:
-    resolution: {integrity: sha512-uyzdb28sq2hSNzU4KeITNayWNPYUqvUWcahcqQZVvAoPlSr1tF9vGraRQWEhAFW//MII3tM/mncYLfICJfmISw==}
-    engines: {node: '>=14.0.0'}
+  vite@3.2.10:
+    resolution: {integrity: sha512-Dx3olBo/ODNiMVk/cA5Yft9Ws+snLOXrhLtrI3F4XLt4syz2Yg8fayZMWScPKoz12v5BUv7VEmQHnsfpY80fYw==}
+    engines: {node: ^14.18.0 || >=16.0.0}
     hasBin: true
+    peerDependencies:
+      '@types/node': '>= 14'
+      less: '*'
+      sass: '*'
+      stylus: '*'
+      sugarss: '*'
+      terser: ^5.4.0
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      less:
+        optional: true
+      sass:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
 
-  vitepress@0.16.1:
-    resolution: {integrity: sha512-jsgNY+b4mngVHQ1mZZ7ZGJliup/nM0jwdKTGoptwVzSQfkx5i3lF14jRRMb6ulC+9X5xbQ7N/zNcWqVWMFd/cQ==}
-    engines: {node: '>=12.0.0'}
+  vite@4.5.3:
+    resolution: {integrity: sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==}
+    engines: {node: ^14.18.0 || >=16.0.0}
     hasBin: true
+    peerDependencies:
+      '@types/node': '>= 14'
+      less: '*'
+      lightningcss: ^1.21.0
+      sass: '*'
+      stylus: '*'
+      sugarss: '*'
+      terser: ^5.4.0
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      less:
+        optional: true
+      lightningcss:
+        optional: true
+      sass:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
 
-  vitepress@0.20.1:
-    resolution: {integrity: sha512-2SOlvRv0bvPrQ3RPtp7Fh/G1MKidrsgAgYz18OvV+nIJb9iiYo0GUVHKN3OYswMh+vH78NyTeA1Q5v4YJ/H9LQ==}
-    engines: {node: '>=12.0.0'}
+  vite@5.3.1:
+    resolution: {integrity: sha512-XBmSKRLXLxiaPYamLv3/hnP/KXDai1NDexN0FpkTaZXTfycHvkRHoenpgl/fvuK/kPbB6xAgoyiryAhQNxYmAQ==}
+    engines: {node: ^18.0.0 || >=20.0.0}
+    hasBin: true
+    peerDependencies:
+      '@types/node': ^18.0.0 || >=20.0.0
+      less: '*'
+      lightningcss: ^1.21.0
+      sass: '*'
+      stylus: '*'
+      sugarss: '*'
+      terser: ^5.4.0
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      less:
+        optional: true
+      lightningcss:
+        optional: true
+      sass:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
+
+  vitepress-theme-demoblock@3.0.7:
+    resolution: {integrity: sha512-pA+Ag1Ojo25Dw6VYCFocLZahHovCF4Dlgf2iw3mODea6HvP6LTCkCnYgG6eMnRygVsVOA1lB9cHYhb2pRTnfdg==}
+    engines: {node: '>=16.0.0'}
+    hasBin: true
+
+  vitepress@1.2.3:
+    resolution: {integrity: sha512-GvEsrEeNLiDE1+fuwDAYJCYLNZDAna+EtnXlPajhv/MYeTjbNK6Bvyg6NoTdO1sbwuQJ0vuJR99bOlH53bo6lg==}
+    hasBin: true
+    peerDependencies:
+      markdown-it-mathjax3: ^4
+      postcss: ^8
+    peerDependenciesMeta:
+      markdown-it-mathjax3:
+        optional: true
+      postcss:
+        optional: true
+
+  vitest@0.25.8:
+    resolution: {integrity: sha512-X75TApG2wZTJn299E/TIYevr4E9/nBo1sUtZzn0Ci5oK8qnpZAZyhwg0qCeMSakGIWtc6oRwcQFyFfW14aOFWg==}
+    engines: {node: '>=v14.16.0'}
     hasBin: true
+    peerDependencies:
+      '@edge-runtime/vm': '*'
+      '@vitest/browser': '*'
+      '@vitest/ui': '*'
+      happy-dom: '*'
+      jsdom: '*'
+    peerDependenciesMeta:
+      '@edge-runtime/vm':
+        optional: true
+      '@vitest/browser':
+        optional: true
+      '@vitest/ui':
+        optional: true
+      happy-dom:
+        optional: true
+      jsdom:
+        optional: true
 
   void-elements@3.1.0:
     resolution: {integrity: sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==}
@@ -5827,8 +6973,8 @@ packages:
     resolution: {integrity: sha512-9r2DOv4YMXL/WBTBB6zxde93hmg6AM7thr7GMR6c5LvPxXe/lwD8gsrJGe0tha4CUvoz86ElUieThGVpM+4PLg==}
     deprecated: This package has been renamed to @vscode/web-custom-data, please update to the new name
 
-  vue-component-type-helpers@2.0.19:
-    resolution: {integrity: sha512-cN3f1aTxxKo4lzNeQAkVopswuImUrb5Iurll9Gaw5cqpnbTAxtEMM1mgi6ou4X79OCyqYv1U1mzBHJkzmiK82w==}
+  vue-component-type-helpers@2.0.21:
+    resolution: {integrity: sha512-3NaicyZ7N4B6cft4bfb7dOnPbE9CjLcx+6wZWAg5zwszfO4qXRh+U52dN5r5ZZfc6iMaxKCEcoH9CmxxoFZHLg==}
 
   vue-demi@0.14.7:
     resolution: {integrity: sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==}
@@ -5841,6 +6987,17 @@ packages:
       '@vue/composition-api':
         optional: true
 
+  vue-demi@0.14.8:
+    resolution: {integrity: sha512-Uuqnk9YE9SsWeReYqK2alDI5YzciATE0r2SkA6iMAtuXvNTMNACJLJEXNXaEy94ECuBe4Sk6RzRU80kjdbIo1Q==}
+    engines: {node: '>=12'}
+    hasBin: true
+    peerDependencies:
+      '@vue/composition-api': ^1.0.0-rc.1
+      vue: ^3.0.0-0 || ^2.6.0
+    peerDependenciesMeta:
+      '@vue/composition-api':
+        optional: true
+
   vue-eslint-parser@7.11.0:
     resolution: {integrity: sha512-qh3VhDLeh773wjgNTl7ss0VejY9bMMa0GoDG2fQVyDzRFdiU3L7fw74tWZDHNQXdZqxO3EveQroa9ct39D2nqg==}
     engines: {node: '>=8.10'}
@@ -5852,14 +7009,22 @@ packages:
     peerDependencies:
       vue: ^3.2.0
 
+  vue-router@4.3.3:
+    resolution: {integrity: sha512-8Q+u+WP4N2SXY38FDcF2H1dUEbYVHVPtPCPZj/GTZx8RCbiB8AtJP9+YIxn4Vs0svMTNQcLIzka4GH7Utkx9xQ==}
+    peerDependencies:
+      vue: ^3.2.0
+
+  vue-template-compiler@2.7.16:
+    resolution: {integrity: sha512-AYbUWAJHLGGQM7+cNTELw+KsOG9nl2CnSv467WobS5Cv9uk3wFcnr1Etsz2sEIHEZvw1U+o9mRlEO6QbZvUPGQ==}
+
   vue-tsc@0.29.8:
     resolution: {integrity: sha512-pT0wLRjvRuSmB+J4WJT6uuV9mO0KtSSXEAtaVXZQzyk5+DJdbLIQTbRce/TXSkfqt1l1WogO78RjtOJFiMCgfQ==}
     hasBin: true
     peerDependencies:
       typescript: '*'
 
-  vue-tsc@0.38.8:
-    resolution: {integrity: sha512-hhyc5SODiekcYNXG08aNg17LogR19o3i14avVejo+Fm45Dqk9Ke6rb0M19HoTKdQGfZBgqg2VUboYxmtAukWeg==}
+  vue-tsc@2.0.21:
+    resolution: {integrity: sha512-E6x1p1HaHES6Doy8pqtm7kQern79zRtIewkf9fiv7Y43Zo4AFDS5hKi+iHi2RwEhqRmuiwliB1LCEFEGwvxQnw==}
     hasBin: true
     peerDependencies:
       typescript: '*'
@@ -5872,6 +7037,14 @@ packages:
       typescript:
         optional: true
 
+  vue@3.4.29:
+    resolution: {integrity: sha512-8QUYfRcYzNlYuzKPfge1UWC6nF9ym0lx7mpGVPJYNhddxEf3DD0+kU07NTL0sXuiT2HuJuKr/iEO8WvXvT0RSQ==}
+    peerDependencies:
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+
   w3c-hr-time@1.0.2:
     resolution: {integrity: sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==}
     deprecated: Use your platform's native performance.now() and performance.timeOrigin.
@@ -5897,12 +7070,24 @@ packages:
     resolution: {integrity: sha512-qBIvFLGiBpLjfwmYAaHPXsn+ho5xZnGvyGvsarywGNc8VyQJUMHJ8OBKGGrPER0okBeMDaan4mNBlgBROxuI8w==}
     engines: {node: '>=10.4'}
 
+  webidl-conversions@7.0.0:
+    resolution: {integrity: sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==}
+    engines: {node: '>=12'}
+
   whatwg-encoding@1.0.5:
     resolution: {integrity: sha512-b5lim54JOPN9HtzvK9HFXvBma/rnfFeqsic0hSpjtDbVxR3dJKLc+KB4V6GgiGOvl7CY/KNh8rxSo9DKQrnUEw==}
 
+  whatwg-encoding@2.0.0:
+    resolution: {integrity: sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==}
+    engines: {node: '>=12'}
+
   whatwg-mimetype@2.3.0:
     resolution: {integrity: sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g==}
 
+  whatwg-mimetype@3.0.0:
+    resolution: {integrity: sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==}
+    engines: {node: '>=12'}
+
   whatwg-url@5.0.0:
     resolution: {integrity: sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==}
 
@@ -5958,8 +7143,8 @@ packages:
   write-file-atomic@3.0.3:
     resolution: {integrity: sha512-AvHcyZ5JnSfq3ioSyjrBkH9yW4m7Ayk8/9My/DD9onKeu/94fwrMocemO2QAJFAlnnDN+ZDS+ZjAR5ua1/PV/Q==}
 
-  ws@7.5.9:
-    resolution: {integrity: sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==}
+  ws@7.5.10:
+    resolution: {integrity: sha512-+dbF1tHwZpXcbOJdVOkzLDxZP1ailvSxM6ZweXTegylPny803bFhA+vqBYw4s31NSAk4S2Qz+AKXK9a4wkdjcQ==}
     engines: {node: '>=8.3.0'}
     peerDependencies:
       bufferutil: ^4.0.1
@@ -6002,8 +7187,8 @@ packages:
     resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==}
     engines: {node: '>= 6'}
 
-  yaml@2.4.2:
-    resolution: {integrity: sha512-B3VqDZ+JAg1nZpaEmWtTXUlBneoGx6CPM9b0TENK6aoSu5t73dItudwdgmi6tHlIZZId4dZ9skcAQ2UbcyAeVA==}
+  yaml@2.4.5:
+    resolution: {integrity: sha512-aBx2bnqDzVOyNKfsysjA2ms5ZlnjSAW2eG3/L5G/CSujfjLJTJsEw1bGw8kCf04KodQWk1pxlGnZ56CRxiawmg==}
     engines: {node: '>= 14'}
     hasBin: true
 
@@ -6045,6 +7230,9 @@ packages:
   zwitch@1.0.5:
     resolution: {integrity: sha512-V50KMwwzqJV0NpZIZFwfOD5/lyny3WlSzRiXgA0G7VUnRlqttta1L6UQIHzd6EuBY/cHGfwTIck7w1yH6Q5zUw==}
 
+  zwitch@2.0.4:
+    resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
+
 snapshots:
 
   '@algolia/autocomplete-core@1.9.3(@algolia/client-search@4.23.3)(algoliasearch@4.23.3)(search-insights@2.14.0)':
@@ -6156,8 +7344,6 @@ snapshots:
       '@jridgewell/gen-mapping': 0.3.5
       '@jridgewell/trace-mapping': 0.3.25
 
-  '@arr/every@1.0.1': {}
-
   '@babel/code-frame@7.12.11':
     dependencies:
       '@babel/highlight': 7.24.6
@@ -6167,7 +7353,12 @@ snapshots:
       '@babel/highlight': 7.24.6
       picocolors: 1.0.1
 
-  '@babel/compat-data@7.24.6': {}
+  '@babel/code-frame@7.24.7':
+    dependencies:
+      '@babel/highlight': 7.24.7
+      picocolors: 1.0.1
+
+  '@babel/compat-data@7.24.7': {}
 
   '@babel/core@7.24.6':
     dependencies:
@@ -6177,12 +7368,32 @@ snapshots:
       '@babel/helper-compilation-targets': 7.24.6
       '@babel/helper-module-transforms': 7.24.6(@babel/core@7.24.6)
       '@babel/helpers': 7.24.6
-      '@babel/parser': 7.24.6
+      '@babel/parser': 7.24.7
       '@babel/template': 7.24.6
-      '@babel/traverse': 7.24.6
+      '@babel/traverse': 7.24.7
       '@babel/types': 7.24.6
       convert-source-map: 2.0.0
-      debug: 4.3.4
+      debug: 4.3.4(supports-color@8.1.1)
+      gensync: 1.0.0-beta.2
+      json5: 2.2.3
+      semver: 6.3.1
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/core@7.24.7':
+    dependencies:
+      '@ampproject/remapping': 2.3.0
+      '@babel/code-frame': 7.24.7
+      '@babel/generator': 7.24.7
+      '@babel/helper-compilation-targets': 7.24.7
+      '@babel/helper-module-transforms': 7.24.7(@babel/core@7.24.7)
+      '@babel/helpers': 7.24.7
+      '@babel/parser': 7.24.7
+      '@babel/template': 7.24.7
+      '@babel/traverse': 7.24.7
+      '@babel/types': 7.24.7
+      convert-source-map: 2.0.0
+      debug: 4.3.5
       gensync: 1.0.0-beta.2
       json5: 2.2.3
       semver: 6.3.1
@@ -6196,134 +7407,199 @@ snapshots:
       '@jridgewell/trace-mapping': 0.3.25
       jsesc: 2.5.2
 
-  '@babel/helper-annotate-as-pure@7.24.6':
+  '@babel/generator@7.24.7':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/types': 7.24.7
+      '@jridgewell/gen-mapping': 0.3.5
+      '@jridgewell/trace-mapping': 0.3.25
+      jsesc: 2.5.2
 
-  '@babel/helper-builder-binary-assignment-operator-visitor@7.24.6':
+  '@babel/helper-annotate-as-pure@7.24.7':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/types': 7.24.7
+
+  '@babel/helper-builder-binary-assignment-operator-visitor@7.24.7':
+    dependencies:
+      '@babel/traverse': 7.24.7
+      '@babel/types': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
   '@babel/helper-compilation-targets@7.24.6':
     dependencies:
-      '@babel/compat-data': 7.24.6
-      '@babel/helper-validator-option': 7.24.6
-      browserslist: 4.23.0
+      '@babel/compat-data': 7.24.7
+      '@babel/helper-validator-option': 7.24.7
+      browserslist: 4.23.1
       lru-cache: 5.1.1
       semver: 6.3.1
 
-  '@babel/helper-create-class-features-plugin@7.24.6(@babel/core@7.24.6)':
+  '@babel/helper-compilation-targets@7.24.7':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-annotate-as-pure': 7.24.6
-      '@babel/helper-environment-visitor': 7.24.6
-      '@babel/helper-function-name': 7.24.6
-      '@babel/helper-member-expression-to-functions': 7.24.6
-      '@babel/helper-optimise-call-expression': 7.24.6
-      '@babel/helper-replace-supers': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-skip-transparent-expression-wrappers': 7.24.6
-      '@babel/helper-split-export-declaration': 7.24.6
+      '@babel/compat-data': 7.24.7
+      '@babel/helper-validator-option': 7.24.7
+      browserslist: 4.23.1
+      lru-cache: 5.1.1
       semver: 6.3.1
 
-  '@babel/helper-create-regexp-features-plugin@7.24.6(@babel/core@7.24.6)':
+  '@babel/helper-create-class-features-plugin@7.24.7(@babel/core@7.24.7)':
+    dependencies:
+      '@babel/core': 7.24.7
+      '@babel/helper-annotate-as-pure': 7.24.7
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-function-name': 7.24.7
+      '@babel/helper-member-expression-to-functions': 7.24.7
+      '@babel/helper-optimise-call-expression': 7.24.7
+      '@babel/helper-replace-supers': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-skip-transparent-expression-wrappers': 7.24.7
+      '@babel/helper-split-export-declaration': 7.24.7
+      semver: 6.3.1
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/helper-create-regexp-features-plugin@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-annotate-as-pure': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-annotate-as-pure': 7.24.7
       regexpu-core: 5.3.2
       semver: 6.3.1
 
-  '@babel/helper-define-polyfill-provider@0.6.2(@babel/core@7.24.6)':
+  '@babel/helper-define-polyfill-provider@0.6.2(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-compilation-targets': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      debug: 4.3.4
+      '@babel/core': 7.24.7
+      '@babel/helper-compilation-targets': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      debug: 4.3.5
       lodash.debounce: 4.0.8
       resolve: 1.22.8
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/helper-environment-visitor@7.24.6': {}
+  '@babel/helper-environment-visitor@7.24.7':
+    dependencies:
+      '@babel/types': 7.24.7
 
-  '@babel/helper-function-name@7.24.6':
+  '@babel/helper-function-name@7.24.7':
     dependencies:
-      '@babel/template': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/template': 7.24.7
+      '@babel/types': 7.24.7
 
   '@babel/helper-hoist-variables@7.24.6':
     dependencies:
       '@babel/types': 7.24.6
 
-  '@babel/helper-member-expression-to-functions@7.24.6':
+  '@babel/helper-hoist-variables@7.24.7':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/types': 7.24.7
+
+  '@babel/helper-member-expression-to-functions@7.24.7':
+    dependencies:
+      '@babel/traverse': 7.24.7
+      '@babel/types': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
   '@babel/helper-module-imports@7.22.15':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/types': 7.24.7
 
-  '@babel/helper-module-imports@7.24.6':
+  '@babel/helper-module-imports@7.24.7':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/traverse': 7.24.7
+      '@babel/types': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
   '@babel/helper-module-transforms@7.24.6(@babel/core@7.24.6)':
     dependencies:
       '@babel/core': 7.24.6
-      '@babel/helper-environment-visitor': 7.24.6
-      '@babel/helper-module-imports': 7.24.6
-      '@babel/helper-simple-access': 7.24.6
-      '@babel/helper-split-export-declaration': 7.24.6
-      '@babel/helper-validator-identifier': 7.24.6
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-module-imports': 7.24.7
+      '@babel/helper-simple-access': 7.24.7
+      '@babel/helper-split-export-declaration': 7.24.7
+      '@babel/helper-validator-identifier': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/helper-optimise-call-expression@7.24.6':
+  '@babel/helper-module-transforms@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-module-imports': 7.24.7
+      '@babel/helper-simple-access': 7.24.7
+      '@babel/helper-split-export-declaration': 7.24.7
+      '@babel/helper-validator-identifier': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/helper-plugin-utils@7.24.6': {}
+  '@babel/helper-optimise-call-expression@7.24.7':
+    dependencies:
+      '@babel/types': 7.24.7
 
-  '@babel/helper-remap-async-to-generator@7.24.6(@babel/core@7.24.6)':
+  '@babel/helper-plugin-utils@7.24.7': {}
+
+  '@babel/helper-remap-async-to-generator@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-annotate-as-pure': 7.24.6
-      '@babel/helper-environment-visitor': 7.24.6
-      '@babel/helper-wrap-function': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-annotate-as-pure': 7.24.7
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-wrap-function': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/helper-replace-supers@7.24.6(@babel/core@7.24.6)':
+  '@babel/helper-replace-supers@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-environment-visitor': 7.24.6
-      '@babel/helper-member-expression-to-functions': 7.24.6
-      '@babel/helper-optimise-call-expression': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-member-expression-to-functions': 7.24.7
+      '@babel/helper-optimise-call-expression': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/helper-simple-access@7.24.6':
+  '@babel/helper-simple-access@7.24.7':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/traverse': 7.24.7
+      '@babel/types': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/helper-skip-transparent-expression-wrappers@7.24.6':
+  '@babel/helper-skip-transparent-expression-wrappers@7.24.7':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/traverse': 7.24.7
+      '@babel/types': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/helper-split-export-declaration@7.24.6':
+  '@babel/helper-split-export-declaration@7.24.7':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/types': 7.24.7
 
-  '@babel/helper-string-parser@7.24.6': {}
+  '@babel/helper-string-parser@7.24.7': {}
 
   '@babel/helper-validator-identifier@7.24.6': {}
 
-  '@babel/helper-validator-option@7.24.6': {}
+  '@babel/helper-validator-identifier@7.24.7': {}
+
+  '@babel/helper-validator-option@7.24.7': {}
 
-  '@babel/helper-wrap-function@7.24.6':
+  '@babel/helper-wrap-function@7.24.7':
     dependencies:
-      '@babel/helper-function-name': 7.24.6
-      '@babel/template': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/helper-function-name': 7.24.7
+      '@babel/template': 7.24.7
+      '@babel/traverse': 7.24.7
+      '@babel/types': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
   '@babel/helpers@7.24.6':
     dependencies:
       '@babel/template': 7.24.6
       '@babel/types': 7.24.6
 
+  '@babel/helpers@7.24.7':
+    dependencies:
+      '@babel/template': 7.24.7
+      '@babel/types': 7.24.7
+
   '@babel/highlight@7.24.6':
     dependencies:
       '@babel/helper-validator-identifier': 7.24.6
@@ -6331,549 +7607,594 @@ snapshots:
       js-tokens: 4.0.0
       picocolors: 1.0.1
 
+  '@babel/highlight@7.24.7':
+    dependencies:
+      '@babel/helper-validator-identifier': 7.24.7
+      chalk: 2.4.2
+      js-tokens: 4.0.0
+      picocolors: 1.0.1
+
   '@babel/parser@7.12.3':
     dependencies:
       '@babel/types': 7.12.1
 
-  '@babel/parser@7.24.6':
+  '@babel/parser@7.24.7':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/types': 7.24.7
 
-  '@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-bugfix-firefox-class-in-computed-class-key@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-environment-visitor': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-skip-transparent-expression-wrappers': 7.24.6
-      '@babel/plugin-transform-optional-chaining': 7.24.6(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.24.7
+      '@babel/plugin-transform-optional-chaining': 7.24.7(@babel/core@7.24.7)
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-environment-visitor': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2(@babel/core@7.24.6)':
+  '@babel/plugin-proposal-private-property-in-object@7.21.0-placeholder-for-preset-env.2(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
+      '@babel/core': 7.24.7
 
-  '@babel/plugin-syntax-async-generators@7.8.4(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-async-generators@7.8.4(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-bigint@7.8.3(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-bigint@7.8.3(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-class-properties@7.12.13(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-class-properties@7.12.13(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-class-static-block@7.14.5(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-class-static-block@7.14.5(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-dynamic-import@7.8.3(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-dynamic-import@7.8.3(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-export-namespace-from@7.8.3(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-export-namespace-from@7.8.3(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-import-assertions@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-import-assertions@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-import-attributes@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-import-attributes@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-import-meta@7.10.4(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-import-meta@7.10.4(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-json-strings@7.8.3(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-json-strings@7.8.3(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-jsx@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-jsx@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-logical-assignment-operators@7.10.4(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-logical-assignment-operators@7.10.4(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-nullish-coalescing-operator@7.8.3(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-nullish-coalescing-operator@7.8.3(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-numeric-separator@7.10.4(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-numeric-separator@7.10.4(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-object-rest-spread@7.8.3(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-object-rest-spread@7.8.3(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-optional-catch-binding@7.8.3(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-optional-catch-binding@7.8.3(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-optional-chaining@7.8.3(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-optional-chaining@7.8.3(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-private-property-in-object@7.14.5(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-private-property-in-object@7.14.5(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-top-level-await@7.14.5(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-top-level-await@7.14.5(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-typescript@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-typescript@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-syntax-unicode-sets-regex@7.18.6(@babel/core@7.24.6)':
+  '@babel/plugin-syntax-unicode-sets-regex@7.18.6(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-create-regexp-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-create-regexp-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-arrow-functions@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-arrow-functions@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-async-generator-functions@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-async-generator-functions@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-environment-visitor': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-remap-async-to-generator': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-syntax-async-generators': 7.8.4(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-remap-async-to-generator': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-syntax-async-generators': 7.8.4(@babel/core@7.24.7)
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-async-to-generator@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-async-to-generator@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-module-imports': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-remap-async-to-generator': 7.24.6(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-module-imports': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-remap-async-to-generator': 7.24.7(@babel/core@7.24.7)
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-block-scoped-functions@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-block-scoped-functions@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-block-scoping@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-block-scoping@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-class-properties@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-class-properties@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-create-class-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-create-class-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-class-static-block@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-class-static-block@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-create-class-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-class-static-block': 7.14.5(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-create-class-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-class-static-block': 7.14.5(@babel/core@7.24.7)
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-classes@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-classes@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-annotate-as-pure': 7.24.6
-      '@babel/helper-compilation-targets': 7.24.6
-      '@babel/helper-environment-visitor': 7.24.6
-      '@babel/helper-function-name': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-replace-supers': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-split-export-declaration': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-annotate-as-pure': 7.24.7
+      '@babel/helper-compilation-targets': 7.24.7
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-function-name': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-replace-supers': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-split-export-declaration': 7.24.7
       globals: 11.12.0
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-computed-properties@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-computed-properties@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/template': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/template': 7.24.7
 
-  '@babel/plugin-transform-destructuring@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-destructuring@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-dotall-regex@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-dotall-regex@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-create-regexp-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-create-regexp-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-duplicate-keys@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-duplicate-keys@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-dynamic-import@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-dynamic-import@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-dynamic-import': 7.8.3(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-dynamic-import': 7.8.3(@babel/core@7.24.7)
 
-  '@babel/plugin-transform-exponentiation-operator@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-exponentiation-operator@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-builder-binary-assignment-operator-visitor': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-builder-binary-assignment-operator-visitor': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-export-namespace-from@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-export-namespace-from@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-export-namespace-from': 7.8.3(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-export-namespace-from': 7.8.3(@babel/core@7.24.7)
 
-  '@babel/plugin-transform-for-of@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-for-of@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-skip-transparent-expression-wrappers': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-function-name@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-function-name@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-compilation-targets': 7.24.6
-      '@babel/helper-function-name': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-compilation-targets': 7.24.7
+      '@babel/helper-function-name': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-json-strings@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-json-strings@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-json-strings': 7.8.3(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-json-strings': 7.8.3(@babel/core@7.24.7)
 
-  '@babel/plugin-transform-literals@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-literals@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-logical-assignment-operators@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-logical-assignment-operators@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-logical-assignment-operators': 7.10.4(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-logical-assignment-operators': 7.10.4(@babel/core@7.24.7)
 
-  '@babel/plugin-transform-member-expression-literals@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-member-expression-literals@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-modules-amd@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-modules-amd@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-module-transforms': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-module-transforms': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-modules-commonjs@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-modules-commonjs@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-module-transforms': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-simple-access': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-module-transforms': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-simple-access': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-modules-systemjs@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-modules-systemjs@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-hoist-variables': 7.24.6
-      '@babel/helper-module-transforms': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-validator-identifier': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-hoist-variables': 7.24.7
+      '@babel/helper-module-transforms': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-validator-identifier': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-modules-umd@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-modules-umd@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-module-transforms': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-module-transforms': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-named-capturing-groups-regex@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-named-capturing-groups-regex@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-create-regexp-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-create-regexp-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-new-target@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-new-target@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-nullish-coalescing-operator@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-nullish-coalescing-operator@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3(@babel/core@7.24.7)
 
-  '@babel/plugin-transform-numeric-separator@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-numeric-separator@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-numeric-separator': 7.10.4(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-numeric-separator': 7.10.4(@babel/core@7.24.7)
 
-  '@babel/plugin-transform-object-rest-spread@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-object-rest-spread@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-compilation-targets': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-object-rest-spread': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-transform-parameters': 7.24.6(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-compilation-targets': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-object-rest-spread': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-transform-parameters': 7.24.7(@babel/core@7.24.7)
 
-  '@babel/plugin-transform-object-super@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-object-super@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-replace-supers': 7.24.6(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-replace-supers': 7.24.7(@babel/core@7.24.7)
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-optional-catch-binding@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-optional-catch-binding@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-optional-catch-binding': 7.8.3(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-optional-catch-binding': 7.8.3(@babel/core@7.24.7)
 
-  '@babel/plugin-transform-optional-chaining@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-optional-chaining@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-skip-transparent-expression-wrappers': 7.24.6
-      '@babel/plugin-syntax-optional-chaining': 7.8.3(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.24.7
+      '@babel/plugin-syntax-optional-chaining': 7.8.3(@babel/core@7.24.7)
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-parameters@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-parameters@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-private-methods@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-private-methods@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-create-class-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-create-class-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-private-property-in-object@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-private-property-in-object@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-annotate-as-pure': 7.24.6
-      '@babel/helper-create-class-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-private-property-in-object': 7.14.5(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-annotate-as-pure': 7.24.7
+      '@babel/helper-create-class-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-private-property-in-object': 7.14.5(@babel/core@7.24.7)
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-property-literals@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-property-literals@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-regenerator@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-regenerator@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
       regenerator-transform: 0.15.2
 
-  '@babel/plugin-transform-reserved-words@7.24.6(@babel/core@7.24.6)':
-    dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-
-  '@babel/plugin-transform-shorthand-properties@7.24.6(@babel/core@7.24.6)':
-    dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-
-  '@babel/plugin-transform-spread@7.24.6(@babel/core@7.24.6)':
-    dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-skip-transparent-expression-wrappers': 7.24.6
-
-  '@babel/plugin-transform-sticky-regex@7.24.6(@babel/core@7.24.6)':
-    dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-
-  '@babel/plugin-transform-template-literals@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-reserved-words@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-typeof-symbol@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-shorthand-properties@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-typescript@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-spread@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-annotate-as-pure': 7.24.6
-      '@babel/helper-create-class-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-typescript': 7.24.6(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-skip-transparent-expression-wrappers': 7.24.7
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/plugin-transform-unicode-escapes@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-sticky-regex@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-unicode-property-regex@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-template-literals@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-create-regexp-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-unicode-regex@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-typeof-symbol@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-create-regexp-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
 
-  '@babel/plugin-transform-unicode-sets-regex@7.24.6(@babel/core@7.24.6)':
+  '@babel/plugin-transform-typescript@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-create-regexp-features-plugin': 7.24.6(@babel/core@7.24.6)
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-annotate-as-pure': 7.24.7
+      '@babel/helper-create-class-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-typescript': 7.24.7(@babel/core@7.24.7)
+    transitivePeerDependencies:
+      - supports-color
 
-  '@babel/preset-env@7.24.6(@babel/core@7.24.6)':
-    dependencies:
-      '@babel/compat-data': 7.24.6
-      '@babel/core': 7.24.6
-      '@babel/helper-compilation-targets': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-validator-option': 7.24.6
-      '@babel/plugin-bugfix-firefox-class-in-computed-class-key': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-proposal-private-property-in-object': 7.21.0-placeholder-for-preset-env.2(@babel/core@7.24.6)
-      '@babel/plugin-syntax-async-generators': 7.8.4(@babel/core@7.24.6)
-      '@babel/plugin-syntax-class-properties': 7.12.13(@babel/core@7.24.6)
-      '@babel/plugin-syntax-class-static-block': 7.14.5(@babel/core@7.24.6)
-      '@babel/plugin-syntax-dynamic-import': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-export-namespace-from': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-import-assertions': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-syntax-import-attributes': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-syntax-import-meta': 7.10.4(@babel/core@7.24.6)
-      '@babel/plugin-syntax-json-strings': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-logical-assignment-operators': 7.10.4(@babel/core@7.24.6)
-      '@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-numeric-separator': 7.10.4(@babel/core@7.24.6)
-      '@babel/plugin-syntax-object-rest-spread': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-optional-catch-binding': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-optional-chaining': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-private-property-in-object': 7.14.5(@babel/core@7.24.6)
-      '@babel/plugin-syntax-top-level-await': 7.14.5(@babel/core@7.24.6)
-      '@babel/plugin-syntax-unicode-sets-regex': 7.18.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-arrow-functions': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-async-generator-functions': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-async-to-generator': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-block-scoped-functions': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-block-scoping': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-class-properties': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-class-static-block': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-classes': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-computed-properties': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-destructuring': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-dotall-regex': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-duplicate-keys': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-dynamic-import': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-exponentiation-operator': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-export-namespace-from': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-for-of': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-function-name': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-json-strings': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-literals': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-logical-assignment-operators': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-member-expression-literals': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-modules-amd': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-modules-commonjs': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-modules-systemjs': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-modules-umd': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-named-capturing-groups-regex': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-new-target': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-nullish-coalescing-operator': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-numeric-separator': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-object-rest-spread': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-object-super': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-optional-catch-binding': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-optional-chaining': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-parameters': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-private-methods': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-private-property-in-object': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-property-literals': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-regenerator': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-reserved-words': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-shorthand-properties': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-spread': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-sticky-regex': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-template-literals': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-typeof-symbol': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-unicode-escapes': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-unicode-property-regex': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-unicode-regex': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-unicode-sets-regex': 7.24.6(@babel/core@7.24.6)
-      '@babel/preset-modules': 0.1.6-no-external-plugins(@babel/core@7.24.6)
-      babel-plugin-polyfill-corejs2: 0.4.11(@babel/core@7.24.6)
-      babel-plugin-polyfill-corejs3: 0.10.4(@babel/core@7.24.6)
-      babel-plugin-polyfill-regenerator: 0.6.2(@babel/core@7.24.6)
+  '@babel/plugin-transform-unicode-escapes@7.24.7(@babel/core@7.24.7)':
+    dependencies:
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+
+  '@babel/plugin-transform-unicode-property-regex@7.24.7(@babel/core@7.24.7)':
+    dependencies:
+      '@babel/core': 7.24.7
+      '@babel/helper-create-regexp-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+
+  '@babel/plugin-transform-unicode-regex@7.24.7(@babel/core@7.24.7)':
+    dependencies:
+      '@babel/core': 7.24.7
+      '@babel/helper-create-regexp-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+
+  '@babel/plugin-transform-unicode-sets-regex@7.24.7(@babel/core@7.24.7)':
+    dependencies:
+      '@babel/core': 7.24.7
+      '@babel/helper-create-regexp-features-plugin': 7.24.7(@babel/core@7.24.7)
+      '@babel/helper-plugin-utils': 7.24.7
+
+  '@babel/preset-env@7.24.7(@babel/core@7.24.7)':
+    dependencies:
+      '@babel/compat-data': 7.24.7
+      '@babel/core': 7.24.7
+      '@babel/helper-compilation-targets': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-validator-option': 7.24.7
+      '@babel/plugin-bugfix-firefox-class-in-computed-class-key': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-proposal-private-property-in-object': 7.21.0-placeholder-for-preset-env.2(@babel/core@7.24.7)
+      '@babel/plugin-syntax-async-generators': 7.8.4(@babel/core@7.24.7)
+      '@babel/plugin-syntax-class-properties': 7.12.13(@babel/core@7.24.7)
+      '@babel/plugin-syntax-class-static-block': 7.14.5(@babel/core@7.24.7)
+      '@babel/plugin-syntax-dynamic-import': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-export-namespace-from': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-import-assertions': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-syntax-import-attributes': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-syntax-import-meta': 7.10.4(@babel/core@7.24.7)
+      '@babel/plugin-syntax-json-strings': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-logical-assignment-operators': 7.10.4(@babel/core@7.24.7)
+      '@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-numeric-separator': 7.10.4(@babel/core@7.24.7)
+      '@babel/plugin-syntax-object-rest-spread': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-optional-catch-binding': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-optional-chaining': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-private-property-in-object': 7.14.5(@babel/core@7.24.7)
+      '@babel/plugin-syntax-top-level-await': 7.14.5(@babel/core@7.24.7)
+      '@babel/plugin-syntax-unicode-sets-regex': 7.18.6(@babel/core@7.24.7)
+      '@babel/plugin-transform-arrow-functions': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-async-generator-functions': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-async-to-generator': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-block-scoped-functions': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-block-scoping': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-class-properties': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-class-static-block': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-classes': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-computed-properties': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-destructuring': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-dotall-regex': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-duplicate-keys': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-dynamic-import': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-exponentiation-operator': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-export-namespace-from': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-for-of': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-function-name': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-json-strings': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-literals': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-logical-assignment-operators': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-member-expression-literals': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-modules-amd': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-modules-commonjs': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-modules-systemjs': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-modules-umd': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-named-capturing-groups-regex': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-new-target': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-nullish-coalescing-operator': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-numeric-separator': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-object-rest-spread': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-object-super': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-optional-catch-binding': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-optional-chaining': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-parameters': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-private-methods': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-private-property-in-object': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-property-literals': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-regenerator': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-reserved-words': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-shorthand-properties': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-spread': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-sticky-regex': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-template-literals': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-typeof-symbol': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-unicode-escapes': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-unicode-property-regex': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-unicode-regex': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-unicode-sets-regex': 7.24.7(@babel/core@7.24.7)
+      '@babel/preset-modules': 0.1.6-no-external-plugins(@babel/core@7.24.7)
+      babel-plugin-polyfill-corejs2: 0.4.11(@babel/core@7.24.7)
+      babel-plugin-polyfill-corejs3: 0.10.4(@babel/core@7.24.7)
+      babel-plugin-polyfill-regenerator: 0.6.2(@babel/core@7.24.7)
       core-js-compat: 3.37.1
       semver: 6.3.1
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/preset-modules@0.1.6-no-external-plugins(@babel/core@7.24.6)':
+  '@babel/preset-modules@0.1.6-no-external-plugins(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/types': 7.24.7
       esutils: 2.0.3
 
-  '@babel/preset-typescript@7.24.6(@babel/core@7.24.6)':
+  '@babel/preset-typescript@7.24.7(@babel/core@7.24.7)':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/helper-validator-option': 7.24.6
-      '@babel/plugin-syntax-jsx': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-modules-commonjs': 7.24.6(@babel/core@7.24.6)
-      '@babel/plugin-transform-typescript': 7.24.6(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/helper-validator-option': 7.24.7
+      '@babel/plugin-syntax-jsx': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-modules-commonjs': 7.24.7(@babel/core@7.24.7)
+      '@babel/plugin-transform-typescript': 7.24.7(@babel/core@7.24.7)
+    transitivePeerDependencies:
+      - supports-color
 
   '@babel/regjsgen@0.8.0': {}
 
@@ -6881,51 +8202,67 @@ snapshots:
     dependencies:
       regenerator-runtime: 0.14.1
 
+  '@babel/runtime@7.24.7':
+    dependencies:
+      regenerator-runtime: 0.14.1
+
   '@babel/template@7.24.6':
     dependencies:
       '@babel/code-frame': 7.24.6
-      '@babel/parser': 7.24.6
+      '@babel/parser': 7.24.7
       '@babel/types': 7.24.6
 
+  '@babel/template@7.24.7':
+    dependencies:
+      '@babel/code-frame': 7.24.7
+      '@babel/parser': 7.24.7
+      '@babel/types': 7.24.7
+
   '@babel/traverse@7.12.1':
     dependencies:
-      '@babel/code-frame': 7.24.6
-      '@babel/generator': 7.24.6
-      '@babel/helper-function-name': 7.24.6
-      '@babel/helper-split-export-declaration': 7.24.6
-      '@babel/parser': 7.24.6
+      '@babel/code-frame': 7.24.7
+      '@babel/generator': 7.24.7
+      '@babel/helper-function-name': 7.24.7
+      '@babel/helper-split-export-declaration': 7.24.7
+      '@babel/parser': 7.24.7
       '@babel/types': 7.12.1
-      debug: 4.3.4
+      debug: 4.3.5
       globals: 11.12.0
       lodash: 4.17.21
     transitivePeerDependencies:
       - supports-color
 
-  '@babel/traverse@7.24.6':
-    dependencies:
-      '@babel/code-frame': 7.24.6
-      '@babel/generator': 7.24.6
-      '@babel/helper-environment-visitor': 7.24.6
-      '@babel/helper-function-name': 7.24.6
-      '@babel/helper-hoist-variables': 7.24.6
-      '@babel/helper-split-export-declaration': 7.24.6
-      '@babel/parser': 7.24.6
-      '@babel/types': 7.24.6
-      debug: 4.3.4
+  '@babel/traverse@7.24.7':
+    dependencies:
+      '@babel/code-frame': 7.24.7
+      '@babel/generator': 7.24.7
+      '@babel/helper-environment-visitor': 7.24.7
+      '@babel/helper-function-name': 7.24.7
+      '@babel/helper-hoist-variables': 7.24.7
+      '@babel/helper-split-export-declaration': 7.24.7
+      '@babel/parser': 7.24.7
+      '@babel/types': 7.24.7
+      debug: 4.3.5
       globals: 11.12.0
     transitivePeerDependencies:
       - supports-color
 
   '@babel/types@7.12.1':
     dependencies:
-      '@babel/helper-validator-identifier': 7.24.6
+      '@babel/helper-validator-identifier': 7.24.7
       lodash: 4.17.21
       to-fast-properties: 2.0.0
 
   '@babel/types@7.24.6':
     dependencies:
-      '@babel/helper-string-parser': 7.24.6
-      '@babel/helper-validator-identifier': 7.24.6
+      '@babel/helper-string-parser': 7.24.7
+      '@babel/helper-validator-identifier': 7.24.7
+      to-fast-properties: 2.0.0
+
+  '@babel/types@7.24.7':
+    dependencies:
+      '@babel/helper-string-parser': 7.24.7
+      '@babel/helper-validator-identifier': 7.24.7
       to-fast-properties: 2.0.0
 
   '@bcoe/v8-coverage@0.2.3': {}
@@ -7025,18 +8362,8 @@ snapshots:
 
   '@devui-design/icons@1.4.0': {}
 
-  '@docsearch/css@1.0.0-alpha.28': {}
-
   '@docsearch/css@3.6.0': {}
 
-  '@docsearch/js@1.0.0-alpha.28(react-dom@16.14.0(react@16.14.0))(react@16.14.0)':
-    dependencies:
-      '@docsearch/react': 1.0.0-alpha.28(react-dom@16.14.0(react@16.14.0))(react@16.14.0)
-      preact: 10.22.0
-    transitivePeerDependencies:
-      - react
-      - react-dom
-
   '@docsearch/js@3.6.0(@algolia/client-search@4.23.3)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(search-insights@2.14.0)':
     dependencies:
       '@docsearch/react': 3.6.0(@algolia/client-search@4.23.3)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(search-insights@2.14.0)
@@ -7048,15 +8375,6 @@ snapshots:
       - react-dom
       - search-insights
 
-  '@docsearch/react@1.0.0-alpha.28(react-dom@16.14.0(react@16.14.0))(react@16.14.0)':
-    dependencies:
-      '@docsearch/css': 1.0.0-alpha.28
-      '@francoischalifour/autocomplete-core': 1.0.0-alpha.28
-      '@francoischalifour/autocomplete-preset-algolia': 1.0.0-alpha.28
-      algoliasearch: 4.23.3
-      react: 16.14.0
-      react-dom: 16.14.0(react@16.14.0)
-
   '@docsearch/react@3.6.0(@algolia/client-search@4.23.3)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(search-insights@2.14.0)':
     dependencies:
       '@algolia/autocomplete-core': 1.9.3(@algolia/client-search@4.23.3)(algoliasearch@4.23.3)(search-insights@2.14.0)
@@ -7080,13 +8398,154 @@ snapshots:
 
   '@emmetio/scanner@1.0.4': {}
 
+  '@esbuild/aix-ppc64@0.21.5':
+    optional: true
+
+  '@esbuild/android-arm64@0.18.20':
+    optional: true
+
+  '@esbuild/android-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/android-arm@0.15.18':
+    optional: true
+
+  '@esbuild/android-arm@0.18.20':
+    optional: true
+
+  '@esbuild/android-arm@0.21.5':
+    optional: true
+
+  '@esbuild/android-x64@0.18.20':
+    optional: true
+
+  '@esbuild/android-x64@0.21.5':
+    optional: true
+
+  '@esbuild/darwin-arm64@0.18.20':
+    optional: true
+
+  '@esbuild/darwin-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/darwin-x64@0.18.20':
+    optional: true
+
+  '@esbuild/darwin-x64@0.21.5':
+    optional: true
+
+  '@esbuild/freebsd-arm64@0.18.20':
+    optional: true
+
+  '@esbuild/freebsd-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.18.20':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-arm64@0.18.20':
+    optional: true
+
+  '@esbuild/linux-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-arm@0.18.20':
+    optional: true
+
+  '@esbuild/linux-arm@0.21.5':
+    optional: true
+
+  '@esbuild/linux-ia32@0.18.20':
+    optional: true
+
+  '@esbuild/linux-ia32@0.21.5':
+    optional: true
+
   '@esbuild/linux-loong64@0.14.54':
     optional: true
 
+  '@esbuild/linux-loong64@0.15.18':
+    optional: true
+
+  '@esbuild/linux-loong64@0.18.20':
+    optional: true
+
+  '@esbuild/linux-loong64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.18.20':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.21.5':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.18.20':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.18.20':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-s390x@0.18.20':
+    optional: true
+
+  '@esbuild/linux-s390x@0.21.5':
+    optional: true
+
+  '@esbuild/linux-x64@0.18.20':
+    optional: true
+
+  '@esbuild/linux-x64@0.21.5':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.18.20':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.21.5':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.18.20':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.21.5':
+    optional: true
+
+  '@esbuild/sunos-x64@0.18.20':
+    optional: true
+
+  '@esbuild/sunos-x64@0.21.5':
+    optional: true
+
+  '@esbuild/win32-arm64@0.18.20':
+    optional: true
+
+  '@esbuild/win32-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/win32-ia32@0.18.20':
+    optional: true
+
+  '@esbuild/win32-ia32@0.21.5':
+    optional: true
+
+  '@esbuild/win32-x64@0.18.20':
+    optional: true
+
+  '@esbuild/win32-x64@0.21.5':
+    optional: true
+
   '@eslint/eslintrc@0.4.3':
     dependencies:
       ajv: 6.12.6
-      debug: 4.3.4
+      debug: 4.3.4(supports-color@8.1.1)
       espree: 7.3.1
       globals: 13.24.0
       ignore: 4.0.6
@@ -7105,16 +8564,26 @@ snapshots:
     dependencies:
       '@floating-ui/core': 1.6.2
 
-  '@floating-ui/utils@0.2.2': {}
+  '@floating-ui/dom@1.6.5':
+    dependencies:
+      '@floating-ui/core': 1.6.2
+      '@floating-ui/utils': 0.2.2
 
-  '@francoischalifour/autocomplete-core@1.0.0-alpha.28': {}
+  '@floating-ui/utils@0.2.2': {}
 
-  '@francoischalifour/autocomplete-preset-algolia@1.0.0-alpha.28': {}
+  '@floating-ui/vue@1.0.6(vue@3.4.29(typescript@4.9.5))':
+    dependencies:
+      '@floating-ui/dom': 1.6.5
+      '@floating-ui/utils': 0.2.2
+      vue-demi: 0.14.8(vue@3.4.29(typescript@4.9.5))
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
 
   '@humanwhocodes/config-array@0.5.0':
     dependencies:
       '@humanwhocodes/object-schema': 1.2.1
-      debug: 4.3.4
+      debug: 4.3.4(supports-color@8.1.1)
       minimatch: 3.1.2
     transitivePeerDependencies:
       - supports-color
@@ -7166,7 +8635,7 @@ snapshots:
   '@jest/console@27.5.1':
     dependencies:
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       chalk: 4.1.2
       jest-message-util: 27.5.1
       jest-util: 27.5.1
@@ -7179,7 +8648,7 @@ snapshots:
       '@jest/test-result': 27.5.1
       '@jest/transform': 27.5.1
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       ansi-escapes: 4.3.2
       chalk: 4.1.2
       emittery: 0.8.1
@@ -7213,14 +8682,14 @@ snapshots:
     dependencies:
       '@jest/fake-timers': 27.5.1
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       jest-mock: 27.5.1
 
   '@jest/fake-timers@27.5.1':
     dependencies:
       '@jest/types': 27.5.1
       '@sinonjs/fake-timers': 8.1.0
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       jest-message-util: 27.5.1
       jest-mock: 27.5.1
       jest-util: 27.5.1
@@ -7238,7 +8707,7 @@ snapshots:
       '@jest/test-result': 27.5.1
       '@jest/transform': 27.5.1
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       chalk: 4.1.2
       collect-v8-coverage: 1.0.2
       exit: 0.1.2
@@ -7285,7 +8754,7 @@ snapshots:
 
   '@jest/transform@27.5.1':
     dependencies:
-      '@babel/core': 7.24.6
+      '@babel/core': 7.24.7
       '@jest/types': 27.5.1
       babel-plugin-istanbul: 6.1.1
       chalk: 4.1.2
@@ -7307,7 +8776,7 @@ snapshots:
     dependencies:
       '@types/istanbul-lib-coverage': 2.0.6
       '@types/istanbul-reports': 3.0.4
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       '@types/yargs': 15.0.19
       chalk: 4.1.2
 
@@ -7315,7 +8784,7 @@ snapshots:
     dependencies:
       '@types/istanbul-lib-coverage': 2.0.6
       '@types/istanbul-reports': 3.0.4
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       '@types/yargs': 16.0.9
       chalk: 4.1.2
 
@@ -7336,8 +8805,23 @@ snapshots:
       '@jridgewell/resolve-uri': 3.1.2
       '@jridgewell/sourcemap-codec': 1.4.15
 
+  '@jsdevtools/ez-spawn@3.0.4':
+    dependencies:
+      call-me-maybe: 1.0.2
+      cross-spawn: 7.0.3
+      string-argv: 0.3.1
+      type-detect: 4.0.8
+
   '@ls-lint/ls-lint@1.11.2': {}
 
+  '@mdit-vue/plugin-sfc@2.1.3':
+    dependencies:
+      '@mdit-vue/types': 2.1.0
+      '@types/markdown-it': 14.1.1
+      markdown-it: 14.1.0
+
+  '@mdit-vue/types@2.1.0': {}
+
   '@nodelib/fs.scandir@2.1.5':
     dependencies:
       '@nodelib/fs.stat': 2.0.5
@@ -7355,15 +8839,67 @@ snapshots:
   '@pkgjs/parseargs@0.11.0':
     optional: true
 
-  '@polka/url@0.5.0': {}
-
-  '@polka/url@1.0.0-next.25': {}
-
   '@rollup/pluginutils@4.2.1':
     dependencies:
       estree-walker: 2.0.2
       picomatch: 2.3.1
 
+  '@rollup/rollup-android-arm-eabi@4.18.0':
+    optional: true
+
+  '@rollup/rollup-android-arm64@4.18.0':
+    optional: true
+
+  '@rollup/rollup-darwin-arm64@4.18.0':
+    optional: true
+
+  '@rollup/rollup-darwin-x64@4.18.0':
+    optional: true
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.18.0':
+    optional: true
+
+  '@rollup/rollup-linux-arm-musleabihf@4.18.0':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-gnu@4.18.0':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-musl@4.18.0':
+    optional: true
+
+  '@rollup/rollup-linux-powerpc64le-gnu@4.18.0':
+    optional: true
+
+  '@rollup/rollup-linux-riscv64-gnu@4.18.0':
+    optional: true
+
+  '@rollup/rollup-linux-s390x-gnu@4.18.0':
+    optional: true
+
+  '@rollup/rollup-linux-x64-gnu@4.18.0':
+    optional: true
+
+  '@rollup/rollup-linux-x64-musl@4.18.0':
+    optional: true
+
+  '@rollup/rollup-win32-arm64-msvc@4.18.0':
+    optional: true
+
+  '@rollup/rollup-win32-ia32-msvc@4.18.0':
+    optional: true
+
+  '@rollup/rollup-win32-x64-msvc@4.18.0':
+    optional: true
+
+  '@shikijs/core@1.7.0': {}
+
+  '@shikijs/transformers@1.7.0':
+    dependencies:
+      shiki: 1.7.0
+
+  '@sindresorhus/merge-streams@2.3.0': {}
+
   '@sinonjs/commons@1.8.6':
     dependencies:
       type-detect: 4.0.8
@@ -7395,31 +8931,41 @@ snapshots:
 
   '@types/babel__core@7.20.5':
     dependencies:
-      '@babel/parser': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/parser': 7.24.7
+      '@babel/types': 7.24.7
       '@types/babel__generator': 7.6.8
       '@types/babel__template': 7.4.4
       '@types/babel__traverse': 7.20.6
 
   '@types/babel__generator@7.6.8':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/types': 7.24.7
 
   '@types/babel__template@7.4.4':
     dependencies:
-      '@babel/parser': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/parser': 7.24.7
+      '@babel/types': 7.24.7
 
   '@types/babel__traverse@7.20.6':
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/types': 7.24.7
 
   '@types/braces@3.0.4': {}
 
+  '@types/chai-subset@1.3.5':
+    dependencies:
+      '@types/chai': 4.3.16
+
+  '@types/chai@4.3.16': {}
+
   '@types/codemirror@0.0.97':
     dependencies:
       '@types/tern': 0.23.9
 
+  '@types/debug@4.1.12':
+    dependencies:
+      '@types/ms': 0.7.34
+
   '@types/estree@1.0.5': {}
 
   '@types/fs-extra@9.0.13':
@@ -7428,7 +8974,7 @@ snapshots:
 
   '@types/graceful-fs@4.1.9':
     dependencies:
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
 
   '@types/istanbul-lib-coverage@2.0.6': {}
 
@@ -7462,10 +9008,19 @@ snapshots:
       '@types/linkify-it': 5.0.0
       '@types/mdurl': 2.0.0
 
+  '@types/markdown-it@14.1.1':
+    dependencies:
+      '@types/linkify-it': 5.0.0
+      '@types/mdurl': 2.0.0
+
   '@types/mdast@3.0.15':
     dependencies:
       '@types/unist': 2.0.10
 
+  '@types/mdast@4.0.4':
+    dependencies:
+      '@types/unist': 3.0.2
+
   '@types/mdurl@2.0.0': {}
 
   '@types/micromatch@4.0.7':
@@ -7474,8 +9029,14 @@ snapshots:
 
   '@types/minimist@1.2.5': {}
 
+  '@types/ms@0.7.34': {}
+
   '@types/node@16.18.97': {}
 
+  '@types/node@20.14.7':
+    dependencies:
+      undici-types: 5.26.5
+
   '@types/normalize-package-data@2.4.4': {}
 
   '@types/parse-json@4.0.2': {}
@@ -7495,8 +9056,12 @@ snapshots:
 
   '@types/unist@2.0.10': {}
 
+  '@types/unist@3.0.2': {}
+
   '@types/web-bluetooth@0.0.14': {}
 
+  '@types/web-bluetooth@0.0.20': {}
+
   '@types/yargs-parser@21.0.3': {}
 
   '@types/yargs@15.0.19':
@@ -7512,7 +9077,7 @@ snapshots:
       '@typescript-eslint/experimental-utils': 4.33.0(eslint@7.32.0)(typescript@4.9.5)
       '@typescript-eslint/parser': 4.33.0(eslint@7.32.0)(typescript@4.9.5)
       '@typescript-eslint/scope-manager': 4.33.0
-      debug: 4.3.4
+      debug: 4.3.4(supports-color@8.1.1)
       eslint: 7.32.0
       functional-red-black-tree: 1.0.1
       ignore: 5.3.1
@@ -7542,7 +9107,7 @@ snapshots:
       '@typescript-eslint/scope-manager': 4.33.0
       '@typescript-eslint/types': 4.33.0
       '@typescript-eslint/typescript-estree': 4.33.0(typescript@4.9.5)
-      debug: 4.3.4
+      debug: 4.3.4(supports-color@8.1.1)
       eslint: 7.32.0
     optionalDependencies:
       typescript: 4.9.5
@@ -7560,7 +9125,7 @@ snapshots:
     dependencies:
       '@typescript-eslint/types': 4.33.0
       '@typescript-eslint/visitor-keys': 4.33.0
-      debug: 4.3.4
+      debug: 4.3.4(supports-color@8.1.1)
       globby: 11.1.0
       is-glob: 4.0.3
       semver: 7.6.2
@@ -7577,33 +9142,35 @@ snapshots:
 
   '@vitejs/plugin-vue-jsx@1.3.10':
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/plugin-syntax-import-meta': 7.10.4(@babel/core@7.24.6)
-      '@babel/plugin-transform-typescript': 7.24.6(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/plugin-syntax-import-meta': 7.10.4(@babel/core@7.24.7)
+      '@babel/plugin-transform-typescript': 7.24.7(@babel/core@7.24.7)
       '@rollup/pluginutils': 4.2.1
-      '@vue/babel-plugin-jsx': 1.2.2(@babel/core@7.24.6)
+      '@vue/babel-plugin-jsx': 1.2.2(@babel/core@7.24.7)
       hash-sum: 2.0.0
     transitivePeerDependencies:
       - supports-color
 
-  '@vitejs/plugin-vue@1.10.2(vite@2.9.18(sass@1.77.2))':
+  '@vitejs/plugin-vue@2.3.4(vite@2.9.18(sass@1.77.6))(vue@3.4.27(typescript@4.9.5))':
     dependencies:
-      vite: 2.9.18(sass@1.77.2)
+      vite: 2.9.18(sass@1.77.6)
+      vue: 3.4.27(typescript@4.9.5)
 
-  '@vitejs/plugin-vue@2.3.4(vite@2.9.18(sass@1.77.2))(vue@3.4.27(typescript@4.9.5))':
+  '@vitejs/plugin-vue@4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5))':
     dependencies:
-      vite: 2.9.18(sass@1.77.2)
-      vue: 3.4.27(typescript@4.9.5)
+      vite: 4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0)
+      vue: 3.4.29(typescript@4.9.5)
+
+  '@vitejs/plugin-vue@5.0.5(vite@5.3.1(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5))':
+    dependencies:
+      vite: 5.3.1(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0)
+      vue: 3.4.29(typescript@4.9.5)
 
   '@volar/code-gen@0.29.8':
     dependencies:
       '@volar/shared': 0.29.8
       '@volar/source-map': 0.29.8
 
-  '@volar/code-gen@0.38.8':
-    dependencies:
-      '@volar/source-map': 0.38.8
-
   '@volar/html2pug@0.29.8':
     dependencies:
       domelementtype: 2.3.0
@@ -7611,6 +9178,10 @@ snapshots:
       htmlparser2: 7.2.0
       pug: 3.0.3
 
+  '@volar/language-core@2.3.0':
+    dependencies:
+      '@volar/source-map': 2.3.0
+
   '@volar/shared@0.29.8':
     dependencies:
       upath: 2.0.1
@@ -7621,39 +9192,31 @@ snapshots:
     dependencies:
       '@volar/shared': 0.29.8
 
-  '@volar/source-map@0.38.8': {}
+  '@volar/source-map@2.3.0':
+    dependencies:
+      muggle-string: 0.4.1
 
   '@volar/transforms@0.29.8':
     dependencies:
       '@volar/shared': 0.29.8
       vscode-languageserver: 8.1.0
 
+  '@volar/typescript@2.3.0':
+    dependencies:
+      '@volar/language-core': 2.3.0
+      path-browserify: 1.0.1
+      vscode-uri: 3.0.8
+
   '@volar/vue-code-gen@0.29.8':
     dependencies:
       '@volar/code-gen': 0.29.8
       '@volar/shared': 0.29.8
       '@volar/source-map': 0.29.8
-      '@vue/compiler-core': 3.4.27
-      '@vue/compiler-dom': 3.4.27
-      '@vue/shared': 3.4.27
+      '@vue/compiler-core': 3.4.29
+      '@vue/compiler-dom': 3.4.29
+      '@vue/shared': 3.4.29
       upath: 2.0.1
 
-  '@volar/vue-code-gen@0.38.8':
-    dependencies:
-      '@volar/code-gen': 0.38.8
-      '@volar/source-map': 0.38.8
-      '@vue/compiler-core': 3.4.27
-      '@vue/compiler-dom': 3.4.27
-      '@vue/shared': 3.4.27
-
-  '@volar/vue-typescript@0.38.8':
-    dependencies:
-      '@volar/code-gen': 0.38.8
-      '@volar/source-map': 0.38.8
-      '@volar/vue-code-gen': 0.38.8
-      '@vue/compiler-sfc': 3.4.27
-      '@vue/reactivity': 3.4.27
-
   '@vscode/emmet-helper@2.9.3':
     dependencies:
       emmet: 2.4.7
@@ -7664,49 +9227,62 @@ snapshots:
 
   '@vue/babel-helper-vue-transform-on@1.2.2': {}
 
-  '@vue/babel-plugin-jsx@1.2.2(@babel/core@7.24.6)':
+  '@vue/babel-plugin-jsx@1.2.2(@babel/core@7.24.7)':
     dependencies:
       '@babel/helper-module-imports': 7.22.15
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/plugin-syntax-jsx': 7.24.6(@babel/core@7.24.6)
-      '@babel/template': 7.24.6
-      '@babel/traverse': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/plugin-syntax-jsx': 7.24.7(@babel/core@7.24.7)
+      '@babel/template': 7.24.7
+      '@babel/traverse': 7.24.7
+      '@babel/types': 7.24.7
       '@vue/babel-helper-vue-transform-on': 1.2.2
-      '@vue/babel-plugin-resolve-type': 1.2.2(@babel/core@7.24.6)
+      '@vue/babel-plugin-resolve-type': 1.2.2(@babel/core@7.24.7)
       camelcase: 6.3.0
       html-tags: 3.3.1
       svg-tags: 1.0.0
     optionalDependencies:
-      '@babel/core': 7.24.6
+      '@babel/core': 7.24.7
     transitivePeerDependencies:
       - supports-color
 
-  '@vue/babel-plugin-resolve-type@1.2.2(@babel/core@7.24.6)':
+  '@vue/babel-plugin-resolve-type@1.2.2(@babel/core@7.24.7)':
     dependencies:
-      '@babel/code-frame': 7.24.6
-      '@babel/core': 7.24.6
+      '@babel/code-frame': 7.24.7
+      '@babel/core': 7.24.7
       '@babel/helper-module-imports': 7.22.15
-      '@babel/helper-plugin-utils': 7.24.6
-      '@babel/parser': 7.24.6
-      '@vue/compiler-sfc': 3.4.27
+      '@babel/helper-plugin-utils': 7.24.7
+      '@babel/parser': 7.24.7
+      '@vue/compiler-sfc': 3.4.29
 
   '@vue/compiler-core@3.4.27':
     dependencies:
-      '@babel/parser': 7.24.6
+      '@babel/parser': 7.24.7
       '@vue/shared': 3.4.27
       entities: 4.5.0
       estree-walker: 2.0.2
       source-map-js: 1.2.0
 
+  '@vue/compiler-core@3.4.29':
+    dependencies:
+      '@babel/parser': 7.24.7
+      '@vue/shared': 3.4.29
+      entities: 4.5.0
+      estree-walker: 2.0.2
+      source-map-js: 1.2.0
+
   '@vue/compiler-dom@3.4.27':
     dependencies:
       '@vue/compiler-core': 3.4.27
       '@vue/shared': 3.4.27
 
+  '@vue/compiler-dom@3.4.29':
+    dependencies:
+      '@vue/compiler-core': 3.4.29
+      '@vue/shared': 3.4.29
+
   '@vue/compiler-sfc@3.4.27':
     dependencies:
-      '@babel/parser': 7.24.6
+      '@babel/parser': 7.24.7
       '@vue/compiler-core': 3.4.27
       '@vue/compiler-dom': 3.4.27
       '@vue/compiler-ssr': 3.4.27
@@ -7716,47 +9292,120 @@ snapshots:
       postcss: 8.4.38
       source-map-js: 1.2.0
 
+  '@vue/compiler-sfc@3.4.29':
+    dependencies:
+      '@babel/parser': 7.24.7
+      '@vue/compiler-core': 3.4.29
+      '@vue/compiler-dom': 3.4.29
+      '@vue/compiler-ssr': 3.4.29
+      '@vue/shared': 3.4.29
+      estree-walker: 2.0.2
+      magic-string: 0.30.10
+      postcss: 8.4.38
+      source-map-js: 1.2.0
+
   '@vue/compiler-ssr@3.4.27':
     dependencies:
       '@vue/compiler-dom': 3.4.27
       '@vue/shared': 3.4.27
 
+  '@vue/compiler-ssr@3.4.29':
+    dependencies:
+      '@vue/compiler-dom': 3.4.29
+      '@vue/shared': 3.4.29
+
   '@vue/devtools-api@6.6.1': {}
 
+  '@vue/devtools-api@6.6.3': {}
+
+  '@vue/devtools-api@7.3.2':
+    dependencies:
+      '@vue/devtools-kit': 7.3.2
+
+  '@vue/devtools-kit@7.3.2':
+    dependencies:
+      '@vue/devtools-shared': 7.3.2
+      birpc: 0.2.17
+      hookable: 5.5.3
+      mitt: 3.0.1
+      perfect-debounce: 1.0.0
+      speakingurl: 14.0.1
+      superjson: 2.2.1
+
+  '@vue/devtools-shared@7.3.2':
+    dependencies:
+      rfdc: 1.4.1
+
+  '@vue/language-core@2.0.21(typescript@4.9.5)':
+    dependencies:
+      '@volar/language-core': 2.3.0
+      '@vue/compiler-dom': 3.4.29
+      '@vue/shared': 3.4.29
+      computeds: 0.0.1
+      minimatch: 9.0.4
+      path-browserify: 1.0.1
+      vue-template-compiler: 2.7.16
+    optionalDependencies:
+      typescript: 4.9.5
+
   '@vue/reactivity@3.4.27':
     dependencies:
       '@vue/shared': 3.4.27
 
+  '@vue/reactivity@3.4.29':
+    dependencies:
+      '@vue/shared': 3.4.29
+
   '@vue/runtime-core@3.4.27':
     dependencies:
       '@vue/reactivity': 3.4.27
       '@vue/shared': 3.4.27
 
+  '@vue/runtime-core@3.4.29':
+    dependencies:
+      '@vue/reactivity': 3.4.29
+      '@vue/shared': 3.4.29
+
   '@vue/runtime-dom@3.4.27':
     dependencies:
       '@vue/runtime-core': 3.4.27
       '@vue/shared': 3.4.27
       csstype: 3.1.3
 
+  '@vue/runtime-dom@3.4.29':
+    dependencies:
+      '@vue/reactivity': 3.4.29
+      '@vue/runtime-core': 3.4.29
+      '@vue/shared': 3.4.29
+      csstype: 3.1.3
+
   '@vue/server-renderer@3.4.27(vue@3.4.27(typescript@4.9.5))':
     dependencies:
       '@vue/compiler-ssr': 3.4.27
       '@vue/shared': 3.4.27
       vue: 3.4.27(typescript@4.9.5)
 
+  '@vue/server-renderer@3.4.29(vue@3.4.29(typescript@4.9.5))':
+    dependencies:
+      '@vue/compiler-ssr': 3.4.29
+      '@vue/shared': 3.4.29
+      vue: 3.4.29(typescript@4.9.5)
+
   '@vue/shared@3.4.27': {}
 
+  '@vue/shared@3.4.29': {}
+
   '@vue/test-utils@2.4.6':
     dependencies:
       js-beautify: 1.15.1
-      vue-component-type-helpers: 2.0.19
+      vue-component-type-helpers: 2.0.21
 
   '@vuedx/analyze@0.4.1':
     dependencies:
-      '@babel/code-frame': 7.24.6
-      '@babel/generator': 7.24.6
-      '@babel/parser': 7.24.6
-      '@babel/template': 7.24.6
+      '@babel/code-frame': 7.24.7
+      '@babel/generator': 7.24.7
+      '@babel/parser': 7.24.7
+      '@babel/template': 7.24.7
       '@babel/traverse': 7.12.1
       '@babel/types': 7.12.1
       '@types/micromatch': 4.0.7
@@ -7774,7 +9423,7 @@ snapshots:
 
   '@vuedx/compiler-sfc@0.4.1':
     dependencies:
-      '@vue/compiler-core': 3.4.27
+      '@vue/compiler-core': 3.4.29
       lru-cache: 6.0.0
       source-map: 0.6.1
 
@@ -7782,14 +9431,14 @@ snapshots:
     dependencies:
       '@babel/parser': 7.12.3
       '@babel/types': 7.12.1
-      '@vue/compiler-core': 3.4.27
+      '@vue/compiler-core': 3.4.29
       '@vuedx/template-ast-types': 0.4.1
 
   '@vuedx/projectconfig@0.4.1': {}
 
   '@vuedx/template-ast-types@0.4.1':
     dependencies:
-      '@vue/compiler-core': 3.4.27
+      '@vue/compiler-core': 3.4.29
 
   '@vuedx/typecheck@0.4.1':
     dependencies:
@@ -7829,6 +9478,16 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@vueuse/core@10.11.0(vue@3.4.29(typescript@4.9.5))':
+    dependencies:
+      '@types/web-bluetooth': 0.0.20
+      '@vueuse/metadata': 10.11.0
+      '@vueuse/shared': 10.11.0(vue@3.4.29(typescript@4.9.5))
+      vue-demi: 0.14.8(vue@3.4.29(typescript@4.9.5))
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
+
   '@vueuse/core@8.9.4(vue@3.4.27(typescript@4.9.5))':
     dependencies:
       '@types/web-bluetooth': 0.0.14
@@ -7838,14 +9497,112 @@ snapshots:
     optionalDependencies:
       vue: 3.4.27(typescript@4.9.5)
 
+  '@vueuse/core@8.9.4(vue@3.4.29(typescript@4.9.5))':
+    dependencies:
+      '@types/web-bluetooth': 0.0.14
+      '@vueuse/metadata': 8.9.4
+      '@vueuse/shared': 8.9.4(vue@3.4.29(typescript@4.9.5))
+      vue-demi: 0.14.8(vue@3.4.29(typescript@4.9.5))
+    optionalDependencies:
+      vue: 3.4.29(typescript@4.9.5)
+
+  '@vueuse/integrations@10.11.0(async-validator@4.2.5)(focus-trap@7.5.4)(vue@3.4.29(typescript@4.9.5))':
+    dependencies:
+      '@vueuse/core': 10.11.0(vue@3.4.29(typescript@4.9.5))
+      '@vueuse/shared': 10.11.0(vue@3.4.29(typescript@4.9.5))
+      vue-demi: 0.14.8(vue@3.4.29(typescript@4.9.5))
+    optionalDependencies:
+      async-validator: 4.2.5
+      focus-trap: 7.5.4
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
+
+  '@vueuse/metadata@10.11.0': {}
+
   '@vueuse/metadata@8.9.4': {}
 
+  '@vueuse/shared@10.11.0(vue@3.4.29(typescript@4.9.5))':
+    dependencies:
+      vue-demi: 0.14.8(vue@3.4.29(typescript@4.9.5))
+    transitivePeerDependencies:
+      - '@vue/composition-api'
+      - vue
+
   '@vueuse/shared@8.9.4(vue@3.4.27(typescript@4.9.5))':
     dependencies:
       vue-demi: 0.14.7(vue@3.4.27(typescript@4.9.5))
     optionalDependencies:
       vue: 3.4.27(typescript@4.9.5)
 
+  '@vueuse/shared@8.9.4(vue@3.4.29(typescript@4.9.5))':
+    dependencies:
+      vue-demi: 0.14.8(vue@3.4.29(typescript@4.9.5))
+    optionalDependencies:
+      vue: 3.4.29(typescript@4.9.5)
+
+  '@yankeeinlondon/builder-api@1.4.1(@vitejs/plugin-vue@4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5)))(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))':
+    dependencies:
+      '@types/markdown-it': 12.2.3
+      '@yankeeinlondon/happy-wrapper': 2.10.1(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+      fp-ts: 2.16.6
+      inferred-types: 0.37.6(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+      markdown-it: 13.0.2
+      vite-plugin-md: 0.22.5(@vitejs/plugin-vue@4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5)))(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))
+    transitivePeerDependencies:
+      - '@edge-runtime/vm'
+      - '@vitejs/plugin-vue'
+      - '@vitest/browser'
+      - '@vitest/ui'
+      - encoding
+      - happy-dom
+      - jsdom
+      - less
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+      - vite
+
+  '@yankeeinlondon/gray-matter@6.2.1(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)':
+    dependencies:
+      inferred-types: 0.37.6(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+      js-yaml: 4.1.0
+      kind-of: 6.0.3
+      section-matter: 1.0.0
+      strip-bom-string: 1.0.0
+    transitivePeerDependencies:
+      - '@edge-runtime/vm'
+      - '@vitest/browser'
+      - '@vitest/ui'
+      - happy-dom
+      - jsdom
+      - less
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+
+  '@yankeeinlondon/happy-wrapper@2.10.1(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)':
+    dependencies:
+      fp-ts: 2.16.6
+      happy-dom: 8.9.0
+      native-dash: 1.25.0(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+    transitivePeerDependencies:
+      - '@edge-runtime/vm'
+      - '@vitest/browser'
+      - '@vitest/ui'
+      - encoding
+      - jsdom
+      - less
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+
   JSONStream@1.3.5:
     dependencies:
       jsonparse: 1.3.1
@@ -7857,11 +9614,6 @@ snapshots:
 
   abbrev@2.0.0: {}
 
-  accepts@1.3.8:
-    dependencies:
-      mime-types: 2.1.35
-      negotiator: 0.6.3
-
   acorn-globals@6.0.0:
     dependencies:
       acorn: 7.4.1
@@ -7873,15 +9625,19 @@ snapshots:
 
   acorn-walk@7.2.0: {}
 
+  acorn-walk@8.3.3:
+    dependencies:
+      acorn: 8.12.0
+
   acorn@7.4.1: {}
 
-  acorn@8.11.3: {}
+  acorn@8.12.0: {}
 
   add-stream@1.0.0: {}
 
   agent-base@6.0.2:
     dependencies:
-      debug: 4.3.4
+      debug: 4.3.5
     transitivePeerDependencies:
       - supports-color
 
@@ -8032,6 +9788,8 @@ snapshots:
 
   assert-never@1.2.1: {}
 
+  assertion-error@1.1.0: {}
+
   astral-regex@2.0.0: {}
 
   async-validator@4.2.5: {}
@@ -8056,14 +9814,14 @@ snapshots:
     dependencies:
       possible-typed-array-names: 1.0.0
 
-  babel-jest@27.5.1(@babel/core@7.24.6):
+  babel-jest@27.5.1(@babel/core@7.24.7):
     dependencies:
-      '@babel/core': 7.24.6
+      '@babel/core': 7.24.7
       '@jest/transform': 27.5.1
       '@jest/types': 27.5.1
       '@types/babel__core': 7.20.5
       babel-plugin-istanbul: 6.1.1
-      babel-preset-jest: 27.5.1(@babel/core@7.24.6)
+      babel-preset-jest: 27.5.1(@babel/core@7.24.7)
       chalk: 4.1.2
       graceful-fs: 4.2.11
       slash: 3.0.0
@@ -8072,7 +9830,7 @@ snapshots:
 
   babel-plugin-istanbul@6.1.1:
     dependencies:
-      '@babel/helper-plugin-utils': 7.24.6
+      '@babel/helper-plugin-utils': 7.24.7
       '@istanbuljs/load-nyc-config': 1.1.0
       '@istanbuljs/schema': 0.1.3
       istanbul-lib-instrument: 5.2.1
@@ -8082,63 +9840,65 @@ snapshots:
 
   babel-plugin-jest-hoist@27.5.1:
     dependencies:
-      '@babel/template': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/template': 7.24.7
+      '@babel/types': 7.24.7
       '@types/babel__core': 7.20.5
       '@types/babel__traverse': 7.20.6
 
-  babel-plugin-polyfill-corejs2@0.4.11(@babel/core@7.24.6):
+  babel-plugin-polyfill-corejs2@0.4.11(@babel/core@7.24.7):
     dependencies:
-      '@babel/compat-data': 7.24.6
-      '@babel/core': 7.24.6
-      '@babel/helper-define-polyfill-provider': 0.6.2(@babel/core@7.24.6)
+      '@babel/compat-data': 7.24.7
+      '@babel/core': 7.24.7
+      '@babel/helper-define-polyfill-provider': 0.6.2(@babel/core@7.24.7)
       semver: 6.3.1
     transitivePeerDependencies:
       - supports-color
 
-  babel-plugin-polyfill-corejs3@0.10.4(@babel/core@7.24.6):
+  babel-plugin-polyfill-corejs3@0.10.4(@babel/core@7.24.7):
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-define-polyfill-provider': 0.6.2(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-define-polyfill-provider': 0.6.2(@babel/core@7.24.7)
       core-js-compat: 3.37.1
     transitivePeerDependencies:
       - supports-color
 
-  babel-plugin-polyfill-regenerator@0.6.2(@babel/core@7.24.6):
+  babel-plugin-polyfill-regenerator@0.6.2(@babel/core@7.24.7):
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/helper-define-polyfill-provider': 0.6.2(@babel/core@7.24.6)
+      '@babel/core': 7.24.7
+      '@babel/helper-define-polyfill-provider': 0.6.2(@babel/core@7.24.7)
     transitivePeerDependencies:
       - supports-color
 
-  babel-preset-current-node-syntax@1.0.1(@babel/core@7.24.6):
-    dependencies:
-      '@babel/core': 7.24.6
-      '@babel/plugin-syntax-async-generators': 7.8.4(@babel/core@7.24.6)
-      '@babel/plugin-syntax-bigint': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-class-properties': 7.12.13(@babel/core@7.24.6)
-      '@babel/plugin-syntax-import-meta': 7.10.4(@babel/core@7.24.6)
-      '@babel/plugin-syntax-json-strings': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-logical-assignment-operators': 7.10.4(@babel/core@7.24.6)
-      '@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-numeric-separator': 7.10.4(@babel/core@7.24.6)
-      '@babel/plugin-syntax-object-rest-spread': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-optional-catch-binding': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-optional-chaining': 7.8.3(@babel/core@7.24.6)
-      '@babel/plugin-syntax-top-level-await': 7.14.5(@babel/core@7.24.6)
-
-  babel-preset-jest@27.5.1(@babel/core@7.24.6):
-    dependencies:
-      '@babel/core': 7.24.6
+  babel-preset-current-node-syntax@1.0.1(@babel/core@7.24.7):
+    dependencies:
+      '@babel/core': 7.24.7
+      '@babel/plugin-syntax-async-generators': 7.8.4(@babel/core@7.24.7)
+      '@babel/plugin-syntax-bigint': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-class-properties': 7.12.13(@babel/core@7.24.7)
+      '@babel/plugin-syntax-import-meta': 7.10.4(@babel/core@7.24.7)
+      '@babel/plugin-syntax-json-strings': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-logical-assignment-operators': 7.10.4(@babel/core@7.24.7)
+      '@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-numeric-separator': 7.10.4(@babel/core@7.24.7)
+      '@babel/plugin-syntax-object-rest-spread': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-optional-catch-binding': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-optional-chaining': 7.8.3(@babel/core@7.24.7)
+      '@babel/plugin-syntax-top-level-await': 7.14.5(@babel/core@7.24.7)
+
+  babel-preset-jest@27.5.1(@babel/core@7.24.7):
+    dependencies:
+      '@babel/core': 7.24.7
       babel-plugin-jest-hoist: 27.5.1
-      babel-preset-current-node-syntax: 1.0.1(@babel/core@7.24.6)
+      babel-preset-current-node-syntax: 1.0.1(@babel/core@7.24.7)
 
   babel-walk@3.0.0-canary-5:
     dependencies:
-      '@babel/types': 7.24.6
+      '@babel/types': 7.24.7
 
   bail@1.0.5: {}
 
+  bail@2.0.2: {}
+
   balanced-match@1.0.2: {}
 
   balanced-match@2.0.0: {}
@@ -8156,6 +9916,8 @@ snapshots:
 
   binary-extensions@2.3.0: {}
 
+  birpc@0.2.17: {}
+
   bl@4.1.0:
     dependencies:
       buffer: 5.7.1
@@ -8177,6 +9939,25 @@ snapshots:
     dependencies:
       fill-range: 7.1.1
 
+  brilliant-errors@0.7.3(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0):
+    dependencies:
+      bumpp: 8.2.1
+      callsites: 4.1.0
+      inferred-types: 0.37.6(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+      vitest: 0.25.8(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+    transitivePeerDependencies:
+      - '@edge-runtime/vm'
+      - '@vitest/browser'
+      - '@vitest/ui'
+      - happy-dom
+      - jsdom
+      - less
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+
   browser-process-hrtime@1.0.0: {}
 
   browserslist@4.23.0:
@@ -8186,6 +9967,13 @@ snapshots:
       node-releases: 2.0.14
       update-browserslist-db: 1.0.16(browserslist@4.23.0)
 
+  browserslist@4.23.1:
+    dependencies:
+      caniuse-lite: 1.0.30001636
+      electron-to-chromium: 1.4.807
+      node-releases: 2.0.14
+      update-browserslist-db: 1.0.16(browserslist@4.23.1)
+
   bser@2.1.1:
     dependencies:
       node-int64: 0.4.0
@@ -8197,7 +9985,16 @@ snapshots:
       base64-js: 1.5.1
       ieee754: 1.2.1
 
-  bytes@3.0.0: {}
+  bumpp@8.2.1:
+    dependencies:
+      '@jsdevtools/ez-spawn': 3.0.4
+      cac: 6.7.14
+      fast-glob: 3.3.2
+      kleur: 4.1.5
+      prompts: 2.4.2
+      semver: 7.6.2
+
+  cac@6.7.14: {}
 
   call-bind@1.0.7:
     dependencies:
@@ -8207,8 +10004,12 @@ snapshots:
       get-intrinsic: 1.2.4
       set-function-length: 1.2.2
 
+  call-me-maybe@1.0.2: {}
+
   callsites@3.1.0: {}
 
+  callsites@4.1.0: {}
+
   camelcase-keys@6.2.2:
     dependencies:
       camelcase: 5.3.1
@@ -8219,8 +10020,22 @@ snapshots:
 
   camelcase@6.3.0: {}
 
+  camelcase@8.0.0: {}
+
   caniuse-lite@1.0.30001621: {}
 
+  caniuse-lite@1.0.30001636: {}
+
+  chai@4.4.1:
+    dependencies:
+      assertion-error: 1.1.0
+      check-error: 1.0.3
+      deep-eql: 4.1.4
+      get-func-name: 2.0.2
+      loupe: 2.3.7
+      pathval: 1.1.1
+      type-detect: 4.0.8
+
   chalk@2.4.2:
     dependencies:
       ansi-styles: 3.2.1
@@ -8241,18 +10056,30 @@ snapshots:
 
   char-regex@1.0.2: {}
 
+  character-entities-html4@2.1.0: {}
+
   character-entities-legacy@1.1.4: {}
 
+  character-entities-legacy@3.0.0: {}
+
   character-entities@1.2.4: {}
 
+  character-entities@2.0.2: {}
+
   character-parser@2.2.0:
     dependencies:
       is-regex: 1.1.4
 
   character-reference-invalid@1.1.4: {}
 
+  character-reference-invalid@2.0.1: {}
+
   chardet@0.7.0: {}
 
+  check-error@1.0.3:
+    dependencies:
+      get-func-name: 2.0.2
+
   chokidar@3.6.0:
     dependencies:
       anymatch: 3.1.3
@@ -8374,21 +10201,7 @@ snapshots:
       array-ify: 1.0.0
       dot-prop: 5.3.0
 
-  compressible@2.0.18:
-    dependencies:
-      mime-db: 1.52.0
-
-  compression@1.7.4:
-    dependencies:
-      accepts: 1.3.8
-      bytes: 3.0.0
-      compressible: 2.0.18
-      debug: 2.6.9
-      on-headers: 1.0.2
-      safe-buffer: 5.1.2
-      vary: 1.1.2
-    transitivePeerDependencies:
-      - supports-color
+  computeds@0.0.1: {}
 
   concat-map@0.0.1: {}
 
@@ -8399,8 +10212,8 @@ snapshots:
 
   constantinople@4.0.1:
     dependencies:
-      '@babel/parser': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/parser': 7.24.7
+      '@babel/types': 7.24.7
 
   conventional-changelog-angular@5.0.13:
     dependencies:
@@ -8513,9 +10326,13 @@ snapshots:
 
   convert-source-map@2.0.0: {}
 
+  copy-anything@3.0.5:
+    dependencies:
+      is-what: 4.1.16
+
   core-js-compat@3.37.1:
     dependencies:
-      browserslist: 4.23.0
+      browserslist: 4.23.1
 
   core-js@3.37.1: {}
 
@@ -8563,6 +10380,8 @@ snapshots:
 
   css-what@6.1.0: {}
 
+  css.escape@1.5.1: {}
+
   cssesc@3.0.0: {}
 
   cssfilter@0.0.10: {}
@@ -8929,24 +10748,20 @@ snapshots:
 
   de-indent@1.0.2: {}
 
-  debug@2.6.9:
-    dependencies:
-      ms: 2.0.0
-
   debug@3.2.7:
     dependencies:
       ms: 2.1.3
 
-  debug@4.3.4:
-    dependencies:
-      ms: 2.1.2
-
   debug@4.3.4(supports-color@8.1.1):
     dependencies:
       ms: 2.1.2
     optionalDependencies:
       supports-color: 8.1.1
 
+  debug@4.3.5:
+    dependencies:
+      ms: 2.1.2
+
   decamelize-keys@1.1.1:
     dependencies:
       decamelize: 1.2.0
@@ -8956,8 +10771,16 @@ snapshots:
 
   decimal.js@10.4.3: {}
 
+  decode-named-character-reference@1.0.2:
+    dependencies:
+      character-entities: 2.0.2
+
   dedent@0.7.0: {}
 
+  deep-eql@4.1.4:
+    dependencies:
+      type-detect: 4.0.8
+
   deep-is@0.1.4: {}
 
   deepmerge@4.3.1: {}
@@ -8986,11 +10809,15 @@ snapshots:
 
   delegate@3.2.0: {}
 
+  dequal@2.0.3: {}
+
   detect-newline@3.1.0: {}
 
-  devui-theme@0.0.1: {}
+  devlop@1.1.0:
+    dependencies:
+      dequal: 2.0.3
 
-  diacritics@1.3.0: {}
+  devui-theme@0.0.1: {}
 
   didyoumean@1.2.2: {}
 
@@ -9081,6 +10908,8 @@ snapshots:
 
   electron-to-chromium@1.4.783: {}
 
+  electron-to-chromium@1.4.807: {}
+
   emittery@0.8.1: {}
 
   emmet@2.4.7:
@@ -9191,90 +11020,138 @@ snapshots:
   esbuild-android-64@0.14.54:
     optional: true
 
+  esbuild-android-64@0.15.18:
+    optional: true
+
   esbuild-android-arm64@0.13.15:
     optional: true
 
   esbuild-android-arm64@0.14.54:
     optional: true
 
+  esbuild-android-arm64@0.15.18:
+    optional: true
+
   esbuild-darwin-64@0.13.15:
     optional: true
 
   esbuild-darwin-64@0.14.54:
     optional: true
 
+  esbuild-darwin-64@0.15.18:
+    optional: true
+
   esbuild-darwin-arm64@0.13.15:
     optional: true
 
   esbuild-darwin-arm64@0.14.54:
     optional: true
 
+  esbuild-darwin-arm64@0.15.18:
+    optional: true
+
   esbuild-freebsd-64@0.13.15:
     optional: true
 
   esbuild-freebsd-64@0.14.54:
     optional: true
 
+  esbuild-freebsd-64@0.15.18:
+    optional: true
+
   esbuild-freebsd-arm64@0.13.15:
     optional: true
 
   esbuild-freebsd-arm64@0.14.54:
     optional: true
 
+  esbuild-freebsd-arm64@0.15.18:
+    optional: true
+
   esbuild-linux-32@0.13.15:
     optional: true
 
   esbuild-linux-32@0.14.54:
     optional: true
 
+  esbuild-linux-32@0.15.18:
+    optional: true
+
   esbuild-linux-64@0.13.15:
     optional: true
 
   esbuild-linux-64@0.14.54:
     optional: true
 
+  esbuild-linux-64@0.15.18:
+    optional: true
+
   esbuild-linux-arm64@0.13.15:
     optional: true
 
   esbuild-linux-arm64@0.14.54:
     optional: true
 
+  esbuild-linux-arm64@0.15.18:
+    optional: true
+
   esbuild-linux-arm@0.13.15:
     optional: true
 
   esbuild-linux-arm@0.14.54:
     optional: true
 
+  esbuild-linux-arm@0.15.18:
+    optional: true
+
   esbuild-linux-mips64le@0.13.15:
     optional: true
 
   esbuild-linux-mips64le@0.14.54:
     optional: true
 
+  esbuild-linux-mips64le@0.15.18:
+    optional: true
+
   esbuild-linux-ppc64le@0.13.15:
     optional: true
 
   esbuild-linux-ppc64le@0.14.54:
     optional: true
 
+  esbuild-linux-ppc64le@0.15.18:
+    optional: true
+
   esbuild-linux-riscv64@0.14.54:
     optional: true
 
+  esbuild-linux-riscv64@0.15.18:
+    optional: true
+
   esbuild-linux-s390x@0.14.54:
     optional: true
 
+  esbuild-linux-s390x@0.15.18:
+    optional: true
+
   esbuild-netbsd-64@0.13.15:
     optional: true
 
   esbuild-netbsd-64@0.14.54:
     optional: true
 
+  esbuild-netbsd-64@0.15.18:
+    optional: true
+
   esbuild-openbsd-64@0.13.15:
     optional: true
 
   esbuild-openbsd-64@0.14.54:
     optional: true
 
+  esbuild-openbsd-64@0.15.18:
+    optional: true
+
   esbuild-register@2.6.0:
     dependencies:
       esbuild: 0.12.29
@@ -9286,24 +11163,36 @@ snapshots:
   esbuild-sunos-64@0.14.54:
     optional: true
 
+  esbuild-sunos-64@0.15.18:
+    optional: true
+
   esbuild-windows-32@0.13.15:
     optional: true
 
   esbuild-windows-32@0.14.54:
     optional: true
 
+  esbuild-windows-32@0.15.18:
+    optional: true
+
   esbuild-windows-64@0.13.15:
     optional: true
 
   esbuild-windows-64@0.14.54:
     optional: true
 
+  esbuild-windows-64@0.15.18:
+    optional: true
+
   esbuild-windows-arm64@0.13.15:
     optional: true
 
   esbuild-windows-arm64@0.14.54:
     optional: true
 
+  esbuild-windows-arm64@0.15.18:
+    optional: true
+
   esbuild@0.12.29: {}
 
   esbuild@0.13.15:
@@ -9350,6 +11239,82 @@ snapshots:
       esbuild-windows-64: 0.14.54
       esbuild-windows-arm64: 0.14.54
 
+  esbuild@0.15.18:
+    optionalDependencies:
+      '@esbuild/android-arm': 0.15.18
+      '@esbuild/linux-loong64': 0.15.18
+      esbuild-android-64: 0.15.18
+      esbuild-android-arm64: 0.15.18
+      esbuild-darwin-64: 0.15.18
+      esbuild-darwin-arm64: 0.15.18
+      esbuild-freebsd-64: 0.15.18
+      esbuild-freebsd-arm64: 0.15.18
+      esbuild-linux-32: 0.15.18
+      esbuild-linux-64: 0.15.18
+      esbuild-linux-arm: 0.15.18
+      esbuild-linux-arm64: 0.15.18
+      esbuild-linux-mips64le: 0.15.18
+      esbuild-linux-ppc64le: 0.15.18
+      esbuild-linux-riscv64: 0.15.18
+      esbuild-linux-s390x: 0.15.18
+      esbuild-netbsd-64: 0.15.18
+      esbuild-openbsd-64: 0.15.18
+      esbuild-sunos-64: 0.15.18
+      esbuild-windows-32: 0.15.18
+      esbuild-windows-64: 0.15.18
+      esbuild-windows-arm64: 0.15.18
+
+  esbuild@0.18.20:
+    optionalDependencies:
+      '@esbuild/android-arm': 0.18.20
+      '@esbuild/android-arm64': 0.18.20
+      '@esbuild/android-x64': 0.18.20
+      '@esbuild/darwin-arm64': 0.18.20
+      '@esbuild/darwin-x64': 0.18.20
+      '@esbuild/freebsd-arm64': 0.18.20
+      '@esbuild/freebsd-x64': 0.18.20
+      '@esbuild/linux-arm': 0.18.20
+      '@esbuild/linux-arm64': 0.18.20
+      '@esbuild/linux-ia32': 0.18.20
+      '@esbuild/linux-loong64': 0.18.20
+      '@esbuild/linux-mips64el': 0.18.20
+      '@esbuild/linux-ppc64': 0.18.20
+      '@esbuild/linux-riscv64': 0.18.20
+      '@esbuild/linux-s390x': 0.18.20
+      '@esbuild/linux-x64': 0.18.20
+      '@esbuild/netbsd-x64': 0.18.20
+      '@esbuild/openbsd-x64': 0.18.20
+      '@esbuild/sunos-x64': 0.18.20
+      '@esbuild/win32-arm64': 0.18.20
+      '@esbuild/win32-ia32': 0.18.20
+      '@esbuild/win32-x64': 0.18.20
+
+  esbuild@0.21.5:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.21.5
+      '@esbuild/android-arm': 0.21.5
+      '@esbuild/android-arm64': 0.21.5
+      '@esbuild/android-x64': 0.21.5
+      '@esbuild/darwin-arm64': 0.21.5
+      '@esbuild/darwin-x64': 0.21.5
+      '@esbuild/freebsd-arm64': 0.21.5
+      '@esbuild/freebsd-x64': 0.21.5
+      '@esbuild/linux-arm': 0.21.5
+      '@esbuild/linux-arm64': 0.21.5
+      '@esbuild/linux-ia32': 0.21.5
+      '@esbuild/linux-loong64': 0.21.5
+      '@esbuild/linux-mips64el': 0.21.5
+      '@esbuild/linux-ppc64': 0.21.5
+      '@esbuild/linux-riscv64': 0.21.5
+      '@esbuild/linux-s390x': 0.21.5
+      '@esbuild/linux-x64': 0.21.5
+      '@esbuild/netbsd-x64': 0.21.5
+      '@esbuild/openbsd-x64': 0.21.5
+      '@esbuild/sunos-x64': 0.21.5
+      '@esbuild/win32-arm64': 0.21.5
+      '@esbuild/win32-ia32': 0.21.5
+      '@esbuild/win32-x64': 0.21.5
+
   escalade@3.1.2: {}
 
   escape-html@1.0.3: {}
@@ -9360,6 +11325,8 @@ snapshots:
 
   escape-string-regexp@4.0.0: {}
 
+  escape-string-regexp@5.0.0: {}
+
   escodegen@2.1.0:
     dependencies:
       esprima: 4.0.1
@@ -9446,7 +11413,7 @@ snapshots:
       ajv: 6.12.6
       chalk: 4.1.2
       cross-spawn: 7.0.3
-      debug: 4.3.4
+      debug: 4.3.4(supports-color@8.1.1)
       doctrine: 3.0.0
       enquirer: 2.4.1
       escape-string-regexp: 4.0.0
@@ -9570,6 +11537,10 @@ snapshots:
     dependencies:
       reusify: 1.0.4
 
+  fault@2.0.1:
+    dependencies:
+      format: 0.2.2
+
   fb-watchman@2.0.2:
     dependencies:
       bser: 2.1.1
@@ -9615,11 +11586,15 @@ snapshots:
 
   flatted@3.3.1: {}
 
+  focus-trap@7.5.4:
+    dependencies:
+      tabbable: 6.2.0
+
   for-each@0.3.3:
     dependencies:
       is-callable: 1.2.7
 
-  foreground-child@3.1.1:
+  foreground-child@3.2.1:
     dependencies:
       cross-spawn: 7.0.3
       signal-exit: 4.1.0
@@ -9630,6 +11605,10 @@ snapshots:
       combined-stream: 1.0.8
       mime-types: 2.1.35
 
+  format@0.2.2: {}
+
+  fp-ts@2.16.6: {}
+
   fs-extra@10.1.0:
     dependencies:
       graceful-fs: 4.2.11
@@ -9667,6 +11646,8 @@ snapshots:
 
   get-css-data@2.1.1: {}
 
+  get-func-name@2.0.2: {}
+
   get-intrinsic@1.2.4:
     dependencies:
       es-errors: 1.3.0
@@ -9722,12 +11703,13 @@ snapshots:
     dependencies:
       is-glob: 4.0.3
 
-  glob@10.4.1:
+  glob@10.4.2:
     dependencies:
-      foreground-child: 3.1.1
-      jackspeak: 3.1.2
+      foreground-child: 3.2.1
+      jackspeak: 3.4.0
       minimatch: 9.0.4
       minipass: 7.1.2
+      package-json-from-dist: 1.0.0
       path-scurry: 1.11.1
 
   glob@7.2.3:
@@ -9773,6 +11755,15 @@ snapshots:
       merge2: 1.4.1
       slash: 3.0.0
 
+  globby@14.0.1:
+    dependencies:
+      '@sindresorhus/merge-streams': 2.3.0
+      fast-glob: 3.3.2
+      ignore: 5.3.1
+      path-type: 5.0.0
+      slash: 5.1.0
+      unicorn-magic: 0.1.0
+
   globjoin@0.1.4: {}
 
   gonzales-pe@4.3.0:
@@ -9793,13 +11784,6 @@ snapshots:
     dependencies:
       lodash: 4.17.21
 
-  gray-matter@4.0.3:
-    dependencies:
-      js-yaml: 3.14.1
-      kind-of: 6.0.3
-      section-matter: 1.0.0
-      strip-bom-string: 1.0.0
-
   handlebars@4.7.8:
     dependencies:
       minimist: 1.2.8
@@ -9807,7 +11791,19 @@ snapshots:
       source-map: 0.6.1
       wordwrap: 1.0.0
     optionalDependencies:
-      uglify-js: 3.17.4
+      uglify-js: 3.18.0
+
+  happy-dom@8.9.0:
+    dependencies:
+      css.escape: 1.5.1
+      he: 1.2.0
+      iconv-lite: 0.6.3
+      node-fetch: 2.7.0
+      webidl-conversions: 7.0.0
+      whatwg-encoding: 2.0.0
+      whatwg-mimetype: 3.0.0
+    transitivePeerDependencies:
+      - encoding
 
   hard-rejection@2.1.0: {}
 
@@ -9835,6 +11831,8 @@ snapshots:
     dependencies:
       function-bind: 1.1.2
 
+  he@1.2.0: {}
+
   highlight.js@10.7.3: {}
 
   highlight.js@11.9.0: {}
@@ -9844,6 +11842,8 @@ snapshots:
       mkdirp: 0.3.0
       nopt: 1.0.10
 
+  hookable@5.5.3: {}
+
   hosted-git-info@2.8.9: {}
 
   hosted-git-info@4.1.0:
@@ -9878,14 +11878,14 @@ snapshots:
     dependencies:
       '@tootallnate/once': 1.1.2
       agent-base: 6.0.2
-      debug: 4.3.4
+      debug: 4.3.5
     transitivePeerDependencies:
       - supports-color
 
   https-proxy-agent@5.0.1:
     dependencies:
       agent-base: 6.0.2
-      debug: 4.3.4
+      debug: 4.3.5
     transitivePeerDependencies:
       - supports-color
 
@@ -9925,6 +11925,22 @@ snapshots:
 
   indent-string@4.0.0: {}
 
+  inferred-types@0.37.6(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0):
+    dependencies:
+      brilliant-errors: 0.7.3(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+    transitivePeerDependencies:
+      - '@edge-runtime/vm'
+      - '@vitest/browser'
+      - '@vitest/ui'
+      - happy-dom
+      - jsdom
+      - less
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+
   inflight@1.0.6:
     dependencies:
       once: 1.4.0
@@ -9982,11 +11998,18 @@ snapshots:
 
   is-alphabetical@1.0.4: {}
 
+  is-alphabetical@2.0.1: {}
+
   is-alphanumerical@1.0.4:
     dependencies:
       is-alphabetical: 1.0.4
       is-decimal: 1.0.4
 
+  is-alphanumerical@2.0.1:
+    dependencies:
+      is-alphabetical: 2.0.1
+      is-decimal: 2.0.1
+
   is-array-buffer@3.0.4:
     dependencies:
       call-bind: 1.0.7
@@ -10025,6 +12048,8 @@ snapshots:
 
   is-decimal@1.0.4: {}
 
+  is-decimal@2.0.1: {}
+
   is-expression@4.0.0:
     dependencies:
       acorn: 7.4.1
@@ -10044,6 +12069,8 @@ snapshots:
 
   is-hexadecimal@1.0.4: {}
 
+  is-hexadecimal@2.0.1: {}
+
   is-interactive@1.0.0: {}
 
   is-negative-zero@2.0.3: {}
@@ -10062,6 +12089,8 @@ snapshots:
 
   is-plain-obj@2.1.0: {}
 
+  is-plain-obj@4.1.0: {}
+
   is-potential-custom-element-name@1.0.1: {}
 
   is-promise@2.2.2: {}
@@ -10105,6 +12134,8 @@ snapshots:
     dependencies:
       call-bind: 1.0.7
 
+  is-what@4.1.16: {}
+
   isarray@1.0.0: {}
 
   isarray@2.0.5: {}
@@ -10115,8 +12146,8 @@ snapshots:
 
   istanbul-lib-instrument@5.2.1:
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/parser': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/parser': 7.24.7
       '@istanbuljs/schema': 0.1.3
       istanbul-lib-coverage: 3.2.2
       semver: 6.3.1
@@ -10131,7 +12162,7 @@ snapshots:
 
   istanbul-lib-source-maps@4.0.1:
     dependencies:
-      debug: 4.3.4
+      debug: 4.3.5
       istanbul-lib-coverage: 3.2.2
       source-map: 0.6.1
     transitivePeerDependencies:
@@ -10142,7 +12173,7 @@ snapshots:
       html-escaper: 2.0.2
       istanbul-lib-report: 3.0.1
 
-  jackspeak@3.1.2:
+  jackspeak@3.4.0:
     dependencies:
       '@isaacs/cliui': 8.0.2
     optionalDependencies:
@@ -10159,7 +12190,7 @@ snapshots:
       '@jest/environment': 27.5.1
       '@jest/test-result': 27.5.1
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       chalk: 4.1.2
       co: 4.6.0
       dedent: 0.7.0
@@ -10201,10 +12232,10 @@ snapshots:
 
   jest-config@27.5.1:
     dependencies:
-      '@babel/core': 7.24.6
+      '@babel/core': 7.24.7
       '@jest/test-sequencer': 27.5.1
       '@jest/types': 27.5.1
-      babel-jest: 27.5.1(@babel/core@7.24.6)
+      babel-jest: 27.5.1(@babel/core@7.24.7)
       chalk: 4.1.2
       ci-info: 3.9.0
       deepmerge: 4.3.1
@@ -10262,7 +12293,7 @@ snapshots:
       '@jest/environment': 27.5.1
       '@jest/fake-timers': 27.5.1
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       jest-mock: 27.5.1
       jest-util: 27.5.1
       jsdom: 16.7.0
@@ -10277,7 +12308,7 @@ snapshots:
       '@jest/environment': 27.5.1
       '@jest/fake-timers': 27.5.1
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       jest-mock: 27.5.1
       jest-util: 27.5.1
 
@@ -10289,7 +12320,7 @@ snapshots:
     dependencies:
       '@jest/types': 27.5.1
       '@types/graceful-fs': 4.1.9
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       anymatch: 3.1.3
       fb-watchman: 2.0.2
       graceful-fs: 4.2.11
@@ -10308,7 +12339,7 @@ snapshots:
       '@jest/source-map': 27.5.1
       '@jest/test-result': 27.5.1
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       chalk: 4.1.2
       co: 4.6.0
       expect: 27.5.1
@@ -10338,7 +12369,7 @@ snapshots:
 
   jest-message-util@27.5.1:
     dependencies:
-      '@babel/code-frame': 7.24.6
+      '@babel/code-frame': 7.24.7
       '@jest/types': 27.5.1
       '@types/stack-utils': 2.0.3
       chalk: 4.1.2
@@ -10351,7 +12382,7 @@ snapshots:
   jest-mock@27.5.1:
     dependencies:
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
 
   jest-pnp-resolver@1.2.3(jest-resolve@27.5.1):
     optionalDependencies:
@@ -10387,7 +12418,7 @@ snapshots:
       '@jest/test-result': 27.5.1
       '@jest/transform': 27.5.1
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       chalk: 4.1.2
       emittery: 0.8.1
       graceful-fs: 4.2.11
@@ -10438,21 +12469,21 @@ snapshots:
 
   jest-serializer@27.5.1:
     dependencies:
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       graceful-fs: 4.2.11
 
   jest-snapshot@27.5.1:
     dependencies:
-      '@babel/core': 7.24.6
-      '@babel/generator': 7.24.6
-      '@babel/plugin-syntax-typescript': 7.24.6(@babel/core@7.24.6)
-      '@babel/traverse': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/core': 7.24.7
+      '@babel/generator': 7.24.7
+      '@babel/plugin-syntax-typescript': 7.24.7(@babel/core@7.24.7)
+      '@babel/traverse': 7.24.7
+      '@babel/types': 7.24.7
       '@jest/transform': 27.5.1
       '@jest/types': 27.5.1
       '@types/babel__traverse': 7.20.6
       '@types/prettier': 2.7.3
-      babel-preset-current-node-syntax: 1.0.1(@babel/core@7.24.6)
+      babel-preset-current-node-syntax: 1.0.1(@babel/core@7.24.7)
       chalk: 4.1.2
       expect: 27.5.1
       graceful-fs: 4.2.11
@@ -10471,7 +12502,7 @@ snapshots:
   jest-util@27.5.1:
     dependencies:
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       chalk: 4.1.2
       ci-info: 3.9.0
       graceful-fs: 4.2.11
@@ -10490,7 +12521,7 @@ snapshots:
     dependencies:
       '@jest/test-result': 27.5.1
       '@jest/types': 27.5.1
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       ansi-escapes: 4.3.2
       chalk: 4.1.2
       jest-util: 27.5.1
@@ -10498,7 +12529,7 @@ snapshots:
 
   jest-worker@27.5.1:
     dependencies:
-      '@types/node': 16.18.97
+      '@types/node': 20.14.7
       merge-stream: 2.0.0
       supports-color: 8.1.1
 
@@ -10518,7 +12549,7 @@ snapshots:
     dependencies:
       config-chain: 1.1.13
       editorconfig: 1.0.4
-      glob: 10.4.1
+      glob: 10.4.2
       js-cookie: 3.0.5
       nopt: 7.2.1
 
@@ -10533,10 +12564,14 @@ snapshots:
       argparse: 1.0.10
       esprima: 4.0.1
 
+  js-yaml@4.1.0:
+    dependencies:
+      argparse: 2.0.1
+
   jsdom@16.7.0:
     dependencies:
       abab: 2.0.6
-      acorn: 8.11.3
+      acorn: 8.12.0
       acorn-globals: 6.0.0
       cssom: 0.4.4
       cssstyle: 2.3.0
@@ -10560,7 +12595,7 @@ snapshots:
       whatwg-encoding: 1.0.5
       whatwg-mimetype: 2.3.0
       whatwg-url: 8.7.0
-      ws: 7.5.9
+      ws: 7.5.10
       xml-name-validator: 3.0.0
     transitivePeerDependencies:
       - bufferutil
@@ -10628,6 +12663,8 @@ snapshots:
 
   kleur@3.0.3: {}
 
+  kleur@4.1.5: {}
+
   known-css-properties@0.21.0: {}
 
   kolorist@1.8.0: {}
@@ -10645,6 +12682,14 @@ snapshots:
     dependencies:
       uc.micro: 1.0.6
 
+  linkify-it@4.0.1:
+    dependencies:
+      uc.micro: 1.0.6
+
+  linkify-it@5.0.0:
+    dependencies:
+      uc.micro: 2.1.0
+
   lint-staged@11.2.6:
     dependencies:
       cli-truncate: 2.1.0
@@ -10682,6 +12727,8 @@ snapshots:
       pify: 3.0.0
       strip-bom: 3.0.0
 
+  local-pkg@0.4.3: {}
+
   locate-path@2.0.0:
     dependencies:
       p-locate: 2.0.0
@@ -10725,9 +12772,16 @@ snapshots:
 
   longest-streak@2.0.4: {}
 
+  longest-streak@3.1.0: {}
+
   loose-envify@1.4.0:
     dependencies:
       js-tokens: 4.0.0
+    optional: true
+
+  loupe@2.3.7:
+    dependencies:
+      get-func-name: 2.0.2
 
   lru-cache@10.2.2: {}
 
@@ -10755,20 +12809,16 @@ snapshots:
 
   map-obj@4.3.0: {}
 
-  markdown-it-anchor@7.1.0(markdown-it@12.2.0):
-    dependencies:
-      markdown-it: 12.2.0
+  mark.js@8.11.1: {}
 
   markdown-it-container@3.0.0: {}
 
-  markdown-it-emoji@2.0.2: {}
+  markdown-it-container@4.0.0: {}
 
   markdown-it-emoji@3.0.0: {}
 
   markdown-it-plantuml@1.4.1: {}
 
-  markdown-it-table-of-contents@0.5.2: {}
-
   markdown-it@12.2.0:
     dependencies:
       argparse: 2.0.1
@@ -10777,12 +12827,38 @@ snapshots:
       mdurl: 1.0.1
       uc.micro: 1.0.6
 
-  matchit@1.1.0:
+  markdown-it@13.0.2:
     dependencies:
-      '@arr/every': 1.0.1
+      argparse: 2.0.1
+      entities: 3.0.1
+      linkify-it: 4.0.1
+      mdurl: 1.0.1
+      uc.micro: 1.0.6
+
+  markdown-it@14.1.0:
+    dependencies:
+      argparse: 2.0.1
+      entities: 4.5.0
+      linkify-it: 5.0.0
+      mdurl: 2.0.0
+      punycode.js: 2.3.1
+      uc.micro: 2.1.0
 
   mathml-tag-names@2.1.3: {}
 
+  mdast-util-directive@3.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      '@types/unist': 3.0.2
+      devlop: 1.1.0
+      mdast-util-from-markdown: 2.0.1
+      mdast-util-to-markdown: 2.1.0
+      parse-entities: 4.0.1
+      stringify-entities: 4.0.4
+      unist-util-visit-parents: 6.0.1
+    transitivePeerDependencies:
+      - supports-color
+
   mdast-util-from-markdown@0.8.5:
     dependencies:
       '@types/mdast': 3.0.15
@@ -10793,6 +12869,39 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  mdast-util-from-markdown@2.0.1:
+    dependencies:
+      '@types/mdast': 4.0.4
+      '@types/unist': 3.0.2
+      decode-named-character-reference: 1.0.2
+      devlop: 1.1.0
+      mdast-util-to-string: 4.0.0
+      micromark: 4.0.0
+      micromark-util-decode-numeric-character-reference: 2.0.1
+      micromark-util-decode-string: 2.0.0
+      micromark-util-normalize-identifier: 2.0.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+      unist-util-stringify-position: 4.0.0
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-frontmatter@2.0.1:
+    dependencies:
+      '@types/mdast': 4.0.4
+      devlop: 1.1.0
+      escape-string-regexp: 5.0.0
+      mdast-util-from-markdown: 2.0.1
+      mdast-util-to-markdown: 2.1.0
+      micromark-extension-frontmatter: 2.0.0
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-phrasing@4.1.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      unist-util-is: 6.0.0
+
   mdast-util-to-markdown@0.6.5:
     dependencies:
       '@types/unist': 2.0.10
@@ -10802,12 +12911,29 @@ snapshots:
       repeat-string: 1.6.1
       zwitch: 1.0.5
 
+  mdast-util-to-markdown@2.1.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      '@types/unist': 3.0.2
+      longest-streak: 3.1.0
+      mdast-util-phrasing: 4.1.0
+      mdast-util-to-string: 4.0.0
+      micromark-util-decode-string: 2.0.0
+      unist-util-visit: 5.0.0
+      zwitch: 2.0.4
+
   mdast-util-to-string@2.0.0: {}
 
+  mdast-util-to-string@4.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+
   mdn-data@2.0.14: {}
 
   mdurl@1.0.1: {}
 
+  mdurl@2.0.0: {}
+
   memorystream@0.3.1: {}
 
   meow@8.1.2:
@@ -10855,6 +12981,134 @@ snapshots:
       moment-mini: 2.29.4
       stylis: 4.3.2
 
+  micromark-core-commonmark@2.0.1:
+    dependencies:
+      decode-named-character-reference: 1.0.2
+      devlop: 1.1.0
+      micromark-factory-destination: 2.0.0
+      micromark-factory-label: 2.0.0
+      micromark-factory-space: 2.0.0
+      micromark-factory-title: 2.0.0
+      micromark-factory-whitespace: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-chunked: 2.0.0
+      micromark-util-classify-character: 2.0.0
+      micromark-util-html-tag-name: 2.0.0
+      micromark-util-normalize-identifier: 2.0.0
+      micromark-util-resolve-all: 2.0.0
+      micromark-util-subtokenize: 2.0.1
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-extension-directive@3.0.0:
+    dependencies:
+      devlop: 1.1.0
+      micromark-factory-space: 2.0.0
+      micromark-factory-whitespace: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+      parse-entities: 4.0.1
+
+  micromark-extension-frontmatter@2.0.0:
+    dependencies:
+      fault: 2.0.1
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-destination@2.0.0:
+    dependencies:
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-label@2.0.0:
+    dependencies:
+      devlop: 1.1.0
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-space@2.0.0:
+    dependencies:
+      micromark-util-character: 2.1.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-title@2.0.0:
+    dependencies:
+      micromark-factory-space: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-factory-whitespace@2.0.0:
+    dependencies:
+      micromark-factory-space: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-character@2.1.0:
+    dependencies:
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-chunked@2.0.0:
+    dependencies:
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-classify-character@2.0.0:
+    dependencies:
+      micromark-util-character: 2.1.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-combine-extensions@2.0.0:
+    dependencies:
+      micromark-util-chunked: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-decode-numeric-character-reference@2.0.1:
+    dependencies:
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-decode-string@2.0.0:
+    dependencies:
+      decode-named-character-reference: 1.0.2
+      micromark-util-character: 2.1.0
+      micromark-util-decode-numeric-character-reference: 2.0.1
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-encode@2.0.0: {}
+
+  micromark-util-html-tag-name@2.0.0: {}
+
+  micromark-util-normalize-identifier@2.0.0:
+    dependencies:
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-resolve-all@2.0.0:
+    dependencies:
+      micromark-util-types: 2.0.0
+
+  micromark-util-sanitize-uri@2.0.0:
+    dependencies:
+      micromark-util-character: 2.1.0
+      micromark-util-encode: 2.0.0
+      micromark-util-symbol: 2.0.0
+
+  micromark-util-subtokenize@2.0.1:
+    dependencies:
+      devlop: 1.1.0
+      micromark-util-chunked: 2.0.0
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+
+  micromark-util-symbol@2.0.0: {}
+
+  micromark-util-types@2.0.0: {}
+
   micromark@2.11.4:
     dependencies:
       debug: 4.3.4(supports-color@8.1.1)
@@ -10862,6 +13116,28 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  micromark@4.0.0:
+    dependencies:
+      '@types/debug': 4.1.12
+      debug: 4.3.5
+      decode-named-character-reference: 1.0.2
+      devlop: 1.1.0
+      micromark-core-commonmark: 2.0.1
+      micromark-factory-space: 2.0.0
+      micromark-util-character: 2.1.0
+      micromark-util-chunked: 2.0.0
+      micromark-util-combine-extensions: 2.0.0
+      micromark-util-decode-numeric-character-reference: 2.0.1
+      micromark-util-encode: 2.0.0
+      micromark-util-normalize-identifier: 2.0.0
+      micromark-util-resolve-all: 2.0.0
+      micromark-util-sanitize-uri: 2.0.0
+      micromark-util-subtokenize: 2.0.1
+      micromark-util-symbol: 2.0.0
+      micromark-util-types: 2.0.0
+    transitivePeerDependencies:
+      - supports-color
+
   micromatch@4.0.7:
     dependencies:
       braces: 3.0.3
@@ -10899,6 +13175,8 @@ snapshots:
 
   minipass@7.1.2: {}
 
+  minisearch@6.3.0: {}
+
   mitt@3.0.1: {}
 
   mkdirp@0.3.0: {}
@@ -10909,14 +13187,12 @@ snapshots:
 
   monaco-editor@0.34.0: {}
 
-  mrmime@1.0.1: {}
-
-  ms@2.0.0: {}
-
   ms@2.1.2: {}
 
   ms@2.1.3: {}
 
+  muggle-string@0.4.1: {}
+
   mute-stream@0.0.8: {}
 
   mz@2.7.0:
@@ -10927,9 +13203,24 @@ snapshots:
 
   nanoid@3.3.7: {}
 
-  natural-compare@1.4.0: {}
+  native-dash@1.25.0(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0):
+    dependencies:
+      brilliant-errors: 0.7.3(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+      inferred-types: 0.37.6(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+    transitivePeerDependencies:
+      - '@edge-runtime/vm'
+      - '@vitest/browser'
+      - '@vitest/ui'
+      - happy-dom
+      - jsdom
+      - less
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
 
-  negotiator@0.6.3: {}
+  natural-compare@1.4.0: {}
 
   neo-async@2.6.2: {}
 
@@ -11027,8 +13318,6 @@ snapshots:
       define-properties: 1.2.1
       es-object-atoms: 1.0.0
 
-  on-headers@1.0.2: {}
-
   once@1.4.0:
     dependencies:
       wrappy: 1.0.2
@@ -11100,6 +13389,8 @@ snapshots:
 
   p-try@2.2.0: {}
 
+  package-json-from-dist@1.0.0: {}
+
   parent-module@1.0.1:
     dependencies:
       callsites: 3.1.0
@@ -11113,6 +13404,17 @@ snapshots:
       is-decimal: 1.0.4
       is-hexadecimal: 1.0.4
 
+  parse-entities@4.0.1:
+    dependencies:
+      '@types/unist': 2.0.10
+      character-entities: 2.0.2
+      character-entities-legacy: 3.0.0
+      character-reference-invalid: 2.0.1
+      decode-named-character-reference: 1.0.2
+      is-alphanumerical: 2.0.1
+      is-decimal: 2.0.1
+      is-hexadecimal: 2.0.1
+
   parse-json@4.0.0:
     dependencies:
       error-ex: 1.3.2
@@ -11135,6 +13437,8 @@ snapshots:
 
   patch-vue-directive-ssr@0.0.1: {}
 
+  path-browserify@1.0.1: {}
+
   path-exists@3.0.0: {}
 
   path-exists@4.0.0: {}
@@ -11160,8 +13464,14 @@ snapshots:
 
   path-type@4.0.0: {}
 
+  path-type@5.0.0: {}
+
+  pathval@1.1.1: {}
+
   pegjs@0.10.0: {}
 
+  perfect-debounce@1.0.0: {}
+
   picocolors@0.2.1: {}
 
   picocolors@1.0.1: {}
@@ -11190,11 +13500,6 @@ snapshots:
     dependencies:
       semver-compare: 1.0.0
 
-  polka@0.5.2:
-    dependencies:
-      '@polka/url': 0.5.0
-      trouter: 2.0.1
-
   possible-typed-array-names@1.0.0: {}
 
   postcss-html@0.36.0(postcss-syntax@0.36.2)(postcss@7.0.39):
@@ -11254,7 +13559,10 @@ snapshots:
 
   prelude-ls@1.2.1: {}
 
-  prettier@2.8.8: {}
+  prettier@2.8.8:
+    optional: true
+
+  prettier@3.3.2: {}
 
   pretty-format@26.6.2:
     dependencies:
@@ -11289,6 +13597,7 @@ snapshots:
       loose-envify: 1.4.0
       object-assign: 4.1.1
       react-is: 16.13.1
+    optional: true
 
   proto-list@1.2.4: {}
 
@@ -11361,6 +13670,8 @@ snapshots:
       pug-runtime: 3.0.1
       pug-strip-comments: 2.0.0
 
+  punycode.js@2.3.1: {}
+
   punycode@2.3.1: {}
 
   q@1.5.1: {}
@@ -11380,8 +13691,10 @@ snapshots:
       prop-types: 15.8.1
       react: 16.14.0
       scheduler: 0.19.1
+    optional: true
 
-  react-is@16.13.1: {}
+  react-is@16.13.1:
+    optional: true
 
   react-is@17.0.2: {}
 
@@ -11390,6 +13703,7 @@ snapshots:
       loose-envify: 1.4.0
       object-assign: 4.1.1
       prop-types: 15.8.1
+    optional: true
 
   read-pkg-up@3.0.0:
     dependencies:
@@ -11454,7 +13768,7 @@ snapshots:
 
   regenerator-transform@0.15.2:
     dependencies:
-      '@babel/runtime': 7.24.6
+      '@babel/runtime': 7.24.7
 
   regexp.prototype.flags@1.5.2:
     dependencies:
@@ -11478,12 +13792,45 @@ snapshots:
     dependencies:
       jsesc: 0.5.0
 
+  remark-directive@3.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-directive: 3.0.0
+      micromark-extension-directive: 3.0.0
+      unified: 11.0.5
+    transitivePeerDependencies:
+      - supports-color
+
+  remark-frontmatter@5.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-frontmatter: 2.0.1
+      micromark-extension-frontmatter: 2.0.0
+      unified: 11.0.5
+    transitivePeerDependencies:
+      - supports-color
+
+  remark-parse@11.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-from-markdown: 2.0.1
+      micromark-util-types: 2.0.0
+      unified: 11.0.5
+    transitivePeerDependencies:
+      - supports-color
+
   remark-parse@9.0.0:
     dependencies:
       mdast-util-from-markdown: 0.8.5
     transitivePeerDependencies:
       - supports-color
 
+  remark-stringify@11.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-to-markdown: 2.1.0
+      unified: 11.0.5
+
   remark-stringify@9.0.1:
     dependencies:
       mdast-util-to-markdown: 0.6.5
@@ -11496,6 +13843,15 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  remark@15.0.1:
+    dependencies:
+      '@types/mdast': 4.0.4
+      remark-parse: 11.0.0
+      remark-stringify: 11.0.0
+      unified: 11.0.5
+    transitivePeerDependencies:
+      - supports-color
+
   repeat-string@1.6.1: {}
 
   request-light@0.5.8: {}
@@ -11537,6 +13893,8 @@ snapshots:
 
   rfdc@1.3.1: {}
 
+  rfdc@1.4.1: {}
+
   rimraf@3.0.2:
     dependencies:
       glob: 7.2.3
@@ -11547,6 +13905,36 @@ snapshots:
     optionalDependencies:
       fsevents: 2.3.3
 
+  rollup@2.79.1:
+    optionalDependencies:
+      fsevents: 2.3.3
+
+  rollup@3.29.4:
+    optionalDependencies:
+      fsevents: 2.3.3
+
+  rollup@4.18.0:
+    dependencies:
+      '@types/estree': 1.0.5
+    optionalDependencies:
+      '@rollup/rollup-android-arm-eabi': 4.18.0
+      '@rollup/rollup-android-arm64': 4.18.0
+      '@rollup/rollup-darwin-arm64': 4.18.0
+      '@rollup/rollup-darwin-x64': 4.18.0
+      '@rollup/rollup-linux-arm-gnueabihf': 4.18.0
+      '@rollup/rollup-linux-arm-musleabihf': 4.18.0
+      '@rollup/rollup-linux-arm64-gnu': 4.18.0
+      '@rollup/rollup-linux-arm64-musl': 4.18.0
+      '@rollup/rollup-linux-powerpc64le-gnu': 4.18.0
+      '@rollup/rollup-linux-riscv64-gnu': 4.18.0
+      '@rollup/rollup-linux-s390x-gnu': 4.18.0
+      '@rollup/rollup-linux-x64-gnu': 4.18.0
+      '@rollup/rollup-linux-x64-musl': 4.18.0
+      '@rollup/rollup-win32-arm64-msvc': 4.18.0
+      '@rollup/rollup-win32-ia32-msvc': 4.18.0
+      '@rollup/rollup-win32-x64-msvc': 4.18.0
+      fsevents: 2.3.3
+
   run-async@2.4.1: {}
 
   run-parallel@1.2.0:
@@ -11582,7 +13970,7 @@ snapshots:
 
   safer-buffer@2.1.2: {}
 
-  sass@1.77.2:
+  sass@1.77.6:
     dependencies:
       chokidar: 3.6.0
       immutable: 4.3.6
@@ -11596,6 +13984,7 @@ snapshots:
     dependencies:
       loose-envify: 1.4.0
       object-assign: 4.1.1
+    optional: true
 
   search-insights@2.14.0: {}
 
@@ -11654,6 +14043,10 @@ snapshots:
       interpret: 1.4.0
       rechoir: 0.6.2
 
+  shiki@1.7.0:
+    dependencies:
+      '@shikijs/core': 1.7.0
+
   side-channel@1.0.6:
     dependencies:
       call-bind: 1.0.7
@@ -11665,16 +14058,12 @@ snapshots:
 
   signal-exit@4.1.0: {}
 
-  sirv@1.0.19:
-    dependencies:
-      '@polka/url': 1.0.0-next.25
-      mrmime: 1.0.1
-      totalist: 1.1.0
-
   sisteransi@1.0.5: {}
 
   slash@3.0.0: {}
 
+  slash@5.1.0: {}
+
   slice-ansi@3.0.0:
     dependencies:
       ansi-styles: 4.3.0
@@ -11712,6 +14101,8 @@ snapshots:
 
   spdx-license-ids@3.0.18: {}
 
+  speakingurl@14.0.1: {}
+
   specificity@0.4.1: {}
 
   split2@3.2.2:
@@ -11783,6 +14174,11 @@ snapshots:
     dependencies:
       safe-buffer: 5.2.1
 
+  stringify-entities@4.0.4:
+    dependencies:
+      character-entities-html4: 2.1.0
+      character-entities-legacy: 3.0.0
+
   stringify-object@3.3.0:
     dependencies:
       get-own-enumerable-property-symbols: 3.0.2
@@ -11811,6 +14207,10 @@ snapshots:
 
   strip-json-comments@3.1.1: {}
 
+  strip-literal@1.3.0:
+    dependencies:
+      acorn: 8.12.0
+
   style-search@0.1.0: {}
 
   stylelint-config-recommended-scss@4.3.0(stylelint-scss@3.21.0(stylelint@13.13.1))(stylelint@13.13.1):
@@ -11898,6 +14298,10 @@ snapshots:
     dependencies:
       postcss: 7.0.39
 
+  superjson@2.2.1:
+    dependencies:
+      copy-anything: 3.0.5
+
   supports-color@5.5.0:
     dependencies:
       has-flag: 3.0.0
@@ -11931,6 +14335,8 @@ snapshots:
 
   symbol-tree@3.2.4: {}
 
+  tabbable@6.2.0: {}
+
   table@6.8.2:
     dependencies:
       ajv: 8.14.0
@@ -11984,6 +14390,12 @@ snapshots:
 
   tiny-emitter@2.1.0: {}
 
+  tinybench@2.8.0: {}
+
+  tinypool@0.3.1: {}
+
+  tinyspy@1.1.1: {}
+
   tmp@0.0.33:
     dependencies:
       os-tmpdir: 1.0.2
@@ -11998,8 +14410,6 @@ snapshots:
 
   token-stream@1.0.0: {}
 
-  totalist@1.1.0: {}
-
   tough-cookie@4.1.4:
     dependencies:
       psl: 1.9.0
@@ -12017,9 +14427,7 @@ snapshots:
 
   trough@1.0.5: {}
 
-  trouter@2.0.1:
-    dependencies:
-      matchit: 1.1.0
+  trough@2.2.0: {}
 
   tsconfig-paths@3.15.0:
     dependencies:
@@ -12095,7 +14503,9 @@ snapshots:
 
   uc.micro@1.0.6: {}
 
-  uglify-js@3.17.4:
+  uc.micro@2.1.0: {}
+
+  uglify-js@3.18.0:
     optional: true
 
   unbox-primitive@1.0.2:
@@ -12105,6 +14515,8 @@ snapshots:
       has-symbols: 1.0.3
       which-boxed-primitive: 1.0.2
 
+  undici-types@5.26.5: {}
+
   unicode-canonical-property-names-ecmascript@2.0.0: {}
 
   unicode-match-property-ecmascript@2.0.0:
@@ -12116,6 +14528,18 @@ snapshots:
 
   unicode-property-aliases-ecmascript@2.1.0: {}
 
+  unicorn-magic@0.1.0: {}
+
+  unified@11.0.5:
+    dependencies:
+      '@types/unist': 3.0.2
+      bail: 2.0.2
+      devlop: 1.1.0
+      extend: 3.0.2
+      is-plain-obj: 4.1.0
+      trough: 2.2.0
+      vfile: 6.0.1
+
   unified@9.2.2:
     dependencies:
       '@types/unist': 2.0.10
@@ -12132,10 +14556,29 @@ snapshots:
 
   unist-util-is@4.1.0: {}
 
+  unist-util-is@6.0.0:
+    dependencies:
+      '@types/unist': 3.0.2
+
   unist-util-stringify-position@2.0.3:
     dependencies:
       '@types/unist': 2.0.10
 
+  unist-util-stringify-position@4.0.0:
+    dependencies:
+      '@types/unist': 3.0.2
+
+  unist-util-visit-parents@6.0.1:
+    dependencies:
+      '@types/unist': 3.0.2
+      unist-util-is: 6.0.0
+
+  unist-util-visit@5.0.0:
+    dependencies:
+      '@types/unist': 3.0.2
+      unist-util-is: 6.0.0
+      unist-util-visit-parents: 6.0.1
+
   universalify@0.2.0: {}
 
   universalify@2.0.1: {}
@@ -12148,6 +14591,12 @@ snapshots:
       escalade: 3.1.2
       picocolors: 1.0.1
 
+  update-browserslist-db@1.0.16(browserslist@4.23.1):
+    dependencies:
+      browserslist: 4.23.1
+      escalade: 3.1.2
+      picocolors: 1.0.1
+
   uri-js@4.4.1:
     dependencies:
       punycode: 2.3.1
@@ -12176,13 +14625,16 @@ snapshots:
       spdx-correct: 3.2.0
       spdx-expression-parse: 3.0.1
 
-  vary@1.1.2: {}
-
   vfile-message@2.0.4:
     dependencies:
       '@types/unist': 2.0.10
       unist-util-stringify-position: 2.0.3
 
+  vfile-message@4.0.2:
+    dependencies:
+      '@types/unist': 3.0.2
+      unist-util-stringify-position: 4.0.0
+
   vfile@4.2.1:
     dependencies:
       '@types/unist': 2.0.10
@@ -12190,18 +14642,64 @@ snapshots:
       unist-util-stringify-position: 2.0.3
       vfile-message: 2.0.4
 
-  vite-plugin-md@0.6.7(vite@2.9.18(sass@1.77.2)):
+  vfile@6.0.1:
+    dependencies:
+      '@types/unist': 3.0.2
+      unist-util-stringify-position: 4.0.0
+      vfile-message: 4.0.2
+
+  vite-plugin-md@0.21.5(@vitejs/plugin-vue@4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5)))(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0)):
+    dependencies:
+      '@yankeeinlondon/builder-api': 1.4.1(@vitejs/plugin-vue@4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5)))(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))
+      '@yankeeinlondon/gray-matter': 6.2.1(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+      '@yankeeinlondon/happy-wrapper': 2.10.1(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+      markdown-it: 13.0.2
+      source-map-js: 1.2.0
+      vite: 4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0)
+    transitivePeerDependencies:
+      - '@edge-runtime/vm'
+      - '@vitejs/plugin-vue'
+      - '@vitest/browser'
+      - '@vitest/ui'
+      - encoding
+      - happy-dom
+      - jsdom
+      - less
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+
+  vite-plugin-md@0.22.5(@vitejs/plugin-vue@4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5)))(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0)):
     dependencies:
-      gray-matter: 4.0.3
-      markdown-it: 12.2.0
-      vite: 2.9.18(sass@1.77.2)
+      '@vitejs/plugin-vue': 4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5))
+      '@yankeeinlondon/builder-api': 1.4.1(@vitejs/plugin-vue@4.6.2(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5)))(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)(vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))
+      '@yankeeinlondon/gray-matter': 6.2.1(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+      '@yankeeinlondon/happy-wrapper': 2.10.1(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
+      markdown-it: 13.0.2
+      source-map-js: 1.2.0
+      vite: 4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0)
+    transitivePeerDependencies:
+      - '@edge-runtime/vm'
+      - '@vitest/browser'
+      - '@vitest/ui'
+      - encoding
+      - happy-dom
+      - jsdom
+      - less
+      - sass
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
 
   vite-svg-loader@2.2.0:
     dependencies:
-      '@vue/compiler-sfc': 3.4.27
+      '@vue/compiler-sfc': 3.4.29
       svgo: 2.8.0
 
-  vite@2.9.18(sass@1.77.2):
+  vite@2.9.18(sass@1.77.6):
     dependencies:
       esbuild: 0.14.54
       postcss: 8.4.38
@@ -12209,80 +14707,170 @@ snapshots:
       rollup: 2.77.3
     optionalDependencies:
       fsevents: 2.3.3
-      sass: 1.77.2
+      sass: 1.77.6
 
-  vitepress-theme-demoblock@1.3.2(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.2)(typescript@4.9.5):
+  vite@3.2.10(@types/node@16.18.97)(sass@1.77.6)(sugarss@2.0.0):
     dependencies:
-      camelcase: 6.3.0
-      globby: 11.1.0
-      kolorist: 1.8.0
-      markdown-it: 12.2.0
+      esbuild: 0.15.18
+      postcss: 8.4.38
+      resolve: 1.22.8
+      rollup: 2.79.1
+    optionalDependencies:
+      '@types/node': 16.18.97
+      fsevents: 2.3.3
+      sass: 1.77.6
+      sugarss: 2.0.0
+
+  vite@4.5.3(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0):
+    dependencies:
+      esbuild: 0.18.20
+      postcss: 8.4.38
+      rollup: 3.29.4
+    optionalDependencies:
+      '@types/node': 20.14.7
+      fsevents: 2.3.3
+      sass: 1.77.6
+      sugarss: 2.0.0
+
+  vite@5.3.1(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0):
+    dependencies:
+      esbuild: 0.21.5
+      postcss: 8.4.38
+      rollup: 4.18.0
+    optionalDependencies:
+      '@types/node': 20.14.7
+      fsevents: 2.3.3
+      sass: 1.77.6
+      sugarss: 2.0.0
+
+  vitepress-theme-demoblock@3.0.7(@algolia/client-search@4.23.3)(@types/node@20.14.7)(async-validator@4.2.5)(postcss@8.4.38)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.6)(search-insights@2.14.0)(sugarss@2.0.0)(typescript@4.9.5):
+    dependencies:
+      '@floating-ui/vue': 1.0.6(vue@3.4.29(typescript@4.9.5))
+      '@mdit-vue/plugin-sfc': 2.1.3
+      '@vue/compiler-sfc': 3.4.29
+      '@vueuse/core': 10.11.0(vue@3.4.29(typescript@4.9.5))
+      camelcase: 8.0.0
+      globby: 14.0.1
+      hash-sum: 2.0.0
+      markdown-it: 14.1.0
+      markdown-it-container: 4.0.0
       minimist: 1.2.8
-      prettier: 2.8.8
-      vitepress: 0.16.1(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.2)(typescript@4.9.5)
-      yaml: 2.4.2
+      picocolors: 1.0.1
+      prettier: 3.3.2
+      remark: 15.0.1
+      remark-directive: 3.0.0
+      remark-frontmatter: 5.0.0
+      remark-parse: 11.0.0
+      remark-stringify: 11.0.0
+      shiki: 1.7.0
+      unified: 11.0.5
+      unist-util-visit: 5.0.0
+      vitepress: 1.2.3(@algolia/client-search@4.23.3)(@types/node@20.14.7)(async-validator@4.2.5)(postcss@8.4.38)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.6)(search-insights@2.14.0)(sugarss@2.0.0)(typescript@4.9.5)
+      vue: 3.4.29(typescript@4.9.5)
+      yaml: 2.4.5
     transitivePeerDependencies:
+      - '@algolia/client-search'
+      - '@types/node'
+      - '@types/react'
+      - '@vue/composition-api'
+      - async-validator
+      - axios
+      - change-case
+      - drauu
+      - fuse.js
+      - idb-keyval
+      - jwt-decode
       - less
+      - lightningcss
+      - markdown-it-mathjax3
+      - nprogress
+      - postcss
+      - qrcode
       - react
       - react-dom
       - sass
+      - search-insights
+      - sortablejs
       - stylus
+      - sugarss
       - supports-color
+      - terser
       - typescript
+      - universal-cookie
 
-  vitepress@0.16.1(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.2)(typescript@4.9.5):
+  vitepress@1.2.3(@algolia/client-search@4.23.3)(@types/node@20.14.7)(async-validator@4.2.5)(postcss@8.4.38)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.6)(search-insights@2.14.0)(sugarss@2.0.0)(typescript@4.9.5):
     dependencies:
-      '@docsearch/css': 1.0.0-alpha.28
-      '@docsearch/js': 1.0.0-alpha.28(react-dom@16.14.0(react@16.14.0))(react@16.14.0)
-      '@types/markdown-it': 12.2.3
-      '@vitejs/plugin-vue': 1.10.2(vite@2.9.18(sass@1.77.2))
-      '@vue/compiler-sfc': 3.4.27
-      '@vue/server-renderer': 3.4.27(vue@3.4.27(typescript@4.9.5))
-      chalk: 4.1.2
-      compression: 1.7.4
-      debug: 4.3.4
-      diacritics: 1.3.0
-      escape-html: 1.0.3
-      fs-extra: 10.1.0
-      globby: 11.1.0
-      gray-matter: 4.0.3
-      lru-cache: 6.0.0
-      markdown-it: 12.2.0
-      markdown-it-anchor: 7.1.0(markdown-it@12.2.0)
-      markdown-it-container: 3.0.0
-      markdown-it-emoji: 2.0.2
-      markdown-it-table-of-contents: 0.5.2
-      minimist: 1.2.8
-      ora: 5.4.1
-      polka: 0.5.2
-      prismjs: 1.29.0
-      sirv: 1.0.19
-      vite: 2.9.18(sass@1.77.2)
-      vue: 3.4.27(typescript@4.9.5)
+      '@docsearch/css': 3.6.0
+      '@docsearch/js': 3.6.0(@algolia/client-search@4.23.3)(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(search-insights@2.14.0)
+      '@shikijs/core': 1.7.0
+      '@shikijs/transformers': 1.7.0
+      '@types/markdown-it': 14.1.1
+      '@vitejs/plugin-vue': 5.0.5(vite@5.3.1(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0))(vue@3.4.29(typescript@4.9.5))
+      '@vue/devtools-api': 7.3.2
+      '@vue/shared': 3.4.29
+      '@vueuse/core': 10.11.0(vue@3.4.29(typescript@4.9.5))
+      '@vueuse/integrations': 10.11.0(async-validator@4.2.5)(focus-trap@7.5.4)(vue@3.4.29(typescript@4.9.5))
+      focus-trap: 7.5.4
+      mark.js: 8.11.1
+      minisearch: 6.3.0
+      shiki: 1.7.0
+      vite: 5.3.1(@types/node@20.14.7)(sass@1.77.6)(sugarss@2.0.0)
+      vue: 3.4.29(typescript@4.9.5)
+    optionalDependencies:
+      postcss: 8.4.38
     transitivePeerDependencies:
+      - '@algolia/client-search'
+      - '@types/node'
+      - '@types/react'
+      - '@vue/composition-api'
+      - async-validator
+      - axios
+      - change-case
+      - drauu
+      - fuse.js
+      - idb-keyval
+      - jwt-decode
       - less
+      - lightningcss
+      - nprogress
+      - qrcode
       - react
       - react-dom
       - sass
+      - search-insights
+      - sortablejs
       - stylus
-      - supports-color
+      - sugarss
+      - terser
       - typescript
+      - universal-cookie
 
-  vitepress@0.20.1(react-dom@16.14.0(react@16.14.0))(react@16.14.0)(sass@1.77.2)(typescript@4.9.5):
+  vitest@0.25.8(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0):
     dependencies:
-      '@docsearch/css': 1.0.0-alpha.28
-      '@docsearch/js': 1.0.0-alpha.28(react-dom@16.14.0(react@16.14.0))(react@16.14.0)
-      '@vitejs/plugin-vue': 1.10.2(vite@2.9.18(sass@1.77.2))
-      prismjs: 1.29.0
-      vite: 2.9.18(sass@1.77.2)
-      vue: 3.4.27(typescript@4.9.5)
+      '@types/chai': 4.3.16
+      '@types/chai-subset': 1.3.5
+      '@types/node': 16.18.97
+      acorn: 8.12.0
+      acorn-walk: 8.3.3
+      chai: 4.4.1
+      debug: 4.3.5
+      local-pkg: 0.4.3
+      source-map: 0.6.1
+      strip-literal: 1.3.0
+      tinybench: 2.8.0
+      tinypool: 0.3.1
+      tinyspy: 1.1.1
+      vite: 3.2.10(@types/node@16.18.97)(sass@1.77.6)(sugarss@2.0.0)
+    optionalDependencies:
+      happy-dom: 8.9.0
+      jsdom: 16.7.0
     transitivePeerDependencies:
       - less
-      - react
-      - react-dom
       - sass
       - stylus
-      - typescript
+      - sugarss
+      - supports-color
+      - terser
 
   void-elements@3.1.0: {}
 
@@ -12361,7 +14949,7 @@ snapshots:
       '@volar/vue-code-gen': 0.29.8
       '@vscode/emmet-helper': 2.9.3
       '@vue/reactivity': 3.4.27
-      '@vue/shared': 3.4.27
+      '@vue/shared': 3.4.29
       request-light: 0.5.8
       upath: 2.0.1
       vscode-css-languageservice: 5.4.2
@@ -12374,12 +14962,16 @@ snapshots:
 
   vscode-web-custom-data@0.3.6: {}
 
-  vue-component-type-helpers@2.0.19: {}
+  vue-component-type-helpers@2.0.21: {}
 
   vue-demi@0.14.7(vue@3.4.27(typescript@4.9.5)):
     dependencies:
       vue: 3.4.27(typescript@4.9.5)
 
+  vue-demi@0.14.8(vue@3.4.29(typescript@4.9.5)):
+    dependencies:
+      vue: 3.4.29(typescript@4.9.5)
+
   vue-eslint-parser@7.11.0(eslint@7.32.0):
     dependencies:
       debug: 4.3.4(supports-color@8.1.1)
@@ -12398,15 +14990,27 @@ snapshots:
       '@vue/devtools-api': 6.6.1
       vue: 3.4.27(typescript@4.9.5)
 
+  vue-router@4.3.3(vue@3.4.29(typescript@4.9.5)):
+    dependencies:
+      '@vue/devtools-api': 6.6.3
+      vue: 3.4.29(typescript@4.9.5)
+
+  vue-template-compiler@2.7.16:
+    dependencies:
+      de-indent: 1.0.2
+      he: 1.2.0
+
   vue-tsc@0.29.8(typescript@4.9.5):
     dependencies:
       '@volar/shared': 0.29.8
       typescript: 4.9.5
       vscode-vue-languageservice: 0.29.8
 
-  vue-tsc@0.38.8(typescript@4.9.5):
+  vue-tsc@2.0.21(typescript@4.9.5):
     dependencies:
-      '@volar/vue-typescript': 0.38.8
+      '@volar/typescript': 2.3.0
+      '@vue/language-core': 2.0.21(typescript@4.9.5)
+      semver: 7.6.2
       typescript: 4.9.5
 
   vue@3.4.27(typescript@4.9.5):
@@ -12419,6 +15023,16 @@ snapshots:
     optionalDependencies:
       typescript: 4.9.5
 
+  vue@3.4.29(typescript@4.9.5):
+    dependencies:
+      '@vue/compiler-dom': 3.4.29
+      '@vue/compiler-sfc': 3.4.29
+      '@vue/runtime-dom': 3.4.29
+      '@vue/server-renderer': 3.4.29(vue@3.4.29(typescript@4.9.5))
+      '@vue/shared': 3.4.29
+    optionalDependencies:
+      typescript: 4.9.5
+
   w3c-hr-time@1.0.2:
     dependencies:
       browser-process-hrtime: 1.0.0
@@ -12441,12 +15055,20 @@ snapshots:
 
   webidl-conversions@6.1.0: {}
 
+  webidl-conversions@7.0.0: {}
+
   whatwg-encoding@1.0.5:
     dependencies:
       iconv-lite: 0.4.24
 
+  whatwg-encoding@2.0.0:
+    dependencies:
+      iconv-lite: 0.6.3
+
   whatwg-mimetype@2.3.0: {}
 
+  whatwg-mimetype@3.0.0: {}
+
   whatwg-url@5.0.0:
     dependencies:
       tr46: 0.0.3
@@ -12486,8 +15108,8 @@ snapshots:
 
   with@7.0.2:
     dependencies:
-      '@babel/parser': 7.24.6
-      '@babel/types': 7.24.6
+      '@babel/parser': 7.24.7
+      '@babel/types': 7.24.7
       assert-never: 1.2.1
       babel-walk: 3.0.0-canary-5
 
@@ -12522,7 +15144,7 @@ snapshots:
       signal-exit: 3.0.7
       typedarray-to-buffer: 3.1.5
 
-  ws@7.5.9: {}
+  ws@7.5.10: {}
 
   xml-name-validator@3.0.0: {}
 
@@ -12545,7 +15167,7 @@ snapshots:
 
   yaml@1.10.2: {}
 
-  yaml@2.4.2: {}
+  yaml@2.4.5: {}
 
   yargs-parser@18.1.3:
     dependencies:
@@ -12599,3 +15221,5 @@ snapshots:
       tslib: 2.3.0
 
   zwitch@1.0.5: {}
+
+  zwitch@2.0.4: {}

From 494a4b07abcefb382b4d9523e45c4609e38b29d2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 19:42:56 +0800
Subject: [PATCH 12/30] revert(home): use old version of home `index.md`

---
 packages/devui-vue/docs/index.md | 31 +++++++++----------------------
 1 file changed, 9 insertions(+), 22 deletions(-)

diff --git a/packages/devui-vue/docs/index.md b/packages/devui-vue/docs/index.md
index 6fc859e99e..4c714a2805 100644
--- a/packages/devui-vue/docs/index.md
+++ b/packages/devui-vue/docs/index.md
@@ -1,24 +1,11 @@
 ---
-# https://vitepress.dev/reference/default-theme-home-page
-layout: home
-
-hero:
-  name: 'Vue DevUI'
-  text: '基于 DevUI Design 的 Vue3 组件库'
-  tagline: My great project tagline
-  actions:
-    - theme: brand
-      text: 快速开始
-      link: /quick-start
-    - theme: alt
-      text: Github
-      link: https://github.com/DevCloudFE/vue-devui
-
-features:
-  - title: Feature A
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
-  - title: Feature B
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
-  - title: Feature C
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+layout: Home
+heroImage: /assets/devui-design.svg
+heroText: Vue DevUI
+tagline: 一个基于 DevUI Design 的 Vue3 组件库
+actionText: 快速开始
+actionLink: /quick-start/
+altActionText: Github
+altActionLink: https://github.com/DevCloudFE/vue-devui
+footer: MIT Licensed | Copyright © 2021-present DevUI
 ---

From c0d2ee231cee0e1b8a8daff05ace0246f5209732 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Fri, 21 Jun 2024 19:44:18 +0800
Subject: [PATCH 13/30] refactor(layout): refactor layout to fit changes with
 vitepress@latest

Related Issue: #1879
---
 .../docs/.vitepress/devui-theme/Layout.vue    |  47 +++---
 .../devui-theme/components/SideBarLink.js     |   2 +-
 .../devui-theme/composables/activeBar.ts      | 144 ++++++++----------
 .../devui-vue/docs/.vitepress/theme/index.ts  |   2 +-
 4 files changed, 86 insertions(+), 109 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue b/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue
index 63d0d01869..1591dd0c6d 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue
@@ -15,11 +15,9 @@ import { LANG_KEY, ZH_CN, EN_US } from './const';
 
 const Home = defineAsyncComponent(() => import('./components/Home.vue'));
 
-const NoopComponent = () => null;
-
-const CarbonAds = __CARBON__ ? defineAsyncComponent(() => import('./components/CarbonAds.vue')) : NoopComponent;
-const BuySellAds = __BSA__ ? defineAsyncComponent(() => import('./components/BuySellAds.vue')) : NoopComponent;
-const AlgoliaSearchBox = __ALGOLIA__ ? defineAsyncComponent(() => import('./components/AlgoliaSearchBox.vue')) : NoopComponent;
+const CarbonAds = defineAsyncComponent(() => import('./components/CarbonAds.vue'));
+const BuySellAds = defineAsyncComponent(() => import('./components/BuySellAds.vue'));
+const AlgoliaSearchBox = defineAsyncComponent(() => import('./components/AlgoliaSearchBox.vue'));
 
 // generic state
 const route = useRoute();
@@ -29,7 +27,8 @@ const router = useRouter();
 // custom layout
 const isCustomLayout = computed(() => !!frontmatter.value.customLayout);
 // home
-const enableHome = computed(() => !!frontmatter.value.home);
+console.table(frontmatter.value);
+const enableHome = computed(() => !!frontmatter.value.layout);
 
 // automatic multilang check for AlgoliaSearchBox
 const isMultiLang = computed(() => Object.keys(theme.value.locales || {}).length > 0);
@@ -47,7 +46,7 @@ const showNavbar = computed(() => {
 const openSideBar = ref(false);
 
 const showSidebar = computed(() => {
-  if (frontmatter.value.home || frontmatter.value.sidebar === false) {
+  if (frontmatter.value.layout || frontmatter.value.sidebar === false) {
     return false;
   }
 
@@ -182,7 +181,8 @@ const contributors = computed(() => {
           <template #top>
             <slot name="page-top-ads">
               <div id="ads-container" v-if="theme.carbonAds && theme.carbonAds.carbon">
-                <CarbonAds :key="'carbon' + page.relativePath" :code="theme.carbonAds.carbon" :placement="theme.carbonAds.placement" />
+                <CarbonAds :key="'carbon' + page.relativePath" :code="theme.carbonAds.carbon"
+                  :placement="theme.carbonAds.placement" />
               </div>
             </slot>
             <slot name="page-top" />
@@ -190,12 +190,8 @@ const contributors = computed(() => {
           <template #bottom>
             <slot name="page-bottom" />
             <slot name="page-bottom-ads">
-              <BuySellAds
-                v-if="theme.carbonAds && theme.carbonAds.custom"
-                :key="'custom' + page.relativePath"
-                :code="theme.carbonAds.custom"
-                :placement="theme.carbonAds.placement"
-              />
+              <BuySellAds v-if="theme.carbonAds && theme.carbonAds.custom" :key="'custom' + page.relativePath"
+                :code="theme.carbonAds.custom" :placement="theme.carbonAds.placement" />
             </slot>
           </template>
         </Page>
@@ -204,14 +200,15 @@ const contributors = computed(() => {
       <div class="container-contributors" v-if="enableHome">
         <div class="contributors-inner">
           <h2>✨贡献者✨</h2>
-          <PageContributor v-if="contributors && contributors.length > 0" :contributors="contributors" :spacing="20" :avatarSize="48" />
-          <a href="/contributing/"><Button class="btn-become-contributor" variant="solid" color="primary">成为贡献者</Button></a>
+          <PageContributor v-if="contributors && contributors.length > 0" :contributors="contributors" :spacing="20"
+            :avatarSize="48" />
+          <a href="/contributing/"><Button class="btn-become-contributor" variant="solid"
+              color="primary">成为贡献者</Button></a>
         </div>
       </div>
     </div>
 
     <DevuiFooter class="footer" v-if="enableHome" />
-    <Debug v-if="false" />
   </div>
 </template>
 
@@ -313,21 +310,21 @@ body[ui-theme='galaxy-theme'] {
     }
 
     .page-contributor {
-      & > a > span {
+      &>a>span {
         margin: 0 12px 8px 0 !important;
 
-        & > img,
+        &>img,
         & svg {
           width: 40px !important;
           height: 40px !important;
         }
       }
 
-      & > a:nth-child(8n) > span {
+      &>a:nth-child(8n)>span {
         margin: 0 12px 8px 0 !important;
       }
 
-      & > a:nth-child(7n) > span {
+      &>a:nth-child(7n)>span {
         margin: 0 !important;
       }
     }
@@ -338,11 +335,11 @@ body[ui-theme='galaxy-theme'] {
 @media (max-width: 385px) {
   .container-contributors .contributors-inner {
     .page-contributor {
-      & > a:nth-child(7n) > span {
+      &>a:nth-child(7n)>span {
         margin: 0 12px 8px 0 !important;
       }
 
-      & > a:nth-child(6n) > span {
+      &>a:nth-child(6n)>span {
         margin: 0 !important;
       }
     }
@@ -353,11 +350,11 @@ body[ui-theme='galaxy-theme'] {
 @media (max-width: 330px) {
   .container-contributors .contributors-inner {
     .page-contributor {
-      & > a:nth-child(6n) > span {
+      &>a:nth-child(6n)>span {
         margin: 0 12px 8px 0 !important;
       }
 
-      & > a:nth-child(5n) > span {
+      &>a:nth-child(5n)>span {
         margin: 0 !important;
       }
     }
diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/components/SideBarLink.js b/packages/devui-vue/docs/.vitepress/devui-theme/components/SideBarLink.js
index 742fb18fa3..e1dee52ad7 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/components/SideBarLink.js
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/components/SideBarLink.js
@@ -38,7 +38,7 @@ export const SideBarLink = (props) => {
   }
 
   const link = resolveLink(site.value.base, props.item.link);
-  const children = props.item.children;
+  const children = props.item.items;
   const active = isActive(route, props.item.link);
   const childItems = depth < maxDepth ? createChildren(active, children, headers, depth + 1) : null;
   return h('li', { class: 'sidebar-link' }, [
diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts b/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
index b8d10d5c10..2064e378dc 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
@@ -1,136 +1,116 @@
-import { onMounted, onUnmounted, onUpdated } from 'vue'
+import { onMounted, onUnmounted, onUpdated } from 'vue';
 
-import type { Ref } from 'vue'
+import type { Ref } from 'vue';
 
 // 防抖节流控制
 export const throttleAndDebounce = (fn: () => any, delay: number) => {
-  let timeout: ReturnType<typeof setTimeout>
-  let called = false
+  let timeout: ReturnType<typeof setTimeout>;
+  let called = false;
   return () => {
     if (timeout) {
-      clearTimeout(timeout)
+      clearTimeout(timeout);
     }
     if (!called) {
-      fn()
-      called = true
+      fn();
+      called = true;
       setTimeout(() => {
-        called = false
-      }, delay)
+        called = false;
+      }, delay);
     } else {
-      timeout = setTimeout(fn, delay)
+      timeout = setTimeout(fn, delay);
     }
-  }
-}
+  };
+};
 
-export function useActiveSidebarLinks(
-  container: Ref<HTMLElement>,
-  marker: Ref<HTMLElement>
-) {
-  const onScroll = throttleAndDebounce(setActiveLink, 150)
+export function useActiveSidebarLinks(container: Ref<HTMLElement>, marker: Ref<HTMLElement>) {
+  const onScroll = throttleAndDebounce(setActiveLink, 150);
   function setActiveLink() {
-    const sidebarLinks = getSidebarLinks()
-    const anchors = getAnchors(sidebarLinks)
+    const sidebarLinks = getSidebarLinks();
+    const anchors = getAnchors(sidebarLinks);
 
-    if (
-      anchors.length &&
-      window.scrollY + window.innerHeight === document.body.offsetHeight
-    ) {
-      activateLink(anchors[anchors.length - 1].hash)
-      return
+    if (anchors.length && window.scrollY + window.innerHeight === document.body.offsetHeight) {
+      activateLink(anchors[anchors.length - 1].hash);
+      return;
     }
     for (let i = 0; i < anchors.length; i++) {
-      const anchor = anchors[i]
-      const nextAnchor = anchors[i + 1]
-      const [isActive, hash] = isAnchorActive(i, anchor, nextAnchor)
+      const anchor = anchors[i];
+      const nextAnchor = anchors[i + 1];
+      const [isActive, hash] = isAnchorActive(i, anchor, nextAnchor);
       if (isActive) {
-        history.replaceState(
-          null,
-          document.title,
-          hash ? (hash as string) : ' '
-        )
-        activateLink(hash as string)
-        return
+        history.replaceState(null, document.title, hash ? (hash as string) : ' ');
+        activateLink(hash as string);
+        return;
       }
     }
   }
 
-  let prevActiveLink: HTMLAnchorElement | null = null
+  let prevActiveLink: HTMLAnchorElement | null = null;
 
   function activateLink(hash: string) {
-    deactiveLink(prevActiveLink)
+    deactiveLink(prevActiveLink);
 
-    const activeLink = (prevActiveLink =
-      hash == null
-        ? null
-        : (container.value.querySelector(
-            `.devui-item a[href="${decodeURIComponent(hash)}"]`
-          ) as HTMLAnchorElement))
-    if (activeLink) {
-      activeLink.classList.add('active')
-      marker.value.style.opacity = '1'
-      marker.value.style.top = `${activeLink.offsetTop}px`
-    } else {
-      marker.value.style.opacity = '0'
-      marker.value.style.top = '33px'
-    }
+    // const activeLink = (prevActiveLink =
+    //   hash == null
+    //     ? null
+    //     : (container.value.querySelector(
+    //         `.devui-item a[href="${decodeURIComponent(hash)}"]`
+    //       ) as HTMLAnchorElement))
+    // if (activeLink) {
+    //   activeLink.classList.add('active')
+    //   marker.value.style.opacity = '1'
+    //   marker.value.style.top = `${activeLink.offsetTop}px`
+    // } else {
+    //   marker.value.style.opacity = '0'
+    //   marker.value.style.top = '33px'
+    // }
   }
 
   function deactiveLink(link: HTMLElement) {
-    link && link.classList.remove('active')
+    link && link.classList.remove('active');
   }
 
   onMounted(() => {
-    window.requestAnimationFrame(setActiveLink)
-    window.addEventListener('scroll', onScroll)
-  })
+    window.requestAnimationFrame(setActiveLink);
+    window.addEventListener('scroll', onScroll);
+  });
 
   onUpdated(() => {
-    activateLink(location.hash)
-  })
+    activateLink(location.hash);
+  });
 
   onUnmounted(() => {
-    window.removeEventListener('scroll', onScroll)
-  })
+    window.removeEventListener('scroll', onScroll);
+  });
 }
 function getSidebarLinks() {
-  return Array.from(
-    document.querySelectorAll('.devui-content-nav .devui-link')
-  ) as HTMLAnchorElement[]
+  return Array.from(document.querySelectorAll('.devui-content-nav .devui-link')) as HTMLAnchorElement[];
 }
 function getAnchors(sidebarLinks: HTMLAnchorElement[]) {
-  return (
-    Array.from(
-      document.querySelectorAll('.content .header-anchor')
-    ) as HTMLAnchorElement[]
-  ).filter((anchor) =>
+  return (Array.from(document.querySelectorAll('.content .header-anchor')) as HTMLAnchorElement[]).filter((anchor) =>
     sidebarLinks.some((sidebarLink) => sidebarLink.hash === anchor.hash)
-  )
+  );
 }
 function getPageOffset() {
-  return (document.querySelector('.nav-bar') as HTMLElement).offsetHeight
+  return (document.querySelector('.nav-bar') as HTMLElement).offsetHeight;
 }
 function getAnchorTop(anchor: HTMLAnchorElement) {
-  const pageOffset = getPageOffset()
+  const pageOffset = getPageOffset();
   try {
-    return anchor.parentElement.offsetTop - pageOffset - 15
+    return anchor.parentElement.offsetTop - pageOffset - 15;
   } catch (e) {
-    return 0
+    return 0;
   }
 }
-function isAnchorActive(
-  index: number,
-  anchor: HTMLAnchorElement,
-  nextAnchor: HTMLAnchorElement
-) {
-  const scrollTop = window.scrollY
+function isAnchorActive(index: number, anchor: HTMLAnchorElement, nextAnchor: HTMLAnchorElement) {
+  const scrollTop = window.scrollY;
   if (index === 0 && scrollTop === 0) {
-    return [true, null]
+    return [true, null];
   }
   if (scrollTop < getAnchorTop(anchor)) {
-    return [false, null]
+    return [false, null];
   }
   if (!nextAnchor || scrollTop < getAnchorTop(nextAnchor)) {
-    return [true, decodeURIComponent(anchor.hash)]
+    return [true, decodeURIComponent(anchor.hash)];
   }
-  return [false, null]
+  return [false, null];
 }
diff --git a/packages/devui-vue/docs/.vitepress/theme/index.ts b/packages/devui-vue/docs/.vitepress/theme/index.ts
index 630f79d558..26c872823b 100644
--- a/packages/devui-vue/docs/.vitepress/theme/index.ts
+++ b/packages/devui-vue/docs/.vitepress/theme/index.ts
@@ -39,7 +39,7 @@ if (typeof window !== 'undefined') {
 export default {
   extends: DevUITheme,
   Layout: () => {
-    return h(DefaultTheme.Layout, null, {
+    return h(DevUITheme.Layout ?? DefaultTheme.Layout, null, {
       // https://vitepress.dev/guide/extending-default-theme#layout-slots
     });
   },

From 6ea38a50dc1412f779a969d50f46563be544b4f0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Thu, 27 Jun 2024 20:04:10 +0800
Subject: [PATCH 14/30] chore: remove some debug expressions

---
 packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue    | 1 -
 packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts | 1 -
 2 files changed, 2 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue b/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue
index 1591dd0c6d..ee176ebe05 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue
@@ -27,7 +27,6 @@ const router = useRouter();
 // custom layout
 const isCustomLayout = computed(() => !!frontmatter.value.customLayout);
 // home
-console.table(frontmatter.value);
 const enableHome = computed(() => !!frontmatter.value.layout);
 
 // automatic multilang check for AlgoliaSearchBox
diff --git a/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts b/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts
index 5afb1af479..d7178c900d 100644
--- a/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts
+++ b/packages/devui-vue/docs/.vitepress/plugins/md-transformer.ts
@@ -22,7 +22,6 @@ export function MdTransformer(): Plugin {
           `
 <script setup lang="ts">
 const demoList = import.meta.glob('../../components/${componentName}/*.vue') ?? []
-console.log(demoList);
 `
         );
       } else {

From a24274fe2cdfe0a162dfc0032b78669bca17d70c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Thu, 27 Jun 2024 20:09:13 +0800
Subject: [PATCH 15/30] fix(code): fix codeblock errors

- Remove unknown language mark
- Remove useless border-radius
---
 .../.vitepress/devui-theme/styles/code.scss   | 80 ++++++++++---------
 1 file changed, 41 insertions(+), 39 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/styles/code.scss b/packages/devui-vue/docs/.vitepress/devui-theme/styles/code.scss
index fc5b4041d5..b8978b2ac8 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/styles/code.scss
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/styles/code.scss
@@ -23,7 +23,6 @@ div[class*='language-'] {
   margin: 1rem -1.5rem;
   background-color: $devui-area !important;
   overflow-x: auto;
-  border-radius: 20px !important;
 }
 
 li > div[class*='language-'] {
@@ -38,7 +37,7 @@ li > div[class*='language-'] {
   }
 
   li > div[class*='language-'] {
-    margin: 1rem 0 1rem 0rem;
+    margin: 1rem 0 1rem 0;
     border-radius: 6px;
   }
 }
@@ -72,11 +71,10 @@ li > div[class*='language-'] {
   padding: 0;
   line-height: var(--code-line-height);
   font-size: var(--code-font-size);
-  color: #eee;
+  color: #eeeeee;
 }
 
 /* Line highlighting */
-
 .highlight-lines {
   position: absolute;
   top: 0;
@@ -96,7 +94,6 @@ li > div[class*='language-'] {
 }
 
 /* Line numbers mode */
-
 div[class*='language-'].line-numbers-mode {
   padding-left: 3.5rem;
 }
@@ -114,108 +111,107 @@ div[class*='language-'].line-numbers-mode {
   line-height: var(--code-line-height);
   font-family: var(--code-font-family);
   font-size: var(--code-font-size);
-  color: #888;
+  color: #888888;
 }
 
 /* Language marker */
-
-div[class*='language-']:before {
+div[class*='language-']::before {
   position: absolute;
   top: 0.6em;
   right: 1em;
   z-index: 2;
   font-size: 0.8rem;
-  color: #888;
+  color: #888888;
 }
 
-div[class~='language-html']:before,
-div[class~='language-markup']:before {
+div[class~='language-html']::before,
+div[class~='language-markup']::before {
   content: 'html';
 }
 
-div[class~='language-md']:before,
-div[class~='language-markdown']:before {
+div[class~='language-md']::before,
+div[class~='language-markdown']::before {
   content: 'md';
 }
 
-div[class~='language-css']:before {
+div[class~='language-css']::before {
   content: 'css';
 }
 
-div[class~='language-sass']:before {
+div[class~='language-sass']::before {
   content: 'sass';
 }
 
-div[class~='language-scss']:before {
+div[class~='language-scss']::before {
   content: 'scss';
 }
 
-div[class~='language-less']:before {
+div[class~='language-less']::before {
   content: 'less';
 }
 
-div[class~='language-stylus']:before {
+div[class~='language-stylus']::before {
   content: 'styl';
 }
 
-div[class~='language-js']:before,
-div[class~='language-javascript']:before {
+div[class~='language-js']::before,
+div[class~='language-javascript']::before {
   content: 'js';
 }
 
-div[class~='language-ts']:before,
-div[class~='language-typescript']:before {
+div[class~='language-ts']::before,
+div[class~='language-typescript']::before {
   content: 'ts';
 }
 
-div[class~='language-json']:before {
+div[class~='language-json']::before {
   content: 'json';
 }
 
-div[class~='language-rb']:before,
-div[class~='language-ruby']:before {
+div[class~='language-rb']::before,
+div[class~='language-ruby']::before {
   content: 'rb';
 }
 
-div[class~='language-py']:before,
-div[class~='language-python']:before {
+div[class~='language-py']::before,
+div[class~='language-python']::before {
   content: 'py';
 }
 
-div[class~='language-sh']:before,
-div[class~='language-bash']:before {
+div[class~='language-sh']::before,
+div[class~='language-bash']::before {
   content: 'sh';
 }
 
-div[class~='language-php']:before {
+div[class~='language-php']::before {
   content: 'php';
 }
 
-div[class~='language-go']:before {
+div[class~='language-go']::before {
   content: 'go';
 }
 
-div[class~='language-rust']:before {
+div[class~='language-rust']::before {
   content: 'rust';
 }
 
-div[class~='language-java']:before {
+div[class~='language-java']::before {
   content: 'java';
 }
 
-div[class~='language-c']:before {
+div[class~='language-c']::before {
   content: 'c';
 }
 
-div[class~='language-yaml']:before {
+div[class~='language-yaml']::before {
   content: 'yaml';
 }
 
-div[class~='language-dockerfile']:before {
+div[class~='language-dockerfile']::before {
   content: 'dockerfile';
 }
 
-div[class~='language-vue']:before {
+div[class~='language-vue']::before {
   content: 'vue';
 }
 
@@ -225,16 +221,17 @@ div[class~='language-vue']:before {
  *
  * @author Rose Pritchard
  */
+
 .token.comment,
 .token.block-comment,
 .token.prolog,
 .token.doctype,
 .token.cdata {
-  color: #999;
+  color: #999999;
 }
 
 .token.punctuation {
-  color: #ccc;
+  color: #cccccc;
 }
 
 .token.tag,
@@ -299,3 +296,8 @@ div[class~='language-vue']:before {
 .token.inserted {
   color: green;
 }
+
+// Remove default language marker
+.lang {
+  display: none;
+}

From a17460b91d1a723d6b07c10818d6a49cff29cd53 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Thu, 27 Jun 2024 20:10:41 +0800
Subject: [PATCH 16/30] chore(layout): add `@ts-ignore` for `@devui/button`

---
 packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue b/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue
index ee176ebe05..42c0902a8d 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue
@@ -10,6 +10,7 @@ import HomeFooter from './components/HomeFooter.vue';
 import DevuiFooter from './components/DevuiFooter.vue';
 import { CONTRIBUTORS_MAP } from './components/PageContributorConfig';
 import PageContributor from './components/PageContributor.vue';
+// @ts-ignore - @devui/button sometimes unable to resolve by editor
 import { Button } from '@devui/button';
 import { LANG_KEY, ZH_CN, EN_US } from './const';
 
@@ -29,7 +30,7 @@ const isCustomLayout = computed(() => !!frontmatter.value.customLayout);
 // home
 const enableHome = computed(() => !!frontmatter.value.layout);
 
-// automatic multilang check for AlgoliaSearchBox
+// automatic multi-lang check for AlgoliaSearchBox
 const isMultiLang = computed(() => Object.keys(theme.value.locales || {}).length > 0);
 
 // navbar

From d2872166cc51a40f25c01a3a70ed9fe37c6a38ca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Thu, 27 Jun 2024 20:14:20 +0800
Subject: [PATCH 17/30] chore(deps): bump pnpm to `v9.4.0`

---
 pnpm-lock.yaml | 293 -------------------------------------------------
 1 file changed, 293 deletions(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index fa4b83f65d..be11c6455d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -152,8 +152,6 @@ importers:
         specifier: ^0.29.8
         version: 0.29.8(typescript@4.9.5)
 
-  packages/devui-theme/build: {}
-
   packages/devui-vue:
     dependencies:
       '@babel/helper-hoist-variables':
@@ -383,239 +381,6 @@ importers:
         specifier: 2.0.21
         version: 2.0.21(typescript@4.9.5)
 
-  packages/devui-vue/build:
-    dependencies:
-      '@babel/helper-hoist-variables':
-        specifier: ^7.22.5
-        version: 7.24.6
-      '@devui-design/icons':
-        specifier: ^1.3.0
-        version: 1.4.0
-      '@floating-ui/dom':
-        specifier: 1.2.5
-        version: 1.2.5
-      '@iktakahiro/markdown-it-katex':
-        specifier: ^4.0.1
-        version: 4.0.1
-      '@types/codemirror':
-        specifier: 0.0.97
-        version: 0.0.97
-      '@types/lodash-es':
-        specifier: ^4.17.4
-        version: 4.17.12
-      '@vue/shared':
-        specifier: ^3.2.33
-        version: 3.4.27
-      '@vueuse/core':
-        specifier: 8.9.4
-        version: 8.9.4(vue@3.4.27(typescript@4.9.5))
-      async-validator:
-        specifier: ^4.0.7
-        version: 4.2.5
-      clipboard:
-        specifier: ^2.0.11
-        version: 2.0.11
-      clipboard-copy:
-        specifier: ^4.0.1
-        version: 4.0.1
-      codemirror:
-        specifier: 5.63.3
-        version: 5.63.3
-      dayjs:
-        specifier: ^1.11.3
-        version: 1.11.11
-      devui-theme:
-        specifier: ^0.0.1
-        version: 0.0.1
-      diff2html:
-        specifier: ^3.4.35
-        version: 3.4.48
-      echarts:
-        specifier: 5.3.3
-        version: 5.3.3
-      fs-extra:
-        specifier: ^10.0.0
-        version: 10.1.0
-      highlight.js:
-        specifier: ^11.6.0
-        version: 11.9.0
-      katex:
-        specifier: ^0.12.0
-        version: 0.12.0
-      lodash:
-        specifier: ^4.17.21
-        version: 4.17.21
-      lodash-es:
-        specifier: ^4.17.20
-        version: 4.17.21
-      markdown-it:
-        specifier: 12.2.0
-        version: 12.2.0
-      markdown-it-emoji:
-        specifier: ^3.0.0
-        version: 3.0.0
-      markdown-it-plantuml:
-        specifier: ^1.4.1
-        version: 1.4.1
-      mermaid:
-        specifier: 9.1.1
-        version: 9.1.1
-      mitt:
-        specifier: ^3.0.0
-        version: 3.0.1
-      monaco-editor:
-        specifier: 0.34.0
-        version: 0.34.0
-      rxjs:
-        specifier: ^7.8.1
-        version: 7.8.1
-      uuid:
-        specifier: ^9.0.1
-        version: 9.0.1
-      vue:
-        specifier: ^3.3
-        version: 3.4.27(typescript@4.9.5)
-      vue-router:
-        specifier: ^4.0.3
-        version: 4.3.2(vue@3.4.27(typescript@4.9.5))
-      xss:
-        specifier: ^1.0.14
-        version: 1.0.15
-
-  packages/devui-vue/build/action-timeline: {}
-
-  packages/devui-vue/build/alert: {}
-
-  packages/devui-vue/build/auto-complete: {}
-
-  packages/devui-vue/build/avatar: {}
-
-  packages/devui-vue/build/badge: {}
-
-  packages/devui-vue/build/breadcrumb: {}
-
-  packages/devui-vue/build/button: {}
-
-  packages/devui-vue/build/card: {}
-
-  packages/devui-vue/build/carousel: {}
-
-  packages/devui-vue/build/category-search: {}
-
-  packages/devui-vue/build/checkbox: {}
-
-  packages/devui-vue/build/code-editor: {}
-
-  packages/devui-vue/build/code-review: {}
-
-  packages/devui-vue/build/collapse: {}
-
-  packages/devui-vue/build/countdown: {}
-
-  packages/devui-vue/build/data-grid: {}
-
-  packages/devui-vue/build/date-picker-pro: {}
-
-  packages/devui-vue/build/dragdrop: {}
-
-  packages/devui-vue/build/dragdrop-new: {}
-
-  packages/devui-vue/build/drawer: {}
-
-  packages/devui-vue/build/dropdown: {}
-
-  packages/devui-vue/build/echarts: {}
-
-  packages/devui-vue/build/editable-select: {}
-
-  packages/devui-vue/build/editor-md: {}
-
-  packages/devui-vue/build/form: {}
-
-  packages/devui-vue/build/fullscreen: {}
-
-  packages/devui-vue/build/git-graph: {}
-
-  packages/devui-vue/build/grid: {}
-
-  packages/devui-vue/build/icon: {}
-
-  packages/devui-vue/build/image-preview: {}
-
-  packages/devui-vue/build/input: {}
-
-  packages/devui-vue/build/input-number: {}
-
-  packages/devui-vue/build/layout: {}
-
-  packages/devui-vue/build/loading: {}
-
-  packages/devui-vue/build/mention: {}
-
-  packages/devui-vue/build/menu: {}
-
-  packages/devui-vue/build/message: {}
-
-  packages/devui-vue/build/modal: {}
-
-  packages/devui-vue/build/notification: {}
-
-  packages/devui-vue/build/overlay: {}
-
-  packages/devui-vue/build/pagination: {}
-
-  packages/devui-vue/build/panel: {}
-
-  packages/devui-vue/build/popover: {}
-
-  packages/devui-vue/build/progress: {}
-
-  packages/devui-vue/build/radio: {}
-
-  packages/devui-vue/build/rate: {}
-
-  packages/devui-vue/build/result: {}
-
-  packages/devui-vue/build/ripple: {}
-
-  packages/devui-vue/build/search: {}
-
-  packages/devui-vue/build/select: {}
-
-  packages/devui-vue/build/skeleton: {}
-
-  packages/devui-vue/build/slider: {}
-
-  packages/devui-vue/build/splitter: {}
-
-  packages/devui-vue/build/statistic: {}
-
-  packages/devui-vue/build/status: {}
-
-  packages/devui-vue/build/steps: {}
-
-  packages/devui-vue/build/switch: {}
-
-  packages/devui-vue/build/table: {}
-
-  packages/devui-vue/build/tabs: {}
-
-  packages/devui-vue/build/tag: {}
-
-  packages/devui-vue/build/textarea: {}
-
-  packages/devui-vue/build/time-picker: {}
-
-  packages/devui-vue/build/time-select: {}
-
-  packages/devui-vue/build/timeline: {}
-
-  packages/devui-vue/build/tooltip: {}
-
-  packages/devui-vue/build/tree: {}
-
-  packages/devui-vue/build/upload: {}
-
 packages:
 
   '@algolia/autocomplete-core@1.9.3':
@@ -759,10 +524,6 @@ packages:
     resolution: {integrity: sha512-FyoJTsj/PEUWu1/TYRiXTIHc8lbw+TDYkZuoE43opPS5TrI7MyONBE1oNvfguEXAD9yhQRrVBnXdXzSLQl9XnA==}
     engines: {node: '>=6.9.0'}
 
-  '@babel/helper-hoist-variables@7.24.6':
-    resolution: {integrity: sha512-SF/EMrC3OD7dSta1bLJIlrsVxwtd0UpjRJqLno6125epQMJ/kyFmpTT4pbvPbdQHzCHg+biQ7Syo8lnDtbR+uA==}
-    engines: {node: '>=6.9.0'}
-
   '@babel/helper-hoist-variables@7.24.7':
     resolution: {integrity: sha512-MJJwhkoGy5c4ehfoRyrJ/owKeMl19U54h27YYftT0o2teQ3FJ3nQUf/I3LlJsX4l3qlw7WRXUmiyajvHXoTubQ==}
     engines: {node: '>=6.9.0'}
@@ -2337,9 +2098,6 @@ packages:
   '@vue/compiler-ssr@3.4.29':
     resolution: {integrity: sha512-rFbwCmxJ16tDp3N8XCx5xSQzjhidYjXllvEcqX/lopkoznlNPz3jyy0WGJCyhAaVQK677WWFt3YO/WUEkMMUFQ==}
 
-  '@vue/devtools-api@6.6.1':
-    resolution: {integrity: sha512-LgPscpE3Vs0x96PzSSB4IGVSZXZBZHpfxs+ZA1d+VEPwHdOXowy/Y2CsvCAIFrf+ssVU1pD1jidj505EpUnfbA==}
-
   '@vue/devtools-api@6.6.3':
     resolution: {integrity: sha512-0MiMsFma/HqA6g3KLKn+AGpL1kgKhFWszC9U29NfpWK5LE7bjeXxySWJrOJ77hBz+TBrBQ7o4QJqbPbqbs8rJw==}
 
@@ -3521,9 +3279,6 @@ packages:
   devlop@1.1.0:
     resolution: {integrity: sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==}
 
-  devui-theme@0.0.1:
-    resolution: {integrity: sha512-5nF6fChlsXKeAtvkaAF4bZ0NMiEAbzwqQ9XZQiNuM0RRFz5lW29nnbhfDCNPkmnw5ZyCVyXqYwVRBIZrwZHXrA==}
-
   didyoumean@1.2.2:
     resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
 
@@ -6976,17 +6731,6 @@ packages:
   vue-component-type-helpers@2.0.21:
     resolution: {integrity: sha512-3NaicyZ7N4B6cft4bfb7dOnPbE9CjLcx+6wZWAg5zwszfO4qXRh+U52dN5r5ZZfc6iMaxKCEcoH9CmxxoFZHLg==}
 
-  vue-demi@0.14.7:
-    resolution: {integrity: sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==}
-    engines: {node: '>=12'}
-    hasBin: true
-    peerDependencies:
-      '@vue/composition-api': ^1.0.0-rc.1
-      vue: ^3.0.0-0 || ^2.6.0
-    peerDependenciesMeta:
-      '@vue/composition-api':
-        optional: true
-
   vue-demi@0.14.8:
     resolution: {integrity: sha512-Uuqnk9YE9SsWeReYqK2alDI5YzciATE0r2SkA6iMAtuXvNTMNACJLJEXNXaEy94ECuBe4Sk6RzRU80kjdbIo1Q==}
     engines: {node: '>=12'}
@@ -7004,11 +6748,6 @@ packages:
     peerDependencies:
       eslint: '>=5.0.0'
 
-  vue-router@4.3.2:
-    resolution: {integrity: sha512-hKQJ1vDAZ5LVkKEnHhmm1f9pMiWIBNGF5AwU67PdH7TyXCj/a4hTccuUuYCAMgJK6rO/NVYtQIEN3yL8CECa7Q==}
-    peerDependencies:
-      vue: ^3.2.0
-
   vue-router@4.3.3:
     resolution: {integrity: sha512-8Q+u+WP4N2SXY38FDcF2H1dUEbYVHVPtPCPZj/GTZx8RCbiB8AtJP9+YIxn4Vs0svMTNQcLIzka4GH7Utkx9xQ==}
     peerDependencies:
@@ -7483,10 +7222,6 @@ snapshots:
       '@babel/template': 7.24.7
       '@babel/types': 7.24.7
 
-  '@babel/helper-hoist-variables@7.24.6':
-    dependencies:
-      '@babel/types': 7.24.6
-
   '@babel/helper-hoist-variables@7.24.7':
     dependencies:
       '@babel/types': 7.24.7
@@ -9314,8 +9049,6 @@ snapshots:
       '@vue/compiler-dom': 3.4.29
       '@vue/shared': 3.4.29
 
-  '@vue/devtools-api@6.6.1': {}
-
   '@vue/devtools-api@6.6.3': {}
 
   '@vue/devtools-api@7.3.2':
@@ -9488,15 +9221,6 @@ snapshots:
       - '@vue/composition-api'
       - vue
 
-  '@vueuse/core@8.9.4(vue@3.4.27(typescript@4.9.5))':
-    dependencies:
-      '@types/web-bluetooth': 0.0.14
-      '@vueuse/metadata': 8.9.4
-      '@vueuse/shared': 8.9.4(vue@3.4.27(typescript@4.9.5))
-      vue-demi: 0.14.7(vue@3.4.27(typescript@4.9.5))
-    optionalDependencies:
-      vue: 3.4.27(typescript@4.9.5)
-
   '@vueuse/core@8.9.4(vue@3.4.29(typescript@4.9.5))':
     dependencies:
       '@types/web-bluetooth': 0.0.14
@@ -9529,12 +9253,6 @@ snapshots:
       - '@vue/composition-api'
       - vue
 
-  '@vueuse/shared@8.9.4(vue@3.4.27(typescript@4.9.5))':
-    dependencies:
-      vue-demi: 0.14.7(vue@3.4.27(typescript@4.9.5))
-    optionalDependencies:
-      vue: 3.4.27(typescript@4.9.5)
-
   '@vueuse/shared@8.9.4(vue@3.4.29(typescript@4.9.5))':
     dependencies:
       vue-demi: 0.14.8(vue@3.4.29(typescript@4.9.5))
@@ -10817,8 +10535,6 @@ snapshots:
     dependencies:
       dequal: 2.0.3
 
-  devui-theme@0.0.1: {}
-
   didyoumean@1.2.2: {}
 
   diff-sequences@26.6.2: {}
@@ -14964,10 +14680,6 @@ snapshots:
 
   vue-component-type-helpers@2.0.21: {}
 
-  vue-demi@0.14.7(vue@3.4.27(typescript@4.9.5)):
-    dependencies:
-      vue: 3.4.27(typescript@4.9.5)
-
   vue-demi@0.14.8(vue@3.4.29(typescript@4.9.5)):
     dependencies:
       vue: 3.4.29(typescript@4.9.5)
@@ -14985,11 +14697,6 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  vue-router@4.3.2(vue@3.4.27(typescript@4.9.5)):
-    dependencies:
-      '@vue/devtools-api': 6.6.1
-      vue: 3.4.27(typescript@4.9.5)
-
   vue-router@4.3.3(vue@3.4.29(typescript@4.9.5)):
     dependencies:
       '@vue/devtools-api': 6.6.3

From ec6654f944486f0fcfa27d26d07c17722b38c213 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Thu, 27 Jun 2024 20:16:02 +0800
Subject: [PATCH 18/30] fix(active): fix errors in active bars

- Add checks before activate active bars in the code
---
 .../devui-theme/composables/activeBar.ts      | 31 +++++++++----------
 1 file changed, 15 insertions(+), 16 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts b/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
index 2064e378dc..95ad9fec90 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
@@ -47,22 +47,21 @@ export function useActiveSidebarLinks(container: Ref<HTMLElement>, marker: Ref<H
   let prevActiveLink: HTMLAnchorElement | null = null;
 
   function activateLink(hash: string) {
-    deactiveLink(prevActiveLink);
+    prevActiveLink && deactiveLink(prevActiveLink);
 
-    // const activeLink = (prevActiveLink =
-    //   hash == null
-    //     ? null
-    //     : (container.value.querySelector(
-    //         `.devui-item a[href="${decodeURIComponent(hash)}"]`
-    //       ) as HTMLAnchorElement))
-    // if (activeLink) {
-    //   activeLink.classList.add('active')
-    //   marker.value.style.opacity = '1'
-    //   marker.value.style.top = `${activeLink.offsetTop}px`
-    // } else {
-    //   marker.value.style.opacity = '0'
-    //   marker.value.style.top = '33px'
-    // }
+    const activeLink = (prevActiveLink =
+      hash == null
+        ? null
+        : container.value && (container.value.querySelector(`.devui-item a[href="${decodeURIComponent(hash)}"]`) as HTMLAnchorElement));
+    if (marker.value)
+      if (activeLink) {
+        activeLink.classList.add('active');
+        marker.value.style.opacity = '1';
+        marker.value.style.top = `${activeLink.offsetTop}px`;
+      } else {
+        marker.value.style.opacity = '0';
+        marker.value.style.top = '33px';
+      }
   }
 
   function deactiveLink(link: HTMLElement) {
@@ -96,7 +95,7 @@ function getPageOffset() {
 function getAnchorTop(anchor: HTMLAnchorElement) {
   const pageOffset = getPageOffset();
   try {
-    return anchor.parentElement.offsetTop - pageOffset - 15;
+    return anchor.parentElement?.offsetTop ? anchor.parentElement.offsetTop - pageOffset - 15 : 0;
   } catch (e) {
     return 0;
   }

From bdc8ceefce141dee8cffdd79e81a104831559cf7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Thu, 27 Jun 2024 20:26:22 +0800
Subject: [PATCH 19/30] chore(vitepress): allow localhost dead links

---
 packages/devui-vue/docs/.vitepress/config.mts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/devui-vue/docs/.vitepress/config.mts b/packages/devui-vue/docs/.vitepress/config.mts
index 42a95bfe8a..3ba9db4f89 100644
--- a/packages/devui-vue/docs/.vitepress/config.mts
+++ b/packages/devui-vue/docs/.vitepress/config.mts
@@ -13,7 +13,7 @@ export default defineConfig({
   markdown: {
     config: (md) => {
       md.use(demoblockPlugin as any);
-    }
+    },
   },
   vite: {
     plugins: [demoblockVitePlugin() as any],
@@ -51,4 +51,6 @@ export default defineConfig({
       copyright: 'Copyright © 2021-present DevCloudFE',
     },
   },
+
+  ignoreDeadLinks: 'localhostLinks',
 });

From c22fdedd94cca2527c6a79a3a9ec04ef5a283eb0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sun, 30 Jun 2024 17:22:18 +0800
Subject: [PATCH 20/30] fix(toc): fix headers is empty in toc

- Set `headers: true` in markdown config
- Refactor `useToc` to fit new apis

Related Issue: #1879
---
 packages/devui-vue/docs/.vitepress/config.mts |  1 +
 .../devui-theme/composables/activeBar.ts      |  4 +-
 .../devui-theme/composables/useToc.ts         | 76 +++++++------------
 3 files changed, 31 insertions(+), 50 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/config.mts b/packages/devui-vue/docs/.vitepress/config.mts
index 3ba9db4f89..89bddc7500 100644
--- a/packages/devui-vue/docs/.vitepress/config.mts
+++ b/packages/devui-vue/docs/.vitepress/config.mts
@@ -11,6 +11,7 @@ export default defineConfig({
 
   head,
   markdown: {
+    headers: true,
     config: (md) => {
       md.use(demoblockPlugin as any);
     },
diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts b/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
index 95ad9fec90..6831bf4e0c 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
@@ -47,7 +47,7 @@ export function useActiveSidebarLinks(container: Ref<HTMLElement>, marker: Ref<H
   let prevActiveLink: HTMLAnchorElement | null = null;
 
   function activateLink(hash: string) {
-    prevActiveLink && deactiveLink(prevActiveLink);
+    prevActiveLink && deactivateLink(prevActiveLink);
 
     const activeLink = (prevActiveLink =
       hash == null
@@ -64,7 +64,7 @@ export function useActiveSidebarLinks(container: Ref<HTMLElement>, marker: Ref<H
       }
   }
 
-  function deactiveLink(link: HTMLElement) {
+  function deactivateLink(link: HTMLElement) {
     link && link.classList.remove('active');
   }
 
diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/composables/useToc.ts b/packages/devui-vue/docs/.vitepress/devui-theme/composables/useToc.ts
index 2bee44aeee..9f7da10e12 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/composables/useToc.ts
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/composables/useToc.ts
@@ -1,59 +1,39 @@
-import { computed } from 'vue'
-import { useData } from 'vitepress'
-import { joinUrl } from '../utils'
+import { computed } from 'vue';
+import { useData } from 'vitepress';
 
-import type { PageData } from 'vitepress'
+import type { PageData, Header } from 'vitepress';
 
-type EnhanceArrayElement<T, P> = T extends Array<infer U> ? (U & P)[] : never
+type EnhanceArrayElement<T, P> = T extends Array<infer U> ? (U & P)[] : never;
 
 type Headers = EnhanceArrayElement<
   PageData['headers'],
   {
-    children?: Headers
+    children?: Headers;
   }
->
+>;
 
 export const useToc = () => {
-  const { page } = useData()
-
-  return computed(() => resolveHeaders(page.value.headers))
-}
-
-export const resolveLink = (base: string, path: string) => {
-  if (path === undefined) {
-    return path
-  }
-  // keep relative hash to the same page
-  if (path.startsWith('#')) {
-    return path
-  }
-  return joinUrl(base, path)
-}
-
-export const resolveHeaders = (headers: PageData['headers']) => {
-  if (!headers) return;
-
-  return mapHeaders(groupHeaders(headers))
-}
-
-export function groupHeaders(headers: PageData['headers']) {
-  headers = headers.map((h) => Object.assign({}, h))
-  let lastH2
-
-  headers.forEach((h) => {
-    if (h.level === 3) {
-      lastH2 = h
-    } else if (lastH2) {
-      ;(lastH2.children || (lastH2.children = [])).push(h)
-    }
-  })
-  return headers.filter((h) => h.level === 3)
-}
-
-export function mapHeaders(headers: Headers) {
-  return headers.map((header) => ({
+  const { page } = useData();
+
+  return computed(() => resolveHeaders(page.value.headers));
+};
+
+export const resolveHeaders = (_headers: PageData['headers']) => {
+  if (!_headers) return;
+
+  let headers = Array<Header>();
+  _headers.forEach((h: Header) => {
+    console.log(h, h.level);
+    if (h.level === 2) {
+      headers.push(h);
+      h.children.forEach((h: Header) => {
+        if (h.level === 3) headers.push(h);
+      });
+    } else if (h.level === 3) headers.push(h);
+  });
+  return headers.map((header: Header) => ({
     text: header.title,
     link: `#${header.slug}`,
-    children: header.children ? mapHeaders(header.children) : undefined,
-  }))
-}
+    children: undefined,
+  }));
+};

From 8aee49ac97cbc176c83fc348ade7b832bf68e76b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sun, 30 Jun 2024 18:07:22 +0800
Subject: [PATCH 21/30] chore: remove debug log

---
 .../devui-vue/docs/.vitepress/devui-theme/composables/useToc.ts  | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/composables/useToc.ts b/packages/devui-vue/docs/.vitepress/devui-theme/composables/useToc.ts
index 9f7da10e12..a8e47555e1 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/composables/useToc.ts
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/composables/useToc.ts
@@ -23,7 +23,6 @@ export const resolveHeaders = (_headers: PageData['headers']) => {
 
   let headers = Array<Header>();
   _headers.forEach((h: Header) => {
-    console.log(h, h.level);
     if (h.level === 2) {
       headers.push(h);
       h.children.forEach((h: Header) => {

From 59d55a4b8fba2a0e7bdec085015680f11ca7f138 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sat, 6 Jul 2024 19:18:58 +0800
Subject: [PATCH 22/30] fix(esm): fix lodash failed to load

- Rename `lodash` to `lodash-es`, `lodash` is a CommonJS module, which means it cannot be used in an ES6 module.
---
 packages/devui-vue/devui/button/src/use-button.ts              | 2 +-
 packages/devui-vue/devui/cascader/hooks/use-cascader-item.ts   | 2 +-
 packages/devui-vue/devui/cascader/hooks/use-cascader.ts        | 2 +-
 packages/devui-vue/devui/cascader/hooks/use-filter.ts          | 2 +-
 packages/devui-vue/devui/cascader/src/cascader.tsx             | 2 +-
 .../category-search/src/composables/use-category-search.ts     | 2 +-
 .../devui/code-editor/src/composables/use-code-editor.ts       | 2 +-
 packages/devui-vue/devui/color-picker/src/color-picker.tsx     | 2 +-
 .../src/components/color-history/color-history.tsx             | 2 +-
 .../devui/data-grid/src/composables/use-data-grid-scroll.ts    | 2 +-
 .../devui/data-grid/src/composables/use-data-grid-tree.ts      | 2 +-
 .../devui/data-grid/src/composables/use-overflow-tooltip.ts    | 2 +-
 packages/devui-vue/devui/data-grid/src/utils.ts                | 2 +-
 .../date-picker-pro/src/composables/use-calendar-panel.ts      | 2 +-
 .../src/composables/use-month-calendar-panel.ts                | 2 +-
 .../date-picker-pro/src/composables/use-year-calendar-panel.ts | 2 +-
 .../devui/editable-select/src/components/dropdown/dropdown.tsx | 2 +-
 .../devui/editable-select/src/composables/use-input-event.ts   | 2 +-
 .../devui/editable-select/src/composables/use-select.ts        | 2 +-
 .../devui-vue/devui/editor-md/src/composables/use-editor-md.ts | 3 +--
 packages/devui-vue/devui/editor-md/src/plugins/checkbox.ts     | 2 +-
 packages/devui-vue/devui/editor-md/src/plugins/toc.ts          | 2 +-
 .../devui/form/src/components/form-item/use-form-item.ts       | 2 +-
 .../devui/form/src/composables/use-form-validation.ts          | 2 +-
 packages/devui-vue/devui/git-graph/src/git-graph-class.ts      | 2 +-
 packages/devui-vue/devui/mention/src/mention.tsx               | 2 +-
 packages/devui-vue/devui/popover/src/use-popover.ts            | 2 +-
 .../devui/quadrant-diagram/src/components/axis/index.tsx       | 2 +-
 .../devui/search/src/composables/use-search-keydown.ts         | 2 +-
 .../devui/select/src/composables/use-select-content.ts         | 2 +-
 packages/devui-vue/devui/select/src/use-select.ts              | 2 +-
 .../devui/textarea/src/composables/use-textarea-autosize.ts    | 2 +-
 packages/devui-vue/devui/textarea/src/utils.ts                 | 2 +-
 packages/devui-vue/devui/tooltip/src/use-tooltip.ts            | 2 +-
 packages/devui-vue/devui/tree/src/composables/use-dragdrop.ts  | 2 +-
 .../devui-vue/devui/tree/src/composables/use-search-filter.ts  | 2 +-
 .../docs/.vitepress/devui-theme/components/BackToTop.vue       | 2 +-
 packages/devui-vue/docs/components/overview/index.md           | 2 +-
 38 files changed, 38 insertions(+), 39 deletions(-)

diff --git a/packages/devui-vue/devui/button/src/use-button.ts b/packages/devui-vue/devui/button/src/use-button.ts
index e3d53c1dc7..b3066eb127 100644
--- a/packages/devui-vue/devui/button/src/use-button.ts
+++ b/packages/devui-vue/devui/button/src/use-button.ts
@@ -2,7 +2,7 @@ import { computed, inject } from 'vue';
 import type { SetupContext } from 'vue';
 import { ButtonProps, UseButtonReturnType, buttonGroupInjectionKey } from './button-types';
 import { useNamespace } from '../../shared/hooks/use-namespace';
-import { isString } from 'lodash';
+import { isString } from 'lodash-es';
 
 export default function useButton(props: ButtonProps, ctx: SetupContext): UseButtonReturnType {
   const ns = useNamespace('button');
diff --git a/packages/devui-vue/devui/cascader/hooks/use-cascader-item.ts b/packages/devui-vue/devui/cascader/hooks/use-cascader-item.ts
index 199efa45ba..340bd1487a 100644
--- a/packages/devui-vue/devui/cascader/hooks/use-cascader-item.ts
+++ b/packages/devui-vue/devui/cascader/hooks/use-cascader-item.ts
@@ -1,7 +1,7 @@
 /**
  * 处理cascader-item中需要的参数
  */
-import { cloneDeep } from 'lodash';
+import { cloneDeep } from 'lodash-es';
 import { ref, reactive, Ref } from 'vue';
 import { CascaderProps, UseCascaderItemCallback, CascaderItem } from '../src/cascader-types';
 
diff --git a/packages/devui-vue/devui/cascader/hooks/use-cascader.ts b/packages/devui-vue/devui/cascader/hooks/use-cascader.ts
index c689daa6eb..4fcc4d8984 100644
--- a/packages/devui-vue/devui/cascader/hooks/use-cascader.ts
+++ b/packages/devui-vue/devui/cascader/hooks/use-cascader.ts
@@ -1,5 +1,5 @@
 import { ref, SetupContext, toRef, reactive, Ref, watch, onMounted } from 'vue';
-import { cloneDeep } from 'lodash';
+import { cloneDeep } from 'lodash-es';
 import { initActiveIndexs, initSingleIptValue } from './use-cascader-single';
 import { initMultipleCascaderItem, initTagList, getMultiModelValues } from './use-cascader-multiple';
 import type { CascaderItem, CascaderValueType, CascaderProps, UseCascaderFn } from '../src/cascader-types';
diff --git a/packages/devui-vue/devui/cascader/hooks/use-filter.ts b/packages/devui-vue/devui/cascader/hooks/use-filter.ts
index 8c789898f4..21eede8ff0 100644
--- a/packages/devui-vue/devui/cascader/hooks/use-filter.ts
+++ b/packages/devui-vue/devui/cascader/hooks/use-filter.ts
@@ -1,4 +1,4 @@
-import { debounce, cloneDeep } from 'lodash';
+import { debounce, cloneDeep } from 'lodash-es';
 import { ref, SetupContext, UnwrapRef, Ref, watch } from 'vue';
 import { initActiveIndexs } from './use-cascader-single';
 import {
diff --git a/packages/devui-vue/devui/cascader/src/cascader.tsx b/packages/devui-vue/devui/cascader/src/cascader.tsx
index 9992a17029..0004d007ff 100644
--- a/packages/devui-vue/devui/cascader/src/cascader.tsx
+++ b/packages/devui-vue/devui/cascader/src/cascader.tsx
@@ -1,5 +1,5 @@
 import { defineComponent, Transition, SetupContext, provide, Teleport, ref, computed } from 'vue';
-import { cloneDeep } from 'lodash';
+import { cloneDeep } from 'lodash-es';
 import { useNamespace } from '../../shared/hooks/use-namespace';
 import DCascaderList from '../components/cascader-list';
 import DMultipleBox from '../components/cascader-multiple/index';
diff --git a/packages/devui-vue/devui/category-search/src/composables/use-category-search.ts b/packages/devui-vue/devui/category-search/src/composables/use-category-search.ts
index 52431aca34..0577414f55 100644
--- a/packages/devui-vue/devui/category-search/src/composables/use-category-search.ts
+++ b/packages/devui-vue/devui/category-search/src/composables/use-category-search.ts
@@ -1,6 +1,6 @@
 import { ref, computed, toRefs, provide, watch, onMounted, reactive } from 'vue';
 import type { Ref, SetupContext } from 'vue';
-import { mergeWith, cloneDeep, merge } from 'lodash';
+import { mergeWith, cloneDeep, merge } from 'lodash-es';
 import RadioMenu from '../components/radio-menu';
 import CheckboxMenu from '../components/checkbox-menu';
 import LabelMenu from '../components/label-menu';
diff --git a/packages/devui-vue/devui/code-editor/src/composables/use-code-editor.ts b/packages/devui-vue/devui/code-editor/src/composables/use-code-editor.ts
index 977cb57ae2..568a9682b4 100644
--- a/packages/devui-vue/devui/code-editor/src/composables/use-code-editor.ts
+++ b/packages/devui-vue/devui/code-editor/src/composables/use-code-editor.ts
@@ -1,5 +1,5 @@
 import { inBrowser } from '../../../shared/utils/common-var';
-import { throttle } from 'lodash';
+import { throttle } from 'lodash-es';
 import { onBeforeMount, onMounted, ref, SetupContext, toRefs, nextTick, watch } from 'vue';
 import { CodeEditorProps, Comment, Decoration, LayoutInfo, PositionInfo } from '../code-editor-types';
 
diff --git a/packages/devui-vue/devui/color-picker/src/color-picker.tsx b/packages/devui-vue/devui/color-picker/src/color-picker.tsx
index 4bf9de0d99..4bce7cfcb1 100644
--- a/packages/devui-vue/devui/color-picker/src/color-picker.tsx
+++ b/packages/devui-vue/devui/color-picker/src/color-picker.tsx
@@ -1,7 +1,7 @@
 import { defineComponent, ref, computed, onMounted, watch, nextTick, provide, unref, readonly, Transition } from 'vue';
 import type { StyleValue, Ref } from 'vue';
 import { computePosition, flip } from '@floating-ui/dom';
-import { throttle } from 'lodash';
+import { throttle } from 'lodash-es';
 import { useReactive, colorPickerResize, isExhibitionColorPicker, changeColorValue } from './utils/composable';
 import { colorPickerProps, ColorPickerProps } from './color-picker-types';
 import colorPanel from './components/color-picker-panel/color-picker-panel';
diff --git a/packages/devui-vue/devui/color-picker/src/components/color-history/color-history.tsx b/packages/devui-vue/devui/color-picker/src/components/color-history/color-history.tsx
index c76eb810f8..ffe92c610d 100644
--- a/packages/devui-vue/devui/color-picker/src/components/color-history/color-history.tsx
+++ b/packages/devui-vue/devui/color-picker/src/components/color-history/color-history.tsx
@@ -4,7 +4,7 @@ import { Icon } from '../../../../icon';
 import './color-history.scss';
 import { fromHexa } from '../../utils/color-utils';
 import { ProvideColorOptions, ColorPickerColor } from '../../utils/color-utils-types';
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 
 const STORAGE_KEY = 'STORAGE_COLOR_PICKER_HISTORY_KEY';
 const MAX_HISTORY_COUNT = 8;
diff --git a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-scroll.ts b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-scroll.ts
index 7d1c3588b8..c5f31e174d 100644
--- a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-scroll.ts
+++ b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-scroll.ts
@@ -1,6 +1,6 @@
 import { ref, onMounted, inject } from 'vue';
 import type { Ref } from 'vue';
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 import { DataGridInjectionKey } from '../data-grid-types';
 import type { InnerColumnConfig, InnerRowData, DataGridContext, ScrollYParams, ScrollXParams } from '../data-grid-types';
 import { getXStartOrEndIndex, getYStartIndex } from '../utils';
diff --git a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-tree.ts b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-tree.ts
index bdd124fa88..01b6efd348 100644
--- a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-tree.ts
+++ b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-tree.ts
@@ -1,6 +1,6 @@
 import { ref, toRefs } from 'vue';
 import type { SetupContext } from 'vue';
-import { isFunction } from 'lodash';
+import { isFunction } from 'lodash-es';
 import type { DataGridProps, InnerRowData, RowData, IExpandLoadMoreResult } from '../data-grid-types';
 import { generateInnerData } from '../utils';
 
diff --git a/packages/devui-vue/devui/data-grid/src/composables/use-overflow-tooltip.ts b/packages/devui-vue/devui/data-grid/src/composables/use-overflow-tooltip.ts
index b61198f057..8a08b3f96d 100644
--- a/packages/devui-vue/devui/data-grid/src/composables/use-overflow-tooltip.ts
+++ b/packages/devui-vue/devui/data-grid/src/composables/use-overflow-tooltip.ts
@@ -1,5 +1,5 @@
 import { ref } from 'vue';
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 import type { Placement } from '../../../overlay';
 import type { InnerColumnConfig } from '../data-grid-types';
 
diff --git a/packages/devui-vue/devui/data-grid/src/utils.ts b/packages/devui-vue/devui/data-grid/src/utils.ts
index e7947f7f77..ba94a13dc3 100644
--- a/packages/devui-vue/devui/data-grid/src/utils.ts
+++ b/packages/devui-vue/devui/data-grid/src/utils.ts
@@ -1,6 +1,6 @@
 import { v4 as uuidv4 } from 'uuid';
 import type { Ref } from 'vue';
-import { isFunction } from 'lodash';
+import { isFunction } from 'lodash-es';
 import type { RowData, InnerRowData, RowKey, InnerColumnConfig, ColumnConfig } from './data-grid-types';
 import { ColumnMinWidth } from './const';
 
diff --git a/packages/devui-vue/devui/date-picker-pro/src/composables/use-calendar-panel.ts b/packages/devui-vue/devui/date-picker-pro/src/composables/use-calendar-panel.ts
index a68bd21e4e..72dac6bbd3 100644
--- a/packages/devui-vue/devui/date-picker-pro/src/composables/use-calendar-panel.ts
+++ b/packages/devui-vue/devui/date-picker-pro/src/composables/use-calendar-panel.ts
@@ -4,7 +4,7 @@ import { DAY_DURATION, calendarItemHeight } from '../const';
 import { CalendarDateItem, YearAndMonthItem, UseCalendarPanelReturnType, DatePickerProPanelProps } from '../date-picker-pro-types';
 import dayjs from 'dayjs';
 import type { Dayjs } from 'dayjs';
-import { throttle } from 'lodash';
+import { throttle } from 'lodash-es';
 import useCalendarSelected from './use-calendar-selected';
 
 export default function useCalendarPanel(props: DatePickerProPanelProps, ctx: SetupContext): UseCalendarPanelReturnType {
diff --git a/packages/devui-vue/devui/date-picker-pro/src/composables/use-month-calendar-panel.ts b/packages/devui-vue/devui/date-picker-pro/src/composables/use-month-calendar-panel.ts
index dfe333200c..b8d08d5c27 100644
--- a/packages/devui-vue/devui/date-picker-pro/src/composables/use-month-calendar-panel.ts
+++ b/packages/devui-vue/devui/date-picker-pro/src/composables/use-month-calendar-panel.ts
@@ -3,7 +3,7 @@ import type { SetupContext } from 'vue';
 import { useNamespace } from '../../../shared/hooks/use-namespace';
 import { monthCalendarItemHeight } from '../const';
 import { DatePickerProPanelProps, YearAndMonthItem, UseMonthCalendarPanelReturnType } from '../date-picker-pro-types';
-import { throttle } from 'lodash';
+import { throttle } from 'lodash-es';
 import dayjs from 'dayjs';
 import type { Dayjs } from 'dayjs';
 import useCalendarSelected from './use-calendar-selected';
diff --git a/packages/devui-vue/devui/date-picker-pro/src/composables/use-year-calendar-panel.ts b/packages/devui-vue/devui/date-picker-pro/src/composables/use-year-calendar-panel.ts
index e86a94ac0f..c5f226586d 100644
--- a/packages/devui-vue/devui/date-picker-pro/src/composables/use-year-calendar-panel.ts
+++ b/packages/devui-vue/devui/date-picker-pro/src/composables/use-year-calendar-panel.ts
@@ -1,6 +1,6 @@
 import { ref, onBeforeMount, nextTick, watch } from 'vue';
 import type { SetupContext } from 'vue';
-import { chunk } from 'lodash';
+import { chunk } from 'lodash-es';
 import { useNamespace } from '../../../shared/hooks/use-namespace';
 import { DatePickerProPanelProps, UseYearCalendarPanelReturnType } from '../date-picker-pro-types';
 import dayjs from 'dayjs';
diff --git a/packages/devui-vue/devui/editable-select/src/components/dropdown/dropdown.tsx b/packages/devui-vue/devui/editable-select/src/components/dropdown/dropdown.tsx
index df31fca66e..2b1d757c87 100644
--- a/packages/devui-vue/devui/editable-select/src/components/dropdown/dropdown.tsx
+++ b/packages/devui-vue/devui/editable-select/src/components/dropdown/dropdown.tsx
@@ -4,7 +4,7 @@ import { EditableSelectContext, Option as O, SELECT_KEY } from '../../editable-s
 import Option from '../option/option';
 import Loading from '../../../../loading/src/loading-directive';
 import { useNamespace } from '../../../../shared/hooks/use-namespace';
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 
 export default defineComponent({
   name: 'DEditableSelectDropdown',
diff --git a/packages/devui-vue/devui/editable-select/src/composables/use-input-event.ts b/packages/devui-vue/devui/editable-select/src/composables/use-input-event.ts
index 9e80e4f056..04d3442358 100644
--- a/packages/devui-vue/devui/editable-select/src/composables/use-input-event.ts
+++ b/packages/devui-vue/devui/editable-select/src/composables/use-input-event.ts
@@ -1,5 +1,5 @@
 import { computed, Ref, SetupContext } from 'vue';
-import { debounce, isFunction } from 'lodash';
+import { debounce, isFunction } from 'lodash-es';
 import { EditableSelectProps } from '../editable-select-types';
 import { States } from './use-select';
 
diff --git a/packages/devui-vue/devui/editable-select/src/composables/use-select.ts b/packages/devui-vue/devui/editable-select/src/composables/use-select.ts
index 6b7f9969da..c64b61e3f0 100644
--- a/packages/devui-vue/devui/editable-select/src/composables/use-select.ts
+++ b/packages/devui-vue/devui/editable-select/src/composables/use-select.ts
@@ -1,7 +1,7 @@
 import { computed, ComputedRef, getCurrentInstance, nextTick, onMounted, reactive, ref, Ref, SetupContext, watch } from 'vue';
 import { EditableSelectProps, Option, Options } from '../editable-select-types';
 import { createI18nTranslate } from '../../../locale/create';
-import { isFunction, isNil } from 'lodash';
+import { isFunction, isNil } from 'lodash-es';
 
 export interface UseSelectStatesReturnType {
   hoveringIndex: number;
diff --git a/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts b/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts
index 65d0c0a00e..a7ecd87342 100644
--- a/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts
+++ b/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts
@@ -1,11 +1,10 @@
-import cloneDeep from 'lodash/cloneDeep';
+import { throttle, cloneDeep }from 'lodash-es';
 import { computed, nextTick, onMounted, reactive, Ref, ref, SetupContext, toRefs, watch, onBeforeUnmount } from 'vue';
 import { debounce } from '../../../shared/utils';
 import { EditorMdProps, Mode } from '../editor-md-types';
 import { DEFAULT_TOOLBARS } from '../toolbar-config';
 import { parseHTMLStringToDomList } from '../utils';
 import { refreshEditorCursor, _enforceMaxLength } from './helper';
-import { throttle } from 'lodash';
 
 export function useEditorMd(props: EditorMdProps, ctx: SetupContext) {
   const {
diff --git a/packages/devui-vue/devui/editor-md/src/plugins/checkbox.ts b/packages/devui-vue/devui/editor-md/src/plugins/checkbox.ts
index 83b62c9207..018c556845 100644
--- a/packages/devui-vue/devui/editor-md/src/plugins/checkbox.ts
+++ b/packages/devui-vue/devui/editor-md/src/plugins/checkbox.ts
@@ -1,4 +1,4 @@
-import { extend } from 'lodash';
+import { extend } from 'lodash-es';
 
 const checkboxReplace = function (md: any, options: any) {
   let lastId: number;
diff --git a/packages/devui-vue/devui/editor-md/src/plugins/toc.ts b/packages/devui-vue/devui/editor-md/src/plugins/toc.ts
index 19a8cbdb3b..d9da947334 100644
--- a/packages/devui-vue/devui/editor-md/src/plugins/toc.ts
+++ b/packages/devui-vue/devui/editor-md/src/plugins/toc.ts
@@ -1,4 +1,4 @@
-import cloneDeep from 'lodash/cloneDeep';
+import { cloneDeep }from 'lodash-es';
 import Token from 'markdown-it/lib/token';
 
 const TOC = '[toc]';
diff --git a/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts b/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts
index 69403c4424..5bd51a2096 100644
--- a/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts
+++ b/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts
@@ -1,5 +1,5 @@
 import { computed, inject, nextTick, onMounted, ref } from 'vue';
-import { castArray, get, isFunction, clone, isEqual, set } from 'lodash';
+import { castArray, get, isFunction, clone, isEqual, set } from 'lodash-es';
 import Schema from 'async-validator';
 import type { ComputedRef, Ref } from 'vue';
 import type { RuleItem } from 'async-validator';
diff --git a/packages/devui-vue/devui/form/src/composables/use-form-validation.ts b/packages/devui-vue/devui/form/src/composables/use-form-validation.ts
index 3876f7e6a5..d3e4178b94 100644
--- a/packages/devui-vue/devui/form/src/composables/use-form-validation.ts
+++ b/packages/devui-vue/devui/form/src/composables/use-form-validation.ts
@@ -1,4 +1,4 @@
-import { castArray } from 'lodash';
+import { castArray } from 'lodash-es';
 import type { ValidateFieldsError } from 'async-validator';
 import { UseFormValidation } from '../form-types';
 import { FormItemContext, FormValidateCallback, FormValidateResult } from '../components/form-item/form-item-types';
diff --git a/packages/devui-vue/devui/git-graph/src/git-graph-class.ts b/packages/devui-vue/devui/git-graph/src/git-graph-class.ts
index c620811109..1506b6209a 100644
--- a/packages/devui-vue/devui/git-graph/src/git-graph-class.ts
+++ b/packages/devui-vue/devui/git-graph/src/git-graph-class.ts
@@ -1,4 +1,4 @@
-import { cloneDeep } from "lodash";
+import { cloneDeep } from "lodash-es";
 import { CommitInfo, GitGraphData } from "./git-graph-types";
 
 export class GitGraph {
diff --git a/packages/devui-vue/devui/mention/src/mention.tsx b/packages/devui-vue/devui/mention/src/mention.tsx
index 9b96511ca3..de5aa717a2 100644
--- a/packages/devui-vue/devui/mention/src/mention.tsx
+++ b/packages/devui-vue/devui/mention/src/mention.tsx
@@ -4,7 +4,7 @@ import DTextarea from '../../textarea/src/textarea';
 import DIcon from '../../icon/src/icon';
 import './mention.scss';
 import { useNamespace } from '../../shared/hooks/use-namespace';
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 
 export default defineComponent({
   name: 'DMention',
diff --git a/packages/devui-vue/devui/popover/src/use-popover.ts b/packages/devui-vue/devui/popover/src/use-popover.ts
index 16face2c76..9a8d0f47c8 100644
--- a/packages/devui-vue/devui/popover/src/use-popover.ts
+++ b/packages/devui-vue/devui/popover/src/use-popover.ts
@@ -1,6 +1,6 @@
 import { toRefs, ref, computed, watch, onUnmounted, onMounted } from 'vue';
 import type { Ref, ComputedRef } from 'vue';
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 import { PopoverProps, UsePopoverEvent } from './popover-types';
 
 const TransformOriginMap: Record<string, string> = {
diff --git a/packages/devui-vue/devui/quadrant-diagram/src/components/axis/index.tsx b/packages/devui-vue/devui/quadrant-diagram/src/components/axis/index.tsx
index 7a686ba11c..d580518a2a 100644
--- a/packages/devui-vue/devui/quadrant-diagram/src/components/axis/index.tsx
+++ b/packages/devui-vue/devui/quadrant-diagram/src/components/axis/index.tsx
@@ -2,7 +2,7 @@ import { defineComponent, toRefs, onMounted, reactive, ref, watch } from 'vue';
 import { IAxisConfigs, IViewConfigs } from '../../../type';
 import { AXIS_TITLE_SPACE } from '../../../config';
 import { quadrantDiagramAxisProps, QuadrantDiagramAxisProps } from './types';
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 
 import './index.scss';
 
diff --git a/packages/devui-vue/devui/search/src/composables/use-search-keydown.ts b/packages/devui-vue/devui/search/src/composables/use-search-keydown.ts
index 220f65693e..684350795d 100644
--- a/packages/devui-vue/devui/search/src/composables/use-search-keydown.ts
+++ b/packages/devui-vue/devui/search/src/composables/use-search-keydown.ts
@@ -3,7 +3,7 @@
  */
 import { SetupContext, Ref } from 'vue';
 import { KeydownReturnTypes, SearchProps } from '../search-types';
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 
 type EmitProps = 'update:modelValue' | 'search';
 
diff --git a/packages/devui-vue/devui/select/src/composables/use-select-content.ts b/packages/devui-vue/devui/select/src/composables/use-select-content.ts
index 7936c16c55..03df4044e5 100644
--- a/packages/devui-vue/devui/select/src/composables/use-select-content.ts
+++ b/packages/devui-vue/devui/select/src/composables/use-select-content.ts
@@ -4,7 +4,7 @@ import { FORM_ITEM_TOKEN } from '../../../form';
 import { OptionObjectItem } from '../select-types';
 import { useNamespace } from '../../../shared/hooks/use-namespace';
 import { className } from '../utils';
-import { isFunction } from 'lodash';
+import { isFunction } from 'lodash-es';
 import { createI18nTranslate } from '../../../locale/create';
 
 export default function useSelectContent() {
diff --git a/packages/devui-vue/devui/select/src/use-select.ts b/packages/devui-vue/devui/select/src/use-select.ts
index b9c72aedb3..652abc6182 100644
--- a/packages/devui-vue/devui/select/src/use-select.ts
+++ b/packages/devui-vue/devui/select/src/use-select.ts
@@ -4,7 +4,7 @@ import { SelectProps, OptionObjectItem } from './select-types';
 import { className, KeyType } from './utils';
 import { useNamespace } from '../../shared/hooks/use-namespace';
 import { onClickOutside } from '@vueuse/core';
-import { isFunction, debounce } from 'lodash';
+import { isFunction, debounce } from 'lodash-es';
 import { FORM_ITEM_TOKEN, FORM_TOKEN } from '../../form';
 
 export default function useSelect(
diff --git a/packages/devui-vue/devui/textarea/src/composables/use-textarea-autosize.ts b/packages/devui-vue/devui/textarea/src/composables/use-textarea-autosize.ts
index 583a31ec46..3c39ff1e29 100644
--- a/packages/devui-vue/devui/textarea/src/composables/use-textarea-autosize.ts
+++ b/packages/devui-vue/devui/textarea/src/composables/use-textarea-autosize.ts
@@ -1,7 +1,7 @@
 import { computed, ShallowRef, shallowRef } from 'vue';
 import { TextareaProps, UseTextareaAutosize } from '../textarea-types';
 import type { StyleValue } from 'vue';
-import { isObject } from 'lodash';
+import { isObject } from 'lodash-es';
 import { computeTextareaHeight } from '../utils';
 
 export function useTextareaAutosize(props: TextareaProps, textarea: ShallowRef<HTMLTextAreaElement | undefined>): UseTextareaAutosize {
diff --git a/packages/devui-vue/devui/textarea/src/utils.ts b/packages/devui-vue/devui/textarea/src/utils.ts
index 9f37e03a11..d684d39e59 100644
--- a/packages/devui-vue/devui/textarea/src/utils.ts
+++ b/packages/devui-vue/devui/textarea/src/utils.ts
@@ -1,4 +1,4 @@
-import { isNumber } from 'lodash';
+import { isNumber } from 'lodash-es';
 
 let tempTextarea: HTMLTextAreaElement | undefined = undefined;
 
diff --git a/packages/devui-vue/devui/tooltip/src/use-tooltip.ts b/packages/devui-vue/devui/tooltip/src/use-tooltip.ts
index 1b97c5d66f..d62f3e670e 100644
--- a/packages/devui-vue/devui/tooltip/src/use-tooltip.ts
+++ b/packages/devui-vue/devui/tooltip/src/use-tooltip.ts
@@ -1,6 +1,6 @@
 import { onMounted, ref, toRefs, computed, watch } from 'vue';
 import type { Ref } from 'vue';
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 import { TooltipProps, BasePlacement, UseTooltipFn } from './tooltip-types';
 
 export const transformOriginMap: Record<BasePlacement, string> = {
diff --git a/packages/devui-vue/devui/tree/src/composables/use-dragdrop.ts b/packages/devui-vue/devui/tree/src/composables/use-dragdrop.ts
index d4ff239063..22d28ef9d5 100644
--- a/packages/devui-vue/devui/tree/src/composables/use-dragdrop.ts
+++ b/packages/devui-vue/devui/tree/src/composables/use-dragdrop.ts
@@ -2,7 +2,7 @@ import { reactive, computed } from 'vue';
 import type { Ref } from 'vue';
 import type { TreeProps } from '../tree-types';
 import type { DragState, IUseDraggable, IDropNode, IInnerTreeNode, ITreeNode, IDropType } from './use-tree-types';
-import cloneDeep from 'lodash/cloneDeep';
+import { cloneDeep }from 'lodash-es';
 import { useNamespace } from '../../../shared/hooks/use-namespace';
 import { formatBasicTree } from '../utils';
 const ns = useNamespace('tree');
diff --git a/packages/devui-vue/devui/tree/src/composables/use-search-filter.ts b/packages/devui-vue/devui/tree/src/composables/use-search-filter.ts
index b835830a89..d05d867a07 100644
--- a/packages/devui-vue/devui/tree/src/composables/use-search-filter.ts
+++ b/packages/devui-vue/devui/tree/src/composables/use-search-filter.ts
@@ -1,6 +1,6 @@
 import { Ref, ref } from 'vue';
 import { IInnerTreeNode, IUseCore, IUseSearchFilter, SearchFilterOption } from './use-tree-types';
-import { trim } from 'lodash';
+import { trim } from 'lodash-es';
 export function useSearchFilter() {
   return function useSearchFilterFn(data: Ref<IInnerTreeNode[]>, core: IUseCore): IUseSearchFilter {
     const { clearNodeMap, getExpendedTree } = core;
diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/components/BackToTop.vue b/packages/devui-vue/docs/.vitepress/devui-theme/components/BackToTop.vue
index 8c200837bf..8f44932ef2 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/components/BackToTop.vue
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/components/BackToTop.vue
@@ -22,7 +22,7 @@
 </template>
 
 <script lang="ts">
-import { debounce } from 'lodash';
+import { debounce } from 'lodash-es';
 import { defineComponent, onMounted, computed, ref } from 'vue';
 export default defineComponent({
   name: 'BackToTop',
diff --git a/packages/devui-vue/docs/components/overview/index.md b/packages/devui-vue/docs/components/overview/index.md
index 72bfd738f7..cc72c977f0 100644
--- a/packages/devui-vue/docs/components/overview/index.md
+++ b/packages/devui-vue/docs/components/overview/index.md
@@ -32,7 +32,7 @@ Vue DevUI 组件库包含 77 个灵活、易用、功能强大的组件。
 </div>
 
 <script setup>
-  import { groupBy, startCase } from 'lodash';
+  import { groupBy, startCase } from 'lodash-es';
   import { componentFeatureData, STATUS_MAP, CATEGORY_MAP } from './feature-data';
   import { CONTRIBUTORS_MAP } from '../../.vitepress/devui-theme/components/PageContributorConfig';
 

From 221d02d8b6f7a60916fafb16383918166e6746ef Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sat, 6 Jul 2024 19:19:46 +0800
Subject: [PATCH 23/30] chore(git): add `.temp` in `.gitignore`

---
 packages/devui-vue/docs/.vitepress/.gitignore | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/devui-vue/docs/.vitepress/.gitignore b/packages/devui-vue/docs/.vitepress/.gitignore
index 5e46596759..e3990ffb70 100644
--- a/packages/devui-vue/docs/.vitepress/.gitignore
+++ b/packages/devui-vue/docs/.vitepress/.gitignore
@@ -1 +1,2 @@
-cache
\ No newline at end of file
+cache
+.temp
\ No newline at end of file

From dcb29d57306e809567b3830ed7f0c85ed5a440e1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sat, 6 Jul 2024 19:20:12 +0800
Subject: [PATCH 24/30] fix(cpy): add `cpy` to build in Windows

---
 packages/devui-vue/package.json | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/devui-vue/package.json b/packages/devui-vue/package.json
index 486cf69e10..f9510e5edc 100644
--- a/packages/devui-vue/package.json
+++ b/packages/devui-vue/package.json
@@ -26,7 +26,7 @@
   "scripts": {
     "dev": "pnpm run register:components && pnpm generate:theme && vitepress dev docs",
     "dev:site": "vite --port 3010",
-    "build": "pnpm run register:components && pnpm generate:theme && node --max-old-space-size=8192 node_modules/vitepress/bin/vitepress.js build docs && cp public/* docs/.vitepress/dist/assets && cp docs/assets/* docs/.vitepress/dist/assets",
+    "build": "pnpm run register:components && pnpm generate:theme && node --max-old-space-size=8192 node_modules/vitepress/bin/vitepress.js build docs && cpy public/* docs/.vitepress/dist/assets && cpy docs/assets/* docs/.vitepress/dist/assets",
     "build:lib": "pnpm predev -- -e prod && pnpm build:components && pnpm release",
     "test": "jest --config jest.config.js",
     "coverage": "jest --config jest.config.js --coverage",
@@ -105,6 +105,7 @@
     "chalk": "^4.1.2",
     "commander": "^8.3.0",
     "conventional-changelog-cli": "^2.2.2",
+    "cpy-cli": "^5.0.0",
     "devui-cli": "workspace:^",
     "escape-html": "^1.0.3",
     "fflate": "^0.7.4",

From 12c5e5ba56a52bbf3ea4080d5d7bc010681ec172 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sat, 6 Jul 2024 19:20:36 +0800
Subject: [PATCH 25/30] fix(echarts): fix echarts for `window`

---
 .../devui-vue/devui/echarts/src/echarts.tsx   | 26 ++++++++++---------
 packages/devui-vue/vite.config.ts             |  3 +++
 2 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/packages/devui-vue/devui/echarts/src/echarts.tsx b/packages/devui-vue/devui/echarts/src/echarts.tsx
index 5b2465925d..324ef66f39 100644
--- a/packages/devui-vue/devui/echarts/src/echarts.tsx
+++ b/packages/devui-vue/devui/echarts/src/echarts.tsx
@@ -1,9 +1,7 @@
-import { defineComponent, onMounted, onUnmounted, ref } from "vue";
-import { DevuiChartProps, devuiChartProps } from "./echarts-types";
-import * as echarts from 'echarts';
-import { DEVUI_ECHART_THEME } from "./echarts-theme";
-import { toRefs } from "@vueuse/core";
-
+import { defineComponent, onMounted, onUnmounted, ref } from 'vue';
+import { DevuiChartProps, devuiChartProps } from './echarts-types';
+import { DEVUI_ECHART_THEME } from './echarts-theme';
+import { toRefs } from '@vueuse/core';
 
 export default defineComponent({
   name: 'DChart',
@@ -19,6 +17,12 @@ export default defineComponent({
 
     const chartRef = ref();
 
+    // dynamic import echarts
+    let echarts: unknown;
+    if (typeof window !== 'undefined') {
+      echarts = import('echarts');
+    }
+
     const themeChange = () => {
       isDark = !!themeService?.currentTheme?.isDark;
       theme = isDark ? DEVUI_ECHART_THEME.defaultDarkTheme : DEVUI_ECHART_THEME.defaultLightTheme;
@@ -44,7 +48,7 @@ export default defineComponent({
       theme = isDark ? DEVUI_ECHART_THEME.defaultDarkTheme : DEVUI_ECHART_THEME.defaultLightTheme;
       echartInstacne = echarts.init(chartRef.value, theme);
 
-      if(themeService) {
+      if (themeService) {
         themeService.eventBus.add('themeChanged', themeChange);
       }
 
@@ -56,14 +60,12 @@ export default defineComponent({
 
     onUnmounted(() => {
       echartInstacne?.dispatchAction({
-        type: 'hideTip'
+        type: 'hideTip',
       });
 
       themeService.eventBus.remove('themeChanged', themeChange);
     });
 
-    return () => (
-      <div ref={chartRef} class="devui-charts"></div>
-    );
-  }
+    return () => <div ref={chartRef} class="devui-charts"></div>;
+  },
 });
diff --git a/packages/devui-vue/vite.config.ts b/packages/devui-vue/vite.config.ts
index b4e535fc94..ba0f3ec1ca 100644
--- a/packages/devui-vue/vite.config.ts
+++ b/packages/devui-vue/vite.config.ts
@@ -17,6 +17,9 @@ export default defineConfig({
   optimizeDeps: {
     exclude: ['lodash-es', 'mitt', 'async-validator', 'css-vars-ponyfill', 'rxjs', '@vueuse/core', '@floating-ui/dom', 'vue-router'],
   },
+  ssr: {
+    noExternal: ['echarts']
+  },
   server: {
     open: '/site.html',
     fs: {

From 166c5b2dca5adb1b65db8e76b68b8c81544f7657 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sat, 6 Jul 2024 19:21:06 +0800
Subject: [PATCH 26/30] fix(xss): fix xss unable to load

---
 .../src/composables/md-render-service.ts      | 28 ++++++++++---------
 1 file changed, 15 insertions(+), 13 deletions(-)

diff --git a/packages/devui-vue/devui/editor-md/src/composables/md-render-service.ts b/packages/devui-vue/devui/editor-md/src/composables/md-render-service.ts
index e3e3a688da..31e58de881 100644
--- a/packages/devui-vue/devui/editor-md/src/composables/md-render-service.ts
+++ b/packages/devui-vue/devui/editor-md/src/composables/md-render-service.ts
@@ -1,10 +1,12 @@
 import hljs from 'highlight.js';
 import MarkdownIt from 'markdown-it';
-import { filterXSS, getDefaultCSSWhiteList, getDefaultWhiteList, IWhiteList } from 'xss';
+import pkg from 'xss';
 import { mermaidRender, refreshMermaid } from '../plugins/mermaid';
 import tocAndAnchor from '../plugins/toc';
 import type { MdPlugin, ICustomXssRule, ICustomRenderRule } from '../editor-md-types';
 
+const { filterXSS, getDefaultWhiteList, getDefaultCSSWhiteList, IWhiteList } = pkg;
+
 export class MDRenderService {
   private xssWhiteList = getDefaultWhiteList();
   private cssWhiteList = getDefaultCSSWhiteList();
@@ -19,7 +21,7 @@ export class MDRenderService {
       }
       return '';
     },
-  }) as any;
+  });
   private baseUrl = '';
   private breaks = true;
   private renderParse: Function | undefined;
@@ -50,27 +52,27 @@ export class MDRenderService {
     this.xssWhiteList['td'] = ['style'];
   }
 
-  setBaseUrl(url: string) {
+  setBaseUrl(url: string): void {
     this.baseUrl = url;
   }
 
-  setBreaks(breaks: boolean) {
+  setBreaks(breaks: boolean): void {
     this.breaks = breaks;
   }
 
-  setRenderParse(func: Function) {
+  setRenderParse(func: Function): void {
     this.renderParse = func;
   }
 
-  getXssWhiteList() {
+  getXssWhiteList(): IWhiteList {
     return this.xssWhiteList;
   }
 
-  setXssWhiteList(list: IWhiteList) {
+  setXssWhiteList(list: IWhiteList): void {
     this.xssWhiteList = list;
   }
 
-  setCustomXssRules(rules: ICustomXssRule[]) {
+  setCustomXssRules(rules: ICustomXssRule[]): void {
     if (rules) {
       rules.forEach((rule) => {
         if (rule['value'] === null) {
@@ -82,7 +84,7 @@ export class MDRenderService {
     }
   }
 
-  setCustomRendererRules(rules: ICustomRenderRule[]) {
+  setCustomRendererRules(rules: ICustomRenderRule[]): void {
     if (rules) {
       rules.forEach((rule) => {
         this.mdt.renderer.rules[rule['key']] = rule['value'];
@@ -90,11 +92,11 @@ export class MDRenderService {
     }
   }
 
-  setOptions(options = {}) {
+  setOptions(options = {}): void {
     this.mdt.set(options);
   }
 
-  setPlugins(plugins: Array<MdPlugin>) {
+  setPlugins(plugins: Array<MdPlugin>): void {
     plugins.forEach((item) => {
       const { plugin, opts } = item;
       this.mdt.use(plugin, opts);
@@ -125,7 +127,7 @@ export class MDRenderService {
     });
   }
 
-  generateHTML(text: string) {
+  generateHTML(text: string): string {
     this.mdt.set({
       breaks: this.breaks,
     });
@@ -156,7 +158,7 @@ export class MDRenderService {
     return this.replaceInternalUrl(html);
   }
 
-  public setRules(mdRules: Record<string, any>): void {
+  public setRules(mdRules: Record<string, unknown>): void {
     if (mdRules) {
       Object.keys(mdRules).forEach((rule) => {
         this.mdt[rule].set(mdRules[rule]);

From d2bfddd3be34771ee3c0de3ba4ea004ebb95ab16 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sat, 6 Jul 2024 19:21:22 +0800
Subject: [PATCH 27/30] chore(deps): add `cpy`

---
 pnpm-lock.yaml | 138 +++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 138 insertions(+)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index be11c6455d..945d2efdc7 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -323,6 +323,9 @@ importers:
       conventional-changelog-cli:
         specifier: ^2.2.2
         version: 2.2.2
+      cpy-cli:
+        specifier: ^5.0.0
+        version: 5.0.0
       devui-cli:
         specifier: workspace:^
         version: link:../devui-cli
@@ -2318,6 +2321,10 @@ packages:
     resolution: {integrity: sha512-4I7Td01quW/RpocfNayFdFVk1qSuoh0E7JrbRJ16nH01HhKFQ88INq9Sd+nd72zqRySlr9BmDA8xlEJ6vJMrYA==}
     engines: {node: '>=8'}
 
+  aggregate-error@4.0.1:
+    resolution: {integrity: sha512-0poP0T7el6Vq3rstR8Mn4V/IQrpBLO6POkUSrN7RhyY+GF/InCFShQzsQ39T25gkHhLgSLByyAz+Kjb+c2L98w==}
+    engines: {node: '>=12'}
+
   ajv@6.12.6:
     resolution: {integrity: sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==}
 
@@ -2412,6 +2419,10 @@ packages:
     resolution: {integrity: sha512-3CYzex9M9FGQjCGMGyi6/31c8GJbgb0qGyrx5HWxPd0aCwh4cB2YjMb2Xf9UuoogrMrlO9cTqnB5rI5GHZTcUA==}
     engines: {node: '>=0.10.0'}
 
+  arrify@3.0.0:
+    resolution: {integrity: sha512-tLkvA81vQG/XqE2mjDkGQHoOINtMHtysSnemrmoGe6PydDPMRbVugqyk4A6V/WDWEfm3l+0d8anA9r8cv/5Jaw==}
+    engines: {node: '>=12'}
+
   asap@2.0.6:
     resolution: {integrity: sha512-BSHWgDSAiKs50o2Re8ppvp3seVHXSRM44cdSsT9FfNEUUZLOGWVCsiWaRPWM1Znn+mqZ1OfVZ3z3DWEzSp7hRA==}
 
@@ -2674,6 +2685,10 @@ packages:
     resolution: {integrity: sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==}
     engines: {node: '>=6'}
 
+  clean-stack@4.2.0:
+    resolution: {integrity: sha512-LYv6XPxoyODi36Dp976riBtSY27VmFo+MKqEU9QCCWyTrdEPDog+RWA7xQWHi6Vbp61j5c4cdzzX1NidnwtUWg==}
+    engines: {node: '>=12'}
+
   cli-cursor@3.1.0:
     resolution: {integrity: sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==}
     engines: {node: '>=8'}
@@ -2884,6 +2899,19 @@ packages:
     resolution: {integrity: sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==}
     engines: {node: '>=10'}
 
+  cp-file@10.0.0:
+    resolution: {integrity: sha512-vy2Vi1r2epK5WqxOLnskeKeZkdZvTKfFZQCplE3XWsP+SUJyd5XAUFC9lFgTjjXJF2GMne/UML14iEmkAaDfFg==}
+    engines: {node: '>=14.16'}
+
+  cpy-cli@5.0.0:
+    resolution: {integrity: sha512-fb+DZYbL9KHc0BC4NYqGRrDIJZPXUmjjtqdw4XRRg8iV8dIfghUX/WiL+q4/B/KFTy3sK6jsbUhBaz0/Hxg7IQ==}
+    engines: {node: '>=16'}
+    hasBin: true
+
+  cpy@10.1.0:
+    resolution: {integrity: sha512-VC2Gs20JcTyeQob6UViBLnyP0bYHkBh6EiKzot9vi2DmeGlFT9Wd7VG3NBrkNx/jYvFBeyDOMMHdHQhbtKLgHQ==}
+    engines: {node: '>=16'}
+
   cross-spawn@6.0.5:
     resolution: {integrity: sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==}
     engines: {node: '>=4.8'}
@@ -4162,6 +4190,10 @@ packages:
     resolution: {integrity: sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==}
     engines: {node: '>=10'}
 
+  globby@13.2.2:
+    resolution: {integrity: sha512-Y1zNGV+pzQdh7H39l9zgB4PJqjRNqydvdYCDG4HFXM4XuvSaQQlEc91IU1yALL8gUTDomgBAfz3XJdmUS+oo0w==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+
   globby@14.0.1:
     resolution: {integrity: sha512-jOMLD2Z7MAhyG8aJpNOpmziMOP4rPLcc95oQPKXBazW82z+CEgPFBQvEpRUa1KeIMUJo4Wsm+q6uzO/Q/4BksQ==}
     engines: {node: '>=18'}
@@ -4333,6 +4365,10 @@ packages:
     resolution: {integrity: sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==}
     engines: {node: '>=8'}
 
+  indent-string@5.0.0:
+    resolution: {integrity: sha512-m6FAo/spmsW2Ab2fU35JTYwtOKa2yAwXSwgjSv1TJzh4Mh7mC3lzAOVLBprb72XsTrgkEIsl7YrFNAiDiRhIGg==}
+    engines: {node: '>=12'}
+
   inferred-types@0.37.6:
     resolution: {integrity: sha512-CfL5g1wR5rVwX2K5S6wSL+h9eODScum/LBwlhGRrcBIvfYppvUQM0aeRJ1BZS+QE38kGzd3v+U526+nQR7ZUkg==}
 
@@ -4815,6 +4851,10 @@ packages:
   jstransformer@1.0.0:
     resolution: {integrity: sha512-C9YK3Rf8q6VAPDCCU9fnqo3mAfOH6vUGnMcP4AQAYIEpWtfGLpwOTmZ+igtdK5y+VvI2n3CyYSzy4Qh34eq24A==}
 
+  junk@4.0.1:
+    resolution: {integrity: sha512-Qush0uP+G8ZScpGMZvHUiRfI0YBWuB3gVBYlI0v0vvOJt5FLicco+IkP0a50LqTTQhmts/m6tP5SWE+USyIvcQ==}
+    engines: {node: '>=12.20'}
+
   katex@0.12.0:
     resolution: {integrity: sha512-y+8btoc/CK70XqcHqjxiGWBOeIL8upbS0peTPXTvgrh21n1RiWWcIpSWM+4uXq+IAgNh9YYQWdc7LVDPDAEEAg==}
     hasBin: true
@@ -5038,6 +5078,10 @@ packages:
     resolution: {integrity: sha512-S3UwM3yj5mtUSEfP41UZmt/0SCoVYUcU1rkXv+BQ5Ig8ndL4sPoJNBUJERafdPb5jjHJGuMgytgKvKIf58XNBw==}
     engines: {node: '>= 0.10.0'}
 
+  meow@12.1.1:
+    resolution: {integrity: sha512-BhXM0Au22RwUneMPwSCnyhTOizdWoIEPU9sp0Aqa1PnDMR5Wv2FGXYDjuzJEIX+Eo2Rb8xuYe5jrnm5QowQFkw==}
+    engines: {node: '>=16.10'}
+
   meow@8.1.2:
     resolution: {integrity: sha512-r85E3NdZ+mpYk1C6RjPFEMSE+s1iZMuHtsHAqY0DT3jZczl0diWUZ8g6oU7h0M9cD2EL+PzaYghhCLzR0ZNn5Q==}
     engines: {node: '>=10'}
@@ -5219,6 +5263,9 @@ packages:
   neo-async@2.6.2:
     resolution: {integrity: sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==}
 
+  nested-error-stacks@2.1.1:
+    resolution: {integrity: sha512-9iN1ka/9zmX1ZvLV9ewJYEk9h7RyRRtqdK0woXcqohu8EWIerfPUjYJPg0ULy0UqP7cslmdGc8xKDJcojlKiaw==}
+
   nice-try@1.0.5:
     resolution: {integrity: sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==}
 
@@ -5328,6 +5375,14 @@ packages:
     resolution: {integrity: sha512-D2FR03Vir7FIu45XBY20mTb+/ZSWB00sjU9jdQXt83gDrI4Ztz5Fs7/yy74g2N5SVQY4xY1qDr4rNddwYRVX0g==}
     engines: {node: '>=0.10.0'}
 
+  p-event@5.0.1:
+    resolution: {integrity: sha512-dd589iCQ7m1L0bmC5NLlVYfy3TbBEsMUfWx9PyAgPeIcFZ/E2yaTZ4Rz4MiBmmJShviiftHVXOqfnfzJ6kyMrQ==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+
+  p-filter@3.0.0:
+    resolution: {integrity: sha512-QtoWLjXAW++uTX67HZQz1dbTpqBfiidsB6VtQUC9iR85S120+s0T5sO6s+B5MLzFcZkrEd/DGMmCjR+f2Qpxwg==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+
   p-limit@1.3.0:
     resolution: {integrity: sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==}
     engines: {node: '>=4'}
@@ -5364,6 +5419,18 @@ packages:
     resolution: {integrity: sha512-/bjOqmgETBYB5BoEeGVea8dmvHb2m9GLy1E9W43yeyfP6QQCZGFNa+XRceJEuDB6zqr+gKpIAmlLebMpykw/MQ==}
     engines: {node: '>=10'}
 
+  p-map@5.5.0:
+    resolution: {integrity: sha512-VFqfGDHlx87K66yZrNdI4YGtD70IRyd+zSvgks6mzHPRNkoKy+9EKP4SFC77/vTTQYmRmti7dvqC+m5jBrBAcg==}
+    engines: {node: '>=12'}
+
+  p-map@6.0.0:
+    resolution: {integrity: sha512-T8BatKGY+k5rU+Q/GTYgrEf2r4xRMevAN5mtXc2aPc4rS1j3s+vWTaO2Wag94neXuCAUAs8cxBL9EeB5EA6diw==}
+    engines: {node: '>=16'}
+
+  p-timeout@5.1.0:
+    resolution: {integrity: sha512-auFDyzzzGZZZdHz3BtET9VEz0SE/uMEAx7uWfGPucfzEwwe/xH0iVeZibQmANYE/hp9T2+UUZT5m+BKyrDp3Ew==}
+    engines: {node: '>=12'}
+
   p-try@1.0.0:
     resolution: {integrity: sha512-U1etNYuMJoIz3ZXSrrySFjsXQTWOx2/jdi86L+2pRvph/qMKL6sbcCYdH23fqsbm8TH2Gn0OybpT4eSFlCVHww==}
     engines: {node: '>=4'}
@@ -6008,6 +6075,10 @@ packages:
     resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
     engines: {node: '>=8'}
 
+  slash@4.0.0:
+    resolution: {integrity: sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==}
+    engines: {node: '>=12'}
+
   slash@5.1.0:
     resolution: {integrity: sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==}
     engines: {node: '>=14.16'}
@@ -9364,6 +9435,11 @@ snapshots:
       clean-stack: 2.2.0
       indent-string: 4.0.0
 
+  aggregate-error@4.0.1:
+    dependencies:
+      clean-stack: 4.2.0
+      indent-string: 5.0.0
+
   ajv@6.12.6:
     dependencies:
       fast-deep-equal: 3.1.3
@@ -9502,6 +9578,8 @@ snapshots:
 
   arrify@1.0.1: {}
 
+  arrify@3.0.0: {}
+
   asap@2.0.6: {}
 
   assert-never@1.2.1: {}
@@ -9816,6 +9894,10 @@ snapshots:
 
   clean-stack@2.2.0: {}
 
+  clean-stack@4.2.0:
+    dependencies:
+      escape-string-regexp: 5.0.0
+
   cli-cursor@3.1.0:
     dependencies:
       restore-cursor: 3.1.0
@@ -10064,6 +10146,28 @@ snapshots:
       path-type: 4.0.0
       yaml: 1.10.2
 
+  cp-file@10.0.0:
+    dependencies:
+      graceful-fs: 4.2.11
+      nested-error-stacks: 2.1.1
+      p-event: 5.0.1
+
+  cpy-cli@5.0.0:
+    dependencies:
+      cpy: 10.1.0
+      meow: 12.1.1
+
+  cpy@10.1.0:
+    dependencies:
+      arrify: 3.0.0
+      cp-file: 10.0.0
+      globby: 13.2.2
+      junk: 4.0.1
+      micromatch: 4.0.7
+      nested-error-stacks: 2.1.1
+      p-filter: 3.0.0
+      p-map: 6.0.0
+
   cross-spawn@6.0.5:
     dependencies:
       nice-try: 1.0.5
@@ -11471,6 +11575,14 @@ snapshots:
       merge2: 1.4.1
       slash: 3.0.0
 
+  globby@13.2.2:
+    dependencies:
+      dir-glob: 3.0.1
+      fast-glob: 3.3.2
+      ignore: 5.3.1
+      merge2: 1.4.1
+      slash: 4.0.0
+
   globby@14.0.1:
     dependencies:
       '@sindresorhus/merge-streams': 2.3.0
@@ -11641,6 +11753,8 @@ snapshots:
 
   indent-string@4.0.0: {}
 
+  indent-string@5.0.0: {}
+
   inferred-types@0.37.6(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0):
     dependencies:
       brilliant-errors: 0.7.3(happy-dom@8.9.0)(jsdom@16.7.0)(sass@1.77.6)(sugarss@2.0.0)
@@ -12365,6 +12479,8 @@ snapshots:
       is-promise: 2.2.2
       promise: 7.3.1
 
+  junk@4.0.1: {}
+
   katex@0.12.0:
     dependencies:
       commander: 2.20.3
@@ -12652,6 +12768,8 @@ snapshots:
 
   memorystream@0.3.1: {}
 
+  meow@12.1.1: {}
+
   meow@8.1.2:
     dependencies:
       '@types/minimist': 1.2.5
@@ -12940,6 +13058,8 @@ snapshots:
 
   neo-async@2.6.2: {}
 
+  nested-error-stacks@2.1.1: {}
+
   nice-try@1.0.5: {}
 
   node-fetch@2.7.0:
@@ -13065,6 +13185,14 @@ snapshots:
 
   os-tmpdir@1.0.2: {}
 
+  p-event@5.0.1:
+    dependencies:
+      p-timeout: 5.1.0
+
+  p-filter@3.0.0:
+    dependencies:
+      p-map: 5.5.0
+
   p-limit@1.3.0:
     dependencies:
       p-try: 1.0.0
@@ -13101,6 +13229,14 @@ snapshots:
     dependencies:
       aggregate-error: 3.1.0
 
+  p-map@5.5.0:
+    dependencies:
+      aggregate-error: 4.0.1
+
+  p-map@6.0.0: {}
+
+  p-timeout@5.1.0: {}
+
   p-try@1.0.0: {}
 
   p-try@2.2.0: {}
@@ -13778,6 +13914,8 @@ snapshots:
 
   slash@3.0.0: {}
 
+  slash@4.0.0: {}
+
   slash@5.1.0: {}
 
   slice-ansi@3.0.0:

From 984ef80ca14fec84c355877cfbc3f16b233a8f94 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sat, 6 Jul 2024 19:47:25 +0800
Subject: [PATCH 28/30] fix(docs): refactor for `en-US` docs

---
 .../devui-vue/docs/components/button/index.md |   4 +-
 .../docs/components/cascader/index.md         |  62 +++--
 .../docs/components/countdown/index.md        | 261 ++++++++----------
 .../devui-vue/docs/components/icon/index.md   |  26 +-
 .../docs/components/overlay/index.md          |  10 +-
 .../devui-vue/docs/components/upload/index.md |   4 +-
 .../component-document/index.md               |   5 +-
 .../docs/en-US/components/badge/index.md      |  42 ++-
 .../docs/en-US/components/button/index.md     |  49 ++--
 .../docs/en-US/components/drawer/index.md     |  20 +-
 .../docs/en-US/components/menu/index.md       | 187 +++++++------
 .../docs/en-US/components/modal/index.md      |  20 +-
 .../docs/en-US/components/read-tip/index.md   | 228 +++++++--------
 .../docs/en-US/components/ripple/index.md     | 110 ++++----
 .../docs/en-US/components/search/index.md     |  91 +++---
 .../docs/en-US/components/tag/index.md        |  28 +-
 16 files changed, 604 insertions(+), 543 deletions(-)

diff --git a/packages/devui-vue/docs/components/button/index.md b/packages/devui-vue/docs/components/button/index.md
index 4ad82f0c73..e46b0417aa 100644
--- a/packages/devui-vue/docs/components/button/index.md
+++ b/packages/devui-vue/docs/components/button/index.md
@@ -78,7 +78,9 @@
 
 ### 禁用状态
 
-:::demo 通过`disabled`参数设置按钮禁用状态。
+通过`disabled`参数设置按钮禁用状态。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/cascader/index.md b/packages/devui-vue/docs/components/cascader/index.md
index dfbf866f07..5c39112e8e 100644
--- a/packages/devui-vue/docs/components/cascader/index.md
+++ b/packages/devui-vue/docs/components/cascader/index.md
@@ -2,11 +2,13 @@
 
 下拉级联菜单。
 
-#### 何时使用
+:::tip 何时使用
 
 1. 需要从一组相关联的数据集合进行选择，例如省市区，公司层级，事物分类等。
 2. 从一个较大的数据集合中进行选择时，用多级分类进行分隔，方便选择。
 
+:::
+
 ### 基本用法
 
 :::demo
@@ -16,7 +18,15 @@
   <div class="mb-0">hover mode</div>
   <d-cascader class="mb-2" :options="options" placeholder="请选择" style="width: 200px"></d-cascader>
   <div class="mb-0">click mode</div>
-  <d-cascader class="mb-2" :options="options" v-model="value" showPath trigger="click" placeholder="请选择" style="width: 200px"></d-cascader>
+  <d-cascader
+    class="mb-2"
+    :options="options"
+    v-model="value"
+    showPath
+    trigger="click"
+    placeholder="请选择"
+    style="width: 200px"
+  ></d-cascader>
   <div class="mb-0">data empty</div>
   <d-cascader class="mb-2" :options="[]" trigger="click" placeholder="请选择" style="width: 200px"></d-cascader>
   <div class="mb-0">disabled</div>
@@ -125,21 +135,23 @@ export default defineComponent({
 
 ### 尺寸
 
-:::demo 支持`sm`、`md`、`lg`三种尺寸，默认为`md`。
+支持`sm`、`md`、`lg`三种尺寸，默认为`md`。
+
+:::demo
 
 ```vue
 <template>
   <h4>Small</h4>
-  
-  <d-cascader  :options="options" size="sm" placeholder="请选择" style="width: 200px"></d-cascader>
+
+  <d-cascader :options="options" size="sm" placeholder="请选择" style="width: 200px"></d-cascader>
 
   <h4>Middle</h4>
-  
-  <d-cascader  :options="options" size="md" placeholder="请选择" style="width: 200px"></d-cascader>
+
+  <d-cascader :options="options" size="md" placeholder="请选择" style="width: 200px"></d-cascader>
 
   <h4>Large</h4>
-  
-  <d-cascader  :options="options" size="lg" placeholder="请选择" style="width: 200px"></d-cascader>
+
+  <d-cascader :options="options" size="lg" placeholder="请选择" style="width: 200px"></d-cascader>
 </template>
 <script>
 import { defineComponent, reactive, ref } from 'vue';
@@ -244,7 +256,9 @@ export default defineComponent({
 
 ### 自定义宿主元素
 
-:::demo 可通过`host`插槽自定义展开`Cascader`菜单的宿主元素。
+可通过`host`插槽自定义展开`Cascader`菜单的宿主元素。
+
+:::demo
 
 ```vue
 <template>
@@ -494,20 +508,20 @@ export default defineComponent({
 
 ### API
 
-| 参数          | 类型                              | 默认    | 说明                                                                                                 | 跳转 Demo                              |
-| :------------ | :-------------------------------- | :------ | :--------------------------------------------------------------------------------------------------- |--------------------------------------|
-| v-model       | `(number\|string)[]`              | []      | 可选，单选时为`(number\                     |sring)[]`                                                                    | [基本用法](#基本用法) |
-| trigger       | `'hover'\|'click'`                | 'hover' | 可选，指定展开次级菜单的方式                       | [基本用法](#基本用法) |
-| options       | [`CascaderItem[]`](#CascaderItem) | []      | 必选，级联器的菜单信息                                                                               | [基本用法](#基本用法)                        |
-| placeholder   | `string`                          | ''      | 可选，没有选择时的输入框展示信息                                                                     | [基本用法](#基本用法)                        |
-| disabled      | `boolean`                         | false   | 可选，级联器是否禁用                                                                                 | [基本用法](#基本用法)                        |
-| width         | `number \| string`                | 200     | 可选，单位 px，用于控制组件输入框宽度和下拉的宽度           | [基本用法](#多选模式) |
-| dropdownWidth | `number \| string`                | 200     | 可选，单位 px，控制下拉列表的宽度，默认和组件输入框 width 相等 | [基本用法](#多选模式) |
-| clearable     | `boolean`                         | true    | 可选，是否支持清空选项                                                                               | [基本用法](#基本用法)                        |
-| filterable    | `boolean`                         | true    | 可选，是否可搜索选项                                                                                 | [可搜索](#可搜索)                          |
-| debounce      | `number`                          | 300     | 可选，搜索关键词输入去抖延迟                                                                         | [可搜索](#可搜索)                          |
-| before-filter | `function(value)`                 | --      | 可选,过滤函数调用前的钩子函数。该函数返回值时 false 或者被拒绝的 Promise，接下来的过滤逻辑将不会执行 | [可搜索](#可搜索)                          |
-| size          | [CascaderSize](#cascadersize)     | 'md'    | 文本框的尺寸                                                                                         | [尺寸](#尺寸)                              |
+| 参数          | 类型                              | 默认    | 说明                                                                                                 | 跳转 Demo             |
+| :------------ | :-------------------------------- | :------ | :--------------------------------------------------------------------------------------------------- | --------------------- | --------------------- |
+| v-model       | `(number\|string)[]`              | []      | 可选，单选时为`(number\                                                                              | sring)[]`             | [基本用法](#基本用法) |
+| trigger       | `'hover'\|'click'`                | 'hover' | 可选，指定展开次级菜单的方式                                                                         | [基本用法](#基本用法) |
+| options       | [`CascaderItem[]`](#CascaderItem) | []      | 必选，级联器的菜单信息                                                                               | [基本用法](#基本用法) |
+| placeholder   | `string`                          | ''      | 可选，没有选择时的输入框展示信息                                                                     | [基本用法](#基本用法) |
+| disabled      | `boolean`                         | false   | 可选，级联器是否禁用                                                                                 | [基本用法](#基本用法) |
+| width         | `number \| string`                | 200     | 可选，单位 px，用于控制组件输入框宽度和下拉的宽度                                                    | [基本用法](#多选模式) |
+| dropdownWidth | `number \| string`                | 200     | 可选，单位 px，控制下拉列表的宽度，默认和组件输入框 width 相等                                       | [基本用法](#多选模式) |
+| clearable     | `boolean`                         | true    | 可选，是否支持清空选项                                                                               | [基本用法](#基本用法) |
+| filterable    | `boolean`                         | true    | 可选，是否可搜索选项                                                                                 | [可搜索](#可搜索)     |
+| debounce      | `number`                          | 300     | 可选，搜索关键词输入去抖延迟                                                                         | [可搜索](#可搜索)     |
+| before-filter | `function(value)`                 | --      | 可选,过滤函数调用前的钩子函数。该函数返回值时 false 或者被拒绝的 Promise，接下来的过滤逻辑将不会执行 | [可搜索](#可搜索)     |
+| size          | [CascaderSize](#cascadersize)     | 'md'    | 文本框的尺寸                                                                                         | [尺寸](#尺寸)         |
 
 ### Cascader 事件
 
diff --git a/packages/devui-vue/docs/components/countdown/index.md b/packages/devui-vue/docs/components/countdown/index.md
index d1a9f1f284..cb27c56d37 100644
--- a/packages/devui-vue/docs/components/countdown/index.md
+++ b/packages/devui-vue/docs/components/countdown/index.md
@@ -6,240 +6,223 @@
 
 当倒计时时使用
 
-
 ### 基本用法
+
 默认：时分秒:
-:::demo 
+:::demo
 
 ```vue
 <template>
   <div>
-  <d-countdown :value="deadline" @onChange="changeTime" @onFinish="finishTime"/>
+    <d-countdown :value="deadline" @onChange="changeTime" @onFinish="finishTime" />
   </div>
 </template>
 
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
     const deadline = ref(Date.now() + 100 * 1000);
-    const changeTime = (n) => {
-    }
-    const finishTime = () => {
-    }
+    const changeTime = (n) => {};
+    const finishTime = () => {};
     return {
       msg: 'Countdown 倒计时 组件文档示例',
       deadline,
       changeTime,
-      finishTime
-    }
-  }
-})
+      finishTime,
+    };
+  },
+});
 </script>
 
-<style>
-
-</style>
+<style></style>
 ```
-:::
 
+:::
 
 ### 时间格式
+
 时分秒毫秒:
-:::demo 
+:::demo
 
 ```vue
 <template>
   <div>
-  <d-countdown :value="deadline" format='HH:mm:ss:SSS' @onChange="changeTime" @onFinish="finishTime"/>
+    <d-countdown :value="deadline" format="HH:mm:ss:SSS" @onChange="changeTime" @onFinish="finishTime" />
   </div>
 </template>
 
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
     const deadline = ref(Date.now() + 2 * 60 * 60 * 1000);
-    const changeTime = (n) => {
-    }
-    const finishTime = () => {
-    }
+    const changeTime = (n) => {};
+    const finishTime = () => {};
     return {
       msg: 'Countdown 倒计时 组件文档示例',
       deadline,
       changeTime,
-      finishTime
-    }
-  }
-})
+      finishTime,
+    };
+  },
+});
 </script>
 
-<style>
-
-</style>
+<style></style>
 ```
-:::
-
 
+:::
 
 年月日时分秒:
-:::demo 
+:::demo
 
 ```vue
 <template>
   <div>
-  <d-countdown :value="deadline" format="YYYY 年 MM 月 DD 天 HH 时 mm 分 ss 秒" @onChange="changeTime" @onFinish="finishTime"/>
+    <d-countdown :value="deadline" format="YYYY 年 MM 月 DD 天 HH 时 mm 分 ss 秒" @onChange="changeTime" @onFinish="finishTime" />
   </div>
 </template>
 
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
     const deadline = ref(new Date().getTime() + 369 * 24 * 60 * 60 * 1000 + 5000);
 
-    const changeTime = (n) => {
-    }
-    const finishTime = () => {
-    }
+    const changeTime = (n) => {};
+    const finishTime = () => {};
     return {
       deadline,
       msg: 'Countdown 倒计时 组件文档示例',
       changeTime,
-      finishTime
-    }
-  }
-})
+      finishTime,
+    };
+  },
+});
 </script>
 
-<style>
-
-</style>
+<style></style>
 ```
-:::
-
 
+:::
 
-注：当 format 某一项时间没有的情况下，会将没有的那一项值累积到下一项。 
-例如：当没有 M(月)的时候，会将月的值 *30 累加到日，根据 format 格式化的值会从通过时间 onchange 的 legalTime 值返回，如下：
-:::demo 
+注：当 format 某一项时间没有的情况下，会将没有的那一项值累积到下一项。
+例如：当没有 M(月)的时候，会将月的值 \*30 累加到日，根据 format 格式化的值会从通过时间 onchange 的 legalTime 值返回，如下：
+:::demo
 
 ```vue
 <template>
   <div>
-  <d-countdown :value="deadline" format='YYYY年DD天 HH时mm分ss秒' @onChange="changeTime" @onFinish="finishTime"/>
+    <d-countdown :value="deadline" format="YYYY年DD天 HH时mm分ss秒" @onChange="changeTime" @onFinish="finishTime" />
   </div>
 </template>
 
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const deadline = ref(new Date().getTime() + 700 * 24 * 60 * 60 *1000 + 5000);
-    const changeTime = (n) => {
-    }
-    const finishTime = () => {
-    }
+    const deadline = ref(new Date().getTime() + 700 * 24 * 60 * 60 * 1000 + 5000);
+    const changeTime = (n) => {};
+    const finishTime = () => {};
     return {
       msg: 'Countdown 倒计时 组件文档示例',
       deadline,
       changeTime,
-      finishTime
-    }
-  }
-})
+      finishTime,
+    };
+  },
+});
 </script>
 
-<style>
-
-</style>
+<style></style>
 ```
-:::
-
 
+:::
 
 ### 前缀和后缀
-:::demo 
+
+:::demo
 
 ```vue
 <template>
   <div>
-  <d-countdown :value="Date.now() + 50000" format="HH时mm分ss秒" prefix="还有 " suffix=" 结束！" @onChange="changeTime" @onFinish="finishTime"/>
+    <d-countdown
+      :value="Date.now() + 50000"
+      format="HH时mm分ss秒"
+      prefix="还有 "
+      suffix=" 结束！"
+      @onChange="changeTime"
+      @onFinish="finishTime"
+    />
   </div>
 </template>
 
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const changeTime = (n) => {
-    }
-    const finishTime = () => {
-    }
+    const changeTime = (n) => {};
+    const finishTime = () => {};
     return {
       msg: 'Countdown 倒计时 组件文档示例',
       changeTime,
-      finishTime
-    }
-  }
-})
+      finishTime,
+    };
+  },
+});
 </script>
 
-<style>
-
-</style>
+<style></style>
 ```
-:::
 
+:::
 
+### 设置 style
 
-### 设置style
 设置倒计时文字样式:
-:::demo 
+:::demo
 
 ```vue
 <template>
   <div>
-  <d-countdown :value="deadline" :valueStyle="styles" @onChange="changeTime" @onFinish="finishTime"/>
+    <d-countdown :value="deadline" :valueStyle="styles" @onChange="changeTime" @onFinish="finishTime" />
   </div>
 </template>
 
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const deadline = ref(new Date().getTime() + 10 * 24 * 60 * 60 *1000);
-    const styles = {color: '#5e7ce0'}
-    const changeTime = (n) => {
-    }
-    const finishTime = () => {
-    }
+    const deadline = ref(new Date().getTime() + 10 * 24 * 60 * 60 * 1000);
+    const styles = { color: '#5e7ce0' };
+    const changeTime = (n) => {};
+    const finishTime = () => {};
     return {
       msg: 'Countdown 倒计时 组件文档示例',
       deadline,
       styles,
       changeTime,
-      finishTime
-    }
-  }
-})
+      finishTime,
+    };
+  },
+});
 </script>
 
-<style>
-
-</style>
+<style></style>
 ```
-:::
 
+:::
 
 ### 自定义内容
-:::demo 
+
+:::demo
 
 ```vue
 <template>
@@ -259,71 +242,69 @@ export default defineComponent({
 </template>
 
 <script>
-import { defineComponent, ref, reactive } from 'vue'
+import { defineComponent, ref, reactive } from 'vue';
 
 export default defineComponent({
   setup() {
-    const format = ref("HH:mm:ss");
-    const deadline = ref(new Date().getTime() + 10 * 24 * 60 * 60 *1000 + 5000);
-    const leftTime = reactive({'H':0,'m':0,'s':0})
-    const changeTime = ({legalTime}) => {
-      
+    const format = ref('HH:mm:ss');
+    const deadline = ref(new Date().getTime() + 10 * 24 * 60 * 60 * 1000 + 5000);
+    const leftTime = reactive({ H: 0, m: 0, s: 0 });
+    const changeTime = ({ legalTime }) => {
       for (const k of legalTime.keys()) {
         if (k in leftTime) {
           leftTime[k] = legalTime.get(k);
         }
       }
-    }
-    const finishTime = () => {
-    }
+    };
+    const finishTime = () => {};
     return {
       msg: 'Countdown 倒计时 组件文档示例',
       deadline,
       leftTime,
       changeTime,
       finishTime,
-      format
-    }
-  }
-})
+      format,
+    };
+  },
+});
 </script>
 
 <style lang="scss">
-.countdown-main .time-num{
-    font-weight: 400;
-    display: inline-block;
-    border: 1px solid #f4f4f4;
-    padding: 0 4px;
-    border-radius: 4px;
-    min-width: 48px;
-    text-align: center;
-    background-color: #f4f4f4;
-    font-size: 18px;
-  }
+.countdown-main .time-num {
+  font-weight: 400;
+  display: inline-block;
+  border: 1px solid #f4f4f4;
+  padding: 0 4px;
+  border-radius: 4px;
+  min-width: 48px;
+  text-align: center;
+  background-color: #f4f4f4;
+  font-size: 18px;
+}
 </style>
 ```
+
 :::
 
 ### Countdown 参数
 
-| 参数 | 类型 | 默认 | 说明 | 跳转demo |
-| :---- | :---- | :---- | :---- | :---- |
-|   format   |   string   |     HH:mm:ss      |   格式化倒计时展示，参考moment   |   [时间格式](#时间格式) |
-|   value   |   number   |   -   |   数值内容	   |   [基本用法](#基本用法) |
-|   prefix   |   string   |   -   |   设置数值的前缀	   |   [前缀和后缀](#前缀和后缀) |
-|   suffix   |   string   |   -   |   设置数值的后缀		   |   [前缀和后缀](#前缀和后缀) |
-|   value-style   |   CSSProperties   |   -   |   设置数值的样式		   |   [设置style](#设置style) |
-
+| 参数        | 类型          | 默认     | 说明                          | 跳转 demo                 |
+| :---------- | :------------ | :------- | :---------------------------- | :------------------------ |
+| format      | string        | HH:mm:ss | 格式化倒计时展示，参考 moment | [时间格式](#时间格式)     |
+| value       | number        | -        | 数值内容                      | [基本用法](#基本用法)     |
+| prefix      | string        | -        | 设置数值的前缀                | [前缀和后缀](#前缀和后缀) |
+| suffix      | string        | -        | 设置数值的后缀                | [前缀和后缀](#前缀和后缀) |
+| value-style | CSSProperties | -        | 设置数值的样式                | [设置 style](#设置style)  |
 
 ### Countdown 事件
 
-| 事件 | 类型 | 说明 |
-| :---- | :---- | :---- |
-|   on-change   |   ({leftTime,formatTime,legalTime}) => void   |   倒计时时间变化时触发。<br>leftTime:倒计时剩余得时间戳；<br>formatTime：年月日时分秒毫秒格式倒计时；<br>legalTime：根据format格式化后的值。	   |
-|   on-finish   |   () => void   |   倒计时完成时触发	   |
+| 事件      | 类型                                      | 说明                                                                                                                                         |
+| :-------- | :---------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------- |
+| on-change | ({leftTime,formatTime,legalTime}) => void | 倒计时时间变化时触发。<br>leftTime:倒计时剩余得时间戳；<br>formatTime：年月日时分秒毫秒格式倒计时；<br>legalTime：根据 format 格式化后的值。 |
+| on-finish | () => void                                | 倒计时完成时触发                                                                                                                             |
 
 ### Countdown 插槽
 
-| 插槽名    | 说明              |
-| :------- | :----------------- |
-| default | 自定义内容        |
+| 插槽名  | 说明       |
+| :------ | :--------- |
+| default | 自定义内容 |
diff --git a/packages/devui-vue/docs/components/icon/index.md b/packages/devui-vue/docs/components/icon/index.md
index 5289d621f7..025780fe8b 100644
--- a/packages/devui-vue/docs/components/icon/index.md
+++ b/packages/devui-vue/docs/components/icon/index.md
@@ -2,15 +2,21 @@
 
 用于显示图标。
 
-#### 何时使用
+:::tip 何时使用
 
 需要显示图标时。
 
+:::
+
 所有内置的图标可在 DevUI 官网进行查看：[https://devui.design/icon/ruleResource](https://devui.design/icon/ruleResource)
 
+## 用法
+
 ### 基本用法
 
-:::demo 通过`name`属性，指定需要显示的图标，支持 DevUI 图标库图标和 URL 形式的图标。
+通过`name`属性，指定需要显示的图标，支持 DevUI 图标库图标和 URL 形式的图标。
+
+:::demo
 
 ```vue
 <template>
@@ -25,7 +31,9 @@
 
 ### 附带描述信息
 
-:::demo 利用`prefix`和`suffix`可分别设置图标的前置和后置内容，`operable`设置可交互图标，`disabled`设置禁用态，`rotate`设置图标旋转角度或自动旋转。
+利用`prefix`和`suffix`可分别设置图标的前置和后置内容，`operable`设置可交互图标，`disabled`设置禁用态，`rotate`设置图标旋转角度或自动旋转。
+
+:::demo
 
 ```vue
 <template>
@@ -76,7 +84,9 @@
 
 ### 颜色
 
-:::demo 通过`color`属性指定图标的颜色。
+通过`color`属性指定图标的颜色。
+
+:::demo
 
 ```vue
 <template>
@@ -91,7 +101,9 @@
 
 ### 尺寸
 
-:::demo 通过`size`属性，设置图标尺寸。
+通过`size`属性，设置图标尺寸。
+
+:::demo
 
 ```vue
 <template>
@@ -106,7 +118,9 @@
 
 ### 图标组
 
-:::demo 常用图标组使用场景
+常用图标组使用场景
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/overlay/index.md b/packages/devui-vue/docs/components/overlay/index.md
index f922560fa7..99bd2a604c 100644
--- a/packages/devui-vue/docs/components/overlay/index.md
+++ b/packages/devui-vue/docs/components/overlay/index.md
@@ -2,10 +2,14 @@
 
 遮罩层属于基础组件，用于构建独立于当前页面布局的组件。
 
-#### 何时使用
+:::tip 何时使用
 
 当你需要全局弹窗，或者需要元素跟随功能，便可以使用该组件。
 
+:::
+
+## 用法
+
 ### 固定遮罩层
 
 :::demo
@@ -52,7 +56,9 @@ export default defineComponent({
 
 ### 弹性遮罩层
 
-:::demo 跟随起点元素移动，并且在遇到边界时根据`position`参数指定的可选位置自动调整。
+跟随起点元素移动，并且在遇到边界时根据`position`参数指定的可选位置自动调整。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/components/upload/index.md b/packages/devui-vue/docs/components/upload/index.md
index 44dba6fde8..0564a7e878 100644
--- a/packages/devui-vue/docs/components/upload/index.md
+++ b/packages/devui-vue/docs/components/upload/index.md
@@ -195,7 +195,9 @@ export default {
 
 ### 任意区域上传
 
-:::demo 用户可通过默认 slot 支持文件任意区域上传。
+用户可通过默认 slot 支持文件任意区域上传。
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/contributing/development-specification/component-document/index.md b/packages/devui-vue/docs/contributing/development-specification/component-document/index.md
index 043a0579bc..9e07fc410b 100644
--- a/packages/devui-vue/docs/contributing/development-specification/component-document/index.md
+++ b/packages/devui-vue/docs/contributing/development-specification/component-document/index.md
@@ -11,9 +11,8 @@
 7. 文案描述需清晰，尽量参考 ng devui 的文案描述，尽量避免口语化；标点符号使用需正确；文案中若涉及到英文单词，需在单次左右两侧加一个空格。
 8. 一个标题尽量展示一个 demo，避免一个标题中展示多个 demo。
 9. boolean 类型的参数，在 demo 中展示，设置为 true 的时候，不需要显式的设置为 true，直接写参数名字即可。
-10. demo 的描述说明文案中，用到代码块的地方需要用反引号包裹。
-11. demo 的描述说明文案应该跟在:::demo 后面，不应该放在 h4 或其他标签中，也不应该放在代码块外面。
-12. 【何时使用】标题等级应该为四级，避免出现在快速前往导航中。
+10. 新版本中 demo 的不应该出现描述说明文案中，请在 Demo 前进行描述。
+11. 【何时使用】标题等级应该为四级，避免出现在快速前往导航中。
 
 ### API 文档
 
diff --git a/packages/devui-vue/docs/en-US/components/badge/index.md b/packages/devui-vue/docs/en-US/components/badge/index.md
index 519060a93d..47a571aa8f 100644
--- a/packages/devui-vue/docs/en-US/components/badge/index.md
+++ b/packages/devui-vue/docs/en-US/components/badge/index.md
@@ -8,7 +8,9 @@ The badge is appeared at the upper right corner of the icon or the right of a li
 
 ### Basic Badge
 
-::: demo Basic badge type. When there is a package element, the badge and number are displayed in the upper right corner.
+Basic badge type. When there is a package element, the badge and number are displayed in the upper right corner.
+
+::: demo
 
 ```vue
 <template>
@@ -34,7 +36,9 @@ The badge is appeared at the upper right corner of the icon or the right of a li
 
 ### Dotted Badge
 
-:::demo Point badge type. When there is a package element and `show-dot` is set to true, the dot is displayed in the upper right corner by default.
+Point badge type. When there is a package element and `show-dot` is set to true, the dot is displayed in the upper right corner by default.
+
+:::demo
 
 ```vue
 <template>
@@ -63,7 +67,9 @@ The badge is appeared at the upper right corner of the icon or the right of a li
 
 ### Count Badge
 
-:::demo When the badge is used independently and does not enclose any elements, only the badge status color and number are displayed.
+When the badge is used independently and does not enclose any elements, only the badge status color and number are displayed.
+
+:::demo
 
 ```vue
 <template>
@@ -99,7 +105,9 @@ The badge is appeared at the upper right corner of the icon or the right of a li
 
 ### Status Badge
 
-:::demo When the badge is used independently, does not contain any elements, and the `show-dot` parameter is set to true, the badge is a status badge. Different color dots are displayed for different statuses.
+When the badge is used independently, does not contain any elements, and the `show-dot` parameter is set to true, the badge is a status badge. Different color dots are displayed for different statuses.
+
+:::demo
 
 ```vue
 <template>
@@ -125,7 +133,9 @@ The badge is appeared at the upper right corner of the icon or the right of a li
 
 ### Badge Position
 
-:::demo Set badgePos to set the badge position.
+Set badgePos to set the badge position.
+
+:::demo
 
 ```vue
 <template>
@@ -144,7 +154,9 @@ The badge is appeared at the upper right corner of the icon or the right of a li
 
 ### Custom
 
-:::demo The bgColor parameter is used to set the badge status color (the badge status color specified by status is invalid). The offsetXY parameter is used to set the badge offset relative to the badgePos.Customizing text and background colors using textColor and bgColor.
+The bgColor parameter is used to set the badge status color (the badge status color specified by status is invalid). The offsetXY parameter is used to set the badge offset relative to the badgePos.Customizing text and background colors using textColor and bgColor.
+
+:::demo
 
 ```vue
 <template>
@@ -164,15 +176,15 @@ The badge is appeared at the upper right corner of the icon or the right of a li
 
 ### d-badge Parameter
 
-| Parameter       | Type                | Default        | Description                                                                                                                   |
-| ---------- | ------------------- | ----------- | :--------------------------------------------------------------------------------------------------------------------- |
-| count      | `Number`            | --          | Optional. Set the number of basic badges to be displayed.                                                                     |
-| max-count  | `Number`            | 99          | Optional. Sets the maximum number of basic and counting badges that can be displayed.When count is greater than maxCount, maxCount+ is displayed.                                  |
-| show-dot   | `Boolean`           | false       | Optional. The value true indicates the dot badge (with package) or status badge (without package). The value false indicates the basic badge (with package) or count badge (without package).                        |
-| status     | `BadgeStatusType`   | --          | Optional. The status color is danger\| warning \| waiting \| success \| info.	                                                            |
-| position   | `BadgePositionType` | 'top-right' | Optional. The logo position is top-left\| top-right \| bottom-left \| bottom-right                                                      |
-| bg-color   | `String`            | --          | Optional. The badge color can be customized. In this case, the badge status color specified by status is invalid.                                                               |
-| text-color | `String`            | --          | Optional. You can customize the logo text color.                                                                                           |
+| Parameter  | Type                | Default     | Description                                                                                                                                                                                                            |
+| ---------- | ------------------- | ----------- | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| count      | `Number`            | --          | Optional. Set the number of basic badges to be displayed.                                                                                                                                                              |
+| max-count  | `Number`            | 99          | Optional. Sets the maximum number of basic and counting badges that can be displayed.When count is greater than maxCount, maxCount+ is displayed.                                                                      |
+| show-dot   | `Boolean`           | false       | Optional. The value true indicates the dot badge (with package) or status badge (without package). The value false indicates the basic badge (with package) or count badge (without package).                          |
+| status     | `BadgeStatusType`   | --          | Optional. The status color is danger\| warning \| waiting \| success \| info.                                                                                                                                          |
+| position   | `BadgePositionType` | 'top-right' | Optional. The logo position is top-left\| top-right \| bottom-left \| bottom-right                                                                                                                                     |
+| bg-color   | `String`            | --          | Optional. The badge color can be customized. In this case, the badge status color specified by status is invalid.                                                                                                      |
+| text-color | `String`            | --          | Optional. You can customize the logo text color.                                                                                                                                                                       |
 | offset     | `[number, number]`  | --          | Optional. Indicates the logo position offset when there is a package. The format is [x,y], in px. This parameter is optional. x is the relative right offset (right: -x px), y is the relative top offset (top: y px). |
 
 ### BadgeStatusType
diff --git a/packages/devui-vue/docs/en-US/components/button/index.md b/packages/devui-vue/docs/en-US/components/button/index.md
index 18bab2e6d6..395285f538 100644
--- a/packages/devui-vue/docs/en-US/components/button/index.md
+++ b/packages/devui-vue/docs/en-US/components/button/index.md
@@ -1,4 +1,4 @@
-# Button 
+# Button
 
 Button is used to start an instant operation.
 
@@ -8,7 +8,9 @@ It marks (or encapsulates a group of) operation commands, responds to user click
 
 ### Basic Usage
 
-:::demo Use `variant` to set button shape. Three types are supported: `solid`, `outline` and `text`, default  `outline`.
+Use `variant` to set button shape. Three types are supported: `solid`, `outline` and `text`, default `outline`.
+
+:::demo
 
 ```vue
 <template>
@@ -24,7 +26,9 @@ It marks (or encapsulates a group of) operation commands, responds to user click
 
 ### Theme Color
 
-:::demo Use `color` to set `Button` theme color. Three types of theme colors are supported: `primary`, `secondary`, and `danger`.<br>Note: If the `variant` is set to `solid`, the `primar` theme color will be used by default.
+Use `color` to set `Button` theme color. Three types of theme colors are supported: `primary`, `secondary`, and `danger`.<br>Note: If the `variant` is set to `solid`, the `primar` theme color will be used by default.
+
+:::demo
 
 ```vue
 <template>
@@ -52,7 +56,9 @@ It marks (or encapsulates a group of) operation commands, responds to user click
 
 ### Size
 
-:::demo Use `size` to set `Button` size. Three types of sizes are supported: `sm`, `md`, and `lg`, default `md`.
+Use `size` to set `Button` size. Three types of sizes are supported: `sm`, `md`, and `lg`, default `md`.
+
+:::demo
 
 ```vue
 <template>
@@ -68,7 +74,9 @@ It marks (or encapsulates a group of) operation commands, responds to user click
 
 ### Disabled
 
-:::demo Use the `disabled` parameter to set the status of the button to Disabled. 
+Use the `disabled` parameter to set the status of the button to Disabled.
+
+:::demo
 
 ```vue
 <template>
@@ -90,7 +98,9 @@ It marks (or encapsulates a group of) operation commands, responds to user click
 
 ### Loading
 
-:::demo Use the `loading` parameter to set the status of the button to Loading. 
+Use the `loading` parameter to set the status of the button to Loading.
+
+:::demo
 
 ```vue
 <template>
@@ -143,6 +153,7 @@ export default {
 ### Button group
 
 Buttons can be grouped. The size of the button group can be set by `size` and mixed with the dropdown menu.
+
 :::demo
 
 ```vue
@@ -151,7 +162,7 @@ Buttons can be grouped. The size of the button group can be set by `size` and mi
     <d-button variant="solid">Button Name</d-button>
     <d-button icon="icon-select-arrow" variant="solid"></d-button>
   </d-button-group>
-  
+
   <p>Size：sm</p>
   <d-button-group size="sm">
     <d-button color="primary" variant="solid">Shanghai</d-button>
@@ -229,15 +240,15 @@ export default defineComponent({
 
 ### Button Props
 
-| Parameter   | Type                              | Default        | Description                      | Jump to Demo                 |
-| :------- | :-------------------------------- | :---------- | :------------------------ | :------------------------ |
-| variant  | [IButtonVariant](#ibuttonvariant) | 'outline'   | Optional. Button style.            | [Basic Usage](#basic-usage)             |
-| color    | [IButtonColor](#ibuttoncolor)     | 'secondary' | Optional. Button theme.            | [theme color](#theme-color)         |
-| size     | [IButtonSize](#ibuttonsize)       | 'md'        | Optional. Button size.            | [size](#size)             |
-| icon     | `string`                          | --          | Optional. Customize icons in buttons.      | [icon](#icon)     |
-| shape    | [IButtonShape](#ibuttonshape)     | --          | Optional. Button shape(round/rounded). | [shape](#icon)     |
-| disabled | `boolean`                         | false       | Optional. Disable button.     | [disabled](#disabled)     |
-| loading  | `boolean`                         | false       | Optional. Set status in loading.      | [loading](#loading) |
+| Parameter | Type                              | Default     | Description                            | Jump to Demo                |
+| :-------- | :-------------------------------- | :---------- | :------------------------------------- | :-------------------------- |
+| variant   | [IButtonVariant](#ibuttonvariant) | 'outline'   | Optional. Button style.                | [Basic Usage](#basic-usage) |
+| color     | [IButtonColor](#ibuttoncolor)     | 'secondary' | Optional. Button theme.                | [theme color](#theme-color) |
+| size      | [IButtonSize](#ibuttonsize)       | 'md'        | Optional. Button size.                 | [size](#size)               |
+| icon      | `string`                          | --          | Optional. Customize icons in buttons.  | [icon](#icon)               |
+| shape     | [IButtonShape](#ibuttonshape)     | --          | Optional. Button shape(round/rounded). | [shape](#icon)              |
+| disabled  | `boolean`                         | false       | Optional. Disable button.              | [disabled](#disabled)       |
+| loading   | `boolean`                         | false       | Optional. Set status in loading.       | [loading](#loading)         |
 
 ### Button TypeDefine
 
@@ -267,9 +278,9 @@ type IButtonShape = 'circle' | 'round';
 
 ### ButtonGroup Props
 
-| Parameter | Type                             | Default | Description             | Jump to Demo         |
-| :----- | :------------------------------- | :--- | :--------------- | :---------------- |
-| size   | [IButtonSize](#iButtonGroupSize) | 'md' | Optional. Button group size. | [button group](#button-group) |
+| Parameter | Type                             | Default | Description                  | Jump to Demo                  |
+| :-------- | :------------------------------- | :------ | :--------------------------- | :---------------------------- |
+| size      | [IButtonSize](#iButtonGroupSize) | 'md'    | Optional. Button group size. | [button group](#button-group) |
 
 ### ButtonGroup TypeDefine
 
diff --git a/packages/devui-vue/docs/en-US/components/drawer/index.md b/packages/devui-vue/docs/en-US/components/drawer/index.md
index 1258f7ef58..8a2171c3c3 100644
--- a/packages/devui-vue/docs/en-US/components/drawer/index.md
+++ b/packages/devui-vue/docs/en-US/components/drawer/index.md
@@ -10,7 +10,9 @@ A floating panel assembly that slides out from the edge of the screen.
 
 ### Basic Usage
 
-:::demo Slides out from the right by default with a width of `300px`.
+Slides out from the right by default with a width of `300px`.
+
+:::demo
 
 ```vue
 <template>
@@ -35,7 +37,9 @@ export default defineComponent({
 
 ### Left Pop-up
 
-:::demo Sets the left slideout via `position`.
+Sets the left slideout via `position`.
+
+:::demo
 
 ```vue
 <template>
@@ -60,7 +64,9 @@ export default defineComponent({
 
 ### Background Scroll
 
-:::demo drawer After sliding out, the default background scroll is locked, which can be unlocked by setting `lock-scroll` to `false`.
+Drawer after sliding out, the default background scroll is locked, which can be unlocked by setting `lock-scroll` to `false`.
+
+:::demo
 
 ```vue
 <template>
@@ -86,7 +92,9 @@ export default defineComponent({
 
 ### Pre-close Callback
 
-:::demo `before-close` is called when the user closes the drawer, which can be done by executing the `done` function after certain asynchronous operations have been completed.
+`before-close` is called when the user closes the drawer, which can be done by executing the `done` function after certain asynchronous operations have been completed.
+
+:::demo
 
 ```vue
 <template>
@@ -117,7 +125,9 @@ export default defineComponent({
 
 ### Service Method
 
-The :::demo component registers `$drawerService` globally, which can be used as a service, with the content of the drawer passed in as the `content` parameter. The service returns the `close` method for closing the drawer.
+The component registers `$drawerService` globally, which can be used as a service, with the content of the drawer passed in as the `content` parameter. The service returns the `close` method for closing the drawer.
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/en-US/components/menu/index.md b/packages/devui-vue/docs/en-US/components/menu/index.md
index 8f8fa44152..6eeca666db 100644
--- a/packages/devui-vue/docs/en-US/components/menu/index.md
+++ b/packages/devui-vue/docs/en-US/components/menu/index.md
@@ -8,7 +8,9 @@ When you need to store, arrange and display a series of options
 
 ### Basic
 
-:::demo If the screen size is too small, an ellipsis appears
+If the screen size is too small, an ellipsis appears.
+
+:::demo
 
 ```vue
 <template>
@@ -36,14 +38,13 @@ When you need to store, arrange and display a series of options
 import { ref } from 'vue';
 let width = ref(480);
 </script>
-
 ```
 
 :::
 
 ### Icon
 
-Sometimes. We need define some icon for subMenu or menuItem. We can use ```icon```slot to define icon. At the same time, we can also use CSS to customize the slot
+Sometimes. We need define some icon for subMenu or menuItem. We can use `icon`slot to define icon. At the same time, we can also use CSS to customize the slot
 
 :::demo
 
@@ -224,80 +225,82 @@ export default defineComponent({
 
 ### Only One Expansion
 
-:::demo Modify the ` ` ` open keys ` ` ` array through the submenu state change event to achieve the effect
+Modify the `open keys` array through the submenu state change event to achieve the effect
 
-``` vue
-  <template>
-    <d-menu @submenu-change="submenuChange" :default-select-keys="['item1']" :open-keys="openKeys" width="256px"
-    >
-      <d-sub-menu title="submenu-1" key="submenu-1">
+:::demo
+
+```vue
+<template>
+  <d-menu @submenu-change="submenuChange" :default-select-keys="['item1']" :open-keys="openKeys" width="256px">
+    <d-sub-menu title="submenu-1" key="submenu-1">
+      <template #icon>
+        <i class="icon-infomation"></i>
+      </template>
+      <d-menu-item key="subemenu-item-1">
+        <span>submenu-item-1</span>
+      </d-menu-item>
+      <d-sub-menu title="submenu-4" key="submenu-4">
         <template #icon>
           <i class="icon-infomation"></i>
         </template>
-        <d-menu-item key="subemenu-item-1">
+        <d-menu-item key="subemenu-item-4">
           <span>submenu-item-1</span>
         </d-menu-item>
-        <d-sub-menu title="submenu-4" key="submenu-4">
-          <template #icon>
-            <i class="icon-infomation"></i>
-          </template>
-          <d-menu-item key="subemenu-item-4">
-            <span>submenu-item-1</span>
-          </d-menu-item>
-        </d-sub-menu>
-        <d-sub-menu title="submenu-5" key="submenu-5">
-          <template #icon>
-            <i class="icon-infomation"></i>
-          </template>
-          <d-menu-item key="subemenu-item-5">
-            <span>submenu-item-1</span>
-          </d-menu-item>
-        </d-sub-menu>
-      </d-sub-menu>
-      <d-sub-menu title="submenu-2" key="submenu-2">
-        <template #icon>
-          <i class="icon-setting"></i>
-        </template>
-        <d-menu-item key="submenu-item-2">
-          <span>submenu-item-2</span>
-        </d-menu-item>
       </d-sub-menu>
-      <d-sub-menu title="submenu-3" key="submenu-3">
+      <d-sub-menu title="submenu-5" key="submenu-5">
         <template #icon>
-          <i class="icon-setting"></i>
+          <i class="icon-infomation"></i>
         </template>
-        <d-menu-item key="submenu-item-6">
-          <span>submenu-item-2</span>
+        <d-menu-item key="subemenu-item-5">
+          <span>submenu-item-1</span>
         </d-menu-item>
       </d-sub-menu>
-    </d-menu>
-  </template>
-
-  <script>
-  import { defineComponent, ref } from 'vue';
-
-  export default defineComponent({
-    setup() {
-      const openKeys = ref(['submenu-1']);
-      const rootSubMenuKeys = ref(['submenu-1','submenu-2','submenu-3']);
-      const submenuChange = (e) => {
-        console.log(e);
-        const {key} = e;
-        if (rootSubMenuKeys.value.includes(key)){
-          while (openKeys.value.length){
-            openKeys.value.shift();
-          }
-          openKeys.value.push(key);
+    </d-sub-menu>
+    <d-sub-menu title="submenu-2" key="submenu-2">
+      <template #icon>
+        <i class="icon-setting"></i>
+      </template>
+      <d-menu-item key="submenu-item-2">
+        <span>submenu-item-2</span>
+      </d-menu-item>
+    </d-sub-menu>
+    <d-sub-menu title="submenu-3" key="submenu-3">
+      <template #icon>
+        <i class="icon-setting"></i>
+      </template>
+      <d-menu-item key="submenu-item-6">
+        <span>submenu-item-2</span>
+      </d-menu-item>
+    </d-sub-menu>
+  </d-menu>
+</template>
+
+<script>
+import { defineComponent, ref } from 'vue';
+
+export default defineComponent({
+  setup() {
+    const openKeys = ref(['submenu-1']);
+    const rootSubMenuKeys = ref(['submenu-1', 'submenu-2', 'submenu-3']);
+    const submenuChange = (e) => {
+      console.log(e);
+      const { key } = e;
+      if (rootSubMenuKeys.value.includes(key)) {
+        while (openKeys.value.length) {
+          openKeys.value.shift();
         }
-      };
-      return {
-        openKeys,
-        submenuChange,
-      };
-    },
-  });
-  </script>
+        openKeys.value.push(key);
+      }
+    };
+    return {
+      openKeys,
+      submenuChange,
+    };
+  },
+});
+</script>
 ```
+
 :::
 
 ### Reactivity-Attribute
@@ -353,51 +356,51 @@ const changeDisabled = () => {
 
 ### d-menu Attribute
 
-| Attribute                | Type                  | Default Value       | Description                                                                            | Demo                 |
-| ------------------- | --------------------- | ---------- | ------------------------------------------------------------------------------- | ------------------------- |
-| width               | String                | ''         | Used to control menu width                                                                | [Reactivity-Attribute](#Reactivity-Attribute) |
-| collapsed           | Boolean               | false      | Used to decide whether to collapse the menu                                                            | [Collapsed](#Collapsed)     |
-| collapsed-indent    | Number                | 24         | The distance between the starting icon and the left and right borders                                                    | [Collapsed](#Collapsed)     |
-| multiple            | Boolean               | false      | Can I select more than one                                                                    | [Deselect](#Deselect)     |
-| mode                | [menuMode](#menumode) | 'vertical' | menu type                                                                        | [Basic-Use](#Basic-Use)     |
-| open-keys           | Array                 | []         | default open key of menu item| [默认展开](#默认展开)     |
-| default-select-keys | Array                 | []         | default select key of menu item item                                                           | [Basic-Use](#Basic-Use)     |
-| router              | Boolean               | false      | Whether to enable 'Vue router' mode. Enabling this mode will jump the route with the key as the path when the navigation is activated | -                         |
+| Attribute           | Type                  | Default Value | Description                                                                                                                           | Demo                                          |
+| ------------------- | --------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------- |
+| width               | String                | ''            | Used to control menu width                                                                                                            | [Reactivity-Attribute](#Reactivity-Attribute) |
+| collapsed           | Boolean               | false         | Used to decide whether to collapse the menu                                                                                           | [Collapsed](#Collapsed)                       |
+| collapsed-indent    | Number                | 24            | The distance between the starting icon and the left and right borders                                                                 | [Collapsed](#Collapsed)                       |
+| multiple            | Boolean               | false         | Can I select more than one                                                                                                            | [Deselect](#Deselect)                         |
+| mode                | [menuMode](#menumode) | 'vertical'    | menu type                                                                                                                             | [Basic-Use](#Basic-Use)                       |
+| open-keys           | Array                 | []            | default open key of menu item                                                                                                         | [默认展开](#默认展开)                         |
+| default-select-keys | Array                 | []            | default select key of menu item item                                                                                                  | [Basic-Use](#Basic-Use)                       |
+| router              | Boolean               | false         | Whether to enable 'Vue router' mode. Enabling this mode will jump the route with the key as the path when the navigation is activated | -                                             |
 
 ### d-menu Event
 
-| Event           | Type                                                                                | Description                                                 | Demo             |
-| -------------- | ----------------------------------------------------------------------------------- | ---------------------------------------------------- | --------------------- |
-| select         | `(e: {type: 'select', key: string, el: HTMLElement, e: PointerEvent})=>void`        | if select will trigger this event. if is disabled will not trigger        | [Deselect](#Deselect) |
+| Event          | Type                                                                                | Description                                                                                              | Demo                  |
+| -------------- | ----------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------- | --------------------- |
+| select         | `(e: {type: 'select', key: string, el: HTMLElement, e: PointerEvent})=>void`        | if select will trigger this event. if is disabled will not trigger                                       | [Deselect](#Deselect) |
 | deselect       | `(e: {type: 'deselect', key: string, el: HTMLElement, e: PointerEvent})=>void`      | This event will be triggered when deselecting. If the menu is not multi select, it will not be triggered | [Deselect](#Deselect) |
-| submenu-change | `(e: {type: 'submenu-change', state: boolean, key: string, el: HTMLElement})=>void` | Triggered when the submenu state is changed                             | [Deselect](#Deselect) |
+| submenu-change | `(e: {type: 'submenu-change', state: boolean, key: string, el: HTMLElement})=>void` | Triggered when the submenu state is changed                                                              | [Deselect](#Deselect) |
 
 ### d-menu-item
 
-|   Attribute   |  Type   | Default Value  |          Description           |       Demo       |
-| :------: | :-----: | :---: | :---------------------: | :-------------------: |
-| disabled | boolean | false | disabled menu item         |           -           |
-|   key    | string  |  ''   | key of the menu item. Need to be unique |           -           |
-|   href   | string  |  ''   | Page to jump to after clicking the menu item  | [Basic-Use](#Basic-Use) |
-|  route   | object  |   -   |   Vue Router path object   |           -           |
+| Attribute |  Type   | Default Value |                 Description                  |          Demo           |
+| :-------: | :-----: | :-----------: | :------------------------------------------: | :---------------------: |
+| disabled  | boolean |     false     |              disabled menu item              |            -            |
+|    key    | string  |      ''       |   key of the menu item. Need to be unique    |            -            |
+|   href    | string  |      ''       | Page to jump to after clicking the menu item | [Basic-Use](#Basic-Use) |
+|   route   | object  |       -       |            Vue Router path object            |            -            |
 
 ### d-sub-menu
 
-|   Attribute   |  Type   | Default Value  |      Description      |       Demo       |
-| :------: | :-----: | :---: | :------------: | :-------------------: |
-|  title   | String  |  ''   | sub-menu title   | [Basic-Use](#Basic-Use) |
-| disabled | boolean | false | disabled sub-menu |           -           |
+| Attribute |  Type   | Default Value |    Description    |          Demo           |
+| :-------: | :-----: | :-----------: | :---------------: | :---------------------: |
+|   title   | String  |      ''       |  sub-menu title   | [Basic-Use](#Basic-Use) |
+| disabled  | boolean |     false     | disabled sub-menu |            -            |
 
 ### d-menu-item slot
 
-| 插槽名 |         Description          |
-| :----: | :-------------------: |
+| 插槽名 |     Description     |
+| :----: | :-----------------: |
 |  icon  | used to define icon |
 
 ### d-sub-menu slot
 
-| 插槽名 |           Description            |
-| :----: | :-----------------------: |
+| 插槽名 |     Description     |
+| :----: | :-----------------: |
 |  icon  | used to define icon |
 
 ### menu type
diff --git a/packages/devui-vue/docs/en-US/components/modal/index.md b/packages/devui-vue/docs/en-US/components/modal/index.md
index 288d2de0b0..ec6c5cc21b 100644
--- a/packages/devui-vue/docs/en-US/components/modal/index.md
+++ b/packages/devui-vue/docs/en-US/components/modal/index.md
@@ -10,7 +10,9 @@ Modal dialog.
 
 ### Basic Usage
 
-:::demo `v-model` bidirectional binding, which controls whether Modal is displayed. `title` as parameter is to set modal title.
+`v-model` bidirectional binding, which controls whether Modal is displayed. `title` as parameter is to set modal title.
+
+:::demo
 
 ```vue
 <template>
@@ -47,7 +49,9 @@ export default defineComponent({
 
 ### Keep Last Closed Position
 
-:::demo `keep-last` can keep the last closed position when the current modal is opened again.
+`keep-last` can keep the last closed position when the current modal is opened again.
+
+:::demo
 
 ```vue
 <template>
@@ -84,7 +88,9 @@ export default defineComponent({
 
 ### Customize Title & Action Buttons
 
-:::demo `header` slot can customize Modal top area, subcomponent `d-modal-header` provides a default style for the top area, customized styles can be implemented by setting `style/class` in subcomponent. `footer` slot is the same.
+`header` slot can customize Modal top area, subcomponent `d-modal-header` provides a default style for the top area, customized styles can be implemented by setting `style/class` in subcomponent. `footer` slot is the same.
+
+:::demo
 
 ```vue
 <template>
@@ -134,7 +140,9 @@ export default defineComponent({
 
 ### Information Prompt
 
-:::demo Various types of information prompt modals.
+Various types of information prompt modals.
+
+:::demo
 
 ```vue
 <template>
@@ -176,7 +184,9 @@ export default defineComponent({
 
 ### Callback Before Closing
 
-:::demo `before-close` called when the user clicks the close button or mask layer, you can close them through the `done` parameter after completing some asynchronous operations.
+`before-close` called when the user clicks the close button or mask layer, you can close them through the `done` parameter after completing some asynchronous operations.
+
+:::demo
 
 ```vue
 <template>
diff --git a/packages/devui-vue/docs/en-US/components/read-tip/index.md b/packages/devui-vue/docs/en-US/components/read-tip/index.md
index 280654e5f4..dbeb5a080d 100644
--- a/packages/devui-vue/docs/en-US/components/read-tip/index.md
+++ b/packages/devui-vue/docs/en-US/components/read-tip/index.md
@@ -6,36 +6,36 @@ Reading notification component.
 
 When you need to prompt for specific content in the html document.
 
-
 ### Basic Usage
+
 Set selector to select the element to be displayed in the readtip, and transfer title and content to set the content to be displayed.
-:::demo 
+:::demo
 
 ```vue
 <template>
-  <d-read-tip :readTipOptions="readTipOptions" >
+  <d-read-tip :readTipOptions="readTipOptions">
     <h1>Let's see how to use ReadTip</h1>
     <p class="readtip-content">Set selector to display readtip</p>
     <p>The following is the target you want to show readtip</p>
     <span class="readtip-target">@Jack</span>
-  </d-read-tip >
+  </d-read-tip>
 </template>
 
 <script setup>
-const readTipOptions =  {
+const readTipOptions = {
+  trigger: 'hover',
+  rules: {
     trigger: 'hover',
-    rules: {
-      trigger: 'hover',
-      position:'top',
-      selector: '.readtip-target',
-      title: 'Name: Jack',
-      content: 'This is Jack\'s profile',
-    },
-  };
+    position: 'top',
+    selector: '.readtip-target',
+    title: 'Name: Jack',
+    content: "This is Jack's profile",
+  },
+};
 </script>
 
 <style>
-.source{
+.source {
   overflow: visible;
 }
 .readtip-container {
@@ -51,73 +51,72 @@ const readTipOptions =  {
 .readtip-target:hover {
   text-decoration: underline;
 }
-
 </style>
 ```
 
 :::
 
 ### Include Multiple Readtip
+
 Set the readtip display mode for different elements when multiple rules are transferred.
-:::demo 
+:::demo
 
 ```vue
 <template>
-  <d-read-tip :readTipOptions="readTipOptions" >
+  <d-read-tip :readTipOptions="readTipOptions">
     <h1>Multiple Readtips</h1>
     <h2 class="introduction">You can pass in multiple rules to display different readtips</h2>
     <p class="first-content">Click here to display first content</p>
     <p class="second-content">Click here to display second content</p>
     <h3 class="third-content">Hover here to display third content</h3>
     <h3 class="third-content">Hover here to display third content</h3>
-  </d-read-tip >
+  </d-read-tip>
 </template>
 
 <script setup>
-const readTipOptions =  {
-    trigger: 'click',
-    showAnimate: false,
-    mouseenterTime: 100,
-    mouseleaveTime: 100,
-    position: 'top',
-    overlayClassName: 'read-tip-container',
-    appendToBody: false,
-    rules: [
-      {
-        selector: '.first-content',
-        position: 'top',
-        title: 'This Is the First Title',
-        content: 'Lorem ipsum dolor sit amet, consectetur ad.',
-        overlayClassName:'red',
-      },
-      {
-        selector: '.second-content',
-        position: 'left',
-        title: 'This Is the Second Title',
-        content: 'Class aptent taciti sociosqu ad litora torquent per conubia nostra',
-        overlayClassName:'red',
-      },
-      {
-        trigger: 'hover',
-        selector: '.third-content',
-        position: 'bottom',
-        title: 'This Is the Third Title',
-        content: 'Aenean libero urna, scelerisque tincidunt',
-      }, 
-      {
-        trigger: 'hover',
-        selector: '.four-content',
-        position: 'right',
-        title: 'This Is the Third Title',
-        content: 'Aenean libero urna, scelerisque tincidunt',
-      },
-    ],
-  };
-
+const readTipOptions = {
+  trigger: 'click',
+  showAnimate: false,
+  mouseenterTime: 100,
+  mouseleaveTime: 100,
+  position: 'top',
+  overlayClassName: 'read-tip-container',
+  appendToBody: false,
+  rules: [
+    {
+      selector: '.first-content',
+      position: 'top',
+      title: 'This Is the First Title',
+      content: 'Lorem ipsum dolor sit amet, consectetur ad.',
+      overlayClassName: 'red',
+    },
+    {
+      selector: '.second-content',
+      position: 'left',
+      title: 'This Is the Second Title',
+      content: 'Class aptent taciti sociosqu ad litora torquent per conubia nostra',
+      overlayClassName: 'red',
+    },
+    {
+      trigger: 'hover',
+      selector: '.third-content',
+      position: 'bottom',
+      title: 'This Is the Third Title',
+      content: 'Aenean libero urna, scelerisque tincidunt',
+    },
+    {
+      trigger: 'hover',
+      selector: '.four-content',
+      position: 'right',
+      title: 'This Is the Third Title',
+      content: 'Aenean libero urna, scelerisque tincidunt',
+    },
+  ],
+};
 </script>
 
 <style>
-.source{
+.source {
   overflow: visible;
 }
 .readtip-container {
@@ -150,23 +149,21 @@ const readTipOptions =  {
 }
 
 .red {
-  color: red
+  color: red;
 }
 </style>
 ```
 
 :::
 
-
-
-
 ### Display Content with Template
+
 You can specify the content to be displayed by importing template. When importing template, you do not need to specify title and content.
-:::demo 
+:::demo
 
 ```vue
 <template>
-  <d-read-tip :readTipOptions="readTipOptions" >
+  <d-read-tip :readTipOptions="readTipOptions">
     <h1>You can also pass in template</h1>
     <p class="readtip-content">Write your own template</p>
     <p>The following is the target you want to show readtip</p>
@@ -177,42 +174,33 @@ You can specify the content to be displayed by importing template. When importin
         <template #cardAvatar>
           <d-avatar name="DevUI"></d-avatar>
         </template>
-        <template #cardTitle>
-          DEVUI Course
-        </template>
-        <template #cardSubtitle class="read-tip-demo-icon">
-          <d-icon name="company-member"></d-icon><span>DevUI</span>
-        </template>
+        <template #cardTitle> DEVUI Course </template>
+        <template #cardSubtitle class="read-tip-demo-icon"> <d-icon name="company-member"></d-icon><span>DevUI</span> </template>
         <template #cardContent>
-          DEVUI is a free open-source and common solution for the front end of enterprise mid- and back-end products. Its design values are basedon...
+          DEVUI is a free open-source and common solution for the front end of enterprise mid- and back-end products. Its design values are
+          basedon...
         </template>
         <template #cardActions>
-          <div class="card-block">
-            <d-icon name="like"></d-icon ><span>12</span>
-          </div>
-          <div class="card-block">
-            <d-icon name="star-o"></d-icon ><span>8</span>
-          </div>
-          <div class="card-block">
-            <d-icon name="message"></d-icon ><span>8</span>
-          </div>
+          <div class="card-block"><d-icon name="like"></d-icon><span>12</span></div>
+          <div class="card-block"><d-icon name="star-o"></d-icon><span>8</span></div>
+          <div class="card-block"><d-icon name="message"></d-icon><span>8</span></div>
         </template>
-      </d-card>  
+      </d-card>
     </template>
-  </d-read-tip >
+  </d-read-tip>
 </template>
 
 <script setup>
-const readTipOptions =  {
-    trigger: 'click',    
-    rules: {
-      trigger: 'click',
-      position:'top',
-      selector: '.readtip-target2',
-      title: 'Name: Jack',
-      content: 'This is Jack\'s profile',
-    },
-  };
+const readTipOptions = {
+  trigger: 'click',
+  rules: {
+    trigger: 'click',
+    position: 'top',
+    selector: '.readtip-target2',
+    title: 'Name: Jack',
+    content: "This is Jack's profile",
+  },
+};
 </script>
 
 <style lang="scss">
@@ -227,7 +215,7 @@ const readTipOptions =  {
 }
 .card-block {
   margin-right: 16px;
-  i{
+  i {
     cursor: pointer;
     font-size: 16px;
     margin-right: 8px;
@@ -239,11 +227,9 @@ const readTipOptions =  {
 }
 .d-card {
   cursor: pointer;
-  transition:
-    box-shadow .3s cubic-bezier(.645,.045,.355,1),
-    transform .3s cubic-bezier(.645,.045,.355,1);
+  transition: box-shadow 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
   &:hover {
-    box-shadow: 0 4px 16px 0 rgba(0,0,0,.1);
+    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.1);
     transform: translateY(-5px);
   }
 }
@@ -260,30 +246,31 @@ const readTipOptions =  {
 
 ### Get Data Asynchronous
 
-:::demo 
+:::demo
 
 ```vue
 <template>
-  <d-read-tip :readTipOptions="readTipOptions" >
+  <d-read-tip :readTipOptions="readTipOptions">
     <h1>You can pass data asynchronously</h1>
-  <p class="readtip-content">Using function fullElement to pass data</p>
-  <p>The following is the target you want to show readtip</p>
-  <h4 class="readtip-target">Display readtip</h4>
+    <p class="readtip-content">Using function fullElement to pass data</p>
+    <p>The following is the target you want to show readtip</p>
+    <h4 class="readtip-target">Display readtip</h4>
   </d-read-tip>
 </template>
 
 <script setup>
-const readTipOptions =   {
+const readTipOptions = {
+  trigger: 'click',
+  rules: {
+    selector: 'h4',
     trigger: 'click',
-    rules: { 
-      selector: 'h4',
-      trigger: 'click', 
-      dataFn: getDataFromDB,
-      key: 'GetData' },
-  };
-function getDataFromDB ({ element, rule }) {
-    return { content: element.innerHTML, title: rule.key }
-  }
+    dataFn: getDataFromDB,
+    key: 'GetData',
+  },
+};
+function getDataFromDB({ element, rule }) {
+  return { content: element.innerHTML, title: rule.key };
+}
 </script>
 
 <style>
@@ -301,7 +288,7 @@ function getDataFromDB ({ element, rule }) {
   text-decoration: underline;
 }
 .red {
-  color: red
+  color: red;
 }
 </style>
 ```
@@ -312,13 +299,11 @@ function getDataFromDB ({ element, rule }) {
 
 d-read-tip parameters
 
-| Parameter                 | Parameter               | Parameter | Parameter                            | Jump to Demo             | 	Global Config |
-| -------------------- | ------------------ | ---- | ------------------------------- | ---------------------- | ---------- |
-| readTipOptions       | ReadTipOptions     | --   | Required. Set readtip options.             | [Basic Usage](#basic-usage)               | --         |
-| readTipOptions.rules | ReadTipRules       | --   | 	Option. Set the content of readtip         |  [Include Multiple Readtip](#include-multiple-readtip) | --         |
-| contentTemplate      | `TemplateRef<any>` | --   | Options. Using template to customize content |  [Display Content with Template](#display-content-with-template)      | --         |
-
-
+| Parameter            | Parameter          | Parameter | Parameter                                    | Jump to Demo                                                    | Global Config |
+| -------------------- | ------------------ | --------- | -------------------------------------------- | --------------------------------------------------------------- | ------------- |
+| readTipOptions       | ReadTipOptions     | --        | Required. Set readtip options.               | [Basic Usage](#basic-usage)                                     | --            |
+| readTipOptions.rules | ReadTipRules       | --        | Option. Set the content of readtip           | [Include Multiple Readtip](#include-multiple-readtip)           | --            |
+| contentTemplate      | `TemplateRef<any>` | --        | Options. Using template to customize content | [Display Content with Template](#display-content-with-template) | --            |
 
 ```
 export interface ReadTipOptions {
@@ -352,4 +337,3 @@ export interface ReadTipRule {
   }) => Observable<{ title?: string; content?: string; template?: TemplateRef<any>; customData?: any }>;
 }
 ```
-
diff --git a/packages/devui-vue/docs/en-US/components/ripple/index.md b/packages/devui-vue/docs/en-US/components/ripple/index.md
index 8eef5af16e..23f697e0c5 100644
--- a/packages/devui-vue/docs/en-US/components/ripple/index.md
+++ b/packages/devui-vue/docs/en-US/components/ripple/index.md
@@ -4,14 +4,16 @@
 
 ### When to Use
 
-:::demo User can be use Basic ripple functionality can be enabled just by using v-ripple directive on a component or an HTML element <span color="#409EFF">`v-ripple`</span>Basic ripple functionality <span color="#409EFF">`v-ripple`</span> Directive `v-ripple` Accept an object
+User can be use Basic ripple functionality can be enabled just by using v-ripple directive on a component or an HTML element <span color="#409EFF">`v-ripple`</span>Basic ripple functionality <span color="#409EFF">`v-ripple`</span> Directive `v-ripple` Accept an object
+
+:::demo
 
 ```vue
 <template>
   <d-row :gutter="50">
     <d-col :span="12">
       <div class="ripple-button">
-        <div class="ripple-htmlElement" v-ripple="{ color: '#5e7ce0',duration: 300 }">HTML element with v-ripple</div>
+        <div class="ripple-htmlElement" v-ripple="{ color: '#5e7ce0', duration: 300 }">HTML element with v-ripple</div>
       </div>
     </d-col>
     <d-col :span="12">
@@ -47,7 +49,7 @@
             { color: '#67C23A', text: 'Item with Success ripple' },
             { color: '#E6A23C', text: 'Item with Warning ripple' },
             { color: '#F56C6C', text: 'Item with Danger ripple' },
-            { color: '#909399', text: 'Item with Info ripple' }
+            { color: '#909399', text: 'Item with Info ripple' },
           ]"
           :style="{ color: item.color }"
         >
@@ -65,14 +67,11 @@
             { color: '#67C23A', text: 'Item with Success ripple' },
             { color: '#E6A23C', text: 'Item with Warning ripple' },
             { color: '#F56C6C', text: 'Item with Danger ripple' },
-            { color: '#909399', text: 'Item with Info ripple' }
+            { color: '#909399', text: 'Item with Info ripple' },
           ]"
           :style="{ color: item.color }"
         >
-          <div
-            class="ripple-changeTextColor"
-            v-ripple="{ duration: 300, color: `${item.color.slice(0, 4)}` }"
-          >
+          <div class="ripple-changeTextColor" v-ripple="{ duration: 300, color: `${item.color.slice(0, 4)}` }">
             {{ item.text }}
           </div>
         </li>
@@ -84,7 +83,6 @@
 
 :::
 
-
 ### Ripple in components
 
 ### Some components provide the ripple prop that allows you to control the ripple effect.
@@ -102,7 +100,7 @@ Button Component
     <d-col :span="6">
       <d-button v-ripple="{ duration: 300 }" variant="text-dark" style="margin-right: 20px">Text dark</d-button>
     </d-col>
-        <d-col :span="6">
+    <d-col :span="6">
       <d-button v-ripple="{ duration: 300 }" icon="add" variant="text-dark" title="add"></d-button>
     </d-col>
     <d-col :span="6">
@@ -114,68 +112,58 @@ Button Component
 
 :::
 
-Card Component 
+Card Component
 
 :::demo
+
 ```vue
 <template>
   <d-card v-ripple="{ duration: 300 }" class="d-card" :src="'https://devui.design/components/assets/image1.png'">
     <template #cardAvatar>
       <d-avatar name="DevUI"></d-avatar>
     </template>
-    <template #cardTitle>
-      DEVUI Course
-    </template>
-    <template #cardSubtitle class="icon">
-      <d-icon name="company-member"></d-icon><span>DevUI</span>
-    </template>
+    <template #cardTitle> DEVUI Course </template>
+    <template #cardSubtitle class="icon"> <d-icon name="company-member"></d-icon><span>DevUI</span> </template>
     <template #cardContent>
-      DEVUI is a free open-source and common solution for the front end of enterprise mid- and back-end products. Its design values are basedon...
+      DEVUI is a free open-source and common solution for the front end of enterprise mid- and back-end products. Its design values are
+      basedon...
     </template>
     <template #cardActions>
-      <div class="card-block">
-        <d-icon name="like"></d-icon ><span>12</span>
-      </div>
-      <div class="card-block">
-        <d-icon name="star-o"></d-icon ><span>8</span>
-      </div>
-      <div class="card-block">
-        <d-icon name="message"></d-icon ><span>8</span>
-      </div>
+      <div class="card-block"><d-icon name="like"></d-icon><span>12</span></div>
+      <div class="card-block"><d-icon name="star-o"></d-icon><span>8</span></div>
+      <div class="card-block"><d-icon name="message"></d-icon><span>8</span></div>
     </template>
   </d-card>
 </template>
 <style lang="scss">
-  .card-block {
-    margin-right: 16px;
-    i{
-      cursor: pointer;
-      font-size: 16px;
-      vertical-align: middle;
-    }
-    i + span {
-      vertical-align: middle;
-    }
-  }
-  .d-card {
+.card-block {
+  margin-right: 16px;
+  i {
     cursor: pointer;
-    transition:
-      box-shadow .3s cubic-bezier(.645,.045,.355,1),
-      transform .3s cubic-bezier(.645,.045,.355,1);
-    &:hover {
-      box-shadow: 0 4px 16px 0 rgba(0,0,0,.1);
-      transform: translateY(-5px);
-    }
+    font-size: 16px;
+    vertical-align: middle;
   }
-  .card-container {
-    width: 350px;
+  i + span {
+    vertical-align: middle;
   }
-  img {
-    max-width: none;
-  }
-  .action-text {
-    color: #8a8e99;
+}
+.d-card {
+  cursor: pointer;
+  transition: box-shadow 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  &:hover {
+    box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.1);
+    transform: translateY(-5px);
   }
+}
+.card-container {
+  width: 350px;
+}
+img {
+  max-width: none;
+}
+.action-text {
+  color: #8a8e99;
+}
 </style>
 ```
 
@@ -200,12 +188,12 @@ Card Component
 
 ### API
 
-|      parameter       |   type    |    default     | introduce                                                                          |
-| :---: | :---: | :---: | :---: |
-|      color      | `string`  | `#00000050` | Choose Default current text color                                             |
-| initial-opacity | `number`  |    `0.1`    | Choose Initial interaction Opacity size                                       |
+|    parameter    |   type    |   default   |                                   introduce                                   |
+| :-------------: | :-------: | :---------: | :---------------------------------------------------------------------------: |
+|      color      | `string`  | `#00000050` |                       Choose Default current text color                       |
+| initial-opacity | `number`  |    `0.1`    |                    Choose Initial interaction Opacity size                    |
 |  final-opacity  | `number`  |    `0.1`    | Choose, end the interactive effect and press the Opacity size for a long time |
-|    duration     | `number`  |    `400`    | Choose, duration                                                              |
-|     easing      | `string`  | `ease-out`  | Choose, animation easing                                                      |
-|     delay       | `number`  |    `75`     | Choose, slow animation is delayed after debouceTime time.                     |
-|    disabled     | `boolean` |   `false`   | Choose, disabled ripple effect                                                |
+|    duration     | `number`  |    `400`    |                               Choose, duration                                |
+|     easing      | `string`  | `ease-out`  |                           Choose, animation easing                            |
+|      delay      | `number`  |    `75`     |           Choose, slow animation is delayed after debouceTime time.           |
+|    disabled     | `boolean` |   `false`   |                        Choose, disabled ripple effect                         |
diff --git a/packages/devui-vue/docs/en-US/components/search/index.md b/packages/devui-vue/docs/en-US/components/search/index.md
index 7adbdb009b..62d6f45107 100644
--- a/packages/devui-vue/docs/en-US/components/search/index.md
+++ b/packages/devui-vue/docs/en-US/components/search/index.md
@@ -8,7 +8,9 @@ When you need to search for required data in a dataset, you can enter the conten
 
 ### Basic Usage
 
-:::demo Use `sm`, `''`, `lg` to define the `Search` base type
+Use `sm`, `''`, `lg` to define the `Search` base type
+
+:::demo
 
 ```vue
 <template>
@@ -24,29 +26,32 @@ When you need to search for required data in a dataset, you can enter the conten
   </div>
 </template>
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
     const onSearch1 = (e) => {
-      console.log(e)
-    }
+      console.log(e);
+    };
     const onSearch2 = (e) => {
-      console.log(e)
-    }
+      console.log(e);
+    };
     return {
       onSearch1,
-      onSearch2
-    }
-  }
-})
+      onSearch2,
+    };
+  },
+});
 </script>
 ```
+
 :::
 
 ### Left Search Icon
 
-:::demo Use `left`, `right` to define `Search` icon position, default `right`
+Use `left`, `right` to define `Search` icon position, default `right`
+
+:::demo
 
 ```vue
 <template>
@@ -55,11 +60,14 @@ export default defineComponent({
   </div>
 </template>
 ```
+
 :::
 
 ### No Border
 
-:::demo Use `noBorder` to define `Search` without borders
+Use `noBorder` to define `Search` without borders
+
+:::demo
 
 ```vue
 <template>
@@ -68,33 +76,42 @@ export default defineComponent({
   </div>
 </template>
 ```
+
 :::
 
 ### VModel
 
-:::demo Use `v-model` two-way binding
+Use `v-model` two-way binding
 
-```vue
+:::demo
 
+```vue
 <template>
-  <d-search cssClass="ipt" v-model="searchText" placeholder="please enter" :maxLength="5" style="width: 200px" @onSearch="search"></d-search>
+  <d-search
+    cssClass="ipt"
+    v-model="searchText"
+    placeholder="please enter"
+    :maxLength="5"
+    style="width: 200px"
+    @onSearch="search"
+  ></d-search>
 </template>
 
 <script>
-import { defineComponent, ref } from 'vue'
+import { defineComponent, ref } from 'vue';
 
 export default defineComponent({
   setup() {
-    const searchText = ref('Devui')
+    const searchText = ref('Devui');
     const search = (e) => {
-      console.log(`search callback: ${e}，value：${searchText.value}`)
-    }
+      console.log(`search callback: ${e}，value：${searchText.value}`);
+    };
     return {
       searchText,
-      search
-    }
+      search,
+    };
   },
-})
+});
 </script>
 ```
 
@@ -102,24 +119,24 @@ export default defineComponent({
 
 ### API
 
-|  Parameter  |   Type   |   Default    | Description        | Jump to Demo             | Global Config |
-| :---------: | :------: | :-------: | :----------------------- | --------------------------------- | --------- |
-|    size     | `'sm'\|''\|'lg'` |    ''     | Optional. Specifies the size of the search box. The options are lg, '', and sm. | [Basic Usage](#basic-usage)             ||
-|    placeholder     | `string` |  --   | Optional. This parameter specifies the placeholder in the input box. | [Left Search Icon](#left-search-icon)             ||
-|    maxLength     | `number` |  --   | Optional. Max-length of the text box. |  [VModel](#vmodel)  ||
-|    delay     | `number` |  300   | Optional. Delay of debounceTime.  |  [Basic Usage](#basic-usage)  ||
-|    disabled    | `boolean` | false | Optional. Indicating whether the text box is available. | [Basic Usage](#basic-usage)             ||
-|    autoFocus    | `boolean` | false | Optional. Whether to enable autofocus for the text box. | [Basic Usage](#basic-usage)             ||
-| isKeyupSearch | `boolean` |  false   | Optional. Indicates whether to support immediate searchFn after input. | [Basic Usage](#basic-usage) ||
-| iconPosition | `string` |  'right'   | Optional. The options are'left' and'right'. | [Left Search Icon](#left-search-icon) ||
-| noBorder | `boolean` |  false  | Optional. Specifies whether to display the border. | [No Border](#no-border) ||
-| cssClass | `string` |  ''  | Optional. The class name can be transferred to the text box. | [VModel](#vmodel) ||
+|   Parameter   |       Type       | Default | Description                                                                     | Jump to Demo                          | Global Config |
+| :-----------: | :--------------: | :-----: | :------------------------------------------------------------------------------ | ------------------------------------- | ------------- |
+|     size      | `'sm'\|''\|'lg'` |   ''    | Optional. Specifies the size of the search box. The options are lg, '', and sm. | [Basic Usage](#basic-usage)           |               |
+|  placeholder  |     `string`     |   --    | Optional. This parameter specifies the placeholder in the input box.            | [Left Search Icon](#left-search-icon) |               |
+|   maxLength   |     `number`     |   --    | Optional. Max-length of the text box.                                           | [VModel](#vmodel)                     |               |
+|     delay     |     `number`     |   300   | Optional. Delay of debounceTime.                                                | [Basic Usage](#basic-usage)           |               |
+|   disabled    |    `boolean`     |  false  | Optional. Indicating whether the text box is available.                         | [Basic Usage](#basic-usage)           |               |
+|   autoFocus   |    `boolean`     |  false  | Optional. Whether to enable autofocus for the text box.                         | [Basic Usage](#basic-usage)           |               |
+| isKeyupSearch |    `boolean`     |  false  | Optional. Indicates whether to support immediate searchFn after input.          | [Basic Usage](#basic-usage)           |               |
+| iconPosition  |     `string`     | 'right' | Optional. The options are'left' and'right'.                                     | [Left Search Icon](#left-search-icon) |               |
+|   noBorder    |    `boolean`     |  false  | Optional. Specifies whether to display the border.                              | [No Border](#no-border)               |               |
+|   cssClass    |     `string`     |   ''    | Optional. The class name can be transferred to the text box.                    | [VModel](#vmodel)                     |               |
 
 ### d-search event
 
-|    Event    |   Type  | Description            | Jump to Demo |
-| :---------: | :------: | :--------------------: | :---------: |
-| onSearch |	`string` | Callback function triggered by pressing Enter or clicking the search button to return the value entered in the text box. |	[Basic Usage](#basic-usage) |
+|  Event   |   Type   |                                                       Description                                                        |        Jump to Demo         |
+| :------: | :------: | :----------------------------------------------------------------------------------------------------------------------: | :-------------------------: |
+| onSearch | `string` | Callback function triggered by pressing Enter or clicking the search button to return the value entered in the text box. | [Basic Usage](#basic-usage) |
 
 <style>
 .devui-search-demo h4 {
diff --git a/packages/devui-vue/docs/en-US/components/tag/index.md b/packages/devui-vue/docs/en-US/components/tag/index.md
index 330c32aa49..1c01f97ec3 100644
--- a/packages/devui-vue/docs/en-US/components/tag/index.md
+++ b/packages/devui-vue/docs/en-US/components/tag/index.md
@@ -8,7 +8,9 @@ When multiple tags need to be displayed
 
 ### Basic
 
-:::demo Defines the label style by using the `type` attribute or `color` attribute.
+Defines the label style by using the `type` attribute or `color` attribute.
+
+:::demo
 
 ```vue
 <template>
@@ -51,7 +53,9 @@ export default defineComponent({
 
 ### Custom
 
-:::demo Use the default slot to customize your tag.
+Use the default slot to customize your tag.
+
+:::demo
 
 ```vue
 <template>
@@ -82,7 +86,9 @@ export default defineComponent({
 
 ### Can be selected
 
-:::demo The `checked` attribute is used to set the checked status of the tag, and the `checked` value can be changed by clicking.
+The `checked` attribute is used to set the checked status of the tag, and the `checked` value can be changed by clicking.
+
+:::demo
 
 ```vue
 <template>
@@ -112,7 +118,9 @@ export default defineComponent({
 
 ### Deletable
 
-:::demo The `deletable` attribute is used to set whether the tag can be deleted
+The `deletable` attribute is used to set whether the tag can be deleted
+
+:::demo
 
 ```vue
 <template>
@@ -146,13 +154,13 @@ export default defineComponent({
 
 #### Props
 
-|     参数     |   类型    |  默认值   |                                         说明                                         |              可选值              |             跳转至 Demo             |
-| :----------: | :-------: | :-------: | :----------------------------------------------------------------------------------: | :------------------------------: | :---------------------------------: |
-|     type     | `string`  | 'defalut' | Optional. Type of the a tag, color does not take effect after the type is specified. | `success\|info\|warning\|danger` |           [Basic](#basic)           |
-|    color     | `string`  |    ''     |                         Optional. Theme color of the a tag.                          |                -                 |           [Basic](#basic)           |
+|     参数      |   类型    |  默认值   |                                         说明                                         |              可选值              |             跳转至 Demo             |
+| :-----------: | :-------: | :-------: | :----------------------------------------------------------------------------------: | :------------------------------: | :---------------------------------: |
+|     type      | `string`  | 'defalut' | Optional. Type of the a tag, color does not take effect after the type is specified. | `success\|info\|warning\|danger` |           [Basic](#basic)           |
+|     color     | `string`  |    ''     |                         Optional. Theme color of the a tag.                          |                -                 |           [Basic](#basic)           |
 | title-content | `string`  |    ''     |            Optional. Sets the title displayed when the cursor is hovered.            |                -                 |           [Basic](#basic)           |
-|   checked    | `boolean` |   false   |                     Optional. Initial status of a tag. selected.                     |          `true\|false`           | [Can be selected](#can-be-selected) |
-|  deletable   | `boolean` |   false   |                  Optional. Specifies whether a tag can be deleted.                   |          `true\|false`           |       [Deletable](#deletable)       |
+|    checked    | `boolean` |   false   |                     Optional. Initial status of a tag. selected.                     |          `true\|false`           | [Can be selected](#can-be-selected) |
+|   deletable   | `boolean` |   false   |                  Optional. Specifies whether a tag can be deleted.                   |          `true\|false`           |       [Deletable](#deletable)       |
 
 #### Event
 

From af2257b6fdd828e03821283e261548613dd07f69 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sat, 6 Jul 2024 19:47:50 +0800
Subject: [PATCH 29/30] fix(docs): fix `menu.md` in build process

---
 .../docs/en-US/components/menu/index.md       | 136 +++++++++++-------
 1 file changed, 88 insertions(+), 48 deletions(-)

diff --git a/packages/devui-vue/docs/en-US/components/menu/index.md b/packages/devui-vue/docs/en-US/components/menu/index.md
index 6eeca666db..a7c5547142 100644
--- a/packages/devui-vue/docs/en-US/components/menu/index.md
+++ b/packages/devui-vue/docs/en-US/components/menu/index.md
@@ -34,9 +34,17 @@ If the screen size is too small, an ellipsis appears.
   <d-slider :min="0" :max="480" v-model="width"></d-slider>
 </template>
 
-<script setup lang="ts">
-import { ref } from 'vue';
-let width = ref(480);
+<script>
+import { defineComponent, ref } from 'vue';
+
+export default defineComponent({
+  setup() {
+    const width = ref(480);
+    return {
+      width,
+    };
+  },
+});
 </script>
 ```
 
@@ -133,43 +141,53 @@ You can modify the expanded submenu items by setting 'open keys'
 :::demo
 
 ```vue
-<d-button @click="changeCollapsed">
-  Collapsed
-</d-button>
 <template>
-  <d-menu :collapsed-indent="48" mode="vertical" width="256px" :default-select-keys="['item1']" :collapsed="collapsed">
-    <d-menu-item key="item1" :disabled="isDisabled">
-      <template #icon>
-        <i class="icon-homepage"></i>
-      </template>
-      <span>Home</span>
-    </d-menu-item>
-    <d-sub-menu title="System" key="system">
-      <template #icon>
-        <i class="icon-system"></i>
-      </template>
-      <d-menu-item key="system-item">
-        <span>System item</span>
+  <d-button @click="changeCollapsed"> Collapsed </d-button>
+  <template>
+    <d-menu :collapsed-indent="48" mode="vertical" width="256px" :default-select-keys="['item1']" :collapsed="collapsed">
+      <d-menu-item key="item1" :disabled="isDisabled">
+        <template #icon>
+          <i class="icon-homepage"></i>
+        </template>
+        <span>Home</span>
       </d-menu-item>
-      <d-sub-menu title="Setting" key="setting">
+      <d-sub-menu title="System" key="system">
         <template #icon>
-          <i class="icon-setting"></i>
+          <i class="icon-system"></i>
         </template>
-        <d-menu-item key="setting-item">
-          <span>Setting item</span>
+        <d-menu-item key="system-item">
+          <span>System item</span>
         </d-menu-item>
+        <d-sub-menu title="Setting" key="setting">
+          <template #icon>
+            <i class="icon-setting"></i>
+          </template>
+          <d-menu-item key="setting-item">
+            <span>Setting item</span>
+          </d-menu-item>
+        </d-sub-menu>
       </d-sub-menu>
-    </d-sub-menu>
-  </d-menu>
+    </d-menu>
+  </template>
 </template>
 
-<script lang="ts" setup>
-import { ref } from 'vue';
-let collapsed = ref(false);
-const isDisabled = ref(true);
-const changeCollapsed = () => {
-  collapsed.value = !collapsed.value;
-};
+<script>
+import { defineComponent, ref } from 'vue';
+
+export default defineComponent({
+  setup() {
+    let collapsed = ref(false);
+    const isDisabled = ref(true);
+    const changeCollapsed = () => {
+      collapsed.value = !collapsed.value;
+    };
+    return {
+      collapsed,
+      isDisabled,
+      changeCollapsed,
+    };
+  },
+});
 </script>
 ```
 
@@ -340,15 +358,37 @@ eg. `width`, `open-keys`, `default-select-keys`
   <d-slider :min="0" :max="480" v-model="width"></d-slider>
 </template>
 
-<script lang="ts" setup>
-import { ref } from 'vue';
-let collapsed = ref(false);
-let isDisabled = ref(false);
-let width = ref(256);
-const changeDisabled = () => {
-  isDisabled.value = !isDisabled.value;
-  console.log(isDisabled.value);
-};
+<script>
+import { defineComponent, ref } from 'vue';
+
+export default defineComponent({
+  setup() {
+    let collapsed = ref(false);
+    let isDisabled = ref(false);
+    let selectKeys = ref([]);
+    let width = ref(256);
+    const changeDisabled = () => {
+      isDisabled.value = !isDisabled.value;
+      console.log(isDisabled.value);
+    };
+    const addSelect = () => {
+      if (selectKeys.value.includes('system-item')) {
+        selectKeys.value.pop();
+      } else {
+        selectKeys.value.push('system-item');
+      }
+      console.log(selectKeys.value);
+    };
+    return {
+      collapsed,
+      isDisabled,
+      selectKeys,
+      width,
+      changeDisabled,
+      addSelect,
+    };
+  },
+});
 </script>
 ```
 
@@ -358,10 +398,10 @@ const changeDisabled = () => {
 
 | Attribute           | Type                  | Default Value | Description                                                                                                                           | Demo                                          |
 | ------------------- | --------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------- |
-| width               | String                | ''            | Used to control menu width                                                                                                            | [Reactivity-Attribute](#Reactivity-Attribute) |
-| collapsed           | Boolean               | false         | Used to decide whether to collapse the menu                                                                                           | [Collapsed](#Collapsed)                       |
-| collapsed-indent    | Number                | 24            | The distance between the starting icon and the left and right borders                                                                 | [Collapsed](#Collapsed)                       |
-| multiple            | Boolean               | false         | Can I select more than one                                                                                                            | [Deselect](#Deselect)                         |
+| width               | String                | ''            | Used to control menu width                                                                                                            | [Reactivity-Attribute](#reactivity-attribute) |
+| collapsed           | Boolean               | false         | Used to decide whether to collapse the menu                                                                                           | [Collapsed](#collapsed)                       |
+| collapsed-indent    | Number                | 24            | The distance between the starting icon and the left and right borders                                                                 | [Collapsed](#collapsed)                       |
+| multiple            | Boolean               | false         | Can I select more than one                                                                                                            | [Deselect](#deselect)                         |
 | mode                | [menuMode](#menumode) | 'vertical'    | menu type                                                                                                                             | [Basic-Use](#Basic-Use)                       |
 | open-keys           | Array                 | []            | default open key of menu item                                                                                                         | [默认展开](#默认展开)                         |
 | default-select-keys | Array                 | []            | default select key of menu item item                                                                                                  | [Basic-Use](#Basic-Use)                       |
@@ -371,9 +411,9 @@ const changeDisabled = () => {
 
 | Event          | Type                                                                                | Description                                                                                              | Demo                  |
 | -------------- | ----------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------- | --------------------- |
-| select         | `(e: {type: 'select', key: string, el: HTMLElement, e: PointerEvent})=>void`        | if select will trigger this event. if is disabled will not trigger                                       | [Deselect](#Deselect) |
-| deselect       | `(e: {type: 'deselect', key: string, el: HTMLElement, e: PointerEvent})=>void`      | This event will be triggered when deselecting. If the menu is not multi select, it will not be triggered | [Deselect](#Deselect) |
-| submenu-change | `(e: {type: 'submenu-change', state: boolean, key: string, el: HTMLElement})=>void` | Triggered when the submenu state is changed                                                              | [Deselect](#Deselect) |
+| select         | `(e: {type: 'select', key: string, el: HTMLElement, e: PointerEvent})=>void`        | if select will trigger this event. if is disabled will not trigger                                       | [Deselect](#deselect) |
+| deselect       | `(e: {type: 'deselect', key: string, el: HTMLElement, e: PointerEvent})=>void`      | This event will be triggered when deselecting. If the menu is not multi select, it will not be triggered | [Deselect](#deselect) |
+| submenu-change | `(e: {type: 'submenu-change', state: boolean, key: string, el: HTMLElement})=>void` | Triggered when the submenu state is changed                                                              | [Deselect](#deselect) |
 
 ### d-menu-item
 

From 9e672679d3c15b5709d9a5bfe633f8d8c2f7927f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Sat, 6 Jul 2024 19:58:41 +0800
Subject: [PATCH 30/30] perf(docs): fix code block padding

---
 .../devui-vue/docs/.vitepress/devui-theme/styles/code.scss   | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/styles/code.scss b/packages/devui-vue/docs/.vitepress/devui-theme/styles/code.scss
index b8978b2ac8..317936adc8 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/styles/code.scss
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/styles/code.scss
@@ -297,7 +297,8 @@ div[class~='language-vue']::before {
   color: green;
 }
 
-// Remove default language marker
-.lang {
+// Remove default language marker and copy button
+.lang,
+.copy {
   display: none;
 }